部门、人。回显bug

xiangpei

2024-11-30 b33517d527aff48ff30eb78d341bbce53d0ed3bb

部门、人。回显bug

 src/components/Process/panel/taskPanel.vue

@@ -5,7 +5,7 @@
        <el-switch v-model="bpmnFormData.async" active-text="是" inactive-text="否" @change="updateElementTask('async')"/>
      </el-form-item>
      <el-form-item label="用户类型">
        <el-select v-model="bpmnFormData.userType" placeholder="选择人员" @change="updateUserType">
        <el-select v-model="bpmnFormData.userType" placeholder="用户类型" @change="updateUserType">
          <el-option
            v-for="item in userTypeOption"
            :key="item.value"
@@ -87,7 +87,7 @@
      :close-on-press-escape="false"
      :show-close="false"
    >
      <flow-user v-if="userVisible" :checkType="checkType" :selectValues="selectData.assignee || selectData.candidateUsers" @handleUserSelect="userSelect"></flow-user>
      <flow-user v-show="userVisible" ref="user" :checkType="checkType" :num="num" :selectValues="selectData.assignee || selectData.candidateUsers" @handleUserSelect="userSelect"></flow-user>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="userVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="checkUserComplete">确 定</el-button>
@@ -109,7 +109,8 @@
      </div>
    </el-dialog>

    <flow-dept :checkeds="selectData.candidateGroups" :show="deptVisible" @close="closeDept" @submit="submitDept"/>
    <!--  选择部门  -->
    <flow-dept  ref="dept" :checkeds="selectData.candidateGroups" :show="deptVisible" @close="closeDept" @submit="submitDept"/>

    <!--选择表达式-->
    <el-dialog
@@ -119,7 +120,7 @@
      :close-on-press-escape="false"
      :show-close="false"
    >
      <flow-exp v-if="expVisible" :selectValues="selectData.exp" @handleSingleExpSelect="expSelect"></flow-exp>
      <flow-exp :selectValues="selectData.exp" @handleSingleExpSelect="expSelect"></flow-exp>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="expVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="checkExpComplete">确 定</el-button>
@@ -137,6 +138,8 @@
import ElInputTag from '@/components/flow/ElInputTag'
import FlowDept from '@/components/flow/Dept'
import {StrUtil} from '@/utils/StrUtil'



