clay
/
workflow-engine-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

dengjie commit : 选择系统角色 #7

Merged
odjbin merged 1 commits from DJ into master 2023-01-13 13:23:43 +00:00
Conversation 0 Commits 1 Files Changed 5 +147 -205
5 changed files with 147 additions and 205 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 594a1feeaf - Show all commits

72
flowable-engine-web/src/components/common/DeptPicker.vue
View File

@ -10,10 +10,10 @@
<!-- 部门 --> <!-- 部门 -->
<el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/> <el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/>
<el-scrollbar style="height:350px"> <el-scrollbar style="height:350px">
<el-tree :data="deptList" ref="tree" empty-text="" node-key="value" default-expand-all <el-tree :data="deptList" ref="tree" :props="deptProps" empty-text="" node-key="deptId" default-expand-all
:show-checkbox="showCheckbox" check-strictly highlight-current :show-checkbox="showCheckbox" check-strictly highlight-current
@check-change="handleCheckChange" @node-click="(node,check)=>handle(node,check)" :filter-node-method="filterNode"> @check-change="handleCheckChange" @node-click="(node,check)=>handle(node,check)" :filter-node-method="filterNode">
<div class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%"> <div class="custom-tree-node" slot-scope="{ node }" style="width: 100%">
<i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }} <i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }}
</div> </div>
</el-tree> </el-tree>
@ -29,7 +29,7 @@
<el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/> <el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
<div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-item"> <div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-item">
<i class="el-icon-folder-opened"></i> <i class="el-icon-folder-opened"></i>
<span>{{ selectItem.label }}</span> <span>{{ selectItem.deptName }}</span>
<i class="el-icon-close" @click="noSelected(selectItem)" v-if="showCheckbox===false"></i> <i class="el-icon-close" @click="noSelected(selectItem)" v-if="showCheckbox===false"></i>
</div> </div>
</div> </div>
@ -67,43 +67,12 @@ export default {
title: "请选择", title: "请选择",
selectList: [], selectList: [],
filterText: "", filterText: "",
deptList: [ deptList: [],
{ deptProps:{
value: 1, value:'deptId',
label: '一级 1', label: 'deptName',
children: [{ children: 'children'
value: 4, }
label: '二级 1-1',
children: [{
value: 9,
label: '31'
}, {
value: 10,
label: '三级 1-1-2'
}]
}]
}, {
value: 2,
label: '一级 2',
children: [{
value: 5,
label: '二级 2-1'
}, {
value: 6,
label: '二级 2-2'
}]
}, {
value: 3,
label: '一级 3',
children: [{
value: 7,
label: '二级 3-1'
}, {
value: 8,
label: '二级 3-2'
}]
}
]
}; };
}, },
watch: { watch: {
@ -128,16 +97,19 @@ export default {
//获取部门信息 //获取部门信息
getDepartmentTree() { getDepartmentTree() {
getDepartmentTree().then(res => { getDepartmentTree().then(res => {
console.log("获取部门信息", res); const jsona = JSON.stringify(res.data) // 把接口返回的res.data数据转成字符串
this.deptList = res.data; const jsonb = jsona.replace(/"value"/g, '"deptId"') // 修改成你要的字段
const jsonc = jsonb.replace(/"label"/g, '"deptName"')
this.deptList=JSON.parse(jsonc)
console.log("获取部门信息===========", this.deptList);
}); });
}, },
//通过关键字过滤树节点 //通过关键字过滤树节点
filterNode(value, data) { filterNode(value, data) {
if (!value) return true; if (!value) return true;
return data.label.indexOf(value) !== -1; return data.deptName.indexOf(value) !== -1;
}, },
//用于部门选择 //用于弹开部门选择
showDeptPicker() { showDeptPicker() {
this.visible = true; this.visible = true;
}, },
@ -153,7 +125,7 @@ export default {
if (this.multiple) { if (this.multiple) {
//不添加重复的数据到右边 //不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === data.value) { if (this.selectList[i].deptId === data.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -167,7 +139,7 @@ export default {
} else {// 左侧有选择框 + 单选 } else {// 左侧有选择框 + 单选
//不添加重复的数据到右边 //不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === data.value) { if (this.selectList[i].deptId === data.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -186,7 +158,7 @@ export default {
//左侧没有选择框时,点击tree-item //左侧没有选择框时,点击tree-item
/** /**
* 可以点击树节点label,进行选择 * 可以点击树节点deptName,进行选择
* @param node 选择的每个节点item * @param node 选择的每个节点item
* @param check checked(checkbox选择框)是否选中 * @param check checked(checkbox选择框)是否选中
*/ */
@ -194,7 +166,7 @@ export default {
if(this.multiple){ if(this.multiple){
//不添加重复的数据到右边 //不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === node.value) { if (this.selectList[i].deptId === node.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -209,7 +181,7 @@ export default {
//左侧无选择框时,右侧显示× //左侧无选择框时,右侧显示×
noSelected(selectItem) { noSelected(selectItem) {
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === selectItem.value) { if (this.selectList[i].deptId === selectItem.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
this.$refs.tree.setCheckedKeys(i); this.$refs.tree.setCheckedKeys(i);
break; break;
@ -237,7 +209,7 @@ export default {
}, },
//确定按钮 //确定按钮
selectConfirm() { selectConfirm() {
// this.$emit("input", this.selectList) this.$emit("input", this.selectList)
// this.$emit("dengjie") // this.$emit("dengjie")
} }
} }

90
flowable-engine-web/src/components/common/RolePicker.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<w-dialog :border="false" closeFree width="600px" @ok="selectConfirm" :title="title" v-model="visible"> <w-dialog :border="false" closeFree width="600px" @ok="selectConfirm" :title="title" v-model="visible">
<div class="picker"> <div class="picker">
<div class="candidate" v-loading="loading"> <div class="candidate" v-loading="loading">
<div class="role-header"> <div class="role-header">
@ -12,7 +12,7 @@
@click="selectChange(roleItem)"> @click="selectChange(roleItem)">
<el-checkbox v-model="roleItem.selected" v-if="showCheckbox" @change="selectChange(roleItem)"></el-checkbox> <el-checkbox v-model="roleItem.selected" v-if="showCheckbox" @change="selectChange(roleItem)"></el-checkbox>
<i class="el-icon-user-solid" style="margin-left: 5px"></i> <i class="el-icon-user-solid" style="margin-left: 5px"></i>
<span>{{ roleItem.label }}</span> <span>{{ roleItem.roleName }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -24,10 +24,10 @@
</div> </div>
<div class="org-items"> <div class="org-items">
<el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/> <el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
<div v-for="(org, index) in selectList" :key="index" class="org-role-item"> <div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-role-item">
<i class="el-icon-user-solid"></i> <i class="el-icon-user-solid"></i>
<span>{{ org.label }}</span> <span>{{ selectItem.roleName }}</span>
<i class="el-icon-close" @click="noSelected(org)"></i> <i class="el-icon-close" @click="noSelected(selectItem)"></i>
</div> </div>
</div> </div>
</div> </div>
@ -46,6 +46,24 @@ export default {
return []; return [];
}, },
type: Array type: Array
},
multiple: { //是否多选
default: true,
type: Boolean
},
showCheckbox: { //是否显示左侧选择框
default: true,
type: Boolean
}
},
computed: {
_value: {
get() {
return this.value
},
set(val) {
this.$emit("input", val)
}
} }
}, },
data() { data() {
@ -53,34 +71,7 @@ export default {
visible: false, visible: false,
loading: false, loading: false,
title: "请选择", title: "请选择",
multiple: true,//是否多选 roleList: [],
showCheckbox: true,//是否显示左侧选择框
roleList: [
// {
// value: 1,
// label: "超级管理员"
// },
// {
// value: 2,
// label: "普通角色"
// },
// {
// value: 100,
// label: "前端开发人员"
// },
// {
// value: 101,
// label: "图片文件管理员"
// },
// {
// value: 102,
// label: "附件管理员"
// },
// {
// value: 103,
// label: "权限测试角色"
// }
],
selectList: [] selectList: []
}; };
}, },
@ -91,9 +82,16 @@ export default {
//获取角色信息 //获取角色信息
getRole() { getRole() {
getRole().then(res => { getRole().then(res => {
this.roleList = res.data; console.log('系统角色',res.data);
this.roleList= res.data.map(function (val){
return {roleId:val.value,roleName:val.label}
})
}); });
}, },
//用于弹出角色选择器
showRolePicker() {
this.visible = true;
},
//选中角色 //选中角色
selectChange(roleItem) { selectChange(roleItem) {
// 左侧有选择框 // 左侧有选择框
@ -101,7 +99,7 @@ export default {
// 左侧有选择框 + 多选 // 左侧有选择框 + 多选
if (this.multiple) { if (this.multiple) {
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === roleItem.value) { if (this.selectList[i].roleId === roleItem.roleId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -112,7 +110,7 @@ export default {
} else {// 左侧有选择框 + 单选 } else {// 左侧有选择框 + 单选
//用于左侧选择框选中取消,引起右侧数据变化 //用于左侧选择框选中取消,引起右侧数据变化
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === roleItem.value) { if (this.selectList[i].roleId === roleItem.roleId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -122,7 +120,7 @@ export default {
} }
for (let i = 0; i < this.roleList.length; i++) { for (let i = 0; i < this.roleList.length; i++) {
for (let j = 0; j < this.selectList.length; j++) { for (let j = 0; j < this.selectList.length; j++) {
if (this.roleList[i].value !== this.selectList[j].value) { if (this.roleList[i].roleId !== this.selectList[j].roleId) {
this.roleList[i].selected = false; this.roleList[i].selected = false;
} }
} }
@ -132,7 +130,7 @@ export default {
// 左侧没有选择框 + 多选 // 左侧没有选择框 + 多选
if (this.multiple) { if (this.multiple) {
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === roleItem.value) { if (this.selectList[i].roleId === roleItem.roleId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -142,16 +140,17 @@ export default {
this.selectList = [roleItem]; this.selectList = [roleItem];
} }
} }
this._value = this.selectList
}, },
//右侧的× //右侧的×
noSelected(org) { noSelected(selectItem) {
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === org.value) { if (this.selectList[i].roleId === selectItem.roleId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
} }
org.selected = false; selectItem.selected = false;
}, },
//清空 //清空
clearSelected() { clearSelected() {
@ -170,14 +169,9 @@ export default {
}, },
//确定按钮 //确定按钮
selectConfirm() { selectConfirm() {
// this.$emit("ok", Object.assign([], this.select.map(v => { this.$emit("ok", this.selectList);
// v.avatar = undefined; this.visible = false;
// return v;
// })));
// this.visible = false;
// this.recover();
} }
} }
}; };
</script> </script>

77
flowable-engine-web/src/components/common/Test.vue
View File

@ -10,12 +10,12 @@
<!-- 部门 --> <!-- 部门 -->
<el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/> <el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/>
<el-scrollbar style="height:350px"> <el-scrollbar style="height:350px">
<el-tree :data="deptList" ref="tree" empty-text="" node-key="value" default-expand-all <el-tree :data="deptList" ref="tree" :props="deptProps" empty-text="" node-key="deptId" default-expand-all
:show-checkbox="showCheckbox" check-strictly highlight-current :show-checkbox="showCheckbox" check-strictly highlight-current
@check-change="handleCheckChange" @node-click="(node,check)=>handle(node,check)" :filter-node-method="filterNode"> @check-change="handleCheckChange" @node-click="(node,check)=>handle(node,check)" :filter-node-method="filterNode">
<div class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%"> <div class="custom-tree-node" slot-scope="{ node }" style="width: 100%">
<i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }} <i class="el-icon-folder-opened" style="margin-right: 5px"></i>{{ node.label }}
</div> </div>
</el-tree> </el-tree>
</el-scrollbar> </el-scrollbar>
</div> </div>
@ -29,7 +29,7 @@
<el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/> <el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
<div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-item"> <div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-item">
<i class="el-icon-folder-opened"></i> <i class="el-icon-folder-opened"></i>
<span>{{ selectItem.label }}</span> <span>{{ selectItem.deptName }}</span>
<i class="el-icon-close" @click="noSelected(selectItem)" v-if="showCheckbox===false"></i> <i class="el-icon-close" @click="noSelected(selectItem)" v-if="showCheckbox===false"></i>
</div> </div>
</div> </div>
@ -67,43 +67,12 @@ export default {
title: "请选择", title: "请选择",
selectList: [], selectList: [],
filterText: "", filterText: "",
deptList: [ deptList: [],
{ deptProps:{
value: 1, value:'deptId',
label: '一级 1', label: 'deptName',
children: [{ children: 'children'
value: 4, }
label: '二级 1-1',
children: [{
value: 9,
label: '31'
}, {
value: 10,
label: '三级 1-1-2'
}]
}]
}, {
value: 2,
label: '一级 2',
children: [{
value: 5,
label: '二级 2-1'
}, {
value: 6,
label: '二级 2-2'
}]
}, {
value: 3,
label: '一级 3',
children: [{
value: 7,
label: '二级 3-1'
}, {
value: 8,
label: '二级 3-2'
}]
}
]
}; };
}, },
watch: { watch: {
@ -128,14 +97,18 @@ export default {
//获取部门信息 //获取部门信息
getDepartmentTree() { getDepartmentTree() {
getDepartmentTree().then(res => { getDepartmentTree().then(res => {
console.log("获取部门信息", res); const jsona = JSON.stringify(res.data) // 把接口返回的res.data数据转成字符串
this.deptList = res.data; const jsonb = jsona.replace(/"value"/g, '"deptId"') // 修改成你要的字段
const jsonc = jsonb.replace(/"label"/g, '"deptName"')
const endjson = JSON.parse(jsonc)
this.deptList=endjson
console.log("获取部门信息===========", this.deptList);
}); });
}, },
//通过关键字过滤树节点 //通过关键字过滤树节点
filterNode(value, data) { filterNode(value, data) {
if (!value) return true; if (!value) return true;
return data.label.indexOf(value) !== -1; return data.deptName.indexOf(value) !== -1;
}, },
//用于部门选择 //用于部门选择
showDeptPicker() { showDeptPicker() {
@ -153,7 +126,7 @@ export default {
if (this.multiple) { if (this.multiple) {
//不添加重复的数据到右边 //不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === data.value) { if (this.selectList[i].deptId === data.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -167,7 +140,7 @@ export default {
} else {// 左侧有选择框 + 单选 } else {// 左侧有选择框 + 单选
//不添加重复的数据到右边 //不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === data.value) { if (this.selectList[i].deptId === data.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -186,7 +159,7 @@ export default {
//左侧没有选择框时,点击tree-item //左侧没有选择框时,点击tree-item
/** /**
* 可以点击树节点label,进行选择 * 可以点击树节点deptName,进行选择
* @param node 选择的每个节点item * @param node 选择的每个节点item
* @param check checked(checkbox选择框)是否选中 * @param check checked(checkbox选择框)是否选中
*/ */
@ -194,7 +167,7 @@ export default {
if(this.multiple){ if(this.multiple){
//不添加重复的数据到右边 //不添加重复的数据到右边
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === node.value) { if (this.selectList[i].deptId === node.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
break; break;
} }
@ -209,7 +182,7 @@ export default {
//左侧无选择框时,右侧显示× //左侧无选择框时,右侧显示×
noSelected(selectItem) { noSelected(selectItem) {
for (let i = 0; i < this.selectList.length; i++) { for (let i = 0; i < this.selectList.length; i++) {
if (this.selectList[i].value === selectItem.value) { if (this.selectList[i].deptId === selectItem.deptId) {
this.selectList.splice(i, 1); this.selectList.splice(i, 1);
this.$refs.tree.setCheckedKeys(i); this.$refs.tree.setCheckedKeys(i);
break; break;
@ -231,13 +204,13 @@ export default {
}).then(() => { }).then(() => {
this.handleCheckChange("1"); this.handleCheckChange("1");
if(!this.showCheckbox){ if(!this.showCheckbox){
this.selectList=[] this.selectList=[]
} }
}); });
}, },
//确定按钮 //确定按钮
selectConfirm() { selectConfirm() {
// this.$emit("input", this.selectList) this.$emit("input", this.selectList)
// this.$emit("dengjie") // this.$emit("dengjie")
} }
} }

8
flowable-engine-web/src/views/common/form/components/DeptPicker.vue
View File

@ -6,8 +6,8 @@
</template> </template>
<template v-else> <template v-else>
<template v-if="perm === 'E'"> <template v-if="perm === 'E'">
<el-button icon="iconfont icon-map-site" type="primary" size="mini" round @click="$refs.orgPicker.show()"> 选择部门</el-button> <el-button icon="iconfont icon-map-site" type="primary" size="mini" round @click="selectDept"> 选择部门</el-button>
<org-picker type="dept" :multiple="multiple" ref="orgPicker" :selected="_value" @ok="selected"/> <org-picker type="dept" :multiple="multiple" ref="deptPicker" :selected="_value" @ok="selected"/>
<span class="placeholder"> {{placeholder}}</span> <span class="placeholder"> {{placeholder}}</span>
<div style="margin-top: 5px"> <div style="margin-top: 5px">
<el-tag size="mini" style="margin: 5px" closable v-for="(dept, i) in _value" :key="i" @close="delDept(i)">{{dept.name}}</el-tag> <el-tag size="mini" style="margin: 5px" closable v-for="(dept, i) in _value" :key="i" @close="delDept(i)">{{dept.name}}</el-tag>
@ -54,6 +54,10 @@ export default {
} }
}, },
methods: { methods: {
//弹出部门选择器,选择部门
selectDept() {
this.$refs.deptPicker.showDeptPicker()
},
selected(values){ selected(values){
this.showOrgSelect = false this.showOrgSelect = false
this._value = values this._value = values

105
flowable-engine-web/src/views/common/process/config/ApprovalNodeConfig.vue
View File

@ -119,40 +119,38 @@
<el-form-item label="🙅‍ 如果审批被驳回 👇"> <el-form-item label="🙅‍ 如果审批被驳回 👇">
<el-radio-group v-model="nodeProps.refuse.type"> <el-radio-group v-model="nodeProps.refuse.type">
<el-radio label="TO_END">直接结束流程</el-radio> <el-radio label="TO_END">直接结束流程</el-radio>
<!-- <el-radio label="TO_BEFORE">驳回到上级审批节点</el-radio>--> <!-- <el-radio label="TO_BEFORE">驳回到上级审批节点</el-radio>-->
<!-- <el-radio label="TO_NODE">驳回到指定节点</el-radio>--> <!-- <el-radio label="TO_NODE">驳回到指定节点</el-radio>-->
</el-radio-group> </el-radio-group>
<div v-if="nodeProps.refuse.type === 'TO_NODE'"> <div v-if="nodeProps.refuse.type === 'TO_NODE'">
<span>指定节点:</span> <span>指定节点:</span>
<el-select style="margin-left: 10px; width: 150px;" placeholder="选择跳转步骤" size="small" v-model="nodeProps.refuse.target"> <el-select style="margin-left: 10px; width: 150px;" placeholder="选择跳转步骤" size="small"
v-model="nodeProps.refuse.target">
<el-option v-for="(node, i) in nodeOptions" :key="i" :label="node.name" :value="node.id"></el-option> <el-option v-for="(node, i) in nodeOptions" :key="i" :label="node.name" :value="node.id"></el-option>
</el-select> </el-select>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<!-- <org-picker :title="pickerTitle" multiple :type="orgPickerType" ref="orgPicker" :selected="orgPickerSelected"-->
<!-- @ok="selected"/>-->
<role-picker-me :title="pickerTitle" multiple ref="rolePicker" :selected="rolePickerSelected" @ok="selectedRole"/> <role-picker :title="pickerTitle" multiple ref="rolePicker" :v-model="select" @ok="selectedRole"/>
</div> </div>
</template> </template>
<script> <script>
import OrgPicker from "@/components/common/Test"; import RolePicker from "@/components/common/RolePicker";
import RolePickerMe from "../../../../components/common/RolePickerMe";
import RoleItems from "../RoleItems"; import RoleItems from "../RoleItems";
import OrgItems from "../OrgItems"; import OrgItems from "../OrgItems";
export default { export default {
name: "ApprovalNodeConfig", name: "ApprovalNodeConfig",
components: {RoleItems, OrgPicker, OrgItems,RolePickerMe}, components: {RoleItems, OrgItems, RolePicker},
props: { props: {
config: { config: {
type: Object, type: Object,
default: () => { default: () => {
return {} return {};
} }
} }
}, },
@ -160,54 +158,52 @@ export default {
return { return {
showOrgSelect: false, showOrgSelect: false,
orgPickerSelected: [], orgPickerSelected: [],
showRoleSelect: false, orgPickerType: "user",
rolePickerSelected: [],
orgPickerType: 'user',
approvalTypes: [ approvalTypes: [
{name: '指定人员', type: 'ASSIGN_USER'}, {name: "指定人员", type: "ASSIGN_USER"},
{name: '发起人自选', type: 'SELF_SELECT'}, {name: "发起人自选", type: "SELF_SELECT"},
{name: '连续多级主管', type: 'LEADER_TOP'}, {name: "连续多级主管", type: "LEADER_TOP"},
{name: '主管', type: 'LEADER'}, {name: "主管", type: "LEADER"},
{name: '角色', type: 'ROLE'}, {name: "角色", type: "ROLE"},
{name: '发起人自己', type: 'SELF'}, {name: "发起人自己", type: "SELF"},
{name: '表单内联系人', type: 'FORM_USER'} {name: "表单内联系人", type: "FORM_USER"}
] ]
} };
}, },
computed: { computed: {
nodeProps() { nodeProps() {
return this.$store.state.selectedNode.props return this.$store.state.selectedNode.props;
}, },
select() { select() {
return this.config.assignedUser || [] return this.config.assignedUser || [];
}, },
roleList() { roleList() {
return this.config.roleList || [] return this.config.roleList || [];
}, },
forms() { forms() {
return this.$store.state.design.formItems.filter(f => { return this.$store.state.design.formItems.filter(f => {
return f.name === 'UserPicker' return f.name === "UserPicker";
}) });
}, },
pickerTitle() { pickerTitle() {
switch (this.orgPickerType) { switch (this.orgPickerType) {
case 'user': case "user":
return '请选择人员'; return "请选择人员";
case 'role': case "role":
return '请选择系统角色'; return "请选择系统角色";
default: default:
return null; return null;
} }
}, },
nodeOptions() { nodeOptions() {
let values = [] let values = [];
const excType = ['ROOT', 'EMPTY', "CONDITION", "CONDITIONS", "CONCURRENT", "CONCURRENTS"] const excType = ["ROOT", "EMPTY", "CONDITION", "CONDITIONS", "CONCURRENT", "CONCURRENTS"];
this.$store.state.nodeMap.forEach((v) => { this.$store.state.nodeMap.forEach((v) => {
if (excType.indexOf(v.type) === -1) { if (excType.indexOf(v.type) === -1) {
values.push({id: v.id, name: v.name}) values.push({id: v.id, name: v.name});
} }
}) });
return values return values;
}, },
showMode() { showMode() {
switch (this.nodeProps.assignedType) { switch (this.nodeProps.assignedType) {
@ -216,7 +212,7 @@ export default {
case "SELF_SELECT": case "SELF_SELECT":
return this.nodeProps.selfSelect.multiple; return this.nodeProps.selfSelect.multiple;
case "LEADER_TOP": case "LEADER_TOP":
return this.nodeProps.formUser !== ''; return this.nodeProps.formUser !== "";
case "FORM_USER": case "FORM_USER":
return true; return true;
case "ROLE": case "ROLE":
@ -228,33 +224,36 @@ export default {
}, },
methods: { methods: {
selectUser() { selectUser() {
this.orgPickerSelected = this.select this.orgPickerSelected = this.select;
this.orgPickerType = 'user' this.orgPickerType = "user";
this.$refs.orgPicker.show() this.$refs.orgPicker.show();
}, },
selectNoSetUser() { selectNoSetUser() {
this.orgPickerSelected = this.config.nobody.assignedUser this.orgPickerSelected = this.config.nobody.assignedUser;
this.orgPickerType = 'user' this.orgPickerType = "user";
this.$refs.orgPicker.show() this.$refs.orgPicker.show();
}, },
//弹出角色选择器,选择系统角色
selectRole() { selectRole() {
this.showRoleSelect = null this.orgPickerType = "role";
this.rolePickerSelected = this.roleList this.$refs.rolePicker.showRolePicker();
this.$refs.rolePicker.show()
},
selected(select) {
}, },
selectedRole(select) { selectedRole(select) {
console.log(select) select.forEach(val => {
this.rolePickerSelected.length = 0 for (let i = 0; i < this.roleList.length; i++) {
select.forEach(val => this.rolePickerSelected.push(val)) if (this.roleList[i].roleId === val.roleId) {
this.roleList.splice(i, 1);
break;
}
}
this.roleList.push(val);
});
}, },
removeOrgItem(index) { removeOrgItem(index) {
this.select.splice(index, 1) this.select.splice(index, 1);
} }
} }
} };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>