From 23fdfa68682eef52fee5a8d257c002cdd375a563 Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期四, 02 一月 2025 13:46:45 +0800
Subject: [PATCH] 转办：候选用户、候选角色实现
---
src/views/flowable/task/myProcess/send/index.vue | 161 +++++++++--
src/components/flow/Dept/index.vue | 4
src/components/flow/Role/MyRole.vue | 207 ++++++++++++++
src/components/flow/Dept/MyDept.vue | 105 +++++++
src/components/flow/User/MultUser.vue | 259 ++++++++++++++++++
src/components/flow/User/SingleUser.vue | 49 ++
6 files changed, 744 insertions(+), 41 deletions(-)
diff --git a/src/components/flow/Dept/MyDept.vue b/src/components/flow/Dept/MyDept.vue
new file mode 100644
index 0000000..ea0b709
--- /dev/null
+++ b/src/components/flow/Dept/MyDept.vue
@@ -0,0 +1,105 @@
+<template>
+ <div>
+ <el-dialog
+ :title="`閫夋嫨鍊欓�夐儴闂╜"
+ :visible.sync="show"
+ width="65%"
+ :destroy-on-close="true"
+ :close-on-click-modal="false"
+ :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"
+ >
+ </el-tree>
+ <span slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="submit">纭� 瀹�</el-button>
+ </span>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import {flowableDeptTreeSelect} from "@/api/system/user";
+
+export default {
+ name: "MyDept",
+ props: {
+ show: {
+ required: true,
+ type: Boolean
+ },
+ checkeds: {
+ required: true
+ }
+ },
+ watch: {
+ checkeds: {
+ handler(newV) {
+ if (newV && newV.length > 0) {
+ this.checkList = newV
+ this.$nextTick(() => {
+ if (this.$refs.tree) {
+ this.$refs.tree.setCheckedKeys(newV.map(item => item.id));
+ }
+ });
+ } else {
+ this.checkList = []
+ }
+ },
+ deep: true
+ },
+ },
+ data() {
+ return {
+ deptTree: [],
+ checkList: [],
+ }
+ },
+ created() {
+ flowableDeptTreeSelect().then(res => {
+ this.deptTree = res.data
+ })
+ },
+ methods: {
+ setCheckList(newV) {
+ if (newV && newV.length > 0) {
+ this.checkList = newV
+ this.$nextTick(() => {
+ if (this.$refs.tree) {
+ this.$refs.tree.setCheckedKeys(newV.map(item => item.id));
+ }
+ });
+ } else {
+ this.checkList = []
+ }
+ },
+ handleCheckChange(data, checked, indeterminate) {
+ if (checked) {
+ if (this.checkList.indexOf(data) === -1) {
+ this.checkList.push(data)
+ }
+ } else {
+ this.checkList = this.checkList.filter(item => item !== data)
+ }
+ console.log(data, checked, indeterminate);
+ },
+ close() {
+ this.$emit("close")
+ },
+ submit() {
+ this.$emit("submit", this.checkList)
+ }
+ }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/components/flow/Dept/index.vue b/src/components/flow/Dept/index.vue
index b119eef..7081767 100644
--- a/src/components/flow/Dept/index.vue
+++ b/src/components/flow/Dept/index.vue
@@ -74,7 +74,9 @@
},
handleCheckChange(data, checked, indeterminate) {
if (checked) {
- this.checkList.push(data)
+ if (this.checkList.indexOf(data) === -1) {
+ this.checkList.push(data)
+ }
} else {
this.checkList = this.checkList.filter(item => item !== data)
}
diff --git a/src/components/flow/Role/MyRole.vue b/src/components/flow/Role/MyRole.vue
new file mode 100644
index 0000000..f2027a0
--- /dev/null
+++ b/src/components/flow/Role/MyRole.vue
@@ -0,0 +1,207 @@
+<template>
+ <div>
+ <el-dialog
+ :title="`閫夋嫨鍊欓�夎鑹瞏"
+ :visible.sync="show"
+ width="65%"
+ :destroy-on-close="true"
+ :close-on-click-modal="false"
+ :modal="false"
+ :before-close="close">
+ <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
+ <el-form-item label="瑙掕壊鍚嶇О" prop="roleName">
+ <el-input
+ v-model="queryParams.roleName"
+ placeholder="璇疯緭鍏ヨ鑹插悕绉�"
+ clearable
+ style="width: 240px"
+ @keyup.enter.native="handleQuery"
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+
+ <el-table ref="dataTable" v-loading="loading" :data="roleList" @selection-change="handleMultipleRoleSelect">
+ <el-table-column type="selection" width="50" align="center" />
+ <el-table-column label="瑙掕壊缂栧彿" prop="roleId" width="120" />
+ <el-table-column label="瑙掕壊鍚嶇О" prop="roleName" :show-overflow-tooltip="true" width="150" />
+ <el-table-column label="鏉冮檺瀛楃" prop="roleKey" :show-overflow-tooltip="true" width="150" />
+ <el-table-column label="鏄剧ず椤哄簭" prop="roleSort" width="100" />
+ <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="180">
+ <template slot-scope="scope">
+ <span>{{ parseTime(scope.row.createTime) }}</span>
+ </template>
+ </el-table-column>
+ </el-table>
+
+ <pagination
+ v-show="total>0"
+ :total="total"
+ :page-sizes="[5,10]"
+ layout="prev, pager, next"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
+ />
+
+ <span slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="submit">纭� 瀹�</el-button>
+ </span>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import { listRole} from "@/api/system/role";
+import {StrUtil} from "@/utils/StrUtil";
+
+export default {
+ name: "MyRole",
+ dicts: ['sys_normal_disable'],
+ // 鎺ュ彈鐖剁粍浠剁殑鍊�
+ props: {
+ show: {
+ type: Boolean,
+ required: true,
+ default: true
+ },
+ // 鍥炴樉鏁版嵁浼犲��
+ selectValues: {
+ type: Array,
+ default: [],
+ required: false
+ }
+ },
+ data() {
+ return {
+ // 閬僵灞�
+ loading: true,
+ // 閫変腑鏁扮粍
+ ids: [],
+ // 闈炲崟涓鐢�
+ single: true,
+ // 闈炲涓鐢�
+ multiple: true,
+ // 鏄剧ず鎼滅储鏉′欢
+ showSearch: true,
+ // 鎬绘潯鏁�
+ total: 0,
+ // 瑙掕壊琛ㄦ牸鏁版嵁
+ roleList: [],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 5,
+ roleName: undefined,
+ roleKey: undefined,
+ status: undefined
+ },
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ radioSelected: 0, // 鍗曢�夋浼犲��
+ selectRoleList: [] // 鍥炴樉鏁版嵁浼犲��
+ };
+ },
+ watch: {
+ selectValues: {
+ deep: true,
+ handler(newVal) {
+ if (newVal && newVal.length > 0) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ this.selectRoleList = []
+ newVal.forEach(item => {
+ this.roleList.forEach(role => {
+ if (item.roleId === role.roleId) {
+ this.selectRoleList.push(role)
+ this.$refs.dataTable.toggleRowSelection(role)
+ }
+ })
+ });
+ })
+ } else {
+ this.selectRoleList = []
+ }
+ }
+ },
+ roleList: {
+ deep: true,
+ handler(newVal) {
+ if (newVal && newVal.length > 0) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ this.selectValues.forEach(item => {
+ newVal.forEach(role => {
+ if (item.roleId === role.roleId) {
+ this.$refs.dataTable.toggleRowSelection(role)
+ }
+ })
+ });
+ })
+ }
+ }
+ }
+ },
+ mounted() {
+ this.getList();
+ },
+ methods: {
+ setChecked(val) {
+ if (val && val.length > 0) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ this.selectRoleList = val
+ val.forEach(check => {
+ this.roleList.forEach(item => {
+ if (check.roleId === item.roleId) {
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
+ })
+ });
+ } else {
+ this.selectRoleList = []
+ }
+ },
+ close() {
+ this.$emit("close")
+ },
+ submit() {
+ this.$emit("submit", this.selectRoleList)
+ },
+ /** 鏌ヨ瑙掕壊鍒楄〃 */
+ getList() {
+ this.loading = true;
+ listRole(this.queryParams).then(response => {
+ this.roleList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ }
+ );
+ },
+ // 澶氶�夋閫変腑鏁版嵁
+ handleMultipleRoleSelect(selection) {
+ this.selectRoleList = selection
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.handleQuery();
+ },
+ }
+};
+</script>
+<style scoped>
+
+</style>
diff --git a/src/components/flow/User/MultUser.vue b/src/components/flow/User/MultUser.vue
new file mode 100644
index 0000000..c4e18b7
--- /dev/null
+++ b/src/components/flow/User/MultUser.vue
@@ -0,0 +1,259 @@
+<template>
+ <div>
+ <el-dialog
+ :title="`閫夋嫨杞姙鎺ユ敹浜哄憳`"
+ :visible.sync="show"
+ width="65%"
+ :destroy-on-close="true"
+ :close-on-click-modal="false"
+ :modal="false"
+ :before-close="close">
+ <el-row :gutter="20">
+ <!--閮ㄩ棬鏁版嵁-->
+ <el-col :span="6" :xs="24">
+ <div class="head-container">
+ <el-input
+ v-model="deptName"
+ placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�"
+ clearable
+ size="small"
+ prefix-icon="el-icon-search"
+ style="margin-bottom: 20px"
+ />
+ </div>
+ <div class="head-container">
+ <el-tree
+ :data="deptOptions"
+ :props="defaultProps"
+ :expand-on-click-node="false"
+ :filter-node-method="filterNode"
+ ref="tree"
+ node-key="id"
+ default-expand-all
+ highlight-current
+ @node-click="handleNodeClick"
+ />
+ </div>
+ </el-col>
+ <!--鐢ㄦ埛鏁版嵁-->
+ <el-col :span="18" :xs="24">
+ <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+ <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
+ <el-input
+ v-model="queryParams.userName"
+ placeholder="璇疯緭鍏ョ敤鎴峰悕绉�"
+ clearable
+ style="width: 150px"
+ @keyup.enter.native="handleQuery"
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ <el-table ref="dataTable" v-loading="loading" :row-key="getRowKey" :data="userList" @selection-change="handleUserSelect">
+ <el-table-column type="selection" align="center" />
+ <el-table-column label="鐢ㄦ埛缂栧彿" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
+ <el-table-column label="鐧诲綍璐﹀彿" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
+ <el-table-column label="鐢ㄦ埛濮撳悕" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
+ <el-table-column label="閮ㄩ棬" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
+ <el-table-column label="鎵嬫満鍙风爜" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
+ </el-table>
+ <pagination
+ v-show="total>0"
+ :total="total"
+ :page-sizes="[5,10]"
+ layout="prev, pager, next"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getList"
+ />
+ </el-col>
+ </el-row>
+ <span slot="footer" class="dialog-footer">
+ <el-button type="danger" @click="getSelected">纭</el-button>
+ </span>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+import { listUser, deptTreeSelect } from "@/api/system/user";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import {StrUtil} from '@/utils/StrUtil'
+
+export default {
+ name: "SingleUser",
+ dicts: ['sys_normal_disable', 'sys_user_sex'],
+ components: { Treeselect },
+ // 鎺ュ彈鐖剁粍浠剁殑鍊�
+ props: {
+ show: {
+ required: true,
+ type: Boolean
+ },
+ // 鍥炴樉鏁版嵁浼犲��
+ selectUserList: {
+ type: Number,
+ default: null,
+ required: false
+ },
+
+ },
+ data() {
+ return {
+ innerSelected: [],
+ // 閬僵灞�
+ loading: true,
+ // 閫変腑鏁扮粍
+ ids: [],
+ // 鏄剧ず鎼滅储鏉′欢
+ showSearch: true,
+ // 鎬绘潯鏁�
+ total: 0,
+ // 鐢ㄦ埛琛ㄦ牸鏁版嵁
+ userList: [],
+ // 寮瑰嚭灞傛爣棰�
+ title: "",
+ // 閮ㄩ棬鏍戦�夐」
+ deptOptions: undefined,
+ // 鏄惁鏄剧ず寮瑰嚭灞�
+ open: false,
+ // 閮ㄩ棬鍚嶇О
+ deptName: undefined,
+ // 琛ㄥ崟鍙傛暟
+ form: {},
+ defaultProps: {
+ children: "children",
+ label: "label"
+ },
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 5,
+ userName: undefined,
+ phonenumber: undefined,
+ status: undefined,
+ deptId: undefined
+ },
+ // 鍒椾俊鎭�
+ columns: [
+ { key: 0, label: `鐢ㄦ埛缂栧彿`, visible: true },
+ { key: 1, label: `鐢ㄦ埛鍚嶇О`, visible: true },
+ { key: 2, label: `鐢ㄦ埛鏄电О`, visible: true },
+ { key: 3, label: `閮ㄩ棬`, visible: true },
+ { key: 4, label: `鎵嬫満鍙风爜`, visible: true },
+ { key: 5, label: `鐘舵�乣, visible: true },
+ { key: 6, label: `鍒涘缓鏃堕棿`, visible: true }
+ ],
+ radioSelected: 0, // 鍗曢�夋浼犲��
+ };
+ },
+ watch: {
+ // 鏍规嵁鍚嶇О绛涢�夐儴闂ㄦ爲
+ deptName(val) {
+ this.$refs.tree.filter(val);
+ },
+ selectUserList: {
+ deep: true,
+ handler(newVal) {
+ console.log(this.selectValues, "浼犲叆鐨勫�兼槸")
+ this.setChecked(newVal)
+ },
+ },
+ userList: {
+ deep: true,
+ handler(newVal) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ this.innerSelected.forEach(check => {
+ newVal.forEach(item => {
+ if (check.userId === item.userId) {
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
+ })
+ });
+ },
+ },
+ },
+ mounted() {
+ this.getList();
+ this.getDeptTree();
+ },
+ methods: {
+ setChecked(val) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ this.innerSelected = val
+ val.forEach(check => {
+ this.userList.forEach(item => {
+ if (check.userId === item.userId) {
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
+ })
+ });
+ },
+ /** 鏌ヨ鐢ㄦ埛鍒楄〃 */
+ getList() {
+ this.loading = true;
+ listUser(this.queryParams).then(response => {
+ this.userList = response.rows;
+ this.total = response.total;
+ this.loading = false;
+ }
+ );
+ },
+ /** 鏌ヨ閮ㄩ棬涓嬫媺鏍戠粨鏋� */
+ getDeptTree() {
+ deptTreeSelect().then(response => {
+ this.deptOptions = response.data;
+ });
+ },
+ // 淇濆瓨閫変腑鐨勬暟鎹甶d,row-key灏辨槸瑕佹寚瀹氫竴涓猭ey鏍囪瘑杩欎竴琛岀殑鏁版嵁
+ getRowKey (row) {
+ return row.id
+ },
+ // 绛涢�夎妭鐐�
+ filterNode(value, data) {
+ if (!value) return true;
+ return data.label.indexOf(value) !== -1;
+ },
+ // 鑺傜偣鍗曞嚮浜嬩欢
+ handleNodeClick(data) {
+ this.queryParams.deptId = data.id;
+ this.handleQuery();
+ },
+ // 浼犻�掗�変腑鍊�
+ handleUserSelect(selectionList) {
+ console.log("閫変腑鍊�", selectionList)
+ this.innerSelected = selectionList
+ },
+ getSelected() {
+ this.$emit('submit', this.innerSelected);
+ },
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ handleQuery() {
+ this.queryParams.pageNum = 1;
+ this.getList();
+ },
+ /** 閲嶇疆鎸夐挳鎿嶄綔 */
+ resetQuery() {
+ this.dateRange = [];
+ this.resetForm("queryForm");
+ this.queryParams.deptId = undefined;
+ this.$refs.tree.setCurrentKey(null);
+ this.handleQuery();
+ },
+ close() {
+ this.$emit("close")
+ },
+ }
+};
+</script>
+<style scoped>
+
+</style>
diff --git a/src/components/flow/User/SingleUser.vue b/src/components/flow/User/SingleUser.vue
index e33de92..e8cf64d 100644
--- a/src/components/flow/User/SingleUser.vue
+++ b/src/components/flow/User/SingleUser.vue
@@ -96,7 +96,6 @@
},
// 鍥炴樉鏁版嵁浼犲��
selectUser: {
- type: Number,
default: null,
required: false
},
@@ -160,18 +159,40 @@
selectUser: {
deep: true,
handler(newVal) {
- console.log(this.selectValues, "浼犲叆鐨勫�兼槸")
- this.$nextTick(() => {
- this.$refs.dataTable.clearSelection();
+ if (newVal) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
this.userList.forEach(item => {
if (newVal === item.userId) {
this.innerSelected = item
this.$refs.dataTable.toggleRowSelection(item)
}
})
- });
+ });
+ } else {
+ this.innerSelected = null;
+ }
},
- // immediate: true
+ },
+ userLst: {
+ deep: true,
+ handler(newVal) {
+ if (newVal) {
+ this.$nextTick(() => {
+ this.$refs.dataTable.clearSelection();
+ if (! this.innerSelected) {
+ newVal.forEach(item => {
+ if (this.innerSelected.userId === item.userId) {
+ this.innerSelected = item
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
+ }
+ });
+ } else {
+ this.innerSelected = null;
+ }
+ },
},
},
mounted() {
@@ -180,15 +201,19 @@
},
methods: {
setChecked(val) {
+ if (val) {
this.$nextTick(() => {
this.$refs.dataTable.clearSelection();
- this.userList.forEach(item => {
- if (val === item.userId) {
- this.innerSelected = item
- this.$refs.dataTable.toggleRowSelection(item)
- }
- })
+ this.userList.forEach(item => {
+ if (val.userId === item.userId) {
+ this.innerSelected = item
+ this.$refs.dataTable.toggleRowSelection(item)
+ }
+ })
});
+ } else {
+ this.innerSelected = null
+ }
},
/** 鏌ヨ鐢ㄦ埛鍒楄〃 */
getList() {
diff --git a/src/views/flowable/task/myProcess/send/index.vue b/src/views/flowable/task/myProcess/send/index.vue
index e55ed89..a6dc3b9 100644
--- a/src/views/flowable/task/myProcess/send/index.vue
+++ b/src/views/flowable/task/myProcess/send/index.vue
@@ -84,23 +84,45 @@
<el-form-item label="鐢ㄦ埛绫诲瀷" prop="peopleType">
<el-select v-model="delegationForm.peopleType" @change="peopleTypeChange" placeholder="璇烽�夋嫨鐢ㄦ埛绫诲瀷">
<el-option label="鎸囧畾浜哄憳" value="FIX_USER"></el-option>
- <el-option label="鍊欓�夌敤鎴�" disabled value="USER"></el-option>
+ <el-option label="鍊欓�夌敤鎴�" value="USER"></el-option>
<el-option label="鍊欓�夐儴闂�" value="DEPT"></el-option>
- <el-option label="鍊欓�夎鑹�" disabled value="ROLE"></el-option>
+ <el-option label="鍊欓�夎鑹�" value="ROLE"></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="delegationForm.peopleType === 'DEPT'" label="鍊欓�夐儴闂�" prop="targetId">
- <Dept ref="dept" :checkeds="delegationDeptSelect" :show="deptShow" @close="closeDept" @submit="getDeptSelect"/>
+ <MyDept ref="dept" :checkeds="delegationDeptSelect" :show="deptShow" @close="closeDept" @submit="getDeptSelect"/>
<div style="display: flex;align-items: center">
- <div>{{deptNames}}</div>
- <el-button style="margin-left: 8px" type="text" @click="editDept">缂栬緫</el-button>
+ <div>
+ <el-tag v-for="dept in delegationDeptSelect" :key="dept.id + 'zxc'" type="info" closable @close="removeDept(dept)">{{dept.label}}</el-tag>
+ </div>
+ <el-button style="margin-left: 8px" type="text" @click="editDept">閫夋嫨</el-button>
</div>
</el-form-item>
<el-form-item v-if="delegationForm.peopleType === 'FIX_USER'" label="鎸囧畾鐢ㄦ埛" prop="targetId">
- <single-user ref="singleUser" :select-user="delegationForm.targetId" :show="singleUserShow" @close="closeUser" @submit="getSingleUserSelect"/>
+ <single-user ref="singleUser" :select-user="delegationForm.targetId" :show="singleUserShow" @close="closeSingleUser" @submit="getSingleUserSelect"/>
<div style="display: flex;align-items: center">
- <div>{{delegationUserSelect.map(item => item.nickName).join(',')}}</div>
- <el-button style="margin-left: 8px" type="text" @click="editUser">缂栬緫</el-button>
+ <div>
+ <el-tag v-for="user in delegationUserSelect" :key="user.userId + 'abc'" type="info" closable @close="removeSingleUser(user)">{{user.nickName}}</el-tag>
+ </div>
+ <el-button style="margin-left: 8px" type="text" @click="editSingleUser">閫夋嫨</el-button>
+ </div>
+ </el-form-item>
+ <el-form-item v-if="delegationForm.peopleType === 'USER'" label="鍊欓�夌敤鎴�" prop="targetId">
+ <mult-user ref="multUser" :select-user="delegationUserSelect" :show="multUserShow" @close="closeMultUser" @submit="getMultUserSelect"/>
+ <div style="display: flex;align-items: center">
+ <div>
+ <el-tag v-for="user in delegationUserSelect" :key="user.userId + 'qwe'" type="info" closable @close="removeMultUser(user)">{{user.nickName}}</el-tag>
+ </div>
+ <el-button style="margin-left: 8px" type="text" @click="editMultUser">閫夋嫨</el-button>
+ </div>
+ </el-form-item>
+ <el-form-item v-if="delegationForm.peopleType === 'ROLE'" label="鍊欓�夎鑹�" prop="targetId">
+ <my-role ref="role" :select-values="delegationRoleSelect" :show="roleShow" @close="closeRole" @submit="getRoleSelect"/>
+ <div style="display: flex;align-items: center">
+ <div>
+ <el-tag v-for="role in delegationRoleSelect" :key="role.roleId + 'rty'" type="info" closable @close="removeRole(role)">{{role.roleName}}</el-tag>
+ </div>
+ <el-button style="margin-left: 8px" type="text" @click="editRole">閫夋嫨</el-button>
</div>
</el-form-item>
</el-form>
@@ -116,13 +138,13 @@
<script>
import {definitionStart, flowXmlAndNode} from "@/api/flowable/definition";
import BpmnViewer from '@/components/Process/viewer';
-import Dept from '@/components/flow/Dept'
+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'
import {completeSubmitFormTask} from "@/api/flowable/process";
import { flowTaskForm } from "@/api/flowable/todo";
import {getNextFlowNodeByStart} from "@/api/flowable/todo";
-import FlowUser from '@/components/flow/User'
-import FlowRole from '@/components/flow/Role'
import {rejectTask} from "@/api/flowable/process";
import {taskDelegation} from "@/api/projectProcess/projectProcess";
@@ -130,18 +152,20 @@
name: "Record",
components: {
BpmnViewer,
- FlowUser,
- FlowRole,
- Dept,
+ MyRole,
+ MyDept,
SingleUser,
+ MultUser,
},
props: {},
data() {
return {
+ roleShow: false, // 瑙掕壊缁勬樉绀�
+ delegationRoleSelect: [], // 閫変腑瑙掕壊
+ multUserShow: false, // 鐢ㄦ埛缁勬樉绀�
singleUserShow: false, // 鎸囧畾鐢ㄦ埛鏄剧ず
delegationUserSelect: [], // 閫変腑鐨勭敤鎴�
- deptShow: false, // 閮ㄩ棬鏄剧ず
- deptNames: '', // 閫変腑鐨勯儴闂ㄥ悕绉�
+ deptShow: false, // 閮ㄩ棬缁勬樉绀�
delegationDeptSelect: [], // 閫変腑閮ㄩ棬
delegationFormRules: {
peopleType: [
@@ -204,10 +228,45 @@
this.getFlowFormData(this.taskId);
},
methods: {
+ removeDept(dept) {
+ let index = this.delegationDeptSelect.indexOf(dept);
+ if (index !== -1) {
+ this.delegationDeptSelect.splice(index, 1);
+ }
+ this.delegationForm.targetId = this.delegationDeptSelect.map(item => item.id).join(",")
+ },
+ removeRole(role) {
+ let index = this.delegationRoleSelect.indexOf(role);
+ if (index !== -1) {
+ this.delegationRoleSelect.splice(index, 1);
+ }
+ this.delegationForm.targetId = this.delegationRoleSelect.map(item => item.roleId).join(",")
+ },
+ removeMultUser(user) {
+ let index = this.delegationUserSelect.indexOf(user);
+ if (index !== -1) {
+ this.delegationUserSelect.splice(index, 1);
+ }
+ this.delegationForm.targetId = this.delegationUserSelect.map(item => item.userId).join(",")
+ },
+ removeSingleUser(user) {
+ // 鍥犱负鍙兘閫変竴涓敤鎴凤紝鎵�浠ュ垹浜嗗氨娌′簡
+ this.delegationUserSelect = []
+ this.delegationForm.targetId = ''
+ },
+ getTips() {
+ if (this.delegationForm.peopleType === 'USER' || this.delegationForm.peopleType === 'FIX_USER') {
+ return this.delegationUserSelect.map(item => item.nickName).join("銆�")
+ } else if (this.delegationForm.peopleType === 'DEPT') {
+ return this.delegationDeptSelect.map(item => item.label).join("銆�")
+ } else if (this.delegationForm.peopleType === 'ROLE') {
+ return this.delegationRoleSelect.map(item => item.roleName).join("銆�")
+ }
+ },
delegation() {
this.$refs['delegationForm'].validate((valid) => {
if (valid) {
- this.$confirm(`纭畾瑕佸皢姝や换鍔′氦鐢便��${this.deptNames}銆戝鐞嗗悧?`, '鎻愮ず', {
+ this.$confirm(`纭畾瑕佸皢姝や换鍔′氦鐢便��${this.getTips()}銆戝鐞嗗悧?`, '鎻愮ず', {
confirmButtonText: '纭畾',
cancelButtonText: '鍙栨秷',
type: 'warning'
@@ -236,6 +295,10 @@
this.deptShow = true
} else if (val === 'FIX_USER') {
this.singleUserShow = true
+ } else if (val === 'USER') {
+ this.multUserShow = true
+ } else if (val === 'ROLE') {
+ this.roleShow = true
}
},
editDept() {
@@ -244,20 +307,56 @@
})
this.deptShow = true
},
- editUser() {
- this.$nextTick(() => {
- this.$refs.singleUser.setChecked(this.delegationForm.targetId)
- })
+ editSingleUser() {
+ if (this.delegationUserSelect && this.delegationUserSelect.length > 0) {
+ this.$nextTick(() => {
+ this.$refs.singleUser.setChecked(this.delegationUserSelect[0])
+ })
+ }
this.singleUserShow = true
},
- getDeptSelect(list, names) {
- console.log(list, names)
- if (list) {
- this.delegationForm.targetId = list
- this.delegationDeptSelect = list.split(",")
- this.deptNames = names
+ editRole() {
+ if (this.delegationRoleSelect && this.delegationRoleSelect.length > 0) {
+ this.$nextTick(() => {
+ this.$refs.role.setChecked(this.delegationRoleSelect)
+ })
+ }
+ this.roleShow = true
+ },
+ editMultUser() {
+ if (this.delegationForm.targetId) {
+ this.$nextTick(() => {
+ this.$refs.multUser.setChecked(this.delegationUserSelect)
+ })
+ }
+ this.multUserShow = true
+ },
+ getDeptSelect(deptList) {
+ if (deptList && deptList.length > 0) {
+ this.delegationForm.targetId = deptList.map(item => item.id).join(",")
+ this.delegationDeptSelect = deptList
}
this.deptShow = false
+ },
+ getMultUserSelect(userList) {
+ if (userList && userList.length > 0) {
+ this.delegationForm.targetId = userList.map(item => item.userId).join(",")
+ this.delegationUserSelect = userList
+ } else {
+ this.delegationForm.targetId = ''
+ this.delegationUserSelect = []
+ }
+ this.multUserShow = false
+ },
+ getRoleSelect(roleList) {
+ if (roleList && roleList.length > 0) {
+ this.delegationForm.targetId = roleList.map(item => item.roleId).join(",")
+ this.delegationRoleSelect = roleList
+ } else {
+ this.delegationForm.targetId = ''
+ this.delegationRoleSelect = []
+ }
+ this.roleShow = false
},
getSingleUserSelect(user) {
if (user) {
@@ -272,9 +371,15 @@
closeDept() {
this.deptShow = false
},
- closeUser() {
+ closeSingleUser() {
this.singleUserShow = false
},
+ closeRole() {
+ this.roleShow = false
+ },
+ closeMultUser() {
+ this.multUserShow = false
+ },
openDelegation(taskName) {
this.delegationForm.taskName = taskName
this.delegationForm.taskId = this.taskId
--
Gitblit v1.8.0