@extends('new-place.paint.index')

@section('page_title')
{{ "Antique Product" }}
@endsection

@section('antique-wrapper')

<section class="shop-page-one">
    <div class="shop-page-one_inner">
        <div class="container">
            <div class="row">
                <div class="col-xl-3 col-lg-4 order-box-2">
                    <div class="thm-sidebar-box">

                        <div class="single-sidebar-box">
                            <div class="sidebar-search-box style2">
                                <form class="search-form" action="{{ route('shop.paint.paint') }}" method="GET">
                                    @csrf
                                    <input placeholder="Search" name="search" type="text">
                                    <button type="submit">
                                        <i class="fa fa-search" aria-hidden="true"></i>
                                    </button>
                                </form>
                            </div>
                        </div>
                        <form action="{{ route('shop.paint.paint') }}" method="get">
                            @csrf
                            <div class="single-sidebar-box">
                                <div class="title">
                                    <h3>Categories</h3>
                                </div>
                                <ul class="sidebar-categories-box-style2">
                                    <li style="border: none"> <a href="#" style="float: left"> All </a>  <button type="submit" class="btn btn-success" style="background: #e63a27; border:none;float: right;"><i class="fa fa-filter"></i></button></li><br>
                                    <input type="hidden" name="category_filter" value="all" />
                                    @foreach ($product_category as $key=>$item)
                                    <li>
                                        @if(isset($category_filter))
                                        @if(in_array($item->category, $category_filter))
                                        <input type="checkbox" name="category_filter[]" value="{{$item->category}}" id={{$item->id}} checked />
                                        @else
                                        <input type="checkbox" name="category_filter[]" value="{{$item->category}}" id={{$item->id}} />
                                        @endif
                                        @else
                                        <input type="checkbox" name="category_filter[]" value="{{$item->category}}" id={{$item->id}} />
                                        @endif
                                        <label for={{$item->id}}> {{$item->category}} </label>
                                    </li>
                                    @endforeach
                                </ul>

                            </div>

                            <div class="single-sidebar-box">
                                <div class="title">
                                    <h3>Filter by Price </h3>
                                </div>
                                <div class="price-ranger">

                                    <div id="slider-range"></div>
                                    <div class="ranger-min-max-block">
                                        <div class="left">
                                            <span>Price:</span>
                                            <input type="text" name="min_price" class="min">
                                            <span>-</span>
                                            &nbsp;
                                            <input type="text" name="max_price" class="max" style="width: 20%">
                                        </div>
                                        <div class="right">
                                            {{-- <input type="submit" value="Filter"> --}}
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="single-sidebar-box">
                                {{-- <div class="title">
                                    <button type="submit" class="btn btn-success" style="width: 100%;background: #e63a27; border:none">Submit</button>
                                </div> --}}
                            </div>
                        </form>
                    </div>
                </div>

                <div class="col-xl-9 col-lg-8 order-box-1">
                    <div class="row">
                        <div class="col-xl-12">
                            <div class="shop-page-top-info_inner">
                                <div class="left-box">
                                    @if (!empty($antique_data))
                                    <p>Showing {{ $antique_data->firstItem() }}–{{ $antique_data->lastItem() }} of {{ $antique_data->total() }} results <span style="color: #ccc">{{ !empty($result) ? (is_array($result) ? "'".implode(', ', $result)."'" : "'".htmlspecialchars($result)."'") : '' }}</span>
                                    </p>
                                    @endif
                                </div>
                                <div class="right-box">
                                    <div class="text">
                                        <p>Sort by:</p>
                                    </div>
                                    <form action="{{ route('shop.paint.paint') }}" method="get" id="sortForm">
                                        <div class="select-box">
                                            <select class="wide" name="sort_order" id="sortOrderSelect">

                                                <option value="ASC" {{ $sort_order=='DESC'?'':'selected' }}>Ascending</option>
                                                <option value="DESC" {{ $sort_order=='DESC'?'selected':'' }}>Descending</option>
                                            </select>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div id="table_data_display">
                        @include('new-place.paint.antique_all')
                    </div>
                </div>

            </div>
        </div>
    </div>
</section>

@endsection
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $(document).ready(function() {
        $('#sortOrderSelect').on('change', function() {
            $('#sortForm').submit();
        });
    });

</script>