fix:付款单、收票单、收款单、开票单详情展示流转意见信息
parent
61143a39f7
commit
5ac798c295
|
|
@ -0,0 +1,39 @@
|
|||
<template>
|
||||
<div class="process-container">
|
||||
<el-timeline>
|
||||
<el-timeline-item v-for="log in logs" :key="log.id" :timestamp="log.approveTime" placement="top">
|
||||
<el-card>
|
||||
<h4>{{ log.approveOpinion }}</h4>
|
||||
<p><b>操作人:</b> {{ log.approveUserName }} ({{ log.roleName }})</p>
|
||||
<p><b>接收人:</b> {{ log.nextAllApproveUserName }}</p>
|
||||
<p><b>审批状态:</b> <el-tag size="small">{{ getStatusText(log.approveStatus) }}</el-tag></p>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
<div v-if="!logs || logs.length === 0">暂无流转过程数据。</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "FlowOpinionTimeline",
|
||||
props: {
|
||||
logs: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getStatusText(status) {
|
||||
const textMap = { '1': '提交审批', '2': '驳回', '3': '批准' };
|
||||
return textMap[String(status)] || '提交审批';
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.process-container {
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -134,6 +134,10 @@
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="section">
|
||||
<el-divider content-position="left">流转意见</el-divider>
|
||||
<flow-opinion-timeline :logs="approveLogs" />
|
||||
</div>
|
||||
</div>
|
||||
<edit-form :visible.sync="receivableVisible" :data="selectedReceivableRow" :z-index="2000" @close="receivableVisible = false" />
|
||||
</el-drawer>
|
||||
|
|
@ -141,10 +145,12 @@
|
|||
|
||||
<script>
|
||||
import EditForm from "@/views/finance/receivable/components/EditForm.vue";
|
||||
import FlowOpinionTimeline from "@/views/finance/components/FlowOpinionTimeline.vue";
|
||||
import { listCompletedFlows } from "@/api/flow";
|
||||
|
||||
export default {
|
||||
name: "DetailDrawer",
|
||||
components: {EditForm},
|
||||
components: {EditForm, FlowOpinionTimeline},
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
|
|
@ -160,8 +166,36 @@ export default {
|
|||
return {
|
||||
receivableVisible: false,
|
||||
selectedReceivableRow: {},
|
||||
approveLogs: [],
|
||||
approveLogsTimer: null,
|
||||
approveLogsLoading: false,
|
||||
};
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(newVal) {
|
||||
if (newVal) {
|
||||
this.scheduleLoadApproveHistory();
|
||||
} else {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
this.approveLogs = [];
|
||||
}
|
||||
},
|
||||
detail: {
|
||||
handler() {
|
||||
this.scheduleLoadApproveHistory();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleClose() {
|
||||
this.$emit("update:visible", false);
|
||||
|
|
@ -171,6 +205,36 @@ export default {
|
|||
this.selectedReceivableRow = row;
|
||||
this.receivableVisible = true;
|
||||
},
|
||||
scheduleLoadApproveHistory() {
|
||||
if (!this.visible) {
|
||||
return;
|
||||
}
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
}
|
||||
this.approveLogsTimer = setTimeout(() => {
|
||||
this.loadApproveHistory();
|
||||
}, 800);
|
||||
},
|
||||
loadApproveHistory() {
|
||||
const businessKey = this.detail && this.detail.invoiceBillCode;
|
||||
if (!businessKey) {
|
||||
this.approveLogs = [];
|
||||
return;
|
||||
}
|
||||
if (this.approveLogsLoading) {
|
||||
return;
|
||||
}
|
||||
this.approveLogsLoading = true;
|
||||
listCompletedFlows({ businessKey }).then(response => {
|
||||
this.approveLogs = response.data || [];
|
||||
}).catch(() => {
|
||||
this.approveLogs = [];
|
||||
this.$modal.msgError("获取流转历史失败!");
|
||||
}).finally(() => {
|
||||
this.approveLogsLoading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -136,6 +136,11 @@
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<el-divider content-position="left">流转意见</el-divider>
|
||||
<flow-opinion-timeline :logs="approveLogs" />
|
||||
</div>
|
||||
</div>
|
||||
<edit-form :visible.sync="payableVisible" :data="selectedPayableRow" :z-index="2000" @close="payableVisible = false" />
|
||||
</el-drawer>
|
||||
|
|
@ -144,10 +149,12 @@
|
|||
<script>
|
||||
import FileUpload from "@/components/FileUpload";
|
||||
import EditForm from "@/views/finance/payable/components/EditForm.vue";
|
||||
import FlowOpinionTimeline from "@/views/finance/components/FlowOpinionTimeline.vue";
|
||||
import { listCompletedFlows } from "@/api/flow";
|
||||
|
||||
export default {
|
||||
name: "DetailDrawer",
|
||||
components: {FileUpload, EditForm},
|
||||
components: {FileUpload, EditForm, FlowOpinionTimeline},
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
|
|
@ -164,19 +171,36 @@ export default {
|
|||
fileId: null,
|
||||
payableVisible: false,
|
||||
selectedPayableRow: {},
|
||||
approveLogs: [],
|
||||
approveLogsTimer: null,
|
||||
approveLogsLoading: false,
|
||||
};
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(newVal) {
|
||||
if (newVal) {
|
||||
this.fileList = [];
|
||||
this.fileId = null;
|
||||
this.scheduleLoadApproveHistory();
|
||||
} else {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
this.approveLogs = [];
|
||||
}
|
||||
},
|
||||
detail: {
|
||||
handler() {
|
||||
this.fileList = [];
|
||||
this.fileId = null;
|
||||
this.scheduleLoadApproveHistory();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
|
|
@ -219,6 +243,33 @@ export default {
|
|||
this.selectedPayableRow = row;
|
||||
this.payableVisible = true;
|
||||
},
|
||||
scheduleLoadApproveHistory() {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
}
|
||||
this.approveLogsTimer = setTimeout(() => {
|
||||
this.loadApproveHistory();
|
||||
}, 800);
|
||||
},
|
||||
loadApproveHistory() {
|
||||
const businessKey = this.detail && this.detail.paymentBillCode;
|
||||
if (!businessKey) {
|
||||
this.approveLogs = [];
|
||||
return;
|
||||
}
|
||||
if (this.approveLogsLoading) {
|
||||
return;
|
||||
}
|
||||
this.approveLogsLoading = true;
|
||||
listCompletedFlows({ businessKey }).then(response => {
|
||||
this.approveLogs = response.data || [];
|
||||
}).catch(() => {
|
||||
this.approveLogs = [];
|
||||
this.$modal.msgError("获取流转历史失败!");
|
||||
}).finally(() => {
|
||||
this.approveLogsLoading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -90,6 +90,11 @@
|
|||
<el-table-column property="paymentRate" label="本次收票比例(%)"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<el-divider content-position="left">流转意见</el-divider>
|
||||
<flow-opinion-timeline :logs="approveLogs" />
|
||||
</div>
|
||||
</div>
|
||||
<edit-form :visible.sync="payableVisible" :data="selectedPayableRow" :z-index="2000" @close="payableVisible = false" />
|
||||
</el-drawer>
|
||||
|
|
@ -97,10 +102,12 @@
|
|||
|
||||
<script>
|
||||
import EditForm from "@/views/finance/payable/components/EditForm.vue";
|
||||
import FlowOpinionTimeline from "@/views/finance/components/FlowOpinionTimeline.vue";
|
||||
import { listCompletedFlows } from "@/api/flow";
|
||||
|
||||
export default {
|
||||
name: "DetailDrawer",
|
||||
components: {EditForm},
|
||||
components: {EditForm, FlowOpinionTimeline},
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
|
|
@ -115,8 +122,36 @@ export default {
|
|||
return {
|
||||
payableVisible: false,
|
||||
selectedPayableRow: {},
|
||||
approveLogs: [],
|
||||
approveLogsTimer: null,
|
||||
approveLogsLoading: false,
|
||||
};
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(newVal) {
|
||||
if (newVal) {
|
||||
this.scheduleLoadApproveHistory();
|
||||
} else {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
this.approveLogs = [];
|
||||
}
|
||||
},
|
||||
detail: {
|
||||
handler() {
|
||||
this.scheduleLoadApproveHistory();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
dicts:['receipt_bill_type','approve_status','receipt_status'],
|
||||
methods: {
|
||||
handleClose() {
|
||||
|
|
@ -127,6 +162,36 @@ export default {
|
|||
this.selectedPayableRow = row;
|
||||
this.payableVisible = true;
|
||||
},
|
||||
scheduleLoadApproveHistory() {
|
||||
if (!this.visible) {
|
||||
return;
|
||||
}
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
}
|
||||
this.approveLogsTimer = setTimeout(() => {
|
||||
this.loadApproveHistory();
|
||||
}, 800);
|
||||
},
|
||||
loadApproveHistory() {
|
||||
const businessKey = this.detail && this.detail.ticketBillCode;
|
||||
if (!businessKey) {
|
||||
this.approveLogs = [];
|
||||
return;
|
||||
}
|
||||
if (this.approveLogsLoading) {
|
||||
return;
|
||||
}
|
||||
this.approveLogsLoading = true;
|
||||
listCompletedFlows({ businessKey }).then(response => {
|
||||
this.approveLogs = response.data || [];
|
||||
}).catch(() => {
|
||||
this.approveLogs = [];
|
||||
this.$modal.msgError("获取流转历史失败!");
|
||||
}).finally(() => {
|
||||
this.approveLogsLoading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
@ -160,4 +225,5 @@ export default {
|
|||
.section {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -127,6 +127,10 @@
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="section">
|
||||
<el-divider content-position="left">流转意见</el-divider>
|
||||
<flow-opinion-timeline :logs="approveLogs" />
|
||||
</div>
|
||||
|
||||
<GlobalFilePreview ref="filePreview" />
|
||||
</div>
|
||||
|
|
@ -137,12 +141,15 @@
|
|||
<script>
|
||||
import GlobalFilePreview from '@/components/GlobalFilePreview';
|
||||
import EditForm from "@/views/finance/receivable/components/EditForm.vue";
|
||||
import FlowOpinionTimeline from "@/views/finance/components/FlowOpinionTimeline.vue";
|
||||
import { listCompletedFlows } from "@/api/flow";
|
||||
|
||||
export default {
|
||||
name: "DetailDrawer",
|
||||
components: {
|
||||
GlobalFilePreview,
|
||||
EditForm
|
||||
EditForm,
|
||||
FlowOpinionTimeline
|
||||
},
|
||||
props: {
|
||||
visible: {
|
||||
|
|
@ -158,8 +165,36 @@ export default {
|
|||
return {
|
||||
receivableVisible: false,
|
||||
selectedReceivableRow: {},
|
||||
approveLogs: [],
|
||||
approveLogsTimer: null,
|
||||
approveLogsLoading: false,
|
||||
};
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(newVal) {
|
||||
if (newVal) {
|
||||
this.scheduleLoadApproveHistory();
|
||||
} else {
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
this.approveLogsTimer = null;
|
||||
}
|
||||
this.approveLogs = [];
|
||||
}
|
||||
},
|
||||
detail: {
|
||||
handler() {
|
||||
this.scheduleLoadApproveHistory();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
dicts:['receipt_bill_type','approve_status','receipt_bill_status','payment_method'],
|
||||
methods: {
|
||||
handleClose() {
|
||||
|
|
@ -176,6 +211,36 @@ export default {
|
|||
this.selectedReceivableRow = row;
|
||||
this.receivableVisible = true;
|
||||
},
|
||||
scheduleLoadApproveHistory() {
|
||||
if (!this.visible) {
|
||||
return;
|
||||
}
|
||||
if (this.approveLogsTimer) {
|
||||
clearTimeout(this.approveLogsTimer);
|
||||
}
|
||||
this.approveLogsTimer = setTimeout(() => {
|
||||
this.loadApproveHistory();
|
||||
}, 800);
|
||||
},
|
||||
loadApproveHistory() {
|
||||
const businessKey = this.detail && this.detail.receiptBillCode;
|
||||
if (!businessKey) {
|
||||
this.approveLogs = [];
|
||||
return;
|
||||
}
|
||||
if (this.approveLogsLoading) {
|
||||
return;
|
||||
}
|
||||
this.approveLogsLoading = true;
|
||||
listCompletedFlows({ businessKey }).then(response => {
|
||||
this.approveLogs = response.data || [];
|
||||
}).catch(() => {
|
||||
this.approveLogs = [];
|
||||
this.$modal.msgError("获取流转历史失败!");
|
||||
}).finally(() => {
|
||||
this.approveLogsLoading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue