@extends('admin.layouts.app')

@section('crumb')
    <x-bread-crumb :breadcrumbs="[['text' => 'edit'], ['text' => getLastKeyRoute(request()->route()->getName())]]" :button="[]">
    </x-bread-crumb>
@endsection

@section('content')
    <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
        <!--begin::Post-->
        <div class="post d-flex flex-column-fluid" id="kt_post">
            <!--begin::Container-->
            <div id="kt_content_container" class="container-xxl">
                <!--begin::Card-->
                <div class="card">
                    <!--begin::Card header-->
                    <div class="card-header border-0 pt-6">

                        <!--begin::Card body-->

                        <div class="card-body pt-0">
                            <!--begin::Form-->
                            <form method="get" action="{{ route('admin.ads.edit_ads_category') }}">
                                <!--begin::Input group-->
                                <div class="fv-row mb-10">
                                    <div class="row">
                                        <div class="col-lg-4">
                                            <label class="fs-5 fw-bold form-label mb-5">Category:</label>
                                            <select name="category" class="form-control form-control-solid" id="categoryDropdown">
                                                <option value="">---</option>
                                                @foreach ($categories as $category)
                                                    <option
                                                        value="{{ $category->id }} "{{ $category->id == request('category') ? 'selected' : '' }}>
                                                        {{ $category->name }}</option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-lg-4">
                                            <label class="fs-5 fw-bold form-label mb-5">Sub:</label>
                                            <select name="sub" class="form-control form-control-solid" id="subDropdown">
                                                <option value="">---</option>

                                            </select>
                                        </div>

                                    </div>
                                </div>
                        </div>
                        <!--end::Input group-->

                        <!--begin::Actions-->
                        <div class="text-center">
                            <button type="submit" class="btn btn-primary">
                                <span class="indicator-label">Filter</span>
                            </button>
                        </div>
                        <!--end::Actions-->

                        </form>
                        <!--end::Form-->
                    </div>
                    <!--end::Card body-->
                </div>
                <!--end::Card-->
            </div>
            <!--end::Container-->
        </div>
        <!--end::Post-->
    </div>


    <!--end::Content-->


    <!-- Display filtered ads here -->



    <!--begin::Content-->
    <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
        <!--begin::Post-->
        <div class="post d-flex flex-column-fluid" id="kt_post">
            <!--begin::Container-->
            <div id="kt_content_container" class="container-xxl">
                <h1>EditAdsCategory</h1>

                <!--begin::Card-->
                <div class="card">

                    <!--begin::Card header-->
                    <div class="card-header border-0 pt-6">


                        <!--begin::Card body-->

                        <div class="card-body pt-0">
                            <!--begin::Form-->
                            <form action="{{ route('admin.ads.update_ads_category') }}" method="POST"
                                enctype="multipart/form-data">

                                @csrf
                                @method('PUT')

                                <!--begin::Input group-->
                                <div class="fv-row mb-10">
                                    <div class="row">

                                        <div class="col-6 ">
                                            <label class="fs-5 fw-bold form-label mb-5">ads:</label>
                                            <!--end::Label-->
                                            <!--begin::Input-->
                                            <select name="ads[]" class="search-category form-control" multiple >
                                                <option value="">---</option>
                                                @foreach ($ads as $ad)
                                                    <option value="{{ $ad->id }}">{{ $ad->title }}</option>
                                                @endforeach
                                            </select>
                                            @error('ads')
                                                <span class="text-danger" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                            @enderror
                                        </div>
                                        <div class="col-6">
                                            <label class="fs-5 fw-bold form-label mb-5">SubCategories:</label>
                                            <select name="car_model_id" class="form-control" id="subcategoryDropdown">
                                                <option value="">---</option>
                                                @foreach ($carModels as $carModel)
                                                    <option value="{{ $carModel->id }}">{{ $carModel->name }}</option>
                                                @endforeach
                                            </select>
                                            @error('car_model_id')
                                                <span class="text-danger" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                            @enderror
                                        </div>

                                        <div class="col-6">
                                            <label class="fs-5 fw-bold form-label mb-5">SubSubCategories:</label>
                                            <select name="sub_sub_category_id" class="form-control" id="subsubcategoryDropdown">
                                                <option value="">---</option>
                                            </select>
                                            @error('sub_sub_category_id')
                                                <span class="text-danger" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                            @enderror
                                        </div>



                                    </div>
                                    <!--begin::Label-->
                                </div>
                                <!--end::Input group-->

                                <!--begin::Actions-->
                                <div class="text-center">
                                    <button type="submit" class="btn btn-primary">
                                        <span class="indicator-label">Save</span>
                                    </button>
                                </div>
                                <!--end::Actions-->

                            </form>
                            <!--end::Form-->
                        </div>
                        <!--end::Card body-->
                    </div>
                    <!--end::Card-->
                </div>
                <!--end::Container-->
            </div>
            <!--end::Post-->
        </div>
        <!--end::Content-->
    @endsection
    @push('admin_js')

<script>
    $(document).ready(function() {
        $('#categoryDropdown').on('change', function() {
            var categoryId = $(this).val();
            var siteLang = '{{ app()->getLocale() }}'; // Replace this with your actual logic to get the site's language

            $.ajax({
                url: "{{ asset('api/subCategory/') }}" + '/' + categoryId,
                method: 'GET',
                headers: {
                    'Accept-Language': siteLang // Include the Accept-Language header with the site's language
                },
                success: function(data) {
                    $('#subDropdown').empty();
                    $('#subDropdown').append('<option value="">---</option>');

                    $.each(data.data, function(index, subcategory) {
                        $('#subDropdown').append('<option value="' + subcategory.id + '">' + subcategory.name + '</option>');
                    });
                    // If you're using select2 or any other custom dropdown, reinitialize/update it here
                },
                error: function(error) {
                    console.error('Error fetching subcategories:', error);
                }
            });
        });
    });
    $(document).ready(function() {
        $('#subcategoryDropdown').on('change', function() {
            var categoryId = $(this).val();
            var siteLang = '{{ app()->getLocale() }}'; // Replace this with your actual logic to get the site's language

            $.ajax({
                url: "{{ asset('api/subsubCategory/') }}" + '/' + categoryId,
                method: 'GET',
                headers: {
                    'Accept-Language': siteLang // Include the Accept-Language header with the site's language
                },
                success: function(data) {
                    $('#subsubcategoryDropdown').empty();
                    $('#subsubcategoryDropdown').append('<option value="">---</option>');

                    $.each(data.data, function(index, subcategory) {
                        $('#subsubcategoryDropdown').append('<option value="' + subcategory.id + '">' + subcategory.name + '</option>');
                    });
                    // If you're using select2 or any other custom dropdown, reinitialize/update it here
                },
                error: function(error) {
                    console.error('Error fetching subcategories:', error);
                }
            });
        });
    });
</script>


    @endpush