@extends('layouts.master')

@section('title')
    LT-99 :: หน้าร้าน
@endsection

@section('sub_title')
    หน้าร้าน
@endsection

@section('title_right_side')
    <button id="btn_finish" type="button" class="btn btn-danger">จบการทำรายการ</button>
@endsection

@if ($openingRound)
    @section('content')
        <style>
            /* .active {
                color: black !important;
                background-color: #F0F8FF !important;
                border: 2px dotted black !important;
            } */

            .opt:hover {
                color: black !important;
                background-color: #FFFAFA;
                box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08) !important;
            }

            div#loadPage {
                margin: auto;
                width: 100%;
                height: 100%;
                z-index: 500;
                text-align: center;
            }

            .btn-num {
                font-size: 20px;
                font-weight: bold;
                border-width: 2px !important;
            }

            .opt {
                border-width: 2px !important;
                font-size: 18px;
                font-weight: bold;
                width: 125px;
                border-radius: 50px;
            }

            .txt_d {
                background-color: rgba(229, 229, 229, 0.2);
                border-radius: 2px;
                border: solid 2px #000000;
                font-weight: bold;
                color: black !important;
                width: 55px;
                height: 55px;
                font-size: 25px;
                text-align: center;
            }

            .txt_money {
                background-color: rgba(229, 229, 229, 0.2);
                border-radius: 2px;
                border: solid 2px #000000;
                font-weight: bold;
                color: black !important;
                width: 120px;
                height: 55px;
                font-size: 25px;
                text-align: center;
            }
            .cls_badge {
                /* font-weight:bold !important; */
                font-size: 14px;
            }

            .border-left-primary {
                border-left: 0.5rem solid #4e73df !important;
            }

            .border-left-success {
                border-left: 0.5rem solid #1cc88a !important;
            }

            .border-left-info {
                border-left: 0.5rem solid #36b9cc !important;
            }

            .border-left-warning {
                border-left: 0.5rem solid #f6c23e !important;
            }

            .border-left-danger {
                border-left: 0.5rem solid #e74a3b !important;
            }

            .pb-2,
            .py-2 {
                padding-bottom: 0.5rem !important;
            }

            .pt-2,
            .py-2 {
                padding-top: 0.5rem !important;
            }

            .shadow {
                box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.15) !important;
            }

            .card {
                position: relative;
                display: flex;
                flex-direction: column;
                min-width: 0;
                word-wrap: break-word;
                background-color: #fff;
                /* background-clip: border-box; */
                border: 1px solid #e3e6f0;
                border-radius: 0.35rem;
            }

            .card-bet-type:hover {
                background-color: #E8F3FE;
                cursor: pointer;
            }

            .card-bet-select {
                background-color: #E8F3FE;
            }

            .marquee {
                height: 50px;
                overflow: hidden;
                position: relative;
                background: rgb(0, 0, 0);
                background: linear-gradient(267deg, rgba(0, 0, 0, 1) 0%, rgba(29, 29, 29, 1) 49%, rgba(0, 0, 0, 1) 100%);
                color: white !important;
                border: 1px solid;
                border-radius: 15px;
                margin: 5px;
            }

            .marquee p {
                position: absolute;
                width: 100%;
                height: 50px;
                margin: 0;
                line-height: 50px;
                text-align: center;
                /* Starting position */
                -moz-transform: translateX(100%);
                -webkit-transform: translateX(100%);
                transform: translateX(100%);
                /* Apply animation to this element */
                -moz-animation: scroll-left 22s linear infinite;
                -webkit-animation: scroll-left 22s linear infinite;
                animation: scroll-left 22s linear infinite;
            }

            .bg-red {
                background-color: #ad060e !important;
            }

            .bg-dark-red {
                background-color: #930006 !important;
            }

            .border-red {
                border-color: #ad060e !important;
            }

            .border-dark-red {
                border-color: #81050c !important;
            }

            /* Move it (define the animation) */
            @-moz-keyframes scroll-left {
                0% {
                    -moz-transform: translateX(100%);
                }

                100% {
                    -moz-transform: translateX(-100%);
                }
            }

            @-webkit-keyframes scroll-left {
                0% {
                    -webkit-transform: translateX(100%);
                }

                100% {
                    -webkit-transform: translateX(-100%);
                }
            }

            @keyframes scroll-left {
                0% {
                    -moz-transform: translateX(100%);
                    /* Browser bug fix */
                    -webkit-transform: translateX(100%);
                    /* Browser bug fix */
                    transform: translateX(100%);
                }

                100% {
                    -moz-transform: translateX(-100%);
                    /* Browser bug fix */
                    -webkit-transform: translateX(-100%);
                    /* Browser bug fix */
                    transform: translateX(-100%);
                }
            }

        </style>
        <div class="row h-100">
            <div class="col-md-12 cls_customer_info">
                <div class="card h-100" style="color:black;">
                    <div class="card-body">
                        <h1 class="text-center">ยินดีต้อนรับ</h1>
                        {{-- <hr class="mb-1"> --}}
                        <div class="row">
                            <div class="col-md-4 mx-auto">
                                <div class="row mt-5">
                                    <div class="form-group col-md-12 mb-0">
                                        <div class="form-group text-center">
                                            <img src="{{ asset('assets/images/logo.png') }}"
                                                class="img-fluid w-100">
                                        </div>
                                    </div>
                                    <div class="form-group col-md-12 mb-0">
                                        <div class="form-group">
                                            <label>เบอร์โทรศัพท์</label>
                                            <input type="text" class="form-control form-control-lg num_pad alignRight"
                                                id="txt_cus_phone" name="cus_phone" placeholder="กรุณาระบุเบอร์โทร" required
                                                maxlength="12">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-footer border-0">
                        <div class="text-center mt-3">
                            <button id="btn_to_select_type" type="button" class="btn btn-lg btn-danger"
                                style="width:120px; border-radius: 50px;">ทำรายการ</button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-12 cls_select_type" style="display:none;">
                <div class="card" style="color:black;">
                    <div class="card-body" style="min-height:450;">
                        <div class="row">
                            <div class="col-md-4"><button id="btn_to_customer_info" type="button" class="btn btn-danger"
                                    style="width:120px; border-radius: 50px;"><i class="fas fa-chevron-left"></i>
                                    ย้อนกลับ</button></div>
    
                            <div class="col-md-4">
                                <div class="text-center">
                                    <h1>เลือกหวย</h1>
                                </div>
                                <br class="mb-1">
                            </div>
                            <div class="col-md-4"></div>
                        </div>
    
                        <div class="container-fluid">
                            <div class="row justify-content-center">

                                @foreach ($lotteries as $key => $lottery)
                                    @php
                                        $latestRound = $lottery->lotteryRound()->with('numberLimit')->where([['status', '=', 1], ['close', '>=', date('Y-m-d H:i:s')]])->latest()->first();
                                        $storeCommission = $store->storeCommission->where('country', $lottery->country)->first();
                                        $available = $latestRound && $storeCommission;
                                        if (isLotteryType($lottery->country) && $available) {
                                            $lotteryCommission = $store->lotteryCommission()->whereCountry($lottery->country)->/* where('lottery_round_id', $latestRound->id)-> */first();
                                            if (!$lotteryCommission) {
                                                $available = false;
                                            } else {
                                                $lotteryCommission = json_encode($lotteryCommission ? $lotteryCommission->commission : null);
                                            }
                                        } else {
                                            $lotteryCommission = null;
                                        }
                                        $encodedCommission = json_encode($storeCommission->commission ?? null);
                                        $encodedNumberLimit = $available ? $latestRound->numberLimit->where('user_id', 1)->toJson() : null;
                                    @endphp
                                    <div class="col-12 col-sm-6 col-lg-4 col-xxl-3 text-center mb-4">
                                        <label class="card-bet-type h-100 w-100" data-key="{{ ++$key }}">
                                            <input type="radio" data-key="{{ $key }}" 
                                                name="country" {{ !$available ? 'disabled' : '' }} 
                                                value="{{ $lottery->country }}"
                                                id="lottery-{{ $lottery->country }}" hidden
                                                data-commission="{{ $encodedCommission }}"
                                                data-lottery-commission="{{ $lotteryCommission }}"
                                                data-number-limit="{{ $encodedNumberLimit }}">
                                            <div class="card shadow border-0 h-100" style="filter: grayscale({{ $available ? '0' : '1' }}); opacity: {{ $available ? 1 : 0.5 }};">
                                                <div class="card-header bg-dark-red bg-gradient d-flex align-items-center px-3 py-2">
                                                    <div class="bg-white p-1 rounded my-1 mr-2">
                                                        <div class="rounded-circle border border-dark lottery-country"
                                                            style="width: 30px; height: 30px; background-size: cover; background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Flag_of_Thailand.svg/1200px-Flag_of_Thailand.svg.png);">
                                                        </div>
                                                    </div>
                                                    <div class="text-left ml-1">
                                                        <h2 class="text-white mb-0 font-weight-bold">{{ $lottery->name }}</h2>
                                                        <p class="mb-0 text-white small">
                                                            <span data-result="{{ $lottery->country }}" data-date="{{ $available ? $latestRound->display_date : null }}">{{ $available ? THdatetime($latestRound->display_date) : null}}</span>
                                                            ปิดรับทายผล <span data-result="{{ $lottery->country }}" data-time>{{ $available ? explode(' ', $latestRound->close)[1] : null }}</span> น.</p>
                                                    </div>
                                                </div>
                                                <div class="card-body d-flex flex-column justify-content-center px-3 py-2">
                                                    <div
                                                        class="alert alert-danger mb-0 d-flex justify-content-center align-items-baseline flex-wrap">
                                                        <div class="px-1 text-right text-nowrap">เหลือเวลาทางผล :</div>
                                                        <div class="px-1">
                                                            <h5 class="mb-0">
                                                                <span class="badge badge-secondary text-sm remain_{{ $lottery->country }}" data-remain="{{ $available ? $latestRound->close : null }}"></span>
                                                            </h5>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </label>
                                    </div>
                                @endforeach

                            </div>
                        </div>
    
                    </div>
                    <div class="card-footer border-0" hidden>
                        <div class="text-center">
                            <button id="btn_to_select_line" type="button" class="btn btn-lg btn-danger"
                                style="width:120px; border-radius: 50px;">ถัดไป</button>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-header">
                                <div class="row">
                                    <h1 class="col mb-0">รายการแทง</h1>
                                    {{-- <div class="col-auto">
                                        <button id="btn_cash_all" type="button" class="btn btn-danger">ชำระเงินรายการที่เลือก</button>
                                    </div> --}}
                                </div>
                            </div>
                            <div class="card-body table-responsive py-3">
                                <table id="tb_cus_bill" class="table table-sm table-hover table-bordered">
                                    <thead class="thead-light">
                                        <tr>
                                            <th class="text-body align-middle text-center">วันที่</th>
                                            <th class="text-body align-middle text-left">หวย</th>
                                            <th class="text-body align-middle text-center">เลขตั๋ว</th>
                                            {{-- <th class="text-body align-middle text-left">ลูกค้า</th>
                                            <th class="text-body align-middle text-left">โทร</th> --}}
                                            <th class="text-body align-middle text-right">ยอดแทง</th>
                                            <th class="text-body align-middle text-right">ส่วนลด</th>
                                            <th class="text-body align-middle text-right">สุทธิ</th>
                                            <th class="text-body align-middle text-center">สถานะ</th>
                                            <th class="text-body align-middle text-center">รายละเอียด</th>
    
                                        </tr>
                                    </thead>
                                    <tbody class="tb_cus_bill">
                                        <tr>
                                            <td class="align-middle text-center" colspan="9">** ไม่มีรายการ **</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
    
            <div class="col-md-12 cls_select_packet" style="display:none;">
                <div class="card h-100" style="color:black;">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-4"><button id="btn_back_select_type" type="button" class="btn btn-danger"
                                    style="width:120px; border-radius: 50px;"><i class="fas fa-chevron-left"></i>
                                    ย้อนกลับ</button></div>
                            <div class="col-md-4">
                                <div class="text-center">
                                    <h1>เลือกแพ็คเกจ</h1>
                                </div>
                                <br class="mb-1">
                            </div>
                            <div class="col-md-4"></div>
                        </div>
                        <div class="row h-100">
                            <div class="col-md-12">
                                <!-- <div class="text-center"><p style="font-size: 1.3rem" class="mt-0">เลือกแพ็คเกจทายผล</p></div><hr class="mb-1"> -->
                                <div class="row h-100">
                                    <div class="text-center col-12 mb-2">
                                        {{-- <a class="btn btn-default select_line"
                                            style="color: white; font-size:16px;border-radius: 30px;" data-line="A"> LINE A</a>
                                        <a class="btn btn-default select_line"
                                            style=" color: white; font-size:16px;border-radius: 30px;" data-line="B"> LINE B</a> --}}
                                        <a class="btn btn-success select_line"
                                            style=" color: white; font-size:16px;border-radius: 30px;" data-line="C"><i
                                                class="fa fa-check-circle"></i> LINE C</a>
                                    </div>
                                    <input type="hidden" id="now_line" value="C" name="now_line">
                                    <div class="border-bottom border-top col-12" style="min-height: 450px; max-height: 50vh; overflow: auto;">
                                        @foreach ($commissions->commission as $line => $lines)
                                            <table id="tb_line_{{ $line }}" data-table-line="{{ $line }}" class="table table-striped table-dark table-sm table-hover table-bordered border-top-0 border-bottom-0 tb_line_{{ $line }}"
                                                style="display: none;">
                                                <thead>
                                                    <tr>
                                                        <th class="align-middle text-lg text-center">ประเภท</th>
                                                        <th class="align-middle text-lg text-center">ส่วนลด</th>
                                                        <th class="align-middle text-lg text-center">การจ่าย</th>
                                                    </tr>
                                                </thead>
                                                <tbody></tbody>
                                            </table>
                                        @endforeach
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-footer border-0">
                        <div class="text-center mt-3">
                            <!-- <button id="btn_back_select_type" type="button" class="btn btn-danger" style="width:120px; border-radius: 50px;"><ย้อนกลับ</button> -->
                            <button id="btn_select_line" type="button" class="btn btn-lg btn-danger"
                                style="width:120px; border-radius: 50px;">ถัดไป</button>
                            <!-- เลือกแพ็คเกจ -->
    
                        </div>
    
                    </div>
                </div>
            </div>
    
            <div class="col-md-6 cls_create_poy mb-4 mb-md-0" style="display:none;">
                <div class="card h-100 mb-0">
                    <div class="card-header row no-gutters">
                        <div class="col-md-6 text-left">
                            <button id="btn_back_select_line" type="button" class="btn btn-danger"
                                style="width:120px; border-radius: 50px;"><i class="fas fa-chevron-left"></i>
                                ย้อนกลับ</button>
                            <!-- <a href="#" class="font-weight-bold text-primary text-uppercase mb-1" style="font-size:28px;">หวยรัฐบาล</a> -->
                        </div>
                        <div class="col-md-6 text-right">
                            <button id="poy-list-btn" type="button" class="btn btn-dark"
                                style="color: white; font-size:16px;border-radius: 30px;"><i
                                    class="fas fa-list text-grey" aria-hidden="true" style="font-size:18px;"></i>
                                ดึงโพย</button>
                            <a id="btn_select_packet" class="btn btn-success d-none"
                                style="color: white; font-size:16px;border-radius: 30px;"><i
                                    class="fa fa-check-circle"></i> LINE C</a>
                        </div>
                    </div>
                    <div class="card-body align-middle pt-3">
                        <div>
                            <div class="text-center">
                                <button class="opt opt_3 opt_teng_bon_3 btn btn-outline-danger mt-1 lottery-type-depend" data-lottery='["TH", "LA", "HN", "HV"]' type="button"
                                    data-type="3">3 ตัวบน</button>
                                <button class="opt opt_3 opt_teng_bon_first_3 btn btn-outline-danger mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="3">3 ตัวแรกบน</button>
                                <button class="opt opt_3 opt_teng_lang_3 btn btn-outline-danger mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="3">3 ตัวล่าง</button>
                                <button class="opt opt_3 opt_teng_nha_3 btn btn-outline-danger mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="3">3 ตัวหน้า</button>
                                <!-- <button class="opt opt_3 opt_tode_3 btn btn-danger" type="button" data-type="3" style="border-radius: 50px;">3 ตัวโต๊ด</button>
                                <button class="opt opt_3 opt_shuffle_3 btn btn-danger" type="button" data-type="3" style="border-radius: 50px;">3 ตัวกลับ</button> -->
                            </div>
    
                            <div class="text-center mt-2">
                                <button class="opt opt_2 opt_teng_bon_2 btn btn-outline-primary mt-1 lottery-type-depend" data-lottery='["TH", "LA", "HN", "HV"]' type="button"
                                    data-type="2">2 ตัวบน</button>
                                <button class="opt opt_2 opt_teng_bon_first_2 btn btn-outline-primary mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="2">2 ตัวแรกบน</button>
                                <button class="opt opt_2 opt_teng_lang_2 btn btn-outline-primary mt-1 lottery-type-depend" data-lottery='["TH", "LA", "HN", "HV"]' type="button"
                                    data-type="2">2 ตัวล่าง</button>
                                <button class="opt btn btn-outline-primary bet_two option2btn 2option mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="2" id="option_2_19" style="display: none;">19 ประตู</button>
                            </div>
    
                            <div class="text-center mt-2">
                                <button class="opt opt_1 opt_teng_bon_1 btn btn-outline-success mt-1 lottery-type-depend" data-lottery='["TH", "LA", "HN", "HV"]' type="button"
                                    data-type="0">วิ่ง 3 บน</button>
                                <button class="opt opt_1 opt_teng_bon_2x btn btn-outline-success mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="0">วิ่ง 2 บน</button>
                                <button class="opt opt_1 opt_teng_lang_1 btn btn-outline-success mt-1 lottery-type-depend" data-lottery='["TH", "LA", "HN", "HV"]' type="button"
                                    data-type="0">วิ่งล่าง</button>
                            </div>

                            <div class="text-center mt-2 mb-2">
                                <button class="opt opt_4 opt_teng_bon_4 btn btn-outline-warning mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="0">4 ตัวบน</button>
                                <button class="opt opt_4 opt_teng_nha_bon_4 btn btn-outline-warning mt-1 lottery-type-depend" data-lottery='["TH"]' type="button"
                                    data-type="0">4 ตัวแรกบน</button>
                            </div>

                            <div class="text-center mt-2 mb-2">
                                <button class="opt opt_6 opt_teng_lottery btn btn-outline-warning mt-1 lottery-type-depend" data-lottery='["LT"]' type="button"
                                    data-type="0">ล็อตเตอรี่</button>
                            </div>

                            <div class="text-center mt-2 mb-2">
                                <button class="opt opt_6 opt_teng_number btn btn-outline-warning mt-1 lottery-type-depend" data-lottery='["LN"]' type="button"
                                    data-type="0">เลข</button>
                            </div>

                            <div class="bg-option p-1 pb-0 mt-1 rounded " id="2option" style="display:none;">
                                <!-- <i class="fas fa-bars"></i> ตัวเลือกเพิ่มเติม  -->
                                <div class="d-flex flex-lg-row justify-content-around align-content-stretch flex-wrap">
                                    <button class="btn btn-outline-danger btn-sm bet_two option2btn lottery-type-depend" data-lottery='["TH", "LA", "HN", "HV"]' id="option_2_19">
                                        19 ประตู </button>
                                </div>
                            </div>

                            {{-- <div class="row text-danger text-center">
                                <div class="col-sm-12 text-center lottery-type-depend" data-lottery='["TH", "LA", "HN", "HV"]' style="font-weight:bold;">
                                    * = กลับหมด , / = โต๊ด
                                </div>
                            </div> --}}
    
                        </div>
    
                        <form id="bet_num" class="mt-4">
                            <div class="text-center mt-2 row no-gutters justify-content-center">
                                <div class="col-12 col-sm-auto mb-2 d-flex">
                                    <!-- <label>หมายเลขทดสอบ</label><br/> -->
                                    <input type="text" class="clsNumberOnly txt_d txt_d_1 mr-1 ml-auto" setx value maxlength="1" readonly disabled>
                                    <input type="text" class="clsNumberOnly txt_d txt_d_2 mr-1" setx value maxlength="1" readonly disabled>
                                    <input type="text" class="clsNumberOnly txt_d txt_d_3 mr-1" setx value maxlength="1" readonly disabled>
                                    <input type="text" class="clsNumberOnly txt_d txt_d_4 mr-1 d-none" setx value maxlength="1" readonly disabled>
                                    <input type="text" class="clsNumberOnly txt_d txt_d_5 mr-1 d-none" setx value maxlength="1" readonly disabled>
                                    <input type="text" class="clsNumberOnly txt_d txt_d_6 mr-1 d-none" setx value maxlength="1" readonly disabled>
                                </div>
                                <div class="col-12 col-sm-auto mb-2 d-flex">
                                    <!-- <label class="cls_spacial_opt">>></label> -->
                                    <i class="fa fa-question-circle mx-1 my-auto" style="font-size:28px;"></i>
                                </div>
                                <input type="hidden" class="txt_d txt_option cls_spacial_opt" setx value maxlength="1"
                                    title="* = กลับทุกประตู , / = โต๊ด" style="display: inline-block;">
                                <div class="col-12 col-sm-auto mb-2 btn-group btn-group-toggle lottery-type-depend" data-toggle="buttons" data-lottery='["TH", "LA", "HN", "HV"]'>
                                    <label class="btn border border-dark border-right-0 p-3 active">
                                        <input type="checkbox" name="optionsNew" id="option1" value checked> ตรง
                                    </label>
                                    <label class="btn border border-dark border-right-0 p-3">
                                        <input type="checkbox" name="optionsNew" id="option2" value="/"> โต๊ด
                                    </label>
                                    <label class="btn border border-dark p-3">
                                        <input type="checkbox" name="optionsNew" id="option3" value="*"> กลับ
                                    </label>
                                </div>
                                <div class="col-12 col-sm-auto mb-2">
                                    <input type="text" class="clsNumberOnly txt_money mr-auto mx-1" setx value maxlength="6"
                                        placeholder="ราคา" readonly disabled>
                                </div>
                            </div>
                        </form>
                        <div id="resultoption" style="min-height:40px;">
                            <div class="text-center mt-2">
                                <span class="cls_badge badge badge-danger font-weight-light d-none"
                                    id="teng_bon_3_label">3ตัวบน</span>
                                <span class="cls_badge badge badge-danger font-weight-light d-none"
                                    id="teng_bon_first_3_label">3ตัวแรกบน</span>
                                <span class="cls_badge badge badge-danger font-weight-light d-none"
                                    id="tode_3_label">3ตัวโต๊ด</span>
                                <span class="cls_badge badge badge-danger font-weight-light d-none"
                                    id="shuffle_3_label">กลับ3ตัว</span>
                                <span class="cls_badge badge badge-danger font-weight-light d-none"
                                    id="teng_lang_3_label">3ตัวล่าง</span>
                                <span class="cls_badge badge badge-danger font-weight-light d-none"
                                    id="teng_lang_nha_3_label">3ตัวหน้า</span>
                                <span class="cls_badge badge badge-primary font-weight-light d-none"
                                    id="teng_bon_2_label">2ตัวบน</span>
                                <span class="cls_badge badge badge-primary font-weight-light d-none"
                                    id="teng_bon_first_2_label">2ตัวแรกบน</span>
                                <span class="cls_badge badge badge-primary font-weight-light d-none"
                                    id="teng_lang_2_label">2ตัวล่าง</span>
                                <span class="cls_badge badge badge-primary font-weight-light d-none"
                                    id="shuffle_2_label">กลับ2ตัว</span>
                                <span class="cls_badge badge badge-success font-weight-light d-none" 
                                    id="teng_bon_1_label">วิ่ง 3 บน</span>
                                <span class="cls_badge badge badge-success font-weight-light d-none" 
                                    id="teng_bon_2x_label">วิ่ง 2 บน</span>
                                <span class="cls_badge badge badge-success font-weight-light d-none"
                                    id="teng_lang_1_label">วิ่งล่าง</span>
                                <span class="cls_badge badge badge-danger font-weight-light d-none" 
                                    id="option_2_19_label">19 ประตู</span>
                                <span class="cls_badge badge badge-secondary font-weight-light d-none"
                                    id="option_2_ble_label">เลขเบิ้ล</span>
                                <span class="cls_badge badge badge-secondary font-weight-light d-none"
                                    id="option_2_roodnha_label">รูดหน้า</span>
                                <span class="cls_badge badge badge-secondary font-weight-light d-none"
                                    id="option_2_roodlung_label">รูดหลัง</span>
                                <span class="cls_badge badge badge-secondary font-weight-light d-none"
                                    id="option_2_low_label">สองตัวต่ำ</span>
                                <span class="cls_badge badge badge-secondary font-weight-light d-none"
                                    id="option_2_high_label">สองตัวสูง</span>
                                <span class="cls_badge badge badge-secondary font-weight-light d-none"
                                    id="option_2_odd_label">สองตัวคี่</span>
                                <span class="cls_badge badge badge-secondary font-weight-light d-none"
                                    id="option_2_even_label">สองตัวคู่</span>
                                <span class="cls_badge badge badge-warning font-weight-light d-none"
                                    id="teng_bon_4_label">4ตัวบน</span>
                                <span class="cls_badge badge badge-warning font-weight-light d-none"
                                    id="teng_nha_bon_4_label">4ตัวแรกบน</span>
                                <span class="cls_badge badge badge-info font-weight-light d-none"
                                    id="teng_lottery_label">ล็อตเตอรี่</span>
                                <span class="cls_badge badge badge-info font-weight-light d-none"
                                    id="teng_number_label">เลข</span>
                            </div>
    
                        </div>
                        <div class="bg-option p-1 pb-0 mt-1 rounded " id="2option" style="display:none;">
                            <!-- <i class="fas fa-bars"></i> ตัวเลือกเพิ่มเติม  -->
                            <div class="d-flex flex-lg-row justify-content-around align-content-stretch flex-wrap">
                                <button class="btn btn-danger btn-sm bet_two option2btn" id="option_2_19">
                                    19 ประตู </button>
                                <!-- <div class="flex-fill">
                                    <div class="bg-btn">
                                    <button class="btn btn-danger btn-sm h-100 bet_two" id="option_2_ble">
                                    เลขเบิ้ล </button>
                                    </div>
                                    </div>
                                    <div class="flex-fill">
                                    <div class="bg-btn">
                                    <button class="btn btn-primary btn-sm h-100 bet_two option2btn" id="option_2_roodnha">
                                    รูดหน้า </button>
                                    </div>
                                    </div>
                                    <div class="flex-fill">
                                    <div class="bg-btn">
                                    <button class="btn btn-primary btn-sm h-100 bet_two option2btn" id="option_2_roodlung">
                                    รูดหลัง </button>
                                    </div>
                                    </div>
                                    <div class="flex-fill">
                                    <div class="bg-btn">
                                    <button class="btn btn-info btn-sm h-100 bet_two" id="option_2_low">
                                    สองตัวต่ำ </button>
                                    </div>
                                    </div>
                                    <div class="flex-fill">
                                    <div class="bg-btn">
                                    <button class="btn btn-info btn-sm h-100 bet_two" id="option_2_high">
                                    สองตัวสูง </button>
                                    </div>
                                    </div>
                                    <div class="flex-fill">
                                    <div class="bg-btn">
                                    <button class="btn btn-success btn-sm h-100 bet_two" id="option_2_odd">
                                    สองตัวคี่ </button>
                                    </div>
                                    </div>
                                    <div class="flex-fill">
                                    <div class="bg-btn">
                                    <button class="btn btn-success btn-sm h-100 bet_two" id="option_2_even">
                                    สองตัวคุ่ </button>
                                    </div>
                                    </div> -->
                            </div>
                        </div>
    
                        <div class="key-pad box__keyboard d-flex">
                            <div class="mx-auto">
                                <div class="row no-gutters mx-n1" style="max-width: 350px;">
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="1">1</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="2">2</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="3">3</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <!-- <button class="btn btn-danger btn-block" data-id="delete"><i class="fas fa-backspace"></i></button> -->
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="4">4</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="5">5</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="6">6</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-secondary btn-block btn-del h-100"><i class="fas fa-backspace"
                                                style="font-size:18px;"></i></button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="7">7</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="8">8</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="9">9</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-dark btn-block btn-enter px-0 h-100"><span>ENTER</span></button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <!-- <button class="btn btn-blank" disabled></button> -->
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="*">*</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="0">0</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <!-- <button class="btn btn-blank" disabled></button> -->
                                        <button class="btn btn-outline-primary btn-block btn-num" data-id="/">/</button>
                                    </div>
                                    <div class="col-3 mt-1 px-1">
                                        <button id="btn_clear" class="btn btn-danger btn-block px-0 h-100">ล้างข้อมูล</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div id="closed-number" class="col-md-auto mx-auto" style="display: none;">
                                <div class="table-responsive">
                                    <table id="closed-number-table" class="table table-danger table-sm table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th class="align-middle text-center font-weight-bold" colspan="2">ปิดรับ</th>
                                            </tr>
                                            <tr>
                                                <th class="align-middle text-center">เลข</th>
                                                <th class="align-middle text-center">ประเภท</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            {{-- <tr>
                                                <td class="align-middle text-center font-weight-bold">3 ตัวบน</td>
                                                <td class="align-middle text-left font-weight-bold">596</td>
                                            </tr> --}}
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div id="full-number" class="col-md-auto mx-auto" style="display: none;">
                                <div class="table-responsive">
                                    <table id="full-number-table" class="table table-warning table-sm table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th class="align-middle text-center font-weight-bold" colspan="2">เลขเต็ม</th>
                                            </tr>
                                            <tr>
                                                <th class="align-middle text-center">เลข</th>
                                                <th class="align-middle text-center">ประเภท</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            {{-- <tr>
                                                <td class="align-middle text-center font-weight-bold">3 ตัวบน</td>
                                                <td class="align-middle text-left font-weight-bold">596</td>
                                            </tr> --}}
                                        </tbody>
                                    </table>
                                </div>
                            </div>    
                        </div>
                    </div>
                    <!-- <div class="card-footer border-0">
                        <div class="text-center mt-3">
                            <button id="btn_clear" type="button" class="btn btn-danger" style="border-radius: 50px;">ล้างข้อมูล</button>
                        </div>
                    </div> -->
                </div>
            </div>
    
            <div class="col-md-6 cls_create_poy" style="display:none;">
                <div class="card h-100" style="min-height:680px;">
                    <div class="card-header border-0 pt-1 pb-1">
                        <div class="marquee d-flex mb-3">
                            <h3 class="text-info m-auto">เหลือเวลาทายผล: <span id="remain" class="remain">0 วัน 0 ชั่วโมง 00 นาที 00 วินาที</span></h3>
                        </div>
                        <div class="text-center">
    
                            <div class="row">
                                <div class="col-md-12">
                                    <h1 class>งวดประจำวันที่ <span id="display_date"></span></h1>
                                </div>
                            </div>
                            <div class="row">
                                <!-- <b class="col-md-4 cls_lbl_cus_name">
                                  ลูกค้า : -
                                </b> -->
                                <b class="col-md-4 cls_lbl_cus_phone">
                                    โทร : -
                                </b>
                                <b class="col-md-4 cls_lbl_line">
                                    ไลน์ส่วนลด : -
                                </b>
                            </div>
                        </div>
                    </div>
                    <div class="card-body d-flex flex-column border m-3 p-0">
                        <div id="loadPage" class="mb-2" style="display:none;">
                            <i class="fas fa-sync fa-spin fa-2x"></i> Loading...
                        </div>
                        <div class="position-relative flex-fill" style="min-width: 50vh; min-height: 200px;">
                            <div class="position-absolute h-100 w-100" style="overflow: auto;">
                                <div class="col px-0 table-responsive h-100" style="overflow: auto;">
                                    <table id="tb_list" class="table table-sm table-hover"
                                        style="color:black !important;">
                                        <thead class="thead-light">
                                            <tr>
                                                <th class="align-middle text-center text-body" style="width:10px;">ลำดับ</th>
                                                <th class="align-middle text-center text-body" style="width:10px;">เลข</th>
                                                <th class="align-middle text-center text-body">ประเภท</th>
                                                <th class="align-middle text-center text-body">แทง</th>
                                                <th class="align-middle text-center text-body">ส่วนลด</th>
                                                <th class="align-middle text-center text-body">จ่าย</th>
                                                <th class="align-middle text-center text-body" style="width:10px;">#</th>
                                            </tr>
                                        </thead>
                                        <tbody class="table_first">
                                            <tr>
                                                <td class="align-middle text-center" colspan="7">** ยังไม่มีรายการ **</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <table class="table" style="color:black;">
                            <tbody class="table_end bg-secondary">
                                <tr>
                                    <th class="text-center p-1"><b>ยอดแแทง:</b></th>
                                    <th class="text-center p-1"><b>0.00</b></th>
                                    <th class="text-center p-1"><b>ส่วนลด:</b></th>
                                    <th class="text-center p-1"><b class="text-green">0.00</b></th>
                                    <th class="text-center p-1"><b>รวม:</b></th>
                                    <th class="text-center p-1"><b class="text-red txt_total">0.00</b></th>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="card-footer border-0 pt-1">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="text-center">
                                    <!-- <button id="btn_back_select_line" type="button" class="btn btn-danger" style="width:120px; border-radius: 50px;"><ย้อนกลับ</button> -->
    
                                    <button id="btn_confirm" type="button" class="btn btn-lg btn-danger"
                                        style="border-radius: 50px;">ยืนยันรายการ</button>
                                    <!-- <button id="btn_test" type="button" class="btn btn-danger" style="border-radius: 50px;">test</button> -->
                                </div>
                            </div>
                            <div id="limited-number" class="col-12" style="display: none;">
                                <hr>
                                <div class="table-responsive">
                                    <table id="limited-number-table" class="table table-info table-sm table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th class="align-middle text-center font-weight-bold" colspan="4">เลขอั้น</th>
                                            </tr>
                                            <tr>
                                                <th class="align-middle text-center">เลข</th>
                                                <th class="align-middle text-center">ประเภท</th>
                                                <th class="align-middle text-center" style="display: none;">แทง</th>
                                                <th class="align-middle text-center">แทงได้อีก</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            {{-- <tr>
                                                <td class="align-middle text-center font-weight-bold">3 ตัวบน</td>
                                                <td class="align-middle text-left font-weight-bold">596</td>
                                            </tr> --}}
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
    
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="dialog_bet_error" tabindex="-1">
            <div class="modal-dialog modal-dialog-centered">
                <form class="modal-content bg-secondary">
                    <div class="modal-header pb-0">
                        <h3 class="modal-title">แจ้งเตือน</h3>
                        <button class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body">

                        <div class="card-body table-responsive py-3">
                            <table id="tb_list_error" class="table table-sm table-hover">
                                <thead>
                                    <tr>
                                        <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="table_first">
                                    <tr>
                                        <td class="align-middle text-center" colspan="6">** ไม่มีรายการ **</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-success" type="button"
                            onclick="$('#dialog_bet_error').modal('hide')">ตกลง</button>
                    </div>
                </form>
            </div>
        </div>

        <div class="modal fade" id="poy-list-dialog" tabindex="-1" data-backdrop="static">
            <div class="modal-dialog modal-lg modal-dialog-centered" role="document" style="width:50%;">
                <form class="modal-content bg-secondary">
                    <div class="card-header">
                        <div class="text-center">
                            <div class="row">
                                <div class="col-md-6">
                                    <p style="font-size: 1.3rem" class="py-1 text-right my-0">ค้นหา</p>
                                </div>
                                <div class="col-md-6">
                                    <div class="input-group">
                                        <input type="text" id="search-poy-input" class="form-control" placeholder="ค้นหา"
                                            aria-label="ลูกค้า" aria-describedby maxlength="30">
                                        <div class="input-group-prepend">
                                            <button id="search-poy-btn" type="button" class="btn btn-dark">
                                                <i class="fas fa-search text-grey" aria-hidden="true"
                                                    style="font-size:18px;"></i>
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-body">

                        <div class="card-body table-responsive py-3">
                            <div class="border bg-white" style="overflow: scroll; overflow-x: hidden; height:450px;">
                                <table id="tb_list_bill" class="table table-sm table-hover mb-0">
                                    <thead>
                                        <tr>
                                            <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="table_first tb_search_bill">
                                        <tr>
                                            <td class="align-middle text-center" colspan="6">** ไม่มีรายการ **</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                    </div>
                    <div class="modal-footer border-0">
                        <button class="btn btn-danger" type="button" data-dismiss="modal">ยกเลิก</button>
                    </div>
                </form>
            </div>
        </div>

        <div class="modal fade" id="dialog_bet_search" tabindex="-1">
            <div class="modal-dialog modal-lg modal-dialog-centered" role="document" style="width:50%;">
                <form 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">
                                    <h3 class="text-danger" id="lbl_bill"></h3>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-body">

                        <div class="card-body table-responsive py-3">
                            <div style="overflow: scroll; overflow-x: hidden; height:450px;">
                                <table id="tb_list_bet" class="table table-sm table-hover">
                                    <thead>
                                        <tr>
                                            <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="table_first tb_search_bet">
                                        <tr>
                                            <td class="align-middle text-center" colspan="6">** ไม่มีรายการ **</td>
                                        </tr>
                                    </tbody>
                                </table>

                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button id="poy-list-btn-submit" class="btn btn-success" type="button">ตกลง</button>
                        <button class="btn btn-danger" type="button" data-dismiss="modal">ยกเลิก</button>
                    </div>
                </form>
            </div>
        </div>

        <div class="modal fade" id="dialog_band" tabindex="-1">
            <div class="modal-dialog modal-lg modal-dialog-centered" role="document" style="width:50%;">
                <form 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 style="overflow: scroll; overflow-x: hidden; height:450px;">
                                <table id="tb_list_band" class="table table-sm table-hover">
                                    <thead>
                                        <tr>
                                            <th class="align-middle text-center">ประเภท</th>
                                            <th class="align-middle text-center">เลข</th>
                                        </tr>
                                    </thead>
                                    <tbody class="table_first tb_band">
                                        <tr>
                                            <td class="align-middle text-center" colspan="3">** ไม่มีรายการ **</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-danger" type="button" data-dismiss="modal">ปิด</button>
                    </div>
                </form>
            </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-rewarded" class="text-green">0.00</b></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="modal-footer">
                        <div class="row">
                            <div class="col-12 col-lg-auto text-center">
                                <button type="button" style="display:none;" id="btn_cancel_bill" class="btn btn-danger">
                                    <i class="fas fa-times"></i> ยกเลิกบิล</button>
                                <button type="button" class="btn btn-secondary" data-dismiss="modal">ปิด</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>

    @endsection

    @section('scripts')
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.16/jquery.mask.js"
            integrity="sha256-yE5LLp5HSQ/z+hJeCqkz9hdjNkk1jaiGG0tDCraumnA=" crossorigin="anonymous"></script>

        <script>
            var line_current = 'C';
            var num_2 = [];
            let currentPhone;
            let timer = setTimeout(() => location.reload(), 1000 * 60 * 5);

            document.body.onclick = () => {
                clearTimeout(timer);
                timer = setTimeout(() => location.reload(), 1000 * 60 * 5);
            }

            const phoneInput = document.getElementById('txt_cus_phone');

            function loadBetsByPhone() {
                const phoneNumber = phoneInput.value;
                if (phoneNumber.length !== 12) {
                    return false;
                }

                tryCatchSwal(async () => {
                    const formData = new FormData();
                    formData.append('phone', phoneNumber);
                    const result = await fetchJson(`{{ route('store.getBillsByPhones') }}`, 'POST', formData);
                    if (!result) return false;

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

                    let output = '';
                    let n = 0;

                    for (const key in result) {
                        const item = result[key];
                        // console.log(item);
                        n++;
                        for (const i in item.bet) {
                            const bet = item.bet[i];
                            if (bet.won) {
                                betReward = betReward + (+bet.won);
                            }
                        }

                        const close = DateTime.fromISO(item.close);
                        const now = DateTime.local();

                        output = output + 
                            `<tr>
                                <td class="align-middle font-weight-bold text-center px-1">
                                    ${ formattedDatetime(item.created_at) }<br>
                                </td>
                                <td class="align-middle font-weight-bold text-center px-1">
                                    <span class="badge badge-default text-sm">${ lotteryName(item.country) }</span>
                                </td>
                                <td class="align-middle text-center text-danger font-weight-bold cls_bill_id">
                                    ${ item.bill_id }
                                </td>
                                <td class="align-middle text-right font-weight-bold">
                                    ${ numberFormat(item.amount) } THB
                                </td>
                                <td class="align-middle text-right font-weight-bold text-success">
                                    -${ numberFormat(item.discount) } THB
                                </td>
                                <td class="align-middle text-right font-weight-bold text-primary">
                                    ${ numberFormat(item.payment) } THB
                                </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">
                                    <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"></i>จัดการ
                                    </button>
                                </td>
                            </tr>`;
                    }

                    document.querySelector('.tb_cus_bill').innerHTML = output;

                    $("#Check_All").prop("checked", false);
                    $("#Check_All").click(function() {
                        var checkAll = $("#Check_All").prop('checked');
                        if (checkAll) {
                            $(".cls_checkbox").prop("checked", $(".cls_checkbox").prop('disabled') ? true : false);
                        } else {
                            $(".cls_checkbox").prop("checked", false);
                        }
                    });

                    $(".cls_checkbox").click(function() {
                        //alert("cls_checkbox");
                        if ($(".cls_checkbox").length == $(".cls_checkbox:checked").length) {
                            $("#Check_All").prop("checked", true);
                        } else {
                            $("#Check_All").prop("checked", false);
                        }
                    });
                    $(".tb_cus_bill .cls_btn_detail").unbind("click");
                    $(".tb_cus_bill .cls_btn_detail").on('click', 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');
                        $('#detail_modal').find('#lbl_bill').text('เลขตั๋ว : ' + bill);
                        $('#detail_modal').find('#lbl_main_date').text('งวดวันที่ : ' + formattedDatetime(main_date));
                        $('#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);
                        // current.id = id;
                        // current.billId = bill;
                        loadDetailTable(id).then(() => {
                            $('#detail_modal').modal('show');
                        });
                    });


                });
            }

            function loadDetailTable(id) {
                return $.getJSON(`{{ route('bill.index') }}/${id}`, function(data) {
                    let n = 0;
                    let betReward = 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 <= 1) {
                            itemStatus['color'] = 'text-muted';
                            itemStatus['text'] = 'รอออกผล';
                        } else {
                            itemStatus['color'] = 'text-danger';
                            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) {
                            betReward += +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-rewarded').text(numberFormat(betReward));
                    bill_detail_payment = data.payment;
                    $("#btn_cancel_bill").hide();
                    $("#btn_cash").hide();
                    $("#btn_confirm_bill").hide();
                    $(".cls-cash").hide();
                    $('.table_end').html(data.data_sum);

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

                    if (status === 0) {
                        $("#btn_cancel_bill").show();
                    } else {
                        $("#btn_cancel_bill").hide();
                    }
                });
            }

            function fetchCart() {
                return tryCatchSwal(async () => {
                    const result = await fetchJson(`{{ route('cart.record') }}`);
                    if (!result) return false;
                    var myObj = {
                        "bet_id": "0000",
                        "poy_list": result || []
                    };
                    localStorage.setItem('poy', JSON.stringify(myObj));
                    return loadTable();
                });
            }

            function resetCart(callback = async () => {}) {
                return tryCatchSwal(async () => {
                    const result = await fetchJson(`{{ route("cart.reset") }}`, 'DELETE');
                    if (!result) return false;
                    fetchCart();
                    return callback();
                });
            }

            function loadTable() {
                let bet_data = JSON.parse(localStorage.getItem('poy'));
                $("#tb_list tbody").empty();

                var amount = 0.00;
                var dis = 0.00;
                var pay = 0.00;
                $.each(bet_data.poy_list, function(index, d) {
                    let strHtml = '';
                    strHtml = strHtml + '<tr data-last_add_num=' + d.last_add_num + ' data-number=' + d .number + ' data-option=' + d.option + '>';
                    strHtml = strHtml + '<td class="align-middle text-center">' + (index + 1) + '.</td> ';
                    strHtml = strHtml + '<td class="align-middle text-center">' + d.number + '</td> ';
                    strHtml = strHtml + '<td class="align-middle text-center">' + d.option_txt + '</td>';
                    strHtml = strHtml + '<td class="align-middle text-center">' + d.amount + '</td>';
                    strHtml = strHtml + '<td class="align-middle text-center">' + numberFormat(d.inc_discount, 2) + '</td>';
                    strHtml = strHtml + '<td class="align-middle text-center">' + numberFormat(d.real_inc_amount, 2) + '</td>';
                    strHtml = strHtml + '<td class="align-middle text-center"><i style="cursor: pointer;" class="btn_del_detail fas fa-trash-alt text-danger"></i></td>';
                    strHtml = strHtml + '</tr>';
                    $("#tb_list tbody").append(strHtml);

                    //amount += parseFloat(d.amount.replace(/[^0-9.-]+/g,""));
                    //dis+= parseFloat(d.inc_discount.replace(/[^0-9.-]+/g,""));
                    amount += parseFloat(d.amount);
                    dis += parseFloat(d.inc_discount);

                });
                if (bet_data.poy_list.length == 0) {
                    $("#tb_list tbody").append('<tr><td class="align-middle text-center" colspan="7">** ยังไม่มีรายการ **</td></tr>');
                }

                //Set table end
                pay = amount - dis;
                $(".table_end").empty();
                let strTbEnd = "";
                // strTbEnd = strTbEnd +'<tr>';
                // strTbEnd = strTbEnd +'<td colspan="3" class="text-center p-1"><b>รวมยอด<br>รายการเล่น</b></td>';
                // strTbEnd = strTbEnd +'<td colspan="3" class="text-center p-1"><b>'+amount.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')+' - '+dis.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')+'<br>= '+pay.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')+' THB</b></td>';
                // strTbEnd = strTbEnd +'</tr>';

                strTbEnd = strTbEnd + '<tr>';
                strTbEnd = strTbEnd + '<th class="text-center p-1"><b>ยอดแทง:</b></th>';
                strTbEnd = strTbEnd + '<th class="text-center p-1"><b>' + amount.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + '</b></th>';
                strTbEnd = strTbEnd + '<th class="text-center p-1"><b>ส่วนลด:</b></th>';
                strTbEnd = strTbEnd + '<th class="text-center p-1"><b class="text-green">' + dis.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + '</b></th>';
                strTbEnd = strTbEnd + '<th class="text-center p-1"><b>รวม:</b></th>';
                strTbEnd = strTbEnd + '<th class="text-center p-1"><b class="text-red txt_total">' + pay.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + '</b></th>';
                strTbEnd = strTbEnd + '</tr>';

                $(".table_end").append(strTbEnd);

                $("#tb_list tbody .btn_del_detail").unbind("click");
                $("#tb_list tbody .btn_del_detail").bind("click", function() {
                    //alert( "User clicked on 'foo.'" );
                    let e = $(this);
                    swal('ยืนยันการลบรายการ?', ' ', 'warning', {
                        buttons: ['ยกเลิก', 'ยืนยัน']
                    }).then((sure) => {
                        if (sure) {
                            removeBetDetail(e);
                        }
                    });
                });
            }

            function removeBetDetail(e) {
                const tr = e.closest('tr');
                // console.log(tr);
                const data = {
                    number: tr.data('number'),
                    type: tr.find('td:eq(2)').text(),
                    amount: tr.find('td:eq(3)').text().replaceAll(',', ''),
                    inc_discount: tr.find('td:eq(4)').text().replaceAll(',', ''),
                    payment: tr.find('td:eq(5)').text().replaceAll(',', ''),
                };
                let number = $(e).closest("tr").data("number");
                let last_add_num = $(e).closest("tr").data("last_add_num");
                let option = $(e).closest("tr").data("option");
                var bet_data = JSON.parse(localStorage.getItem('poy'));

                const formData = new FormData();
                formData.append('number', data.number);
                formData.append('type', data.type);
                formData.append('amount', data.amount);
                formData.append('inc_discount', data.inc_discount);
                formData.append('payment', data.payment);
                tryCatchSwal(async () => {
                    const result = await fetchJson(`{{ route('cart.removeFromCart') }}`, 'POST', formData);
                    if (!result) return false;

                    const records = await fetchJson(`{{ route('cart.record') }}`);
                    if (!records) return false;

                    bet_data.poy_list = records;
                    localStorage.setItem('poy', JSON.stringify(bet_data));

                    loadTable();
                    $(".txt_d_1").focus();
                });
            }

            document.addEventListener('DOMContentLoaded', () => {
                const remains = document.querySelectorAll('[data-remain]');
                for (const el of remains) {
                    countDown(el.dataset.remain, el, () => {
                        const label = el.closest('label');
                        const div = label.querySelector('div');
                        div.style.filter = "grayscale(1)";
                        div.style.opacity = 0.5;
                    })
                }
            });

            $(document).ready(function() {

                $('input[name="cus_phone"]').mask('000-000-0000');

                $.ajaxSetup({
                    beforeSend: function() {},
                    complete: function() {}
                });

                $(document).on('click', 'button.opt', function() {
                    var isUncheck = false;
                    $.each($('input[name="optionsNew"]'), function(i, n) {
                        if ($(n).is(':checked')) {
                            $(n).prop('checked', false);
                            $(n).closest('label').removeClass('active');
                            isUncheck = true;
                        } else {
                            return;
                        }
                    });
                    if (isUncheck) {
                        $('.txt_option').val('');
                    }
                });

                $('input[name="optionsNew"]').on('change', function(e) {
                    var f = '';
                    var s = '';
                    var t = '';
                    $.each($('input[name="optionsNew"]'), function(i, n) {
                        if (i == 1 && $(n).is(':checked')) {
                            s = '/';
                        }

                        if (i == 2 && $(n).is(':checked')) {
                            t = '*';
                        }
                    });
                    var firstelement = $('input[name="optionsNew"]:eq(0)');
                    if (firstelement.is(':checked')) {
                        if (s == '' && t == '') {
                            f = '';
                        } else {
                            f = '-';
                        }
                    }
                    $('.txt_option').val(f + s + t);
                });

                $(".clsNumberOnly").keypress(function(evt) {
                    var charCode = (evt.which) ? evt.which : evt.keyCode;
                    if (charCode > 31 && (charCode < 48 || charCode > 57))
                        return false;
                    return true;
                });

                function getVal(str) {
                    var v = window.location.search.match(new RegExp('(?:[\?\&]' + str + '=)([^&]+)'));
                    return v ? v[1] : null;
                }
                $(document).ready(function() {

                    var cus = decodeURIComponent(getVal("cus"));
                    var phone = getVal("phone");

                    if (cus == "null") {
                        cus = "";
                    }
                    //alert(phone);
                    $("#txt_cus_name").val(cus);
                    $("#txt_cus_phone").val(phone);
                    if ($("#txt_cus_phone").val() != "") {
                        $("#btn_to_select_type").trigger('click');
                    }

                    $("#txt_cus_name").focus();

                    for (i = 0; i < 100; i++) {
                        if (i < 10)
                            num_2.push("0" + i + "");
                        else
                            num_2.push(i + "");
                    }

                    $("#btn_clear").click(async () => {
                        const confirm = await swal('ยืนยันการลบรายการ?', ' ', 'warning', {
                            buttons: ['ยกเลิก', 'ยืนยัน']
                        })
                        if (!confirm) return;
                        resetCart(() => swal('ล้างรายการเรียบร้อย', ' ', 'success', {
                            buttons: false,
                            timer: 1500
                        }).then(() => $(".txt_d_1").focus()));
                    });

                    $("#btn_confirm").click(async () => {
                        const confirm = await swal('ยืนยันการทำรายการ?', ' ', 'info', {
                            buttons: ['ยกเลิก', 'ยืนยัน']
                        })
                        if (!confirm) return;

                        const tryCode = await tryCatchSwal(async () => {
                            const formData = new FormData();
                            formData.append('commission_line', line_current);
                            formData.append('cus_phone', $("#txt_cus_phone").val());
                            formData.append('country', $('[name=country]:checked').val());

                            const result = await fetchJson(`{{ route('cart.confirm') }}`, 'POST', formData);
                            if (!result) return false;

                            fetchCart();
                            loadBetsByPhone();

                            $("#btn_back_select_type").trigger("click");
                            const finish = await swal({
                                title: 'ทำรายการเรียบร้อย',
                                text: 'ท่านต้องการออกตั๋วเพิ่มหรือไม่? หากไม่ต้องการออกตั๋วเพิ่ม\nกรุณาแจ้งหมายเลขโทรศัพท์ที่เค้าท์เตอร์เพื่อชำระเงิน',
                                icon: 'success',
                                buttons: ['ออกตั๋วเพิ่ม','จบการทำงาน']
                            });
                            if (finish) {
                                $('#btn_finish').trigger('click');
                            }
                        }, () => fetchCart());

                        // ถ้ามีเลขอั้น
                        if (tryCode && tryCode.hasOwnProperty('success') && tryCode.success === false) {
                            if (!tryCode.hasOwnProperty('errorLog')) return;
                            const numberLimit = tryCode.errorLog;
                            const limitedNumDiv = document.getElementById('limited-number');
                            const limitedNumTable = document.getElementById('limited-number-table');
                            const limitTBody = limitedNumTable.tBodies[0];
                            const rows = limitedNumTable.tBodies[0].rows;
                            limitedNumTable.tHead.rows[1].cells[2].style.display = '';
                            // limitTBody.innerHTML = '';

                            for (const tr of rows) {
                                const $tdNumber = tr.cells[0];
                                const $tdType = tr.cells[1];
                                const $tdBetAmount = tr.cells[2];
                                const $tdRemain = tr.cells[3];

                                $tdBetAmount.className = 'align-middle text-center text-primary';
                                $tdBetAmount.style.display = '';

                                if (numberLimit.length === 0) continue;
                                const index = numberLimit.findIndex(item => item && item.number == $tdNumber.textContent && item.type == $tdType.textContent);
                                if (index === -1) continue;

                                const { betAmount, remain } = numberLimit[index];
                                $tdBetAmount.textContent = betAmount;
                                $tdRemain.textContent = remain;

                                delete numberLimit[index];
                            }

                            for (const [key, item] of Object.entries(numberLimit)) {
                                const tr = limitTBody.insertRow();
                                const tdNum = tr.insertCell();
                                const tdType = tr.insertCell();
                                const tdBetAmount = tr.insertCell();
                                const tdRemain = tr.insertCell();

                                tdNum.className = 'align-middle text-center';
                                tdNum.textContent = item.number;
                                tdType.className = 'align-middle text-center';
                                tdType.textContent = item.type;
                                tdBetAmount.className = 'align-middle text-center text-primary';
                                tdBetAmount.textContent = numberFormat(item.betAmount);
                                tdRemain.className = 'align-middle text-center text-danger';
                                tdRemain.textContent = item.remain;
                            }

                            limitedNumDiv.style.display = 'block';
                            limitedNumDiv.scrollIntoView()
                            focusOn(limitedNumTable);
                        }
                    });

                    document.getElementById("btn_cancel_bill").onclick = function() {
                        tryCatchSwal(async () => {
                            const confirm = await swal('ยืนยันการยกเลิกบิล?', ' ', 'warning', { buttons: ['ยกเลิก', 'ยืนยัน'] });
                            if (!confirm) return;

                            const bill = $("#hd_bill_no").val();
                            const formData = new FormData();
                            formData.append('reason', 'ลูกค้ายกเลิก');

                            const result = await fetchJson(`{{ route('bill.index') }}/${bill}`, 'DELETE', formData);
                            if (!result) return false;

                            loadTable();
                            loadBetsByPhone();
                            $("#detail_modal").modal("hide");
                            return swal('ยกเลิกโพยเรียบร้อย', ' ', 'success', {
                                buttons: false,
                                timer: 1500
                            });
                        })
                    };

                    //333333333333333333
                    $(".opt_3").click(function() {
                        $(".bet_two").removeClass('active');
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $(".opt_2").removeClass('active');
                            $(".opt_1").removeClass('active');
                            $(".opt_4").removeClass('active');
                        }
                        if ($(this).hasClass("opt_teng_bon_3")) {

                        } else if ($(this).hasClass("opt_tode_3")) {
                            $(".opt_shuffle_3").removeClass('active');
                        }
                        if ($(this).hasClass("opt_shuffle_3")) {
                            $(".opt_tode_3").removeClass('active');
                        }
                        setOption();
                    });

                    //2222222222222222222
                    $(".opt_2").click(function() {
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $(".opt_3").removeClass('active');
                            $(".opt_1").removeClass('active');
                            $(".opt_4").removeClass('active');
                        }
                        setOption();
                    });

                    //1111111111111111111
                    $(".opt_1").click(function() {
                        $(".bet_two").removeClass('active');
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $(".opt_2").removeClass('active');
                            $(".opt_3").removeClass('active');
                            $(".opt_4").removeClass('active');
                        }
                        setOption();
                    });

                    $(".opt_teng_bon_4").click(function() {
                        $(".bet_two").removeClass('active');
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $(".opt_1").removeClass('active');
                            $(".opt_2").removeClass('active');
                            $(".opt_3").removeClass('active');
                        }
                        setOption();
                    });

                    $(".opt_teng_nha_bon_4").click(function() {
                        $(".bet_two").removeClass('active');
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $(".opt_1").removeClass('active');
                            $(".opt_2").removeClass('active');
                            $(".opt_3").removeClass('active');
                        }
                        setOption();
                    });

                    //19 option_2_19
                    $("#option_2_19").click(function() {
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $("#option_2_roodnha").removeClass('active');
                            $("#option_2_roodlung").removeClass('active');
                            //$(".opt_2").removeClass('active');
                            //$(".opt_3").removeClass('active');
                        }
                        setOption();
                    });

                    //รูดหน้า
                    $("#option_2_roodnha").click(function() {
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $("#option_2_19").removeClass('active');
                            $("#option_2_roodlung").removeClass('active');
                            //$(".opt_2").removeClass('active');
                            //  $(".opt_3").removeClass('active');
                        }
                        setOption();
                    });

                    //รูดหลัง
                    $("#option_2_roodlung").click(function() {
                        $(this).toggleClass('active');
                        if ($(this).hasClass("active")) {
                            $("#option_2_19").removeClass('active');
                            $("#option_2_roodnha").removeClass('active');
                            //$(".opt_2").removeClass('active');
                            //$(".opt_3").removeClass('active');
                        }
                        setOption();
                    });


                    $("#option_2_low").click(function() {
                        if ($(".txt_money").val() == "") {
                            swal('Warning!!', 'กรุณากรอกจำนวนเงิน', 'warning').then((sure) => {
                                $(".txt_money").focus();
                            });
                            return false;
                        }
                        var bet_data = JSON.parse(localStorage.getItem('poy'));

                        let option = "option_2_low";
                        let d1, d2, d3, d4, d5, d6 = "";
                        let m = $(".txt_money").val();
                        let rec = generateData(d1, d2, d3, d4, d5, d6, m, option);
                        $.each(rec, function(index, d) {
                            bet_data.poy_list.push(d);
                        });

                        localStorage.setItem('poy', JSON.stringify(bet_data));
                        loadTable();
                    });

                    $("#option_2_high").click(function() {
                        if ($(".txt_money").val() == "") {
                            swal('Warning!!', 'กรุณากรอกจำนวนเงิน', 'warning').then((sure) => {
                                $(".txt_money").focus();
                            });
                            return false;
                        }
                        var bet_data = JSON.parse(localStorage.getItem('poy'));

                        let option = "option_2_high";
                        let d1, d2, d3, d4, d5, d6 = "";
                        let m = $(".txt_money").val();
                        let rec = generateData(d1, d2, d3, d4, d5, d6, m, option);
                        $.each(rec, function(index, d) {
                            bet_data.poy_list.push(d);
                        });

                        localStorage.setItem('poy', JSON.stringify(bet_data));
                        loadTable();
                    });

                    $("#option_2_odd").click(function() {
                        if ($(".txt_money").val() == "") {
                            swal('Warning!!', 'กรุณากรอกจำนวนเงิน', 'warning').then((sure) => {
                                $(".txt_money").focus();
                            });
                            return false;
                        }
                        var bet_data = JSON.parse(localStorage.getItem('poy'));

                        let option = "option_2_odd";
                        let d1, d2, d3, d4, d5, d6 = "";
                        let m = $(".txt_money").val();
                        let rec = generateData(d1, d2, d3, d4, d5, d6, m, option);
                        $.each(rec, function(index, d) {
                            bet_data.poy_list.push(d);
                        });

                        localStorage.setItem('poy', JSON.stringify(bet_data));
                        loadTable();
                    });

                    $("#option_2_even").click(function() {
                        if ($(".txt_money").val() == "") {
                            swal('Warning!!', 'กรุณากรอกจำนวนเงิน', 'warning').then((sure) => {
                                $(".txt_money").focus();
                            });
                            return false;
                        }
                        var bet_data = JSON.parse(localStorage.getItem('poy'));

                        let option = "option_2_even";
                        let d1, d2, d3, d4, d5, d6 = "";
                        let m = $(".txt_money").val();
                        let rec = generateData(d1, d2, d3, d4, d5, d6, m, option);
                        $.each(rec, function(index, d) {
                            bet_data.poy_list.push(d);
                        });

                        localStorage.setItem('poy', JSON.stringify(bet_data));
                        loadTable();
                    });

                    $("#option_2_ble").click(function() {
                        if ($(".txt_money").val() == "") {
                            swal('Warning!!', 'กรุณากรอกจำนวนเงิน', 'warning').then((sure) => {
                                $(".txt_money").focus();
                            });
                            return false;
                        }
                        var bet_data = JSON.parse(localStorage.getItem('poy'));

                        let option = "option_2_ble";
                        let d1, d2, d3, d4, d5, d6 = "";
                        let m = $(".txt_money").val();
                        let rec = generateData(d1, d2, d3, d4, d5, d6, m, option);
                        $.each(rec, function(index, d) {
                            bet_data.poy_list.push(d);
                        });

                        localStorage.setItem('poy', JSON.stringify(bet_data));
                        loadTable();
                    });


                    //เลืเลือกแพ็คเกจทายผล
                    var discount_x = 'C';
                    if (discount_x == 'A') {
                        $('.tb_line_a').show();
                        $('.tb_line_b').hide();
                        $('.tb_line_c').hide();
                    } else if (discount_x == 'B') {
                        $('.tb_line_a').hide();
                        $('.tb_line_b').show();
                        $('.tb_line_c').hide();
                    } else {
                        $('.tb_line_a').hide();
                        $('.tb_line_b').hide();
                        $('.tb_line_c').show();
                    }

                    $(document).on('click', '.key-pad .btn-num', function() {
                        //alert($(this).data("id"));

                        let key = $(this).data("id");

                        if ($(".txt_d_1").val() == "") {
                            if (key == "*" || key == "/")
                                return;
                            $(".txt_d_1").val(key);
                            $(".txt_d_2").val("");
                            $(".txt_d_3").val("");
                            $(".txt_d_4").val("");
                            $(".txt_d_5").val("");
                            $(".txt_d_6").val("");

                            $(".txt_money").val("");
                        } else if ($(".txt_d_2").val() == "" && !$(".txt_d_2").hasClass("d-none")) {
                            if (key == "*" || key == "/")
                                return;
                            $(".txt_d_2").val(key);
                            $(".txt_d_3").val("");
                            $(".txt_d_4").val("");
                            $(".txt_d_5").val("");
                            $(".txt_d_6").val("");

                            $(".txt_money").val("");
                        } else if ($(".txt_d_3").val() == "" && !$(".txt_d_3").hasClass("d-none")) {
                            if (key == "*" || key == "/")
                                return;
                            $(".txt_d_3").val(key);
                            $(".txt_d_4").val("");
                            $(".txt_d_5").val("");
                            $(".txt_d_6").val("");

                            $(".txt_money").val("");
                        } else if ($(".txt_d_4").val() == "" && !$(".txt_d_4").hasClass("d-none")) {
                            if (key == "*" || key == "/")
                                return;
                            $(".txt_d_4").val(key);
                            $(".txt_d_5").val("");
                            $(".txt_d_6").val("");

                            $(".txt_money").val("");
                        } else if ($(".txt_d_5").val() == "" && !$(".txt_d_5").hasClass("d-none")) {
                            if (key == "*" || key == "/")
                                return;
                            $(".txt_d_5").val(key);
                            $(".txt_d_6").val("");

                            $(".txt_money").val("");
                        } else if ($(".txt_d_6").val() == "" && !$(".txt_d_6").hasClass("d-none")) {
                            if (key == "*" || key == "/")
                                return;
                            $(".txt_d_6").val(key);

                            $(".txt_money").val("");
                        } else if ($(".txt_option").val() == "" && !($('.txt_option').css('display') == 'none') && (key == "*" || key == "/")) {
                            if (key == "*" || key == "/") {
                                $(".txt_option").val(key);
                                $(".txt_money").val("");
                            }
                        } else {
                            if (key == "*" || key == "/")
                                return;
                            $(".txt_money").val($(".txt_money").val() + key);
                        }

                    });
                    $(document).on('click', '.key-pad .btn-del', function() {


                        if ($(".txt_money").val() != "") {
                            $(".txt_money").val("")
                        // } else if ($(".txt_option").val() != "") {
                        //     // $(".txt_option").val("")
                        } else if ($(".txt_d_6").val() != "") {
                            $(".txt_d_6").val("")
                        } else if ($(".txt_d_5").val() != "") {
                            $(".txt_d_5").val("")
                        } else if ($(".txt_d_4").val() != "") {
                            $(".txt_d_4").val("")
                        } else if ($(".txt_d_3").val() != "") {
                            $(".txt_d_3").val("")
                        } else if ($(".txt_d_2").val() != "") {
                            $(".txt_d_2").val("")
                        } else if ($(".txt_d_1").val() != "") {
                            $(".txt_d_1").val("")
                        }

                        // $(".txt_d").val("");
                        // $(".txt_money").val("")
                        // $(".txt_d_1").focus();
                    });
                    $(document).on('click', '.key-pad .btn-enter', function() {
                        if ($(".txt_money").val() == "")
                            return;
                        //$('.btn_test').trigger("click");
                        if ($(".txt_d").val() == "") {
                            $(".txt_d_1").focus();
                            return;
                        }
                        var oldOptvalue = $(".txt_option").val();
                        addBet();
                        $(".txt_d:not([data-setoptcheck])").val("");
                        $(".txt_money").val("");
                        $(".txt_d_1").focus();
                        $(".txt_option").val(oldOptvalue);
                    });

                    $(document).on('click', '.select_line', function(e) {
                        e.preventDefault();
                        var line = $(this).data('line');
                        var old_line = $('input[name="now_line"]').val();

                        $('.select_line[data-line="' + old_line + '"]').removeClass('btn-success');
                        $('.select_line[data-line="' + old_line + '"]').addClass('btn-default');
                        $('.select_line[data-line="' + old_line + '"]').html('LINE ' + old_line);
                        $('.select_line[data-line="' + line + '"]').removeClass('btn-default');
                        $('.select_line[data-line="' + line + '"]').addClass('btn-success');
                        $('.select_line[data-line="' + line + '"]').html('<i class="fa fa-check-circle"></i> LINE ' + line);

                        if (line == 'A') {
                            $('.tb_line_a').show();
                            $('.tb_lottery_line_a').show();
                            $('.tb_line_b').hide();
                            $('.tb_lottery_line_b').hide();
                            $('.tb_line_c').hide();
                            $('.tb_lottery_line_c').hide();
                        } else if (line == 'B') {
                            $('.tb_line_a').hide();
                            $('.tb_lottery_line_a').hide();
                            $('.tb_line_b').show();
                            $('.tb_lottery_line_b').show();
                            $('.tb_line_c').hide();
                            $('.tb_lottery_line_c').hide();
                        } else {
                            $('.tb_line_a').hide();
                            $('.tb_lottery_line_a').hide();
                            $('.tb_line_b').hide();
                            $('.tb_lottery_line_b').hide();
                            $('.tb_line_c').show();
                            $('.tb_lottery_line_c').show();
                        }
                        $('input[name="now_line"]').val(line)

                    });

                });

                $("#btn_back_select_line").click(function() {
                    $("#btn_select_packet").trigger("click");
                });

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

                    let cus_name = $("#txt_cus_name").val();
                    let cus_phone = $("#txt_cus_phone").val();

                    if (cus_phone == "" || $("#txt_cus_phone").val().length < 12) {
                        swal('Warning!!', "กรุณาระบุเบอร์โทร", 'warning').then((sure) => {
                            $("#txt_cus_phone").focus();
                        });
                        return false;
                    }

                    if (currentPhone != cus_phone) {
                        resetCart();
                    }

                    currentPhone = cus_phone;

                    loadBetsByPhone();

                    // $(".cls_lbl_cus_name").text("ลูกค้า : "+cus_name);
                    $(".cls_lbl_cus_phone").text("โทร : " + cus_phone);
                    $(".cls_lbl_line").text("ไลน์ส่วนลด : ");

                    $(".cls_customer_info").hide();
                    $(".cls_select_type").show();
                    $(".cls_select_packet").hide();
                    $(".cls_create_poy").hide();

                });

                $("#btn_to_customer_info").click(function() {
                    $(".cls_customer_info").show();
                    $(".cls_select_line").hide();
                    $(".cls_select_type").hide();
                    $(".cls_select_packet").hide();
                    $(".cls_create_poy").hide();
                });

                $("#btn_to_select_line").click(function() {
                    $(".cls_customer_info").hide();
                    $(".cls_select_type").hide();
                    $(".cls_select_packet").show();
                    $(".cls_create_poy").hide();
                });

                $("#btn_back_select_type").click(function() {
                    $(".cls_customer_info").hide();
                    $(".cls_select_type").show();
                    $(".cls_select_packet").hide();
                    $(".cls_create_poy").hide();
                });
                //btn_finish
                $("#btn_finish").click(async function() {
                    var bet_data = JSON.parse(localStorage.getItem('poy'));

                    if (bet_data.poy_list.length === 0) {
                        bet_data.poy_list = [];
                        localStorage.setItem('poy', JSON.stringify(bet_data));
                        return location.reload();
                    }
                    const confirm = await swal({
                        title: 'ยืนยันจบการทำงาน?',
                        text: 'มีการทำรายการค้างอยู่คุณต้องการจบการทำงานหรือไม่',
                        icon: 'warning',
                        buttons: ['ยกเลิก', 'ยืนยัน']
                    });
                    if (!confirm) return;

                    bet_data.poy_list = [];
                    localStorage.setItem('poy', JSON.stringify(bet_data));
                    location.reload();
                });

                $("#btn_select_line").click(function() {
                    let line = $(".select_line.btn-success").data('line');

                    var bet_data = JSON.parse(localStorage.getItem('poy'));

                    if (bet_data.poy_list.length > 0 && line_current != line) {
                        swal({
                            title: 'แจ้งเตือน!!',
                            text: 'คุณกำลังทำการเลือกส่วนลดสายใหม่ หากต้องการดำเนินการ ระบบจะทำการล้างรายการหวยที่คุณได้เลือกไว้',
                            icon: 'warning',
                            buttons: ['ยกเลิก', 'ยืนยัน']
                        }).then((sure) => {
                            if (sure) {
                                resetCart(() => 
                                    swal('ล้างรายการเรียบร้อย', ' ', 'success', {
                                        buttons: false,
                                        timer: 1500
                                    }).then(() => {
                                        let bet_data = JSON.parse(localStorage.getItem('poy'));
                                        bet_data.poy_list = [];
                                        localStorage.setItem('poy', JSON.stringify(bet_data));
                                        loadTable();

                                        line_current = line;
                                        $(".cls_lbl_line").text("ไลน์ส่วนลด : " + line);
                                        $(".cls_customer_info").hide();
                                        $(".cls_select_packet").hide();
                                        $(".cls_create_poy").show();
                                        $("#btn_select_packet").html('<i class="fa fa-check-circle"></i> LINE ' + line);
                                        $(".txt_d_1").focus();
                                    })
                                );
                            } else {
                                $(".cls_customer_info").hide();
                                $(".cls_select_packet").hide();
                                $(".cls_create_poy").show();
                                $(".txt_d_1").focus();
                                //$('.select_line[data-line="'+line_current+'"]').click();
                            }
                        });
                    } else {
                        line_current = line;
                        $(".cls_lbl_line").text("ไลน์ส่วนลด : " + line);
                        $(".cls_select_packet").hide();
                        $(".cls_create_poy").show();
                        $("#btn_select_packet").html('<i class="fa fa-check-circle"></i> LINE ' + line);
                        $(".txt_d_1").focus();
                    }

                });

                $("#btn_select_packet").click(function() {
                    $('.select_line[data-line="' + line_current + '"]').click();
                    $(".cls_select_packet").show();
                    $(".cls_create_poy").hide();
                });

                // $("#poy-list-btn").click(function(){
                //   $("#txt_search_bet_dlg").val("");
                //   $("#txt_search_bet_dlg").focus();
                //   $('.tb_search_bet').html('<tr><td colspan="5" class="text-danger text-center table-danger">ไม่พบข้อมูล</td></tr>');
                //   $("#dialog_bet_search").modal("show");
                // });

                function usePoy(billId) {
                    tryCatchSwal(async () => {
                        const formData = new FormData();
                        formData.append('line', line_current);
                        formData.append('bill_id', billId);
                        
                        const result = await fetchJson(`{{ route('cart.usePoy') }}`, 'POST', formData);
                        if (!result) return false;

                        swal('ดึงโพยเรียบร้อย', ' ', 'success', {button: false, timer: 1000});
                        $('#poy-list-dialog').modal('hide');
                        return fetchCart();
                    });
                }

                $("#poy-list-btn").click(function() {
                    // $("#search-poy-input").val("");
                    // $("#search-poy-input").focus();
                    // $('.tb_search_bill').html(
                    //     '<tr><td colspan="6" class="text-danger text-center table-danger">ไม่พบข้อมูล</td></tr>'
                    // );
                    // $("#search-poy-btn").trigger("click");
                    $("#poy-list-dialog").modal("show");
                    tryCatchSwal(async () => {
                        const formData = new FormData();
                        formData.append('phone', currentPhone);
                        formData.append('country', document.querySelector('[name=country]:checked').value);
                        const result = await fetchJson(`{{ route('bill.search') }}`, 'POST', formData);
                        if (!result) return false;
                        
                        const poyTable = document.getElementById('tb_list_bill');
                        const poyTBody = poyTable.tBodies[0];
                        poyTBody.innerHTML = '';
                        for (const [key, bill] of Object.entries(result)) {
                            const tr = poyTBody.insertRow();
                            const td1 = tr.insertCell();
                            const td2 = tr.insertCell();
                            const td3 = tr.insertCell();
                            const td4 = tr.insertCell();

                            const detailBtn = document.createElement('button');
                            detailBtn.className = "btn btn-sm btn-primary";
                            detailBtn.innerHTML = `<i class="fas fa-search"></i>`;
                            detailBtn.type = 'button';
                            
                            const betDetail = document.createElement('table');
                            betDetail.className = 'table table-sm border table-bordered table-striped';
                            const betDetailBody = betDetail.createTBody();
                            for (const [key, item] of Object.entries(bill.bet)) {
                                const tr = betDetailBody.insertRow();
                                const tdNumber = tr.insertCell();
                                const tdType = tr.insertCell();
                                const tdPrice = tr.insertCell();

                                tdNumber.textContent = item.number; tdNumber.className = 'text-sm';
                                tdType.textContent = item.type; tdType.className = 'text-sm';
                                tdPrice.textContent = numberFormat(item.amount) + ' บาท'; tdPrice.className = 'text-sm';
                            }
                            
                            detailBtn.onclick = async () => {
                                const use = await swal({
                                    title: 'ตั๋ว: ' + bill.bill_id,
                                    content: betDetail,
                                    buttons: ['ปิด', 'ดึงโพย'],
                                });
                                if (!use) return;
                                return usePoy(bill.bill_id);
                            }

                            const usePoyBtn = document.createElement('button');
                            usePoyBtn.className = "btn btn-sm btn-success";
                            usePoyBtn.innerHTML = `<i class="fas fa-check"></i>`;
                            usePoyBtn.type = 'button';
                            usePoyBtn.onclick = () => usePoy(bill.bill_id);

                            td1.textContent = (+key) + 1; td1.className = 'text-center align-middle';
                            td2.textContent = bill.bill_id; td2.className = 'text-center align-middle';
                            td3.textContent = formattedDatetime(bill.created_at); td3.className = 'text-center align-middle';
                            td4.appendChild(detailBtn);
                            td4.appendChild(usePoyBtn);
                            td4.className = 'text-center align-middle';
                        }
                    });
                });

                $("#search-poy-btn").click(function() {
                    // alert("btn_search_bet_detail");
                    // $("body").css("cursor", "progress");
                    waitTable($("#tb_list_bill"));
                    let bill_id = $("#search-poy-input").val();
                    let phone = $("#txt_cus_phone").val();
                    $.post(`main_store.php?cm=load_bill_tmp_table`, {
                        bill: bill_id,
                        phone: phone
                    }, function(data) {
                        $('.tb_search_bill').html(data);
                        //$("body").css("cursor", "default");

                        $(".tb_search_bill .cls_btn_detail").unbind("click");
                        $(".tb_search_bill .cls_btn_detail").click(function() {
                            //alert( "User clicked on 'foo.'" );
                            let e = $(this);
                            var bill = $(this).data('bill');

                            $('#dialog_bet_search').find('#lbl_bill').text('เลขตั๋ว :  ' +
                                bill);
                            $("#hd_bill_no").val(bill);

                            //loadDetailTable(bill);
                            $.post('main_store.php?cm=search_bet_tmp', {
                                bill_id: bill
                            }, function(data) {
                                $('.tb_search_bet').html(data);

                            });



                            $('#dialog_bet_search').modal('show');
                        });


                    });
                });

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

                });

                $("#search-poy-input").keypress(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);

                    if (keycode == '13') {
                        $("#search-poy-btn").trigger("click");
                        event.preventDefault();
                    }

                });

                $("#poy-list-btn-submit").click(function() {
                    //$("#txt_customer").val($("#txt_search_bet_dlg").val());

                    if ($('.tb_search_bet tr.tr_data').length > 0) {
                        var bet_data = JSON.parse(localStorage.getItem('poy'));
                        //bet_data.poy_list = [];
                        $.each($('.tb_search_bet tr.tr_data'), function(k, v) {
                            //alert(k + ": " + $(v).find(".cls_number").text() );
                            let line = $("#now_line").val();
                            let option = "";
                            let txt_option = $(v).find(".cls_type").text();
                            let d = $(v).find(".cls_number").text();
                            let m = $(v).find(".cls_amount").text();
                            let last_num = 0;
                            var data_tmp = {
                                "option": option,
                                "option_txt": txt_option,
                                "type": txt_option,
                                "number": d,
                                "amount": parseInt(m),
                                "discount": 0,
                                "inc_discount": 0,
                                "real_inc_amount": 0,
                                "multiply": 0,
                                "is_duplicate": false,
                                "line": line,
                                "last_add_num": last_num,
                                "check_baned": "Y",
                                "reason": ""
                            };
                            bet_data.poy_list.push(data_tmp);
                        });
                        waitTable($("#tb_list"));
                        $.post('/Portal/main_store_2.php?cm=mtest', {
                            poy_list: bet_data.poy_list
                        }, function(data) {
                            bet_data.poy_list = [];
                            if (data.success) {
                                $.each(data.records, function(index, d) {
                                    if (d.check_baned == "Y") {
                                        bet_data.poy_list.push(d);
                                    }
                                });
                                localStorage.setItem('poy', JSON.stringify(bet_data));

                                loadTable();
                                $("#dialog_bet_search").modal("hide");
                                $("#poy-list-dialog").modal("hide");
                            } else {
                                swal('Error!!', data.text, 'error');
                                $("#dialog_bet_search").modal("hide");
                                $("#poy-list-dialog").modal("hide");
                            }
                        }, 'json');

                    } else {
                        swal('Warning!!', "ไม่มีข้อมูล", 'warning');
                    }
                });

                // $(".txt_d").keyup(function(event){
                //   var keycode = (event.keyCode ? event.keyCode : event.which);
                //   if(keycode == '8'){
                //     $(this).prevAll('input:visible:first').val("");
                //     $(this).prevAll('input:visible:first').focus();
                //     return;
                //   }
                //   if($(this).val() == "")
                //     return;
                //   $(this).nextAll('input:visible:first').val("");
                //   $(this).nextAll('input:visible:first').focus();
                //
                //
                // });

                $(".txt_d_1").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        //$(this).prevAll('input:visible:first').val("");
                        //$(this).prevAll('input:visible:first').focus();
                        //return;
                    }
                    if ($(this).val() == "")
                        return;
                    if (!$(".txt_d_2").hasClass("d-none")) {
                        $(".txt_d_2").val("");
                        $(".txt_d_2").focus();
                    } else if (!$('.txt_option').css('display') == 'none') {
                        // $(".txt_option").val("");
                        $(".txt_option").focus();
                    } else {
                        $(".txt_money").val("");
                        $(".txt_money").focus();
                    }
                });

                $(".txt_d_2").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        $(".txt_d_1").val("");
                        $(".txt_d_1").focus();
                        return;
                    }
                    if ($(this).val() == "")
                        return;
                    if (!$(".txt_d_3").hasClass("d-none")) {
                        $(".txt_d_3").val("");
                        $(".txt_d_3").focus();
                    } else {
                        // $(".txt_option").val("");
                        $(".txt_option").focus();
                    }
                });

                $(".txt_d_3").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        $(".txt_d_2").val("");
                        $(".txt_d_2").focus();
                        return;
                    }
                    if ($(this).val() == "")
                        return;
                    if (!$(".txt_d_4").hasClass("d-none")) {
                        $(".txt_d_4").val("");
                        $(".txt_d_4").focus();
                    } else {
                        // $(".txt_option").val("");
                        $(".txt_option").focus();
                    }
                });

                $(".txt_d_4").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        $(".txt_d_3").val("");
                        $(".txt_d_3").focus();
                        return;
                    }
                    if ($(this).val() == "")
                        return;

                    if (!$(".txt_d_5").hasClass("d-none")) {
                        $(".txt_d_5").val("");
                        $(".txt_d_5").focus();
                    } else {
                        // $(".txt_option").val("");
                        $(".txt_option").focus();
                    }
                });

                $(".txt_d_5").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        $(".txt_d_4").val("");
                        $(".txt_d_4").focus();
                        return;
                    }
                    if ($(this).val() == "")
                        return;

                    if (!$(".txt_d_6").hasClass("d-none")) {
                        $(".txt_d_6").val("");
                        $(".txt_d_6").focus();
                    } else {
                        // $(".txt_option").val("");
                        $(".txt_option").focus();
                    }
                });

                $(".txt_d_6").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        $(".txt_d_5").val("");
                        $(".txt_d_5").focus();
                        return;
                    }
                    if ($(this).val() == "")
                        return;

                    // $(".txt_option").val("");
                    $(".txt_option").focus();
                });

                $(".txt_option").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        $(this).prevAll('input:visible:first').val("");
                        $(this).prevAll('input:visible:first').focus();
                    }

                });
                $(".txt_option").keypress(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    //alert(keycode);
                    if (keycode == '47' || keycode == '42' || keycode == '13') {
                        $(".txt_money").focus();
                    } else {
                        return false;
                    }
                });
                $(".txt_money").keypress(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    var oldVal = $(".txt_option").val();
                    if (keycode == '13') {
                        if ($(".txt_money").val() == "")
                            return;
                        //$('.btn_test').trigger("click");
                        if ($(".txt_d").val() == "") {
                            $(".txt_d_1").focus();
                            return;
                        }
                        addBet();
                        $(".txt_d").val("");
                        $(".txt_money").val("")
                        $(".txt_d_1").focus();
                        $(".txt_option").val(oldVal);
                    }
                });
                $(".txt_money").keyup(function(event) {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '8') {
                        if ($(".txt_money").val() == "") {
                            $(this).prevAll('input:visible:first').val("");
                            $(this).prevAll('input:visible:first').focus();
                        }
                    }
                });

                /**
                 * เลือกหวย .card-bet-type
                 */
                for (const label of document.querySelectorAll('.card-bet-type')) {
                    label.onclick = async function (e) {
                        if (event.detail !== 1) return;
                        const input = this.control;
                        if (input.disabled) {
                            return false;
                        }
                        const currentCountry = localStorage.getItem('lottery');
                        const country = input.value;
                        const commissions = JSON.parse(input.dataset.commission);
                        const lotteryCommissions = JSON.parse(input.dataset.lotteryCommission || null);
                        const numberLimit = JSON.parse(input.dataset.numberLimit || null);

                        const closedNumDiv = document.getElementById('closed-number');
                        const closedNumTable = document.getElementById('closed-number-table');
                        const closedNumTBody = closedNumTable.tBodies[0];
                        const closedNumExists = !!closedNumTBody.rows.length;

                        const limitedNumDiv = document.getElementById('limited-number');
                        const limitedNumTable = document.getElementById('limited-number-table');
                        const limitedNumTBody = limitedNumTable.tBodies[0];
                        const limitedNumExists = !!limitedNumTBody.rows.length;

                        closedNumTBody.textContent = '';
                        limitedNumTBody.textContent = '';

                        if (numberLimit) {
                            for (const [id, item] of Object.entries(numberLimit)) {
                                const limitType = item.limit_type === 0 ? 'type' : 'number';
                                // console.log(limitRemain);
                                if (limitType === 'type') { // อั้นตามประเภท
                                    if (item.a === 0) { // ปิดรับแทง
                                        if (closedNumExists) continue;
                                        const tr = closedNumTBody.insertRow();
                                        const tdNum = tr.insertCell();
                                        const tdType = tr.insertCell();

                                        tdType.textContent = item.lottery_type;
                                        tdType.className = 'text-center';
                                        tdNum.textContent = 'ทุกเลข';
                                        tdNum.className = 'align-middle text-center p-0';
                                    } else { // อั้น
                                        if (limitedNumExists) continue;
                                        for (const [number, remain] of Object.entries(item.limit_remain)) {
                                            if (remain > 0) continue;
                                            const tr = limitedNumTBody.insertRow();
                                            const tdNum = tr.insertCell();
                                            const tdType = tr.insertCell();
                                            const tdBetAmount = tr.insertCell();
                                            const tdRemain = tr.insertCell();

                                            tdType.textContent = item.lottery_type;
                                            tdType.className = 'text-center';
                                            tdNum.textContent = number;
                                            tdNum.className = 'align-middle text-center p-0';
                                            tdBetAmount.style.display = 'none';
                                            tdRemain.textContent = numberFormat(remain);
                                            tdRemain.className = 'align-middle text-center p-0 text-danger';
                                        }
                                    }
                                } else if (limitType === 'number') { // อั้นตามหมายเลข
                                    if (item.limit_amount === 0) { // ปิดรับแทง
                                        if (closedNumExists) continue;
                                        const tr = closedNumTBody.insertRow();
                                        const tdNum = tr.insertCell();
                                        const tdType = tr.insertCell();

                                        tdType.textContent = item.lottery_type;
                                        tdType.className = 'text-center';
                                        tdNum.textContent = item.limit_number;
                                        tdNum.className = 'align-middle text-center p-0';
                                    } else if (item.limit_remain === 0) { // อั้น (เต็ม)
                                        if (limitedNumExists) continue;
                                        const tr = limitedNumTBody.insertRow();
                                        const tdNum = tr.insertCell();
                                        const tdType = tr.insertCell();
                                        const tdBetAmount = tr.insertCell();
                                        const tdRemain = tr.insertCell();

                                        tdType.textContent = item.lottery_type;
                                        tdType.className = 'text-center';
                                        tdNum.textContent = item.limit_number;
                                        tdNum.className = 'align-middle text-center p-0';
                                        tdBetAmount.style.display = 'none';
                                        tdRemain.textContent = 0;
                                        tdRemain.className = 'align-middle text-center p-0 text-danger';
                                    }
                                }
                            }
                            closedNumDiv.style.display = closedNumTBody.rows.length ? '' : 'none';
                            limitedNumDiv.style.display = limitedNumTBody.rows.length ? '' : 'none';
                        }

                        // สลับหวย
                        if (currentCountry && currentCountry !== country) {
                            const confirm = await swal({
                                title: 'แจ้งเตือน!!',
                                text: 'คุณกำลังทำการเลือกแทงหวยใหม่ หากต้องการดำเนินการ ระบบจะทำการล้างรายการหวยที่คุณได้เลือกไว้',
                                icon: 'warning',
                                buttons: ['ยกเลิก', 'ยืนยัน']
                            })
                            if (!confirm) return;

                            resetCart(() => swal('ล้างรายการเรียบร้อย', ' ', 'success', {
                                buttons: false,
                                timer: 1500
                            }));
                        }

                        // loop แสดง commission line ในตาราง
                        for (const line in commissions) {
                            const commission = commissions[line];
                            const table = document.querySelector(`table[data-table-line="${line}"]`);
                            const tbody = table.tBodies[0]
                            const thead = table.tHead;
                            thead.querySelector('th:last-child').style.display = country === 'LT' ? 'none' : 'table-cell';
                            tbody.innerHTML = '';
                            for (const type in commission) {
                                const item = commission[type];
                                const tr = tbody.insertRow();
                                const td_1 = tr.insertCell();
                                const td_2 = tr.insertCell();
                                
                                td_1.textContent = type;
                                td_1.className = 'align-middle text-lg text-center p-0 text-info font-weight-bold';
                                td_2.textContent = item.discount + '%';
                                td_2.className = 'text-lg text-center text-success font-weight-bold';

                                if (country !== 'LT') {
                                    const td_3 = tr.insertCell();
                                    td_3.textContent = numberFormat(item.payment) + ' THB';
                                    td_3.className = 'text-lg text-center font-weight-bold';
                                }
                            }

                            /**
                             * หวยล็อตเตอรี่เท่านั้น
                             */
                            if (country !== 'LT') {
                                const lotteryCommissionTables = document.querySelectorAll('[id^=lottery-commission-table]');
                                for (const table of lotteryCommissionTables) {
                                    table.remove();
                                }
                            } else {
                                const lotteryCommissionTable = document.querySelector(`[id=lottery-commission-table-${line}]`);
                                if (lotteryCommissionTable) continue;

                                const lotteryTable = document.createElement('table');
                                lotteryTable.id = 'lottery-commission-table-' + line;
                                const lotteryTBody = lotteryTable.createTBody();
                                const lotteryTHead = lotteryTable.createTHead();
                                lotteryTable.className = `table table-striped table-dark mt-5 tb_lottery_line_${line} table-sm table-hover table-bordered border-top-0 border-bottom-0`;
                                if (line !== 'c') {
                                    lotteryTable.style.display = 'none';
                                }

                                const lotteryTHeadTr = lotteryTHead.insertRow();
                                const theadTh_1 = document.createElement('th');
                                const theadTh_2 = document.createElement('th');
                                const theadTh_3 = document.createElement('th');
                                theadTh_1.className = 'align-middle text-lg text-center'; 
                                theadTh_1.textContent = 'รางวัล';
                                theadTh_2.className = 'align-middle text-lg text-center'; 
                                theadTh_2.textContent = 'ส่วนลด';
                                theadTh_3.className = 'align-middle text-lg text-center'; 
                                theadTh_3.textContent = 'อัตราจ่าย';
                                lotteryTHeadTr.appendChild(theadTh_1);
                                lotteryTHeadTr.appendChild(theadTh_2);
                                lotteryTHeadTr.appendChild(theadTh_3);
                                
                                for (const type in lotteryCommissions[line]) {
                                    const payment = lotteryCommissions[line][type];
                                    const tr = lotteryTBody.insertRow();

                                    const td_1 = tr.insertCell();
                                    const td_2 = tr.insertCell();
                                    const td_3 = tr.insertCell();

                                    td_1.textContent = type;
                                    td_1.className = 'align-middle text-lg text-center p-0 text-info font-weight-bold';
                                    td_2.textContent = commissions[line]['ล็อตเตอรี่']['discount'] + '%';
                                    td_2.className = 'text-lg text-center text-success font-weight-bold';
                                    td_3.textContent = numberFormat(payment) + ' THB';
                                    td_3.className = 'text-lg text-center font-weight-bold';
                                }
                                table.parentElement.insertBefore(lotteryTable, table.nextElementSibling);
                            } // END if country !== LT

                        } // END for-in commissions

                        // แสดงเครื่องมือเฉพาะหวยที่เลือก
                        for (const element of document.querySelectorAll(`.lottery-type-depend`)) {
                            const lotteries = JSON.parse(element.dataset.lottery);
                            element.style.display = lotteries.includes(input.value) ? '' : 'none';
                        }

                        // แสดงงวดวันที่ของหวยที่เลือก
                        const displayDate = document.getElementById('display_date');
                        displayDate.textContent = formattedDatetime(this.querySelector('[data-date]').dataset.date, false);

                        // แสดงตัวนับถอยหลังของหวยที่เลือก
                        const remain = document.getElementById('remain');
                        countDown(this.querySelector('[data-remain]').dataset.remain, remain, () => {
                            remain.textContent = 'หมดเวลารับแทง';
                            swal('หมดเวลารับแทง', ' ', 'info', {
                                buttons: false,
                                timer: 1500
                            }).then(() => $('#btn_finish').trigger('click'));
                        });

                        // ถ้าเป็นหวยล็อตเตอรี่ ให้ขึ้นเครื่องมือเฉพาะของตัวเอง
                        if (country === 'LT') {
                            $('.opt_teng_lottery').addClass('active');
                            $(".opt_teng_bon_3").removeClass("active");
                            $('.txt_d_5, .txt_d_6').removeClass('d-none');
                            $('.cls_badge, .opt').removeClass('.active');
                            $('#teng_lottery_label').addClass('active');
                        } else if (country === 'LN') {
                            $('.opt_teng_number').addClass('active');
                            $(".opt_teng_bon_3").removeClass("active");
                            $('.txt_d_1, txt_d_2').removeClass('d-none');
                            $('.txt_d_3, txt_d_4, txt_d_5, .txt_d_6').addClass('d-none');
                            $('.cls_badge, .opt').removeClass('.active');
                            $('#teng_number_label').addClass('active');
                        } else {
                            $('.opt_teng_lottery, .opt_teng_number').removeClass('active');
                            $(".opt_teng_bon_3").addClass("active");
                            $('.txt_d_1, .txt_d_2, .txt_d_3').removeClass('d-none');
                            $('.txt_d_5, .txt_d_6').addClass('d-none');
                            $('#teng_bon_3_label').addClass('active');
                        }
                        setOption();

                        $(".card-bet-type").removeClass("card-bet-select");
                        $(this).addClass("card-bet-select");
                        $('#btn_to_select_line').trigger('click');
                        localStorage.setItem('lottery', country);
                    }
                }

                function addBet() {
                    var bet_data = JSON.parse(localStorage.getItem('poy'));
                    //alert(mTest.bet_id);
                    var data = [];
                    //alert(last_num);
                    var d1, d2, d3, d4, d5, d6 = "";
                    d1 = $('.txt_d_1').val();
                    d2 = $('.txt_d_2').val();
                    d3 = $('.txt_d_3').val();
                    d4 = $('.txt_d_4').val();
                    d5 = $('.txt_d_5').val();
                    d6 = $('.txt_d_6').val();
                    var d = '' + d1 + d2 + d3;

                    var m = $(".txt_money").val();
                    var option = "";
                    const optionList = [];
                    const txtOptions = $(".txt_option").val();
                    if ($(".opt_teng_bon_3").hasClass("active")) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_bon_3");
                        if (txtOptions.includes("/"))               optionList.push("tode_3");
                        if (txtOptions.includes("*"))               optionList.push("shuffle_3");
                    }
                    if ($(".opt_teng_bon_first_3").hasClass("active")) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_bon_first_3");
                        if (txtOptions.includes("/"))               optionList.push("teng_bon_first_3_toad");
                        if (txtOptions.includes("*"))               optionList.push("shuffle_bon_first_3");
                    }
                    if ($(".opt_teng_lang_3").hasClass("active")) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_lang_3");
                        if (txtOptions.includes("*"))               optionList.push("shuffle_lang_3");
                    }
                    if ($(".opt_teng_nha_3").hasClass("active")) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_nha_3");
                        if (txtOptions.includes("*"))               optionList.push("shuffle_nha_3");
                    }
                    if ($(".opt_teng_bon_4").hasClass("active")) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_bon_4");
                        if (txtOptions.includes("/"))               optionList.push("tode_bon_4");
                    }
                    if ($(".opt_teng_nha_bon_4").hasClass("active")) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_nha_bon_4");
                        if (txtOptions.includes("/"))               optionList.push("tode_nha_bon_4");
                    }
                    if ($(".opt_teng_bon_2").hasClass("active") && $(".bet_two.active").length == 0) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_bon_2");
                        if (txtOptions.includes("*"))               optionList.push("shuffle_bon_2");
                        if (txtOptions.includes("/"))               optionList.push("teng_bon_2_toad");
                    }
                    if ($(".opt_teng_lang_2").hasClass("active") && $(".bet_two.active").length == 0) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_lang_2");
                        if (txtOptions.includes("*"))               optionList.push("shuffle_lang_2");
                    }
                    if ($(".opt_teng_bon_first_2").hasClass("active") && $(".bet_two.active").length == 0) {
                        if ((txtOptions.includes('-') && !txtOptions.includes("*")) || !txtOptions) 
                                                                    optionList.push("teng_bon_first_2");
                        if (txtOptions.includes("*"))               optionList.push("shuffle_bon_first_2");
                    }
                    // วิ่ง 3 บน
                    if ($(".opt_teng_bon_1").hasClass("active"))     optionList.push("teng_bon_1");
                    // วิ่ง 2 บน
                    if ($(".opt_teng_bon_2x").hasClass("active"))    optionList.push("teng_bon_2x");
                    // วิ่งล่าง
                    if ($(".opt_teng_lang_1").hasClass("active"))    optionList.push("teng_lang_1");
                    // 19 ประตู  option_2_19
                    if ($("#option_2_19").hasClass("active"))        optionList.push("option_2_19");
                    // รูดหน้า
                    if ($("#option_2_roodnha").hasClass("active"))   optionList.push("option_2_roodnha");
                    // รูดหลัง
                    if ($("#option_2_roodlung").hasClass("active"))  optionList.push("option_2_roodlung");

                    /** Lottery */
                    if ($(".opt_teng_lottery").hasClass("active") && $(".txt_option").val() != "/") {
                        optionList.push("teng_lottery");
                    } /** END Lottery */

                    /** Lottery Number */
                    if ($(".opt_teng_number").hasClass("active") && $(".txt_option").val() != "/") {
                        optionList.push("teng_number");
                    } /** END Lottery Number */

                    for (const index in optionList) {
                        const option = optionList[index];
                        const rec = generateData(d1, d2, d3, d4, d5, d6, m, option);
                        $.each(rec, (index, d) => data.push(d));
                    }

                    $.each(data, (index, d) => bet_data.poy_list.push(d));
                    $("#loadPage").show();

                    $.post(`{{ route('cart.frontAddCart') }}`, {
                        poy_list: bet_data.poy_list,
                        country: document.querySelector('[name=country]:checked').value,
                    }, function(data) {
                        bet_data.poy_list = [];
                        if (data.success) {
                            $.each(data.records, function(index, data) {
                                if (data.check_baned == "Y") {
                                    bet_data.poy_list.push(data);
                                }
                            });

                            localStorage.setItem('poy', JSON.stringify(bet_data));
                            loadTable();
                            // checkBanedNumber();
                            
                            const options = document.querySelector('.btn-group-toggle');
                            options.querySelectorAll('input').forEach(el => { el.checked = el.id === 'option1' });
                            options.querySelectorAll('label').forEach(el => { 
                                if (el.children[0].id === 'option1') {
                                    el.classList.add('active');
                                } else {
                                    el.classList.remove('active');
                                }
                            });
                            $('input[name="optionsNew"]').change();
                            $("#loadPage").hide();
                        } else {
                            $("#loadPage").hide();
                            swal('ไม่สามารถทำรายการได้', data.text, 'error');
                        }
                    }, 'json');


                }

                function generateData(d1, d2, d3, d4, d5, d6, m, option) {
                    // console.log(d1, d2, d3, d4, m, option);
                    var bet_data = JSON.parse(localStorage.getItem('poy'));
                    let last_num = 0;
                    last_num = getMaxLastNum(bet_data.poy_list, "last_add_num");
                    last_num = last_num += 1
                    let dis = 15;
                    let pay = (m - (m * dis / 100));
                    var data = [];

                    var d = null;
                    var data_tmp = null;
                    if (option == "teng_bon_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "tode_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "shuffle_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d1 + d3 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d1 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d3 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d2 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);

                        data = data.filter((obj, pos, arr) => {
                            return arr.map(mapObj => mapObj["number"]).indexOf(obj["number"]) === pos;
                        });
                    } else if (option == "teng_lang_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_nha_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "shuffle_lang_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d1 + d3 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d1 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d3 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d2 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);

                        data = data.filter((obj, pos, arr) => {
                            return arr.map(mapObj => mapObj["number"]).indexOf(obj["number"]) === pos;
                        });
                    } else if (option == "teng_bon_first_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_bon_first_3_toad") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "shuffle_bon_first_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d1 + d3 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d1 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d3 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d2 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);

                        data = data.filter((obj, pos, arr) => {
                            return arr.map(mapObj => mapObj["number"]).indexOf(obj["number"]) === pos;
                        });
                    } else if (option == "shuffle_nha_3") {
                        d = d1 + d2 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d1 + d3 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d1 + d3 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d2 + d3 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        d = d3 + d2 + d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);

                        data = data.filter((obj, pos, arr) => {
                            return arr.map(mapObj => mapObj["number"]).indexOf(obj["number"]) === pos;
                        });
                    } else if (option == "teng_number") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_lottery") {
                        d = d1 + d2 + d3 + d4 + d5 + d6 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_bon_4") {
                        d = d1 + d2 + d3 + d4 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "tode_bon_4") {
                        d = d1 + d2 + d3 + d4 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_nha_bon_4") {
                        d = d1 + d2 + d3 + d4 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "tode_nha_bon_4") {
                        d = d1 + d2 + d3 + d4 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_bon_2") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_bon_2_toad") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_lang_2") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "shuffle_bon_2") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        if (d1 != d2) {
                            d = d2 + d1 + "";
                            data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                            data.push(data_tmp);
                        }
                    } else if (option == "shuffle_lang_2") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        if (d1 != d2) {
                            d = d2 + d1 + "";
                            data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                            data.push(data_tmp);
                        }
                    } else if (option == "shuffle_bon_first_2") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                        if (d1 != d2) {
                            d = d2 + d1 + "";
                            data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                            data.push(data_tmp);
                        }
                    } else if (option == "teng_bon_first_2_toad") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_bon_first_2") {
                        d = d1 + d2 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_bon_1") {
                        d = d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_bon_2x") {
                        d = d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "teng_lang_1") {
                        d = d1 + "";
                        data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                        data.push(data_tmp);
                    } else if (option == "option_2_low") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) < 50) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) < 50) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    } else if (option == "option_2_high") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) > 49) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) > 49) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    } else if (option == "option_2_odd") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) % 2 == 1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) % 2 == 1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    } else if (option == "option_2_even") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) % 2 == 0) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (parseInt(d) % 2 == 0) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    } else if (option == "option_2_ble") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(0, 1) == d.substring(1, 2)) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(0, 1) == d.substring(1, 2)) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    } else if (option == "option_2_19") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(0, 1) == d1 || d.substring(1, 2) == d1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(0, 1) == d1 || d.substring(1, 2) == d1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    } else if (option == "option_2_roodnha") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(0, 1) == d1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(0, 1) == d1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    } else if (option == "option_2_roodlung") {
                        if ($(".opt_teng_bon_2").hasClass("active")) {
                            option = "teng_bon_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(1, 2) == d1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                        if ($(".opt_teng_lang_2").hasClass("active")) {
                            option = "teng_lang_2";
                            $.each(num_2, function(index, d) {
                                if (d.substring(1, 2) == d1) {
                                    data_tmp = generateRecord(d, m, dis, pay, last_num, option);
                                    data.push(data_tmp);
                                }
                            });
                        }
                    }

                    return data;
                }

                function generateRecord(d, m, dis, pay, last_num, option) {
                    console.log(option)
                    let txt_option = "";
                    if (option == "teng_bon_3" || option == "shuffle_3") {
                        txt_option = "3 ตัวบน";
                    } else if (option == "tode_3") {
                        txt_option = "3 ตัวบนโต๊ด";
                    } else if (option == "teng_lang_3" || option == "shuffle_lang_3") {
                        txt_option = "3 ตัวล่าง";
                    } else if (option == "teng_nha_3" || option == "shuffle_nha_3") {
                        txt_option = "3 ตัวหน้า";
                    } else if (option == "teng_bon_first_3" || option == 'shuffle_bon_first_3') {
                        txt_option = "3 ตัวแรกบน";
                    } else if (option == "teng_bon_first_3_toad") {
                        txt_option = "3 ตัวแรกบนโต๊ด";
                    } else if (option == "teng_bon_2" || option == "shuffle_bon_2") {
                        txt_option = "2 ตัวบน";
                    } else if (option == "teng_bon_2_toad") {
                        txt_option = "2 ตัวบนโต๊ด";
                    } else if (option == "teng_lang_2" || option == "shuffle_lang_2") {
                        txt_option = "2 ตัวล่าง";
                    } else if (option == "teng_bon_2") {
                        txt_option = "2 ตัวบน";
                    } else if (option == "teng_lang_2") {
                        txt_option = "2 ตัวล่าง";
                    } else if (option == "teng_bon_first_2" || option == "shuffle_bon_first_2") {
                        txt_option = "2 ตัวแรกบน";
                    } else if (option == "teng_bon_1") {
                        txt_option = "วิ่ง 3 ตัวบน";
                    } else if (option == "teng_bon_2x") {
                        txt_option = "วิ่ง 2 ตัวบน";
                    } else if (option == "teng_lang_1") {
                        txt_option = "วิ่ง 2 ตัวล่าง";
                    } else if (option == "teng_bon_4") {
                        txt_option = "4 ตัวบน";
                    } else if (option == "tode_bon_4") {
                        txt_option = "4 ตัวบนโต๊ด";
                    } else if (option == "teng_nha_bon_4") {
                        txt_option = "4 ตัวแรกบน";
                    } else if (option == "tode_nha_bon_4") {
                        txt_option = "4 ตัวแรกบนโต๊ด";
                    } else if (option == "teng_lottery") {
                        txt_option = "ล็อตเตอรี่";
                    } else if (option == "teng_number") {
                        txt_option = "เลข";
                    }

                    let line = $("#now_line").val();
                    var com = 0;
                    // var postData = {line:line,type:txt_option};
                    // new Promise(function(resolve, reject){
                    //
                    // });
                    // $.post('main_store_2.php?cm=loadCommissionLineCom', postData, function(response){
                    //   com = response;
                    // });

                    // var data_tmp = {
                    //     "option":option,
                    //     "option_txt":txt_option,
                    //     "type":txt_option,
                    //     "number":d,
                    //     "amount":parseInt(m),
                    //     "discount":com,
                    //     "inc_discount": parseInt(m)/100*com,
                    //     "real_inc_amount":parseInt(m)-(parseInt(m)/100*com),
                    //     "multiply":0,
                    //     "is_duplicate":false,
                    //     "line":line,
                    //     "last_add_num":last_num
                    // };

                    var data_tmp = {
                        "option": option,
                        "option_txt": txt_option,
                        "type": txt_option,
                        "number": d,
                        "amount": parseInt(m),
                        "discount": 0,
                        "inc_discount": 0,
                        "real_inc_amount": 0,
                        "multiply": 0,
                        "is_duplicate": false,
                        "line": line,
                        "last_add_num": last_num,
                        "check_baned": "Y",
                        "reason": ""
                    };
                    return data_tmp;
                }

                function setOption() {
                    $(".txt_d").val("");
                    $(".txt_money").val("")
                    $(".txt_d_1").focus();
                    $("#resultoption .badge").addClass("d-none");
                    $(".2option").hide();
                    $('.btn-group-toggle label').show();

                    for (const input of document.querySelectorAll('[name="optionsNew"]')) {
                        input.checked = false;
                        input.labels[0].classList.remove('active');
                        input.labels[0].hidden = false;
                    }
                    $('input[name="optionsNew"]').change();

                    // $('.btn-group-toggle').find('label:eq(1)').show();

                    //cls_spacial_opt
                    if (
                        $(".opt_teng_bon_1").hasClass("active")
                        || $(".opt_teng_bon_2x").hasClass("active")
                        || $(".opt_teng_lang_1").hasClass("active")
                        || $("#option_2_19").hasClass("active")
                        || $("#option_2_roodnha").hasClass("active")
                        || $("#option_2_roodlung").hasClass("active")
                    ) {
                        $(".cls_spacial_opt").hide();
                    } else {
                        $(".cls_spacial_opt").show();
                    }

                    if ($(".opt_teng_bon_3").hasClass("active")) {
                        $("#teng_bon_3_label").removeClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                    if ($(".opt_teng_bon_first_3").hasClass("active")) {
                        $("#teng_bon_first_3_label").removeClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                    if ($(".opt_teng_lang_3").hasClass("active")) {
                        $("#teng_lang_3_label").removeClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                    if ($(".opt_teng_nha_3").hasClass("active")) {
                        $("#teng_lang_nha_3_label").removeClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                    if ($(".opt_tode_3").hasClass("active"))
                        $("#tode_3_label").removeClass("d-none");
                    if ($(".opt_shuffle_3").hasClass("active"))
                        $("#shuffle_3_label").removeClass("d-none");

                    if ($(".opt_teng_bon_2").hasClass("active")) {
                        $("#teng_bon_2_label").removeClass("d-none");
                        $(".2option").show();
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                    }
                    if ($(".opt_teng_lang_2").hasClass("active")) {
                        $("#teng_lang_2_label").removeClass("d-none");
                        $(".2option").show();
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $('.btn-group-toggle').find('label:eq(1)').hide();
                    }
                    if ($(".opt_teng_bon_first_2").hasClass("active")) {
                        $("#teng_bon_first_2_label").removeClass("d-none");
                        // $(".2option").show();
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");

                        $('.btn-group-toggle').find('label:eq(1)').hide();

                    }
                    if ($(".opt_shuffle_2").hasClass("active"))
                        $("#shuffle_2_label").removeClass("d-none");
                    //$("#2option").show();
                    if ($(".opt_teng_bon_1").hasClass("active")) {
                        $("#teng_bon_1_label").removeClass("d-none");
                        $(".txt_d_2").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                    }
                    if ($(".opt_teng_bon_2x").hasClass("active")) {
                        $("#teng_bon_2x_label").removeClass("d-none");
                        $(".txt_d_2").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                    }

                    if ($(".opt_teng_lang_1").hasClass("active")) {
                        $("#teng_lang_1_label").removeClass("d-none");
                        $(".txt_d_2").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                    }

                    if ($("#option_2_19").hasClass("active")) {
                        $("#option_2_19_label").removeClass("d-none");
                        $(".txt_d_2").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                        for (const input of document.querySelectorAll('[name="optionsNew"]')) {
                            input.labels[0].hidden = true;
                        }
                        $('input[name="optionsNew"]').change();
                    }
                    if ($("#option_2_roodnha").hasClass("active")) {
                        $("#option_2_roodnha_label").removeClass("d-none");
                        $(".txt_d_2").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                    }
                    if ($("#option_2_roodlung").hasClass("active")) {
                        $("#option_2_roodlung_label").removeClass("d-none");
                        $(".txt_d_2").addClass("d-none");
                        $(".txt_d_3").addClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                    }
                    if ($(".opt_teng_bon_4").hasClass("active")) {
                        $("#teng_bon_4_label").removeClass("d-none");
                        $(".txt_d_4").removeClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                    if ($(".opt_teng_nha_bon_4").hasClass("active")) {
                        $("#teng_nha_bon_4_label").removeClass("d-none");
                        $(".txt_d_4").removeClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                    if ($(".opt.active").length == 0) {
                        $(".opt_teng_bon_3").addClass("active");
                        $("#resultoption .badge").addClass("d-none");
                        $("#teng_bon_3_label").removeClass("d-none");
                        $(".txt_d_4").addClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                        //setOption();
                    }
                    
                    if ($(".opt_teng_lottery").hasClass("active")) {
                        $("#teng_lottery_label").removeClass("d-none");
                        $(".txt_d_6").removeClass("d-none");
                        $(".txt_d_5").removeClass("d-none");
                        $(".txt_d_4").removeClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                    if ($(".opt_teng_lottery").hasClass("active")) {
                        $("#teng_lottery_label").removeClass("d-none");
                        $(".txt_d_6").removeClass("d-none");
                        $(".txt_d_5").removeClass("d-none");
                        $(".txt_d_4").removeClass("d-none");
                        $(".txt_d_2").removeClass("d-none");
                        $(".txt_d_3").removeClass("d-none");
                    }

                }
                function getMaxLastNum(arr, prop) {
                    var max;
                    for (var i = 0; i < arr.length; i++) {
                        if (max == null || parseInt(arr[i][prop]) > parseInt(max[prop]))
                            max = arr[i];
                    }
                    if (typeof max !== "undefined") {
                        return max.last_add_num
                    } else {
                        return 0;
                    }

                }
            });

            function waitTable(elm) {
                let col = elm.find("th").length;
                elm.find('tbody').html(
                    $('<tr/>').append(
                        $('<td colspan="' + col + '"></td>').append(
                            $('<div/>').addClass('d-flex justify-content-center my-5').append(
                                $('<i/>').addClass('fas fa-sync fa-spin fa-3x')
                            )
                        )
                    )
                );
            }

            // function checkBanedNumber() {
            //     var betstaff = $.post('main.php?cm=betStaff_checkBanedNumber', {}, function(data) {
            //         $('.addAfter').html(data);
            //     });
            // }

        </script>
    @endsection
@else
    @section('content')
        <div class="row">
            <div class="col-auto mx-auto">
                <div class="card bg-danger text-white radio radio-">
                    <div class="card-body p-sm-5">
                        <div class="text-center"><i class="fas fa-times fa-6x"></i></div>
                        <p class="lead text-center mb-0">ไม่มีหวยที่เปิดงวดอยู่ในขณะนี้</p>
                    </div>
                </div>
            </div>
        </div>
    @endsection
@endif