gary_wms/wms/mkt/window-modal/elevatorModal.php

<div class="window-modal" x-cloak data-type="window-modal" x-show="modalShow.elevator" x-ref="createElevatorModal" id="createElevatorModal">
    <div class="window-modal-content modal-xl">
        <div class="window-modal-header">
            <h4>新增電梯規格</h4>
            <button class="btn btn-close" @click="hideCreateElevatorModal()">X</button>
        </div>
        <div class="window-modal-body">
            <div>
                <table class="table">
                    <tr class="table-active">
                        <th>電梯</th>
                        <th>人乘</th>
                        <th>載重(KG)</th>
                        <th>停數</th>
                    </tr>
                    <tr>
                        <td>
                            <select name="" id="" class="form-control" x-model="modalElevatorInfo.spec" @change="getModalElevatorPrice()">
                                <option value="">請選擇</option>
                                <option value="MAE100">MAE100有機房</option>
                                <option value="MAM200">MAM200無機房</option>
                                <option value="MAH100">MAH100小電梯</option>
                                <option value="MAF100">MAF100貨梯(有機房)</option>
                                <option value="MAQ100">MAQ100強趨梯</option>
                                <option value="MAP100">MAP100平台梯</option>
                            </select>
                        </td>
                        <td>
                            <select name="" id="" class="form-control" x-model="modalElevatorInfo.person" @change="getModalElevatorPrice()">
                                <option value="">請選擇</option>
                                <option value="6">6</option>
                                <option value="8">8</option>
                                <option value="9">9</option>
                                <option value="10">10</option>
                                <option value="11">11</option>
                                <option value="12">12</option>
                                <option value="13">13</option>
                                <option value="15">15</option>
                                <option value="17">17</option>
                                <option value="20">20</option>
                                <option value="24">24</option>
                            </select>
                        </td>
                        <td>
                            <input type="number" class="form-control" style="width:93px" x-model="modalElevatorInfo.weight" @keyup="getModalElevatorPrice()" @change="getModalElevatorPrice()">
                        </td>
                        <td>
                            <input type="number" class="form-control" style="width:93px" x-model="modalElevatorInfo.stop" @keyup="getModalElevatorPrice()" @change="getModalElevatorPrice()" />
                        </td>
                        
                    </tr>
                    <tr class="table-active">
                        <th>開門方式</th>
                        <th>速度</th>
                        <th>規格</th>
                        <th>數量</th>
                    </tr>
                    <tr>
                        <td>
                            <select name="" id="" class="form-control" style="width:93px" x-model="modalElevatorInfo.open" @change="getModalElevatorPrice()">
                                <option value="CO">CO</option>
                                <option value="2S">2S</option>
                                <option value="2U">CO</option>
                                <option value="4PCO">4PCO</option>
                                <option value="6PCO">6PCO</option>
                            </select>
                        </td>
                        <td>
                            <select name="" id="" class="form-control" style="width:93px" x-model="modalElevatorInfo.speed" @change="getModalElevatorPrice()" >
                                <option value="">請選擇</option>
                                <option value="9">9</option>
                                <option value="24">24</option>
                                <option value="30">30</option>
                                <option value="45">45</option>
                                <option value="60">60</option>
                                <option value="90">90</option>
                                <option value="105">105</option>
                                <option value="120">120</option>
                                <option value="150">150</option>
                            </select>
                        </td>
                        <td>
                            <input type="text" x-show="!modalElevatorInfo.price || modalElevatorInfo.price ==''" class="form-control" disabled />
                            <input type="text" x-show="modalElevatorInfo.price > 0" class="form-control" disabled x-model="modalElevatorInfo.model">
                        </td>
                        <td>
                            <input type="number" class="form-control" style="width:93px" x-model="modalElevatorInfo.num" >
                        </td>
                    </tr>
                    <tr class="table-active">
                        <th>公司發布價(單價)</th>
                        <th>公司發布價(複價)</th>
                        <th>自定售價(台)</th>
                        <th>自定售價(總價)</th>
                    </tr>
                    <tr>
                        <td>
                            <input type="text" disabled class="form-control" x-model="(modalElevatorInfo.price).toLocaleString()">
                        </td>
                        <td>
                            <input type="text" disabled class="form-control" x-model="(modalElevatorInfo.price * modalElevatorInfo.num).toLocaleString()">
                        </td>
                        <td>
                            <input type="number" class="form-control" x-model="modalElevatorInfo.sale_price">
                        </td>
                        <td>
                            <input type="text" disabled class="form-control" x-model="(modalElevatorInfo.sale_price * modalElevatorInfo.num).toLocaleString()">
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="modal-footer">
        <button type="button" class="btn btn-secondary" @click="hideCreateElevatorModal()">關閉</button>
            <button type="button" class="btn btn-primary"  @click="createElevatorFn()">新增</button>
        </div>
    </div>
    <div class="window-back" @click="hideCreateElevatorModal()"></div>
</div>