@extends($theme.'.layouts.admin')
@section('content')
<div class="breadcrumbs_area bg-list">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="breadcrumb_content">
                    <h3>All Products</h3>
                    <ul>
                        <li><a href="{{url('/') }}">home</a></li>
                        <li>All Products</li>
                    </ul>
                </div>
                <div class="card">
                    <div class="card-body">
                        <div class="text-center"><img src="{{ env('AWS_URL').$school_list->image }}" style="width: 110px;" class="img-fluid" /></div>
                        <div class="school_text">
                            <h4>{{$school_list->name}}</h4>
                            <div class="action_links">
                                <!-- <a href="{{url('school-list')}}" class="btn btn-sm" data-original-title="School"><i class="fa fa-angle-double-right"></i> Change School</a> -->
                                <!-- <a hreh="#" data-toggle="modal" data-target="#myModal"><i class="fa fa-angle-double-right"></i> Change School</a> -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<section>
    <div class="welcome_lukani_store">
        <div class="container">
            <div class="welcome_lukani_container products-block mt-23">
                <div class="shop_area shop_reverse">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-12 col-md-12">
                                <!--shop wrapper start-->
                                <!--shop toolbar start-->
                                <div class="shop_toolbar_wrapper">
                                    <div class="shop_toolbar_btn">
                                        <button data-role="grid_3" type="button" class="active btn-grid-3" data-toggle="tooltip" title="3"></button>
                                        <!--
                                        <button data-role="grid_4" type="button" class=" btn-grid-4" data-toggle="tooltip" title="4"></button> -->
                                        <button data-role="grid_list" type="button" class="btn-list" data-toggle="tooltip" title="List"></button>
                                    </div>
                                    <!--  <div class="toolbar-sorter sorter">
                                        <label class="sorter-label" for="sorter">Sort By</label>
                                        <select id="sorter" data-role="sorter" data-category-id="" data-level="all" name="sorter" class="sorter-options mb-0">
                                            <option value="">Featured </option>
                                            <option value="priceLowest">Price: Low to High </option>
                                            <option value="priceHighest">Price: High to Low</option>
                                            <option value="latest">New Arrivals</option>
                                        </select>
                                    </div> -->
                                    <div class="page_amount">
                                        
                                    </div>
                                </div>
                                <input type="hidden" name="hdn_school_id" id="hdn_school_id" class="school_id" value="{{$school_list->id}}">
                                <input type="hidden" data-url="{{ url()->current() }}" data-school-id="{{ $school_id }}" id="current_page_url">
                                <div class="loader triangle" style="display: none">
                                    <svg viewBox="0 0 86 80">
                                    <polygon points="43 8 79 72 7 72"></polygon>
                                </svg>
                            </div>
                            <div class="product-content">
                                @include($theme.'.admin.school_inner_products')
                            </div>
                             <div class="product_area product_style2 mt-50">
                            <div class="container-fluid">
                                <div class="row">
                                    <div class="col-12">
                                        <div class="section_title md-3">
                                            <h3>Generic Products – Not School Specific <a class="text-primary" href="{{ url('product-list',['category_id'=>'products','level'=>'all']) }}">See All</a></h3>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12 product_style2_ocntainer container pb-5 mb-5 wow slideInUp animated">

                                        <div class="row product_carousel product2_column5  ">
                                            @forelse($genric_products as $product)
                                            <div class="item">
                                                <div class="product_items">
                                                    <article class="single_product">
                                                        <figure>
                                                            <div class="product_thumb">
                                                                <a class="primary_img" href="{{ url('product-details/'.$product->id.'/'.$product->group_name_slug) }}"><img src="{{ $product->image1 }}" alt=""></a>
                                                                @if(!empty($product->discount_label))
                                                                <div class="label_product">
                                                                    <span class="label_sale">{{$product->discount_label}}</span>
                                                                </div>
                                                                @endif
                                                            </div>
                                                            <figcaption class="product_content">
                                                            <h4 class="product_name"><a href="{{ url('product-details/'.$product->id.'/'.$product->group_name_slug) }}" class="product-detail-{{$product->id}}">{{ $product->name_en }}
                                                            </a></h4>
                                                            @if(!empty($product->discount_label))
                                                            <div class="price_box">
                                                                <span class="current_price">{{ env("CURRENCY_CODE") }} {{$product->discounted_price}}</span>
                                                                <span class="old_price">{{ env("CURRENCY_CODE") }} {{$product->price}}</span>
                                                            </div>
                                                            @else
                                                            <div class="price_box">
                                                                <span class="current_price">{{ env("CURRENCY_CODE") }} {{$product->price}}</span>
                                                            </div>
                                                            @endif
                                                            </figcaption>
                                                            <div class="action_links text-center mt-3 ">
                                                                <a href="{{ url('product-details/'.$product->id.'/'.$product->group_name_slug) }}" class="mr-4 btn btn-dark" title="Add to cart "><i
                                                                class="icon-shopping-bag "></i> Buy Now</a>
                                                                                                                                @if(!empty(Session::get('token')) && $product->is_favourite == 1)
                                                                <i class="icon-heart select favProducts" data-product="{{ $product->product_id }}" data-warehouse-product="{{ $product->id }}"  data-status="0"></i>
                                                                @elseif(!empty(Session::get('token')) && $product->is_favourite == 0)
                                                                <i class="icon-heart favProducts" data-product="{{ $product->product_id }}" data-warehouse-product="{{ $product->id }}"  data-status="1"></i>
                                                                @else
                                                                <i class="icon-heart favProducts" ></i>
                                                                @endif
                                                            </div>
                                                        </figure>
                                                    </article>
                                                </div>
                                            </div>
                                            @empty
                                            <h4> products not available </h4>
                                            @endforelse
                                        </div>

                                </div>
                            </div>
                        </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</section>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">&times;</button>
    <h4 class="modal-title">Select School</h4>
