@extends('web.layouts.layout')

@section('content')

    <main>
        <!-- Start section -->
        <section class="products_pg products_sec bg-white section">
            <div class="container">
                <form class="filter_form mb-5">
                    <div class="row align-items-center justify-content-between">
                        <div class="col-lg-6">
                            <h2 class="title_w_shape"> {{ __('products::products.products') }} </h2>
                        </div>
                        <div class="col-lg-3">
                            <div class="form-group">
                                <input name="search"
                                       value="{{ trim($request->search) }}"
                                       class="form-control"
                                       placeholder="{{ __('products::products.search_product_name') }}"/>
                            </div>
                        </div>
                        <div class="col-lg-2 ">
                            <div class="form-group ">
                                <select name="sort_by" class="form-control form-select">
                                    <option value="">{{ __('products::products.sort_by') }}</option>
                                    @foreach(config('general.products.sort_by') as $sortBy)
                                        <option
                                            value="{{ $sortBy }}" @selected($sortBy == $request->sort_by)>
                                            {{ __("products::products.sort_by_$sortBy") }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-1 ">
                            <button type="submit" class="submit_butn butn sm_butn primary_butn ">
                                <i class="fa-light fa-arrow-up-triangle-square mx-0"></i>
                            </button>
                        </div>
                    </div>
                </form>

                <div class="row">
                    @if($products->isNotEmpty())
                        @foreach($products as $product)
                            <div class="col-lg-4">
                                @include('web.products::_product_card')
                            </div>
                        @endforeach
                    @else
                        <div class="col-lg-12">
                            <div class="alert alert-info text-center">{{ __('general.no_results') }}</div>
                        </div>
                    @endif

                    {{ $products->links('vendor.pagination.custom2') }}

                </div>
            </div>
            <img src="{{asset('assets/web/images/vector-9.svg')}}" class="bg" alt=""/>
        </section>
    </main>

@endsection

@push('stack_scripts')

@endpush