任务分配支持选部门

xiangpei

2024-11-30 ee15398472acb5686be991b6445bab3db3cf229b

任务分配支持选部门

 src/api/system/dept.js

@@ -9,6 +9,16 @@
  })
}

// flowable查询所有部门
export function flowableGetAllDept() {
  return request({
    url: '/system/dept/flowable/all',
    method: 'get'
  })
}



// 查询部门列表（排除节点）
export function listDeptExcludeChild(deptId) {
  return request({

 src/api/system/user.js

@@ -133,3 +133,11 @@
    method: 'get'
  })
}

// 查询部门下拉树结构(flowable专用)
export function flowableDeptTreeSelect() {
  return request({
    url: '/system/user/flowable/deptTree',
    method: 'get'
  })
}

 src/components/Process/common/global.js

@@ -2,6 +2,7 @@
const modelerStore = {
  'userList': [],
  'roleList': [],
  'deptList': [],
  'expList': [],
  'modeler': null,
  'modeling': null,

 src/components/Process/designer.vue

@@ -138,7 +138,7 @@
      });
      // 监听选择事件，修改当前激活的元素以及表单
      this.modelerStore.modeler.on("selection.changed", ({newSelection}) => {
        console.log("数据改变1")
        console.log("数据改变1", newSelection)
        this.initFormOnChanged(newSelection[0] || null);
      });
      this.modelerStore.modeler.on("element.changed", ({element}) => {

 src/components/Process/panel/taskPanel.vue

@@ -43,12 +43,26 @@
        </el-button-group>
      </el-form-item>

      <el-form-item label="候选角色" v-else>
      <el-form-item label="候选角色" v-else-if="bpmnFormData.userType === 'candidateGroups'">
        <el-input-tag v-model="bpmnFormData.candidateGroups" :value="bpmnFormData.candidateGroups"/>
        <el-button-group class="ml-4" style="margin-top: 4px">
          <!--候选角色-->
          <el-tooltip class="box-item" effect="dark" content="候选角色" placement="bottom">
            <el-button size="mini" type="primary" icon="el-icon-user"  @click="multipleRoleCheck"/>
          </el-tooltip>
          <!--选择表达式-->
          <el-tooltip class="box-item" effect="dark" content="选择表达式" placement="bottom">
            <el-button size="mini" type="warning" icon="el-icon-postcard" @click="singleExpCheck"/>
          </el-tooltip>
        </el-button-group>
      </el-form-item>

      <el-form-item label="候选部门" v-else>
        <el-input-tag v-model="bpmnFormData.candidateGroups" :value="bpmnFormData.candidateGroups"/>
        <el-button-group class="ml-4" style="margin-top: 4px">
          <!--候选部门-->
          <el-tooltip class="box-item" effect="dark" content="候选部门" placement="bottom">
            <el-button size="mini" type="primary" icon="el-icon-user"  @click="deptVisible = true"/>
          </el-tooltip>
          <!--选择表达式-->
          <el-tooltip class="box-item" effect="dark" content="选择表达式" placement="bottom">
@@ -95,6 +109,8 @@
      </div>
    </el-dialog>

    <flow-dept :checkeds="selectData.candidateGroups" :show="deptVisible" @close="closeDept" @submit="submitDept"/>

    <!--选择表达式-->
    <el-dialog
      title="选择表达式"
@@ -119,6 +135,7 @@
import FlowRole from '@/components/flow/Role'
import FlowExp from '@/components/flow/Expression'
import ElInputTag from '@/components/flow/ElInputTag'
import FlowDept from '@/components/flow/Dept'
import {StrUtil} from '@/utils/StrUtil'

export default {
@@ -127,7 +144,8 @@
    FlowUser,
    FlowRole,
    FlowExp,
    ElInputTag
    ElInputTag,
    FlowDept
  },
  /** 组件传值  */
  props : {
@@ -141,13 +159,15 @@
      userVisible: false,
      roleVisible: false,
      expVisible: false,
      deptVisible: false,
      isIndeterminate: true,
      checkType: 'single', // 选类
      userType: '',
      userTypeOption: [
        {label: '指定人员', value: 'assignee'},
        {label: '候选人员', value: 'candidateUsers'},
        {label: '候选角色', value: 'candidateGroups'}
        {label: '候选角色', value: 'candidateGroups'},
        {label: '候选部门', value: 'candidateDeptGroups'},
      ],
      checkAll: false,
      bpmnFormData: {
@@ -164,7 +184,8 @@
      selectData: {
        assignee: null,
        candidateUsers: null,
        candidateGroups: null,
        candidateGroups: null,  // 角色
        candidateDeptGroups: [], // 部门
        exp: null,
      },
      otherExtensionList:[],
@@ -186,6 +207,11 @@

  },
  methods: {
    closeDept() {
      this.deptVisible = false
      this.selectData.candidateGroups = []
    },

    // 初始化表单
    resetTaskForm() {
      // 初始化设为空值
@@ -210,7 +236,7 @@
        const value = this.modelerStore.element?.businessObject[key] || this.bpmnFormData[key];
        this.$set(this.bpmnFormData, key, value);
      }
      // 人员信息回显
      // 人员、角色、部门信息回显
      this.checkValuesEcho(this.bpmnFormData);
    },

@@ -239,6 +265,7 @@
        assignee: null,
        candidateUsers: null,
        candidateGroups: null,
        candidateDeptGroups: null,
        exp: null,
      }
      // 写入userType节点信息到xml
@@ -250,8 +277,9 @@
      if (StrUtil.isNotBlank(formData.expId)) {
        this.getExpList(formData.expId, formData.userType);
      } else {
        if ("candidateGroups" === formData.userType) {
          this.getRoleList(formData[formData.userType], formData.userType);
        console.log("我去", formData.userType)
        if ("candidateGroups" === formData.userType || "candidateDeptGroups" === formData.userType) {
          this.getRoleList(formData["candidateGroups"], "candidateGroups");
        } else {
          this.getUserList(formData[formData.userType], formData.userType);
        }
@@ -282,13 +310,33 @@
    // 获取角色信息
    getRoleList(val, key) {
      if (StrUtil.isNotBlank(val)) {
        const newArr = this.modelerStore.roleList?.filter(i => val.split(',').includes(i.roleId.toString()))
        this.bpmnFormData[key] = newArr.map(item => item.roleName).join(',');
        if ('assignee' === key) {
          this.selectData[key] = newArr.find(item => item.roleId.toString() === val).roleId;

        // 根据id筛选出是角色还是部门
        const roleAndDeptIds = val.split(",");
        const deptIds = roleAndDeptIds.filter(item => item.includes("dept"));
        const roleIds = roleAndDeptIds.filter(item => !item.includes("dept"));
        // 谁有值就是谁
        if (roleIds && roleIds.length > 0) {
          console.log("我去1", roleIds)
          const newArr = this.modelerStore.roleList?.filter(i => roleIds.includes(i.roleId.toString()))
          this.bpmnFormData[key] = newArr.map(item => item.roleName).join(',');
          if ('assignee' === key) {
            this.selectData[key] = newArr.find(item => item.roleId.toString() === val).roleId;
          } else {
            this.selectData[key] = newArr.map(item => item.roleId);
          }
        } else {
          this.selectData[key] = newArr.map(item => item.roleId);
          console.log("我去2", deptIds)
          const newArr = this.modelerStore.deptList?.filter(i => deptIds.includes(i.id))
          this.bpmnFormData[key] = newArr.map(item => item.label).join(',');
          if ('assignee' === key) {
            this.selectData[key] = newArr.find(item => item.id === val).id;
          } else {
            this.selectData[key] = newArr.map(item => item.id);
          }
        }


      }
    },

@@ -367,6 +415,21 @@
      }
    },

    // 部门选中数据
    submitDept(checkList, names) {
      this.deptVisible = false
      // this.selectData.candidateDeptGroups = checkList
      if (checkList && names) {
        this.deleteFlowAttar();
        this.bpmnFormData["candidateGroups"] = names;
        this.updateCustomElement('dataType', 'fixed');
        // userType = candidateGroups
        // 这里只能写死为：candidateGroups，因为flowable用户组的关键字就是它
        this.updateCustomElement("candidateGroups", checkList);
        this.handleSelectData("candidateGroups", checkList);
      }
    },

    // 处理人员回显
    handleSelectData(key, value) {
      for (let oldKey in this.selectData) {

 src/components/flow/Dept/index.vue

New file
@@ -0,0 +1,87 @@
<template>
  <div>
    <el-dialog
      :title="`选择候选部门`"
      :visible.sync="show"
      width="65%"
      :destroy-on-close="true"
      :close-on-click-modal="false"
      :before-close="close">
      <el-tree
        :data="deptTree"
        show-checkbox
        node-key="id"
        :check-strictly="true"
        :default-expanded-keys="['dept:100']"
        @check-change="handleCheckChange"
        :default-checked-keys="checkeds">
      </el-tree>
      <span slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {flowableDeptTreeSelect} from "@/api/system/user";

export default {
  name: "index",
  props: {
    show: {
      required: true,
      type: Boolean
    },
    checkeds: {
      required: true,
      type: Array
    }
  },
  // watch: {
  //   checkeds: {
  //     handler(newV) {
  //       if (newV) {
  //         console.log("djjdjdjdjdjdjj")
  //         this.checkedAfterHandler = newV.map(item => {const arr = item.split(':'); return parseInt(arr[1])})
  //       }
  //     },
  //     deep: true
  //   }
  // },
  data() {
    return {
      deptTree: [],
      checkList: [],
    }
  },
  created() {
    flowableDeptTreeSelect().then(res => {
      this.deptTree = res.data
    })
  },
  methods: {
    handleCheckChange(data, checked, indeterminate) {
      if (checked) {
        this.checkList.push(data)
      } else {
        this.checkList = this.checkList.filter(item => item !== data)
      }
      console.log(data, checked, indeterminate);
    },
    close() {
      this.$emit("close")
    },
    submit() {
      const checkedIds = this.checkList.map(item => item.id).join(",")
      const names = this.checkList.map(item => item.label).join(",")
      this.$emit("submit", checkedIds, names)
    }
  }
}
</script>

<style scoped>

</style>

 src/views/flowable/definition/model.vue

@@ -22,6 +22,7 @@
import vkBeautify from 'vkbeautify'
import hljs from 'highlight.js'
import 'highlight.js/styles/atelier-savanna-dark.css'
import {flowableGetAllDept} from "@/api/system/dept";
export default {
  name: "Model",
  components: {
@@ -109,6 +110,9 @@
      roleList().then(res => {
        this.modelerStore.roleList = res.data;
      })
      flowableGetAllDept().then(res => {
        this.modelerStore.deptList = res.data;
      })
      expList().then(res => {
        this.modelerStore.expList = res.data;
        this.dataExit = true;

 src/views/projectProcess/components/RunProcess.vue

@@ -31,6 +31,11 @@
          >
          </el-table-column>
          <el-table-column
            prop="version"
            label="流程版本"
          >
          </el-table-column>
          <el-table-column
            prop="category"
            label="流程类型"
          >