From e87846bfc7e467836d958632b15a22a901eb51d2 Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期四, 09 一月 2025 15:33:56 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/components/Process/panel/TaskConfPanel.vue | 550 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 550 insertions(+), 0 deletions(-)
diff --git a/src/components/Process/panel/TaskConfPanel.vue b/src/components/Process/panel/TaskConfPanel.vue
new file mode 100644
index 0000000..9d93362
--- /dev/null
+++ b/src/components/Process/panel/TaskConfPanel.vue
@@ -0,0 +1,550 @@
+<template>
+ <div>
+ <el-form label-width="80px" size="small">
+ <el-form-item label="寮傛">
+ <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-option
+ v-for="item in userTypeOption"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ />
+ </el-select>
+ </el-form-item>
+
+ <el-form-item label="鎸囧畾浜哄憳" v-if="bpmnFormData.userType === 'assignee'">
+ <single-user ref="singleUser" :select-user="delegationUserSelect && delegationUserSelect.length > 0 ? delegationUserSelect[0].userId : null" :show="singleUserShow" @close="closeSingleUser" @submit="getSingleUserSelect" :key="singleUserKey"/>
+ <div v-if="expSelect">
+ <el-tag class="select-tag" :key="expSelect.id + 'kfc'" type="info" closable @close="removeExp">{{expSelect.expression}}</el-tag>
+ </div>
+ <div v-else>
+ <el-tag class="select-tag" v-for="user in delegationUserSelect" :key="user.userId + 'abc'" type="info" closable @close="removeSingleUser(user)">{{user.nickName}}</el-tag>
+ </div>
+ <el-button-group class="ml-4" style="margin-top: 4px">
+ <!--鎸囧畾浜哄憳-->
+ <el-tooltip class="box-item" effect="dark" content="鎸囧畾浜哄憳" :disabled="typeButDisable" placement="bottom">
+ <el-button size="mini" type="primary" icon="el-icon-user" :disabled="typeButDisable" @click="editSingleUser"/>
+ </el-tooltip>
+ <!--閫夋嫨琛ㄨ揪寮�-->
+ <el-tooltip class="box-item" effect="dark" content="閫夋嫨琛ㄨ揪寮�" :disabled="expButDisable" placement="bottom">
+ <el-button size="mini" type="warning" icon="el-icon-postcard" :disabled="expButDisable" @click="editExp"/>
+ </el-tooltip>
+ </el-button-group>
+ </el-form-item>
+
+ <el-form-item label="鍊欓�変汉鍛�" v-else-if="bpmnFormData.userType === 'candidateUsers'">
+ <mult-user ref="multUser" :select-user="delegationUserSelect" :show="multUserShow" @close="closeMultUser" @submit="getMultUserSelect" :key="multUserKey"/>
+ <div v-if="expSelect">
+ <el-tag class="select-tag" :key="expSelect.id + 'kfc'" type="info" closable @close="removeExp">{{expSelect.expression}}</el-tag>
+ </div>
+ <div v-else>
+ <el-tag class="select-tag" v-for="user in delegationUserSelect" :key="user.userId + 'qwe'" type="info" closable @close="removeMultUser(user)">{{user.nickName}}</el-tag>
+ </div>
+ <el-button-group class="ml-4" style="margin-top: 4px">
+ <!--鍊欓�変汉鍛�-->
+ <el-tooltip class="box-item" effect="dark" content="鍊欓�変汉鍛�" :disabled="typeButDisable" placement="bottom">
+ <el-button size="mini" type="primary" icon="el-icon-user" :disabled="typeButDisable" @click="editMultUser"/>
+ </el-tooltip>
+ <!--閫夋嫨琛ㄨ揪寮�-->
+ <el-tooltip class="box-item" effect="dark" content="閫夋嫨琛ㄨ揪寮�" :disabled="expButDisable" placement="bottom">
+ <el-button size="mini" type="warning" icon="el-icon-postcard" :disabled="expButDisable" @click="editExp"/>
+ </el-tooltip>
+ </el-button-group>
+ </el-form-item>
+
+ <el-form-item label="鍊欓�夎鑹�" v-else-if="bpmnFormData.userType === 'candidateGroups'">
+ <my-role ref="role" :select-values="delegationRoleSelect" :show="roleShow" @close="closeRole" @submit="getRoleSelect" :key="roleKey"/>
+ <div v-if="expSelect">
+ <el-tag class="select-tag" :key="expSelect.id + 'kfc'" type="info" closable @close="removeExp">{{expSelect.expression}}</el-tag>
+ </div>
+ <div v-else>
+ <el-tag class="select-tag" v-for="role in delegationRoleSelect" :key="role.roleId + 'rty'" type="info" closable @close="removeRole(role)">{{role.roleName}}</el-tag>
+ </div>
+ <el-button-group class="ml-4" style="margin-top: 4px">
+ <!--鍊欓�夎鑹�-->
+ <el-tooltip class="box-item" effect="dark" content="鍊欓�夎鑹�" :disabled="typeButDisable" placement="bottom">
+ <el-button size="mini" type="primary" icon="el-icon-user" :disabled="typeButDisable" @click="editRole"/>
+ </el-tooltip>
+ <!--閫夋嫨琛ㄨ揪寮�-->
+ <el-tooltip class="box-item" effect="dark" content="閫夋嫨琛ㄨ揪寮�" :disabled="expButDisable" placement="bottom">
+ <el-button size="mini" type="warning" icon="el-icon-postcard" :disabled="expButDisable" @click="editExp"/>
+ </el-tooltip>
+ </el-button-group>
+ </el-form-item>
+
+ <el-form-item label="鍊欓�夐儴闂�" v-else>
+ <MyDept ref="dept" :checkeds="delegationDeptSelect" :show="deptShow" @close="closeDept" @submit="getDeptSelect" :key="deptKey"/>
+ <div v-if="expSelect">
+ <el-tag class="select-tag" :key="expSelect.id + 'kfc'" type="info" closable @close="removeExp">{{expSelect.expression}}</el-tag>
+ </div>
+ <div v-else>
+ <el-tag class="select-tag" v-for="dept in delegationDeptSelect" :key="dept.id + 'zxc'" type="info" closable @close="removeDept(dept)">{{dept.label}}</el-tag>
+ </div>
+ <el-button-group class="ml-4" style="margin-top: 4px">
+ <!--鍊欓�夐儴闂�-->
+ <el-tooltip class="box-item" effect="dark" content="鍊欓�夐儴闂�" :disabled="typeButDisable" placement="bottom">
+ <el-button size="mini" type="primary" icon="el-icon-user" :disabled="typeButDisable" @click="editDept"/>
+ </el-tooltip>
+ <!--閫夋嫨琛ㄨ揪寮�-->
+ <el-tooltip class="box-item" effect="dark" content="閫夋嫨琛ㄨ揪寮�" :disabled="expButDisable" placement="bottom">
+ <el-button size="mini" type="warning" icon="el-icon-postcard" :disabled="expButDisable" @click="editExp"/>
+ </el-tooltip>
+ </el-button-group>
+ </el-form-item>
+
+ <el-form-item label="浼樺厛绾�">
+ <el-input v-model="bpmnFormData.priority" @change="updateElementTask('priority')"/>
+ </el-form-item>
+ <el-form-item label="鍒版湡鏃堕棿">
+ <el-input v-model="bpmnFormData.dueDate" @change="updateElementTask('dueDate')"/>
+ </el-form-item>
+ </el-form>
+
+ <!--閫夋嫨琛ㄨ揪寮�-->
+ <el-dialog
+ title="閫夋嫨琛ㄨ揪寮�"
+ :visible.sync="expVisible"
+ width="60%"
+ :close-on-press-escape="false"
+ :destroy-on-close="true"
+ @close="closeExp"
+ >
+ <flow-exp :selectValues="expSelect" @handleSingleExpSelect="getExpSelect"></flow-exp>
+ <div slot="footer" class="dialog-footer">
+ <el-button size="small" type="primary" @click="checkExpComplete">纭� 瀹�</el-button>
+ </div>
+ </el-dialog>
+
+
+ </div>
+</template>
+
+<script>
+import FlowExp from '@/components/flow/Expression'
+import {StrUtil} from '@/utils/StrUtil'
+import MyDept from '@/components/flow/Dept/MyDept'
+import SingleUser from '@/components/flow/User/SingleUser'
+import MultUser from '@/components/flow/User/MultUser'
+import MyRole from '@/components/flow/Role/MyRole'
+
+
+export default {
+ name: "TaskConfPanel",
+ components: {
+ FlowExp,
+ MyRole,
+ MyDept,
+ SingleUser,
+ MultUser,
+ },
+ /** 缁勪欢浼犲�� */
+ props : {
+ id: {
+ type: String,
+ required: true
+ },
+ },
+ data() {
+ return {
+ typeButDisable: false, // 鐢ㄦ埛绫诲瀷閫夋嫨鎸夐挳鏄惁绂佺敤
+ expButDisable: false, // 鐢ㄦ埛绫诲瀷閫夋嫨鎸夐挳鏄惁绂佺敤
+ roleKey: 'role',
+ deptKey: 'dept',
+ multUserKey: 0,
+ singleUserKey: 'single',
+ roleShow: false, // 瑙掕壊缁勬樉绀�
+ delegationRoleSelect: [], // 閫変腑瑙掕壊
+ multUserShow: false, // 鐢ㄦ埛缁勬樉绀�
+ singleUserShow: false, // 鎸囧畾鐢ㄦ埛鏄剧ず
+ delegationUserSelect: [], // 閫変腑鐨勭敤鎴�
+ deptShow: false, // 閮ㄩ棬缁勬樉绀�
+ delegationDeptSelect: [], // 閫変腑閮ㄩ棬
+ expSelect: null, // 閫変腑琛ㄨ揪寮�
+ num: 0, // 鐢ㄤ簬瑙﹀彂鐢ㄦ埛閫夋嫨鏇存柊
+ expVisible: false,
+ isIndeterminate: true,
+ checkType: 'single', // 閫夌被
+ userType: '',
+ userTypeOption: [
+ {label: '鎸囧畾浜哄憳', value: 'assignee'},
+ {label: '鍊欓�変汉鍛�', value: 'candidateUsers'},
+ {label: '鍊欓�夎鑹�', value: 'candidateGroups'},
+ {label: '鍊欓�夐儴闂�', value: 'candidateDeptGroups'},
+ ],
+ checkAll: false,
+ bpmnFormData: {
+ userType: "candidateDeptGroups",
+ assignee: "",
+ candidateUsers: "",
+ candidateGroups: "",
+ dueDate: "",
+ priority: "",
+ dataType: "",
+ expId: "",
+ },
+ // 鏁版嵁鍥炴樉
+ selectData: {
+ assignee: null,
+ candidateUsers: null,
+ candidateGroups: [], // 瑙掕壊
+ candidateDeptGroups: [], // 閮ㄩ棬
+ exp: null,
+ },
+ otherExtensionList:[],
+ }
+ },
+
+ /** 浼犲�肩洃鍚� */
+ watch: {
+ id: {
+ handler(newVal) {
+ if (StrUtil.isNotBlank(newVal)) {
+ this.resetTaskForm();
+ }
+ },
+ immediate: true, // 绔嬪嵆鐢熸晥
+ },
+ },
+ created() {
+
+ },
+ methods: {
+ removeExp() {
+ this.getExpSelect(null)
+ },
+ removeDept(dept) {
+ let index = this.delegationDeptSelect.indexOf(dept);
+ if (index !== -1) {
+ this.delegationDeptSelect.splice(index, 1);
+ }
+ this.getDeptSelect(this.delegationDeptSelect)
+ },
+ removeRole(role) {
+ let index = this.delegationRoleSelect.indexOf(role);
+ if (index !== -1) {
+ this.delegationRoleSelect.splice(index, 1);
+ }
+ this.getRoleSelect(this.delegationRoleSelect)
+ },
+ removeMultUser(user) {
+ let index = this.delegationUserSelect.indexOf(user);
+ if (index !== -1) {
+ this.delegationUserSelect.splice(index, 1);
+ }
+ this.getMultUserSelect(this.delegationUserSelect)
+ },
+ removeSingleUser(user) {
+ // 鍥犱负鍙兘閫変竴涓敤鎴凤紝鎵�浠ュ垹浜嗗氨娌′簡
+ this.getSingleUserSelect(null)
+ },
+ editDept() {
+ this.$nextTick(() => {
+ this.deptKey += '1'
+ this.$refs.dept.setCheckList(this.delegationDeptSelect)
+ })
+ this.deptShow = true
+ },
+ editSingleUser() {
+ if (this.delegationUserSelect && this.delegationUserSelect.length > 0) {
+ this.singleUserKey += '1'
+ this.$nextTick(() => {
+ this.$refs.singleUser.setChecked(this.delegationUserSelect[0])
+ })
+ }
+ this.singleUserShow = true
+ },
+ editRole() {
+ if (this.delegationRoleSelect && this.delegationRoleSelect.length > 0) {
+ this.roleKey += '1'
+ this.$nextTick(() => {
+ this.$refs.role.setChecked(this.delegationRoleSelect)
+ })
+ }
+ this.roleShow = true
+ },
+ editMultUser() {
+ if (this.delegationUserSelect && this.delegationUserSelect.length > 0) {
+ this.multUserKey += '1'
+ this.$nextTick(() => {
+ this.$refs.multUser.setChecked(this.delegationUserSelect)
+ })
+ }
+ this.multUserShow = true
+ },
+ editExp() {
+ this.expVisible = true;
+ },
+ getDeptSelect(deptList) {
+ if (deptList && deptList.length > 0) {
+ this.deleteFlowAttar();
+ this.updateCustomElement('dataType', 'fixed');
+ this.updateCustomElement("candidateGroups", deptList.map(item => item.id).join(","));
+ this.delegationDeptSelect = deptList
+ this.expButDisable = true
+ } else {
+ this.delegationDeptSelect = []
+ this.expButDisable = false
+ }
+ this.deptShow = false
+ this.deptKey += '1'
+ },
+ getMultUserSelect(userList) {
+ if (userList && userList.length > 0) {
+ this.deleteFlowAttar();
+ this.updateCustomElement('dataType', 'fixed');
+ this.updateCustomElement(this.bpmnFormData.userType, userList.map(item => item.userId).join(","));
+ this.delegationUserSelect = userList
+ this.expButDisable = true
+ } else {
+ this.delegationUserSelect = []
+ this.expButDisable = false
+ }
+ this.multUserShow = false
+ this.multUserKey += 1;
+ },
+ getRoleSelect(roleList) {
+ if (roleList && roleList.length > 0) {
+ this.deleteFlowAttar();
+ this.updateCustomElement('dataType', 'fixed');
+ // userType = candidateGroups
+ this.updateCustomElement(this.bpmnFormData.userType, roleList.map(item => item.roleId).join(","));
+ this.delegationRoleSelect = roleList
+ this.expButDisable = true
+ } else {
+ this.delegationRoleSelect = []
+ this.expButDisable = false
+ }
+ this.roleShow = false
+ this.roleKey += '1'
+ },
+ getSingleUserSelect(user) {
+ if (user) {
+ this.deleteFlowAttar();
+ this.updateCustomElement('dataType', 'fixed');
+ this.updateCustomElement(this.bpmnFormData.userType, user.userId);
+ this.delegationUserSelect = [user]
+ this.expButDisable = true
+ } else {
+ this.delegationUserSelect = []
+ this.expButDisable = false
+ this.deleteFlowAttar();
+ }
+ this.singleUserShow = false
+ this.singleUserKey += '1'
+ },
+ getExpSelect(selection) {
+ console.log(selection, "閫変腑鐨勮〃杈惧紡")
+ if (selection) {
+ this.expSelect = selection
+ this.deleteFlowAttar();
+ this.bpmnFormData[this.bpmnFormData.userType] = selection.name;
+ this.updateCustomElement('dataType', selection.dataType);
+ this.updateCustomElement('expId', selection.id.toString());
+ const userType = this.bpmnFormData.userType === "candidateDeptGroups" ? "candidateGroups" : this.bpmnFormData.userType
+ this.updateCustomElement(userType, selection.expression);
+ this.handleSelectData("exp", selection.id);
+ this.typeButDisable = true
+ } else {
+ this.expSelect = null
+ this.typeButDisable = false
+ this.deleteFlowAttar();
+ }
+ },
+ closeExp() {
+ this.expVisible = false
+ },
+ closeDept() {
+ this.deptShow = false
+ this.deptKey += '1'
+ },
+ closeSingleUser() {
+ this.singleUserShow = false
+ this.singleUserKey += '1'
+ },
+ closeRole() {
+ this.roleShow = false
+ this.roleKey += '1'
+ },
+ closeMultUser() {
+ this.multUserShow = false
+ this.multUserKey += 1;
+ },
+
+ // 鍒濆鍖栬〃鍗�
+ resetTaskForm() {
+ // 鍒濆鍖栬涓虹┖鍊�
+ this.bpmnFormData = {
+ userType: "candidateDeptGroups",
+ assignee: "",
+ candidateUsers: "",
+ candidateGroups: "",
+ dueDate: "",
+ priority: "",
+ dataType: "",
+ expId: "",
+ }
+ this.selectData = {
+ assignee: null,
+ candidateUsers: null,
+ candidateGroups: null,
+ exp: null,
+ }
+ // 娴佺▼鑺傜偣淇℃伅涓婂彇鍊�
+ for (let key in this.bpmnFormData) {
+ const value = this.modelerStore.element?.businessObject[key] || this.bpmnFormData[key];
+ this.$set(this.bpmnFormData, key, value);
+ }
+ console.log(this.bpmnFormData, "鍒濆鍖栨暟鎹�")
+ // 浜哄憳銆佽鑹层�侀儴闂ㄤ俊鎭洖鏄�
+ this.checkValuesEcho(this.bpmnFormData);
+ },
+
+ // 鏇存柊鑺傜偣淇℃伅
+ updateElementTask(key) {
+ const taskAttr = Object.create(null);
+ taskAttr[key] = this.bpmnFormData[key] || "";
+ this.modelerStore.modeling.updateProperties(this.modelerStore.element, taskAttr);
+ },
+
+ // 鏇存柊鑷畾涔夋祦绋嬭妭鐐�/鍙傛暟淇℃伅
+ updateCustomElement(key, value) {
+ const taskAttr = Object.create(null);
+ taskAttr[key] = value;
+ this.modelerStore.modeling.updateProperties(this.modelerStore.element, taskAttr);
+ },
+
+ // 鏇存柊浜哄憳绫诲瀷
+ updateUserType(val) {
+ console.log(val, "浜哄憳绫诲瀷")
+ // 鍒犻櫎xml涓凡閫夋嫨鏁版嵁绫诲瀷鑺傜偣
+ this.deleteFlowAttar();
+ // 娓呴櫎宸查�変汉鍛樻暟鎹�
+ if (val === "candidateDeptGroups") {
+ val = "candidateGroups"
+ this.delegationDeptSelect = [] // 閮ㄩ棬
+ } else if (val === "candidateGroups") {
+ this.delegationRoleSelect = [] // 瑙掕壊
+ } else if (val === "assignee" || val === "candidateUsers") {
+ this.delegationUserSelect = [] // 鎸囧畾鐢ㄦ埛/鍊欓�夌敤鎴�
+ }
+ this.expSelect = null // 琛ㄨ揪寮忛噸缃负绌�
+ this.selectData = {
+ assignee: null,
+ candidateUsers: null,
+ candidateGroups: null,
+ exp: null,
+ }
+ this.typeButDisable = false
+ this.expButDisable = false
+ // 鍐欏叆userType鑺傜偣淇℃伅鍒皒ml
+ this.updateCustomElement('userType', val);
+ },
+
+ // 璁捐鍣ㄥ彸渚ц〃鍗曟暟鎹洖鏄�
+ checkValuesEcho(formData) {
+ if (formData.expId) {
+ this.getExpList(formData.expId);
+ this.typeButDisable = true
+ this.expButDisable = false
+ } else {
+ this.typeButDisable = false
+ this.expSelect = null
+ if ("candidateGroups" === formData.userType || "candidateDeptGroups" === formData.userType) {
+ this.getRoleOrDeptReview(formData.candidateGroups)
+ } else {
+ this.getUserList(formData[formData.userType], formData.userType);
+ }
+ }
+ },
+
+ // 鑾峰彇琛ㄨ揪寮忎俊鎭�
+ getExpList(expId) {
+ this.expSelect = this.modelerStore.expList?.find(item => item.id.toString() === expId);
+ },
+
+ // 鑾峰彇浜哄憳淇℃伅
+ getUserList(val, key) {
+ if (StrUtil.isNotBlank(val)) {
+ this.expButDisable = true
+ this.typeButDisable = false
+ if ('assignee' === key) {
+ const uList = this.modelerStore.userList.filter(item => item.userId == val);
+ this.delegationUserSelect = uList
+ } else {
+ const newArr = this.modelerStore.userList?.filter(i => val.split(',').includes(i.userId.toString()))
+ this.delegationUserSelect = newArr
+ }
+ } else {
+ this.expButDisable = false
+ this.delegationUserSelect = []
+ }
+ },
+
+ // 鑾峰彇瑙掕壊淇℃伅
+ getRoleOrDeptReview(ids) {
+ this.delegationDeptSelect = []
+ this.delegationRoleSelect = []
+ if (StrUtil.isNotBlank(ids)) {
+ this.expButDisable = true
+ this.typeButDisable = false
+ // 鏍规嵁id绛涢�夊嚭鏄鑹茶繕鏄儴闂�
+ const roleAndDeptIds = ids.split(",");
+ const deptIds = roleAndDeptIds.filter(item => item.includes("dept"));
+ const roleIds = roleAndDeptIds.filter(item => !item.includes("dept"));
+
+ if (roleIds && roleIds.length > 0) { // 瑙掕壊
+ const targetRoleList = this.modelerStore.roleList?.filter(i => roleIds.includes(i.roleId.toString()))
+ this.delegationRoleSelect = targetRoleList;
+ this.bpmnFormData.userType = "candidateGroups"
+ }
+ if (deptIds && deptIds.length > 0){ // 閮ㄩ棬
+ const targetDeptList = this.modelerStore.deptList?.filter(i => deptIds.includes(i.id))
+ this.delegationDeptSelect = targetDeptList
+ this.bpmnFormData.userType = "candidateDeptGroups"
+ }
+ } else {
+ this.expButDisable = false
+ this.delegationDeptSelect = []
+ this.delegationRoleSelect = []
+ }
+ },
+
+ // ------ 娴佺▼瀹℃壒浜哄憳淇℃伅寮瑰嚭妗� start---------
+
+
+ // 澶勭悊浜哄憳鍥炴樉
+ handleSelectData(key, value) {
+ for (let oldKey in this.selectData) {
+ if (key !== oldKey) {
+ this.$set(this.selectData, oldKey, null);
+ } else {
+ this.$set(this.selectData, oldKey, value);
+ }
+ }
+ },
+
+ /*琛ㄨ揪寮忛�変腑璧嬪��*/
+ checkExpComplete() {
+ this.expVisible = false;
+ },
+
+ // 鍒犻櫎鑺傜偣
+ deleteFlowAttar() {
+ delete this.modelerStore.element.businessObject[`dataType`]
+ delete this.modelerStore.element.businessObject[`expId`]
+ delete this.modelerStore.element.businessObject[`assignee`]
+ delete this.modelerStore.element.businessObject[`candidateUsers`]
+ delete this.modelerStore.element.businessObject[`candidateGroups`]
+ },
+
+ }
+}
+</script>
+<style scoped>
+.select-tag {
+ margin-right: 3px;
+}
+</style>
--
Gitblit v1.8.0