@extends('user.layout')

@section('content')
<div class="page-header">
    <h4 class="page-title">{{ __('Edit Vehicle Request') }}</h4>
</div>

<form action="{{ route('user.vehicle_requests.update', $vehicleRequest->id) }}" method="POST">
    @csrf

    <div class="card">
        <div class="card-header">
            <div class="card-title">{{ __('Request Filters') }}</div>
        </div>

        <div class="card-body">
            <div class="row">

                {{-- Car Type --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Car Type') }}</label>
                        <select name="car_type" class="form-control">
                            <option value="">{{ __('Select') }}</option>
                            <option value="car" {{ old('car_type', $vehicleRequest->car_type) == 'car' ? 'selected' : '' }}>Car</option>
                            <option value="truck" {{ old('car_type', $vehicleRequest->car_type) == 'truck' ? 'selected' : '' }}>Truck</option>
                        </select>
                    </div>
                </div>

                {{-- Brand --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Brand') }}</label>
                        <select name="brand_id" id="brand_id" class="form-control">
                            <option value="">{{ __('Select Brand') }}</option>
                            @foreach ($brands as $brand)
                                <option value="{{ $brand->id }}" {{ old('brand_id', $vehicleRequest->brand_id) == $brand->id ? 'selected' : '' }}>
                                    {{ $brand->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                {{-- Model --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Model') }}</label>
                        <select name="model_id" id="model_id" class="form-control">
                            <option value="">{{ __('Select Model') }}</option>
                            @foreach ($models as $model)
                                <option value="{{ $model->id }}" {{ old('model_id', $vehicleRequest->model_id) == $model->id ? 'selected' : '' }}>
                                    {{ $model->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                {{-- Version --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Version') }}</label>
                        <select name="version_id" id="version_id" class="form-control">
                            <option value="">{{ __('Select Version') }}</option>
                            @foreach ($versions as $version)
                                <option value="{{ $version->id }}" {{ old('version_id', $vehicleRequest->version_id) == $version->id ? 'selected' : '' }}>
                                    {{ $version->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                {{-- Category --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Category') }}</label>
                        <select name="category_id" class="form-control">
                            <option value="">{{ __('Select Category') }}</option>
                            @foreach ($categories as $category)
                                @php
                                    $categoryName = method_exists($category, 'categoryContents')
                                        ? optional($category->categoryContents()->first())->name
                                        : ($category->name ?? $category->title ?? null);
                                @endphp
                                <option value="{{ $category->id }}" {{ old('category_id', $vehicleRequest->category_id) == $category->id ? 'selected' : '' }}>
                                    {{ $categoryName ?? ('Category #' . $category->id) }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                {{-- Department --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Department') }}</label>
                        <select name="country_id" id="country_id" class="form-control">
                            <option value="">{{ __('Select Department') }}</option>
                            @foreach ($countries as $country)
                                @php
                                    $countryName = method_exists($country, 'contents')
                                        ? optional($country->contents()->first())->name
                                        : ($country->name ?? $country->title ?? null);
                                @endphp
                                <option value="{{ $country->id }}" {{ old('country_id', $vehicleRequest->country_id) == $country->id ? 'selected' : '' }}>
                                    {{ $countryName ?? ('Department #' . $country->id) }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                {{-- City --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('City') }}</label>
                        <select name="state_id" id="state_id" class="form-control">
                            <option value="">{{ __('Select City') }}</option>
                            @foreach ($states as $state)
                                @php
                                    $stateName = method_exists($state, 'contents')
                                        ? optional($state->contents()->first())->name
                                        : ($state->name ?? $state->title ?? null);
                                @endphp
                                <option value="{{ $state->id }}" {{ old('state_id', $vehicleRequest->state_id) == $state->id ? 'selected' : '' }}>
                                    {{ $stateName ?? ('City #' . $state->id) }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                {{-- Zone --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Zone') }}</label>
                        <select name="city_id" id="city_id" class="form-control">
                            <option value="">{{ __('Select Zone') }}</option>
                            @foreach ($cities as $city)
                                @php
                                    $cityName = method_exists($city, 'contents')
                                        ? optional($city->contents()->first())->name
                                        : ($city->name ?? $city->title ?? null);
                                @endphp
                                <option value="{{ $city->id }}" {{ old('city_id', $vehicleRequest->city_id) == $city->id ? 'selected' : '' }}>
                                    {{ $cityName ?? ('Zone #' . $city->id) }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                {{-- Motor --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Motor') }}</label>
                        <input type="text" name="motor" class="form-control" value="{{ old('motor', $vehicleRequest->motor) }}">
                    </div>
                </div>

                {{-- Fuel --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Fuel Type') }}</label>
                        <select name="fuel_type" class="form-control">
                            <option value="">{{ __('Select Fuel Type') }}</option>
                            <option value="Nafta" {{ old('fuel_type', $vehicleRequest->fuel_type) == 'Nafta' ? 'selected' : '' }}>Nafta</option>
                            <option value="Diesel" {{ old('fuel_type', $vehicleRequest->fuel_type) == 'Diesel' ? 'selected' : '' }}>Diésel</option>
                            <option value="Electrico" {{ old('fuel_type', $vehicleRequest->fuel_type) == 'Electrico' ? 'selected' : '' }}>Eléctrico</option>
                            <option value="Hibrido" {{ old('fuel_type', $vehicleRequest->fuel_type) == 'Hibrido' ? 'selected' : '' }}>Híbrido</option>
                            <option value="Hibrido/Diesel" {{ old('fuel_type', $vehicleRequest->fuel_type) == 'Hibrido/Diesel' ? 'selected' : '' }}>Híbrido/Diesel</option>
                            <option value="Nafta/GNC" {{ old('fuel_type', $vehicleRequest->fuel_type) == 'Nafta/GNC' ? 'selected' : '' }}>Nafta/GNC</option>
                        </select>
                    </div>
                </div>

                {{-- Transmission --}}
                <div class="col-lg-3">
                    <div class="form-group">
                        <label>{{ __('Transmission') }}</label>
                        <select name="transmision" class="form-control">
                            <option value="">{{ __('Select Transmission') }}</option>
                            <option value="Manual" {{ old('transmision', $vehicleRequest->transmision) == 'Manual' ? 'selected' : '' }}>{{ __('Manual') }}</option>
                            <option value="Automática" {{ old('transmision', $vehicleRequest->transmision) == 'Automática' ? 'selected' : '' }}>{{ __('Automatic') }}</option>
                        </select>
                    </div>
                </div>

                {{-- Year --}}
                <div class="col-lg-2">
                    <div class="form-group">
                        <label>{{ __('Year Min') }}</label>
                        <input type="number" name="year_min" class="form-control" value="{{ old('year_min', $vehicleRequest->year_min) }}">
                    </div>
                </div>

                <div class="col-lg-2">
                    <div class="form-group">
                        <label>{{ __('Year Max') }}</label>
                        <input type="number" name="year_max" class="form-control" value="{{ old('year_max', $vehicleRequest->year_max) }}">
                    </div>
                </div>

                {{-- Price --}}
                <div class="col-lg-2">
                    <div class="form-group">
                        <label>{{ __('Price Min') }}</label>
                        <input type="number" step="0.01" name="price_min" class="form-control" value="{{ old('price_min', $vehicleRequest->price_min) }}">
                    </div>
                </div>

                <div class="col-lg-2">
                    <div class="form-group">
                        <label>{{ __('Price Max') }}</label>
                        <input type="number" step="0.01" name="price_max" class="form-control" value="{{ old('price_max', $vehicleRequest->price_max) }}">
                    </div>
                </div>

                {{-- KM --}}
                <div class="col-lg-2">
                    <div class="form-group">
                        <label>{{ __('KM Min') }}</label>
                        <input type="number" name="km_min" class="form-control" value="{{ old('km_min', $vehicleRequest->km_min) }}">
                    </div>
                </div>

                <div class="col-lg-2">
                    <div class="form-group">
                        <label>{{ __('KM Max') }}</label>
                        <input type="number" name="km_max" class="form-control" value="{{ old('km_max', $vehicleRequest->km_max) }}">
                    </div>
                </div>

            </div>
        </div>

        <div class="card-footer text-center">
            <button class="btn btn-success">
                <i class="fas fa-save"></i> {{ __('Update Request') }}
            </button>

            <a href="{{ route('user.vehicle_requests.index') }}" class="btn btn-secondary">
                {{ __('Cancel') }}
            </a>
        </div>
    </div>
</form>
@endsection

@section('scripts')
<script>
document.addEventListener('DOMContentLoaded', function () {
    const brandSelect = document.getElementById('brand_id');
    const modelSelect = document.getElementById('model_id');
    const versionSelect = document.getElementById('version_id');

    const countrySelect = document.getElementById('country_id');
    const stateSelect = document.getElementById('state_id');
    const citySelect = document.getElementById('city_id');

    const currentModelId = @json(old('model_id', $vehicleRequest->model_id));
    const currentVersionId = @json(old('version_id', $vehicleRequest->version_id));
    const currentStateId = @json(old('state_id', $vehicleRequest->state_id));
    const currentCityId = @json(old('city_id', $vehicleRequest->city_id));

    if (brandSelect) {
        brandSelect.addEventListener('change', function () {
            const brandId = this.value;

            modelSelect.innerHTML = '<option value="">{{ __("Select Model") }}</option>';
            versionSelect.innerHTML = '<option value="">{{ __("Select Version") }}</option>';

            if (!brandId) return;

            fetch("{{ route('user.private_seller_marketplace.get_models') }}?brand_id=" + brandId)
                .then(response => response.json())
                .then(data => {
                    if (data.models) {
                        data.models.forEach(function (item) {
                            const option = document.createElement('option');
                            option.value = item.id;
                            option.textContent = item.name;

                            if (String(currentModelId) === String(item.id)) {
                                option.selected = true;
                            }

                            modelSelect.appendChild(option);
                        });

                        if (currentModelId) {
                            modelSelect.dispatchEvent(new Event('change'));
                        }
                    }
                });
        });

        if (brandSelect.value) {
            brandSelect.dispatchEvent(new Event('change'));
        }
    }

    if (modelSelect) {
        modelSelect.addEventListener('change', function () {
            const modelId = this.value;

            versionSelect.innerHTML = '<option value="">{{ __("Select Version") }}</option>';

            if (!modelId) return;

            fetch("{{ route('user.private_seller_marketplace.get_versions') }}?model_id=" + modelId)
                .then(response => response.json())
                .then(data => {
                    if (data.versions) {
                        data.versions.forEach(function (item) {
                            const option = document.createElement('option');
                            option.value = item.id;
                            option.textContent = item.name;

                            if (String(currentVersionId) === String(item.id)) {
                                option.selected = true;
                            }

                            versionSelect.appendChild(option);
                        });
                    }
                });
        });
    }

    if (countrySelect) {
        countrySelect.addEventListener('change', function () {
            const countryId = this.value;

            stateSelect.innerHTML = '<option value="">{{ __("Select City") }}</option>';
            citySelect.innerHTML = '<option value="">{{ __("Select Zone") }}</option>';

            if (!countryId) return;

            fetch("{{ route('user.private_seller_marketplace.get_states') }}?country_id=" + countryId)
                .then(response => response.json())
                .then(response => {
                    if (response.states) {
                        response.states.forEach(function (item) {
                            const option = document.createElement('option');
                            option.value = item.id;
                            option.textContent = item.name ?? ('City #' + item.id);

                            if (String(currentStateId) === String(item.id)) {
                                option.selected = true;
                            }

                            stateSelect.appendChild(option);
                        });

                        if (currentStateId) {
                            stateSelect.dispatchEvent(new Event('change'));
                        }
                    }
                });
        });

        if (countrySelect.value) {
            countrySelect.dispatchEvent(new Event('change'));
        }
    }

    if (stateSelect) {
        stateSelect.addEventListener('change', function () {
            const stateId = this.value;

            citySelect.innerHTML = '<option value="">{{ __("Select Zone") }}</option>';

            if (!stateId) return;

            fetch("{{ route('user.private_seller_marketplace.get_cities') }}?state_id=" + stateId)
                .then(response => response.json())
                .then(data => {
                    if (data.cities) {
                        data.cities.forEach(function (item) {
                            const option = document.createElement('option');
                            option.value = item.id;
                            option.textContent = item.name ?? item.title ?? ('Zone #' + item.id);

                            if (String(currentCityId) === String(item.id)) {
                                option.selected = true;
                            }

                            citySelect.appendChild(option);
                        });
                    }
                });
        });
    }
});
</script>
@endsection