改太多
This commit is contained in:
minom committed
1 parent
be5352efed
commit
1cb2a7a35e
48 files changed
+17970
-485
No files matched your search
@@ -0,0 +1,369 @@
|
||||
<template>
|
||||
<v-container>
|
||||
<v-card>
|
||||
<v-card-title class="bg-primary white--text text-center">
|
||||
<h5 class="mb-0">沖帳查詢</h5>
|
||||
<button class="btn btn-default ms-auto"><i class="mdi mdi-close"></i></button>
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row class="mb-0 mt-4">
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="query.start_date" label="起始日" type="date" dense outlined></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2">
|
||||
<v-text-field v-model="query.end_date" label="結束日" type="date" dense outlined></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="3">
|
||||
<v-text-field v-model="query.activity_name" label="法會" dense outlined readonly>
|
||||
<template v-slot:append>
|
||||
<v-btn icon @click="showActivityDialog"><v-icon>mdi-magnify</v-icon></v-btn>
|
||||
</template>
|
||||
</v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="3">
|
||||
<v-text-field v-model="query.follower_name" label="信眾" dense outlined readonly>
|
||||
<template v-slot:append>
|
||||
<v-btn icon @click="showFollowerDialog"><v-icon>mdi-magnify</v-icon></v-btn>
|
||||
</template>
|
||||
</v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="12" md="2" class="d-flex justify-end">
|
||||
<v-btn color="primary" class="mr-2" @click="search">查詢</v-btn>
|
||||
<v-btn color="grey" @click="reset">重設</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-data-table :headers="headers"
|
||||
:items="items"
|
||||
:loading="loading"
|
||||
loading-text="載入中..."
|
||||
class="elevation-1 verify-query-table"
|
||||
item-key="id"
|
||||
:footer-props="{ 'items-per-page-options': [10, 20, 50] }"
|
||||
:expanded.sync="expanded"
|
||||
show-expand
|
||||
@item-expanded="handleRowClick">
|
||||
<template v-slot:item.pay_type="{ item }">
|
||||
<div>
|
||||
<div class="font-weight-bold">{{ getPayType(item.pay_type) }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-slot:expanded-item="{ headers, item }">
|
||||
<td :colspan="headers.length">
|
||||
<div class="pa-4">
|
||||
<h6 class="mb-3 text-primary">
|
||||
<v-icon color="primary" small class="mr-1">mdi-receipt</v-icon>
|
||||
沖帳明細
|
||||
</h6>
|
||||
<v-data-table :headers="detailHeaders"
|
||||
:items="detailItem"
|
||||
class="elevation-1"
|
||||
hide-default-footer
|
||||
:disable-pagination="true"
|
||||
dense>
|
||||
|
||||
</v-data-table>
|
||||
</div>
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
||||
<!-- 法會選取 Dialog -->
|
||||
<v-dialog v-model="activityDialog.show" max-width="700px">
|
||||
<v-card>
|
||||
<v-card-title class="grey lighten-2">
|
||||
<v-icon color="primary" class="mr-2">mdi-table</v-icon>
|
||||
選擇法會
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn icon @click="activityDialog.show = false"><v-icon>mdi-close</v-icon></v-btn>
|
||||
</v-card-title>
|
||||
<v-card-text class="mt-4">
|
||||
<v-text-field v-model="activityDialog.search" label="搜尋法會" dense outlined @keyup.enter="searchActivity"></v-text-field>
|
||||
<v-data-table :headers="activityDialog.headers"
|
||||
:items="activityDialog.items"
|
||||
:loading="activityDialog.loading"
|
||||
item-key="num"
|
||||
class="elevation-1 mt-2"
|
||||
@click:row="selectActivity"
|
||||
hide-default-footer></v-data-table>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<!-- 信眾選取 Dialog -->
|
||||
<v-dialog v-model="followerDialog.show" max-width="700px">
|
||||
<v-card>
|
||||
<v-card-title class="grey lighten-2">
|
||||
<v-icon color="primary" class="mr-2">mdi-account</v-icon>
|
||||
選擇信眾
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn icon @click="followerDialog.show = false"><v-icon>mdi-close</v-icon></v-btn>
|
||||
</v-card-title>
|
||||
<v-card-text class="mt-4">
|
||||
<v-text-field v-model="followerDialog.search" label="搜尋信眾" dense outlined
|
||||
@keydown.enter.prevent="searchFollower"></v-text-field>
|
||||
<v-data-table :headers="followerDialog.headers"
|
||||
:items="followerDialog.items"
|
||||
:loading="followerDialog.loading"
|
||||
item-key="num"
|
||||
class="elevation-1 mt-2"
|
||||
@click:row="selectFollower"
|
||||
hide-default-footer></v-data-table>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<!-- 詳細資訊對話框 -->
|
||||
<v-dialog v-model="dialog.show" max-width="900px">
|
||||
<v-card>
|
||||
<v-card-title class="grey lighten-2">
|
||||
<v-icon color="info" class="mr-2">mdi-information-outline</v-icon>
|
||||
詳細資訊
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn icon @click="dialog.show = false">
|
||||
<v-icon>mdi-close</v-icon>
|
||||
</v-btn>
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<div v-if="dialog.selected">
|
||||
<v-row>
|
||||
<v-col cols="12" md="6">
|
||||
<h6 class="mb-3 text-primary">匯款人資訊</h6>
|
||||
<div class="mb-2"><span class="font-weight-bold">姓名：</span>{{ dialog.selected.transfer_name }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">電話：</span>{{ dialog.selected.transfer_phone }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">信眾：</span>{{ dialog.selected.follower }}</div>
|
||||
</v-col>
|
||||
<v-col cols="12" md="6">
|
||||
<h6 class="mb-3 text-success">入帳資訊</h6>
|
||||
<div class="mb-2"><span class="font-weight-bold">入帳帳戶：</span>{{ dialog.selected.acc_name }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">入帳日期：</span>{{ dialog.selected.transfer_check_date | date }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">入帳金額：</span>{{ dialog.selected.transfer_check_amount | currency }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">應收總額：</span>{{ dialog.selected.price_totals | currency }}</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-divider class="my-4"></v-divider>
|
||||
<v-row>
|
||||
<v-col cols="12" md="6">
|
||||
<h6 class="mb-3 text-purple">活動資訊</h6>
|
||||
<div class="mb-2"><span class="font-weight-bold">活動名稱：</span>{{ dialog.selected.activity_name || '-' }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">支付方式：</span>{{ payTypeText[dialog.selected.transfer_pay_type] || dialog.selected.transfer_pay_type }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">帳號後5碼：</span>{{ dialog.selected.transfer_account_last5 || '-' }}</div>
|
||||
</v-col>
|
||||
<v-col cols="12" md="6">
|
||||
<h6 class="mb-3 text-info">核對記錄</h6>
|
||||
<div class="mb-2"><span class="font-weight-bold">核對記錄：</span>{{ dialog.selected.transfer_verify_note || '-' }}</div>
|
||||
<div class="mb-2"><span class="font-weight-bold">帳簿備註：</span>{{ dialog.selected.transfer_check_memo || '-' }}</div>
|
||||
<div v-if="dialog.selected.transfer_proof_img" class="mb-2">
|
||||
<span class="font-weight-bold">證明圖片：</span>
|
||||
<a :href="'../../upload/transfer_proof/' + dialog.selected.transfer_proof_img" target="_blank">查看相片</a>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</div>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-container>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
expanded: [],
|
||||
query: {
|
||||
start_date: '',
|
||||
end_date: '',
|
||||
activity_num: '',
|
||||
activity_name: '',
|
||||
follower_num: '',
|
||||
follower_name: ''
|
||||
},
|
||||
headers: [
|
||||
{ text: '信眾/匯款人', value: 'followerName' },
|
||||
{ text: '法會/入帳帳戶', value: 'acc_name' },
|
||||
{ text: '入帳金額', value: 'check_amount' },
|
||||
{ text: '入帳日期', value: 'check_date' },
|
||||
{ text: '付款方式', value: 'pay_type' },
|
||||
{ text: '沖帳方式', value: 'pay_mode' },
|
||||
{ text: '狀態/備註', value: 'check_status' },
|
||||
//{ text: '操作', value: 'actions', sortable: false }
|
||||
],
|
||||
detailHeaders: [
|
||||
{ text: '法會名稱', value:'法會名稱'},
|
||||
{ text: '功德項目', value: '牌位/點燈項目' },
|
||||
{
|
||||
text: '實際功德人姓名', value: '實際功德人姓名'
|
||||
},
|
||||
{
|
||||
text: '應收金額', value: '項目原價'
|
||||
},
|
||||
{
|
||||
text: '沖帳金額', value: '本次實際沖帳金額' },
|
||||
{ text: '備註', value: 'memo' }
|
||||
],
|
||||
items: [],
|
||||
detailItem:[],
|
||||
dialog: {
|
||||
show: false,
|
||||
selected: null
|
||||
},
|
||||
activityDialog: {
|
||||
show: false,
|
||||
search: '',
|
||||
loading: false,
|
||||
items: [],
|
||||
headers: [
|
||||
{ text: '編號', value: 'num' },
|
||||
{ text: '名稱', value: 'subject' }
|
||||
]
|
||||
},
|
||||
followerDialog: {
|
||||
show: false,
|
||||
search: '',
|
||||
loading: false,
|
||||
items: [],
|
||||
headers: [
|
||||
{ text: '編號', value: 'num' },
|
||||
{ text: '姓名', value: 'u_name' }
|
||||
]
|
||||
},
|
||||
payTypeText: [
|
||||
{ text: '1', value: '現金' },
|
||||
{ text: '2', value: '匯款' },
|
||||
{ text: '3', value: '支票' }
|
||||
]
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
payType(val) {
|
||||
//console.log("payType:",val)
|
||||
let v = this.payTypeText.find(x => x.text === val);
|
||||
return v.value;
|
||||
},
|
||||
currency(val) {
|
||||
if (!val) return '0';
|
||||
return Number(val).toLocaleString();
|
||||
},
|
||||
date(val) {
|
||||
if (!val) return '';
|
||||
const date = new Date(val);
|
||||
return date.toLocaleDateString();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getPayType(val) {
|
||||
|
||||
let v = this.payTypeText.find(x => x.text === val);
|
||||
return v?v.value:val;
|
||||
},
|
||||
handleRowClick({item, value}) {
|
||||
this.$set(item, 'loading', true);
|
||||
if (value) {
|
||||
axios.post('../../api/bill/GetAuditDetailData', { id: item.id })
|
||||
.then(res => {
|
||||
console.log("handleRowClick:", res.data.list[0].k);
|
||||
if (res.status === 200 && res.data && res.data.list) {
|
||||
this.detailItem = res.data.list[0].k;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
search() {
|
||||
this.loading = true;
|
||||
// 串接查詢 API，帶入所有查詢條件
|
||||
axios.post('../../api/bill/GetAuditList', this.query, { params: { page: 1, pageSize: 1000 } })
|
||||
.then(res => {
|
||||
//console.log("QQ:",res);
|
||||
this.items = res.data.list;
|
||||
this.expanded = []; // 重置展開狀態
|
||||
})
|
||||
.catch(() => {
|
||||
this.items = [];
|
||||
this.expanded = [];
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
reset() {
|
||||
this.query.start_date = '';
|
||||
this.query.end_date = '';
|
||||
this.query.activity_num = '';
|
||||
this.query.activity_name = '';
|
||||
this.query.follower_num = '';
|
||||
this.query.follower_name = '';
|
||||
this.items = [];
|
||||
this.expanded = [];
|
||||
},
|
||||
showDetailDialog(item) {
|
||||
this.dialog.selected = item;
|
||||
this.dialog.show = true;
|
||||
},
|
||||
showActivityDialog() {
|
||||
this.activityDialog.show = true;
|
||||
this.searchActivity();
|
||||
},
|
||||
searchActivity() {
|
||||
this.activityDialog.loading = true;
|
||||
axios.get('../../api/activity', { params: { keyword: this.activityDialog.search } })
|
||||
.then(res => { this.activityDialog.items = res.data; })
|
||||
.catch(() => { this.activityDialog.items = []; })
|
||||
.finally(() => { this.activityDialog.loading = false; });
|
||||
},
|
||||
selectActivity(row) {
|
||||
this.query.activity_num = row.num;
|
||||
this.query.activity_name = row.subject;
|
||||
this.activityDialog.show = false;
|
||||
},
|
||||
showFollowerDialog() {
|
||||
this.followerDialog.show = true;
|
||||
//this.searchFollower();
|
||||
},
|
||||
searchFollower() {
|
||||
//event.preventDefault();
|
||||
this.followerDialog.loading = true;
|
||||
axios.post('/api/follower/GetList', { u_name: this.followerDialog.search }, { params: { page: 1, pageSize: 10 } })
|
||||
.then(res => { this.followerDialog.items = res.data.list; })
|
||||
.catch(() => { this.followerDialog.items = []; })
|
||||
.finally(() => { this.followerDialog.loading = false; });
|
||||
},
|
||||
selectFollower(row) {
|
||||
this.query.follower_num = row.num;
|
||||
this.query.follower_name = row.u_name;
|
||||
this.followerDialog.show = false;
|
||||
},
|
||||
getStatusColor(status) {
|
||||
switch (status) {
|
||||
case '90': return 'warning';
|
||||
case '99': return 'success';
|
||||
default: return 'grey';
|
||||
}
|
||||
},
|
||||
getStatusText(status) {
|
||||
switch (status) {
|
||||
case '90': return '沖帳有剩餘';
|
||||
case '99': return '沖帳完成';
|
||||
default: return '未知狀態';
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.v-data-table.verify-query-table .v-data-table__wrapper tbody tr {
|
||||
min-height: 90px !important;
|
||||
height: 90px !important;
|
||||
}
|
||||
|
||||
.v-data-table.verify-query-table .v-data-table__wrapper tbody td {
|
||||
min-height: 90px !important;
|
||||
height: 90px !important;
|
||||
vertical-align: middle !important;
|
||||
}
|
||||
</style>
|
||||
@@ -34,7 +34,7 @@
|
||||
</template>
|
||||
<template v-slot:item.actions="{ item }">
|
||||
<v-btn small
|
||||
color="success"
|
||||
|
||||
@click="showReconcileDialog(item)">
|
||||
沖帳
|
||||
</v-btn>
|
||||
|
||||
@@ -17,16 +17,42 @@
|
||||
</v-select>
|
||||
</v-col>
|
||||
<v-col cols="2" md="2">
|
||||
<v-text-field label="法會時間(起)" v-model="query.s_date"></v-text-field>
|
||||
<v-menu ref="menu"
|
||||
v-model="menu"
|
||||
:close-on-content-click="true"
|
||||
transition="scale-transition"
|
||||
offset-y
|
||||
min-width="auto">
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-text-field label="法會日期(起)" v-model="query.s_date"
|
||||
prepend-icon="mdi-calendar" readonly v-bind="attrs" v-on="on"></v-text-field>
|
||||
</template>
|
||||
<v-date-picker v-model="query.s_date"
|
||||
show-adjacent-months></v-date-picker>
|
||||
</v-menu>
|
||||
|
||||
</v-col>
|
||||
<v-col cols="2" md="2">
|
||||
<v-text-field label="法會時間(迄)" v-model="query.e_date"></v-text-field>
|
||||
<v-menu ref="menu1"
|
||||
v-model="menu1"
|
||||
:close-on-content-click="true"
|
||||
transition="scale-transition"
|
||||
offset-y
|
||||
min-width="auto">
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-text-field label="法會日期(迄)" v-model="query.e_date"
|
||||
prepend-icon="mdi-calendar" readonly v-bind="attrs" v-on="on"></v-text-field>
|
||||
</template>
|
||||
<v-date-picker v-model="query.e_date"
|
||||
show-adjacent-months></v-date-picker>
|
||||
</v-menu>
|
||||
<!--<v-text-field label="法會日期(迄)" v-model="query.e_date"></v-text-field>-->
|
||||
</v-col>
|
||||
<v-col cols="2" md="2">
|
||||
<v-btn @click.prevent="getRpt()" :disabled="isdisabled">
|
||||
匯出
|
||||
</v-btn>
|
||||
<img src="/admin/images/loading.gif" v-show="isloading"/>
|
||||
<img src="/admin/images/loading.gif" v-show="isloading" />
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
@@ -42,7 +68,7 @@
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
module.exports = {
|
||||
@@ -57,10 +83,22 @@
|
||||
category_id: "",
|
||||
isdisabled: false,
|
||||
isloading: false,
|
||||
query: {s_date:"",e_date:""}
|
||||
query: { s_date: "", e_date: "" },
|
||||
activePicker: null,
|
||||
date: null,
|
||||
menu: false,
|
||||
menu1: false,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
menu(val) {
|
||||
val && setTimeout(() => (this.activePicker = 'YEAR'))
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
save(date) {
|
||||
this.$refs.menu.save(date)
|
||||
},
|
||||
closeWindow() {
|
||||
this.$emit('close-dialog');
|
||||
},
|
||||
|
||||
Reference in new issue
Block a user