export default {
  name: "TaskPanel",
@@ -156,6 +159,7 @@
  },
  data() {
    return {
      num: 0, // 用于触发用户选择更新
      userVisible: false,
      roleVisible: false,
      expVisible: false,
@@ -171,7 +175,7 @@
      ],
      checkAll: false,
      bpmnFormData: {
        userType: "",
        userType: "candidateDeptGroups",
        assignee: "",
        candidateUsers: "",
        candidateGroups: "",
@@ -184,7 +188,7 @@
      selectData: {
        assignee: null,
        candidateUsers: null,
        candidateGroups: null,  // 角色
        candidateGroups: [],  // 角色
        candidateDeptGroups: [], // 部门
        exp: null,
      },
@@ -209,14 +213,14 @@
  methods: {
    closeDept() {
      this.deptVisible = false
      this.selectData.candidateGroups = []
      this.selectData.candidateGroups = null
    },

    // 初始化表单
    resetTaskForm() {
      // 初始化设为空值
      this.bpmnFormData = {
        userType: "",
        userType: "candidateDeptGroups",
        assignee: "",
        candidateUsers: "",
        candidateGroups: "",
@@ -256,16 +260,19 @@

    // 更新人员类型
    updateUserType(val) {
      console.log("worinim", val)
      // 删除xml中已选择数据类型节点
      this.deleteFlowAttar();
      delete this.modelerStore.element.businessObject[`userType`]
      // 清除已选人员数据
      if (val === "candidateDeptGroups") {
        this.bpmnFormData["candidateGroups"] = null;
      } else {
      this.bpmnFormData[val] = null;
      }
      this.selectData = {
        assignee: null,
        candidateUsers: null,
        candidateGroups: null,
        candidateDeptGroups: null,
        exp: null,
      }
      // 写入userType节点信息到xml
@@ -297,43 +304,54 @@
    // 获取人员信息
    getUserList(val, key) {
      if (StrUtil.isNotBlank(val)) {
        const newArr = this.modelerStore.userList?.filter(i => val.split(',').includes(i.userId.toString()))
        this.bpmnFormData[key] = newArr.map(item => item.nickName).join(',');


        if ('assignee' === key) {
          this.selectData[key] = newArr.find(item => item.userId.toString() === val).userId;
          console.log("这里开始报错，", this.modelerStore.userList)
          const uList = this.modelerStore.userList.filter(item => item.userId == val);
          this.bpmnFormData[key] = uList && uList.length > 0 ? uList[0].nickName : "人员不存在";
          this.selectData[key] = val;
        } else {
          const newArr = this.modelerStore.userList?.filter(i => val.split(',').includes(i.userId.toString()))
          console.log("指定人员", newArr)
          this.bpmnFormData[key] = newArr.map(item => item.nickName).join(',');
          this.selectData[key] = newArr.map(item => item.userId);
        }
        // if (this.$refs.user) {
        //   this.$refs.user.setChecked(this.selectData[key])
        // }

      }
    },

    // 获取角色信息
    getRoleList(val, key) {
      if (StrUtil.isNotBlank(val)) {

        // 根据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) {
            console.log("不会吧？")
            this.selectData[key] = newArr.find(item => item.roleId.toString() === val).roleId;
          } else {
            this.selectData[key] = newArr.map(item => item.roleId);
          }
        } else {
          console.log("我去2", deptIds)
          console.log(deptIds, "部门IDs")
          const newArr = this.modelerStore.deptList?.filter(i => deptIds.includes(i.id))
          this.bpmnFormData[key] = newArr.map(item => item.label).join(',');
          if ('assignee' === key) {
            console.log("不会吧？？？")
            this.selectData[key] = newArr.find(item => item.id === val).id;
          } else {
            this.selectData[key] = newArr.map(item => item.id);
          }
          // this.$refs.dept.setCheckList(this.selectData[key])
        }


@@ -344,12 +362,19 @@

    /*单选人员*/
    singleUserCheck() {
      this.num+=1
      this.userVisible = true;
      this.checkType = "single";
      // this.$nextTick(() => {
      //   console.log(typeof this.selectData.assignee, "类型")
      //   this.$refs.user.setChecked(this.selectData.assignee);
      // });

    },

    /*多选人员*/
    multipleUserCheck() {
      this.num = this.num + 1
      this.userVisible = true;
      this.checkType = "multiple";
    },
@@ -387,7 +412,7 @@
      if (selection) {
        this.deleteFlowAttar();
        this.updateCustomElement('dataType', 'fixed');
        if (selection instanceof Array) {
        if (this.checkType === 'multiple') {
          const userIds = selection.map(item => item.userId);
          const nickName = selection.map(item => item.nickName);
          // userType = candidateUsers
@@ -395,6 +420,7 @@
          this.updateCustomElement(this.bpmnFormData.userType, userIds.join(','));
          this.handleSelectData(this.bpmnFormData.userType, userIds);
        } else {
          console.log(selection, "返回值")
          // userType = assignee
          this.bpmnFormData[this.bpmnFormData.userType] = selection.nickName;
          this.updateCustomElement(this.bpmnFormData.userType, selection.userId);
@@ -418,15 +444,16 @@
    // 部门选中数据
    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", null); // 先清空再赋值，因为是一次性提交的部门数据，所以需要去重，直接赋值为null
        this.updateCustomElement("candidateGroups", checkList);
        this.handleSelectData("candidateGroups", checkList);
        console.log(checkList, "部门值")
      }
    },

@@ -444,7 +471,7 @@
    /*用户选中赋值*/
    checkUserComplete() {
      this.userVisible = false;
      this.checkType = "";
      this.checkType = "single";
    },

    /*候选角色选中赋值*/

 src/components/flow/Dept/index.vue

@@ -4,16 +4,19 @@
      :title="`选择候选部门`"
      :visible.sync="show"
      width="65%"

      :destroy-on-close="true"
      :close-on-click-modal="false"
      :before-close="close">
      <el-tree
        ref="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>
@@ -34,21 +37,21 @@
      type: Boolean
    },
    checkeds: {
      required: true,
      type: Array
      required: true
    }
  },
  // watch: {
  //   checkeds: {
  //     handler(newV) {
  //       if (newV) {
  //         console.log("djjdjdjdjdjdjj")
  //         this.checkedAfterHandler = newV.map(item => {const arr = item.split(':'); return parseInt(arr[1])})
  //       }
  //     },
  //     deep: true
  //   }
  // },
  watch: {
    show: {
      handler(newV) {
        this.$nextTick(() => {
          if (this.$refs.tree && this.checkeds) {
            this.$refs.tree.setCheckedKeys(this.checkeds);
          }
        });
      },
      deep: true
    }
  },
  data() {
    return {
      deptTree: [],
@@ -61,6 +64,9 @@
    })
  },
  methods: {
    setCheckList(value) {
      this.checkList = value
    },
    handleCheckChange(data, checked, indeterminate) {
      if (checked) {
        this.checkList.push(data)

 src/components/flow/Role/index.vue

@@ -121,6 +121,7 @@
            this.radioSelected = newVal
          } else {
            this.selectRoleList = newVal;
            console.log(this.selectRoleList, "角色回显")
          }
        }
      },
@@ -128,14 +129,24 @@
    },
    roleList: {
      handler(newVal) {
        console.log(newVal, "角色回显11")
        if (StrUtil.isNotBlank(newVal) && this.selectRoleList.length > 0) {
          this.$nextTick(() => {
            this.$refs.dataTable.clearSelection();
            if (this.selectRoleList instanceof Array) {
              this.selectRoleList.forEach(key => {
                this.$refs.dataTable.toggleRowSelection(newVal.find(
                  item => key == item.roleId
                ), true)
              });
            } else {
            this.selectRoleList?.split(',').forEach(key => {
              this.$refs.dataTable.toggleRowSelection(newVal.find(
                item => key == item.roleId
              ), true)
            });
            }

          });
        }
      }

 src/components/flow/User/index.vue

@@ -102,6 +102,10 @@
      default: 'multiple',
      required: true
    },
    num: {
      required: true,
      type: Number
    }
  },
  data() {
    return {
@@ -163,36 +167,106 @@
    },
    selectValues: {
      handler(newVal) {
        if (StrUtil.isNotBlank(newVal)) {
          if (newVal instanceof Number) {
            this.radioSelected = newVal
        if (newVal) {
          if (this.checkType === 'multiple') {
            this.selectUserList = newVal.map(item => parseInt(item))
          } else {
            this.selectUserList = newVal;
            this.radioSelected = parseInt(newVal)
          }
        }
      },
      immediate: true
    },
    userList: {
      deep: true,
      handler(newVal) {
        if (StrUtil.isNotBlank(newVal) && this.selectUserList.length > 0) {
        console.log(newVal, "数字")
        console.log(this.selectValues, "传入的值是")
        if (this.checkType !== 'multiple') {
          console.log(this.userList, "传入的值是")
          if (this.radioSelected && this.userList.length > 0) {
            this.$nextTick(() => {
              this.$refs.dataTable.clearSelection();
              this.selectUserList?.split(',').forEach(key => {
                this.$refs.dataTable.toggleRowSelection(newVal.find(
                  item => key == item.userId
                ), true)
              newVal.forEach(item => {
                console.log(this.radioSelected === item.userId, 123)
                if (this.radioSelected === item.userId) {
                  this.$refs.dataTable.toggleRowSelection(item)
                }
              })
            });
          }
        } else {
          this.$nextTick(() => {
            this.$refs.dataTable.clearSelection();
            this.selectUserList.forEach(key => {
              newVal.forEach(item => {
                if (key === item.userId) {
                  this.$refs.dataTable.toggleRowSelection(item)
                }
              })
              });
            });
        }
      }
    }

        // if (StrUtil.isNotBlank(newVal)) {
        //
        //   if (typeof newVal == "number" || typeof newVal == "string") {
        //     console.log("进这")
        //
        //   } else {
        //     console.log("不应该进着")
        //
        //     console.log("用户回显", this.selectUserList)
        //   }
        // }
  },
  created() {
      // immediate: true
    },
    // userList: {
    //   // handler(newVal) {
    //   //   console.log(this.radioSelected, "单选值")
    //   //   if (this.checkType !== 'multiple') {
    //   //
    //   //   } else {
    //   //     console.log("this.selectUserList",this.selectUserList ,typeof this.selectUserList)
    //   //
    //   //   }
    //   // }
    // }
  },
  mounted() {
    this.getList();
    this.getDeptTree();
  },
  methods: {
    setChecked() {
      if (this.checkType !== 'multiple') {
        this.radioSelected = this.selectValues
        this.$nextTick(() => {
          this.$refs.dataTable.clearSelection();
          this.userList.forEach(item => {
            console.log("单选值：", this.radioSelected)
            console.log(parseInt(this.radioSelected) === item.userId)
            if (parseInt(this.radioSelected) === item.userId) {
              this.$refs.dataTable.toggleRowSelection(item)
            }
          })
        });
      } else {
        this.selectUserList = this.selectValues;
        this.$nextTick(() => {
          this.$refs.dataTable.clearSelection();
          this.selectUserList.forEach(key => {
            this.userList.forEach(item => {
              if (parseInt(key) === item.userId) {
                this.$refs.dataTable.toggleRowSelection(item)
              }
            })
          });
        });
      }

    },
    /** 查询用户列表 */
    getList() {
      this.loading = true;
@@ -229,7 +303,7 @@
    },
    // 单选框选中数据
    handleSingleUserSelect(selection) {
      this.radioSelected = selection.userId;//点击当前行时,radio同样有选中效果
      // this.radioSelected = selection.userId;//点击当前行时,radio同样有选中效果
      this.$emit('handleUserSelect', selection);
    },
    /** 搜索按钮操作 */