@extends('layouts.master')

@section('title')
    LT-168 :: รายการตั๋ว
@endsection

@section('sub_title')
    รายการตั๋ว
@endsection

@section('content')
    <style>
        .lottery-not-found,
        .bill-not-found,
        .number-not-found,
        .type-not-found,
        .status-not-found {
            display: none !important;
        }
    </style>
    <div class="row">
        <div class="col-md-4">
            <div class="card">
                <div class="card-body border-0">
                    <div class="form-row align-items-center">
                        <div class="col">
                            <h3 class="mb-0">สาขา</h3>
                        </div>
                        <div class="col-9 text-right">
                            <select name="store_select" class="form-control" id="store_select" onchange="selectStore(this)">
                                <option disabled selected value>กรุณาระบุสาขา</option>
                                @foreach ($stores as $store)
                                    <option value="{{ $store->id }}">{{ $store->store_name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-8">
            <div class="card">
                <div class="card-body border-0">
                    <div class="form-row align-items-center">
                        <div class="col">
                            <h3 class="mb-0">ตั้งค่าการปริ้นท์</h3>
                        </div>
                        <div class="col text-right">
                            <select name="lstPrinters" class="form-control" id="lstPrinters"
                                onchange="showSelectedPrinterInfo();">
                                <option disabled selected>ไม่พบเครื่องปริ้นท์</option>
                            </select>
                        </div>
                        <div class="col text-right">
                            <select name="lstPrinterTrays" class="form-control" id="lstPrinterTrays">
                                <option disabled selected>ไม่พบเครื่องปริ้นท์</option>
                            </select>
                        </div>
                        <div class="col text-right">
                            <select name="lstPrinterPapers" class="form-control" id="lstPrinterPapers">
                                <option disabled selected>ไม่พบเครื่องปริ้นท์</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="card">
        <div class="card-header border-0">
            <div class="form-row align-items-center">
                <div class="col">
                    <h3 class="mb-0">รายการ</h3>
                </div>
                <div class="col-2 text-right">
                    <input id="search_bill" type="text" class="form-control" name="search" placeholder="ค้นหา..." oninput="filterBill(this)">
                </div>
                <div class="col-2 text-right">
                    <select id="country" class="form-control" name="country" onchange="filterLottery(this)">
                        <option selected value>ทุกหวย</option>
                        @foreach ($lotteries as $lottery)
                            <option value="{{ $lottery->country }}">{{ lotteryName($lottery->country) }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-2 text-right">
                    <input id="search_number" name="lotto_number" type="text" class="form-control" placeholder="เลขแทง..." oninput="filterNumber(this)">
                </div>
                <div class="col-2 text-right">
                    <select id="search_type" class="form-control" name="lotto_type" onchange="filterLotteryType(this)">
                        <option selected value>ทุกชนิดหวย</option>
                        <option>3 ตัวบน</option>
                        <option>3 ตัวบนโต๊ด</option>
                        <option>3 ตัวหน้า</option>
                        <option>3 ตัวล่าง</option>
                        <option>2 ตัวบน</option>
                        <option>2 ตัวล่าง</option>
                        <option>2 ตัวบนโต๊ด</option>
                        <option>วิ่ง 3 ตัวบน</option>
                        <option>วิ่ง 2 ตัวบน</option>
                        <option>วิ่ง 2 ตัวล่าง</option>
                        <option>3 ตัวแรกบน</option>
                        <option>3 ตัวแรกบนโต๊ด</option>
                        <option>2 ตัวแรกบน</option>
                        <option>4 ตัวบน</option>
                        <option>4 ตัวบนโต๊ด</option>
                        <option>4 ตัวแรกบน</option>
                        <option>4 ตัวแรกบนโต๊ด</option>
                        <option>2 ตัวบนอุดร</option>
                        <option>2 ตัวล่างอุดร</option>
                    </select>
                </div>
                <div class="col-2 text-right">
                    <select id="search_status" class="form-control" name="status" onchange="filterStatus(this)">
                        <option value disabled selected>สถานะ</option>
                        <option value>ทั้งหมด</option>
                        <option>รอชำระเงิน</option>
                        <option>รอออกรางวัล</option>
                        <option>ถูกรางวัล</option>
                        <option>ไม่ถูกรางวัล</option>
                        <option>ยกเลิก</option>
                        <option>ขึ้นเงินแล้ว</option>
                        <option>ยังไม่ขึ้นเงิน</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="card-body table-responsive py-3">
            <table class="table table-sm table-hover table-bordered">
                <thead>
                    <tr>
                        <th class="align-middle text-center font-weight-bold table-warning" data-total-bet>ยอดแทง:
                            <span>0.00</span>
                            THB
                        </th>
                        <th class="align-middle text-center font-weight-bold table-primary" data-total-discount>ส่วนลด:
                            <span>0.00</span>
                            THB
                        </th>
                        <th class="align-middle text-center font-weight-bold table-danger" data-summary>สุทธิ:
                            <span>0.00</span>
                            THB
                        </th>
                        <th class="align-middle text-center font-weight-bold table-success" data-total-prized>ยอดถูก:
                            <span>0.00</span> THB
                        </th>
                        <th class="align-middle text-center font-weight-bold table-info" data-prize-summary>
                            ยอดถูกสุทธิ: <span>0.00</span> THB</th>
                    </tr>
                </thead>
            </table>
        </div>
        <div class="card-body table-responsive pt-1">
            {{-- <button id="btn_cash_all" type="button" class="btn btn-danger mb-1" style="border-radius: 25px;">
                <i class="fas fa-hand-holding-usd"></i> ชำระเงินรายการที่เลือก
            </button> --}}
            <button id="btn_print_all" type="button" class="btn btn-primary mb-1" style="border-radius: 25px;">
                <i class="fas fa-print"></i> พิมพ์รายการที่เลือก
            </button>
            <table id="tb_cus_bill" class="table table-sm table-hover table-bordered">
                <thead>
                    <tr>
                        <th class="text-center align-middle">
                            <div class="custom-checkbox ml-3">
                                <input type="checkbox" class="custom-control-input" id="Check_All" onchange="checkAll(this)">
                                <label class="custom-control-label" for="Check_All"></label>
                            </div>
                        </th>
                        <th class="align-middle text-center">วันที่</th>
                        <th class="align-middle text-center">หวย</th>
                        <th class="align-middle text-center">เลขตั๋ว</th>
                        <th class="align-middle text-center">เบอร์โทร</th>
                        <th class="align-middle text-center">สถานะ</th>
                        <th class="align-middle text-center">ยอดแทง</th>
                        <th class="align-middle text-center">ส่วนลด</th>
                        <th class="align-middle text-center">สุทธิ</th>
                        <th class="align-middle text-center">ดำเนินการ</th>

                    </tr>
                </thead>
                <tbody class="tb_list">
                    <tr>
                        <td colspan="10" class="text-danger text-center table-danger">ไม่พบข้อมูล</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>

    <div class="modal fade" id="detail_modal" tabindex="-1" data-backdrop="static" role="dialog"
        aria-labelledby="agent_modal" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable align-items-stretch"
            role="document">
            <form id="edit_ag_data" class="modal-content h-100">
                <div class="modal-header d-block p-0">
                    <div class="form-row mt-3">
                        <div class="col-sm-12 text-center"></div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12 text-center">
                            <h3 class="text-danger" id="lbl_bill"></h3>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-6 text-center">
                            <h4 id="lbl_main_date"></h4>
                        </div>
                        <div class="col-sm-6 text-center">
                            <h4 id="lbl_cus"></h4>
                        </div>
                        <!-- <div class="col-sm-4 text-center"><h4 id="lbl_line"></h4></div> -->
                    </div>
                    <div class="row">
                        <div class="col-sm-6 text-center">
                            <h4 id="lbl_line"></h4>
                        </div>
                        <div class="col-sm-6 text-center">
                            <h4 id="lbl_bill_date"></h4>
                        </div>
                    </div>
                    <input type="hidden" id="hd_bill_no">
                </div>
                <div class="modal-body p-0">
                    <div class="table-responsive h-100">
                        <table class="table table-sm table-hover mb-0">
                            <thead>
                                <tr>
                                    <th class="align-middle text-center border-top-0">ลำดับ</th>
                                    <th class="align-middle text-center border-top-0">เลข</th>
                                    <th class="align-middle text-center border-top-0">ประเภท</th>
                                    <th class="align-middle text-center border-top-0">แทง</th>
                                    <th class="align-middle text-center border-top-0">ส่วนลด</th>
                                    <th class="align-middle text-center border-top-0">จ่าย</th>
                                    <th class="align-middle text-center border-top-0">จ่ายบาทละ</th>
                                    <th class="align-middle text-center border-top-0">สถานะ</th>
                                </tr>
                            </thead>
                            <tbody class="tb_detail"></tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer p-0">
                    <table class="table mb-0">
                        <tbody class="table_end">
                            <tr>
                                <td class="text-right p-1"><b>ยอดแทง</b></td>
                                <td class="text-center p-1"><b id="detail-bet-amount">0.00</b></td>
                                <td class="text-right p-1"><b>หักส่วนลด</b></td>
                                <td class="text-center p-1"><b id="detail-bet-discount" class="text-green">0.00</b></td>
                                <td class="text-right p-1"><b>ยอดรวม</b></td>
                                <td class="text-center p-1"><b id="detail-bet-summary" class="text-red">0.00</b></td>
                                <td class="text-right p-1"><b>ถูกรางวัล</b></td>
                                <td class="text-center p-1"><b id="detail-bet-Prizeded" class="text-green">0.00</b></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="modal-footer">
                    {{-- <div class="row">
                        <div class="col-12 col-lg d-flex align-items-baseline justify-content-center ml-auto">
                            <h2 class="cls-cash mx-1">รับเงิน</h2>
                            <input type="number" class="cls-cash clsNumberOnly txt_cash" min="0" value maxlength="6">
                            <h2 class="cls-cash mx-1">ทอนเงิน</h2>
                            <input type="number" class="cls-cash clsNumberOnly txt_cash" min="0" value maxlength="6"
                                readonly>
                        </div> --}}
                        <div class="col-12 col-lg-auto text-center">
                            <button type="button" style="display:none;" id="btn_cash" class="btn btn-danger">
                                <i class="fas fa-check"></i> ขึ้นเงิน</button>
                            {{-- <button type="button" style="display:none;" id="btn_confirm_bill" class="btn btn-success">
                                <i class="fas fa-check"></i> ชำระเงิน</button> --}}
                            <button type="button" style="display:none;" id="btn_cancel_bill" class="btn btn-danger">
                                <i class="fas fa-times"></i> ยกเลิกบิล</button>
                            <button type="button" style id="btn_print" class="btn btn-dark"><i class="fas fa-print"></i>
                                พิมพ์</button>
                            <button type="button" style="display:none;" id="btn_reprint" data-bill_id class="btn btn-dark">
                                <i class="fas fa-print"></i> อนุมัติการพิมพ์ใหม่</button>
                            <!-- <button type="button" style id="btn_printx" class="btn btn-dark" onclick="print('https://lt-168.com/invoice_store.php?reslipt=AG40101000138&show_dis=1');"><i class="fas fa-print"></i> พิมพใหม่</button> -->
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">ปิด</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade" id="otp_modal" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="otp_modal"
        aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-centered" role="document" style="width:50%;">
            <form id="detail_form" class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">ยืนยันรหัส OTP</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div style="overflow: scroll; overflow-x: hidden; overflow-y: hidden; height:450px;">
                        <div class="text-center mt-2">
                            <div class="text-center text-danger" id="txt_ref_otp"></div>
                            <input type="hidden" id="hd_ref_otp">
                        </div>
                        <div class="text-center mt-2">
                            <input type="text" id="txt_otp" class="clsNumberOnly" setx
                                style="width: 150px; font-size: 25px; text-align:center; color: #525f7f;" value
                                maxlength="4">

                            <div class="text-center mt-2">
                                <button type="button" id="btn_refresh_otp" class="btn btn-success">
                                    <i class="fa fa-refresh"></i>ขอรับรหัสผ่านใหม่</button>
                            </div>
                            <div class="text-center mt-5">
                                <div class="text-center text-danger" id="showRemain"></div>
                            </div>

                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" id="btn_confirm_otp" class="btn btn-success"><i class="fas fa-check"></i>
                            ยืนยัน</button>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">ปิด</button>
                    </div>

                </div>
            </form>
        </div>
    </div>

    <div class="modal fade" id="dialog_preview" tabindex="-1" data-backdrop="static">
        <div class="modal-dialog modal-lg modal-dialog-centered" role="document" style="width:50%;">
            <form id class="modal-content bg-secondary">
                <div class="card-header border-0">
                    <div class="text-center">
                        <div class="row">
                            <div class="col-sm-12 text-center">
                                <h1 class="text-danger">สลิป</h1>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-body">

                    <div class="card-body table-responsive py-3">
                        <!-- <div class="text-center"><p style="font-size: 1.3rem" class="mt-0">รายการเล่นหวย</p></div><hr class="mb-1"> -->
                        <div class="text-center" style="height:450px;">
                            <iframe id="frame_preview" src style="width:700px; height:430px;"></iframe>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button class="btn btn-danger" type="button" onclick="$('#dialog_preview').modal('hide');">ปิด</button>
                </div>
            </form>
        </div>
    </div>

    {{-- <div class="modal fade" id="bill_select_modal" tabindex="-1" data-backdrop="static" role="dialog"
        aria-labelledby="agent_modal" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-centered align-items-stretch" role="document">
            <form id="edit_ag_data2" class="modal-content">
                <div class="table_head_select_bill">
                    <div class="form-row mt-3">
                        <div class="col-sm-12 text-center">
                            <h2 class="text-danger">รายการชำระเงิน</h2>
                        </div>
                    </div>
                </div>
                <div class="modal-body p-0">
                    <div class="table-responsive h-100">
                        <table id="table_bill_select_cash" class="table table-sm table-hover pl-2 pr-2">
                            <thead>
                                <tr>
                                    <th class="align-middle text-center">เลขตั๋ว</th>
                                    <th class="align-middle text-center">โทร</th>
                                    <th class="align-middle text-right">ยอดแทง</th>
                                    <th class="align-middle text-right">ส่วนลด</th>
                                    <th class="align-middle text-right">สุทธิ</th>
                                    <th class="align-middle text-center">สถานะ</th>
                                </tr>
                            </thead>
                            <tbody class="tb_select_bill"></tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer p-0">
                    <table class="table mb-0">
                        <tbody class="table_end_select_bill">
                            <tr>
                                <td class="text-right p-1"><b>ยอดแแทง</b></td>
                                <td class="text-center p-1"><b id="total-bet-amount">0.00</b></td>
                                <td class="text-right p-1"><b>หักส่วนลด</b></td>
                                <td class="text-center p-1"><b id="total-bet-discount" class="text-green">0.00</b></td>
                                <td class="text-right p-1"><b>ยอดรวม</b></td>
                                <td class="text-center p-1"><b id="total-bet-summary" class="text-red">0.00</b></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="modal-footer">
                    <h2 class="cls-cash">รับเงิน</h2>
                    <input type="text" class="border-dark cls-cash clsNumberOnly txt_cash_all" value maxlength="6" oninput="this.value=this.value.replace(/\D+/g, '')">
                    <button type="button" style="display:none;" id="btn_cancel_bill" class="btn btn-danger">
                        <i class="fas fa-times"></i> ยกเลิกบิล</button>
                    <button type="button" style="display:none;" id="btn_cash" class="btn btn-danger">
                        <i class="fas fa-check"></i> ขึ้นเงิน</button>
                    <button type="button" style id="btn_confirm_bill_all" class="btn btn-success">
                        <i class="fas fa-check"></i> ชำระเงิน</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">ปิด</button>

                </div>
            </form>
        </div>
    </div> --}}

    <div class="modal fade" id="bill_reason_modal" index="10" tabindex="-1" data-backdrop="static" role="dialog"
        aria-labelledby="agent_modal" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <form id="edit_ag_data3" class="modal-content">
                <div class="table_head_select_bill">
                    <div class="form-row mt-3">
                        <div class="col-sm-12 text-center">
                            <h2 class="text-danger">กรุณาระบุเหตุผล</h2>
                        </div>
                    </div>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <input type="text" id="txt_reason" class="form-control" value maxlength="255"
                            placeholder="ระบุเหตุผล">
                    </div>
                    <div class="form-group require_pin">
                        <input type="text" id="txt_pin" class="form-control" value maxlength="6"
                            placeholder="กรุณาระบุรหัส PIN">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger text-nowrap" data-dismiss="modal"
                        onclick="$('#detail_modal').modal('show');"><i class="fas fa-times"></i>
                        ยกเลิก</button>
                    <button type="button" id="btn_cancel_ok" class="btn btn-success btn-block ml-1">
                        <i class="fas fa-check"></i> ยืนยัน</button>
                </div>
            </form>
        </div>
    </div>

@endsection

@section('scripts')
    <script src="{{ asset('assets/js/JSPrintManager/scripts/zip.js') }}"></script>
    <script src="{{ asset('assets/js/JSPrintManager/scripts/zip-ext.js') }}"></script>
    <script src="{{ asset('assets/js/JSPrintManager/scripts/deflate.js') }}"></script>
    <script src="{{ asset('assets/js/JSPrintManager/scripts/JSPrintManager.js') }}"></script>

    <script>
        'use strict';

        let current = {
            id: null,
            billId: null,
        };

        let selectMultipleId = [];

        let filterBillTimer;
        let filterNumberTimer;

        const $totalBet = document.querySelector('[data-total-bet] span');
        const $totalDiscount = document.querySelector('[data-total-discount] span');
        const $summary = document.querySelector('[data-summary] span');
        const $totalPrized = document.querySelector('[data-total-prized] span');
        const $prizeSummary = document.querySelector('[data-prize-summary] span');

        function updateSummary({totalBet, totalDiscount, summary, totalPrized, prizeSummary}) {
            $totalBet.textContent = numberFormat(totalBet, 2);
            $totalDiscount.textContent = numberFormat(totalDiscount * -1, 2);
            $summary.textContent = numberFormat(summary, 2);
            $totalPrized.textContent = numberFormat(totalPrized, 2);
            $prizeSummary.textContent = numberFormat(prizeSummary, 2);
        }

        function filter (cssPrefix, callback) {
            const table = document.getElementById('tb_cus_bill');
            const tbody = table.tBodies[0];
            const summary = {
                totalBet: 0,
                totalDiscount: 0,
                summary: 0,
                totalPrized: 0,
                prizeSummary: 0,
            };
            for (const tr of tbody.rows) {
                const found = callback(tr);
                if (found) {
                    if (+tr.dataset.status !== 2) {
                        summary.totalBet += +tr.cells[6].textContent.trim().replace(' THB', '').replace(',','');
                        summary.totalDiscount += +tr.cells[7].textContent.trim().replace(' THB', '').replace(',','')
                        summary.summary += +tr.cells[8].textContent.trim().replace(' THB', '').replace(',','')
                        const bets = JSON.parse(tr.dataset.bet);
                        for (const bet of bets) {
                            if (!bet.won) continue;
                            summary.totalPrized += bet.won;
                        }
                    }
                    tr.classList.add('type-found')
                    tr.classList.remove('type-not-found');
                } else {
                    tr.classList.add('type-not-found');
                    tr.classList.remove('type-found')
                }
                summary.prizeSummary = summary.totalPrized ? summary.totalPrized - summary.summary : 0;

                updateSummary(summary);
            }
        }

        const filterBill = input => filter('bill', tr => !input.value ? true : tr.dataset.billId.includes(input.value));
        const filterLotteryRound = select => filter('lottery-round', tr => !select.value ? true : tr.dataset.lotteryRoundId == select.value);
        const filterNumber = input => filter('number', tr => input.value ? tr.dataset.bet.includes(`"number":"${input.value}"`) : true);
        const filterLotteryType = select => filter('type', tr => select.value ? tr.dataset.bet.includes(`"${select.value}"`) : true);
        const filterStatus = select => filter('status', tr => select.value ? tr.dataset.status == select.value : true);
        const filterLottery = select => {
            // $lotteryRoundFilter.value = '';
            // $lotteryRoundFilter.onchange();
            filter('lottery', tr => !select.value ? true : tr.dataset.country === select.value)
            // for ($optGroup of $lotteryRoundFilter.children) {
            //     if ($optGroup.nodeName !== 'OPTGROUP') continue;
            //     $optGroup.hidden = !select.value ? false : $optGroup.dataset.country !== select.value;
            // }
        };

        const checkAll = async checkbox => {
            for (const el of document.querySelectorAll('.cls_checkbox')) {
                el.checked = checkbox.checked;
            }
        }

        const selectStore = selectBox => {
            const storeId = selectBox.value;
            const formData = new FormData();
            formData.append('store_id', storeId);
            tryCatchSwal(async () => {
                const result = await fetchJson(`{{ route('agent.getStoreBills') }}`, 'POST', formData);
                if (!result) return false;

                if (result.length === 0) {
                    return document.querySelector('.tb_list').innerHTML =
                        `<tr><td colspan="10" class="text-danger text-center table-danger">ไม่พบข้อมูล</td></tr>`;
                }

                let betPrized = 0;
                let betAmount = 0;
                let betDiscount = 0;
                let betSummary = 0;

                let output = '';
                let n = 0;

                for (const key in result) {
                    const item = result[key];
                    n++;
                    if (item.status !== 2) {
                        betAmount = betAmount + item.amount;
                        betDiscount = betDiscount + item.discount;
                        betSummary = betSummary + item.payment;
                    }
                    for (const i in item.bet) {
                        const bet = item.bet[i];
                        if (bet.won) {
                            betPrized = betPrized + (+bet.won);
                        }
                    }

                    output = output + (
                        `<tr
                            data-bill-id="${item.bill_id}"
                            data-country="${item.country}"
                            data-lottery-round-id="${item.lottery_round_id}"
                            data-status="${item.status}"
                            data-bet='${JSON.stringify(item.bet)}'
                            ${item.prize_payment_status === 1 ? 'hidden' : ''}
                        >
                            <td class="text-center align-middle">
                                <div class="custom-checkbox ml-3">
                                    <input type="checkbox" class="cls_checkbox custom-control-input" data-bill-id="${ item.bill_id }" data-id="${ item.id }" data-status='${ item.status }' data-print-status='${ item.print_status }'
                                        id="Check_${ key }">
                                    <label class="custom-control-label" for="Check_${ key }"></label>
                                </div>
                            </td>
                            <td class="align-middle font-weight-bold text-center px-1">
                                ${ formattedDatetime(item.created_at) }<br>
                                <small>IP ADDR: ${ item.ip_address }</small>
                            </td>
                            <td data-country="${item.country}" class="align-middle font-weight-bold text-center px-1">
                                <span class="badge badge-default text-sm">${ lotteryName(item.country) }</span>
                                ${ item.lottery_round.round_name
                                    ? `<div class="small mt-1 text-black-50">${item.lottery_round.round_name }</div>`
                                    : ``
                                }
                            </td>
                            <td class="align-middle text-center text-danger font-weight-bold cls_bill_id">
                                ${ item.bill_id }
                            </td>
                            <td class="align-middle text-center font-weight-bold">${ item.phone }</td>
                            <td class="align-middle text-center font-weight-bold">
                                <span style="width:85px;" class="badge badge-pill badge-${ billStatus(item)['color'] } text-xs">${ billStatus(item)['text'] }</span>
                            </td>
                            <td class="align-middle text-center font-weight-bold">
                                ${ numberFormat(item.amount) } THB
                            </td>
                            <td class="align-middle text-center font-weight-bold text-success">
                                -${ numberFormat(item.discount) } THB
                            </td>
                            <td class="align-middle text-center font-weight-bold text-primary">
                                ${ numberFormat(item.payment) } THB
                            </td>
                            <td class="align-middle text-center font-weight-bold">
                                <button class="btn btn-danger btn-sm cls_btn_detail" data-toggle="modal"
                                    data-target="#detail_modal" data-bill="${ item.bill_id }" data-id="${ item.id }"
                                    data-customer="${ item.phone }" data-line
                                    data-main_date="${ item.created_at }"
                                    data-bill_date="${ item.created_at }"
                                    data-status='${ JSON.stringify(billStatus(item)) }'>
                                        <i class="fas fa-tasks mr-1"></i>
                                        <span>จัดการ</span></button>
                                ${ item.lottery_round.status
                                    ?  `<a class="btn btn-success btn-sm cls_btn_detail_add text-white"
                                            href="{{ route('store.staffBet') }}?phone=${ item.phone }"
                                            data-bill="${ item.bill_id }"
                                            target="_blank"
                                        >
                                            <i class="fas fa-plus mr-1"></i>
                                            <span>เพิ่มตั๋ว</span>
                                        </a>`
                                    : ``
                                }
                            </td>
                        </tr>`
                    );
                }

                $('[data-total-bet] span').text(numberFormat(betAmount, 2));
                $('[data-total-discount] span').text(numberFormat(betDiscount, 2));
                $('[data-summary] span').text(numberFormat(betSummary, 2));
                $('[data-total-prized] span').text(numberFormat(betPrized, 2));
                $('[data-prize-summary] span').text(numberFormat(betPrized ? betPrized - betSummary : 0, 2));


                document.querySelector('.tb_list').innerHTML = output;
            });
            document.getElementById('search_bill').value = '';
            document.getElementById('search_number').value = '';
            document.getElementById('search_type').value = '';
            document.getElementById('search_status').value = '';
        }

        var iCountDown;
        let clientPrinters;

        function print(link) {
            if (jspmWSStatus()) {

                //Create a ClientPrintJob
                var cpj = new JSPM.ClientPrintJob();

                //Set Printer info
                var myPrinter = new JSPM.InstalledPrinter($('#lstPrinters').val());
                myPrinter.paperName = $('#lstPrinterPapers').val();
                myPrinter.trayName = $('#lstPrinterTrays').val();

                cpj.clientPrinter = myPrinter;

                //Set PDF file
                var my_file = new JSPM.PrintFilePDF(link, JSPM.FileSourceType.URL, 'MyFile.pdf', 1);
                // my_file.printRotation = JSPM.PrintRotation[$('#lstPrintRotation').val()];
                // my_file.printRange = $('#txtPagesRange').val();
                // my_file.printAnnotations = $('#chkPrintAnnotations').prop('checked');
                // my_file.printAsGrayscale = $('#chkPrintAsGrayscale').prop('checked');
                // my_file.printInReverseOrder = $('#chkPrintInReverseOrder').prop('checked');

                cpj.files.push(my_file);

                //Send print job to printer!
                return cpj.sendToClient();
            }
        }

        function showSelectedPrinterInfo() {
            // get selected printer index
            var idx = $("#lstPrinters")[0].selectedIndex;
            // get supported trays
            // var options = '<option>Document[Feed,Cut]</option>';
            var options = '';
            for (var i = 0; i < clientPrinters[idx].trays.length; i++) {
                options += '<option>' + clientPrinters[idx].trays[i] + '</option>';
            }
            $('#lstPrinterTrays').html(options);
            // get supported papers
            options = '';
            for (var i = 0; i < clientPrinters[idx].papers.length; i++) {
                options += '<option>' + clientPrinters[idx].papers[i] + '</option>';
            }
            $('#lstPrinterPapers').html(options);
        }

        function jspmWSStatus() {
            if (JSPM.JSPrintManager.websocket_status == JSPM.WSStatus.Open) return true;
            else if (JSPM.JSPrintManager.websocket_status == JSPM.WSStatus.Closed) {
                // alert('JSPrintManager (JSPM) is not installed or not running! Download JSPM Client App from https://neodynamic.com/downloads/jspm');
                return false;
            }
            // else if (JSPM.JSPrintManager.websocket_status == JSPM.WSStatus.BlackListed) {
            //     alert('JSPM has blacklisted this website!');
            //     return false;
            // }
        }
        // JSPM.JSPrintManager.license_url = "../jspm";
        JSPM.JSPrintManager.auto_reconnect = true;
        JSPM.JSPrintManager.start();
        JSPM.JSPrintManager.WS.onStatusChanged = function () {
            if (jspmWSStatus()) {
            //get client installed printers
            JSPM.JSPrintManager.getPrintersInfo().then(function(printersList) {
                clientPrinters = printersList;
                var options = '';
                for (var i = 0; i < clientPrinters.length; i++) {
                    options += '<option>' + clientPrinters[i].name + '</option>';

                    // $.post('main_2.php?cm=getPrinterInfo', {clientPrintersName:clientPrinters[i].name}, function(response){
                    //
                    // });
                }
                $('#lstPrinters').html(options);
                // _this.showSelectedPrinterInfo();

                // options = '<option>EPSON TM-T82 Receipt</option>';
                // $('#lstPrinters').html(options);
                // options = '<option>Document[Feed,Cut]</option>';
                // $('#lstPrinterTrays').html(options);
                // options = '<option>Roll Paper 80 x 297 mm</option>';
                // $('#lstPrinterPapers').html(options);
            });
            }
        };

        let bill_detail_payment = 0;

        $(document).ready(function() {

            document.querySelector('#btn_print_all').addEventListener('click', async e => {
                e.preventDefault();
                const all = [];
                const printable = [];
                const cancelled = [];
                const printed = [];
                for (const el of document.querySelectorAll('.cls_checkbox:checked')) {
                    all.push(el.dataset.id);
                    if (+el.dataset.status < 2 && +el.dataset.printStatus === 0) {
                        printable.push(el.dataset.billId);
                    } else if (+el.dataset.status === 2) {
                        cancelled.push(el.dataset.billId)
                    } else {
                        printed.push(el.dataset.billId);
                    }
                }
                let text = `คุณเลือกบิลทั้งหมด ${ all.length } บิล\n\n- บิลสามารถพิมพ์ได้ ${ printable.length } ใบ\n`;
                for (const i in printable) {
                    text = text + printable[i] + `\n`;
                }
                text = text + `\n- บิลพิมพ์ไปแล้ว ${ printed.length } ใบ\n`;
                for (const i in printed) {
                    text = text + printed[i] + `\n`;
                }
                text = text + `\n- บิลยกเลิก ${ cancelled.length } ใบ\n`;
                for (const i in cancelled) {
                    text = text + cancelled[i] + `\n`;
                }
                text = text + `\nคุณยินยันที่จะพิมพ์หรือไม่`;
                
                const confirm = await swal({
                    title: 'ยืนยันการพิมพ์',
                    text: text,
                    icon: 'warning',
                    dangerMode: printed.length || cancelled.length,
                    buttons: {
                        cancel: 'ยกเลิก',
                        confirm: {
                            text: 'ยืนยัน',
                            closeModal: false,
                        }
                    },
                });

                if (!confirm) return;

                const printWithDiscount = await swal('พิมพ์ตั๋ว', ' ', 'info', {
                    buttons: {
                        cancel: 'ไม่มีส่วนลด',
                        confirm: {
                            text: 'มีส่วนลด',
                            closeModal: false,
                        }
                    }
                });

                const jsonBill = JSON.stringify(all);
                const url = `{{ route('bill.index') }}/receipt/0?ids=${jsonBill}${printWithDiscount ? `&show_discount=1` : ``}`;
                const printResult = await print(url);
                // window.open(url);
                console.log(printResult);

                if (printResult === 'OK') {
                    swal('ดำเนินการสำเร็จ', 'สั่งพิมพ์เรียบร้อย', 'success');
                    for (const el of document.querySelectorAll('input[type=checkbox]')) {
                        el.checked = false;
                    }
                    selectStore(document.querySelector('#store_select'));
                } else {
                    swal('ขออภัย', 'พบปัญหาในขั้นตอนการพิมพ์บิล', 'error');
                }
                
                return true;
            });

            $("#btn_cancel_bill").click(function() {
                $('#bill_reason_modal').modal('show');
                $("#txt_reason").val("");
                $("#txt_reason").focus();
            });

            $("#btn_cancel_ok").click(function() {
                let bill = $("#hd_bill_no").val();
                let reason = $("#txt_reason").val();
                let pin = $("#txt_pin").val();
                if (reason == "") {
                    const target = reason == "" ? 'เหตุผล' : 'รหัส PIN';
                    swal('ขออภัย', `กรุณาระบุ${target}`, 'warning').then((sure) => {
                        $("#txt_reason").focus();
                    });
                    return false;
                }

                $.ajax({
                    url: `{{ route('bill.index') }}/${bill}`,
                    method: 'DELETE',
                    dataType: 'JSON',
                    data: {
                        pin: pin,
                        reason: reason,
                    },
                    success: function(res) {
                        if (res.success) {
                            selectStore(document.querySelector('#store_select'));
                            swal('ยกเลิกโพยเรียบร้อย', ' ', 'success', {
                                buttons: false,
                                timer: 1500
                            });
                            $("#detail_modal").modal("hide");
                            $('#bill_reason_modal').modal('hide');
                        } else {
                            swal('ยกเลิกโพยไม่สำเร็จ', res.text, 'error');
                        }
                    }
                });
            });

            $("#btn_cash").click(function() {
                let bill = $("#hd_bill_no").val();

                $.post('main_store.php?cm=checkBetOTP', {
                    bill: bill
                }, function(d) {

                    if (d.success) {
                        if (d.check) {
                            $("#txt_otp").val("");
                            $("#txt_ref_otp").text("หมายเลขอ้างอิง : " + d.ref);
                            $("#hd_ref_otp").val(d.ref);

                            let difftime = d.time;
                            let time = difftime.split(":");
                            //alert(difftime);
                            let m = time[1];
                            let s = time[2];

                            timeout_otp = (1000 * 60 * 5) - (1000 * 60 * m) + (1000 * s);

                            iCountDown = setInterval("countDown()", 1000);
                            $("#otp_modal").modal("show");
                            $("#txt_otp").focus();
                        } else {
                            let msg = "ยืนยันการทำรายการ?";
                            if (d.send) {
                                msg = "เกินเวลาที่กำหนด ยืนยันการทำรายการอีกครั้ง?";
                            }
                            swal(msg, ' ', 'warning', {
                                buttons: ['ยกเลิก', 'ยืนยัน']
                            }).then((sure) => {
                                if (sure) {
                                    //$.post('main_store.php?cm=generateOTP', {bill:bill}, function(data){
                                    $.post('Mailer/send_otp.php', {
                                        bill: bill
                                    }, function(data) {
                                        if (data.success) {
                                            $("#txt_otp").val("");
                                            $("#txt_ref_otp").text(
                                                "หมายเลขอ้างอิง : " + data.ref);
                                            $("#hd_ref_otp").val(data.ref);
                                            timeout_otp = 1000 * 60 * 5;
                                            //timeout_otp = 10000;
                                            iCountDown = setInterval("countDown()",
                                                1000);
                                            $("#otp_modal").modal("show");
                                            $("#txt_otp").focus();
                                        }
                                    }, 'json');
                                }
                            });
                        }
                    }
                }, 'json');
            });

            $("#btn_refresh_otp").click(function() {
                clearInterval(iCountDown);
                let bill = $("#hd_bill_no").val();
                //$.post('main_store.php?cm=generateOTP', {bill:bill}, function(data){
                $.post('Mailer/send_otp.php', {
                    bill: bill
                }, function(data) {
                    if (data.success) {
                        $("#txt_otp").val("");
                        $("#txt_ref_otp").text("หมายเลขอ้างอิง : " + data.ref);
                        $("#hd_ref_otp").val(data.ref);
                        timeout_otp = 1000 * 60 * 5;
                        //timeout_otp = 10000;
                        iCountDown = setInterval("countDown()", 1000);
                        //$("#otp_modal").modal("show");
                        $("#txt_otp").focus();
                    }
                }, 'json')

            });

            $('.txt_cash:eq(0)').on('keyup', function() {
                if ($(this).val() == '' || $(this).val() == null) {
                    var result = 0;
                } else {
                    var total = parseFloat(bill_detail_payment);
                    var change = parseFloat($(this).val());
                    var result = parseFloat(change - total);

                    if (result <= 0) {
                        result = 0;
                    }
                }
                $('.txt_cash:eq(1)').val(result.toFixed(2));
                // console.log(total, change, result.toFixed(2));
            });

            $(".txt_cash:eq(0)").keypress(function(event) {

                var keycode = (event.keyCode ? event.keyCode : event.which);
                if (keycode == '13') {
                    $("#btn_confirm_bill").trigger("click");
                    event.preventDefault();
                }

            });

            $(".txt_cash_all").keypress(function(event) {
                var keycode = (event.keyCode ? event.keyCode : event.which);

                if (keycode == '13') {
                    $("#btn_confirm_bill_all").trigger("click");
                    event.preventDefault();
                }

            });

            $("#detail_modal").on('shown.bs.modal', () => $(".txt_cash:eq(0)").focus());

            // $("#bill_select_modal").on('shown.bs.modal', () => $(".txt_cash_all").focus());

            $("#otp_modal").on('hide.bs.modal', () => clearInterval(iCountDown));

            $("#detail_modal").on('hide.bs.modal', function() {
                $("#btn_cancel_bill").hide();
                $("#btn_cash").hide();
                $("#btn_confirm_bill").hide();
                $('.tb_detail').html("");
                //actions you want to perform after modal is closed.
            });

            $("#txt_otp").keypress(function(e) {
                if (e.which == 13) {

                    $("#btn_confirm_otp").trigger("click");
                    e.preventDefault();
                }

            });

            $("#btn_confirm_otp").click(function() {
                let bill = $("#hd_bill_no").val();
                let ref = $("#hd_ref_otp").val();
                let pass = $("#txt_otp").val();

                $.post('main_store.php?cm=checkOTP', {
                    bill: bill,
                    ref: ref,
                    pass: pass
                }, function(data) {
                    if (data.success) {
                        if (data.check) {
                            swal('ทำรายการเรียบร้อย', ' ', 'success', {
                                buttons: false,
                                timer: 1500
                            });
                            clearInterval(iCountDown);
                            $("#otp_modal").modal("hide");
                            $("#detail_modal").modal("hide");
                            selectStore(document.querySelector('#store_select'));
                        } else {
                            swal('โปรดตรวจสอบ', 'รหัสไม่ถูกต้อง กรุณาลองใหม่', 'warning').then((
                                sure) => {
                                $("#txt_otp").val("");
                                $("#txt_otp").focus();
                            });
                        }
                    }

                }, 'json');

            });

            $("#btn_confirm_bill").click(function() {

                if ($(".txt_cash:eq(0)").val() == "") {
                    swal('โปรดตรวจสอบ', "กรุณาระบุยอดเงิน", 'warning').then((sure) => {
                        $(".txt_cash:eq(0)").focus();
                    });

                    return false;
                }

                var total = +$("#detail-bet-summary").text().replaceAll(',', '');
                var cash = +$(".txt_cash:eq(0)").val();
                if (isNaN(cash)) {
                    cash = 0;
                }
                if (total > cash) {
                    swal('โปรดตรวจสอบ', 'ยอดรับเงินน้อยกว่ายอดแทง', 'warning').then((sure) => {
                        $(".txt_cash:eq(0)").focus();
                    });
                    return false;
                }

                swal('ยืนยันการทำรายการ?', ' ', 'warning', {
                    buttons: ['ยกเลิก', 'ยืนยัน']
                }).then((sure) => {
                    if (!sure) return;
                    let bill = $("#hd_bill_no").val();
                    $.post(`/agent/bill/confirm/${bill}`, {
                        bill,
                        cash
                    }, function(data) {
                        if (!data.success) {
                            return swal('ไม่สามารถทำรายการได้', data.text, 'error');
                        }
                        selectStore(document.querySelector('#store_select'));
                        swal('ทำรายการเรียบร้อย', ' ', 'success', {
                            buttons: ['ปิด', 'พิมพ์ตั๋ว']
                        }).then((sure) => {
                            swal('พิมพ์ตั๋ว', ' ', 'info', {
                                buttons: ['ไม่มีส่วนลด', 'มีส่วนลด']
                            }).then((sure) => {
                                if (jspmWSStatus()) {
                                    $("#btn_print").prop('disabled',
                                        true);
                                    if (sure) {
                                        print(`{{ route('bill.index') }}/receipt/${bill}?show_discount=1`);
                                    } else {
                                        print(`{{ route('bill.index') }}/receipt/${bill}`);
                                    }
                                } else {
                                    swal('ไม่พบเครื่องปริ้น!!',
                                        'กรุณาตั้งค่าเครื่องปริ้นให้ถูกต้อง',
                                        'warning');
                                }
                            });
                        });
                        $("#detail_modal").modal("hide");
                    }, 'json');
                });

            });

            $("#btn_print").click(function() {
                let bill = $("#hd_bill_no").val();
                // console.log(bill);
                swal('พิมพ์ตั๋ว', ' ', 'info', {
                    buttons: ['ไม่มีส่วนลด', 'มีส่วนลด']
                }).then((sure) => {
                    $("#btn_print").prop('disabled', true);
                    $("#btn_reprint").show().prop('disabled', false);
                    // if (sure) {
                    //     // print('/invoice_store.php?reslipt=' + bill + '?show_discount=1');
                    //     window.open(`{{ route('bill.index') }}/receipt/${bill}`);
                    // } else {
                    //     print('/invoice_store.php?reslipt=' + bill);
                    // }
                    if (jspmWSStatus()) {
                        $("#btn_print").prop('disabled', true);
                        if (sure) {
                            print(`{{ route('bill.index') }}/receipt/${bill}?show_discount=1`);
                            // window.open(`{{ route('bill.index') }}/receipt/${bill}`);
                        } else {
                            print(`{{ route('bill.index') }}/receipt/${bill}`);
                        }
                        selectStore(document.querySelector('#store_select'));
                    } else {
                        swal('ไม่พบเครื่องปริ้น!!', 'กรุณาตั้งค่าเครื่องปริ้นให้ถูกต้อง', 'warning');
                    }
                });
            });

            // $("#btn_cash_all").click(function() {
            //     selectMultipleId = [];
            //     for (const el of document.querySelectorAll('.cls_checkbox:checked')) {
            //         selectMultipleId.push(el.dataset.id);
            //     }

            //     if (selectMultipleId.length === 0) {
            //         swal('โปรดตรวจสอบ', 'กรุณาเลือกรายการที่ต้องการชำระเงิน', 'warning').then((sure) => {});
            //         return false;
            //     }

            //     $.post(`{{ route('bill.showMultiple') }}`, {
            //         bill_ids: JSON.stringify(selectMultipleId)
            //     }, function(data) {
            //         let total_amount = 0;
            //         let total_discount = 0;
            //         let total_payment = 0;
            //         $('.tb_select_bill').html('');
            //         for (const item of data) {
            //             total_amount = total_amount + (item.status == 0 ? item.amount : 0);
            //             total_discount = total_discount + (item.status == 0 ? item.discount : 0);
            //             total_payment = total_payment + (item.status == 0 ? item.payment : 0);
            //             const itemStatus = billStatus(item);
            //             const tr = $('<tr/>').addClass(item.status > 0 ? 'bg-light-danger' : '').append(
            //                 $('<td/>').addClass('align-middle text-center').text(item.bill_id),
            //                 $('<td/>').addClass('align-middle text-center').text(item.phone),
            //                 $('<td/>').addClass('align-middle text-right').text(numberFormat(item.amount)),
            //                 $('<td/>').addClass('align-middle text-right text-success').text(numberFormat(item.discount)),
            //                 $('<td/>').addClass('align-middle text-right text-danger').text(numberFormat(item.payment)),
            //                 $('<td/>').addClass(`align-middle text-center font-weight-bold text-${itemStatus.color}`).text(itemStatus.text),
            //             );
            //             $('.tb_select_bill').append(tr);
            //         }
            //         $('.total-payment').val(total_payment);
            //         $('#total-bet-amount').text(numberFormat(total_amount));
            //         $('#total-bet-discount').text(numberFormat(total_discount));
            //         $('#total-bet-summary').text(numberFormat(total_payment));

            //         $('#edit_ag_data2 .cls-cash').show();
            //         $('#btn_confirm_bill_all').show();
            //         if (total_payment === 0) {
            //             $('#edit_ag_data2 .cls-cash').hide();
            //             $('#btn_confirm_bill_all').hide();
            //         }
            //         $(".txt_cash_all").val("");
            //         $("#bill_select_modal").modal("show");
            //     }, 'json');

            // });

            $("#btn_confirm_bill_all").click(function() {
                //$("#bill_select_modal").modal("show");
                if ($(".txt_cash_all").val() == "") {
                    swal('โปรดตรวจสอบ', "กรุณาระบุยอดเงิน", 'warning').then((sure) => {
                        $(".txt_cash_all").focus();
                    });

                    return false;
                }
                var total = +$(".total-payment").val();
                var cash = +$(".txt_cash_all").val().replace(/[^0-9.-]+/g, "");
                if (isNaN(cash)) {
                    cash = 0;
                }

                if (total > cash) {
                    swal('โปรดตรวจสอบ', 'ยอดรับเงินน้อยกว่ายอดแทง', 'warning').then((sure) => {
                        $(".txt_cash_all").focus();
                    });
                    return false;
                }

                var bill_list = [];
                $.each($("#table_bill_select_cash tbody tr"), function(index, value) {
                    let b = $(value).closest("tr").find(".cls_bill_id").text();
                    bill_list.push(b);
                });

                swal('ยืนยันการทำรายการ?', ' ', 'warning', {
                    buttons: ['ยกเลิก', 'ยืนยัน']
                }).then((sure) => {
                    if (sure) {

                        $.post('main_store.php?cm=confirm_multi_bill', {
                            bill: bill_list,
                            cash: cash
                        }, function(data) {
                            if (data.success) {
                                swal('ทำรายการเรียบร้อย', ' ', 'success', {
                                    buttons: false,
                                    timer: 1500
                                });
                                $("#bill_select_modal").modal("hide");
                                //load_bill_customer();
                                //$("#frame_preview").attr("src", '/invoice_store.php?reslipt='+bill+'&show_dis=1');
                                selectStore(document.querySelector('#store_select'));
                                load_store_credit()
                                $("#frame_preview").attr("src",
                                    '/invoice_store.php?reslipt=' + bill_list +
                                    '&show_dis=1');
                                $("#dialog_preview").modal("show");

                                //selectStore(document.querySelector('#store_select'));
                            } else {
                                swal('Error!!', data.code, 'error');
                            }
                        }, 'json')
                    }
                });


            });

            $(document).on('click', ".tb_list .cls_btn_detail", function() {
                let e = $(this);
                var id = $(this).data('id');
                var bill = $(this).data('bill');
                var cus = $(this).data('customer');
                var line = $(this).data('line');
                var bill_date = $(this).data('bill_date');
                var main_date = $(this).data('main_date');
                const status = $(this).data('status');
                console.log(status);
                $('#detail_modal').find('#lbl_bill').text('เลขตั๋ว :  ' + bill);
                $('#detail_modal').find('#lbl_main_date').text('งวดวันที่ :  ' + formattedDatetime(main_date, false));
                $('#detail_modal').find('#lbl_cus').text('ลูกค้า :  ' + cus);
                $('#detail_modal').find('#lbl_line').text('ไลน์ส่วนลด :  ' + line);
                $('#detail_modal').find('#lbl_bill_date').text(formattedDatetime(bill_date));
                $("#hd_bill_no").val(id);
                $(".txt_cash").val("");
                current.id = id;
                current.billId = bill;
                load_detail_table(id, bill)
                    .then(() => {
                        $('#detail_modal').modal('show');
                    });
            });

            $("#btn_reprint").on('click', function() {
                swal('ยืนยันการอนุมัติ?', 'หมายเลขบิล: ' + current.billId, 'info', {
                    buttons: ['ยกเลิก', 'ยืนยัน']
                }).then((sure) => {
                    if (sure) {
                        $.post(`{{ route('bill.index') }}/confirm/${current.id}`, {
                            bill_id: current.billId
                        }, function(data) {
                            if (data) {
                                $("#btn_reprint").hide();
                                $("#btn_print").prop('disabled', false);
                                swal('อนุมัติการปริ้นใหม่เรียบร้อย', ' ', 'success', {
                                    buttons: false,
                                    tiner: 1500
                                });
                            } else {
                                swal('Error!!', ' ', 'error');
                            }
                            selectStore(document.querySelector('#store_select'));
                        });
                    }
                });
            });

            // setTimeout(() => {
            //     selectStore(document.querySelector('#store_select'));
            // }, 1500);

        });

        function load_detail_table(id, bill_id) {
            return $.getJSON(`{{ route('bill.index') }}/${id}`, function(data) {
                let n = 0;
                let betPrized = 0;
                $('.tb_detail').html('');
                for (const item of data.bet) {
                    n++;
                    const itemStatus = {
                        color: item.won ? 'text-success' : 'text-danger',
                        text: item.won ? 'ถูกรางวัล' : 'ไม่ถูกรางวัล',
                    };
                    if (data.status <= 2) {
                        itemStatus['color'] = 'text-muted';
                        itemStatus['text'] = 'รอออกผล';
                    }
                    const tr = $('<tr/>').append(
                        $('<td/>').addClass('align-middle text-center').text(n),
                        $('<td/>').addClass('align-middle text-center text-danger').text(item.number),
                        $('<td/>').addClass('align-middle text-center').text(item.type),
                        $('<td/>').addClass('align-middle text-center').text(numberFormat(item.amount)),
                        $('<td/>').addClass('align-middle text-center text-success').text(numberFormat(item.discount)),
                        $('<td/>').addClass('align-middle text-center text-danger').text(numberFormat(item.payment)),
                        $('<td/>').addClass('align-middle text-center').text(data.commission_line_detail[item.type] ? numberFormat(data.commission_line_detail[item.type]?.payment) : 'ไม่มีข้อมูล'),
                        $('<td/>').addClass(`align-middle text-center font-weight-bold ${itemStatus.color}`).text(itemStatus.text),
                    );
                    $('.tb_detail').append(tr);
                    if (item.won) {
                        betPrized += +item.won;
                    }
                }

                $('#lbl_line').text('ไลน์ส่วนลด :  ' + data.commission_line);

                $('#detail-bet-amount').text(numberFormat(data.amount));
                $('#detail-bet-discount').text(numberFormat(data.discount));
                $('#detail-bet-summary').text(numberFormat(data.payment));
                $('#detail-bet-Prizeded').text(numberFormat(betPrized));
                bill_detail_payment = data.payment;
                $("#btn_cancel_bill").hide();
                $("#btn_cash").hide();
                $("#btn_confirm_bill").hide();
                $(".cls-cash").hide();
                $("#btn_print").hide();
                $('.table_end').html(data.data_sum);

                let status = data.status;
                let otp_stat = data.otp_stat;
                let print = data.print_status;

                if (status) {
                    $("#btn_print").show();
                    $("#btn_cancel_bill").show();
                } else {
                    $(".cls-cash").show();
                    $("#btn_confirm_bill").show();
                }

                if (status) {
                    $("#btn_print").show();
                    $("#btn_cancel_bill").show();
                } else {
                    $(".cls-cash").show();
                    $("#btn_confirm_bill").show();
                }

                if (print) {
                    $("#btn_reprint").show().prop('disabled', false);
                    $("#btn_print").prop('disabled', true);
                } else {
                    $("#btn_reprint").hide().prop('disabled', true);
                    $("#btn_print").prop('disabled', false);
                }

                if (status >= 2) {
                    $('#btn_cancel_bill').hide();
                }

                if (status === 2) {
                    $("#btn_print").prop('disabled', true);
                    $("#btn_print").hide();
                }
            });
        }

    </script>
    {{-- <script src="https://js.pusher.com/7.0/pusher.min.js"></script>
    <script>
        $(document).ready(function() {

            var pusher = new Pusher('40f8857ae79f8ffda546', {
                cluster: 'ap1'
            });

            var channel = pusher.subscribe(`reportMinitor.` + {
                {{ Auth::user()->id }}
            });
            channel.bind('FormSubmit', function(data) {
                selectStore(document.querySelector('#store_select'));
            });
        });
    </script> --}}

@endsection