@extends('website.includes.master')

@section('title')
    Shop
@endsection

@section('content')

    <div class="main-content main-content-product no-sidebar">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="breadcrumb-trail breadcrumbs">
                        <ul class="trail-items breadcrumb">
                            <li class="trail-item trail-begin">
                                <a href="{{ route('/') }}">Home</a>
                            </li>
                            <li class="trail-item trail-end active">
                                Products
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="content-area shop-grid-content full-width col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="site-main">
                        <h3 class="custom_blog_title">
                            Products
                        </h3>
                        <ul class="row list-products auto-clear equal-container product-grid">
                            @forelse($products as $product)
                                <li class="product-item  col-lg-3 col-md-4 col-sm-6 col-xs-6 col-ts-12 style-1">
                                    <div class="product-inner equal-element">
                                        <div class="product-thumb">
                                            <div class="thumb-inner">
                                                <a href="{{ route('product_detail',[$product->slug]) }}">
                                                    <img src="{{ URL::asset('admin/assets/uploads/'.$product->image)}}"
                                                         alt="img" style="width: 100%;height: 200px">
                                                </a>
                                                <div class="thumb-group">

                                                    <div class="loop-form-add-to-cart">
                                                        <a href="{{ route('add_to_cart_single',[$product->id]) }}" class="single_add_to_cart_button button cart_button">Add to cart
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="product-info">
                                            <h5 class="product-name product_title">
                                                <a href="{{ route('product_detail',[$product->slug]) }}">{{ $product->name }}</a>
                                            </h5>
                                            <div class="group-info">

                                                <div class="price">
                                                    @if(!empty($product->cut_price))
                                                        <del>
                                                            ${{ number_format($product->cut_price,2) }}
                                                        </del>
                                                    @endif
                                                    <ins>
                                                        ${{ number_format($product->price,2) }}
                                                    </ins>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                            @empty
                            @endforelse
                        </ul>
                        <div class="row text-center justify-content-center Products_pginations mt-3">
                            @if ($products->lastPage() > 1)
                                <ul class="pagination text-center justify-content-center">
                                    <li class="{{ ($products->currentPage() == 1) ? ' disabled' : '' }}">
                                        @if($products->currentPage() == 1)
                                            <a disabled="" class="btn"
                                               style="width: 100px;cursor:not-allowed;">Previous</a>
                                        @else
                                            <a class="btn btn-outline-success" style="width: 100px"
                                               href="{{ $products->url($products->currentPage()-1) }}">Previous</a>
                                        @endif
                                    </li>
                                    @for ($i = 1; $i <= $products->lastPage(); $i++)
                                        <li class="{{ ($products->currentPage() == $i) ? ' active' : '' }}">
                                            <a class="btn btn-success" style="margin-left:10px;margin-right:10px"
                                               href="{{ $products->url($i) }}">{{ $i }}</a>
                                        </li>
                                    @endfor
                                    <li class="{{ ($products->currentPage() == $products->lastPage()) ? ' disabled' : '' }}">
                                        @if($products->currentPage() == $products->lastPage())
                                            <a class="btn" style="width: 100px;cursor:not-allowed" disabled="">Next</a>
                                        @else
                                            <a class="btn btn-outline-success" style="width: 100px"
                                               href="{{ $products->url($products->currentPage()+1) }}">Next</a>
                                        @endif
                                    </li>
                                </ul>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection