@extends('layout.master')

@section('content')
    <section class="content pb-5">
        <div class="container-fluid">

            <div class="position-relative pb-5 mt-3">
                <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
                    <ol class="carousel-indicators">
                        <li data-target="#carouselExampleIndicators" data-slide-to="0" class=""></li>
                        <li data-target="#carouselExampleIndicators" data-slide-to="1" class=""></li>
                        <li data-target="#carouselExampleIndicators" data-slide-to="2" class="active"></li>
                    </ol>
                    <div class="carousel-inner">
                        <div class="carousel-item">
                            <img class="d-block w-100" src="/assets/images/top-banner.png" alt="First slide">
                        </div>
                        <div class="carousel-item active carousel-item-left">
                            <img class="d-block w-100" src="/assets/images/top-banner.png" alt="Second slide">
                        </div>
                        <div class="carousel-item carousel-item-next carousel-item-left">
                            <img class="d-block w-100" src="/assets/images/top-banner.png" alt="Third slide">
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div class="title-section">
                        <p>Orders</p>
                    </div>
                </div>

                <div class="col-md-12">
                    <ul class="nav nav-tabs lsp-tabs" id="firstTab" role="tablist">
                        <li class="nav-item lsp-item">
                            <a class="nav-link lsp-link active" id="forward-tab" data-toggle="tab" href="#forward"
                                role="tab" aria-controls="forward" aria-selected="false">Forward Orders</a>
                        </li>
                        <li class="nav-item lsp-item">
                            <a class="nav-link lsp-link" id="reverse-tab" data-toggle="tab" href="#reverse" role="tab"
                                aria-controls="reverse" aria-selected="false">Reverse Orders</a>
                        </li>
                    </ul>
                    <div class="tab-content lsp-tab-content" id="myTabContent">
                        <div class="tab-pane fade active show" id="forward" role="tabpanel" aria-labelledby="forward-tab">

                            <div class="row">
                                <div class="col-md-3">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Search by Order ID or AWB</label>
                                        <input class="form-control order_awb_no" placeholder="" type="text"
                                            value="">
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">All Tracking Status</label>

                                        <div class="dropdown bootstrap-select show-tick w-75">
                                            <select class="selectpicker order_status w-75" multiple data-actions-box="true"
                                                tabindex="-98" id="">
                                                @foreach ($order_status as $status)
                                                    <option value="{{ $status }}">
                                                        {{ ucwords(str_replace('_', ' ', $status)) }}</option>
                                                @endforeach
                                            </select>
                                            <div class="dropdown-menu ">
                                                <div class="bs-actionsbox">
                                                    <div class="btn-group btn-group-sm btn-block"><button type="button"
                                                            class="actions-btn bs-select-all btn btn-light">Select
                                                            All</button><button type="button"
                                                            class="actions-btn bs-deselect-all btn btn-light">Deselect
                                                            All</button>
                                                    </div>
                                                </div>
                                                <div class="inner show" role="listbox" id="bs-select-1" tabindex="-1"
                                                    aria-multiselectable="true">
                                                    <ul class="dropdown-menu inner show" role="presentation"></ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-5 mb-3 mb-sm-0">
                                    <div class="text-right">
                                        <button type="button" class="btn btn-danger bulk-rto mr-2" disabled>Bulk RTO</button>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="table-responsive">
                                        <table class="table table-striped" id="forward-datatable">
                                            <thead>
                                                <tr>
                                                    <th scope="col">
                                                        <input class="filled-in fill-check" name="group1"
                                                            type="checkbox" id="select_all_forward">
                                                        <label for="select_all_forward"></label>
                                                    </th>
                                                    <th scope="col"> Date <img src="/assets/images/calender-lsp.png"
                                                            alt="">
                                                    </th>
                                                    <th scope="col">Awb No</th>
                                                    <th scope="col">Pickup Pin</th>
                                                    <th scope="col">Delivery Pin</th>
                                                    <th scope="col">Pickup Contact</th>
                                                    <th scope="col">Delivery Contact</th>
                                                    <th scope="col">Customer Details</th>
                                                    <th scope="col">Pickup Address </th>
                                                    <th scope="col">Delivery Address</th>
                                                    <th scope="col">Zone</th>
                                                    <th scope="col">Expected Pickup Time</th>
                                                    <th scope="col">Expected Pickup Date</th>
                                                    <th scope="col">Status</th>
                                                    <th scope="col">Action</th>
                                                </tr>
                                            </thead>
                                            <tbody></tbody>
                                        </table>

                                    </div>


                                </div>
                            </div>

                        </div>

                        <div class="tab-pane fade" id="reverse" role="tabpanel" aria-labelledby="reverse-tab">

                            <div class="row">
                                <div class="col-md-3">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Search by Order ID or AWB</label>
                                        <input class="form-control order_awb_no" placeholder="" type="text"
                                            value="">
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">All Tracking Status</label>

                                        <div class="dropdown bootstrap-select show-tick w-75">
                                            <select class="selectpicker order_status w-75" multiple
                                                data-actions-box="true" tabindex="-98" id="">
                                                @foreach ($order_status as $status)
                                                    <option value="{{ $status }}">
                                                        {{ ucwords(str_replace('_', ' ', $status)) }}</option>
                                                @endforeach
                                            </select>
                                            <div class="dropdown-menu ">
                                                <div class="bs-actionsbox">
                                                    <div class="btn-group btn-group-sm btn-block"><button type="button"
                                                            class="actions-btn bs-select-all btn btn-light">Select
                                                            All</button><button type="button"
                                                            class="actions-btn bs-deselect-all btn btn-light">Deselect
                                                            All</button>
                                                    </div>
                                                </div>
                                                <div class="inner show" role="listbox" id="bs-select-1" tabindex="-1"
                                                    aria-multiselectable="true">
                                                    <ul class="dropdown-menu inner show" role="presentation"></ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-12">
                                    <div class="table-responsive">
                                        <table class="table table-striped" id="reverse-datatable">
                                            <thead>
                                                <tr>
                                                    <th scope="col">
                                                        <input class="filled-in fill-check" name="group1"
                                                            type="checkbox" id="active11">
                                                        <label for="active11"></label>
                                                    </th>
                                                    <th scope="col"> Date <img src="/assets/images/calender-lsp.png"
                                                            alt="">
                                                    </th>
                                                    <th scope="col">Awb No</th>
                                                    <th scope="col">Forward Order No</th>
                                                    <th scope="col">Reverse Pickup Address</th>
                                                    <th scope="col">Pickup Contact</th>
                                                    <th scope="col">Pickup Pincode</th>
                                                    <th scope="col">No. of items</th>
                                                    <th scope="col">Reverse Reason</th>
                                                </tr>
                                            </thead>
                                            <tbody></tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-5">
                    <div class="title-section">
                        <p>Today’s Delivery Report</p>
                    </div>

                    <ul class="nav nav-tabs lsp-tabs" id="myTab" role="tablist">
                        <li class="nav-item lsp-item">
                            <a class="nav-link lsp-link report-link active" id="b2b-tab" data-toggle="tab"
                                href="#b2b" role="tab" aria-controls="b2b" aria-selected="true">B2B</a>
                        </li>
                        <li class="nav-item lsp-item">
                            <a class="nav-link lsp-link report-link" id="b2c-tab" data-toggle="tab" href="#b2c"
                                role="tab" aria-controls="b2c" aria-selected="false">B2C</a>
                        </li>
                        <li class="nav-item lsp-item">
                            <a class="nav-link lsp-link report-link" id="d2c-tab" data-toggle="tab" href="#d2c"
                                role="tab" aria-controls="d2c" aria-selected="false">D2C</a>
                        </li>
                    </ul>
                    <div class="tab-content lsp-tab-content" id="myTabContent">
                        <div class="tab-pane fade show active" id="b2b" role="tabpanel" aria-labelledby="b2b-tab">

                            <div class="zone-box">
                                <div class="row">
                                    <div class="col-md-6 col-6">
                                        <canvas id="reportChart" width="216" height="216"
                                            style="display: block; box-sizing: border-box; height: 216px; width: 216px;"></canvas>
                                    </div>

                                    <div class="col-md-6 col-6">
                                        <div class="lsp-heading">
                                            <p>Total Pakages</p>
                                            <h5>7,865</h5>
                                            <span> <img src="/assets/images/lsp-arrow.png" alt=""> 16%
                                                (1258
                                                deliverred)</span>

                                            <p class="mt-3"><img src="/assets/images/lspdot1.png" alt="">
                                                Delivered</p>
                                            <p><img src="/assets/images/lspdot2.png" alt=""> On the
                                                Way</p>
                                            <p><img src="/assets/images/lspdot3.png" alt=""> RTO</p>
                                            <p><img src="/assets/images/lspdot4.png" alt=""> NDR</p>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>

                        <div class="tab-pane fade" id="b2c" role="tabpanel" aria-labelledby="b2c-tab">
                            Lorem ipsum dolor sit, amet consectetur adipisicing elit.?
                        </div>

                        <div class="tab-pane fade" id="d2c" role="tabpanel" aria-labelledby="d2c-tab">
                            Lorem ipsum dolor sit, amet consectetur adipisicing elit.?
                        </div>

                    </div>
                </div>
                <div class="col-md-7">
                    <div class="title-section">
                        <p>Financial Report</p>
                    </div>

                    <div class="zone-box">
                        <div class="row">
                            <div class="col-md-8 col-8">
                                <div class="lsp-heading">
                                    <h5>Profit</h5>
                                    <p class="mt-0">Profit earned from Orders</p>
                                </div>
                            </div>
                            <div class="col-md-4 col-4">
                                <select name="" id="" class="border-0">
                                    <option value="">Months</option>
                                    <option value="">year</option>
                                </select>
                            </div>
                        </div>

                        <canvas id="financialChart" width="645" height="232"
                            style="display: block; box-sizing: border-box; height: 232px; width: 645px;"></canvas>
                    </div>
                </div>
            </div>

            <div class="row pt-4">
                <div class="col-md-12">
                    <div class="title-section">
                        <p>Billing</p>
                    </div>
                </div>

                <div class="col-md-2">
                    <div class="form-group custom-form-group">
                        <label class="form-label" for="customername">Customer Name</label>
                        <input class="form-control" placeholder="" type="text" value="">
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="form-group custom-form-group">
                        <label class="form-label" for="saleschannel">Sales Channel</label>
                        <input class="form-control" placeholder="" type="text" value="">
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="form-group custom-form-group">
                        <label class="form-label" for="orderid">Zone</label>
                        <input class="form-control" placeholder="" type="text" value="">
                    </div>
                </div>

                <div class="col-md-12">
                    <div class="table-responsive">
                        <table class="table table-striped" id="billing-datatable">
                            <thead>
                                <tr>
                                    <th scope="col"> Date</th>
                                    <th scope="col">Awb bill</th>
                                    <th scope="col">Order ID</th>
                                    <th scope="col">To Pin</th>
                                    <th scope="col">From Pin</th>
                                    <th scope="col">Volumetric</th>
                                    <th scope="col">Base Charges</th>
                                    <th scope="col">Actual Mass</th>
                                    <th scope="col">RTO Charges</th>
                                    <th scope="col">Weight Disc Charges</th>
                                    <th scope="col">Revenue </th>
                                    <th scope="col">Delivery Type</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>

                    </div>



                </div>
            </div>


            <!-- modal 1 -->

            <div class="modal fade" id="rto-status" tabindex="-1" aria-labelledby="exampleModalLabel"
                aria-hidden="true">
                <div class="modal-dialog modal-xl">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title mb-0" id="exampleModalLabel">
                                <div class="title-section border-left-0">
                                    <p>RTO Status</p>
                                </div>
                            </h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true"><img src="/assets/images/close.png" height="30px"
                                        alt=""></span>
                            </button>
                        </div>

                        <div class="modal-body lsp-rto-popup">
                            <div class="row">
                                <div class="col-md-3 mt-3">
                                    <h6>Reason/Special Remark</h6>
                                </div>
                                <div class="col-md-9 mt-3">
                                    <div class="form-group custom-form-group">
                                        <textarea class="form-control lsp-form" id="rto_reason" rows="3"></textarea>
                                    </div>
                                </div>
                            </div>

                        </div>

                        <div class="modal-footer">
                            <div class="float-right import-btns">
                                <button type="button" class="btn btn-danger save-btn mr-3">Cancel</button>
                                <button type="button" id="rto-submit" class="btn btn-danger save-btn">Submit</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- ------  -->

            <!-- modal 2 -->

            <div class="modal fade" id="settle" tabindex="-1" aria-labelledby="exampleModalLabel"
                aria-hidden="true">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title mb-0" id="exampleModalLabel">
                                <div class="title-section border-left-0">
                                    <p>Weight Discrepancy</p>
                                </div>
                            </h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true"><img src="/assets/images/close.png" height="30px"
                                        alt=""></span>
                            </button>
                        </div>
                        <form>
                            <div class="modal-body lsp-rto-popup">
                                <div class="row">
                                    <input type="hidden" id="settle_docket_no">
                                    <div class="col-md-3">
                                        <h6>Weight discrepancy:</h6>
                                    </div>
                                    <div class="col-md-9">
                                        <p id="weight_discrepancy">500 gms</p>
                                    </div>
                                    <div class="col-md-3">
                                        <h6>Actual weight</h6>
                                    </div>
                                    <div class="col-md-9">
                                        <p id="actual_weight">4kg</p>
                                    </div>
                                    <div class="col-md-3">
                                        <h6>Weight reported</h6>
                                    </div>
                                    <div class="col-md-9">
                                        <p id="weight_reported">3.5kg</p>
                                    </div>
                                    <div class="col-md-3">
                                        <h6>Additional Payment</h6>
                                    </div>
                                    <div class="col-md-9">
                                        <p>Rs 50</p>
                                    </div>
                                    <div class="col-md-3">
                                        <h6>Settle Price</h6>
                                    </div>
                                    <div class="col-md-3">
                                        <div class="form-group custom-form-group">
                                            <input class="form-control lsp-form" id="settling_price"
                                                name="settling_price" placeholder="" type="text" value="">
                                        </div>
                                    </div>
                                    <div class="col-md-6"></div>
                                    <div class="col-md-3">
                                        <h6>Reason for setteling</h6>
                                    </div>
                                    <div class="col-md-9">
                                        <div class="form-group custom-form-group">
                                            <textarea class="form-control lsp-form" id="settling_reason" name="settling_reason" rows="3"></textarea>
                                        </div>
                                    </div>
                                </div>

                            </div>

                            <div class="modal-footer">
                                <div class="float-right import-btns">
                                    <button type="button" class="btn btn-danger save-btn mr-3">Cancel</button>
                                    <button type="button" id="settle-submit"
                                        class="btn btn-danger save-btn">Settle</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <input type="hidden" id="multiple_order_id">

            <!-- ------  -->

        </div>
    </section>
    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="{{ asset('/js/custom-script.js') }}"></script>
    <script>
        var x = document.getElementById('reportChart');
        var reportChart = new Chart(x, {
            type: 'pie',
            data: {
                // labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
                datasets: [{
                    label: '# of Votes',
                    data: [35, 15, 45, 40],
                    backgroundColor: [
                        '#43B5F4',
                        '#89CFF5',
                        '#B4E2FB',
                        '#D4EDFB',
                    ],
                    borderWidth: 1,
                }]
            },
            options: {
                plugins: {
                    legend: {
                        display: false
                    }
                }
            }
        });

        // Chart 2

        new Chart(document.getElementById("financialChart"), {
            type: 'bar',
            data: {
                labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
                datasets: [{
                    // label: "",
                    type: "line",
                    borderColor: "#43B5F4",
                    data: [20, 70, 19, 125, 85, 125],
                    fill: false
                }, {
                    // label: "",
                    type: "bar",
                    barThickness: 30,
                    backgroundColor: "#D4EDFB",
                    data: [43, 80, 35, 90, 80, 125],
                }]
            },
            options: {
                legend: {
                    display: false
                }
            }
        });

        var status = '';
        var order_type = 'forward';
        var order_awb_no = '';
        $(document).ready(function() {
            $("#forward-datatable").DataTable({
                "language": {
                    "zeroRecords": "No record(s) found."
                },
                "autoWidth": false,
                select: {
                    style: 'os',
                    selector: 'td:first-child'
                },
                order: [
                    [1, 'asc']
                ],
                processing: true,
                serverSide: true,
                lengthChange: true,
                order: [0, 'asc'],
                searchable: true,
                bStateSave: false,

                ajax: {
                    url: "{{ url('/lsp/home-reports/table') }}",
                    data: function(d) {
                        d.status = status;
                        d.order_type = 'forward';
                        d.order_awb_no = order_awb_no;
                    }
                },

                columns: [{
                        data: 'checkbox',
                        name: 'checkbox',
                        sortable: false,
                        searchable: false
                    },
                    {
                        data: 'start_date',
                        name: 'start_date',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'docket_no',
                        name: 'docket_no',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'pickup_pincode',
                        name: 'pickup_pincode',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'delivery_pincode',
                        name: 'delivery_pincode',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'pickup_contact',
                        name: 'pickup_contact',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'delivery_contact',
                        name: 'delivery_contact',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'customers',
                        name: 'customers',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'pickupaddress',
                        name: 'pickupaddress',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'delivery_address',
                        name: 'delivery_address',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'zone',
                        name: 'zone',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'expected_pickup_time',
                        name: 'expected_pickup_time',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'expected_pickup_date',
                        name: 'expected_pickup_date',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'order_status',
                        name: 'order_status',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'action',
                        name: 'action',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                ],
                select: {
                    style: 'multi',
                },
            });

            $("#reverse-datatable").DataTable({
                "language": {
                    "zeroRecords": "No record(s) found."
                },
                "autoWidth": false,
                select: {
                    style: 'os',
                    selector: 'td:first-child'
                },
                order: [
                    [1, 'asc']
                ],
                processing: true,
                serverSide: true,
                lengthChange: true,
                order: [0, 'asc'],
                searchable: true,
                bStateSave: false,

                ajax: {
                    url: "{{ url('/lsp/home-reports/table') }}",
                    data: function(d) {
                        d.status = status;
                        d.order_type = 'reverse';
                        d.order_awb_no = order_awb_no;
                    }
                },

                columns: [{
                        data: 'checkbox',
                        name: 'checkbox',
                        sortable: false,
                        searchable: false
                    },
                    {
                        data: 'start_date',
                        name: 'start_date',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'docket_no',
                        name: 'docket_no',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'order_id',
                        name: 'order_id',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'pickupaddress',
                        name: 'pickupaddress',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'pickup_contact',
                        name: 'pickup_contact',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'pickup_pincode',
                        name: 'pickup_pincode',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'products',
                        name: 'products',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'reverse_reason',
                        name: 'reverse_reason',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                ],
                select: {
                    style: 'multi',
                },
            });

            $("#billing-datatable").DataTable({
                "language": {
                    "zeroRecords": "No record(s) found."
                },
                "autoWidth": false,
                select: {
                    style: 'os',
                    selector: 'td:first-child'
                },
                order: [
                    [1, 'asc']
                ],
                processing: true,
                serverSide: true,
                lengthChange: true,
                order: [0, 'asc'],
                searchable: true,
                bStateSave: false,

                ajax: {
                    url: "{{ url('/lsp/home-reports/billing/table') }}",
                    data: function(d) {
                        d.status = status;
                        d.order_type = order_type;
                        d.order_awb_no = order_awb_no;
                    }
                },

                columns: [{
                        data: 'start_date',
                        name: 'start_date',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'docket_no',
                        name: 'docket_no',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'order_id',
                        name: 'order_id',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'delivery_pincode',
                        name: 'delivery_pincode',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'pickup_pincode',
                        name: 'pickup_pincode',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'dimensions',
                        name: 'dimensions',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'base_charges',
                        name: 'base_charges',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'actual_mass',
                        name: 'actual_mass',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'rto_charges',
                        name: 'rto_charges',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'weight_disc_charges',
                        name: 'weight_disc_charges',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'revenue',
                        name: 'revenue',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                    {
                        data: 'delivery_type',
                        name: 'delivery_type',
                        searchable: true,
                        orderable: true,
                        defaultContent: 'NA'
                    },
                ],
                select: {
                    style: 'multi',
                },
            });
        });

        $('#firstTab .nav-link').click(function(e) {
            order_type = $(this).attr('id').slice(0, -4);
            $('.order_awb_no').val('');
            $('.order_status').selectpicker('val', '');
            status = '';
            order_awb_no = '';
            $("#" + order_type + "-datatable").DataTable().draw(true);
        });

        $('.order_awb_no').keyup(function() {
            order_awb_no = $(this).val();
            $("#" + order_type + "-datatable").DataTable().draw(true);
        })

        $('.order_status').change(function() {
            status = $(this).val();
            $("#" + order_type + "-datatable").DataTable().draw(true);
        })

        $('.bs-select-all .bs-deselect-all').click(function() {
            $("#" + order_type + "-datatable").DataTable().draw(true);
        });

        $(document).on('click', '.settle-button', function() {
            var docket_no = $(this).data('docket_no');
            $.ajax({
                method: 'POST',
                async: false,
                url: "{{ url('/lsp/get-weight-discrepancy') }}",
                data: {
                    'order_type': order_type,
                    'docket_no': docket_no,
                    '_token': '{{ csrf_token() }}'
                },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function(data) {
                    if(data == 'Amount will be transferred'){

                        Swal.fire({
                            icon: 'success',
                            title: 'Transferred',
                            text: 'Your amount will be transferred!',
                        });
                    }
                    if(data.message =='Download COF!'){

                        Swal.fire({
                            icon: 'success',
                            title: 'COF',
                            text: 'Download ypur COF!',
                        }).then(function() {
                            window.open(data.url,'_blank');
                        });
                    }
                }
            });
        });

        $(document).on('click', '#settle-submit', function() {
            var docket_no = $('#settle_docket_no').val();
            var settling_price = $('#settling_price').val();
            var settling_reason = $('#settling_reason').val();
            $.ajax({
                method: 'POST',
                async: false,
                url: "{{ url('/lsp/settlement-update') }}",
                data: {
                    'order_type': order_type,
                    'docket_no': docket_no,
                    'settling_price': settling_price,
                    'settling_reason': settling_reason,
                    '_token': '{{ csrf_token() }}'
                },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function(data) {
                    if (data.status_code == 200) {
                        $('#settle').modal('hide');
                        Swal.fire({
                            icon: 'success',
                            title: "Order Updated",
                            text: data.message,
                            type: "success",
                        });
                        $("#" + order_type + "-datatable").DataTable().draw(true);
                    } else {
                        Swal.fire({
                            icon: 'error',
                            title: 'Oops...',
                            text: 'Something went wrong!',
                        });
                    }
                },
                error: function($response) {
                    if ($response.status === 422) {
                        if (Object.size($response.responseJSON) > 0 && Object.size($response
                                .responseJSON.errors) > 0) {
                            show_validation_error($response.responseJSON.errors);
                        }
                    } else {
                        Swal.fire(
                            'Error', $response.responseJSON.message, 'warning'
                        )
                        setTimeout(function() {}, 1200)
                    }
                }
            });
        });

        $(document).on('click', '.rto-button', function() {
            var docket_no = $(this).data('docket_no');
            $('#settle_docket_no').val(JSON.stringify([docket_no]));
            $('#rto-status').modal('show');
        });

        $(document).on('click', '.bulk-rto', function() {
            var docket_no = $("#multiple_order_id").val();
            $.ajax({
                method: 'POST',
                url: "{{ url('/shipments/check-ndr') }}",
                data: {
                    'docket_no': docket_no,
                    '_token': '{{ csrf_token() }}'
                },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function(data) {
                    if (data.success) {
                        $('#settle_docket_no').val(docket_no);
                        $('#rto-status').modal('show');
                    } else {
                        Swal.fire({
                            icon: 'error',
                            title: 'Oops...',
                            text: data.message,
                        });
                    }
                }
            });
        });

        $(document).on('click', '#rto-submit', function() {
            var docket_no = $('#settle_docket_no').val();
            var rto_reason = $('#rto_reason').val();
            $.ajax({
                method: 'POST',
                url: "{{ url('/shipments/update-rto') }}",
                data: {
                    'docket_no': docket_no,
                    'status': 'rto_initiated',
                    'rto_reason': rto_reason,
                    '_token': '{{ csrf_token() }}'
                },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function(data) {
                    if (data.status_code == 200) {
                        Swal.fire(
                            'Updated!',
                            data.message,
                            'success'
                        )
                        $('#rto-status').modal('hide');
                        $("#" + order_type + "-datatable").DataTable().draw(true);
                    } else {
                        Swal.fire({
                            icon: 'error',
                            title: 'Oops...',
                            text: 'Something went wrong!',
                        });
                    }
                }
            });
        });

        $('#select_all_forward').on('click', function() {
            var id = [];
            if (this.checked) {
                $('.container_checkbox_forward').prop('checked', true);
                $('.container_checkbox_forward').each(function(){
                    id.push($(this).val());
                });
            } else {
                $('.container_checkbox_forward').prop('checked', false);
            }

            $("#multiple_order_id").val(JSON.stringify(id));

            if(id.length > 0){
                $('.bulk-rto').removeAttr("disabled");
            }else{
                $('.bulk-rto').attr("disabled", true);
            }
        });

        $(document).on('click','.container_checkbox_forward',function(){

            var id=[];

            $('.container_checkbox_forward:checked').each(function(){
                id.push($(this).val());
            });

            $("#multiple_order_id").val(JSON.stringify(id));

            if($('.container_checkbox_forward:checked').length == $('.container_checkbox_forward').length) {
                $('#select_all_forward').prop("checked", true);
            } else {
                $('#select_all_forward').prop("checked", false);
            }

            if(id.length > 0){
                $('.bulk-rto').removeAttr("disabled");
            }else{
                $('.bulk-rto').attr("disabled", true);
            }
        });
    </script>
@endsection