流程节点添加异步事件相关数据

ruoyi-ui/src/views/bussiness/components/TaskItem.vue

@@ -71,6 +71,7 @@ export default {
 <style scoped lang="scss">
 .task-item-wrap {
   padding: 12px 16px;
+  height: 130px;
   flex: 1;
   box-sizing: border-box;
   background-color: #ebe6e6;

ruoyi-ui/src/views/bussiness/components/taskList.vue

@@ -18,7 +18,8 @@
         <span class="title-content">3</span>
       </div> -->
       <div class="title-item">
-        <span class="title-label">完成时间:</span>
+        <!-- <span class="title-label">完成时间:</span> -->
+        <span class="title-label">开始时间:</span>
         <span class="title-content">{{
           baseInfo.benCreateTime.replace("T", " ")
         }}</span>

ruoyi-ui/src/views/bussiness/dialogCompments/GY1.vue

@@ -4,13 +4,19 @@
       :model="form"
       ref="form"
       :rules="rules"
-      label-width="80px"
+      label-width="100px"
       :inline="false"
       size="normal"
     >
-      <el-form-item label="name:">
+      <el-form-item prop="name" label="姓名:">
         <el-input v-model="form.name"></el-input>
       </el-form-item>
+      <el-form-item prop="number" label="运行数量:">
+        <el-input v-model="form.number"></el-input>
+      </el-form-item>
+      <el-form-item prop="remark" label="备注信息:">
+        <el-input v-model="form.remark"></el-input>
+      </el-form-item>
     </el-form>
   </div>
 </template>
@@ -24,14 +30,42 @@ export default {
     return {
       form: {
         name: "",
+        number: "",
+        remark: "",
+      },
+      rules: {
+        name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
+        number: [
+          { required: true, message: "请输入运行数量", trigger: "blur" },
+        ],
+        remark: [
+          { required: true, message: "请输入备注信息", trigger: "blur" },
+        ],
       },
-      rules: {},
     };
   },
   computed: {},
   methods: {
-    getFormData() {
-      return this.form;
+    async getFormData() {
+      let formData = {
+        flag: false,
+        msg: "",
+      };
+      try {
+        let valid = await this.$refs.form.validate();
+        if (valid) {
+          formData.flag = true;
+          formData.data = this.form;
+          return formData;
+        } else {
+          formData.msg = "表单校验异常,请规范填写表单数据";
+          return formData;
+        }
+      } catch (error) {
+        // console.log(error);
+        formData.msg = "表单校验异常,请规范填写表单数据";
+        return formData;
+      }
     },
   },
 };

ruoyi-ui/src/views/bussiness/processMange.vue

@@ -255,7 +255,7 @@ export default {
       // 根据当前节点绑定的表单信息查询对应的表单进行展示
     },
     // 运行节点按钮
-    executeNode() {
+    async executeNode() {
       console.log(this.row);
       let { benTaskNodeKey, bepTaskProcessXmlContent, implementationName } =
         this.row;
@@ -266,8 +266,11 @@ export default {
       let formData = {};
       if (this.$refs.myFormRef) {
         //获取自定义表单组件内容
-        let formData = this.$refs.myFormRef.getFormData();
-        console.log(formData);
+        formData = await this.$refs.myFormRef.getFormData();
+        if (!formData.flag) {
+          this.$message.error(formData.msg);
+          return;
+        }
       }
       // let payLoad = {
       //   basicMap: {
@@ -283,11 +286,12 @@ export default {
       // };
 
       let payLoad = {
-        taskProcessKey: this.row.bepTaskKey,
-        taskNodeKey: nodeId,
-        nextNodeKey: nextNodeId,
-        implementationName: this.row.benmTaskAutomaticScriptTriggerType,
-        formDataMap: formData,
+        taskProcessKey: this.row.bepTaskKey, //当前任务流程编码
+        taskNodeKey: nodeId, //当前执行节点唯一编码
+        nextNodeKey: nextNodeId, //下一节点编码
+        implementationName: this.row.benmTaskAutomaticScriptTriggerType, //当前节点绑定的脚本名
+        taskProcessXmlContent: this.row.bepTaskProcessXmlContent, //当前流程xml
+        formDataMap: formData.data, //自定义表单组件收集的表单数据
       };
       runProcessNodeExecution(payLoad).then((res) => {
         console.log(res);

ruoyi-ui/src/views/system/bpmnPro/components/Panel/components/ElementAsyncContinuations.vue

@@ -1,19 +1,59 @@
 <template>
   <el-collapse-item name="element-async-continuations">
     <template #title>
-      <collapse-title title="异步属性">
+      <collapse-title title="异步任务">
         <lucide-icon name="Shuffle" />
       </collapse-title>
     </template>
-    <edit-item label="执行前" :label-width="120">
-      <el-switch v-model="acBefore" @change="updateElementACBefore" />
+    <edit-item label="执行时机" :label-width="100">
+      <el-switch
+        v-model="acBefore"
+        active-text="节点前"
+        inactive-text="节点后"
+        @change="updateElementACBefore"
+      />
     </edit-item>
-    <edit-item label="执行后" :label-width="120">
-      <el-switch v-model="acAfter" @change="updateElementACAfter" />
+    <edit-item label="任务行业" :label-width="100">
+      <el-select
+        v-model="asyncIndustryType"
+        value-key="value"
+        placeholder="请选择行业类型"
+        filterable
+        @change="updateAsyncIndustryType"
+      >
+        <el-option
+          v-for="{ label, value } in dict.type.industry_type"
+          :label="label"
+          :value="value"
+          :key="value"
+        />
+      </el-select>
     </edit-item>
-    <edit-item v-if="showExclusive" label="可跳过" :label-width="120">
-      <el-switch v-model="acExclusive" @change="updateElementACExclusive" />
+    <edit-item label="选择任务" :label-width="100">
+      <el-select
+        v-model="asyncScriptKey"
+        :disabled="!asyncIndustryType"
+        value-key="value"
+        placeholder="请选择执行任务"
+        clearable
+        filterable
+        @change="updateAsyncScriptKey"
+      >
+        <el-option
+          v-for="{ value, label } in scriptList"
+          :key="value"
+          :label="label"
+          :value="value"
+        >
+        </el-option>
+      </el-select>
     </edit-item>
+    <!-- <edit-item label="执行后" :label-width="120">
+      <el-switch v-model="acAfter" @change="updateElementACAfter" />
+    </edit-item> -->
+    <!-- <edit-item v-if="showExclusive" label="可跳过" :label-width="120">
+      <el-switch v-model="acExclusive" @change="updateElementACExclusive" />
+    </edit-item> -->
   </el-collapse-item>
 </template>
 
@@ -25,17 +65,27 @@ import {
   setACAfter,
   setACBefore,
   setACExclusive,
+  getAsyncScriptKey,
+  setAsyncScriptKey,
+  getAsyncIndustryType,
+  setAsyncIndustryType,
 } from "@packages/bo-utils/asynchronousContinuationsUtil";
 import EventEmitter from "@utils/EventEmitter";
 import { getActive } from "@packages/bpmn-utils/BpmnDesignerUtils";
+import { listScript } from "@/api/bpmprocess/process";
 
 export default {
   name: "ElementAsyncContinuations",
+  dicts: ["industry_type"],
   data() {
     return {
-      acBefore: false,
+      acBefore: true,
       acAfter: false,
       acExclusive: false,
+      scriptList: [],
+      asyncIndustryType: "",
+      asyncScriptKey: "",
+      scriptTriggerType: "2",
     };
   },
   computed: {
@@ -50,8 +100,16 @@ export default {
   methods: {
     reloadACStatus() {
       this.acBefore = getACBefore(getActive());
-      this.acAfter = getACAfter(getActive());
-      this.acExclusive = getACExclusive(getActive());
+      // this.acAfter = getACAfter(getActive());
+      // this.acExclusive = getACExclusive(getActive());
+      // 脚本数据
+      if (!getAsyncIndustryType(getActive())) {
+        this.updateAsyncIndustryType(this.dict.type.industry_type[0]?.value);
+      } else {
+        this.getScriptList(getAsyncIndustryType(getActive()));
+      }
+      this.asyncIndustryType = getAsyncIndustryType(getActive());
+      this.asyncScriptKey = getAsyncScriptKey(getActive());
     },
     updateElementACBefore(value) {
       setACBefore(getActive(), value);
@@ -65,11 +123,29 @@ export default {
       setACExclusive(getActive(), value);
       this.reloadACStatus();
     },
+    updateAsyncScriptKey(value) {
+      setAsyncScriptKey(getActive(), value);
+    },
+    updateAsyncIndustryType(value) {
+      setAsyncIndustryType(getActive(), value);
+      this.getScriptList(value);
+      this.asyncScriptKey = "";
+    },
+    async getScriptList(industryType) {
+      let res = await listScript({
+        isEnablePaging: false,
+        industryType,
+      });
+      this.scriptList = res.rows.map((item) => ({
+        value: item.scriptKey,
+        label: item.scriptName,
+      }));
+    },
   },
 };
 </script>
 <style scoped lang="scss">
-::v-deep .edit-item_label{
+::v-deep .edit-item_label {
   width: 70px !important;
 }
 </style>

ruoyi-ui/src/views/system/bpmnPro/components/Panel/index.vue

@@ -156,7 +156,8 @@ export default {
       // isExecutable(element) &&
       //   this.renderComponents.push(ElementExecutionListeners);
       // isAsynchronous(element) &&
-      // this.renderComponents.push(ElementAsyncContinuations);
+      !isProcess(element) &&
+        this.renderComponents.push(ElementAsyncContinuations); //节点前后执行的数据
       // isStartInitializable(element) &&
       //   this.renderComponents.push(ElementStartInitiator);
       // this.renderComponents.push(ElementExtensionField);

ruoyi-ui/src/views/system/bpmnPro/components/bo-utils/asynchronousContinuationsUtil.js

@@ -11,10 +11,39 @@ export function setACBefore(element, value) {
   const modeling = getModeler.get("modeling");
   // overwrite the legacy `async` property, we will use the more explicit `asyncBefore`
   modeling.updateModdleProperties(element, element.businessObject, {
-    [`${prefix}:asyncBefore`]: value,
-    [`${prefix}:async`]: undefined
+    [`${prefix}:asyncBefore`]: value
   });
 }
+/*                   脚本数据start                           */
+export function getAsyncScriptKey(element) {
+  const prefix = getProcessEngine();
+  return element.businessObject.get(`${prefix}:asyncScriptKey`);
+}
+export function setAsyncScriptKey(element, value) {
+  const prefix = getProcessEngine();
+  const modeling = getModeler.get("modeling");
+  // overwrite the legacy `async` property, we will use the more explicit `asyncBefore`
+  modeling.updateModdleProperties(element, element.businessObject, {
+    [`${prefix}:asyncScriptKey`]: value
+  });
+}
+export function getAsyncIndustryType(element) {
+  const prefix = getProcessEngine();
+  return element.businessObject.get(`${prefix}:asyncIndustryType`);
+}
+export function setAsyncIndustryType(element, value) {
+  const prefix = getProcessEngine();
+  const modeling = getModeler.get("modeling");
+  // overwrite the legacy `async` property, we will use the more explicit `asyncBefore`
+  modeling.updateModdleProperties(element, element.businessObject, {
+    [`${prefix}:asyncIndustryType`]: value
+  });
+}
+
+
+
+/*                   脚本数据end                           */
+
 
 export function getACAfter(element) {
   const prefix = getProcessEngine();

ruoyi-ui/src/views/system/bpmnPro/components/bo-utils/getNodeMsg.js

@@ -72,7 +72,14 @@ export function getNodeMsg(xmlObj) {
     nodeObj.nodeKey = node.id;
     nodeObj.nodeName = node.getAttribute('name');
     bpmNodeHandleUser.length && (nodeObj.nodeRolePermission = node.getAttribute(`${prefix}:virtuallyRole`));
-
+    let asyncBefore = node.getAttribute(`${prefix}:asyncBefore`)
+    if (asyncBefore == 'true') {
+      nodeObj.nodeBefore = 'true';
+      nodeObj.nodeAfter = 'false';
+    } else if (asyncBefore == 'false') {
+      nodeObj.nodeBefore = 'false';
+      nodeObj.nodeAfter = 'true';
+    }
     bpmProcessConfigurationList.push(nodeObj)
     console.log(bpmProcessConfigurationList);
   })
@@ -93,6 +100,12 @@ function getNodeException(node, nodeObj) {
       scriptTriggerType: node.getAttribute(`${prefix}:NormalScriptTriggerType`)
     })
   }
+  if (node.getAttribute(`${prefix}:asyncScriptKey`)) {
+    res.push({
+      scriptKey: node.getAttribute(`${prefix}:asyncScriptKey`),
+      scriptTriggerType: '2'
+    })
+  }
   if (children.length) {
     children = Array.from(children);//数组化
     let extensionElements = children.find((item) => item.nodeName == `bpmn:extensionElements`