@extends('admin.template.master')

@section('stylesheets')
    {!! Html::style('assets/admin/bower_components/select2/dist/css/select2.min.css') !!}

    <style>
        /*Select2 style*/
        .select2-container--default .select2-selection--single, .select2-selection .select2-selection--single {
            border: 1px solid #d2d6de;
            border-radius: 0;
            padding: 6px 12px;
            height: 34px;
        }

        .select2-container .select2-selection--single .select2-selection__rendered {
            padding-right: 10px;
        }

        .select2-container .select2-selection--single .select2-selection__rendered {
            padding-left: 0;
            padding-right: 0;
            height: auto;
            margin-top: -4px;
        }

        .select2-container--default .select2-selection--single .select2-selection__arrow {
            height: 28px;
            right: 3px;
        }

        /*Select2 style*/
        .status_link:hover {
            color: blue;
            text-decoration: underline;
        }

        .show_hide_link {
            text-decoration: underline;
        }

        .show_hide_link:hover {
            color: blue;
            text-decoration: underline;
        }

        .report-statistic-list {
            font-size: 12px;
            padding-left: 11px;
            /*margin: 0;*/
        }

        .report-statistic-list li {
            /*list-style: none;*/
        }

        .row.display-flex {
            display: flex;
            flex-wrap: wrap;
        }

        .row.display-flex > [class*='col-'] {
            display: flex;
            flex-direction: column;
        }

        .sp_radio_label{
            margin-left: 5px;
            margin-right: 20px;
        }

    </style>
@endsection

@section('title')
    <section class="content-header">
        <h1>
            Lock Orders Report
        </h1>
        <ol class="breadcrumb">
            <li><a href="{!! url('admin/') !!}"><i class="fa fa-dashboard"></i> Home</a></li>
            <li class="active">Lock Orders report</li>
        </ol>
    </section>
@endsection

@section('main-content')
    <section class="content">
        @if(Session::has('message'))
            <div class="row">
                <div class="col-xs-12">
                    <div class="alert alert-success alert-dismissible">
                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                        {{Session('message')}}
                    </div>
                </div>
            </div>
        @endif

        <div class="row" id="main_div_inner">
            <div class="col-xs-12">
                <div class="box box-warning order-filter-wrapper">
                    <div class="box-header with-border">
                        <h6 class="box-title">Order Delivery Filter</h6>

                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                        </div>
                    </div>

                    <div class="box-body">
                        <div class="row">
                            <div class="form-group col-md-3">
                                {!! Form::label('from_date', 'From Order Date') !!}
                                {!! Form::date('from_date', \Carbon\Carbon::now(), ['class' => 'form-control date', 'id' => 'from_date']) !!}
                            </div>

                            <div class="form-group col-md-3">
                                {!! Form::label('to_date', 'To Order Date') !!}
                                {!! Form::date('to_date', \Carbon\Carbon::now(), ['class' => 'form-control date', 'id' => 'to_date']) !!}
                            </div>

                            <div class="form-group col-md-3">
                                {!! Form::label('&nbsp;') !!}
                                <div class="checkbox">
                                    <input type="checkbox" class="chk" id="search_by_date" checked>
                                </div>
                            </div>
                        </div>


                        <div class="row" >
                            <div class="form-group col-md-6">
                                {!! Form::button('Search',['class' => 'btn btn-primary btn-order-delivery-search', 'id' => 'btn-order-delivery-search']) !!}
                                {!! Form::button('Clear',['class' => 'btn btn-danger btn-order-delivery-reset', 'id' => 'btn-order-delivery-reset']) !!}
                                {{-- {!! Form::button('Excel',['class' => 'btn btn-info btn-order-delivery-excel', 'id' => 'btn-order-delivery-excel']) !!} --}}
                            </div>
                        </div>
                    </div>
                </div>

                <div class="box">
                    <div class="box-header with-border">
                        <h6 class="box-title">Order Delivery List</h6>
                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                        </div>
                    </div>
                    <div class="box-body table-responsive" id="order-delivery-list"></div>
                </div>

            </div>
        </div>
    </section>
@endsection

@section('javascripts')
    {!! Html::script('assets/admin/bower_components/select2/dist/js/select2.full.min.js') !!}

    <script type="text/javascript">
        var from_date_initial = '';
        var to_date_initial = '';

        $(document).ready(function () {
            $(".select-data").select2();

            from_date_initial = $.trim($("#from_date").val());
            to_date_initial = $.trim($("#to_date").val());

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $("#btn-order-delivery-search").click(function () {
                getOrderDeliveryData('search_data', '');
            });

        });

        function getOrderDeliveryData(data_type, status_query) {

            // Generate Query Data
            var search_by_date = 'off';
            if ($("#search_by_date").is(":checked")) {
                search_by_date = 'on';
            }
            var from_date = $.trim($('#from_date').val());
            var to_date = $.trim($('#to_date').val());


            var data = "search_by_date=" + search_by_date + "&from_date=" + from_date + "&to_date=" + to_date ;

            // End Generate

            if (data_type == 'excel_data') {
                var url = '{{ route("orderDeliveryExcel", ":data") }}';
                url = url.replace(':data', data);
                window.open(url);
            } else if (data_type == 'search_data') {
                // Collapse Statistics Bar
                $("#order-delivery-status").hide();
                $("#order-delivery-status-box").addClass("collapsed-box");
                $("#order-delivery-status-plus-minus").removeClass("fa-minus");
                $("#order-delivery-status-plus-minus").addClass("fa-plus");
                // add loader

                var total_amount = '0';
                var shipping_cost_amount = '0';
                var total_time = '0';
                $('.order-filter-wrapper').append('<div class="overlay main_div_inner_overlay"><i class="fa fa-refresh fa-spin"></i></div>');
                $.ajax({
                    type: "POST",
                    url: "{{ route('lockOrdersAjaxData') }}",
                    data: data,
                    cache: false,
                    success: function (result) {
                        $('#order-delivery-list').html(result);
                        var arr = result.split("dataseparator");
                        $('#order-delivery-list').html($.trim(arr[0]));
                        var arr2 = $.trim(arr[1]).split('blank_data_count_separator');
                        $('#order-delivery-blank-summary').html($.trim(arr2[0]));
                        var blank_data_count = arr2[1];
                        $("#sp_blank_data_total").html(blank_data_count);
                        $('#order-delivery-status').html($.trim(arr[2]));
                        total_amount = arr[3];
                        shipping_cost_amount = arr[4];
                        total_time = arr[5];
                    },
                    error: function (jqXHR, status, err) {
                        // alert(err);
                    },
                    complete: function () {
                        $(".main_div_inner_overlay").remove();
                        $('#order_delivery_list_table').DataTable({
                            "order": [[0, 'desc']],
                            "pageLength": 50,
                            "language": {
                                "info": "Showing _START_ to _END_ of _TOTAL_ entries - Total Order Amount - " + total_amount + ' , Total Shipping Cost - ' + shipping_cost_amount+ ' , Average Time - ' + total_time
                            },

                        });
                    }
                });
            }
        }

        function search_from_status(column_name, data_search) {
            getOrderDeliveryData('search_data', column_name + ',' + data_search);
        }
    </script>
@endsection