客堂登記報名

This commit is contained in:
2026-08-04 18:06:23 +08:00
parent da913d2584
commit d6c817475c
6 changed files with 465 additions and 42 deletions
+80 -5
View File
@@ -10,13 +10,13 @@
:server-items-length="data_table.count"
:loading="data_table.loading"
:single-select="data_table.singleSelect"
show-select
hide-default-footer
:page.sync="data_table.page"
:items-per-page.sync="data_table.pageSize"
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 :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>
@@ -42,16 +42,42 @@
</v-col>
</v-row>
</v-container>
<div v-if="isModalOpen" class="modal-backdrop" @click.self="closeModal">
<!-- Modal Window Box -->
<div class="modal-window">
<header class="modal-header">
<!--<h2>Modal Title</h2>-->
<button @click="closeModal" class="close-btn">&times;</button>
</header>
<main class="modal-body" style="overflow-y:auto;">
<!-- Async component loaded dynamically via v-if -->
<receipt-component :form-data="formData" @close-dialog="closeModal" />
</main>
</div>
</div>
</div>
</template>
<script>
module.exports = {
props: ['formData'],
name:"ParentComponent",
components: {
// Add .then(m => m.default || m) to safely handle module.exports
'ReceiptComponent': httpVueLoader('../receipt/receipt.vue'),
},
data() {
return {
options: { multiSort: false },
search_options: { multiSort: false },
isModalOpen: false,
search: {},
data_table: {
loading: true,
@@ -62,10 +88,10 @@
page: 1,
pageSize: 10,
header: [
{ text: '信眾', value: 'f_num' },
{ text: '信眾', value: 'f_name' },
{ text: '報名單號', value: 'order_no' },
{ text: '收據號碼', value: 'receipt_num' },
{ text: '活動', value: 'act_num'},
{ text: '活動', value: 'act_name'},
{ text: '功德項目數量', value: 'item_count' },
{ text: '總金額', value: 'total_amt' },
{ text: '登錄人員', value: 'admin_num' },
@@ -83,6 +109,18 @@
this.loadData()
},
methods: {
openModal() {
this.isModalOpen = true;
},
closeModal(param="") {
this.isModalOpen = false;
if (param=="reload") {
this.loadData()
}
},
openReceipt() {///開收據
this.openModal();
},
gotoAdd() {
this.$emit('custom-event', { action: 'add' });
},
@@ -91,7 +129,7 @@
//page = this.data_table.page;
let search = {}
const params = {
sortBy: sortBy[0], sortDesc: sortDesc[0],
sortBy: "", sortDesc: false,
page: clearpage ? '1' : page, pageSize: itemsPerPage
};
this.data_table.loading = true
@@ -124,4 +162,41 @@
},
}
};
</script>
</script>
<style scoped>
/* Basic Modal Styles */
.modal-backdrop {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
z-index: 10001;
}
.modal-window {
background: white;
padding: 20px;
border-radius: 8px;
min-width: 300px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
.modal-header {
display: flex;
justify-content: space-between;
align-items: center;
}
.close-btn {
background: none;
border: none;
font-size: 1.5rem;
cursor: pointer;
}
</style>
+163 -33
View File
@@ -3,7 +3,7 @@
<v-card>
<v-card-title class="bg-primary white--text text-center">
<h5 class="mb-0">客堂報名</h5>
<h5 class="mb-0">客堂登錄</h5>
<div class="ms-auto">
<v-btn @click.prevent="savePreOrder()">儲存</v-btn>
<v-btn @click.prevent="back01()">返回</v-btn>
@@ -49,34 +49,78 @@
</v-row>
</v-card-text>
</v-card>
<v-dialog v-model="picker.show" class="container-fluid">
<template>
<v-card>
<v-card-title>
<div class="row">
<div class="col-12">
<v-data-table v-model="picker.data_table.selected"
:items="picker.data_table.list"
:options.sync="options"
:headers="picker.data_table.header"
:footer-props="picker.data_table.footer"
:server-items-length="picker.data_table.count"
:loading="picker.data_table.loading"
:single-select="picker.data_table.singleSelect"
hide-default-footer
:page.sync="picker.data_table.page"
:items-per-page.sync="picker.data_table.pageSize"
class="elevation-1"
@click:row="handleRowClick">
</v-data-table>
</div>
<div class="col-12">
<v-container>
<v-row class="align-baseline">
<v-col cols="12" md="9">
<v-pagination v-model="picker.data_table.page"
:length="pageCount">
</v-pagination>
</v-col>
<v-col class="text-truncate text-right" cols="12" md="2">
{{ picker.data_table.count }} , 頁數:
</v-col>
<v-col cols="6" md="1">
<v-text-field v-model="picker.data_table.page"
type="number"
hide-details
dense
min="1"
:max="pageCount"
@input="data_table.page = parseInt($event, 10)"></v-text-field>
</v-col>
</v-row>
</v-container>
</div>
</div>
</v-card-title>
<v-card-text>
<v-btn @click.prevent="picker.show=false">關閉</v-btn>
<v-btn @click.prevent="picker_confirm()">確認</v-btn>
</v-card-text>
</v-card>
</template>
</v-dialog>
<v-snackbar v-model="snackbar.show">
{{ snackbar.text }}
<template v-slot:action="{ attrs }">
<v-btn color="pink"
text
v-bind="attrs"
@click="snackbar.show = false">
Close
</v-btn>
</template>
</v-snackbar>
</div>
<v-dialog v-model="picker.show" class="dialog_width">
<template>
<v-card>
<v-card-title>
<v-data-table v-model="picker.data_table.selected"
:items="picker.data_table.list"
:options.sync="options"
:headers="picker.data_table.header"
:footer-props="picker.data_table.footer"
:server-items-length="picker.data_table.count"
:loading="picker.data_table.loading"
:single-select="picker.data_table.singleSelect"
show-select
hide-default-footer
:page.sync="picker.data_table.page"
:items-per-page.sync="picker.data_table.pageSize"
class="elevation-1">
</v-data-table>
</v-card-title>
<v-card-text>
<v-btn @click.prevent="picker.show=false" >關閉</v-btn>
<v-btn @click.prevent="picker_confirm()" >確認</v-btn>
</v-card-text>
</v-card>
</template>
</v-dialog>
</template>
<script>
@@ -104,7 +148,7 @@
show: false,
target: "",
data_table: {
loading: true,
loading: false,
list: [],
selected: [],
singleSelect: false,
@@ -119,28 +163,108 @@
itemsPerPageOptions: [5, 10, 20, 30],
},
}
}
},
snackbar: {
show: false,
text: "",
},
}
},
methods: {
savePreOrder() {
watch: {
options: {
handler() {
if (this.picker.target === "follower") {
this.getFollowers()
} else if (this.picker.target === "act") {
this.getActivity()
}
},
deep: true,
},
},
methods: {
handleRowClick(item, row) {
if (this.picker.target === "follower") {
this.formData.f_num = item.num;
this.formData.f_name = item.u_name;
} else if (this.picker.target === "act") {
this.formData.act_num = item.num;
this.formData.act_name = item.subject;
}
this.picker.show = false;
},
savePreOrder() {
axios
.post(HTTP_HOST + 'api/preOrder/SavePreOrder', this.formData)
.then(response => {
this.snackbar.text = response.data.message;
this.snackbar.show = true;
if (response.data.result=="Y") {
this.$emit('custom-event', { action: 'list' });
}
}).catch(error => console.log(error));
},
back01() {
this.$emit('custom-event', { action: 'list' });
},
getFollowers(clearPage=false) {
const { sortBy, sortDesc, page, itemsPerPage } = this.options
const params = {
sortBy: "num", sortDesc: false,
page: page, pageSize: itemsPerPage
};
this.picker.data_table.loading = true;
let search = {}
axios
.post(HTTP_HOST + 'api/follower/GetList', search, { params: params })
.then(response => {
console.log(response)
this.picker.data_table.list = response.data.list
this.picker.data_table.count = response.data.count;
this.picker.data_table.loading = false
const dataToStore = JSON.stringify(this.data_table);
//sessionStorage.setItem("order_list_cache", dataToStore);
})
.catch(error => console.log(error))
},
getActivity(clearPage=false) {
const { sortBy, sortDesc, page, itemsPerPage } = this.options
const params = {
sortBy: "num", sortDesc: false,
page: page, pageSize: itemsPerPage
};
this.picker.data_table.loading = true;
let search = {}
axios
.post(HTTP_HOST + 'api/activity/GetListNew', search, { params: params })
.then(response => {
console.log(response)
this.picker.data_table.list = response.data.list
this.picker.data_table.count = response.data.count;
this.picker.data_table.loading = false
const dataToStore = JSON.stringify(this.data_table);
//sessionStorage.setItem("order_list_cache", dataToStore);
})
.catch(error => console.log(error))
},
pickFollower() {
this.picker.data_table.list.length = 0;
this.picker.show = true;
this.picker.target = "follower";
this.picker.data_table.header = [
{ text: '信眾編號', value: 'num' },
{ text: '姓名', value: 'u_name' },
{ text: '電話', value: 'phone' },
{ text: '行動電話', value: 'cellphone' },
{ text: '電話', value: 'phoneDes' },
{ text: '行動電話', value: 'cellphoneDes' },
{ text: '', value: 'slot_btn', sortable: false, align: 'end' }
]
this.getFollowers(false);
},
pickAct() {
this.picker.data_table.list.length = 0;
this.picker.show = true;
this.picker.target = "act";
this.picker.data_table.header = [
@@ -149,10 +273,16 @@
{ text: '報名截止日', value: 'dueDate' },
{ text: '', value: 'slot_btn', sortable: false, align: 'end' }
]
this.getActivity(false);
},
picker_confirm() {
}
},
computed: {
pageCount() {
return Math.ceil(this.picker.data_table.count / this.picker.data_table.pageSize)
},
}
};
</script>
+40 -2
View File
@@ -229,6 +229,7 @@
select(item, t) {
}
}, search8: {
id: 'search8',
id: 'search8',
title: '牌位標題:陽上',
text_prop: 'title',
@@ -394,6 +395,11 @@
customize_data_comb: [],
printed_files: '',
},
preOrder: {
order_no: "",
item_count: 0,
total_amt: 0
},
keyin1_items: [{ //報名狀態
text: "請選擇",
val: 0
@@ -601,6 +607,10 @@
this.tablet_edit_new.initialized = true;
};
}
if (this.order_no != "" ) {
this.getPreOrder();
}
},
watch: {
options: {
@@ -666,6 +676,20 @@
}
},
methods: {
getPreOrder() {
let search = { order_no: this.order_no }
axios
.post(HTTP_HOST + 'api/preOrder/GetPreOrderByNum', search)
.then(response => {
console.log(response)
if (response.data.result === "Y") {
this.preOrder.order_no = response.data.ret.data.order_no;
this.preOrder.item_count = response.data.ret.data.item_count;
this.preOrder.total_amt = response.data.ret.data.total_amt;
}
});
},
dataDialogClose() {
},
@@ -892,7 +916,7 @@
form.appendChild(hiddenField);
};
// Add form fields
console.log(item.actitem_num_selected, item.num, JSON.stringify(list));
//console.log(item.actitem_num_selected, item.num, JSON.stringify(list));
addHiddenField("item", item.actitem_num_selected.val);
addHiddenField("file", item.num);
addHiddenField("list", JSON.stringify(list));
@@ -913,7 +937,7 @@
this.editedItem = $.extend(true, {}, item);
//console.log("editTabletNew:",this.editedItem,item)
try {
console.log("editTabletNew:",this.editItem)
//console.log("editTabletNew:",this.editItem)
//document.getElementById("tablet_edit_new_iframe").contentWindow.location.reload();
// 如果是新項目,先保存
if (this.editedItem.num <= 0 || this.editedItem.num === null || this.editedItem.num === undefined) {
@@ -2051,6 +2075,19 @@
</div>
</div>
<div class="tab-pane fade label-sm-right" id="sec2-page2" role="tabpanel" aria-labelledby="sec2-tab2">
<div class="d-flex w-100">
<div class="row">
<div class="col-12 col-md-6 ">
客堂登記功德項目數:{{ preOrder.item_count }}
</div>
<div class="col-12 col-md-6 ">
客堂登記總金額:{{ preOrder.total_amt }}
</div>
<div class="col-12 col-md-6 "></div>
<div class="col-12 col-md-6 "></div>
</div>
</div>
<v-card class="mx-auto" outlined v-if="order_no!=''">
<v-data-table
:headers="headersDetail"
@@ -2062,6 +2099,7 @@
<%-- :server-items-length="desserts_count"--%>
>
<v-divider inset></v-divider>
<template v-slot:top>
<v-toolbar flat color="white">
<div class="d-flex w-100">