調整版面

web/admin/order/pre_order.vue

@@ -16,7 +16,7 @@
                       class="elevation-1">
 
             <template #item.slot_btn="{ item }">
-                <a @click.prevent="openReceipt" class="btn btn-outline-secondary btn-sm"><i class="mdi mdi-receipt-text"></i>開立收據</a>
+                <a @click.prevent="openReceipt(item)" class="btn btn-outline-secondary btn-sm"><i class="mdi mdi-receipt-text"></i>開立收據</a>
                 <!--<a :href="'reg.aspx?order_no='+item.order_no" class="btn btn-outline-secondary btn-sm"><i class="mdi mdi-pencil-box-outline"></i>編輯</a>
             <a @click="deleteItem(item)" class="btn btn-outline-secondary btn-sm"><i class="mdi mdi-trash-can"></i>刪除</a>-->
             </template>
@@ -46,10 +46,11 @@
 
 
 
-        <div v-if="isModalOpen" class="modal-backdrop" @click.self="closeModal">
+        <div v-if="isModalOpen" class="modal-backdrop" @click.self="closeModal" 
+             style="top: 5vh !important; left: 5vw !important; display: flex; margin: auto !important; width: 100% !important; height: 100% !important; ">
 
             <!-- Modal Window Box -->
-            <div class="modal-window">
+            <div class="modal-window" style="height: 100% !important; width: 100% !important; overflow: auto !important; width: 80vw !important; height: 80vh !important; ">
                 <header class="modal-header">
                     <!--<h2>Modal Title</h2>-->
                     <button @click="closeModal" class="close-btn">&times;</button>
@@ -57,7 +58,7 @@
 
                 <main class="modal-body" style="overflow-y:auto;">
                     <!-- Async component loaded dynamically via v-if -->
-                    <receipt-component :form-data="formData" @close-dialog="closeModal" />
+                    <receipt-component :form-data="formData" @close-dialog="closeModal" mode="preOrder" :order_no="receiptComponent.order_no" :total_amt="receiptComponent.total_amt" />
                 </main>
             </div>
 
@@ -78,6 +79,10 @@
                 options: { multiSort: false },
                 search_options: { multiSort: false },
                 isModalOpen: false,
+                receiptComponent: {
+                    order_no: "",
+                    total_amt:0
+                },
                 search: {},
                 data_table: {
                     loading: true,
@@ -118,8 +123,10 @@
                     this.loadData()
                 }
             },
-            openReceipt() {///開收據
+            openReceipt(item) {///開收據
                 this.openModal();
+                this.receiptComponent.order_no = item.order_no;
+                this.receiptComponent.total_amt = item.total_amt;
             },
             gotoAdd() {
                 this.$emit('custom-event', { action: 'add' });