增加客堂簡易報名

2026-08-03 18:09:15 +08:00
parent 12634b942c
commit da913d2584
6 changed files with 573 additions and 224 deletions
@@ -0,0 +1,127 @@
+<template>
+    <div id="content" class="container-fluid">
+        <v-btn @click.prevent="gotoAdd()" color="primary">新增</v-btn>
+        <v-data-table v-model="data_table.selected"
+                      :items="data_table.list"
+                      item-key="order_no"
+                      :options.sync="options"
+                      :headers="data_table.header"
+                      :footer-props="data_table.footer"
+                      :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 :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>
+        </v-data-table>
+        <v-container>
+            <v-row class="align-baseline" wrap>
+                <v-col cols="12" md="9">
+                    <v-pagination v-model="data_table.page"
+                                  :length="pageCount">
+                    </v-pagination>
+                </v-col>
+                <v-col class="text-truncate text-right" cols="12" md="2">
+                    共 {{ data_table.count }} 筆, 頁數:
+                </v-col>
+                <v-col cols="6" md="1">
+                    <v-text-field v-model="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>
+</template>
+
+<script>
+    module.exports = {
+        props: ['formData'],
+        data() {
+            return {
+                options: { multiSort: false },
+                search_options: { multiSort: false },
+                search: {},
+                data_table: {
+                    loading: true,
+                    list: [],
+                    selected: [],
+                    singleSelect: false,
+                    count: 0,
+                    page: 1,
+                    pageSize: 10,
+                    header: [
+                        { text: '信眾', value: 'f_num' },
+                        { text: '報名單號', value: 'order_no' },
+                        { text: '收據號碼', value: 'receipt_num' },
+                        { text: '活動', value: 'act_num'},
+                        { text: '功德項目數量', value: 'item_count' },
+                        { text: '總金額', value: 'total_amt' },
+                        { text: '登錄人員', value: 'admin_num' },
+                        { text: '登錄時間', value: 'reg_time' },
+                        { text: '', value: 'slot_btn', sortable: false, align: 'end' }
+                    ],
+                    footer: {
+                        showFirstLastPage: true,
+                        itemsPerPageOptions: [5, 10, 20, 30],
+                    },
+                },
+            }
+        },
+        mounted() {
+            this.loadData()
+        },
+        methods: {
+            gotoAdd() {
+                this.$emit('custom-event', { action: 'add' });
+            },
+            loadData(clearpage = false) {
+                const { sortBy, sortDesc, page, itemsPerPage } = this.options
+                //page = this.data_table.page;
+                let search = {}
+                const params = {
+                    sortBy: sortBy[0], sortDesc: sortDesc[0],
+                    page: clearpage ? '1' : page, pageSize: itemsPerPage
+                };
+                this.data_table.loading = true
+                axios
+                    .post(HTTP_HOST + 'api/preOrder/GetPreOrder', search, { params: params })
+                    .then(response => {
+                        console.log(response)
+                        this.data_table.list = response.data.list
+                        this.data_table.count = response.data.count;
+                        this.data_table.loading = false
+
+                        const dataToStore = JSON.stringify(this.data_table);
+                        //sessionStorage.setItem("order_list_cache", dataToStore);
+                    })
+                    .catch(error => console.log(error))
+            },
+            search_headers() {
+
+            },
+            search_select() {
+
+            }
+        },
+        watch: {
+
+        },
+        computed: {
+            pageCount() {
+                return Math.ceil(this.data_table.count / this.data_table.pageSize)
+            },
+        }
+    };
+</script>