update:接入cid预览流程

src/api/system/systemApprove.ts

@@ -1,4 +1,4 @@
-import { get } from '@/api/request';
+import { get, post } from '@/api/request';
 
 const env = import.meta.env;
 const PREFIX = env.VITE_API_PREFIX_SYSTEM;
@@ -17,3 +17,8 @@ export const systemQueryApproveFlowStatusApi = (params: any) => {
 export const systemQueryApproveInstanceApi = (params: any) => {
   return get(`${PREFIX}systemApprove/queryApproveInstance`, params);
 };
+
+// 添加模块评审流程映射
+export const systemQueryAddApproveFlowMapApi = (params: any) => {
+  return post(`${PREFIX}systemApprove/addApproveFlowMap`, params);
+};

src/components/common/approvalProcess/index.vue

@@ -7,42 +7,8 @@
       :close-on-click-modal="false"
       @close="closeFun"
     >
-      <div class="content">
+      <div v-if="modelValue" class="content">
-        <div class="step-list">
+        <iframe v-if="cidFlowId && cidTaskId && cidProcessInstanceId" class="iframe" :src="url" />
-          <div
-            v-for="(item, index) in stepList"
-            :key="index"
-            class="step-item"
-            :class="{ active: index <= currentIndex }"
-          >
-            <div class="left">
-              <div class="pic">
-                <el-icon :size="18"><CircleCheck class="icon" /></el-icon>
-              </div>
-            </div>
-            <div class="right">
-              <div class="item">
-                <el-tag v-if="item.nodeStatus === 2" type="primary">
-                  {{ NODE_STATUS[item.nodeType][item.nodeStatus] }}
-                </el-tag>
-                <el-tag v-if="item.nodeStatus === 1" type="warning">
-                  {{ NODE_STATUS[item.nodeType][item.nodeStatus] }}
-                </el-tag>
-                <el-tag v-if="item.nodeStatus === 0" type="info">
-                  {{ NODE_STATUS[item.nodeType][item.nodeStatus] }}
-                </el-tag>
-              </div>
-              <div class="item">{{ item.nodeName }}：{{ item.nodeUserName }}</div>
-              <div v-if="item.showTime" class="item">操作时间：{{ item.showTime }}</div>
-              <div v-if="item.approveDesc" class="des">
-                <div class="tip">审核人添加了评论：</div>
-                <div class="text">
-                  {{ item.approveDesc }}
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
       </div>
     </el-drawer>
   </div>
@@ -50,36 +16,13 @@
 
 <script setup lang="ts">
 import { ref, watch } from 'vue';
-import { CircleCheck } from '@element-plus/icons-vue';
+import {
-import { systemQueryApproveFlowStatusApi } from '@/api/system/systemApprove';
+  systemQueryApproveInstanceApi,
+  systemQueryNewApproveFlowStatusApi,
+  systemQueryGetTaskIdByNodeIdApi,
+} from '@/api/system/systemApprove';
 
-// TODO 接入字典
+const env = import.meta.env;
-const NODE_STATUS: any = {
-  // 根节点
-  '0': {
-    '0': '未提交',
-    '1': '提交中',
-    '2': '已提交',
-  },
-  // 审批节点
-  '1': {
-    '0': '未查阅',
-    '1': '审批中',
-    '2': '已审批',
-  },
-  // 抄送节点
-  '2': {
-    '0': '未查阅',
-    '1': '审批中',
-    '2': '已审批',
-  },
-  // 结束节点
-  '-1': {
-    '0': '未查阅',
-    '1': '审批中',
-    '2': '已审批',
-  },
-};
 
 interface Props {
   modelValue: boolean;
@@ -91,38 +34,67 @@ const props = withDefaults(defineProps<Props>(), {
   flowId: '',
 });
 
+const url = ref(`${env.VITE_API_CID_URL}/spdmApproval`);
+const cidFlowId = ref('');
+const cidTaskId = ref('');
+const cidProcessInstanceId = ref('');
+
+// flowId.value = 'P20251128142047739HM7MI';
+// taskId.value = '7c74e959-f692-11f0-8da4-36c4b20f8769';
+// processInstanceId.value = '7c6754b9-f692-11f0-8da4-36c4b20f8769';
+// url.value = `${env.VITE_API_CID_URL}/spdmApproval?flowId=${flowId.value}&taskId=${taskId.value}&processInstanceId=${processInstanceId.value}`;
+// flowId.value = 'P20260121162933119N9UNT';
+// taskId.value = '0d81f3b5-f6b1-11f0-8da4-36c4b20f8769';
+// processInstanceId.value = '0d712bbc-f6b1-11f0-8da4-36c4b20f8769';
+
 watch(
   () => props.modelValue,
   (val: boolean) => {
     visible.value = val;
     if (val) {
-      getDetailDataFun();
+      getApproveDataFun();
-    } else {
-      currentIndex.value = 0;
-      stepList.value = [];
     }
   }
 );
 
 const emit = defineEmits(['update:modelValue']);
 
-const stepList = ref<any>([]);
-
 const visible = ref(false);
-const currentIndex = ref<any>(0);
 
-const getDetailDataFun = () => {
+const getApproveDataFun = () => {
   const params = {
     flowId: props.flowId,
   };
-  systemQueryApproveFlowStatusApi(params).then((res: any) => {
+  systemQueryApproveInstanceApi(params).then((res: any) => {
     if (res.code === 200) {
-      res.data.forEach((item: any, index: number) => {
+      cidFlowId.value = res.data.templateId;
-        if (item.nodeStatus > 0) {
+      cidProcessInstanceId.value = props.flowId;
-          currentIndex.value = index;
+      getNodeId();
-        }
+    }
-      });
+  });
-      stepList.value = res.data;
+};
+
+const getNodeId = () => {
+  const params = {
+    flowId: props.flowId,
+  };
+  systemQueryNewApproveFlowStatusApi(params).then((res: any) => {
+    if (res.code === 200) {
+      const nodeId = res.data.find((item: any) => item.type === 1)?.id || '';
+      getTaskIdFun(nodeId);
+    }
+  });
+};
+
+const getTaskIdFun = (nodeId: string) => {
+  const params = {
+    nodeId,
+    processInstanceId: props.flowId,
+  };
+  systemQueryGetTaskIdByNodeIdApi(params).then((res: any) => {
+    if (res.code === 200) {
+      cidTaskId.value = res.data;
+      url.value = `${env.VITE_API_CID_URL}/spdmApproval?flowId=${cidFlowId.value}&taskId=${cidTaskId.value}&processInstanceId=${cidProcessInstanceId.value}`;
     }
   });
 };
@@ -137,80 +109,9 @@ const closeFun = () => {
   .content {
     width: 100%;
     height: 100%;
-    .step-list {
+    .iframe {
-      display: flex;
+      width: 100%;
-      flex-direction: column;
+      height: 100%;
-      .step-item {
-        flex: 1;
-        display: flex;
-        padding-bottom: 10px;
-        &:last-child {
-          ::after {
-            display: none;
-          }
-        }
-        &.active {
-          .left {
-            &::after {
-              background-color: var(--el-color-primary);
-            }
-            .pic {
-              .icon {
-                color: var(--el-color-primary);
-              }
-            }
-          }
-        }
-        .left {
-          position: relative;
-          &::after {
-            content: '';
-            position: absolute;
-            top: 0;
-            left: 50%;
-            bottom: -10px;
-            margin-left: -1px;
-            width: 2px;
-            background-color: var(--el-text-color-disabled);
-          }
-          .pic {
-            position: relative;
-            width: 20px;
-            height: 20px;
-            z-index: 1;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            background-color: var(--el-bg-color);
-            .icon {
-              color: var(--el-text-color-disabled);
-            }
-          }
-        }
-        .right {
-          flex: 1;
-          padding: 0 10px 10px;
-          .item {
-            font-size: 14px;
-            color: var(--el-text-color-regular);
-            margin-bottom: 4px;
-          }
-          .des {
-            padding: 5px 10px;
-            border-radius: 4px;
-            font-size: 14px;
-            background-color: var(--el-bg-color-page);
-            .tip {
-              color: var(--el-text-color-regular);
-              font-size: 12px;
-              margin-bottom: 4px;
-            }
-            .text {
-              color: var(--el-text-color-regular);
-            }
-          }
-        }
-      }
     }
   }
 }

src/components/common/approvalProcess/index_back.vue

@@ -0,0 +1,217 @@
+<template>
+  <div class="comp-content">
+    <el-drawer
+      v-model="visible"
+      :size="400"
+      title="审核状态"
+      :close-on-click-modal="false"
+      @close="closeFun"
+    >
+      <div class="content">
+        <div class="step-list">
+          <div
+            v-for="(item, index) in stepList"
+            :key="index"
+            class="step-item"
+            :class="{ active: index <= currentIndex }"
+          >
+            <div class="left">
+              <div class="pic">
+                <el-icon :size="18"><CircleCheck class="icon" /></el-icon>
+              </div>
+            </div>
+            <div class="right">
+              <div class="item">
+                <el-tag v-if="item.nodeStatus === 2" type="primary">
+                  {{ NODE_STATUS[item.nodeType][item.nodeStatus] }}
+                </el-tag>
+                <el-tag v-if="item.nodeStatus === 1" type="warning">
+                  {{ NODE_STATUS[item.nodeType][item.nodeStatus] }}
+                </el-tag>
+                <el-tag v-if="item.nodeStatus === 0" type="info">
+                  {{ NODE_STATUS[item.nodeType][item.nodeStatus] }}
+                </el-tag>
+              </div>
+              <div class="item">{{ item.nodeName }}：{{ item.nodeUserName }}</div>
+              <div v-if="item.showTime" class="item">操作时间：{{ item.showTime }}</div>
+              <div v-if="item.approveDesc" class="des">
+                <div class="tip">审核人添加了评论：</div>
+                <div class="text">
+                  {{ item.approveDesc }}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-drawer>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue';
+import { CircleCheck } from '@element-plus/icons-vue';
+import { systemQueryApproveFlowStatusApi } from '@/api/system/systemApprove';
+
+// TODO 接入字典
+const NODE_STATUS: any = {
+  // 根节点
+  '0': {
+    '0': '未提交',
+    '1': '提交中',
+    '2': '已提交',
+  },
+  // 审批节点
+  '1': {
+    '0': '未查阅',
+    '1': '审批中',
+    '2': '已审批',
+  },
+  // 抄送节点
+  '2': {
+    '0': '未查阅',
+    '1': '审批中',
+    '2': '已审批',
+  },
+  // 结束节点
+  '-1': {
+    '0': '未查阅',
+    '1': '审批中',
+    '2': '已审批',
+  },
+};
+
+interface Props {
+  modelValue: boolean;
+  flowId: string;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  modelValue: false,
+  flowId: '',
+});
+
+watch(
+  () => props.modelValue,
+  (val: boolean) => {
+    visible.value = val;
+    if (val) {
+      getDetailDataFun();
+    } else {
+      currentIndex.value = 0;
+      stepList.value = [];
+    }
+  }
+);
+
+const emit = defineEmits(['update:modelValue']);
+
+const stepList = ref<any>([]);
+
+const visible = ref(false);
+const currentIndex = ref<any>(0);
+
+const getDetailDataFun = () => {
+  const params = {
+    flowId: props.flowId,
+  };
+  systemQueryApproveFlowStatusApi(params).then((res: any) => {
+    if (res.code === 200) {
+      res.data.forEach((item: any, index: number) => {
+        if (item.nodeStatus > 0) {
+          currentIndex.value = index;
+        }
+      });
+      stepList.value = res.data;
+    }
+  });
+};
+
+const closeFun = () => {
+  emit('update:modelValue', false);
+};
+</script>
+
+<style lang="scss" scoped>
+.comp-content {
+  .content {
+    width: 100%;
+    height: 100%;
+    .step-list {
+      display: flex;
+      flex-direction: column;
+      .step-item {
+        flex: 1;
+        display: flex;
+        padding-bottom: 10px;
+        &:last-child {
+          ::after {
+            display: none;
+          }
+        }
+        &.active {
+          .left {
+            &::after {
+              background-color: var(--el-color-primary);
+            }
+            .pic {
+              .icon {
+                color: var(--el-color-primary);
+              }
+            }
+          }
+        }
+        .left {
+          position: relative;
+          &::after {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 50%;
+            bottom: -10px;
+            margin-left: -1px;
+            width: 2px;
+            background-color: var(--el-text-color-disabled);
+          }
+          .pic {
+            position: relative;
+            width: 20px;
+            height: 20px;
+            z-index: 1;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            background-color: var(--el-bg-color);
+            .icon {
+              color: var(--el-text-color-disabled);
+            }
+          }
+        }
+        .right {
+          flex: 1;
+          padding: 0 10px 10px;
+          .item {
+            font-size: 14px;
+            color: var(--el-text-color-regular);
+            margin-bottom: 4px;
+          }
+          .des {
+            padding: 5px 10px;
+            border-radius: 4px;
+            font-size: 14px;
+            background-color: var(--el-bg-color-page);
+            .tip {
+              color: var(--el-text-color-regular);
+              font-size: 12px;
+              margin-bottom: 4px;
+            }
+            .text {
+              color: var(--el-text-color-regular);
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/components/common/approvalProcess/index_new.vue

@@ -1,73 +0,0 @@
-<template>
-  <div class="comp-content">
-    <el-drawer
-      v-model="visible"
-      :size="400"
-      title="审核状态"
-      :close-on-click-modal="false"
-      @close="closeFun"
-    >
-      <div v-if="modelValue" class="content">
-        <iframe v-if="flowId && taskId && processInstanceId" class="iframe" :src="url" />
-      </div>
-    </el-drawer>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref, watch } from 'vue';
-
-const env = import.meta.env;
-
-interface Props {
-  modelValue: boolean;
-  // flowId: string;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  modelValue: false,
-  // flowId: '',
-});
-
-const url = ref(`${env.VITE_API_CID_URL}/spdmApproval`);
-const flowId = ref('');
-const taskId = ref('');
-const processInstanceId = ref('');
-
-// flowId.value = 'P20251128142047739HM7MI';
-// taskId.value = '7c74e959-f692-11f0-8da4-36c4b20f8769';
-// processInstanceId.value = '7c6754b9-f692-11f0-8da4-36c4b20f8769';
-// url.value = `${env.VITE_API_CID_URL}/spdmApproval?flowId=${flowId.value}&taskId=${taskId.value}&processInstanceId=${processInstanceId.value}`;
-flowId.value = 'P20260121162933119N9UNT';
-taskId.value = '0d81f3b5-f6b1-11f0-8da4-36c4b20f8769';
-processInstanceId.value = '0d712bbc-f6b1-11f0-8da4-36c4b20f8769';
-url.value = `${env.VITE_API_CID_URL}/spdmApproval?flowId=${flowId.value}&taskId=${taskId.value}&processInstanceId=${processInstanceId.value}`;
-
-watch(
-  () => props.modelValue,
-  (val: boolean) => {
-    visible.value = val;
-  }
-);
-
-const emit = defineEmits(['update:modelValue']);
-
-const visible = ref(false);
-
-const closeFun = () => {
-  emit('update:modelValue', false);
-};
-</script>
-
-<style lang="scss" scoped>
-.comp-content {
-  .content {
-    width: 100%;
-    height: 100%;
-    .iframe {
-      width: 100%;
-      height: 100%;
-    }
-  }
-}
-</style>

src/components/common/approveList/index.vue

@@ -61,7 +61,7 @@ const getlistDataFun = () => {
       listData.value = build;
       if (build[0]) {
         choseData.value = build[0].value;
-        emit('update:modelValue', choseData.value);
+        changeFun();
       }
     }
   });

src/views/system/configuration/index.vue

@@ -20,6 +20,7 @@
       <template #right>
         <div class="right-box">
           <DepartMent v-if="currentActive === 'department'"></DepartMent>
+          <Review v-if="currentActive === 'review'" />
         </div>
       </template>
     </DragSplit>
@@ -29,6 +30,7 @@
 <script setup lang="ts">
 import DragSplit from '@/components/common/dragSplit/index.vue';
 import DepartMent from './components/departMent.vue';
+import Review from './components/review.vue';
 import { ref } from 'vue';
 
 const configList = [
@@ -36,6 +38,10 @@ const configList = [
     label: '部门配置',
     value: 'department',
   },
+  {
+    label: '审核模板配置',
+    value: 'review',
+  },
   {
     label: '其他配置',
     value: 'other',