@extends('layouts.dashboard.app')
@section('title', 'Orders | Chemical Wholesale')
@section('content')
    <div class="cw-content">
        <div class="container-fluid">
            <div class="cw-content-inner">
                <div class="cw-content-body">
                    <div class="cw-block-head cw-block-head-sm">
                        <div class="cw-block-between d-flex justify-content-between align-items-center">
                            <div class="cw-block-head-content">
                                <h3 class="cw-block-title page-title">All Orders</h3>
                                <div class="cw-block-des text-soft">
                                    <p>Manage all your orders.</p>
                                </div>
                            </div>
                            <div class="d-lg-flex d-none">
                                <form action="{{ route('admin.orders.search') }}" method="POST">
                                    @csrf
                                    <div class="d-flex">
                                        <input type="text" name="search" placeholder="Search Orders..."
                                            class="form-control cw-search-input" value="{{ @$search['search'] }}">
                                    </div>
                                </form>
                                <a href="{{ route('admin.orders') }}" class="btn-cw-cancel ms-2">
                                    <i class="bi bi-bootstrap-reboot me-2"></i>Reset
                                </a>
                            </div>
                        </div>
                    </div>
                    @include('layouts.dashboard.flash')
                    <div class="dash-order-filter">
                        <a href="{{ route('admin.orders') }}" data-status="All"
                            class="order-filter-item {{ @$search['orderstatus'] == '' ? 'active' : '' }}" data-status="">All
                            Orders</a>
                        <a href="{{ route('admin.orders.filter', ['orderstatus' => 'pending']) }}"
                            class="order-filter-item {{ @$search['orderstatus'] == 'pending' ? 'active' : '' }}"
                            data-status="Pending">Pending</a>
                        {{-- <a href="{{ route('admin.orders.filter', ['orderstatus' => 'dispatched'])}}" class="order-filter-item {{ @$search['orderstatus'] == 'dispatched' ? 'active':'' }}" data-status="Dispatched">Dispatched</a> --}}
                        <a href="{{ route('admin.orders.filter', ['orderstatus' => 'approved']) }}"
                            class="order-filter-item {{ @$search['orderstatus'] == 'approved' ? 'active' : '' }}"
                            data-status="Approved">Accepted Order</a>
                        <a href="{{ route('admin.orders.filter', ['orderstatus' => 'paid']) }}"
                            class="order-filter-item {{ @$search['orderstatus'] == 'paid' ? 'active' : '' }}"
                            data-status="Paid">Paid</a>
                        <a href="{{ route('admin.orders.filter', ['orderstatus' => 'notpaid']) }}"
                            class="order-filter-item {{ @$search['orderstatus'] == 'notpaid' ? 'active' : '' }}"
                            data-status="NotPaid">Not Paid</a>
                        <a href="{{ route('admin.orders.filter', ['orderstatus' => 'shipped']) }}"
                            class="order-filter-item {{ @$search['orderstatus'] == 'shipped' ? 'active' : '' }}"
                            data-status="Shipped">Shipped</a>
                        <a href="{{ route('admin.orders.filter', ['orderstatus' => 'completed']) }}"
                            class="order-filter-item {{ @$search['orderstatus'] == 'completed' ? 'active' : '' }}"
                            data-status="Completed">Completed</a>
                        <a href="{{ route('admin.orders.filter', ['orderstatus' => 'cancelled']) }}"
                            class="order-filter-item {{ @$search['orderstatus'] == 'cancelled' ? 'active' : '' }}"
                            data-status="Cancelled">Cancelled</a>
                        <!-- <a href="javascript:void(0);" class="order-filter-item">Closed</a> -->
                    </div>

                    <div class="dash-order-container">
                        {{--
                        @for ($i = 0; $i < 3; $i++)
                            <div class="dash-order-item">
                                <div class="order-header">
                                    <div class="order-info">
                                        <span class="order-id">Order No: 2025165652AX-5550 | 2024-04-15</span>
                                        <span class="order-features">Money Back guaranteee | Express Delivery</span>
                                    </div>
                                    <div class="order-info-btns">
                                        <a href="/admin/orders/details" class="btn-order-link">View Details</a>
                                    </div>
                                </div>
                                <div class="order-body">
                                    <div class="order-details">
                                        <div class="seller-info">
                                            <div>
                                                <div class="seller-company">Chemical Wholescale LLC</div>
                                                <div class="seller-name">Henry Zhang</div>
                                            </div>
                                            <a class="chatnow-btn"> <i class="bi bi-chat-text me-1"></i> Chat Now</a>
                                        </div>
                                        <div class="product-info">
                                            <div class="product">
                                                <div class="product-item">
                                                    <img src="/assets/img/product-img/3.png" alt=""
                                                        class="product-item-img">
                                                    <div class="product-item-details">
                                                        <p class="product-name">Industrial grade sodium sulphate</p>
                                                        <p class="product-model">Model Number: HS0025</p>
                                                        <p class="product-price">USD $700 x 2</p>
                                                    </div>
                                                </div>
                                                <div class="payment">
                                                    <div class="d-flex ms-1">Total:
                                                        <div class="price"> USD $1400.00</div>
                                                    </div>
                                                    <div class="payment-type">
                                                        <i class="bi bi-credit-card ms-1"></i> Card
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="order-actions">
                                        <div class="status-container">
                                            <p class="status-text">Waiting for Delivery Confirmation</p>
                                            <div class="delivery-info">
                                                <div class="deliver-name">DHL Courier</div>
                                                <div class="deliver-date">2024-04-17 15.03.48</div>
                                                <a class="deliver-track-link">Tracking Details</a>
                                            </div>
                                        </div>
                                        <div class="action-container">
                                            <a href="" class="action-btn">Confirm Delivery</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endfor
                        --}}
                        @if ($orders->count() > 0)
                            @foreach ($orders as $order)
                                @php
                                    $productIds = $order->getorderitems->pluck('product_id')->toArray();
                                    //dump($productIds, Common::productNames($productIds), $order)
                                @endphp
                                <div class="dash-order-item">
                                    <div class="order-header">
                                        <div class="order-info">
                                            <span class="order-id">Order No: {{ $order->order_no }} |
                                                {{ date('m-d-Y', strtotime($order->created_at)) }}</span>
                                            {{-- <span class="order-features">Money Back guarantee | Express Delivery</span> --}}
                                        </div>
                                        <div class="order-info-btns">
                                            <a href="{{ route('admin.orders.show', ['uuid' => $order->order_uuid]) }}"
                                                class="btn-order-link">View Details</a>
                                            @if ($order->status == 'Shipped')
                                                <a href="{{ route('admin.orders.pdf', ['uuid' => $order->order_uuid]) }}"
                                                    class="btn-order-link">Invoice</a>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="order-body">
                                        <div class="order-details">
                                            <div class="seller-info">
                                                <div>
                                                    <div class="seller-company">
                                                        {{ @$order->getUser->first_name . ' ' . @$order->getUser->last_name }}
                                                    </div>
                                                    <div class="seller-name">
                                                        {{ @$order->getUser->country_code . '' . @$order->getUser->phone }}
                                                    </div>
                                                </div>
                                                {{-- <a class="chatnow-btn"> <i class="bi bi-chat-text me-1"></i> Chat Now</a> --}}
                                            </div>
                                            <div class="product-info">
                                                <div class="product">
                                                    <div class="product-item">
                                                        <!-- <img src="/assets/img/product-img/3.png" alt="" class="product-item-img"> -->
                                                        <div class="product-item-details">
                                                            <p class="product-name">{!! Common::productNames($productIds) !!}</p>
                                                            <!-- <p class="product-model">Model Number: HS0025</p>
                                                                <p class="product-price">USD $700 x 2</p> -->
                                                        </div>
                                                    </div>
                                                    <div class="payment">
                                                        <div class="d-flex ms-1">Total:
                                                            <div class="price"> USD
                                                                ${{ number_format($order->total_amount, 2) }}</div>
                                                        </div>
                                                        <div class="payment-type">
                                                            <i class="bi bi-credit-card ms-1"></i>
                                                            {{ ucfirst($order->payment_method) }}
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="order-actions">
                                            <div class="status-container">
                                                <!-- <p class="status-text">Waiting for Delivery Confirmation</p> -->
                                                <div class="delivery-info">
                                                    <div class="deliver-name">
                                                        {{ $order->shipping_provider ? $order->shipping_provider : 'DHL Express USA' }}
                                                    </div>
                                                    <div class="deliver-date">
                                                        {{ date('m-d-Y H:i:s', strtotime($order->created_at . ' +7 days')) }}
                                                    </div>
                                                    <a class="deliver-track-link ordertrack"
                                                        data-uuid="{{ $order->order_uuid }}"
                                                        href="javascript:void(0);">Operation History</a>
                                                </div>
                                            </div>
                                            <div class="action-container">
                                                <!-- <a href="javascript:void(0);" class="action-btn">Confirm Delivery</a> -->
                                                {{--
                                                <select class="form-control form-select select select-small me-3" data-id="{{$order->id}}" data-link="{{ route('admin.orders.updatestatus', ['id' => $order->id]) }}" name="orderstatus" id="orderstatus">
                                                    <option value="Pending" {{$order->status == 'Pending' ? 'selected':''}}>Pending</option>
                                                    <option value="Dispatched" {{$order->status == 'Dispatched' ? 'selected':''}}>Dispatched</option>
                                                    <option value="Shipped" {{$order->status == 'Shipped' ? 'selected':''}}>Shipped</option>
                                                    <option value="Completed" {{$order->status == 'Completed' ? 'selected':''}}>Completed</option>
                                                    <option value="Cancelled" {{$order->status == 'Cancelled' ? 'selected':''}}>Cancelled</option>
                                                    <option value="Returned" {{$order->status == 'Returned' ? 'selected':''}}>Returned</option>
                                                </select>
                                                --}}
                                                @php
                                                    $nextStatusArr = [
                                                        'Pending' => 'Approved',
                                                        'Approved' => 'Paid',
                                                        'Paid' => 'Shipped',
                                                        'NotPaid' => 'NotPaid',
                                                        'Shipped' => 'Completed',
                                                        'Completed' => 'Returned',
                                                        'Returned' => 'Returned',
                                                        'Cancelled' => 'Cancelled',
                                                    ];
                                                    $statusArr = [
                                                        'Pending' => 'Accept Order',
                                                        'Approved' => 'Paid',
                                                        'Paid' => 'Add Shipping Info',
                                                        'NotPaid' => 'Not Paid',
                                                        'Shipped' => 'Mark as completed',
                                                        'Completed' => 'Return Order ?',
                                                        'Returned' => 'Order Returned',
                                                        'Cancelled' => 'Cancelled',
                                                    ];
                                                    $textStatusArr = [
                                                        'Pending' => 'Order Pending',
                                                        'Approved' => 'Order Approved',
                                                        'Paid' => 'Order Paid',
                                                        'NotPaid' => 'Order Not Paid',
                                                        'Shipped' => 'Order Shipped',
                                                        'Completed' => 'Order Completed',
                                                        'Returned' => 'Order Returned',
                                                        'Cancelled' => 'Order Cancelled',
                                                    ];
                                                @endphp
                                                <p class="currentstatus" id="currentstatus{{ $order->id }}">
                                                    {{ @$textStatusArr[$order->status] }}</p>
                                                @if ($order->status != 'Cancelled' && $order->status != 'Completed' && $order->status != 'Returned')
                                                    @if (Common::getPermission('12'))
                                                        <!-- For Accept And Completed -->
                                                        <a href="javascript:void(0);"
                                                            style="display:{{ $order->status == 'Pending' || $order->status == 'Shipped' ? '' : 'none' }}"
                                                            class="order-status-btn orderstatus"
                                                            id="orderstatus{{ $order->id }}"
                                                            next-status="{{ $nextStatusArr[$order->status] }}"
                                                            data-status="{{ $order->status }}"
                                                            data-id="{{ $order->id }}"
                                                            data-link="{{ route('admin.orders.updatestatus', ['id' => $order->id]) }}">{{ $statusArr[$order->status] }}</a>
                                                        <!-- For Paid NOte -->
                                                        <div class="mt-2 paidnotpaid{{ $order->id }}"
                                                            style="display:{{ $order->status == 'Approved' || $order->status == 'NotPaid' ? '' : 'none' }}">
                                                            {{-- After booking is approved --}}
                                                            <a data-bs-toggle="modal" data-bs-target="#modal-paid"
                                                                data-id="{{ $order->id }}"
                                                                id="orderstatus{{ $order->id }}"
                                                                class="order-status-btn paidorderstatus">Paid</a>
                                                            <a href="javascript:void(0);"
                                                                id="orderstatus{{ $order->id }}"
                                                                data-id="{{ $order->id }}" next-status="NotPaid"
                                                                data-link="{{ route('admin.orders.updatestatus', ['id' => $order->id]) }}"
                                                                data-status="{{ $order->status }}"
                                                                class="order-status-btn red orderstatus">Not Paid</a>
                                                        </div>
                                                        <!-- For Shippment -->
                                                        <div class="mt-2 shippedNote{{ $order->id }}"
                                                            style="display:{{ $order->status == 'Paid' ? '' : 'none' }};">
                                                            {{-- After Paid option is selected --}}
                                                            <a data-bs-toggle="modal" data-bs-target="#modal-shipping"
                                                                data-id="{{ $order->id }}"
                                                                id="orderstatus{{ $order->id }}"
                                                                class="order-status-btn shiporderstatus">Add shipping
                                                                info</a>
                                                        </div>
                                                    @endif
                                                    <!-- For Cancel -->
                                                    @if (Common::getPermission('15'))
                                                        @if ($order->status != 'Completed' && $order->status != 'Cancelled')
                                                            <a href="javascript:void(0);"
                                                                class="order-status-btn red ordercancel"
                                                                id="ordercancel{{ $order->id }}"
                                                                data-id="{{ $order->id }}"
                                                                data-link="{{ route('admin.orders.updatestatus', ['id' => $order->id]) }}">Cancel
                                                                Order</a>
                                                        @endif
                                                    @endif
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        @endif
                    </div>

                    <div>
                        <nav class="d-flex align-items-center justify-content-between">
                            <div class="small">Showing {{ $orders->appends(['search' => @$search['search']])->count() }}
                                out of {{ $orders->appends(['search' => @$search['search']])->total() }}</div>
                            <ul class="pagination justify-content-end">
                                <li class="page-item {{ $orders->previousPageUrl() == '' ? 'disabled' : '' }}">
                                    <a class="page-link" href="{{ $orders->toArray()['first_page_url'] }}">First</a>
                                </li>
                                <li class="page-item {{ $orders->previousPageUrl() == '' ? 'disabled' : '' }}">
                                    <a class="page-link" href="{{ $orders->previousPageUrl() }}">Previous</a>
                                </li>
                                <li class="page-item {{ $orders->nextPageUrl() == '' ? 'disabled' : '' }}">
                                    <a class="page-link" href="{{ $orders->nextPageUrl() }}">Next</a>
                                </li>
                                <li class="page-item {{ $orders->nextPageUrl() == '' ? 'disabled' : '' }}">
                                    <a class="page-link" href="{{ $orders->toArray()['last_page_url'] }}">Last</a>
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Track Status -->
    <div class="modal fade" id="trackmodel" tabindex="-1" aria-labelledby="trackModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title h4" id="trackModalLabel">Operation History: <span id="orderNo"></span></h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pb-4">
                    <div class="timeline" id="timeline"></div>
                </div>
            </div>
        </div>
    </div>
    <!-- Model Paid -->
    <div class="modal fade" id="modal-paid" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Order Payment</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="">
                    <input type="hidden" name="orderpaidnote" id="orderpaidnote" class="orderpaidnote" value="">
                    <div class="modal-body add-product">
                        <div class="mb-3">
                            <label class="form-label">Product Notes</label>
                            <input type="text" name="note" id="paidnote" class="form-control cw-input"
                                placeholder="Payment notes" required>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary paidstatus" data-bs-dismiss="modal">Paid</button>
                        <a type="button" class="btn-formpage-cancel" data-bs-dismiss="modal">Cancel</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!-- Model Shipped -->
    <div class="modal fade" id="modal-shipping" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Enter Shipping Information</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="">
                    <input type="hidden" name="ordershipnote" id="ordershipnote" class="ordershipnote">
                    <div class="modal-body add-product">
                        <div class="p-2 bg-light rounded mb-3">
                            <label class="form-label mb-0">Order Id: <span id="ordernumber"></span></label>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="form-label">Shipping Provider</label>
                                <select name="shippingprovider" id="shippingprovider"
                                    class="form-select shippingprovider form-control">
                                    <option value="fedex">FedEx</option>
                                    <option value="ups">UPS</option>
                                    <option value="dhl">DHL</option>
                                </select>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="form-label">Tracking Id</label>
                                <input type="text" name="trackingno" id="trackingno"
                                    class="form-control trackingno cw-input" placeholder="Tracking ID" required>
                            </div>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">Shipping Notes</label>
                            <input type="text" name="note" id="shipnote" class="form-control shipnote cw-input"
                                placeholder="Shipping notes" required>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary shippedstatus"
                            data-bs-dismiss="modal">Save</button>
                        <a type="button" class="btn-formpage-cancel" data-bs-dismiss="modal">Cancel</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection
