147 lines
4.1 KiB
Vue
147 lines
4.1 KiB
Vue
<template>
|
|
<basic-container class="bill-payment-page">
|
|
<bill-payment-search
|
|
:query="query"
|
|
:loading="loading"
|
|
@search="handleSearch"
|
|
@reset="resetSearch"
|
|
/>
|
|
<bill-payment-table
|
|
:rows="rows"
|
|
:loading="loading"
|
|
:page="page"
|
|
@add="openCreate"
|
|
@view="openView"
|
|
@edit="openEdit"
|
|
@delete="handleDelete"
|
|
@flow="openFlow"
|
|
@void="handleVoid"
|
|
@page-change="handlePageChange"
|
|
@size-change="handleSizeChange"
|
|
/>
|
|
<el-dialog v-model="flowDialog.visible" title="审批流程" width="620px" append-to-body>
|
|
<el-descriptions :column="1" border>
|
|
<el-descriptions-item label="单据号">
|
|
{{ flowDialog.row.paymentNo || '-' }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="单据状态">
|
|
{{ flowDialog.row.approvalStatusName || '-' }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="当前节点">
|
|
{{ flowDialog.row.currentNode || '-' }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="当前处理人">
|
|
{{ flowDialog.row.currentProcessor || '-' }}
|
|
</el-descriptions-item>
|
|
</el-descriptions>
|
|
</el-dialog>
|
|
</basic-container>
|
|
</template>
|
|
|
|
<script>
|
|
import * as api from '@/api/payment/billPayment';
|
|
import BillPaymentSearch from './components/bill-payment-search.vue';
|
|
import BillPaymentTable from './components/bill-payment-table.vue';
|
|
|
|
const emptyQuery = () => ({
|
|
paymentNo: '',
|
|
deptName: '',
|
|
paymentDateRange: [],
|
|
approvalStatus: '',
|
|
});
|
|
|
|
export default {
|
|
name: 'BillPayment',
|
|
components: { BillPaymentSearch, BillPaymentTable },
|
|
data() {
|
|
return {
|
|
query: emptyQuery(),
|
|
rows: [],
|
|
loading: false,
|
|
page: { current: 1, size: 10, total: 0 },
|
|
flowDialog: { visible: false, row: {} },
|
|
};
|
|
},
|
|
mounted() {
|
|
this.loadTable();
|
|
},
|
|
methods: {
|
|
unwrapData(response) {
|
|
const body = response?.data || response || {};
|
|
return body?.data || body;
|
|
},
|
|
buildParams() {
|
|
const params = { ...this.query };
|
|
const range = params.paymentDateRange || [];
|
|
delete params.paymentDateRange;
|
|
if (range.length === 2) {
|
|
params.paymentStartDate = range[0];
|
|
params.paymentEndDate = range[1];
|
|
}
|
|
return params;
|
|
},
|
|
async loadTable() {
|
|
this.loading = true;
|
|
try {
|
|
const data = this.unwrapData(
|
|
await api.getList(this.page.current, this.page.size, this.buildParams())
|
|
);
|
|
this.rows = data.records || [];
|
|
this.page.total = Number(data.total || 0);
|
|
} finally {
|
|
this.loading = false;
|
|
}
|
|
},
|
|
handleSearch() {
|
|
this.page.current = 1;
|
|
this.loadTable();
|
|
},
|
|
resetSearch() {
|
|
this.query = emptyQuery();
|
|
this.handleSearch();
|
|
},
|
|
openCreate() {
|
|
this.$router.push({ path: '/payment/bill-payment/form', query: { mode: 'add' } });
|
|
},
|
|
openView(row) {
|
|
this.$router.push({
|
|
path: '/payment/bill-payment/form',
|
|
query: { mode: 'view', id: row.id },
|
|
});
|
|
},
|
|
openEdit(row) {
|
|
this.$router.push({
|
|
path: '/payment/bill-payment/form',
|
|
query: { mode: 'edit', id: row.id },
|
|
});
|
|
},
|
|
async handleDelete(row) {
|
|
await this.$confirm('确认删除该汇票付款？', '提示', { type: 'warning' });
|
|
await api.remove(row.id);
|
|
this.$message.success('删除成功');
|
|
if (this.rows.length === 1 && this.page.current > 1) this.page.current -= 1;
|
|
this.loadTable();
|
|
},
|
|
openFlow(row) {
|
|
this.flowDialog.row = row;
|
|
this.flowDialog.visible = true;
|
|
},
|
|
async handleVoid(row) {
|
|
const { value } = await this.$prompt('请输入作废原因', '作废汇票付款');
|
|
await api.voidBill({ id: row.id, reason: value });
|
|
this.$message.success('作废成功');
|
|
this.loadTable();
|
|
},
|
|
handlePageChange(current) {
|
|
this.page.current = current;
|
|
this.loadTable();
|
|
},
|
|
handleSizeChange(size) {
|
|
this.page.current = 1;
|
|
this.page.size = size;
|
|
this.loadTable();
|
|
},
|
|
},
|
|
};
|
|
</script>
|