组织管理添加人员操作方式调整
This commit is contained in:
fan
parent
014c743a10
commit
be047fff67
193
src/views/system/companyManage/selectUser.vue
Normal file
193
src/views/system/companyManage/selectUser.vue
Normal file
@ -0,0 +1,193 @@
|
||||
<template>
|
||||
<el-dialog title="权限分发到指定用户" append-to-body :visible.sync="dialogVisible" width="1400px" :before-close="doClose" center :close-on-click-modal="false">
|
||||
<QueryListPage ref="queryListPage1" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { getUserList } from '@/api/management/user';
|
||||
import { getCompanyList } from '@/api/company';
|
||||
export default {
|
||||
name:'SelectUser',
|
||||
data() {
|
||||
return {
|
||||
dialogVisible:false,
|
||||
pagerConfig: {
|
||||
pageSize: 'pageSize',
|
||||
pageIndex: 'pageNum'
|
||||
},
|
||||
companyMap: {},
|
||||
companyList: [],
|
||||
countTypeList:[
|
||||
{label:'个人账户', value:'1'},
|
||||
{label:'企业账户', value:'2'},
|
||||
{label:'企业账户下子账户', value:'3'}
|
||||
],
|
||||
queryForm: {
|
||||
labelWidth: '80px',
|
||||
leftSpan: 20,
|
||||
reset: true,
|
||||
queryObject: {
|
||||
name: {
|
||||
type: 'text',
|
||||
label: this.$t('system.name')
|
||||
},
|
||||
id: {
|
||||
type: 'text',
|
||||
label: 'id'
|
||||
},
|
||||
account:{
|
||||
type: 'text',
|
||||
label: '账号'
|
||||
},
|
||||
parentAccount:{
|
||||
type: 'text',
|
||||
label: '父账号'
|
||||
},
|
||||
roles: {
|
||||
type: 'select',
|
||||
label: this.$t('system.roles'),
|
||||
config: {
|
||||
data: this.$ConstSelect.roleList
|
||||
}
|
||||
},
|
||||
nickname: {
|
||||
type: 'text',
|
||||
label: '昵称'
|
||||
},
|
||||
mobile: {
|
||||
type: 'text',
|
||||
label: '手机号'
|
||||
},
|
||||
email: {
|
||||
type: 'text',
|
||||
label: '邮箱'
|
||||
},
|
||||
companyId: {
|
||||
type: 'select',
|
||||
label: '组织',
|
||||
config: {
|
||||
data: []
|
||||
}
|
||||
},
|
||||
type:{
|
||||
type: 'select',
|
||||
label: '类型',
|
||||
config: {
|
||||
data: []
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
queryList: {
|
||||
query: getUserList,
|
||||
selectCheckShow: false,
|
||||
height: '420',
|
||||
indexShow: true,
|
||||
columns: [
|
||||
{
|
||||
title: 'id',
|
||||
prop: 'id',
|
||||
width: 80
|
||||
},
|
||||
{
|
||||
title: '账号',
|
||||
prop: 'account',
|
||||
width: 80
|
||||
},
|
||||
{
|
||||
title: '父账号',
|
||||
prop: 'parentAccount',
|
||||
width: 80
|
||||
},
|
||||
{
|
||||
title: this.$t('system.name'),
|
||||
prop: 'name'
|
||||
},
|
||||
{
|
||||
title: this.$t('system.nickname'),
|
||||
prop: 'nickname'
|
||||
},
|
||||
{
|
||||
title: '类型',
|
||||
prop: 'type',
|
||||
type: 'tag',
|
||||
columnValue: (row) => { return this.getCountType(row.type); },
|
||||
tagType: (row) => { return 'success'; }
|
||||
},
|
||||
{
|
||||
title: this.$t('global.mobile'),
|
||||
prop: 'mobile'
|
||||
},
|
||||
{
|
||||
title: this.$t('global.email'),
|
||||
prop: 'email'
|
||||
},
|
||||
{
|
||||
title: '组织',
|
||||
prop: 'companyId',
|
||||
type: 'tag',
|
||||
columnValue: (row) => { return this.getCompanyName(row.companyId); },
|
||||
tagType: (row) => { return 'success'; }
|
||||
},
|
||||
{
|
||||
title: this.$t('system.roles'),
|
||||
prop: 'roles',
|
||||
type: 'tagMore',
|
||||
columnValue: (row) => { return this.$convertField(row.roles, this.$ConstSelect.roleList, ['value', 'label'], true); },
|
||||
tagType: (row) => { return 'success'; }
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
title: this.$t('global.operate'),
|
||||
width: '90',
|
||||
buttons: [
|
||||
{
|
||||
name: '选择',
|
||||
handleClick: this.selectUser
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.companyMap = {};
|
||||
this.companyList = [];
|
||||
getCompanyList().then(resp => {
|
||||
if (resp && resp.data && resp.data.length) {
|
||||
resp.data.forEach(item => {
|
||||
this.companyMap[item.id] = item.name;
|
||||
this.companyList.push({label: item.name, value: parseInt(item.id)});
|
||||
});
|
||||
this.queryForm.queryObject.companyId.config.data = this.companyList;
|
||||
this.queryForm.queryObject.type.config.data = this.countTypeList;
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
},
|
||||
methods:{
|
||||
doShow() {
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
doClose() {
|
||||
this.dialogVisible = false;
|
||||
},
|
||||
getCountType(type) {
|
||||
const countType = this.countTypeList.find(each=>{ return each.value == type; });
|
||||
return countType ? countType.label : '';
|
||||
},
|
||||
getCompanyName(companyId) {
|
||||
return this.companyMap[companyId];
|
||||
},
|
||||
selectUser(index, row) {
|
||||
this.$emit('setUserInfo', row);
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,67 +1,70 @@
|
||||
<template>
|
||||
<el-dialog v-dialogDrag title="绑定组织成员" :visible.sync="dialogVisible" width="30%" :before-close="doClose" center :close-on-click-modal="false">
|
||||
<data-form ref="dataform" :form="form" :form-model="formModel" :rules="rules" />
|
||||
<el-form ref="form" :model="formModel" :rules="rules" label-width="100px;">
|
||||
<el-form-item label="组织" prop="orgName">
|
||||
<el-input v-model="formModel.orgName" disabled style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户" prop="uid">
|
||||
<el-input v-model="allName" placeholder="请添加" disabled style="width: 200px">
|
||||
<el-button slot="append" type="primary" icon="el-icon-search" @click="searchUser" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色" prop="role">
|
||||
<el-select v-model="formModel.role" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in schoolRoleList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="doConfirm">{{ $t('global.confirm') }}</el-button>
|
||||
<el-button @click="doClose">{{ $t('global.cancel') }}</el-button>
|
||||
</span>
|
||||
<select-user ref="selectUser" @setUserInfo="setUserInfo" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { getBindUserRoles, getManageUserList } from '@/api/management/user';
|
||||
import { getBindUserRoles } from '@/api/management/user';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import SelectUser from './selectUser';
|
||||
|
||||
export default {
|
||||
name:'SelectUserRole',
|
||||
components: {
|
||||
SelectUser
|
||||
},
|
||||
props: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
userList: [],
|
||||
schoolRoleList: ConstConfig.ConstSelect.schoolRoleList,
|
||||
userInfo: {},
|
||||
formModel: {
|
||||
keyId: '',
|
||||
orgName: '',
|
||||
orgId: '',
|
||||
uid: '',
|
||||
role:''
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
form() {
|
||||
const form = {
|
||||
labelWidth: '150px',
|
||||
items: [
|
||||
{ prop: 'orgName', label: '组织', type: 'text', disabled:true, rightWidth:true },
|
||||
{ prop: 'uid', label: '用户', type: 'select', options: this.userList},
|
||||
{ prop: 'role', label: '角色', type: 'select', options: ConstConfig.ConstSelect.schoolRoleList}
|
||||
]
|
||||
};
|
||||
return form;
|
||||
},
|
||||
rules() {
|
||||
const crules = {
|
||||
},
|
||||
rules: {
|
||||
uid: [
|
||||
{ required: true, message: '请选择用户', trigger: 'change' }
|
||||
],
|
||||
role: [
|
||||
{ required: true, message: '请选择角色', trigger: 'change' }
|
||||
]
|
||||
};
|
||||
return crules;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
getManageUserList().then(resp => {
|
||||
if (resp && resp.data && resp.data.length) {
|
||||
resp.data.forEach(item => {
|
||||
this.userList.push({label: item.name, value: item.id});
|
||||
});
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
allName() {
|
||||
return this.formModel.uid ? this.userInfo.nickname + '(' + this.userInfo.name + ')' : '';
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
doShow(row) {
|
||||
@ -74,6 +77,7 @@ export default {
|
||||
},
|
||||
doClose() {
|
||||
this.dialogVisible = false;
|
||||
this.userInfo = {};
|
||||
this.formModel = {
|
||||
keyId: '',
|
||||
orgName: '',
|
||||
@ -81,25 +85,20 @@ export default {
|
||||
uid: '',
|
||||
role:''
|
||||
};
|
||||
},
|
||||
getUserName(id) {
|
||||
let name = '';
|
||||
const findItem = this.userList.find(item => {
|
||||
return item.value == id;
|
||||
});
|
||||
if (findItem) {
|
||||
name = findItem.label;
|
||||
}
|
||||
return name;
|
||||
this.$refs.form.resetFields();
|
||||
},
|
||||
doConfirm() {
|
||||
this.$refs.dataform.validateForm(() => {
|
||||
const formModel = Object.assign({}, this.formModel);
|
||||
delete formModel.orgName;
|
||||
getBindUserRoles(formModel).then(res=>{
|
||||
this.$refs.form.validate(() => {
|
||||
const data = {
|
||||
keyId: this.formModel.keyId,
|
||||
orgId: this.formModel.orgId,
|
||||
uid: this.formModel.uid,
|
||||
role: this.formModel.role
|
||||
};
|
||||
getBindUserRoles(data).then(res => {
|
||||
const nodeData = {
|
||||
keyId: this.formModel.keyId + 'USER' + this.formModel.uid,
|
||||
name: this.getUserName(this.formModel.uid),
|
||||
name: this.userInfo.nickname + '(' + this.userInfo.name + ')',
|
||||
orgRole: this.formModel.role,
|
||||
type: 'USER',
|
||||
userId: this.formModel.uid
|
||||
@ -110,8 +109,23 @@ export default {
|
||||
this.$message.error('绑定组织成员失败: ' + error.message);
|
||||
});
|
||||
});
|
||||
},
|
||||
setUserInfo(user) {
|
||||
this.userInfo = user;
|
||||
this.formModel.uid = user.id;
|
||||
},
|
||||
searchUser() {
|
||||
this.$refs.selectUser.doShow();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-input-group__append button.el-button{
|
||||
border-bottom-left-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
background: #409EFF;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user