@extends('master.front')
@section('content')
    <!-- Start Bradcaump area -->
    <div class="ht__bradcaump__area bg-image--1"></div>
    <!-- End Bradcaump area -->
    <!-- Start Shop Page -->
    <div class="page-shop-sidebar left--sidebar bg--white section-padding--lg">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-12 order-2 order-lg-1 md-mt-40 sm-mt-40">
                    <div class="shop__sidebar">
                        <aside class="wedget__categories poroduct--cat">
                            <h3 class="wedget__title">Product Categories</h3>
                            <ul>
                                @foreach($categories as $category)
                                    <li><a href="/public/products/?category={{ $category->name }}">{{ $category->name }} <span>({{ $category->qty }})</span></a></li>
                                @endforeach
                            </ul>
                        </aside>
                    </div>
                </div>
                <div class="col-lg-9 col-12 order-1 order-lg-2">
                    <div class="tab__container">
                        <div class="shop-grid tab-pane fade show active" id="nav-grid" role="tabpanel">
                            @include('front.product.discount')
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Shop Page -->
@endsection
@section('js')
    <script>
        $(document).ready(function () {
            $(document).on('click', '.page-link', function (event) {
                event.preventDefault();
                var page = $(this).attr('href').split('page=')[1];
                getDiscounts(page);
            });

            function getDiscounts(page) {
                $.ajax({
                    url:"/discounts/getDiscounts?page="+page,
                    success:function (products) {
                        $('#nav-grid').html(products);
                    }
                });
            }
        });
    </script>
@endsection