fix: 会签任务可选择任务接收人

3 years ago · bfd75ac552
4 changed files with 59 additions and 56 deletions
--- a/ruoyi-flowable/src/main/java/com/ruoyi/flowable/service/impl/FlowTaskServiceImpl.java
+++ b/ruoyi-flowable/src/main/java/com/ruoyi/flowable/service/impl/FlowTaskServiceImpl.java
@ -954,7 +954,7 @@ public class FlowTaskServiceImpl extends FlowServiceFactory implements IFlowTask
                    MultiInstanceLoopCharacteristics multiInstance = userTask.getLoopCharacteristics();
                    // 会签节点
                    if (Objects.nonNull(multiInstance)) {
-                        flowNextDto.setVars(ProcessConstants.PROCESS_MULTI_INSTANCE_USER);
+                        flowNextDto.setVars(multiInstance.getInputDataItem());
                        flowNextDto.setType(ProcessConstants.PROCESS_MULTI_INSTANCE);
                    } else {
                        // 读取自定义节点属性 判断是否是否需要动态指定任务接收人员、组
@ -994,7 +994,7 @@ public class FlowTaskServiceImpl extends FlowServiceFactory implements IFlowTask
                MultiInstanceLoopCharacteristics multiInstance = userTask.getLoopCharacteristics();
                // 会签节点
                if (Objects.nonNull(multiInstance)) {
-                    flowNextDto.setVars(ProcessConstants.PROCESS_MULTI_INSTANCE_USER);
+                    flowNextDto.setVars(multiInstance.getInputDataItem());
                    flowNextDto.setType(ProcessConstants.PROCESS_MULTI_INSTANCE);
                } else {
                    // 读取自定义节点属性 判断是否是否需要动态指定任务接收人员、组
--- a/ruoyi-ui/src/views/flowable/definition/index.vue
+++ b/ruoyi-ui/src/views/flowable/definition/index.vue
@ -176,7 +176,7 @@
    <!-- 流程图 -->
    <el-dialog :title="readImage.title" :visible.sync="readImage.open" width="70%" append-to-body>
      <!-- <el-image :src="readImage.src"></el-image> -->
-       <flow :xmlData="xmlData"/>
+       <flow :flowData="flowData"/>
    </el-dialog>

    <!--表单配置详情-->
@ -227,7 +227,16 @@
 </template>

 <script>
-import { listDefinition, updateState, delDeployment, addDeployment, updateDeployment, exportDeployment, definitionStart, readXml} from "@/api/flowable/definition";
+import {
+  listDefinition,
+  updateState,
+  delDeployment,
+  addDeployment,
+  updateDeployment,
+  exportDeployment,
+  definitionStart,
+  flowXmlAndNode
+} from "@/api/flowable/definition";
 import { getToken } from "@/utils/auth";
 import { getForm, addDeployForm ,listForm } from "@/api/flowable/form";
 import Parser from '@/components/parser/Parser'
@ -311,7 +320,7 @@ export default {
      },
      currentRow: null,
      // xml
-      xmlData:"",
+      flowData: {},
      // 表单参数
      form: {},
      // 表单校验
@ -380,13 +389,12 @@ export default {
      this.$router.push({ path: '/flowable/definition/model',query: { deployId: row.deploymentId }})
    },
    /** 流程图查看 */
-    handleReadImage(deploymentId){
+    handleReadImage(deployId){
      this.readImage.title = "流程图";
      this.readImage.open = true;
      // this.readImage.src = process.env.VUE_APP_BASE_API + "/flowable/definition/readImage/" + deploymentId;
-       // 发送请求，获取xml
-      readXml(deploymentId).then(res =>{
-        this.xmlData = res.data
+      flowXmlAndNode({deployId:deployId}).then(res => {
+        this.flowData = res.data;
      })
    },
    /** 表单查看 */
--- a/ruoyi-ui/src/views/flowable/task/myProcess/send/index.vue
+++ b/ruoyi-ui/src/views/flowable/task/myProcess/send/index.vue
@ -5,9 +5,9 @@
        <span class="el-icon-document">发起任务</span>
        <el-button style="float: right;" size="mini" type="primary" @click="goBack">关闭</el-button>
      </div>
-      <el-tabs  tab-position="top" @tab-click="handleClick">
+      <el-tabs  tab-position="top" v-model="activeName"  @tab-click="handleClick">
        <!--表单信息-->
-        <el-tab-pane label="表单信息">
+        <el-tab-pane label="表单信息" name="1">
            <!--初始化流程加载表单信息-->
            <el-col :span="16" :offset="4">
              <div class="test-form">
@ -16,7 +16,7 @@
            </el-col>
        </el-tab-pane>
        <!--流程图-->
-        <el-tab-pane label="流程图">
+        <el-tab-pane label="流程图" name="2">
           <flow :flowData="flowData"/>
        </el-tab-pane>
      </el-tabs>
@ -56,6 +56,7 @@ export default {
    return {
      // 模型xml数据
      flowData: {},
+      activeName: '1', // 切换tab标签
      defaultProps: {
        children: "children",
        label: "label"
@ -74,10 +75,10 @@ export default {
      taskOpen: false,
      checkSendUser: false, // 是否展示人员选择模块
      checkSendRole: false,// 是否展示角色选择模块
-      checkType: 'single', // 选择类型
+      checkType: '', // 选择类型
      checkValues: null, // 选中任务接收人员数据
      formData: {}, // 填写的表单数据,
-      activeValue: 1, // 切换tab标签
+      multiInstanceVars: '' // 会签节点
    };
  },
  created() {
@ -89,7 +90,7 @@ export default {
  },
  methods: {
    handleClick(tab, event) {
-      if (tab.name === '3'){
+      if (tab.name === '2'){
        flowXmlAndNode({deployId:this.deployId}).then(res => {
          this.flowData = res.data;
        })
@ -149,7 +150,10 @@ export default {
          } else if (data.type === 'candidateGroups') { // 指定组(所属角色接收任务)
            this.checkSendRole = true;
          } else if (data.type === 'multiInstance') { // 会签?
+            // 流程设计指定的 elementVariable 作为会签人员列表
+            this.multiInstanceVars = data.vars;
            this.checkSendUser = true;
+            this.checkType = "multiple";
          }
          if (this.checkSendUser || this.checkSendRole){
            this.taskOpen = true;
@ -194,7 +198,11 @@ export default {
        // 是否显示按钮
        formData.formBtns = false;
        variables.variables = formData;
-        variables.approval = this.checkValues;
+        if (this.multiInstanceVars) {
+          this.$set(variables, this.multiInstanceVars, this.checkValues);
+        } else {
+          this.$set(variables, "approval", this.checkValues);
+        }
        console.log(variables,"流程发起提交表单数据")
        // 启动流程并将表单数据加入流程变量
        definitionStart(this.procDefId, JSON.stringify(variables)).then(res => {
@ -218,7 +226,10 @@ export default {
          } else if (data.type === 'candidateGroups') { // 指定组(所属角色接收任务)
            this.checkSendRole = true;
          } else if (data.type === 'multiInstance') { // 会签?
+            // 流程设计指定的 elementVariable 作为会签人员列表
+            this.multiInstanceVars = data.vars;
            this.checkSendUser = true;
+            this.checkType = "multiple";
          }
        }
      })
@ -228,7 +239,11 @@ export default {
      if (selection) {
        if (selection instanceof Array) {
          const selectVal = selection.map(item => item.userId);
-          this.checkValues = selectVal.join(',')
+          if (this.multiInstanceVars) {
+            this.checkValues = selection;
+          } else {
+            this.checkValues = selectVal.join(',');
+          }
        } else {
          this.checkValues = selection.userId;
        }
--- a/ruoyi-ui/src/views/flowable/task/todo/detail/index.vue
+++ b/ruoyi-ui/src/views/flowable/task/todo/detail/index.vue
@ -179,15 +179,14 @@ export default {
        returnTaskShow: false, // 是否展示回退表单
        delegateTaskShow: false, // 是否展示回退表单
        defaultTaskShow: true, // 默认处理
-        sendUserShow: false, // 审批用户
        comment:"", // 意见内容
        procInsId: "", // 流程实例编号
        instanceId: "", // 流程实例编号
        deployId: "",  // 流程定义编号
        taskId: "" ,// 流程任务编号
        procDefId: "",  // 流程编号
-        vars: "",
-        targetKey:""
+        targetKey:"",
+        variables:{},
      },
      assignee: null,
      formConf: {}, // 默认表单数据
@ -205,7 +204,8 @@ export default {
      checkSendRole: false,// 是否展示角色选择模块
      checkType: 'single', // 选择类型
      taskName: null, // 任务节点
-      startUser: null, // 发起人信息
+      startUser: null, // 发起人信息,
+      multiInstanceVars: '' // 会签节点
    };
  },
  created() {
@ -252,13 +252,13 @@ export default {
      if (selection) {
        if (selection instanceof Array) {
          const selectVal = selection.map(item => item.userId);
-          this.taskForm.values = {
-            "approval": selectVal.join(',')
+          if (this.multiInstanceVars) {
+            this.$set(this.taskForm.variables, this.multiInstanceVars, selection);
+          } else {
+            this.$set(this.taskForm.variables, "approval", selectVal.join(','));
          }
        } else {
-          this.taskForm.values = {
-            "approval": selection
-          }
+            this.$set(this.taskForm.variables, "approval", selection);
        }
      }
    },
@ -267,25 +267,9 @@ export default {
      if (selection) {
        if (selection instanceof Array) {
          const selectVal = selection.map(item => item.roleId);
-          this.taskForm.values = {
-            "approval": selectVal.join(',')
-          }
+          this.$set(this.taskForm.variables, "approval", selectVal.join(','));
        } else {
-          this.taskForm.values = {
-            "approval": selection
-          }
-        }
-      }
-    },
-    /** 流程变量赋值 */
-    handleCheckChange(val) {
-      if (val instanceof Array) {
-        this.taskForm.values = {
-          "approval": val.join(',')
-        }
-      } else {
-        this.taskForm.values = {
-          "approval": val
+          this.$set(this.taskForm.variables, "approval", selection);
        }
      }
    },
@ -332,12 +316,10 @@ export default {
          } else if (data.type === 'candidateGroups') { // 指定组(所属角色接收任务)
            this.checkSendRole = true;
          } else if (data.type === 'multiInstance') { // 会签
-            listUser().then(response => {
-                this.taskForm.values = {
-                  "userList": response.rows
-                }
-              }
-            );
+            // 流程设计指定的 elementVariable 作为会签人员列表
+            this.multiInstanceVars = data.vars;
+            this.checkSendUser = true;
+            this.checkType = "multiple";
          }
        }
      })
@ -349,11 +331,11 @@ export default {
    },
    /** 用户审批任务 */
    taskComplete() {
-      if (!this.taskForm.values && this.checkSendUser){
+      if (!this.taskForm.variables && this.checkSendUser){
        this.$modal.msgError("请选择流程接收人员!");
        return;
      }
-      if (!this.taskForm.values && this.checkSendRole){
+      if (!this.taskForm.variables && this.checkSendRole){
        this.$modal.msgError("请选择流程接收角色组!");
        return;
      }
@ -361,7 +343,7 @@ export default {
        this.$modal.msgError("请输入审批意见!");
        return;
      }
-      // console.log(this.taskForm,"流程审批提交表单数据")
+      console.log(this.taskForm,"流程审批提交表单数据")
      complete(this.taskForm).then(response => {
        this.$modal.msgSuccess(response.msg);
        this.goBack();
@ -425,7 +407,7 @@ export default {
      this.returnTitle = "退回流程";
      returnList(this.taskForm).then(res => {
        this.returnTaskList = res.data;
-        this.taskForm.values = null;
+        this.taskForm.variables = null;
      })
    },
    /** 提交退回任务 */
@ -443,7 +425,6 @@ export default {
    cancelTask() {
      this.taskForm.returnTaskShow = false;
      this.taskForm.defaultTaskShow = true;
-      this.taskForm.sendUserShow = true;
      this.returnTaskList = [];
    },
    /** 委派任务 */
@ -461,7 +442,6 @@ export default {
    cancelDelegateTask() {
      this.taskForm.delegateTaskShow = false;
      this.taskForm.defaultTaskShow = true;
-      this.taskForm.sendUserShow = true;
      this.returnTaskList = [];
    },
  }