@extends('front.index')

@section('meta_title')  @lang('front.products')@endsection
@section('meta_des')  @lang('front.products') @endsection
@section('meta_key')  @lang('front.products')@endsection

@section('content')

    <section class="map-back">
        <div class="container">
            <h1 class="title">@lang('front.products')</h1>
            <ul class="maplink">
                <li> <a href="{{route('front.home')}}">@lang('front.home')</a></li>
                <li>@lang('front.products')</li>
            </ul>
        </div>
    </section><!-- End Section panner Top -->

    <section class="products pb-3">
        <div class="container">
            <div class="row">
                <div class="col-sm-3 menus-it">
                    <form>
                    <div class="filter-spo">
                        <a class="iconfilter" href="#"></a>
                        <div class="show-rspn">
                            <div class="filterbottom">

                                <div class="botclick"> <span>@lang('front.ChoserCategary')  <i class="arrow-up fas fa-chevron-up"></i>  <i class="arrow-down fas fa-chevron-down"></i></span>
                                    <div class="divhidslid">



                                        @if($categories->count()>0)
                                        @foreach($categories as $k=>$categrry)
                                        <label class="che-box">

                                            <input type="checkbox" value="{{$categrry->id}}" name="cate[]" @if (@in_array(@$categrry->id, @request()->cate)) checked="checked" @endif>
                                            <span class="label-text"> {{$categrry->name}}</span>

                                        </label>
                                            @endforeach
                                        @else
                                                {{trans('front.NoDataProduct')}}
                                        @endif





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




                        </div>
                    </div>
                    <div class="filter-spo">
                        <a class="iconfilter" href="#"></a>
                        <div class="show-rspn">
                            <div class="filterbottom">

                                <div class="botclick"> <span>{{trans('front.brand')}}  <i class="arrow-up fas fa-chevron-up"></i>  <i class="arrow-down fas fa-chevron-down"></i></span>
                                    <div class="divhidslid">



                                        @if($brands->count()>0)
                                        @foreach($brands as $k=>$brnd)
                                        <label class="che-box">

                                            <input type="checkbox" value="{{$brnd->id}}" name="brand[]" @if (@in_array(@$brnd->id, @request()->brand)) checked="checked" @endif>
                                            <span class="label-text"> {{$brnd->name}}</span>

                                        </label>
                                            @endforeach
                                        @else
                                                {{trans('front.NoDataProduct')}}
                                        @endif


                                            <button class="btn btn-success" type="submit">@lang('front.search')</button>


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




                        </div>
                    </div>
                    </form>
                </div>
                <div class="col-sm-9 menus-it">
                    <div class="headtitl">
                        <h2 class="title-pro">@lang('front.products') ({{$products->total()}})</h2>
                        <div class="item-icons">
                        <nav class="icons"><a class="bot-grid "><i class="fas fa-list"></i></a><a class="bot-show active"><i class="fas fa-th"></i></a></nav>
{{--                        <div class="select"><i class="fas fa-chevron-down"></i>--}}
{{--                            <select class="form-control">--}}
{{--                                <option>ترتيب حسب</option>--}}
{{--                                <option>التاريخ  </option>--}}
{{--                            </select>--}}
{{--                        </div>--}}
                        </div>
                    </div>
                    <div class="row">
                        @if($products->count()>0)
                        @foreach($products as $product)
                        <div class="col-sm-4 itpord ">
                            <div class="pro-item">
                                @if($product->isfavourite == 0)
                                    <a class="far fa-heart hart" href="{{route('front.favorites.store',[$product->id])}}" data-toggle="tooltip" title="{{trans('front.Add-to-fave')}}"></a>
                                @else
                                    <a class="fa fa-heart hart" href="{{route('front.favorites.store',[$product->id])}}" data-toggle="tooltip" title="{{trans('front.remove-to-fave')}}"></a>
                                @endif
                                @if($product->CountColor ==0)
                                    <a class="cart" href="{{route('front.product.addToCart',[$product->id])}}" data-product-id="{{$product->id}}" data-toggle="tooltip" title="{{trans('front.Add-to-cart')}}">
                                        <img src="{{asset('assets')}}/images/shopping-cart.png" alt="{{$product->name}}" title="{{$product->name}}">
                                    </a>
                                @else
                                    <a class="cart model_open" data-id="{{$product->id}}" title="{{trans('front.Add-to-cart')}}">
                                        <img src="{{asset('assets')}}/images/shopping-cart.png" alt="{{$product->name}}" title="{{$product->name}}">
                                    </a>
                                @endif
                                @if($product->special)
                                <div class="textnew">
                                    <p>{{trans('front.Special')}}    </p>
                                </div>
                                @endif
                                <a class="photo" href="{{route('front.product',[$product->slug])}}">
                                    <img src="{{$product->image}}" alt="{{$product->name}}" title="{{$product->name}}">
                                </a>
                                <div class="contant">
                                <a class="title-it" href="{{route('front.product',[$product->slug])}}">{{$product->name}}</a>
                                <div class="price"><span class="new">{{$product->price_after_discount}}</span>@if($product->price != 0)<span class="old">{{$product->price}}</span>@endif</div>
                                <ul class="rating">
                                    @for($i=0;$i < $product->stars ;$i++ )
                                        <li class="fas fa-star active"></li>
                                    @endfor
                                    @for($i=0;$i < (5-$product->stars) ;$i++ )
                                        <li class="fas fa-star "></li>
                                    @endfor


                                </ul>
                                </div>
                            </div>
                        </div>
                            @endforeach
                        @else
                            <div class="col-sm-4 itpord">

                                    {{trans('front.NoDataProduct')}}
                            </div>

                        @endif

                    </div>
                    <ul class="pagination w-100">
                        @if($products->count()>0)
                            <div class="row">

                                <div class="col-md-7 col-sm-7">{{$products->appends(\Request::except('_token'))->render()}}</div>
                            </div>
                        @endif
                    </ul>
                </div>
            </div>
        </div>

    </section><!-- End menus-section -->
    <div class="modal fade overlaybox" id="card-item" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-inner"><span class="filter-clos" data-dismiss="modal" aria-label="Close"></span>

                </div>
            </div>
        </div>
    </div><!--End products-min-->
    <script>
        $(document).on('click', '.model_open', function() {

            var id = $(this).attr('data-id');

            $.get("{{route('front.get_color')}}"+ '/'+ id, function(data){
                $('.modal-inner').html(data);
                $('#card-item').modal('show');
            });
        });
    </script>
@endsection