From 5ac798c2955127928cffcf085a0cd1470a4a2db5 Mon Sep 17 00:00:00 2001
From: "UNISINSIGHT\\rdpnr_jiangpeng" <Cq258258>
Date: Wed, 25 Mar 2026 19:25:06 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E4=BB=98=E6=AC=BE=E5=8D=95?=
 =?UTF-8?q?=E3=80=81=E6=94=B6=E7=A5=A8=E5=8D=95=E3=80=81=E6=94=B6=E6=AC=BE?=
 =?UTF-8?q?=E5=8D=95=E3=80=81=E5=BC=80=E7=A5=A8=E5=8D=95=E8=AF=A6=E6=83=85?=
 =?UTF-8?q?=E5=B1=95=E7=A4=BA=E6=B5=81=E8=BD=AC=E6=84=8F=E8=A7=81=E4=BF=A1?=
 =?UTF-8?q?=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/FlowOpinionTimeline.vue        | 39 +++++++++++
 .../invoice/components/DetailDrawer.vue       | 66 +++++++++++++++++-
 .../payment/components/DetailDrawer.vue       | 53 ++++++++++++++-
 .../receipt/components/DetailDrawer.vue       | 68 ++++++++++++++++++-
 .../receive/components/DetailDrawer.vue       | 67 +++++++++++++++++-
 5 files changed, 289 insertions(+), 4 deletions(-)
 create mode 100644 oms_web/oms_vue/src/views/finance/components/FlowOpinionTimeline.vue

diff --git a/oms_web/oms_vue/src/views/finance/components/FlowOpinionTimeline.vue b/oms_web/oms_vue/src/views/finance/components/FlowOpinionTimeline.vue
new file mode 100644
index 00000000..8c4a1ee5
--- /dev/null
+++ b/oms_web/oms_vue/src/views/finance/components/FlowOpinionTimeline.vue
@@ -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>
diff --git a/oms_web/oms_vue/src/views/finance/invoice/components/DetailDrawer.vue b/oms_web/oms_vue/src/views/finance/invoice/components/DetailDrawer.vue
index 3571e655..9c391abf 100644
--- a/oms_web/oms_vue/src/views/finance/invoice/components/DetailDrawer.vue
+++ b/oms_web/oms_vue/src/views/finance/invoice/components/DetailDrawer.vue
@@ -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>
diff --git a/oms_web/oms_vue/src/views/finance/payment/components/DetailDrawer.vue b/oms_web/oms_vue/src/views/finance/payment/components/DetailDrawer.vue
index 4962d79d..75b253d7 100644
--- a/oms_web/oms_vue/src/views/finance/payment/components/DetailDrawer.vue
+++ b/oms_web/oms_vue/src/views/finance/payment/components/DetailDrawer.vue
@@ -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>
diff --git a/oms_web/oms_vue/src/views/finance/receipt/components/DetailDrawer.vue b/oms_web/oms_vue/src/views/finance/receipt/components/DetailDrawer.vue
index 242779a4..6c1a449d 100644
--- a/oms_web/oms_vue/src/views/finance/receipt/components/DetailDrawer.vue
+++ b/oms_web/oms_vue/src/views/finance/receipt/components/DetailDrawer.vue
@@ -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>
diff --git a/oms_web/oms_vue/src/views/finance/receive/components/DetailDrawer.vue b/oms_web/oms_vue/src/views/finance/receive/components/DetailDrawer.vue
index cfe39c83..4fb6cf15 100644
--- a/oms_web/oms_vue/src/views/finance/receive/components/DetailDrawer.vue
+++ b/oms_web/oms_vue/src/views/finance/receive/components/DetailDrawer.vue
@@ -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>