@extends('company-admin-dashboard')

@section('title', $data['title'])
@section('dashboard-content')
<style>
    .modal-body table td {
        padding: 4px;
    }
</style>
    <div class="page-content" style="padding: 25px calc(24px / 2) 60px calc(24px / 2); background-color: #f7f7f9;">
        <div class="container-fluid">
            <!-- Card Container for Table Management -->

            <div class="card">
                <div class="card-header bg-white d-flex justify-content-between align-items-center"
                    style="padding: 10px 7px 10px 27px !important;">
                    <div class="d-flex align-items-center">
                        <img class="favicon-logo" src="{{ getCompanyFavicon() }}"  alt="Company Logo"  width="40px">
                        &nbsp; &nbsp;
                        <h5 class="mb-0"><b>Orders</b></h5>
                    </div>
                </div>
                <div class="card-body" style="padding: 20px 0;">
                    <div class="row date_filter">
                        {{-- <div class="col-xl-2 col-md-4">
                            <div class="form-group" style="padding-left: 20px;">
                                <div class="input-group date" id="fl_order_table_from_date" data-target-input="nearest">
                                    <input autocomplete="off" type="text"
                                        class="form-control datepicker-input border-all" placeholder="Select Date"
                                        data-date-format="dd-mm-yyyy" data-date-container='#fl_order_table_from_date'
                                        data-provide="datepicker" data-date-autoclose="true" name="order_table_from_date"
                                        id="order_table_from_date">
                                    <div class="input-group-append" data-date-container="#fl_order_table_from_date"
                                        data-toggle="datepicker">
                                        <div class="input-group-text"><i class="fa fa-calendar"></i></div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-xl-2 col-md-4">
                            <div class="form-group">
                                <div class="input-group date" id="fl_order_table_to_date" data-target-input="nearest">
                                    <input autocomplete="off" type="text"
                                        class="form-control datepicker-input border-all" placeholder="Select Date"
                                        data-date-format="dd-mm-yyyy" data-date-container='#fl_order_table_to_date'
                                        data-provide="datepicker" data-date-autoclose="true" name="order_table_to_date"
                                        id="order_table_to_date">
                                    <div class="input-group-append" data-date-container="#fl_order_table_to_date"
                                        data-toggle="datepicker">
                                        <div class="input-group-text"><i class="fa fa-calendar"></i></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-1 col-md-2">
                            <div class="mb-3">
                                <button type="submit"
                                    class="Reload_Order btn bg-lightdarkgray black btn-block">Show</button>
                            </div>
                        </div> --}}
                    </div>
                    <div class="table-toolbar d-flex justify-content-between mb-2">
                        <div id="table_buttons"></div>
                        <div class="datatable_filters">
                            <div id="datatable-search-container" class=""></div>
                            <div class="float-label-group">
                                <input type="text" id="bs-rangepicker-range" class="form-control"
                                    placeholder="Select date range" data-table="table_order_wise">
                                <label for="bs-rangepicker-range">Date Range</label>
                            </div>
                            <div class="float-label-group" id="payment_status_group">
                                <select class="form-select" name="payment_status" id="payment_status">
                                </select>
                                <label>Payment Status</label>
                            </div>
                            <div class="float-label-group" id="order_source_group">
                                <select class="form-select" name="order_source" id="order_source">
                                    <option value=""></option>
                                    <option value="shop">Shop</option>
                                    <option value="swiggy">swiggy</option>
                                    <option value="zomato">zomato</option>
                                </select>
                                <label>Order Source</label>
                            </div>
                        </div>
                    </div>

                    <div class="table-responsive table-nowrap custom-table">
                        <table id="table_order_wise"
                            class="table table-striped table-bordered dataTable no-footer dtr-inline" style="width: 100%; ">
                            <thead>
                                <th style="width:30px;">No</th>
                                <th>Date</th>
                                <th style="width:50px;">Order No</th>
                                <th>Customer Name</th>
                                <th>Customer Mobile No</th>
                                <th>Order Source</th>
                                <th>Cash</th>
                                <th>Online</th>
                                <th>Total</th>
                                <th>Employee</th>
                                <th>payment Status</th>
                                <th>Action</th>
                            </thead>
                            <tbody id="d_and_c_report" class="datecounter_content" style="text-align: center;">
                                <tr class="odd">
                                    <td valign="top" colspan="7" class="dataTables_empty">No data available in
                                        table
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot class="thead-light black f-13px  po-stick" style="text-align: center;">
                                <tr>
                                    <th rowspan="1" colspan="6">Total</th>
                                    <th rowspan="1" colspan="1" id="date_counter_totalCashAmount"
                                        style="text-align: right;">0.00</th>
                                    <th rowspan="1" colspan="1" id="date_counter_totalCardAmount"
                                        style="text-align: right;">0.00</th>
                                    <th rowspan="1" colspan="1" id="date_counter_totalAmount"
                                        style="text-align: right;">
                                        0.00</th>
                                    <th rowspan="1" colspan="3"style="text-align: right;"></th>
                                </tr>
                            </tfoot>
                        </table>
                        <div id="datatable-controls" class="d-flex justify-content-between align-items-center">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="reportOrderPrintPreview" tabindex="-1" role="dialog"
        aria-labelledby="OrderPrintPreviewLabel" style="z-index: 999999; display: none;" data-bs-backdrop="static"
        data-bs-keyboard="false">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <span class="d-flex align-items-center" style="width: 100%;">
                        <img class="favicon-logo" src="{{ getCompanyFavicon() }}"  alt="Company Logo"  width="40px">
                        <strong class="ps-2" id="reportOrderPrintPreviewLabel">Bill Preview</strong>
                    </span>
                    <button type="button" class="btn-close text-reset" id="closePrintPreviewbutton" data-bs-dismiss="modal"
                        aria-label="Close"></button>
                    <!-- <button type="button" class="close closing closebutton" data-bs-dismiss="modal" aria-label="Close" id="close">
                                                                                                                <span aria-hidden="true"><i class="fa-solid fa-xmark"></i></span> -->

                </div>
                <div class="modal-body" id="myFrame" style=" padding: 1rem;">
                    <div class="col-md-12 text-center loadingcls" style="display: none;">
                        <button type="button" class="btn btn-light waves-effect">
                            <i class="fa fa-hourglass-half bx-spin font-size-16 align-middle mr-2" aria-hidden="true"></i>
                            Loading...
                        </button>
                    </div>
                    <div id="ReportOrderDetail" style="display: block;">
                        <div class="d-flex flex-column text-center">
                            <p class="Details" style="font-weight: 500;color: #464646;">Axone Infotech,<br>Near,
                                Gajera school,<br>Katargam, Surat, Gujarat 395005<br>GST :
                                24AXNFM7624F1ZC</p>
                        </div>
                        <div class="d-flex flex-column text-center tableDetail">
                            <p style="font-weight: 500;color: #464646;" class="ftable">Table:<span class="tableid"
                                    id="tableid"></span></p>
                        </div>
                        <div class="d-flex justify-content-between align-items-end flex-row">
                            <p class="mb-0" style="font-weight: 500;color: #464646;">
                                <b style="color: #2b2b2b;">Order No. :</b><span class="fordno"
                                    id="itemOrderNo"></span><br>
                                <b style="color: #2b2b2b;">Date : </b><span class="fdate" id="itemDate"></span><br>
                            </p>
                        </div>
                        <div class="d-flex justify-content-between align-items-end flex-row">
                            <p style="font-weight: 500;color: #464646;">
                                <b style="color: #2b2b2b;">Name. : </b><span class="fname" id="itemCustomerName">One
                                    Time Customer</span><br>
                                <b style="color: #2b2b2b;">Mobile. : </b><span class="mobile" id="itemMobile">0</span>
                            </p>
                        </div>
                        <div style="width: 100%;border-collapse: collapse;">
                            <table class="fs-inherit" style="width: 100%;font-family: sans-serif;color: #8a8a8a;" id="toto">
                                <thead>
                                    <tr style="background: #5f5d5c;font-weight: 600;color: #fff;height: 28px;">
                                        <td style="width: 60%;" class="ps-2">Item</td>
                                        <td class="Hours" style="width: 20%;">Qty</td>
                                        <td class="Hours pe-2" style="width: 20%;">Amount</td>
                                    </tr>
                                </thead>
                                <tbody id="itemloop" class="itemloop">

                                </tbody>
                                <tfoot>
                                    <tr style="background: #EEE;font-weight: 600;color: #464646;">
                                        <td></td>
                                        <td>Sub Total</td>
                                        <td class="fsubt"></td>
                                        <input type="hidden" name="" value="" id="salerate">
                                    </tr>
                                    <tr style="background: #EEE;font-weight: 600;color: #464646;">
                                        <td></td>
                                        <td>GST</td>
                                        <td class="igstrate"></td>
                                    </tr>
                                    <tr style="background: #EEE;font-weight: 600;color: #464646; display:none;">
                                        <td></td>
                                        <td>SGST</td>
                                        <td class="fsgst"></td>
                                    </tr>
                                    <tr style="background: #EEE;font-weight: 600;color: #464646;">
                                        <td></td>
                                        <td>Discount</td>
                                        <td class="fdiscountamt">₹ 0</td>

                                    </tr>
                                    <tr style="background: #EEE;font-weight: 600;color: #464646;">
                                        <td></td>
                                        <td>RoundUP</td>
                                        <td class="fround">₹ 0.00</td>
                                        <input type="hidden" value="₹ 0.00" id="roundamt">
                                    </tr>
                                    <tr style="background: #EEE;font-weight: 600;color: #464646;">
                                        <td></td>
                                        <td>Total</td>
                                        <td class="ftotal"></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                        @php
                            $company = App\Models\MstCompany::where('id', '=', Auth::user()->company_id)->first();
                        @endphp



                        <div class="d-flex flex-column text-center mt-3">
                            <p class="endDetails" style="font-weight: 500;">
                                🙏 Thank you for visiting 🙏<br> <span> {{ $company->name }} </span>
                            </p>
                        </div>
                        <div class="d-flex flex-column text-center">
                            <p style="font-weight: 500;" class="ffulldate"></p>
                        </div>
                    </div>
                </div>
               {{-- @php
                    $companyId = Auth::user()->company_id;
                    $orderPrinterSetting = json_decode(App\Models\Setting::getValue('order_printer', $companyId), true) ?? [];
                    $showPrintButton = !empty($orderPrinterSetting) && !in_array('none', $orderPrinterSetting);

                     $pdfUrl = '#';
                @endphp --}}
                @php
                    $companyId = Auth::user()->company_id;

                    // Get printer setting
                    $rawSetting = App\Models\Setting::getValue('order_printer', $companyId);
                    $orderPrinterSetting = is_array($rawSetting) ? $rawSetting : json_decode($rawSetting, true);
                    $orderPrinterSetting = is_array($orderPrinterSetting) ? $orderPrinterSetting : [];

                    // Show print button if not 'none' (or empty → show all printers)
                    $showPrintButton = empty($orderPrinterSetting) || !in_array('none', $orderPrinterSetting);

                    $pdfUrl = '#';
                @endphp

                <div class="modal-footer btns">
                   @if($showPrintButton)
                        <div class="d-flex align-items-center" id="reportOrderPrintPreviewsection">
                            <label class="me-2 m-0 fw-bold">Printer:</label>
                            <select class="form-select form-select-sm" id="reportprinterSelect" style="width: 220px;">
                                <option value="">Select Printer</option>
                            </select>
                        </div>

                        <button type="button" class="ButtonPrintKot btn-custom" style="display: block;"
                            onclick="Reportprintorder()" id="Reportprintorder">Print Bill</button>
                     @else
                        <a href="{{ $pdfUrl }}" class="btn btn-primary" id="DownloadPDFBtn">Download PDF</a>
                    @endif
                </div>
            </div>
        </div>



    </div>

    {{-- Kot model --}}
    <div class="modal fade" id="ReportOrderkotPreview" tabindex="-1" role="dialog"
        aria-labelledby="OrderPrintPreviewLabel" style="padding-right: 10px; z-index: 999999; display: none;"
        data-bs-backdrop="static" data-bs-keyboard="false">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header ">
                    <span class="d-flex align-items-center" style="width: 100%;"><img
                            src="{{ asset('assets/images/logo/A_logo.png') }}" width="60"><strong class="ps-2"
                            id="OrderPrintPreviewLabel">Kot
                            Preview</strong></span>
                    <!-- <button type="button" id="Closekot" class="closekot closebutton"
                                                                                                                data-dismiss="modal" aria-label="Close">
                                                                                                                <span aria-hidden="true"><i class="fa-solid fa-xmark"></i></span>
                                                                                                          </button> -->
                    <button type="button" class="btn-close text-reset" id="closeModalButton"
                        data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="col-md-12 text-center loadingcls" style="display: none;">
                        <button type="button" class="btn btn-light waves-effect">
                            <i class="fa fa-hourglass-half bx-spin font-size-16 align-middle mr-2"></i>
                            Loading...
                        </button>
                    </div>
                    <div id="ReportOrderkot" style="display: block;">
                        <div class="d-flex flex-column text-center">
                            <p style="font-weight: 500;color: #464646;" class="ktable">Table :
                                <span class="kottable"></span><br>
                            </p>
                        </div>
                        <div class="d-flex justify-content-between align-items-end flex-row">
                            <p style="font-weight: 500;color: #464646;">
                                <b style="color: #2b2b2b;">Order No. : </b>
                                <span class="kordno"></span><br>
                                <b style="color: #2b2b2b;">Date : </b>
                                <span class="kdate"></span><br>
                            </p>
                        </div>
                        <div class="d-flex justify-content-between align-items-end flex-row">
                            <p style="font-weight: 500;color: #464646;">
                                <b style="color: #2b2b2b;">Name. : </b>
                                <span class="kname"></span>
                                <br>
                            </p>
                        </div>
                        <div style="width: 100%;border-collapse: collapse;">
                            <table style="width: 100%;font-family: sans-serif;color: #343434;">
                                <thead>
                                    <tr style="background: #5f5d5c;font-weight: 600;color: #fff;">
                                        <td style="width: 80%;" class="ps-2">Item</td>
                                        <td class="Hours pe-2" style="width: 20%;">Qty</td>
                                    </tr>
                                </thead>
                                <tbody id="reportkotitem">
                                    <tr style="border-bottom: 1px solid #EEE">
                                </tbody>
                            </table>
                        </div>
                        <div class="d-flex flex-column text-center mt-3">
                            <p style="font-weight: 500;color: red;" class="mb-0">NOTE :-
                                <span class="kordrem"></span>
                            </p>
                        </div>
                        <div class="d-flex flex-column text-center mt-1">
                            <p style="font-weight: 500;">Order BY :- Admin Admin Admin</p>
                        </div>
                        <div class="d-flex flex-column text-center">
                            <p style="font-weight: 500;" class="kfulldate"></p>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="reportPrintKot btn bg-color white" style="display: block;"
                        onclick="ReportprintDivkot()">Print Kot</button>
                </div>
            </div>
        </div>
    </div>

