更新采购申请前端给审核时用

src/views/finance/purchasingrequisition/index.vue

@@ -184,13 +184,48 @@
               <span style="margin-left: 4px">审核状态</span>
             </template>
             <template #default="scope">
-              <el-tag v-if="scope.row.status === '-2'" type="info">撤回</el-tag>
-              <el-tag v-else-if="scope.row.status === '-1'" type="warning">暂存</el-tag>
-              <el-tag v-else-if="scope.row.status === '0'" type="primary">运行中</el-tag>
-              <el-tag v-else-if="scope.row.status === '1'" type="success">完成</el-tag>
-              <el-tag v-else-if="scope.row.status === '2'" type="danger">作废</el-tag>
-              <el-tag v-else-if="scope.row.status === '3'" type="info">终止</el-tag>
-              <span v-else>-</span>
+              <el-tooltip v-if="scope.row.flowInstId" content="点击查看审批过程" placement="top">
+                <el-tag
+                  v-if="scope.row.status === '-2'"
+                  type="info"
+                  class="status-tag-clickable"
+                  @click="handleShowFlowComment(scope.row)">撤回</el-tag>
+                <el-tag
+                  v-else-if="scope.row.status === '-1'"
+                  type="warning"
+                  class="status-tag-clickable"
+                  @click="handleShowFlowComment(scope.row)">暂存</el-tag>
+                <el-tag
+                  v-else-if="scope.row.status === '0'"
+                  type="primary"
+                  class="status-tag-clickable"
+                  @click="handleShowFlowComment(scope.row)">运行中</el-tag>
+                <el-tag
+                  v-else-if="scope.row.status === '1'"
+                  type="success"
+                  class="status-tag-clickable"
+                  @click="handleShowFlowComment(scope.row)">完成</el-tag>
+                <el-tag
+                  v-else-if="scope.row.status === '2'"
+                  type="danger"
+                  class="status-tag-clickable"
+                  @click="handleShowFlowComment(scope.row)">作废</el-tag>
+                <el-tag
+                  v-else-if="scope.row.status === '3'"
+                  type="info"
+                  class="status-tag-clickable"
+                  @click="handleShowFlowComment(scope.row)">终止</el-tag>
+                <span v-else>-</span>
+              </el-tooltip>
+              <template v-else>
+                <el-tag v-if="scope.row.status === '-2'" type="info">撤回</el-tag>
+                <el-tag v-else-if="scope.row.status === '-1'" type="warning">暂存</el-tag>
+                <el-tag v-else-if="scope.row.status === '0'" type="primary">运行中</el-tag>
+                <el-tag v-else-if="scope.row.status === '1'" type="success">完成</el-tag>
+                <el-tag v-else-if="scope.row.status === '2'" type="danger">作废</el-tag>
+                <el-tag v-else-if="scope.row.status === '3'" type="info">终止</el-tag>
+                <span v-else>-</span>
+              </template>
             </template>
           </el-table-column>
           <el-table-column label="操作" align="center" fixed="right" width="150">
@@ -232,6 +267,19 @@
 
     <!-- 履约验收弹窗 -->
     <PurchasingAcceptModal ref="acceptModalRef" @refresh="getDataList" />
+
+    <!-- 查看审批过程（参考 hi-job 流程弹窗） -->
+    <el-dialog
+      v-model="showFlowComment"
+      v-if="showFlowComment"
+      title="查看审批过程"
+      top="20px"
+      width="90%"
+      append-to-body
+      destroy-on-close
+      @close="currFlowJob = null">
+      <FlowCommentTimeline v-if="currFlowJob" :key="currFlowJob.flowInstId" :curr-job="currFlowJob" />
+    </el-dialog>
   </div>
 </template>
 
@@ -249,6 +297,7 @@ import { List, Document, DocumentCopy, Search, Collection, Money, CircleCheck, I
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
 const ActionDropdown = defineAsyncComponent(() => import('/@/components/tools/action-dropdown.vue'));
 const PurchasingAcceptModal = defineAsyncComponent(() => import('./accept/PurchasingAcceptModal.vue'));
+const FlowCommentTimeline = defineAsyncComponent(() => import('/@/views/jsonflow/comment/timeline.vue'));
 
 // 字典数据和品目树数据
 const dictData = ref({
@@ -268,6 +317,9 @@ const formDialogRef = ref()
 const acceptModalRef = ref()
 const searchFormRef = ref()
 const showSearch = ref(true)
+/** 审批过程弹窗：是否显示、当前行对应的流程 job（供 Comment 组件用） */
+const showFlowComment = ref(false)
+const currFlowJob = ref<{ id?: number; flowInstId?: number } | null>(null)
 
 /**
  * 定义响应式表格数据
@@ -305,6 +357,19 @@ const handleAdd = () => {
 };
 
 /**
+/**
+ * 点击审核状态：若有流程实例则打开「查看审批过程」弹窗（参考 hi-job.vue）
+ * @param row - 当前行数据（需含 flowInstId）
+ */
+const handleShowFlowComment = (row: any) => {
+  if (!row?.flowInstId) {
+    useMessage().info('暂存状态无审批过程');
+    return;
+  }
+  currFlowJob.value = { id: row.id, flowInstId: row.flowInstId };
+  showFlowComment.value = true;
+};
+
 /**
  * 打开查看对话框
  * @param row - 当前行数据
@@ -569,5 +634,9 @@ onMounted(() => {
   align-items: center;
   justify-content: center;
 }
+
+.status-tag-clickable {
+  cursor: pointer;
+}
 </style>