@extends('layouts.main_frontend')
@section('content')

<main>
    <!-- Desktop Breadcrumb -->
    <section class="py-md-4 py-2">
        <div class="container">
            <nav class="breadcrumb-container" aria-label="breadcrumb">
                <ol class="breadcrumb mb-0">
                    <li class="breadcrumb-item">
                        <a href="{{route('Home')}}"> @lang('site.home') </a>
                    </li>
                    <li class="breadcrumb-item text-main" aria-current="page">
                        @lang('site.favourite')
                    </li>
                </ol>
            </nav>
        </div>
    </section>

    <!-- section -->
    <section>
        <div class="container">
            <div class="row">
                <div class="tabs-details mt-3">
                    <ul class="tabs-nav-all-booking list-unstyled d-flex mb-2 tabs-nav-detailss">
                        <li>
                            <a href="#tab-1" class="tab-link-all d-flex align-items-center justify-content-center">
                                <div>
                                    <i class="far fa-building"></i>
                                </div>
                                <h2 class="mb-0 pe-2">@lang('site.aquars')</h2>
                            </a>
                        </li>
                        <li>
                            <a href="#tab-2" class="tab-link-all d-flex align-items-center justify-content-center">
                                <div>
                                    <i class="far fa-car-side"></i>
                                </div>
                                <h2 class="mb-0 pe-2">@lang('site.cars')</h2>
                            </a>
                        </li>
                        <li>
                            <a href="#tab-3" class="tab-link-all d-flex align-items-center justify-content-center">
                                <div>
                                    <i class="far fa-car-side"></i>
                                </div>
                                <h2 class="mb-0 pe-2">@lang('site.places')</h2>
                            </a>
                        </li>

                    </ul>
                    <ul class="tabs-content pt-4 list-unstyled all-booking-tabs tabs-content-details">
                        <li id="tab-1">
                            <div class="row">
                                <div class="col-12">
                                    <div class="card card-department  mb-4 p-md-3 p-2" style="border: none">
                            
                                        <div class="row ">
                                            @foreach($AqarSelector as $aqar)
                                            @if(!empty($aqar))
                                                
                                                <div class="col-lg-3 col-md-6 col-sm-6 col-12 m-1">
                                                        <div class="card-tour mb-3 flex">
                                                            <a href="{{ route('favouriteCities',[ 'country_id'=>$aqar->country_id ,'type' =>0]) }}">
                                                                <div class="card-image-box">
                                                                    <img class="card-img"
                                                                        src="{{ $aqar->image }}"
                                                                        alt="Card image cap">
                                                                </div>
                                                                <div
                                                                    class="card-tour-body d-flex justify-content-between align-items-center">
                                                                    <div class="number d-flex">
                                                                        <h2 class=" card-title">{{ $aqar->name_ar }}</h2>
                                                                        <h5 style="color:var(--m-main); margin-inline:5px;">( {{ $aqar->aqar_count }} )</h5>
                                                                    </div>
                                                                    <div>
                                                                        {{-- <img src="./assets/images/countries/turkey.png" alt="turkey"
                                                                            class="icon-flag"> --}}
                                                                    </div>
                                                                </div>
                                                            </a>
                                                        </div>
                                                </div>
                                           
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @unless (count($AqarSelector))
                            <!--empty booking-->
                             <div class="col-12 mb-5">
                                        <div class="card-empty d-md-flex align-items-center">
                                            <div class="card-empty-txt">  @lang('site.No Favourite') </div>
                                            <div>
                                                <img
                                                  src="{{FRONTASSETS}}/investor/empty-ic.svg"
                                                    alt="empty icon"
                                                />
                                            </div>
                                        </div>
                                    </div>
                            @endunless

                        </li>
                        <li id="tab-2">
                            <div class="row">
                                <div class="col-12">
                                    <div class="card card-department  mb-4 p-md-3 p-2" style="border: none">
                                              
                                            <div class="row g-0">
                                                @foreach($CarSelector as $car)
                                                @if(!empty($car))
                                    
                                                <div class="col-lg-3 col-md-6 col-sm-6 col-12 m-1">
                                                    <div class="card-tour mb-3">
                                                        <a href="{{ route('favouriteCities',[ 'country_id'=>$car->id ,'type' =>1]) }}">
                                                            <div class="card-image-box">
                                                                <img class="card-img"
                                                                    src="{{ $car->image }}"
                                                                    alt="Card image cap">
                                                            </div>
                                                            <div class="card-tour-body d-flex justify-content-between align-items-center">
                                                                <div class="number d-flex">
                                                                    <h2 class=" card-title">{{ $car->name_ar }}</h2>
                                                                    <h5 style="color:var(--m-main); margin-inline:5px;">( {{ $car->car_count }} )</h5>
                                                                </div>
                                                                <div>
                                                                    {{-- <img src="./assets/images/turkey.png" alt="turkey"
                                                                        class="icon-flag"> --}}
                                                                </div>
                                                            </div>
                                                        </a>
                                                    </div>
                                                </div>
                                                
                                        @endif
                                        @endforeach
                                            </div>
                                        
                                    </div>
                                </div>
                            </div>

                            @unless (count($CarSelector))
                            <!--empty booking-->
                            <div class="col-12 mb-5">
                                <div class="card-empty d-md-flex align-items-center">
                                    <div class="card-empty-txt"> @lang('site.No Favourite') </div>
                                    <div>
                                        <img src="{{FRONTASSETS}}/investor/empty-ic.svg" alt="empty icon" />
                                    </div>
                                </div>
                            </div>
                            @endunless

                        </li>

                        <li id="tab-3">
                            <div class="row">
                                <div class="col-12">
                                    <div id="removefav" class="card card-department round-border mb-4 p-md-3 p-2" style="border: none">
                               
                                        <div class="row g-0">
                                            @foreach ($PlaceSelector as $place)
                                             @if (!empty($place))
                                                <div class="col-lg-3 col-md-6 col-sm-6 col-12 m-1">
                                                    <div class="card-tour mb-3">
                                                        <a href="{{ route('favouriteCities', ['country_id' => $place->id ,'type' =>2]) }}">
                                                            <div class="card-image-box">
                                                                <img class="card-img" src="{{ $place->image }}" alt="Card image cap">
                                                            </div>
                                                            <div class="card-tour-body d-flex justify-content-between align-items-center">
                                                                <div class="number d-flex">
                                                                    <h2 class="card-title">{{ $place->name_ar }}</h2>
                                                                    <h5 style="color:var(--m-main); margin-inline:5px;">( {{ $place->place_count }} )</h5>
                                                                </div>
                                                                <div>
                                                                    {{-- <img src="./assets/images/turkey.png" alt="turkey" class="icon-flag"> --}}
                                                                </div>
                                                            </div>
                                                        </a>
                                                    </div>
                                                </div>
                                             @endif
                                            @endforeach
                                        </div>
                                       
                                    </div>
                                    </div>
                                </div>
                            </div>

                                @unless (count($PlaceSelector))
                                <!--empty booking-->
                                <div class="col-12 mb-5">
                                    <div class="card-empty d-md-flex align-items-center">
                                        <div class="card-empty-txt"> @lang('site.No Favourite') </div>
                                        <div>
                                            <img src="{{FRONTASSETS}}/investor/empty-ic.svg" alt="empty icon" />
                                        </div>
                                    </div>
                                </div>

                                @endunless
                        </li>

            </ul>
        </div>
        </div>

        </div>
    </section>
    <!-- /section -->
