@extends(get_view('index'))

@section('title'){{ request()->q }} {{ __('Arama Sonuçları') }} - @endsection

@section('header')

@endsection

@section('content')


@include(get_view('components.pages.page-title'), ['title' => __('Arama Sonuçları')])

<main>
    <!-- bölüm -->
    <div class="axil-shop-area axil-section-gap bg-color-white">
        <!-- konteyner -->
        <div class="container">
            <!-- sıra -->
            <div class="row gx-10">
                <!-- kolon -->
                <div class="col-lg-3">
                    <div class="axil-shop-sidebar">
                        <div class="d-lg-none">
                            <button class="sidebar-close filter-close-btn"><i class="fas fa-times"></i></button>
                        </div>
                        @include(get_view('components.search.filter'))
                    </div>
                    <!-- End .axil-shop-sidebar -->
                </div>
                <div class="col-lg-9">
                    <!-- liste ikonu -->
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="axil-shop-top mb--40">
                                <div class="category-select align-items-center justify-content-lg-end justify-content-between">
                                    <!-- Start Single Select  -->
                                    {{-- <span class="filter-results">1-12 of 84 sonuç gösteriliyor</span>
                                    <select class="single-select">
                                        <option>En Yeniden Sırala</option>
                                        <option>En Eskiden Sırala</option>
                                        <option>İsme Göre Sırala</option>
                                        <option>Fiyata Göre Sırala</option>
                                    </select> --}}
                                    <!-- End Single Select  -->
                                </div>
                                <div class="d-lg-none">
                                    <button class="product-filter-mobile filter-toggle"><i class="fas fa-filter"></i> {{ __('FİLTRELE') }}</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- sıra -->
                    <div class="row g-4 mt-2">

                        @include(get_view('components.product.list'))

                    </div>
                </div>
            </div>
        </div>
    </div>
</main>

@endsection

@section('footer')
<script>
    $('#slider-range').slider({
        range: true,
        min: 0,
        max: 15000,
        values: [{{ request()->start_price ?? 0 }}, {{ request()->end_price ?? 15000 }}],
        slide: function(event, ui) {
            $('#amount').val('₺' + ui.values[0] + ' - ₺' + ui.values[1]);
            $('input[name="start_price"]').val(ui.values[0]);
            $('input[name="end_price"]').val(ui.values[1]);
        }
    });
    $('#amount').val('₺' + $('#slider-range').slider('values', 0) +
                '  ₺' + $('#slider-range').slider('values', 1));
</script>
<script>
    //price_range if change
    $(document).on('change', 'input[name="price_range"]', function() {
        var price_range = $(this).val();
        var price_range_array = price_range.split('-');
        $('input[name="start_price"]').val(price_range_array[0]);
        $('input[name="end_price"]').val(price_range_array[1]);
    });
</script>
@endsection