快速報名
This commit is contained in:
+239
-16
@@ -3,10 +3,15 @@
|
||||
<v-card>
|
||||
<v-card-title class="bg-primary white--text text-center">
|
||||
<h5 class="mb-0">快速報名</h5>
|
||||
|
||||
<v-btn class="ms-auto" @click.prevent="saveOrder()">儲存</v-btn>
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="name"
|
||||
:counter="20"
|
||||
label="姓名"></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="idNo"
|
||||
:counter="20"
|
||||
@@ -24,72 +29,290 @@
|
||||
<v-divider></v-divider>
|
||||
<v-row>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="follower.f_number"
|
||||
<v-text-field v-model="follower.f_number" readonly
|
||||
label="信眾編號"></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="follower.u_name"
|
||||
<v-text-field v-model="follower.u_name" readonly
|
||||
label="信眾姓名"></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="follower.phoneDes"
|
||||
<v-text-field v-model="follower.phoneDes" readonly
|
||||
label="電話"></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="follower.cellphoneDes"
|
||||
<v-text-field v-model="follower.cellphoneDes" readonly
|
||||
label="行動電話"></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="follower.id_code"
|
||||
<v-text-field v-model="follower.id_code" readonly
|
||||
label="身分證號"></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="follower.passport"
|
||||
<v-text-field v-model="follower.passport" readonly
|
||||
label="護照號碼"></v-text-field>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col cols="12" md="12">
|
||||
<v-text-field v-model="follower.address"
|
||||
<v-text-field v-model="follower.address" readonly
|
||||
label="地址"></v-text-field>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<hr class="hr-text" data-content="前次法會功德">
|
||||
<v-row v-show="tablet_show">
|
||||
<v-col cols="12" sm="12">
|
||||
<v-data-iterator :items="tablet_list" :items-per-page="-1"
|
||||
hide-default-footer>
|
||||
<template v-slot:default="{ items }">
|
||||
<v-row>
|
||||
<v-col cols="3" md="3" v-for="(item, i) in items" :key="i">
|
||||
<v-card-title>
|
||||
|
||||
<v-checkbox v-model="item.actitem_num_checked"
|
||||
:disabled="item.disabled" class="custom-checkbox">
|
||||
<template v-slot:label>
|
||||
<h5 :class="renderDisabled(item)">{{ item.actitem_num_selected.text }}</h5>
|
||||
</template>
|
||||
</v-checkbox>
|
||||
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<div v-html="renderTabletContent(item)" style="font-size:20px;"></div>
|
||||
<v-divider></v-divider>
|
||||
</v-card-text>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
<template v-slot:no-data>
|
||||
<v-alert :value="true" color="error" icon="warning">
|
||||
無資料可顯示，可能此信眾未曾參加過。
|
||||
</v-alert>
|
||||
</template>
|
||||
</v-data-iterator>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
||||
<v-dialog v-model="message_dialog.show" style="width: 300px !important; height: 300px !important;">
|
||||
<template>
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
{{ message_dialog.message }}
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-btn @click.prevent="message_dialog.show=false">關閉</v-btn>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</template>
|
||||
</v-dialog>
|
||||
</v-container>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
props: {
|
||||
num: {
|
||||
type: Number // num
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
message_dialog: { show: false, message: "" },
|
||||
idNo: "",
|
||||
phoneNum: "",
|
||||
name: "",
|
||||
follower: {},
|
||||
orders: [],
|
||||
tablet_list: [],
|
||||
act_items: [],
|
||||
search: {},
|
||||
query: {
|
||||
id_code: { type: String }, cellphone: { type: String }
|
||||
}
|
||||
},
|
||||
search_options: { multiSort: false },
|
||||
tablet_show: false
|
||||
}
|
||||
},
|
||||
activated() {
|
||||
//this.getFollower()
|
||||
this.getActItem()
|
||||
},
|
||||
methods: {
|
||||
getFollower() {
|
||||
this.search = { id_code: this.query.id_code, cellphone: this.query.cellphone }
|
||||
renderDisabled(item) {
|
||||
if (item.disabled) {
|
||||
return "disabled-checkbox"
|
||||
} else {
|
||||
return "enabled-checkbox"
|
||||
}
|
||||
},
|
||||
getActItem() {
|
||||
this.act_items.length = 0
|
||||
this.search = { num: this.num }
|
||||
let params = { sortBy: 'num', sortDesc: false, page: 1, pageSize: -1 };
|
||||
axios
|
||||
.post(HTTP_HOST + 'api/follower/GetFollower', this.search)
|
||||
.post(HTTP_HOST + 'api/activity/GetActRelaList', this.search, { params: params })
|
||||
.then(response => {
|
||||
console.log(response)
|
||||
if (response.data.list)
|
||||
this.follower = response.data.list
|
||||
|
||||
if (response.data.list) {
|
||||
this.act_items = response.data.list
|
||||
}
|
||||
else
|
||||
console.log("查無資料");
|
||||
})
|
||||
.catch(error => console.log(error))
|
||||
},
|
||||
getFollower() {
|
||||
this.tablet_show = false
|
||||
this.tablet_list.length = 0
|
||||
this.follower = {}
|
||||
this.search = { id_code: this.idNo, u_name: this.name, phone_idcode: this.phoneNum }
|
||||
//應該要檢查他是否已經報完名
|
||||
axios
|
||||
.post(HTTP_HOST + 'api/follower/GetFollowerNew', this.search)
|
||||
.then(response => {
|
||||
if (response.data.list) {
|
||||
console.log(response.data.list)
|
||||
if (response.data.list.length > 1) {
|
||||
//alert("相同條件不只一人")
|
||||
this.message_dialog.show = true
|
||||
this.message_dialog.message = "相同條件不只一人,請增加查詢條件"
|
||||
} else {
|
||||
this.tablet_show = true
|
||||
this.follower = response.data.list[0]
|
||||
this.getOrder()
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.message_dialog.show = true
|
||||
this.message_dialog.message = response.message
|
||||
}
|
||||
//alter(response.message);
|
||||
|
||||
// console.log("查無資料");
|
||||
})
|
||||
.catch(error => console.log(error))
|
||||
},
|
||||
getOrder() {
|
||||
let params = { page: 1, pageSize: 10, sortBy: 'reg_time', sortDesc: true };
|
||||
this.search = { f_num: this.follower.num }
|
||||
axios
|
||||
.post(HTTP_HOST + 'api/order/GetList', this.search, { params: params })
|
||||
.then(response => {
|
||||
if (response.data.list && response.data.list.length > 0) {
|
||||
this.orders = response.data.list
|
||||
this.orders = this.orders.filter(x => x.activity_num !== this.num)
|
||||
if (this.orders && this.orders.length > 0) {
|
||||
this.getOrderDetail()
|
||||
}
|
||||
}
|
||||
else
|
||||
console.log("getOrder 查無資料");
|
||||
})
|
||||
.catch(error => console.log(error))
|
||||
},
|
||||
getOrderDetail() {
|
||||
this.tablet_show = true
|
||||
let params = { sortBy: 'num', sortDesc: true, page: 1, pageSize: -1 };
|
||||
let search1 = { order_no: this.orders[0].order_no }
|
||||
axios
|
||||
.post(HTTP_HOST + 'api/order/GetItemList', search1, { params: params })
|
||||
.then(response => {
|
||||
if (response.data.list) {
|
||||
this.tablet_list = response.data.list
|
||||
this.tablet_list.forEach(x => {
|
||||
let act_item = this.act_items.filter(y => y.act_item_selected.val === x.actitem_num_selected.val)
|
||||
if (act_item && act_item.length > 0) {
|
||||
x.disabled = false
|
||||
} else {
|
||||
x.disabled = true
|
||||
}
|
||||
})
|
||||
}
|
||||
else
|
||||
console.log("getOrderDetail 查無資料");
|
||||
})
|
||||
.catch(error => console.log(error))
|
||||
},
|
||||
renderTabletContent(item) {
|
||||
let data = JSON.parse(item.f_num_tablet)
|
||||
let left = data.left_items
|
||||
let mid = data.mid_items
|
||||
let returnVal = ""
|
||||
if (left) {
|
||||
returnVal = "陽上:" + left.map(x => x.fam_name).join("、")
|
||||
}
|
||||
if (mid) {
|
||||
returnVal = returnVal + "<br>標題:" + mid.map(x => x.fam_name).join("、")
|
||||
}
|
||||
return returnVal
|
||||
},
|
||||
saveOrder() {
|
||||
let detail = []
|
||||
//整理資料存檔//只要抓那個活動的那幾筆功德項目代號
|
||||
this.tablet_list.forEach(x => {
|
||||
if (x.actitem_num_checked && x.actitem_num_checked == true) {
|
||||
detail.push({ num: x.num, order_no: x.order_no })
|
||||
console.log("saveOrder:", x, x.num, x.order_no)
|
||||
}
|
||||
})
|
||||
//放主檔資料，
|
||||
let main = {
|
||||
activity_num: this.num, f_num: this.follower.num,
|
||||
details: detail
|
||||
}
|
||||
|
||||
axios
|
||||
.post(HTTP_HOST + 'api/order/SaveWithDetails', main)
|
||||
.then(response => {
|
||||
if (response.result && response.result === "Y") {
|
||||
console.log();
|
||||
}
|
||||
console.log(response.message)
|
||||
}).catch(error => console.log(error));
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.hr-text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.hr-text::before,
|
||||
.hr-text::after {
|
||||
content: "";
|
||||
flex: 1;
|
||||
border-top: 1px solid #ccc; /* 分隔線樣式 */
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.hr-text::before {
|
||||
content: attr(data-content);
|
||||
padding: 0 50px;
|
||||
color: black;
|
||||
font-size: 28px;
|
||||
}
|
||||
/* 当 checkbox 被禁用时，改变鼠标状态 */
|
||||
input[type="checkbox"]:disabled {
|
||||
cursor: not-allowed;
|
||||
opacity: 0.4; /* 控制反灰程度 */
|
||||
color: lightgray;
|
||||
}
|
||||
|
||||
.disabled-checkbox {
|
||||
cursor: not-allowed;
|
||||
opacity: 0.8; /* 控制反灰程度 */
|
||||
color: lightgray;
|
||||
}
|
||||
|
||||
.enabled-checkbox {
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user