@extends('layouts.admin')
@section('content')
<nav aria-label="breadcrumb " class="breadcrumb-wrap">
    <div class="container">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{url('/')}}"><i class="ti-home"></i></a></li>
            <li class="breadcrumb-item"><a href="javascript:;">My Orders</a></li>
            <li class="breadcrumb-item active" aria-current="page">Order</li>
        </ol>
    </div>
</nav>
<section class="gray-dark mt-0 pt-4 pt-xs-0 pb-xs-0">
    <div class="container order-list">
        <div class="row pt-2">

            <div class="col-lg-3">
                @include('includes.admin.accountSidebar')
            </div>

            <div class="col-lg-9 col-md-9 right-side">

                <div class="bg-white mb-4">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <div class="sec-heading-flex pl-2 pr-2">
                                <div class="sec-heading-flex-one">
                                    <h2>My Orders</h2>
                                </div>
                                <div class="sec-heading-flex-last">
                                    <select class="custom-select" id="statusFilter">
                                        <option value="1">All</option>
                                        <option value="9">Delivered</option>
                                        <option value="10">Returned</option>
                                        <option value="11">Cancelled</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="bg-white mb-4 dynamic_content">
                        @include('admin.orderlist_ajax')
                    </div>

                </div>

                <div class="row pagination_block">
                    <div class="col-lg-12">
                        <nav aria-label="Page navigation example">
                            <ul class="pagination">
                                <li class="page-item left">
                                    <a class="page-link prev_next" id="prev" data-state="1" href="javascript:;" aria-label="Previous">
                                        <span aria-hidden="true"><i class="ti-arrow-left mr-1"></i>Prev</span>
                                    </a>
                                </li>

                                


                                <li class="page-item right">
                                    <a class="page-link prev_next" id="next" data-state="2" href="javascript:;" aria-label="Next">
                                        <span aria-hidden="true"><i class="ti-arrow-right mr-1"></i>Next</span>
                                    </a>
                                    <input type="hidden" name="current_page" value="1" id="current_page">
                                    <input type="hidden" name="total_count" value="{{$orderlist->order_total_count}}" id="total_count">
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>

            </div>

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

<script>

    function updateReorder(order_id) {

        var token, url;
        token = $('meta[name="csrf-token"]').attr('content');
        url = '{{url('/reorder')}}';
        var is_favorite = 'Yes';
        $('#reorder_'+order_id).hide();

        var data = {
            'order_id': order_id
        };
        
        $.ajax({
            url: url,
            headers: {
                "X-CSRF-TOKEN": token,
            },
            data: data,
            type: "POST",
            datatype: "json",
            success: function(resp) {
                if (resp.http_code == 400) {
                    enable_button();
                    err_msg = resp.message.replace(/, \\n /g, "<br>");
                    if (err_msg) {
                        swal(err_msg).then((value) => {
                            if (typeof resp.data !== 'undefined') {
                                $('.qty-' + warehouse_product_id).val(resp.data);
                            }
                            if (value === true) {
                                return false;
                            }
                        });
                        return false;
                    }
                    toastr.error(err_msg);
                } else if (resp.http_code == 200) {
                    toastr.success(resp.message);
                    window.location.reload();
                } else if (resp.http_code == 401) {
                    toastr.warning(resp.message);
                    var login = "{{ url("/")}}";
                    $(location).attr("href", login);
                } else if (resp.http_code == 500) {
                    toastr.warning(resp.message);
                    enable_button();
                    return false;
                } else if (resp.http_code == 60) {
                    enable_button();
                    return false;
                }

            },
            error: function(err) {
                enable_button();
                return false;
            },
        });
    }

    $(document).ready(function() {
        var total_count = $("#total_count").val();
        if (total_count < 10) {
            $("pagination_block").css('display', 'none')
            $(".pagination_block").hide();
        }

        $('#statusFilter').on('change', function() {
            var token, url, data, statusfilter, page, total_count;

            var statusfilter = $(this).val();
            $(".paginate").removeClass('active');
            page = '1';
            $(".paginate_" + page).addClass("active");
            $("#current_page").val(page);
            token = $('meta[name="csrf-token"]').attr('content');
            url = '{{url('/myorder/ajax')}}';
            data = {
                'status': statusfilter,
                'page': page
            };
            $.ajax({
                url: url,
                headers: {
                    'X-CSRF-TOKEN': token
                },
                data: data,
                type: 'POST',
                datatype: 'HTML',
                success: function(resp) {

                    $(".dynamic_content").html(resp);
                    var order_count = $("#order_count").val();
                    if (order_count < 10) {
                        $(".pagination_block").css('display', 'none')
                        $(".pagination_block").hide();
                    } else {
                        $(".pagination_block").css('display', 'block')
                        $(".pagination_block").show();
                    }

                },
            });
        });

        $('.paginate').on('click', function() {
            $(".paginate").removeClass('active');
            var token, url, data, statusfilter, page, current_element;
            page = $(this).data('value');
            $("#current_page").val(page);
            current_element = $(this);
            statusfilter = $('#statusFilter').val();
            token = $('meta[name="csrf-token"]').attr('content');
            url = '{{url('/myorder/ajax')}}';
            data = {
                'status': statusfilter,
                'page': page
            };

            $.ajax({
                url: url,
                headers: {
                    'X-CSRF-TOKEN': token
                },
                data: data,
                type: 'POST',
                datatype: 'HTML',
                success: function(resp) {
                    $(".dynamic_content").html(resp);
                    current_element.addClass('active');
                    //current_element.addClass('active');
                },
            });
        });

        $('.prev_next').on('click', function() {
            var token, url, data, statusfilter, page, current_element;
            var state = $(this).attr('id');
            var current_page = $("#current_page").val();
            var totalpagecount = Math.ceil(total_count / 10);

            if (state == 'prev' && current_page > 1) {
                page = parseInt(current_page) - 1;
            } else if (state == 'next' && totalpagecount > current_page) {
                page = parseInt(current_page) + 1;
            } else {
                return false;
            }

            $(".paginate").removeClass('active');
            $("#current_page").val(page);
            current_element = $(this);
            statusfilter = $('#statusFilter').val();
            token = $('meta[name="csrf-token"]').attr('content');
            url = '{{url('/myorder/ajax')}}';
            data = {
                'status': statusfilter,
                'page': page
            };
            $(".paginate_" + page).addClass("active");
            $.ajax({
                url: url,
                headers: {
                    'X-CSRF-TOKEN': token
                },
                data: data,
                type: 'POST',
                datatype: 'HTML',
                success: function(resp) {
                    $(".dynamic_content").html(resp);

                },
            });
        });


    });
</script>
@if(session()->has('message'))
<script>
    toastr.success("{{ session()->get('message') }}");
</script>
@endif
@endsection