@endsection('dashboard-content')
@section('custom-scripts')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.68/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.68/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.4.1/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.4.1/js/buttons.colVis.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>

    <script type="text/javascript">
        var orderWisDetails = '{{ route('order.details') }}';
        var GetPaymentDetails = '{{ route('get.order.payment.details') }}';
        var searchPaymentStatus = '{{ route('search.order.payment.status') }}';
        var selectCounterPrinter = '{{ route('counter.select-printer') }}';
        var selectsettingPrinter = '{{ route('get.setting.printers') }}';
        var csrfToken = $("[name=_token").val();

        function updateFloatLabel(selectId, groupId) {
            const $group = $('#' + groupId);
            const $select = $('#' + selectId);
            if ($select.val() && $select.val() !== '') {
                $group.addClass('has-value');
            } else {
                $group.removeClass('has-value');
            }
        }
        $("#payment_status").select2({
                ajax: {
                    url: searchPaymentStatus,
                    dataType: 'json',
                    delay: 0,
                    data: function(params) {
                        return {
                            q: params.term,
                            page: params.page,
                        };
                    },
                    processResults: function(data, params) {
                        params.page = params.page || 1;
                        return {
                            results: data.results,
                            pagination: {
                                more: (params.page * 30) < data.total_count
                            }
                        };
                    },
                    cache: false
                },
                placeholder: 'please select',
                dropdownParent: $(".table-toolbar"),
            }).on('select2:select', function() {
                $('#table_order_wise').DataTable().ajax.reload();
            })
            .on('select2:select select2:clear change', function() {
                updateFloatLabel('payment_status', 'payment_status_group');
            })
            .on('select2:open', function() {
                $('#payment_status_group').addClass('has-value');
            });
        $('#order_source').select2({
                placeholder: 'Order Sorce',
                dropdownParent: $(".table-toolbar"),
            }).on('select2:select', function() {
                $('#table_order_wise').DataTable().ajax.reload();
            })
            .on('select2:select select2:clear change', function() {
                updateFloatLabel('order_source', 'order_source_group');
            })
            .on('select2:open', function() {
                $('#order_source_group').addClass('has-value');
            });
        $(document).ready(function() {
            var order_table = $('#table_order_wise').DataTable({
                "aoColumnDefs": [{
                    "bSortable": false,
                    "aTargets": []
                }],
                "order": [
                    [0, 'desc']
                ],
                "processing": true,
                "serverSide": true,
                pagingType: "full_numbers",
                "pageLength": 10,
                "ajax": {
                    "url": orderWisDetails,
                    "type": "POST",
                    "data": function(d) {
                        d._token = csrfToken;
                        d.from_date = $('#bs-rangepicker-range').data('start');
                        d.to_date = $('#bs-rangepicker-range').data('end');
                        d.payment_status = $('#payment_status').val();
                        d.order_source = $('#order_source').val();
                    },
                    "complete": function(response) {
                        const responseJSON = JSON.parse(response.responseText);

                        if (responseJSON.totals) {
                            $('#date_counter_totalCashAmount').text(responseJSON.totals.totalCashAmount
                                .toFixed(2));
                            $('#date_counter_totalCardAmount').text(responseJSON.totals
                                .totalOnlineAmount.toFixed(2));
                            $('#date_counter_totalAmount').text(responseJSON.totals.totalNetAmount
                                .toFixed(2));
                        } else {
                            console.error("Totals are undefined");
                        }
                    },
                },
                "aoColumns": [{
                        "mData": "id"
                    },
                    {
                        "mData": "saledate",
                        "render": function(data, type, row) {
                            return data ? data : "0";
                        }
                    },
                    {
                        "mData": "order_no",
                    },
                    {
                        "mData": "customer_name",
                    },

                    {
                        "mData": "mobile_no",
                    },
                    {
                        "mData": "order_source",
                    },
                    {
                        "mData": "cash"
                    },
                    {
                        "mData": "online"
                    },
                    {
                        "mData": "total"
                    },
                    {
                        "mData": "employee_name",
                    },
                    {
                        "mData": "payment_status"
                    },
                    {
                        "mData": "action",
                        orderable: false,
                        "render": function(data, type, row) {
                            return data ? data : "0";
                        }
                    },
                ],
                language: {
                    search: "",
                    searchPlaceholder: "Search Customer Name",
                    paginate: {
                        first: '<i class="bx bx-skip-previous"></i>',
                        previous: '<i class="bx bx-chevron-left"></i>',
                        next: '<i class="bx bx-chevron-right"></i>',
                        last: '<i class="bx bx-skip-next"></i>'
                    }
                },
                "dom": 'Blfrtip',
                "buttons": [
                    @if (in_array('column_visibility', $data['ordersPermissions']))
                        {
                            extend: 'colvis',
                            text: 'Column Visibility',
                            postfixButtons: ['colvisRestore']
                        },
                    @endif
                    @if (in_array('pdf_export', $data['ordersPermissions']))
                        {
                            extend: 'pdfHtml5',
                            text: 'PDF',
                            title: 'Order Wise Report',
                            exportOptions: {
                                columns: ':visible'
                            },
                        },
                    @endif
                    @if (in_array('excel_export', $data['ordersPermissions']))
                        {
                            extend: 'excelHtml5',
                            text: 'Excel',
                            title: 'Order Wise Report',
                            exportOptions: {
                                columns: ':visible'
                            }
                        },
                    @endif
                ]

            });
            order_table.buttons().container().appendTo('#table_buttons');
            $('.dataTables_filter').appendTo('#datatable-search-container');

            var a = document.querySelector("#table_order_wise thead"),
                n = a.querySelector("tr").cloneNode(true);
            a.appendChild(n);

            let searchRowTh = a.querySelectorAll("tr:nth-child(2) th");
            searchRowTh.forEach(th => {
                th.classList.remove("sorting", "sorting_asc", "sorting_desc");
                th.removeAttribute("aria-sort");
            });

            searchRowTh.forEach((e, t) => {
                let skipColumns = [0, 10, 11];

                if (skipColumns.includes(t)) {
                    e.innerHTML = "";
                    return;
                }
                var text = e.textContent;
                var input = document.createElement("input");
                input.type = "text";
                input.className = "form-control";
                input.placeholder = "Search " + text;

                e.innerHTML = "";
                e.appendChild(input);

                input.addEventListener("keyup", function() {
                    if (order_table.column(t).search() !== this.value) {
                        order_table.column(t).search(this.value).draw();
                    }
                });

                input.addEventListener("change", function() {
                    if (order_table.column(t).search() !== this.value) {
                        order_table.column(t).search(this.value).draw();
                    }
                });
            });
            $('#table_order_wise').on('length.dt', function(e, settings, len) {

                setCookie('usersPageLength', len, 100);

            });
            $('.dataTables_length').appendTo('#datatable .row');
            $('.dataTables_length select').addClass('form-select form-select-sm');

            $('.dataTables_length').appendTo('#datatable-controls');
            $('.dataTables_paginate').appendTo('#datatable-controls');

            $('.dataTables_paginate').css({
                'text-align': 'center',
                'margin-top': '20px'
            });

            $('.dataTables_length').css({
                'text-align': 'center',
                'margin-top': '20px'
            });
            $('.Reload_Order').click(function() {
                var fromDate = $('#order_table_from_date').val();
                var toDate = $('#order_table_to_date').val();
                $('#order_table_filterdatevalue').text('(' + fromDate + 'To' + toDate + ')');
                order_table.ajax.reload(null, false);
            });

        });
        $(function() {

            var start = moment().subtract(1, 'years');
            var end = moment().add(1, 'day');

            function cb(start, end, label) {
                if (label === 'All') {
                    $('#bs-rangepicker-range').val('All');
                } else {
                    $('#bs-rangepicker-range').val(start.format('DD-MM-YYYY') + ' - ' + end.format('DD-MM-YYYY'));
                }
                $('#bs-rangepicker-range').data('start', start.format('DD-MM-YYYY'));
                $('#bs-rangepicker-range').data('end', end.format('DD-MM-YYYY'));
                $('#table_order_wise').DataTable().ajax.reload();
            }

            $('#bs-rangepicker-range').daterangepicker({
                startDate: start,
                endDate: end,
                opens: 'left',
                ranges: {
                    // 'All': [moment().subtract(100, 'years'), moment().add(1,
                    // 'day')],
                    'Today': [moment(), moment()],
                    'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month': [moment().startOf('month'), moment().endOf('month')],
                    'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1,
                        'month').endOf('month')]
                }
            }, cb);
            cb(start, end);

        });

        function ReOpenModal(id) {
            // alert(id);
            var id = id;
            $.ajax({

                url: GetPaymentDetails,
                type: 'POST',
                data: {
                    order_id: id,
                    _token: '{{ csrf_token() }}',
                },
                success: function(response) {
                    // console.log(response);

                    $('.Details').css('display', 'block');
                    $('.ffulldate').css('display', 'block');
                    $('.endDetails').css('display', 'block');
                    // $('.btns').css('display', 'block');
                    $('.btns').addClass('flex-end-btn').show();

                    $('.tableDetail').css('display', 'block');

                    $('.tableid').text(response.tablename || '');
                    $('.fordno').text(response.order_no || '');
                    $('.fdate').text(response.date || '');
                    $('.fname').text(response.customer_name || '');
                    $('.mobile').text(response.mobile || '');
                    $('.itemloop').empty();

                    if (response.items && response.items.length > 0) {
                        response.items.forEach(item => {
                            $('.itemloop').append(`
                            <tr>
                                <td>${item.name}</td>
                                <td>${item.quantity}</td>
                                <td>${item.amount}</td>
                            </tr>
                        `);
                        });
                    } else {
                        $('.itemloop').append(`
                        <tr>
                            <td colspan="3" class="text-center">No items available</td>
                        </tr>
                    `);
                    }

                    // Set other details
                    $('.fcgst').text(response.igst || '₹ 0.00');
                    $('.fsgst').text(response.sgst || '₹ 0.00');
                    $('.fsubt').text(response.subtotal || '₹ 0.00');

                    $('.fdiscountamt').text(response.discount || '₹ 0.00');
                    $('.fround').text(response.round || '₹ 0.00');
                    $('.ftotal').text(response.total || '₹ 0.00');
                    $('.ffulldate').text(response.full_date);

                    url = "{{ route('open.printpreview') }}?order_id=" + id + "";
                    $('#PrintBillBtn').attr('href', url);

                    $('#reportOrderPrintPreview').modal('show');


                }
            });
            // $('#OrderPrintPreview').modal('show');
        }
        
        $('#reportprinterSelect').on('select2:open', function () {
            $('.select2-dropdown').addClass('select2-dropdown--above');
        });

        function OrderView(id) {
            var id = id;
            $.ajax({

                url: GetPaymentDetails,
                type: 'POST',
                data: {
                    order_id: id,
                    _token: '{{ csrf_token() }}',
                },
                success: function(response) {
                    // console.log(response);

                    $('.Details').css('display', 'none');
                    $('.ffulldate').css('display', 'none');
                    $('.endDetails').css('display', 'none');
                    // $('.btns').css('display', 'none');
                    $('.tableDetail').css('display', 'none');

                    $('.tableid').text(response.tablename || '');
                    $('.fordno').text(response.order_no || '');
                    $('.fdate').text(response.date || '');
                    $('.fname').text(response.customer_name || '');
                    $('.mobile').text(response.mobile || '');
                    $('.itemloop').empty();


                    if (response.items && response.items.length > 0) {
                        response.items.forEach(item => {
                            $('.itemloop').append(`
                            <tr>
                                <td>${item.name}</td>
                                <td>${item.quantity}</td>
                                <td>${item.amount}</td>
                            </tr>
                        `);
                        });
                    } else {
                        $('.itemloop').append(`
                        <tr>
                            <td colspan="3" class="text-center">No items available</td>
                        </tr>
                    `);
                    }

                    // Set other details
                    $('.fcgst').text(response.cgst || '₹ 0.00');
                    $('.fsgst').text(response.sgst || '₹ 0.00');
                    $('.fsubt').text(response.subtotal || '₹ 0.00');
                    $('.igstrate').text(response.igst || '₹ 0.00');

                    $('.fdiscountamt').text(response.discount || '₹ 0.00');
                    $('.fround').text(response.round || '₹ 0.00');
                    $('.ftotal').text(response.total || '₹ 0.00');
                    $('.ffulldate').text(response.full_date);

                    // url = "{{ route('open.printpreview') }}?order_id=" + id + "";
                    // $('#PrintBillBtn').attr('href', url);
                    let savedPrinters = @json($orderPrinterSetting ?? []);
                    if (savedPrinters.length && !savedPrinters.includes('none')) {
                        initReportPrinterSelect(savedPrinters);
                    }

                    let pdfUrl = "{{ route('open.printpreview') }}" + "?order_id=" + id;
                    $('#DownloadPDFBtn').attr('href', pdfUrl);

                    $('#reportOrderPrintPreview').modal('show');

                }
            });

            if (data.results.length === 1) {
                    const printer = data.results[0];

                    // set once
                    if (!$select.val()) {
                        const option = new Option(printer.text, printer.id, true, true);
                        $select
                            .empty()
                            .append(option)
                            .trigger('change');
                    }
                }
        }
        function initReportPrinterSelect(savedPrinterSetting = []) {

            let allowedPrinters = [];

            if (savedPrinterSetting.includes('ask')) {
                // Show all printers
                allowedPrinters = null;
            } else {
                // Show only selected printers
                allowedPrinters = savedPrinterSetting;
            }
            const $select = $('#reportprinterSelect');
             const $section = $('#reportOrderPrintPreviewsection');

            $('#reportprinterSelect').select2({
                ajax: {
                    url: selectsettingPrinter,
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return {
                            q: params.term,
                            page: params.page,
                            allowed: allowedPrinters // send allowed printers to server
                        };
                    },
                    processResults: function (data, params) {
                        params.page = params.page || 1;
                        if (data.results.length === 1) {
                                const printer = data.results[0];

                                // set once
                                if (!$select.val()) {
                                    const option = new Option(printer.text, printer.id, true, true);
                                    $select
                                        .empty()
                                        .append(option)
                                        .trigger('change');
                                }
                                setTimeout(() => {
                                    $select.prop('disabled', true);
                                    $select.next('.select2-container').hide();
                                    $section.hide(); 
                                    document.getElementById('reportOrderPrintPreviewsection').setAttribute('style', 'display: none !important');
                                }, 50);
                            }
                        return {
                            results: data.results,
                            pagination: {
                                more: (params.page * 30) < data.total_count
                            }
                        };
                    },
                    cache: true
                },
                placeholder: 'Select Printer',
                dropdownParent: $("#reportOrderPrintPreview"),
                width: 'resolve'
            });
            setTimeout(() => {
                $select.select2('open');
                setTimeout(() => {
                    $select.select2('close');
                }, 50);
            }, 200);
        }
        $(document).ready(function() {
            let savedPrinters = @json($orderPrinterSetting ?? []);
            if (savedPrinters.length && !savedPrinters.includes('none')) {
                initReportPrinterSelect(savedPrinters);
            }
        });
        function Reportprintorder() {

            let printerId = $('#reportprinterSelect').val();

            if (!printerId) {
                flasher.error('Please select a printer before printing.');
                return;
            }
            else {
                // $('#Reportprintorder').on('click', function() {
                    var divToPrint = document.getElementById('ReportOrderDetail');
                    var newWin = window.open('', 'Print-Window');
                    newWin.document.open(divToPrint);
                    newWin.document.write('<html><body onload="window.print()">' + divToPrint.innerHTML + '</body></html>');
                    newWin.document.close(divToPrint);
                    setTimeout(function() {
                        newWin.close();
                    }, 1000);
                // });
            }
            

            var divContents = document.getElementById("ReportOrderDetail").innerHTML;

            var iframe = document.createElement('iframe');
            document.body.appendChild(iframe);

            iframe.style.position = 'absolute';
            iframe.style.width = '0';
            iframe.style.height = '0';
            iframe.style.border = 'none';

            var doc = iframe.contentWindow.document;
            doc.open();
            doc.write('<html><title>Restaurant POS</title>');
            doc.write('<body style="font-family: fangsong;">');
            doc.write(divContents);
            doc.write('</body></html>');
            doc.close();

            iframe.contentWindow.focus();
            iframe.contentWindow.print();
            document.body.removeChild(iframe);
        }

        function ReportprintDivkot() {
            var divContents = document.getElementById("ReportOrderkot").innerHTML;

            var iframe = document.createElement('iframe');
            document.body.appendChild(iframe);

            iframe.style.position = 'absolute';
            iframe.style.width = '0';
            iframe.style.height = '0';
            iframe.style.border = 'none';

            var doc = iframe.contentWindow.document;
            doc.open();
            doc.write('<html><title>Restaurant POS</title>');
            doc.write('<body style="font-family: fangsong;">');
            doc.write(divContents);
            doc.write('</body></html>');
            doc.close();

            iframe.contentWindow.focus();
            iframe.contentWindow.print();
            document.body.removeChild(iframe);


        }
        $('#profile-pic').on('click', function(e) {
            e.stopPropagation();
            $('#dropdown-menu').toggle();
        });
    </script>
@endsection