@extends('tenant_frontend.layout')
@section('pageHeading')
    {{ __('Home') }}
@endsection

@section('metaKeywords')
    @if (!empty($seoInfo))
        {{ $seoInfo->meta_keyword_home }}
    @endif
@endsection

@section('metaDescription')
    @if (!empty($seoInfo))
        {{ $seoInfo->meta_description_home }}
    @endif
@endsection

@section('content')
    <section class="home-banner home-banner-1">
        <img class="lazyload bg-img"
            src="{{ !empty($heroImg) ? asset(\App\Constants\Constant::WEBSITE_SLIDER_IMAGE . '/' . $heroImg) : asset('assets/tenant-front/images/default/banner.jpg') }}">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-xxl-10">
                    <div class="content mb-40" data-aos="fade-up">
                        <h1 class="title">{{ $heroStatic?->title ?? 'Movemos personas. Impulsamos historias' }}</h1>
                        <p class="text">
                            {{ $heroStatic?->text }}
                        </p>
                    </div>
                    <div class="banner-filter-form" data-aos="fade-up">
    <ul class="nav nav-tabs">
        <li class="nav-item">
            <button class="nav-link active" data-bs-toggle="tab" data-bs-target="#rent"
                type="button">{{ ($keywords['Usado'] ?? __('Usado')) }}</button>
        </li>
        <li class="nav-item">
            <button class="nav-link" data-bs-toggle="tab" data-bs-target="#sale"
                type="button">{{ ($keywords['Nuevo'] ?? __('Nuevo')) }}</button>
        </li>
    </ul>
    <div class="tab-content form-wrapper">
        <input type="hidden" value="{{ $min }}" id="min">
        <input type="hidden" value="{{ $max }}" id="max">

        <input type="hidden" id="currency_symbol" value="{{ $basicInfo->base_currency_symbol }}">
        <input class="form-control" type="hidden" value="{{ $min }}" id="o_min">
        <input class="form-control" type="hidden" value="{{ $max }}" id="o_max">

        <div class="tab-pane fade active show" id="rent">
            <form action="{{ route('frontend.properties', getParam()) }}" method="get">
                <input type="hidden" name="purpose" value="rent">
                <input type="hidden" name="min" value="{{ $min }}" id="min1">
                <input type="hidden" name="max" value="{{ $max }}" id="max1">
                <div class="grid">
                    <div class="grid-item">
                        <div class="form-group">
                            <label for="category">{{ ($keywords['Tipo de Vehículo'] ?? __('Tipo de Vehículo')) }}</label>
                            <select class="form-control select2 category_id" id="category" name="category_id">
                                <option value="">{{ ($keywords['Tipo de Vehículo'] ?? __('Tipo de Vehículo') ) }}</option>
                                @foreach($vehicleTypes as $type)
                                    <option value="{{ $type->id }}">{{ $type->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="grid-item">
                        <div class="form-group">
                            <label for="brand_id">{{ ($keywords['Marca'] ?? __('Marca')) }}</label>
                            <select name="brand_id" class="form-control select2 brand_id" id="brand_id">
                                <option value="">{{ ($keywords['Marca'] ?? __('Marca')) }}</option>
                                @foreach($brands as $brand)
                                    <option value="{{ $brand->id }}">{{ $brand->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="grid-item">
                        <div class="form-group">
                            <label for="model_id">{{ ($keywords['Modelo'] ?? __('Modelo')) }}</label>
                            <select name="model_id" class="form-control select2 model_id" id="model_id">
                                <option value="">{{ ($keywords['Modelo'] ?? __('Modelo')) }}</option>
                            </select>
                        </div>
                    </div>

                    <div class="grid-item city">
                        <div class="form-group">
                            <label for="city">{{ ($keywords['Ubicación'] ?? __('Ubicación')) }}</label>
                            <select name="city_id" class="form-control select2 city_id" id="city">
                                <option selected disabled value="">{{ ($keywords['Ubicación'] ?? __('Ubicación')) }}</option>
                                <option value="all">{{ ($keywords['Todas'] ?? __('Todas')) }}</option>
                                @foreach ($locations as $location)
                                    <option value="{{ $location->id }}">{{ $location->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="grid-item">
                        <label class="price-value">{{ ($keywords['Precio'] ?? __('Precio')) . ':' }}
                            <br>
                            <span data-range-value="filterPriceSliderValue">{{ $min }}
                                -
                                {{ $max }}</span>
                        </label>
                        <div data-range-slider="filterPriceSlider"></div>
                    </div>
                    <div class="grid-item">
                        <button type="submit"
                            class="btn btn-lg btn-primary bg-secondary icon-start w-100">
                            {{ $keywords['Buscar'] ?? __('Buscar') }}
                        </button>
                    </div>
                </div>
            </form>
        </div>

        <div class="tab-pane fade" id="sale">
            <form action="{{ route('frontend.properties', getParam()) }}" method="get">
                <input type="hidden" name="purpose" value="sale">
                <input type="hidden" name="min" value="{{ $min }}" id="min2">
                <input type="hidden" name="max" value="{{ $max }}" id="max2">
                <div class="grid">
                    <div class="grid-item">
                        <div class="form-group">
                            <label for="category1">{{ ($keywords['Tipo de Vehículo'] ?? __('Tipo de Vehículo')) }}</label>
                            <select class="form-control select2 category_id" id="category1" name="category_id">
                                <option value="">{{ ($keywords['Tipo de Vehículo'] ?? __('Tipo de Vehículo')) }}</option>
                                @foreach($vehicleTypes as $type)
                                    <option value="{{ $type->id }}">{{ $type->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="grid-item">
                        <div class="form-group">
                            <label for="brand_id1">{{ ($keywords['Marca'] ?? __('Marca')) }}</label>
                            <select name="brand_id" class="form-control select2 brand_id" id="brand_id1">
                                <option value="">{{ ($keywords['Marca'] ?? __('Marca')) }}</option>
                                @foreach($brands as $brand)
                                    <option value="{{ $brand->id }}">{{ $brand->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="grid-item">
                        <div class="form-group">
                            <label for="model_id1">{{ ($keywords['Modelo'] ?? __('Modelo')) }}</label>
                            <select name="model_id" class="form-control select2 model_id" id="model_id1">
                                <option value="">{{ ($keywords['Modelo'] ?? __('Modelo')) }}</option>
                            </select>
                        </div>
                    </div>

                    <div class="grid-item city">
                        <div class="form-group">
                            <label for="city1">{{ ($keywords['Ubicación'] ?? __('Ubicación')) }}</label>
                            <select name="city_id" class="form-control select2 city_id" id="city1">
                                <option selected disabled value="">{{ ($keywords['Ubicación'] ?? __('Ubicación')) }}</option>
                                <option value="all">{{ ($keywords['Todas'] ?? __('Todas')) }}</option>
                                @foreach ($locations as $location)
                                    <option value="{{ $location->id }}">{{ $location->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="grid-item">
                        <label class="price-value">{{ ($keywords['Precio'] ?? __('Precio')) . ':' }}
                            <br>
                            <span data-range-value="filterPriceSlider2Value">{{ $min }}
                                -
                                {{ $max }}</span>
                        </label>
                        <div data-range-slider="filterPriceSlider2"></div>
                    </div>
                    <div class="grid-item">
                        <button type="submit"
                            class="btn btn-lg btn-primary bg-secondary icon-start w-100">
                            {{ $keywords['Buscar'] ?? __('Buscar') }}
                        </button>
                    </div>
                </div>
            </form>
        </div>

    </div>
</div>
                </div>
            </div>
        </div>
    </section>
    @if (count($after_hero) > 0)
        @foreach ($after_hero as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->counter_section_status == 1)
        <x-tenant.frontend.sections.counter :$counters />
    @endif

    @if (count($after_counter) > 0)
        @foreach ($after_counter as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if (!empty(showAd(3)))
        <div class="text-center mb-40">
            {!! showAd(3) !!}
        </div>
    @endif

    @if ($secInfo->featured_properties_section_status == 1)
        <section class="product-area featured-product pb-70">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="section-title title-inline mb-40" data-aos="fade-up">
                            <h2 class="title">{{ $featuredSecInfo?->featured_property_section_title }}</h2>
                        </div>
                    </div>
                    <div class="col-12" data-aos="fade-up">
                        <div class="swiper product-slider">
                            <div class="swiper-wrapper">
                                @forelse ($featured_properties as $property)
                                    <div class="swiper-slide">
                                        <x-tenant.frontend.property :adminLang="$adminLang" :property="$property" />
                                    </div>
                                @empty
                                    <div class=" p-3 text-center mb-30 w-100">
                                        <h3 class="mb-0">
                                            {{ $keywords['No se encontraron autos destacados'] ?? __('No se encontraron autos destacados') }}
                                        </h3>
                                    </div>
                                @endforelse
                            </div>
                            <div class="swiper-pagination position-static mb-30" id="product-slider-pagination"></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    @endif

    @if (count($after_featured_properties) > 0)
        @foreach ($after_featured_properties as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->about_section_status == 1)
        <x-tenant.frontend.sections.about :$aboutInfo :$aboutImg />
    @endif

    @if (count($after_about) > 0)
        @foreach ($after_about as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->property_section_status == 1)
        <section class="product-area popular-product product-1 pb-70">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="section-title title-inline mb-40" data-aos="fade-up">
                            <h2 class="title">{{ $propertySecInfo?->property_section_title }}</h2>
                            @if ($properties && $properties->isNotEmpty())
                                <div class="tabs-navigation">
                                    <ul class="nav nav-tabs">
                                        <li class="nav-item">
                                            <button class="nav-link active btn-md" data-bs-toggle="tab"
                                                data-bs-target="#forAll"
                                                type="button">{{ $keywords['Todos los Autos'] ?? __('Todos los Autos') }}</button>
                                        </li>
                                        <li class="nav-item">
                                            <button class="nav-link btn-md" data-bs-toggle="tab"
                                                data-bs-target="#forRent"
                                                type="button">{{ $keywords['Usado'] ?? __('Usado') }}</button>
                                        </li>
                                        <li class="nav-item">
                                            <button class="nav-link btn-md" data-bs-toggle="tab"
                                                data-bs-target="#forSell"
                                                type="button">{{ $keywords['Nuevo'] ?? __('Nuevo') }}</button>
                                        </li>
                                    </ul>
                                </div>
                            @endif
                        </div>
                    </div>
                    <div class="col-12">
                        <div class="tab-content" data-aos="fade-up">
                            <div class="tab-pane fade show active" id="forAll">
                                <div class="row">
                                    @forelse ($properties as $property)
                                        <x-tenant.frontend.property :adminLang="$adminLang" :property="$property"
                                            class="col-lg-4 col-xxl-3 col-md-6" />
                                    @empty
                                        <div class="p-3 text-center mb-30">
                                            <h3 class="mb-0">
                                                {{ $keywords['No se encontraron autos'] ?? __('No se encontraron autos') }}</h3>
                                        </div>
                                    @endforelse
                                </div>
                            </div>
                            <div class="tab-pane fade" id="forRent">
                                <div class="row">
                                    @forelse ($properties as $property)
                                        @if ($property->purpose == 'rent')
                                            <x-tenant.frontend.property :adminLang="$adminLang" :property="$property"
                                                class="col-lg-4 col-xxl-3 col-md-6" />
                                        @endif
                                    @empty
                                        <div class="p-3 text-center mb-30">
                                            <h3 class="mb-0">
                                                {{ $keywords['No se encontraron autos'] ?? __('No se encontraron autos') }}</h3>
                                        </div>
                                    @endforelse
                                </div>
                            </div>
                            <div class="tab-pane fade" id="forSell">
                                <div class="row">
                                    @forelse ($properties as $property)
                                        @if ($property->purpose == 'sale')
                                            <x-tenant.frontend.property :adminLang="$adminLang" :property="$property"
                                                class="col-lg-4 col-xxl-3 col-md-6" />
                                        @endif
                                    @empty
                                        <div class="p-3 text-center mb-30">
                                            <h3 class="mb-0">
                                                {{ $keywords['No se encontraron autos'] ?? __('No se encontraron autos') }}</h3>
                                        </div>
                                    @endforelse
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    @endif
    @if (!empty(showAd(3)))
        <div class="text-center mb-40">
            {!! showAd(3) !!}
        </div>
    @endif
    @if (count($after_property) > 0)
        @foreach ($after_property as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->why_choose_us_section_status == 1)
        <x-tenant.frontend.sections.why-choose-us :$whyChooseUsInfo :$whyChooseUsImg />
    @endif

    @if (count($after_why_choose_us) > 0)
        @foreach ($after_why_choose_us as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->agent_section_status == 1)
        <x-tenant.frontend.sections.agent :$agents :$agentInfo />
    @endif

    @if (count($after_agent) > 0)
        @foreach ($after_agent as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->cities_section_status == 1)
        <x-tenant.frontend.sections.city :$cities :$citySecInfo :$cityBgImg />
    @endif
    @if (!empty(showAd(3)))
        <div class="text-center mt-40">
            {!! showAd(3) !!}
        </div>
    @endif
    @if (count($after_cities) > 0)
        @foreach ($after_cities as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->testimonial_section_status == 1)
        <x-tenant.frontend.sections.testimonial :$testimonialSecInfo :$testimonials :$testimonialSecImage />
    @endif
    @if (count($after_testimonial) > 0)
        @foreach ($after_testimonial as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if ($secInfo->newsletter_section_status == 1)
        <section class="newsletter-area pb-100" data-aos="fade-up">
            <div class="container">
                <div class="newsletter-inner px-4">
                    <img class="lazyload bg-img"
                        src="{{ asset(\App\Constants\Constant::WEBSITE_NEWSLETTER_IMAGE . '/' . $newsletterBgImg) }}">
                    <div class="row justify-content-center text-center" data-aos="fade-up">
                        <div class="col-lg-6 col-xxl-5">
                            <div class="content mb-30">
                                <span class="subtitle color-white mb-10 d-block">{{ $newsletterSecInfo?->title }}</span>
                                <h2 class="color-white">{{ $newsletterSecInfo?->subtitle }}</h2>
                            </div>
                            <form id="newsletterForm" class="subscription-form newsletter-form"
                                action="{{ route('frontend.store_subscriber', getParam()) }}" method="POST">
                                @csrf
                                <div class="input-group radius-md">
                                    <input class="form-control"
                                        placeholder="{{ $keywords['Ingresá tu Email'] ?? __('Ingresá tu Email') }}"
                                        type="email" name="email" required>

                                    <button class="btn btn-lg btn-primary" type="submit">
                                        {{ $newsletterSecInfo?->btn_name ?? $keywords['Suscribirme'] ?? __('Suscribirme') }}</button>
                                </div>
                                @error('email')
                                    <p class="text-danger text-left">{{ $message }}</p>
                                @enderror
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    @endif

    @if (count($after_newsletter) > 0)
        @foreach ($after_newsletter as $customAbout)
            @if (isset($homecusSec[$customAbout->id]))
                @if ($homecusSec[$customAbout->id] == 1)
                    <x-tenant.frontend.sections.additional :sectionId="$customAbout->id" />
                @endif
            @endif
        @endforeach
    @endif

    @if (!empty(showAd(3)))
        <div class="text-center mb-40">
            {!! showAd(3) !!}
        </div>
    @endif

    <!-- JavaScript AJAX script attached below at layout structural exit border -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
    $(document).ready(function () {
        $('#brand_id,#brand_id1').on('change', function () {
            let brandId = $(this).val();
            let modelSelect = $(this).attr('id') == 'brand_id'
                ? $('#model_id')
                : $('#model_id1');

            modelSelect.html('<option value="">Modelo</option>');

            if (!brandId) {
                return;
            }

            $.get("{{ route('frontend.get_car_models', getParam()) }}", {
                brand_id: brandId
            }, function (models) {
                $.each(models, function (i, model) {
                    modelSelect.append(
                        '<option value="' + model.id + '">' + model.name + '</option>'
                    );
                });
            });
        });
    });
    </script>
@endsection