gary_wms/wms/bonus/bonus_detail.php

<?php
include('../header.php');
require_once('../contract-repair/conn.php');

$sql = "SELECT * FROM bonus WHERE id = :id";
$stmt = $conn->prepare($sql);
$stmt->bindParam(':id', $_GET['id']);
$stmt->execute();
$result = $stmt->fetch(PDO::FETCH_ASSOC);
// echo '<pre>';
// print_r($result['bonus_json']);
// echo '</pre>';
$bonus_json = json_decode($result['bonus_json']);

$paykind = [
    'monthly' => '月繳',
    'bimonthly' => '雙月繳',
    'quarterly' => '季繳',
    'semiannually' => '半年繳',
    'annually' => '年繳'
];

$maintain_type = [
    'new' => '新簽約',
    'free_to_charge' => '免保轉有費',
    'renew_priceissue' => '續簽約'
];
?>

<link rel="stylesheet" href="../contract-repair/styles/style.css">
<link rel="stylesheet" href="../contract-repair/semantic/dist/semantic.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="../contract-repair/js/alpine.js"></script>
<script defer src="../contract-repair/js/alpinejs/cdn.min.js"></script>
<script src="../contract-repair/js/axios/axios.min.js"></script>
<script src="../contract-repair/js/jquery/jquery-3.1.1.min.js"></script>
<script src="../contract-repair/semantic/dist/semantic.min.js"></script>

<div class="bonuns_index" x-data="bonunsIndex">
    <div class="form" method="post" id="form" enctype="multipart/form-data">
        <input type="hidden" name="form_name" value="main_form">
        <div>
            <table class="table table-bordered query-table table-striped table-bordered display compact" style="width:99%;margin-left:.5%">
                <thead>
                    <tr>
                        <td colspan="8">
                            <h3 style='text-align:center'>獎金計算</h3>
                        </td>
                    </tr>
                </thead>
                <!-- <template x-if="step==1">
                    <tbody style="font-weight: bolder;margin: botton 20px;">
                        <tr>
                            <td style="vertical-align: middle;">合約號</td>
                            <td colspan="5">
                                <input class="form-control" @keyup="nextStepKeyupFn($event)" type="text" name="contract_no" x-model="data.contract_no">
                            </td>
                            <td colspan="2" style="vertical-align:middle"></td>
                        </tr>
                    </tbody>
                </template> -->

                <template x-if="step==1">
                    <tbody style="font-weight: bolder;margin-bottom:20px">
                        <tr>
                            <td colspan="7" style="vertical-align:middle;border-right:0px">
                                <h4>獎金確認項</h4>
                            </td>
                            <td class="text-right" style="border: left 0px;">
                                <button type="button" id="btn_back" class="btn btn-default" onclick="window.history.back();">返回</button>
                                <button type="button" id="btn_close" class="btn btn-default" onclick="window.close()">關閉</button>
                            </td>
                        </tr>
                        <tr>
                            <td style="vertical-align:middle">合約號</td>
                            <td>
                                <input type="text" x-model="data.contract_no" disabled="disabled">
                            </td>
                            <td style="vertical-align:middle">合約類別</td>
                            <td>
                                <select id="contract_type" x-model="data.contract_type" disabled="disabled">
                                    <option value="">--請選擇--</option>
                                    <option value="1">新梯</option>
                                    <option value="2">汰改</option>
                                    <option value="3">保養</option>
                                </select>
                                <p class="alerttext" x-show="data.contract_type==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p>
                            </td>
                            <td style="vertical-align:middle">作番號</td>
                            <td>
                                <input type="text" x-model="data.facility_no" disabled="disabled">
                            </td>

                            <td style="vertical-align:middle">獎金適用版本</td>
                            <td>
                                <input type="text" x-model="data.bonus_verson" disabled="disabled">
                            </td>
                        </tr>
                        <tr>
                            <td style="vertical-align:middle">保養類別</td>
                            <td>
                                <input type="text" x-model="data.maintain_type" disabled>
                            </td>
                            <td style="vertical-align:middle">付款方式</td>
                            <td>
                                <input type="text" x-model="data.pay_kind" disabled>
                            </td>
                            <td style="vertical-align:middle">合約付款日</td>
                            <td>
                                <input type="text" x-model="data.receivable_date_due" disabled>
                            </td>
                            <td style="vertical-align:middle">應發獎金</td>
                            <td>
                                <input type="text" x-model="data.maintain_price_total" disabled>
                            </td>
                        </tr>
                        <tr>
                            <td style="vertical-align:middle">作番總價</td>
                            <td>
                                <input type="text" x-model="data.total" disabled>
                            </td>
                            <td style="vertical-align:middle">牌價</td>
                            <td>
                                <input type="text" x-model="data.fee_per_st" disabled>
                            </td>
                            <td style="vertical-align:middle">服務費</td>
                            <td>
                                <input type="text" x-model="data.commission_fee" disabled>
                            </td>
                            <td style="vertical-align:middle">價率</td>
                            <td>
                                <input type="text" x-model="data.discount" disabled>
                            </td>

                        </tr>
                    </tbody>
                </template>
            </table>

            <button x-show=" step==1" @click="save()" :disabled="isLoading" type="button" class="btn btn-primary btn-lg pull-right savebtn">
                <template x-if="!isLoading">
                    <span>確認</span>
                </template>
                <template x-if="isLoading">
                    <div class="loader"></div>
                </template>
            </button>
            <!-- <button x-show="step<=2" @click="nextStepFn()" type="button" class="btn btn-primary btn-lg pull-right savebtn" :disabled="isLoading">
                <template x-if="!isLoading">
                    <span>下一步</span>
                </template>
                <template x-if="isLoading">
                    <div class="loader"></div>
                </template>
            </button>
            <button x-show="step>1" @click="preStepFn()" :disabled="isLoading" type="button" class="btn btn-primary btn-lg pull-right savebtn">
                <template x-if="!isLoading">
                    <span>上一步</span>
                </template>
                <template x-if="isLoading">
                    <div class="loader"></div>
                </template>
            </button> -->
        </div>
    </div>
</div>

<script>
    const user_id = '<?= $user_id ?>';
    const id = '<?= $_GET['id'] ?>';
    const contract_no = '<?= $result['contract_no'] ?>';
    const facility_no = '<?= $result['facility_no'] ?>';
    const bonus_verson = '<?= $result['bonus_verson'] ?>';
    const receiver = '<?= $result['receiver'] ?>';
    const payDaydue = '<?= $result['pay_day'] ?>';
    const maintain_price_total = '<?= $result['amount'] ?>';
    const contract_type = '<?= $result['contract_type'] ?>';
    // const bonus_verson = '<?= $result['bonus_verson'] ?>';
    const maintain_type = '<?= $maintain_type[$bonus_json->maintain_type] ?>';
    const pay_kind = '<?= $paykind[$bonus_json->paykind] ?>';
    const receivable_date_due = '<?= $bonus_json->receivable_date_due ?>';
    const total = '<?= $bonus_json->total ?>';
    const fee_per_st = '<?= $bonus_json->fee_per_st ?>';
    const commission_fee = '<?= $bonus_json->commission_fee ?>';
    const discount = '<?= $bonus_json->discount ?>'
</script>