<?php

require '../template/header.php';

require '../library/database.php';



function	status($status_refill){

    switch($status_refill){

        case '0':

            return '<span class="badge bg-warning">รอการชำระเงิน</span>';

        break;

        case '1':

            return '<span class="badge bg-success">เติมเงินสำเร็จ</span>';

        break;

		case '2':

            return '<span class="badge bg-primary">รับไอเทมเรียบร้อย</span>';

        break;

        default:

            return 'NULL';

        break;

    }

}

if (!isset($_SESSION["session_user"]) || $_SESSION["session_user"] !== TRUE) {

    header("location: ". $app_url . "/login.php");

}

?>

<section class="fxt-template-animation fxt-template-layout22" data-bg-image="<?= $app_url ?>/assets/img/figure/bg.jpg">

    <!-- Star Animation Start Here -->

    <div class="star-animation">

        <div id="stars4"></div>

        <div id="stars5"></div>

    </div>

    <!-- Star Animation End Here -->

    <div class="container">

        <div class="row align-items-center justify-content-md-center shadow-lg">

            <div class="col-lg-12 fxt-bg-color">

                <div class="fxt-content">

                    <div class="fxt-form">

                        <h2>ยินดีต้อนรับสมาชิก</h2>

                        <p>ไอดีเกมส์ : <span style="color:red;text-transform: uppercase;"><?= htmlspecialchars($_SESSION['userid']) ?></span></p>

                        <?php require_once '../template/menu.php'; ?>



                        <div class="shadow p-2 mb-3 bg-body rounded">

                            <ul class="list-group list-group-flush">

                                <li class="list-group-item">

                                    <h5 class="card-title mb-3">ข้อมูลเติมเงิน <span style="color:blue;font-size:14px">Refill Info</span></h5>

                                    <div class="row">

                                        <div class="col-lg-5">

                                            <div class="border shadow-sm p-3 mb-3 bg-body rounded-start">

                                                <h6 class="card-title text-center mt-3">ระบบโอนเงินสแกน Qrcode (อัตโนมัติ)</h6>

                                                <form method="post" id="send_refill" class="mt-5 mb-5">

                                                    <div class="alert alert-primary" style="font-size: 11px;font-family: none;">

                                                        เมื่อกดปุ่มเติมเงินจะปรากฏหน้า QR CODE ให้สแกนชำระเงินได้เลย

                                                    </div>

                                                    <div class="mb-2">

                                                        <label for="userid" class="form-label">Username ID</label>

                                                        <input type="text" class="form-control" id="userid" value="<?= htmlspecialchars($_SESSION['userid']) ?>" disabled>

                                                    </div>

                                                    <!--<div class="mb-2">

                                                        <label class="form-label">Amount</label>

                                                        <select class="form-select" name="amount">

                                                            <option value='0'>โปรดเลือกจำนวนเงินที่ต้องการเติมเงิน</option>

                                                            <?php

                                                            $es = 0;

                                                            foreach ($amount_list as $amount) {

                                                                echo "<option value='" . $amount . "'>" . number_format($amount, 0) . " บาท</option>";

                                                            }

                                                            ?>

                                                        </select>

                                                    </div>-->

                                                    <div class="d-grid gap-2">

                                                        <button class="btn btn-primary" type="button" onclick="window.open('https://45.91.133.191/member/ppayh/index.php', '_blank', 'width=900,height=900');">เติมเงินเกมส์</button>

                                                    </div>

                                                </form>

                                            </div>

                                        </div>

                                        <div class="col-lg-7">

                                            <div class="border shadow-sm p-3 mb-3 bg-body rounded-start">

                                                <div class="table-responsive">

                                                    <table class="table table-hover">

                                                        <thead>

                                                            <tr>

                                                                <th class="text-center bg-light bg-gradient">Amount</th>

                                                                <th class="text-center bg-light bg-gradient">Cash Point</th>

                                                                <!--<th class="text-center bg-light bg-gradient">Bonus Point</th>-->

                                                                <!--<th class="text-center bg-light bg-gradient">Item Reward</th>-->

                                                            </tr>

                                                        </thead>

                                                        <tbody>

                                                            <!--<tr>-->

                                                            <!--    <td class="text-center">50</td>-->

                                                            <!--    <td class="text-center">500</td>-->

                                                                <!--<td class="text-center">50</td>-->

                                                                <!--<td class="text-center">Red Potion 1ea</td>-->

                                                            <!--</tr>-->

                                                            <tr>

                                                                <td class="text-center">100</td>

                                                                <td class="text-center">1,000</td>

                                                                <!--<td class="text-center">100</td>-->

                                                                <!--<td class="text-center">Red Potion 2ea</td>-->

                                                            </tr>

                                                            <!--<tr>-->

                                                            <!--    <td class="text-center">150</td>-->

                                                            <!--    <td class="text-center">1,500</td>-->

                                                                <!--<td class="text-center">150</td>-->

                                                                <!--<td class="text-center">Red Potion 3ea</td>-->

                                                            <!--</tr>-->

                                                            <tr>

                                                                <td class="text-center">300</td>

                                                                <td class="text-center">3,000</td>

                                                                <!--<td class="text-center">300</td>-->

                                                                <!--<td class="text-center">Red Potion 4ea</td>-->

                                                            </tr>

                                                            <tr>

                                                                <td class="text-center">500</td>

                                                                <td class="text-center">5,000</td>

                                                                <!--<td class="text-center">500</td>-->

                                                                <!--<td class="text-center">Red Potion 5ea</td>-->

                                                            </tr>

                                                            <tr>

                                                                <td class="text-center">1,000</td>

                                                                <td class="text-center">11,000</td>

                                                                <!--<td class="text-center">1,000</td>-->

                                                                <!--<td class="text-center">Red Potion 6ea</td>-->

                                                            </tr>

                                                            <!--<tr>-->

                                                            <!--    <td class="text-center">1,500</td>-->

                                                            <!--    <td class="text-center">15,000</td>-->

                                                                <!--<td class="text-center">1,500</td>-->

                                                                <!--<td class="text-center">Red Potion 7ea</td>-->

                                                            <!--</tr>-->

                                                            <tr>

                                                                <td class="text-center">3,000</td>

                                                                <td class="text-center">35,000</td>

                                                                <!--<td class="text-center">3,000</td>-->

                                                                <!--<td class="text-center">Red Potion 8ea</td>-->

                                                            </tr>

                                                            <tr>

                                                                <td class="text-center">5,000</td>

                                                                <td class="text-center">70,000</td>

                                                                <!--<td class="text-center">5,000</td>-->

                                                                <!--<td class="text-center">Red Potion 9ea</td>-->

                                                            </tr>

                                                            <tr>

                                                                <td class="text-center">10,000</td>

                                                                <td class="text-center">150,000</td>

                                                                <!--<td class="text-center">10,000</td>-->

                                                                <!--<td class="text-center">Red Potion 10ea</td>-->

                                                            </tr>

                                                        </tbody>

                                                    </table>

                                                </div>

                                            </div>

                                        </div>

                                    </div>

                                </li>

                                <li class="list-group-item">

                                    <h5 class="card-title mb-3">ประวัติเติมเงิน <span style="color:blue;font-size:14px">Refill History</span></h5>

                                    <div class="border shadow-sm p-3 mb-3 bg-body rounded-start">

                                        <div class="table-responsive">

                                            <table class="table table-hover" id="refill_show">

                                                <thead>

                                                    <tr>

                                                    <th class="text-center bg-light bg-gradient">จำนวนเงิน</th>

                                                    <th class="text-center bg-light bg-gradient">เวลาทำรายการ</th>

                                                    <th class="text-center bg-light bg-gradient">เวลาอัพเดทสถานะ</th>

                                                    <th class="text-center bg-light bg-gradient">สถานะ</th>

                                                    </tr>

                                                </thead>

                                                <tbody>

                                            <?php

                                                $account_id = $con->real_escape_string($_SESSION['account_id']);

												$history = $con->query("SELECT `amount`,`status`,`created_at`,`updated_at` FROM `donate` WHERE account_id = {$account_id}");

                                                if ($history->num_rows > 0) {

                                                    while ($refill = $history->fetch_object()) 

                                                    {

                                                        if ($refill->status >= 1) {

                                            ?>

											<tr>

											<td class="text-center"><?= number_format($refill->amount,2) ?> บาท</td>

											<td class="text-center"><?= htmlspecialchars($refill->created_at) ?></td>

											<td class="text-center"><?= htmlspecialchars($refill->updated_at) ?></td>

											<td class="text-center"><?= status($refill->status) ?></td>

											</tr>

                                            <?php       } 

                                                    } 

                                                } ?>

                                                </tbody>

                                            </table>

                                        </div>

                                    </div>

                                </li>

                            </ul>

                        </div>

                    </div>

                    <div class="fxt-footer">

                        <p>คุณต้องการออกจากระบบใช่หรือไม่ ?<a href="<?= $app_url ?>/logout.php" class="switcher-text2 inline-text">คลิกที่นี้</a></p>

                    </div>

                </div>

            </div>

        </div>

    </div>

