优化流程节点生成的json数据

src/utils/enum/flow.ts

@@ -1,3 +1,22 @@
+export enum FLOW_APP_TYPE {
+  /**
+   * 本地应用
+   */
+  LOCAL = '1',
+  /**
+   * 云应用
+   */
+  CLOUD = '2',
+  /**
+   * HPC
+   */
+  HPC = '3',
+  /**
+   * 脚本节点
+   */
+  SCRIPT_NODE = '5'
+}
+
 export enum FLOW_USE_STATUS {
   /**
    * 禁用

src/views/simulation/creation/components/flow.ts

@@ -1,4 +1,4 @@
-import { FLOW_NODE_TYPE_ENUM } from '@/utils/enum/flow';
+import { FLOW_APP_TYPE, FLOW_NODE_TYPE_ENUM } from '@/utils/enum/flow';
 import { ElMessage } from 'element-plus';
 import { useNodeAttribute } from './nodeEvents';
 
@@ -20,7 +20,7 @@ export const getRelationNodeAndVerifyFlowFun = (cells:any, templateName:string,
   const nodeArr = [];
   const edgeArr = [];
   for (let index = 0; index < cells.length; index++) {
-    if (cells[index].shape === 'edge') {
+    if (cells[index].shape === 'edge' || cells[index].shape === 'agent-edge') {
       edgeArr.push({
         target: cells[index].target.cell,
         source: cells[index].source.cell,
@@ -64,7 +64,7 @@ const sortNodeAndEdge = (nodeArr: any, edgeArr: any) => {
     console.log('生成一个树结构的节点数据');
     getNodeRelation(startNode, [startNode.id], nodeArr, edgeArr);
     const relationNode = startNode;
-    // console.log('relationNode', startNode);
+    console.log('relationNode', startNode);
 
     const repeatNodeObj:any = {};
     for (let index = 0; index < edgeArr.length; index++) {
@@ -202,7 +202,8 @@ const formatNodeAndEdge = (edgeArr:any[], nodeArr:any[]) => {
   });
   nodeArr.forEach((node:any) => {
     const formatItem:any = {
-      id: node.id, type: node.type,
+      id: node.id,
+      type: node.type,
       nodeType: node.nodeType,
       name: node.label,
     };
@@ -227,49 +228,65 @@ const formatNodeAndEdge = (edgeArr:any[], nodeArr:any[]) => {
       postScripts: node.postScripts,
       preScripts: node.preScripts,
       uuid: node.uuid,
+      exeMethod: node.exeMethod,
     };
 
-    if (node.type === '本地应用') {
+    if (node.nodeTypeValue === FLOW_APP_TYPE.LOCAL) {
       formatItem['extensionElements']['executeConfig'].type = 'localApp';
       formatItem['extensionElements']['executeConfig'].executeType = 'localApp';
     }
-    if (node.type === '云应用') {
+    if (node.nodeTypeValue === FLOW_APP_TYPE.CLOUD) {
       formatItem['extensionElements']['executeConfig'].type = 'cloudApp';
       formatItem['extensionElements']['executeConfig'].executeType = 'cloudApp';
     }
-    if (node.type === 'HPC') {
+    if (node.nodeTypeValue === FLOW_APP_TYPE.HPC) {
       formatItem['extensionElements']['executeConfig'].type = 'HPC';
       formatItem['extensionElements']['executeConfig'].executeType = 'HPC';
+      formatItem['extensionElements']['executeConfig'].waitUser = node.exeMethod !== 'serviceTask';
+      formatItem['extensionElements']['executeConfig'].asyncCallback = true;
+    } else {
+      formatItem['extensionElements']['executeConfig'].asyncCallback = false;
     }
-    if (node.type === '脚本节点') {
+    if (node.nodeTypeValue === FLOW_APP_TYPE.SCRIPT_NODE) {
       formatItem['extensionElements']['executeConfig'].type = 'scriptNode';
-      formatItem['extensionElements']['executeConfig'].executeType = 'scriptNode';
+      formatItem['extensionElements']['executeConfig'].executeType = 'exportWordScript';
+    }
+
+    if (node.nodeTypeValue === FLOW_APP_TYPE.HPC) {
+      // HPC节点异步回调为true
+      // formatItem.asyncCallback = true;
+      // formatItem.waitUser = node.exeMethod === 'serviceTask';
+      // HPC节点type为serviceTask
+      formatItem.type = 'serviceTask';
+    } else {
+      // 非HPC节点异步回调为false
+      // formatItem.asyncCallback = false;
+      // 非HPC节点type为userTask
+      formatItem.type = 'userTask';
+    }
+
+    if (node.nodeTypeValue === FLOW_APP_TYPE.SCRIPT_NODE) {
+      formatItem.type = 'serviceTask';
     }
 
     delete formatItem['extensionElements']['executeConfig']['iconUrl'];
     delete formatItem['extensionElements']['executeConfig']['children'];
     delete formatItem['extensionElements']['executeConfig']['children'];
+
+    if (formatItem.nodeType === FLOW_NODE_TYPE_ENUM.START) {
+      formatItem.type = 'startEvent';
+      delete formatItem['extensionElements'];
+    }
+    if (formatItem.nodeType === FLOW_NODE_TYPE_ENUM.END) {
+      formatItem.type = 'endEvent';
+      delete formatItem['extensionElements'];
+    }
+
     delete formatItem.iconUrl;
     delete formatItem.pageConfigList;
     delete formatItem.children;
     delete formatItem.preNode;
     delete formatItem.nodeType;
-    if (formatItem.nodeType === FLOW_NODE_TYPE_ENUM.START) {
-      formatItem.type = 'startEvent';
-    }
-    if (formatItem.nodeType === FLOW_NODE_TYPE_ENUM.END) {
-      formatItem.type = 'endEvent';
-    }
-    if (node.exeMethod === 'userTask') {
-      formatItem.type = 'userTask';
-    }
-    else if (node.exeMethod === 'serviceTask') {
-      formatItem.type = 'serviceTask';
-    } else {
-      // 默认自动执行
-      formatItem.type = 'serviceTask';
-    }
-
     nodeFormatArr.push(formatItem);
   });
   return [...nodeFormatArr, ...edgeFormatArr];

src/views/simulation/creation/components/initGraph.ts

@@ -7,6 +7,7 @@ import { History } from '@antv/x6-plugin-history';
 import { keyboardEvents } from './keyboard';
 import { stencilRegister } from './stencil';
 import { initNodeEvents } from './nodeEvents';
+import { v4 as uuidv4 } from 'uuid';
 
 export const FLOW_CREATE_ID = 'flow-create-content';
 
@@ -50,7 +51,7 @@ export const initGraph = async () => {
       allowLoop: false,
       highlight: true,
       createEdge(): Edge {
-        return graph.createEdge({ shape: 'agent-edge' });
+        return graph.createEdge({ shape: 'agent-edge', id: 'uuid-edge-' + uuidv4() });
       },
       validateConnection({ targetMagnet }) {
         return !!targetMagnet;

src/views/simulation/creation/components/pageConfig/DraggableItem.vue

@@ -3,7 +3,7 @@ import { defineComponent, useAttrs, watch } from 'vue';
 import Render from './render.vue';
 import { CopyDocument, Delete } from '@element-plus/icons-vue';
 import Draggable from 'vuedraggable';
-import deleteIcon from '@/assets/imgs/dragFlow/delete.svg';
+import deleteIcon from '@/assets/imgs/dragFlow/delete-red.svg';
 import editIcon from '@/assets/imgs/dragFlow/edit.svg';
 
 const Layouts = defineComponent({

src/views/simulation/creation/components/pageConfig/RightPanel.vue

@@ -1026,7 +1026,7 @@ const changeLabel = (activeData: any) => {
   .el-date-editor {
     width: 227px;
   }
-  ::v-deep .el-icon-time {
+  .el-icon-time {
     display: none;
   }
 }

src/views/simulation/creation/components/stencil.ts

@@ -9,6 +9,7 @@ import stencilStartImg from '@/assets/imgs/dragFlow/dragIcon/stencil_start.svg';
 import stencilEndImg from '@/assets/imgs/dragFlow/dragIcon/stencil_end.svg';
 import { FLOW_CREATE_ID } from './initGraph';
 import { FLOW_NODE_TYPE_ENUM } from '@/utils/enum/flow';
+import { v4 as uuidv4 } from 'uuid';
 
 const commonStore = CommonStore();
 
@@ -81,6 +82,7 @@ export const stencilRegister = async (graph: any) => {
   stencil.dnd.options.getDropNode = (node: any) => {
     console.log('node', node);
     return graph.createNode({
+      id: 'uuid-node-' + uuidv4(),
       shape: node.data.isApp ? 'custom-app-vue-node' : 'custom-local-vue-node',
       // shape: 'custom-app-vue-node',
       data: { ...node.data },
@@ -110,6 +112,7 @@ export const createNode = (nodeListObj:any, graph:any, stencil?:any) => {
           uuid: item.isLocal ? '' : item.uuid,
           type: item.isLocal ? nodeListObj[key].type : nodeListObj[key].label,
           nodeType: item.isLocal ? item.nodeType : nodeListObj[key].label,
+          nodeTypeValue: nodeListObj[key].type,
           iconUrl: item.isLocal ? item.appImage : FileUtil.getFilePreviewImgPathUrl(item.appImage),
           preScripts: [],
           postScripts: [],