vue3 工作流：1. 完成流程设计的接口对接；2. 流程任务的分配规则的 modelId 不存在的问题修复

yudao-ui-admin-vue3/package.json

@@ -33,15 +33,21 @@
     "@zxcvbn-ts/core": "^2.2.0",
     "animate.css": "^4.1.1",
     "axios": "^1.2.5",
+    "bpmn-js-token-simulation": "^0.10.0",
+    "camunda-bpmn-moddle": "^7.0.1",
     "cropperjs": "^1.5.13",
     "crypto-js": "^4.1.1",
     "dayjs": "^1.11.7",
+    "diagram-js": "^11.6.0",
     "echarts": "^5.4.1",
     "echarts-wordcloud": "^2.1.0",
     "element-plus": "2.2.28",
+    "fast-xml-parser": "^4.0.13",
+    "highlight.js": "^9.18.5",
     "intro.js": "^6.0.0",
     "jsencrypt": "^3.3.1",
     "lodash-es": "^4.17.21",
+    "min-dash": "^4.0.0",
     "mitt": "^3.0.0",
     "nprogress": "^0.2.0",
     "pinia": "^2.0.29",
@@ -52,16 +58,11 @@
     "vue-i18n": "9.2.2",
     "vue-router": "^4.1.6",
     "vue-types": "^5.0.2",
+    "vue3-treeselect": "^0.1.10",
+    "vuedraggable": "^4.1.0",
     "vxe-table": "^4.3.9",
     "web-storage-cache": "^1.1.1",
     "xe-utils": "^3.5.7",
-    "bpmn-js-token-simulation": "^0.10.0",
-    "camunda-bpmn-moddle": "^7.0.1",
-    "fast-xml-parser": "^4.0.13",
-    "highlight.js": "^9.18.5",
-    "min-dash": "^4.0.0",
-    "vue3-treeselect": "^0.1.10",
-    "vuedraggable": "^4.1.0",
     "xml-js": "^1.6.11"
   },
   "devDependencies": {
@@ -82,10 +83,10 @@
     "@vitejs/plugin-vue": "^4.0.0",
     "@vitejs/plugin-vue-jsx": "^3.0.0",
     "autoprefixer": "^10.4.13",
-    "consola": "^2.15.3",
-    "eslint": "^8.32.0",
     "bpmn-js": "^8.9.0",
     "bpmn-js-properties-panel": "^0.46.0",
+    "consola": "^2.15.3",
+    "eslint": "^8.32.0",
     "eslint-config-prettier": "^8.6.0",
     "eslint-define-config": "^1.14.0",
     "eslint-plugin-prettier": "^4.2.1",

yudao-ui-admin-vue3/src/views/bpm/model/modelEditor.vue

@@ -4,7 +4,7 @@
     <!-- <myProcessDesigner -->
     <my-process-designer
       :key="`designer-${reloadIndex}`"
-      v-if="xmlString != undefined"
+      v-if="xmlString !== undefined"
       v-model="xmlString"
       :value="xmlString"
       v-bind="controlForm"
@@ -70,14 +70,14 @@ onMounted(() => {
   console.log(modelId, 'modelId')
   if (modelId) {
     // let data = '4b4909d8-97e7-11ec-8e20-862bc1a4a054'
-    getModelApi(modelId).then((response) => {
+    getModelApi(modelId).then((data) => {
-      console.log(response, 'response')
+      console.log(data, 'response')
-      xmlString.value = response.data.bpmnXml
+      xmlString.value = data.bpmnXml
       model.value = {
-        ...response.data,
+        ...data,
         bpmnXml: undefined // 清空 bpmnXml 属性
       }
-      // this.controlForm.processId = response.data.key
+      // this.controlForm.processId = data.key
 
       // xmlString.value =
       //   '<?xml version="1.0" encoding="UTF-8"?>\n<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" id="diagram_Process_1645980650311" targetNamespace="http://activiti.org/bpmn"><bpmn2:process id="flowable_01" name="flowable测试" isExecutable="true"><bpmn2:startEvent id="Event_1iruxim"><bpmn2:outgoing>Flow_0804gmo</bpmn2:outgoing></bpmn2:startEvent><bpmn2:userTask id="task01" name="task01"><bpmn2:incoming>Flow_0804gmo</bpmn2:incoming><bpmn2:outgoing>Flow_0cx479x</bpmn2:outgoing></bpmn2:userTask><bpmn2:sequenceFlow id="Flow_0804gmo" sourceRef="Event_1iruxim" targetRef="task01" /><bpmn2:endEvent id="Event_1mdsccz"><bpmn2:incoming>Flow_0cx479x</bpmn2:incoming></bpmn2:endEvent><bpmn2:sequenceFlow id="Flow_0cx479x" sourceRef="task01" targetRef="Event_1mdsccz" /></bpmn2:process><bpmndi:BPMNDiagram id="BPMNDiagram_1"><bpmndi:BPMNPlane id="flowable_01_di" bpmnElement="flowable_01"><bpmndi:BPMNEdge id="Flow_0cx479x_di" bpmnElement="Flow_0cx479x"><di:waypoint x="440" y="350" /><di:waypoint x="492" y="350" /></bpmndi:BPMNEdge><bpmndi:BPMNEdge id="Flow_0804gmo_di" bpmnElement="Flow_0804gmo"><di:waypoint x="288" y="350" /><di:waypoint x="340" y="350" /></bpmndi:BPMNEdge><bpmndi:BPMNShape id="Event_1iruxim_di" bpmnElement="Event_1iruxim"><dc:Bounds x="252" y="332" width="36" height="36" /></bpmndi:BPMNShape><bpmndi:BPMNShape id="task01_di" bpmnElement="task01"><dc:Bounds x="340" y="310" width="100" height="80" /></bpmndi:BPMNShape><bpmndi:BPMNShape id="Event_1mdsccz_di" bpmnElement="Event_1mdsccz"><dc:Bounds x="492" y="332" width="36" height="36" /></bpmndi:BPMNShape></bpmndi:BPMNPlane></bpmndi:BPMNDiagram></bpmn2:definitions>'

yudao-ui-admin-vue3/src/views/bpm/taskAssignRule/index.vue

@@ -289,6 +289,7 @@ const handleUpdate = (row) => {
   // 2. 再设置表单
   formData.value = {
     ...row,
+    modelId: modelId,
     options: [],
     roleIds: [],
     deptIds: [],