@push('css')
@endpush
@push('js')
    <script>
        var statuslink = "/admin/orders/status/";
        $(document).on('click', '.orderstatus', function(e) {
            e.preventDefault();
            var id = $(this).attr('data-id');
            var currntstatus = $(this).attr('data-status');
            var status = $(this).attr('next-status'); //$(this).val();
            var link = $(this).attr('data-link');
            var reqdata = {
                id: id,
                status: status,
            };
            // console.log(reqdata, link);
            $.ajax({
                url: link,
                type: 'POST',
                data: reqdata,
                dataType: 'json',
                context: this,
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function() {
                    $('body').append(
                        '<div class="blockUI" style="z-index: 10000; border: none; margin: 0px; padding: 0px; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgb(0, 0, 0); opacity: 0.6; cursor: wait; position: fixed;"></div>'
                        );
                },
                success: function(data) {
                    if (data.success == '1') {
                        sweetSuccess(data.msg);
                        $("#currentstatus" + id).html(data.currentText);
                        if (status == 'Approved') {
                            $(this).hide();
                            $('.paidnotpaid' + id).show();
                        } else if (status == 'Completed') {
                            $("#ordercancel" + id).remove();
                            $("#orderstatus" + id).remove();
                        } else {
                            $(this).attr('data-status', data.status);
                            $(this).attr('next-status', data.next);
                            $(this).html(data.nexttext);
                        }
                    } else {
                        sweetAlert(data.msg);
                    }
                    $("div.blockUI").remove();
                },
                error: function(result) {
                    // console.log('An error occurred: '+result.status+' '+result.statusText);
                    sweetAlert(result.responseJSON.msg);
                    $("div.blockUI").remove();
                },
                cache: false
            });
        }); // Update Status

        $('.paidorderstatus').on('click', function(event) {
            var id = $(this).attr('data-id');
            $('#orderpaidnote').val(id);
            $("#modal-paid").show();
        })
        $(document).on('click', '.paidstatus', function(e) {
            e.preventDefault();
            var id = $('#orderpaidnote').val();
            var currntstatus = 'Approved';
            var status = 'Paid'; //$(this).val();
            var link = statuslink + id;
            var reqdata = {
                id: id,
                status: status,
                note: $('#paidnote').val(),
            };
            // console.log(reqdata, link);
            $.ajax({
                url: link,
                type: 'POST',
                data: reqdata,
                dataType: 'json',
                context: this,
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function() {
                    $('body').append(
                        '<div class="blockUI" style="z-index: 10000; border: none; margin: 0px; padding: 0px; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgb(0, 0, 0); opacity: 0.6; cursor: wait; position: fixed;"></div>'
                        );
                },
                success: function(data) {
                    if (data.success == '1') {
                        sweetSuccess(data.msg);
                        $("#currentstatus" + id).html(data.currentText);
                        $('.paidnotpaid' + id).remove();
                        $('.shippedNote' + id).show();
                    } else {
                        sweetAlert(data.msg);
                    }
                    $("div.blockUI").remove();
                },
                error: function(result) {
                    // console.log('An error occurred: '+result.status+' '+result.statusText);
                    sweetAlert(result.responseJSON.msg);
                    $("div.blockUI").remove();
                },
                cache: false
            });
        }); // Update Paid Status

        $('.shiporderstatus').on('click', function(event) {

            $("#shippingprovider").val('');
            $("#trackingno").val('');
            $("#shipnote").val('');

            var id = $(this).attr('data-id');
            $('#ordershipnote').val(id);

            let url = "/admin/orders/" + id;
            var html = '';
            $("#ordernumber").html();
            $('#orderitem').html(html);
            $.ajax({
                url: url,
                type: 'GET',
                //dataType: 'json',
                success: function(response) {
                    // console.log(response);
                    $("#ordernumber").html(response.data.order_no);
                    response.data.getorderitems.map(function(val) {
                        html += `<tr>
                                    <td>
                                        <a class="text-heading font-semibold" href="javascript:void(0);">
                                            ` + val.getproduct.name + ` (` + val.getproduct.cas_number + `)
                                        </a>
                                    </td>
                                    <td>
                                        <div class="form-check-inline">
                                            <input class="form-check-input itemsshipp" data-id="` + val.id +
                            `" type="radio" name="shipping_type[` + val.id + `][]" value="Partial">
                                            <label class="form-check-label">
                                                Partial
                                            </label>
                                        </div>
                                        <div class="form-check-inline">
                                            <input class="form-check-input itemsshipp" data-id="` + val.id +
                            `" type="radio" name="shipping_type[` + val.id + `][]" value="Full">
                                            <label class="form-check-label">
                                                Full
                                            </label>
                                        </div>
                                    </td>
                                </tr>`;
                    });
                    $('#orderitem').html(html);
                },
                error: function(result) {
                    // console.log('An error occurred: '+result.status+' '+result.statusText);
                    sweetAlert(result.responseJSON.msg);
                },
            });

            $("#modal-shipping").show();
        })
        $(document).on('click', '.shippedstatus', function(e) {
            e.preventDefault();
            var id = $('#ordershipnote').val();
            var currntstatus = 'Paid';
            var status = 'Shipped'; //$(this).val();
            var link = statuslink + id;
            let jsonObject = {};
            $('.itemsshipp').each(function() {
                if ($(this).is(':checked')) {
                    itemId = $(this).attr('data-id');
                    value = $(this).val();
                    jsonObject[itemId] = {
                        0: value
                    };
                }
            });
            var reqdata = {
                id: id,
                status: status,
                provider: $("#shippingprovider").val(),
                trackingNo: $("#trackingno").val(),
                note: $("#shipnote").val(),
                shippInfo: jsonObject,
            };
            // console.log(reqdata, link, jsonObject);
            // return false;
            $.ajax({
                url: link,
                type: 'POST',
                data: reqdata,
                dataType: 'json',
                context: this,
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function() {
                    $('body').append(
                        '<div class="blockUI" style="z-index: 10000; border: none; margin: 0px; padding: 0px; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgb(0, 0, 0); opacity: 0.6; cursor: wait; position: fixed;"></div>'
                        );
                },
                success: function(data) {
                    if (data.success == '1') {
                        sweetSuccess(data.msg);
                        $("#currentstatus" + id).html(data.currentText);
                        $('.shippedNote' + id).remove();
                        $("#orderstatus" + id).attr('data-status', data.status);
                        $("#orderstatus" + id).attr('next-status', data.next);
                        $("#orderstatus" + id).html(data.nexttext);
                        $("#orderstatus" + id).show();
                    } else {
                        sweetAlert(data.msg);
                    }
                    $("div.blockUI").remove();
                },
                error: function(result) {
                    // console.log('An error occurred: '+result.status+' '+result.statusText);
                    sweetAlert(result.responseJSON.msg);
                    $("div.blockUI").remove();
                },
                cache: false
            });
        }); // Update shipment Status

        $(document).on('click', '.ordercancel', function(e) {
            e.preventDefault();
            var id = $(this).attr('data-id');
            var link = $(this).attr('data-link');
            var reqdata = {
                id: id,
                status: 'Cancelled',
            };
            // console.log(reqdata, link);
            $.ajax({
                url: link,
                type: 'POST',
                data: reqdata,
                dataType: 'json',
                context: this,
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function() {
                    $('body').append(
                        '<div class="blockUI" style="z-index: 10000; border: none; margin: 0px; padding: 0px; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgb(0, 0, 0); opacity: 0.6; cursor: wait; position: fixed;"></div>'
                        );
                },
                success: function(data) {
                    if (data.success == '1') {
                        sweetSuccess(data.msg);
                        $("#currentstatus" + id).html(data.currentText);
                        $("#orderstatus" + id).remove();
                        $('.paidnotpaid' + id).remove();
                        $('.shippedNote' + id).remove();
                        $(this).remove();
                    } else {
                        sweetAlert(data.msg);
                    }
                    $("div.blockUI").remove();
                },
                error: function(result) {
                    // console.log('An error occurred: '+result.status+' '+result.statusText);
                    sweetAlert(result.responseJSON.msg);
                    $("div.blockUI").remove();
                },
                cache: false
            });
        }); // Update Order Cancel Status

        //Get Order Track Detail
        $('.ordertrack').on('click', function() {
            let uuid = $(this).attr('data-uuid');
            let url = "/admin/orders/track/" + uuid;
            var html = '';
            $('#timeline').html(html);
            $.ajax({
                url: url,
                type: 'GET',
                //dataType: 'json',
                success: function(response) {
                    response.data.map(function(val) {
                        html += `<li>
                                <div>
                                    <p class="timeline-date">` + val.date + `</p>
                                    <p class="timeline-detail">(` + val.user + `) ` + val.status + `</p>
                                </div>
                            </li>`;
                    });
                    $('#timeline').html(html);
                    $('#orderNo').html(response.order_no);
                    $('#trackmodel').modal('show');
                },
                error: function(result) {
                    // console.log('An error occurred: '+result.status+' '+result.statusText);
                    sweetAlert(result.responseJSON.msg);
                },
            });
        });
    </script>
@endpush