</div>
<form id="school_submit" class="school_submit" method="POST" action="{{ url('/home') }}">
    {{ csrf_field() }}
    <div class="modal-body">
        <select name='school_id' class='form-control' id='school_list'>
            <option value>@lang('messages.Select School')</option>
            @if(!empty($parent_schools))
            @foreach($parent_schools as $schools)
            <option value='{{$schools->id}}' selected > {{ $schools->name }}</option>
            @endforeach
            @else
            <option value=''>@lang('messages.No Schools Found')</option>
            @endif
        </select>
    </div>
    <div class="modal-footer">
        <button type="submit" name="submit" class="btn btn-default">Submit</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
</form>
</div>
</div>
</div>
<script>
    function filter_products(page=1){
        $('.loader').show();
        var token = $('meta[name="csrf-token"]').attr('content');
        var url =  "{{ route('home') }}";
        var brand = get_list_filter_value("brand_filter");
        var price = $(".price_filter:checked").val();
        var category = get_list_filter_value("category_filter");
        var sub_category = get_list_filter_value("sub_category_filter");
        var color = get_list_filter_value("color_filter");
        var size = get_list_filter_value("size_filter");
        var sorter = $('#sorter').val();
        var school_id = $('#hdn_school_id').val();
        $.ajax({
            url: url,
            headers: {
                'X-CSRF-TOKEN': token
            },
            type: 'post',
            data: {
                brand: brand,
                page:page,
                price: price,
                category: category,
                sub_category: sub_category,
                color : color,
                size : size,
                sorter: sorter,
                school_id:school_id
            },
            datatype: 'JSON',
            success: function(resp) {
                $('.loader').hide();
                if (resp.http_code == 400) {
                    toastr.warning(resp.message);
                } else if (resp.http_code == 200) {
                    if (!resp.data) {
                        $(".shop_wrapper").html(
                            "<p>Filtered data not available!</p>"
                        );
                    } else {
                        $(".product-content").html(resp.data);
                    }
                } else if (resp.http_code == 500) {
                    toastr.success(resp.message);
                }
            },
            error: function(err) {
                $('.loader').hide();
            }
        });
    }

    // $(document).on('click', '.page-link', function(e) {
    //     var page = $(this).attr("data-url");
    //     var current_pagee_url = $('#current_page_url').attr('data-url');
    //     var url = current_page_url+'?page='+page;
    // });

    $(document).on('click', '.brand_filter', function(e) {
        filter_products();
    });

    $(document).on('click', '.size_filter', function(e) {
        filter_products();
    });

    $(document).on('click', '.color_filter', function(e) {
        filter_products();
    });

    $(document).on('click', '.price_filter', function(e) {
        filter_products();
    });

    $(document).on('click', '.category_filter', function(e) {
        filter_products();
    });

    $(document).on('click', '.sub_category_filter', function(e) {
        filter_products();
    });

    $('#sorter').on('change',function(){
        filter_products();
    });
    function get_list_filter_value(filter_class) {
        var filter_data = [];

        $("." + filter_class + ":checked").each(function() {
            filter_data.push($(this).val());
        });

        return filter_data;
    }
    $(document).on('click', '.favProducts', function (e) {
    e.preventDefault();
    var customer_id = $('#customer_id').val();
    if (customer_id <= 0) {
        if (confirm('Please Login')) {
            window.location.replace("{{url('/')}}");
            return false;
        }
    } else {
        var token = $('meta[name="csrf-token"]').attr('content');
        var status = $(this).attr("data-status");
        var product_id = $(this).attr('data-product');
        var warehouse_product_id = $(this).attr('data-warehouse-product');
        var vendor_id = $(this).attr('data-vendor');
        //var vendor_id = '1';
        var data = {
            'product_id': product_id,
            'status': status,
            'warehouse_product_id': warehouse_product_id,
            'vendor_id': vendor_id
        };
        var url = '{{url('update-fav')}}';
        $.ajax({
            url: url,
            headers: {
                'X-CSRF-TOKEN': token
            },
            data: data,
            type: 'POST',
            datatype: 'JSON',
            success: function (resp) {
                if (resp.http_code == 400) {
                    toastr.warning(resp.message);
                } else if (resp.http_code == 200) {
                    toastr.success(resp.message);
                    window.location.reload();
                } else if (resp.http_code == 500) {
                    toastr.success(resp.message);
                }
            }
        });
    }
});
    $(document).on('click', '.page-link', function(e) {
    $('.loader').show();
    var token = $('meta[name="csrf-token"]').attr('content');
    var page = $(this).attr("data-url");
    var url = $('#current_page_url').attr('data-url');
    var school_id = $('#current_page_url').attr('data-school-id');
    var level = $('#current_page_url').attr('data-level');
    var sorter = $('#sorter').val();

    $.ajax({
        url: url,
        headers: {
            'X-CSRF-TOKEN': token
        },
        type: 'get',
        data: {
            page: page,
            school_id: school_id,
        },
        datatype: 'JSON',
        success: function(resp) {
            $('.loader').hide();
            if (resp.http_code == 400) {
                toastr.warning(resp.message);
            } else if (resp.http_code == 200) {
                $('.product-content').html(resp.data);
            } else if (resp.http_code == 500) {
                toastr.success(resp.message);
            }
        },
        error: function(err) {
            $('.loader').hide();
        }
    });
});
</script>

@endsection