</section>

<!-- Modal -->

<div class="modal fade" id="RefillModal" data-bs-backdrop="static" tabindex="-1" aria-labelledby="RefillModalLabel" aria-hidden="true">

    <div class="modal-dialog modal-md">

        <div class="modal-content">

            <div class="modal-header">

                <h5 class="modal-title" id="RefillModalLabel">คุณมีเวลาเติมเงิน : <span id="countdown" style="color:red"></span></h5>

                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>

            </div>

            <div class="modal-body">

                <div id="show_refill" class="text-center"></div>

            </div>

            <div class="modal-footer">

                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">ปิดหน้าต่าง</button>

            </div>

        </div>

    </div>

</div>

<script>

    var referenceNo = 0;



    function _refill() {

        $('#show_refill').hide();

        $.post("<?= $app_url ?>/gbprimepay/promptpay.php", $("#send_refill").serialize()).done(function(res) {

            data = JSON.parse(res);

            $('#show_refill').show();

            $('#show_refill').html(data.message);

            if (data.status == true) {

                referenceNo = data.referenceNo;

                countDown()

            }

        });

    }



    var x = null;



    function countDown() {

        const countDownDate = new Date(new Date().getTime() + 15 * 60000).getTime();

        x = setInterval(function() {

            const now = new Date().getTime();

            const distance = countDownDate - now;



            const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));

            const seconds = Math.floor((distance % (1000 * 60)) / 1000);



            document.getElementById("countdown").innerHTML = minutes + " นาที " + seconds + " วินาที";



            $.post("<?= $app_url ?>/gbprimepay/isComplate.php", {

                referenceNo: referenceNo

            }).done(function(res) {

                data = JSON.parse(res);



                if (data.status == true) {

                    clearInterval(x);

                    Swal.fire(

                        'ขอบคุณที่สนับสนุน',

                        'เติมเงินสำเร็จ'+data.message,

                        'success'

                    ).then(() => {

						location.reload();

					});

                    $('#RefillModal').modal('hide');

                }

            });



            if (distance < 0) {

                clearInterval(x);

                $('#show_refill').html('<div class="alert alert-danger text-center" style="font-size: 12px;font-family: none;">QR Code หมดอายุแล้ว กรุณาลองใหม่อีกครั้ง</div>');

                $('#countdown').html('');

            }

        }, 1000);

    }



    document.getElementById('RefillModal').addEventListener('hidden.bs.modal', event => {

        clearInterval(x);

    })

</script>

<?php

require '../template/footer.php';

?>