</main>

@endsection
@section('scripts')

<script>
jQuery(document).ready(function() {
    jQuery('.favouritess').click(function(e) {
        e.preventDefault();
        var id = $(this).data('id');
        console.log("iddd", id);
        // console.log("iddd", id);
        jQuery.ajax({

            url: "{{ url('favouritPlace')}}" + '/' + id,
            method: 'GET',
            data: {
                '_token': '{{ csrf_token() }}',
            },
            success: function(result) {
                console.log("result.status");
                console.log(result);
                if (result.status == 'deleted') {
                    $(`#favouritess${id} i`).addClass('far').removeClass('fas');
                    // $('#removefav').hide();
                    // window.location.href = "#tab-3";
                    window.location.reload();
                    // $('#nofev').show();
                } else if (result.status == 'added') {
                    $(`#favouritess${id} i`).addClass('fas').removeClass('far');
                    // $('#nofev').hide();
                } else if (result.status == 'auth') {
                    swal({
                        title: "Warning!",
                        text: "{{ trans('site.register/ sign in first to be able to add to favorite') }}",
                        type: "warning",
                        confirmButtonText: "OK"
                    });
                    setInterval(function() {
                        Swal.close()
                    }, 2000)
                    window.location.href = '{{ route("sitelogin") }}';
                }
            },
            error: function(err) {
                console.log(err)
            }
        });
    });
});
</script>

<script>
jQuery(document).ready(function() {
    jQuery('.favouritess2').click(function(e) {
        e.preventDefault();

        var id = $(this).data('id');
        jQuery.ajax({
            url: 'favouritCar/' + id,
            method: 'GET',
            data: {
                '_token': '{{ csrf_token() }}',
            },
            success: function(result) {
                console.log("result.status");
                console.log(result);
                if (result.status == 'deleted') {
                    $(`#favouritess2${id} i`).addClass('far').removeClass('fas');
                    // $('#removefav2').hide();
                    // window.location.href = "#tab-2";
                    window.location.reload();

                } else if (result.status == 'added') {
                    $(`#favouritess2${id} i`).addClass('fas').removeClass('far');

                } else if (result.status == 'auth') {
                    swal({
                        title: "Warning!",
                        text: "{{ trans('site.register/ sign in first to be able to add to favorite') }}",
                        type: "warning",
                        confirmButtonText: "OK"
                    });
                    setInterval(function() {
                        Swal.close()
                    }, 2000)
                    window.location.href = '{{ route("sitelogin") }}';
                }
            },
            error: function(err) {
                console.log(err)
            }
        });
    });
});
</script>

<script>
jQuery(document).ready(function() {
    jQuery('.favouritess3').click(function(e) {
        e.preventDefault();

        var id = $(this).data('id');
        jQuery.ajax({
            url: 'favouritAqar/' + id,
            method: 'GET',
            data: {
                '_token': '{{ csrf_token() }}',
            },
            success: function(result) {
                console.log(result.status);
                if (result.status == 'deleted') {
                    $(`#favouritess3${id} i`).addClass('far').removeClass('fas');
                    $('#removefav').hide();
                    window.location.href = "#tab-3";
                    window.location.reload();
                    // $('#nofev').show();
                } else if (result.status == 'added') {
                    $(`#favouritess3${id} i`).addClass('fas').removeClass('far');
                    // $('#nofev').hide();

                } else if (result.status == 'auth') {
                    swal({
                        title: "Warning!",
                        text: "{{ trans('site.register/ sign in first to be able to add to favorite') }}",
                        type: "warning",
                        confirmButtonText: "OK"
                    });

                    setTimeout(function() {
                        Swal.close()
                    }, 2000)

                    window.location.href = '{{route("sitelogin")}}';
                }

            },
            error: function(err) {
                console.log(err)
            }
        });
    });
});
</script>
@endsection