<template>
|
<a-drawer
|
:title="title"
|
:maskClosable="true"
|
width=600
|
placement="right"
|
:closable="true"
|
@close="close"
|
:visible="visible"
|
style="overflow: auto;padding-bottom: 53px;">
|
|
<a-spin :spinning="confirmLoading">
|
|
<a-form :form="form" v-if="designNameOption.length>0">
|
<a-form-item label=''>
|
<a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
|
<a-card :style="{ marginTop: '12px',height:'auto' }">
|
<a-checkbox-group @change="designNameChange" v-model="designNameValue" style="width: 100%">
|
<a-row>
|
<template v-for="(des) in designNameOption">
|
<a-col :span="6">
|
<a-checkbox :value="des.value">{{ des.text }}</a-checkbox>
|
</a-col>
|
</template>
|
</a-row>
|
</a-checkbox-group>
|
</a-card>
|
</a-col>
|
</a-form-item>
|
</a-form>
|
<div v-else><h3>无可配置角色!</h3></div>
|
</a-spin>
|
<div class="drawer-bootom-button">
|
<a-dropdown style="float: left" :trigger="['click']" placement="topCenter">
|
<a-menu slot="overlay">
|
<a-menu-item key="1" @click="checkALL">全部勾选</a-menu-item>
|
<a-menu-item key="2" @click="cancelCheckALL">取消全选</a-menu-item>
|
</a-menu>
|
<a-button>
|
操作 <a-icon type="up" />
|
</a-button>
|
</a-dropdown>
|
<a-popconfirm title="确定放弃编辑？" @confirm="close" okText="确定" cancelText="取消">
|
<a-button style="margin-right: .8rem">取消</a-button>
|
</a-popconfirm>
|
<a-button @click="handleSubmit(true)" type="primary">保存</a-button>
|
</div>
|
</a-drawer>
|
</template>
|
|
<script>
|
import {httpAction, getAction} from '@/api/manage'
|
import JEllipsis from '@/components/jeecg/JEllipsis'
|
import {initDictOptions} from '@/components/dict/JDictSelectUtil'
|
|
export default {
|
name: 'DeptRoleUserModal',
|
components: {
|
JEllipsis
|
},
|
data() {
|
return {
|
currentDeptId:"",
|
title: "部门角色分配",
|
visible: false,
|
model: {},
|
labelCol: {
|
xs: {span: 24},
|
sm: {span: 5},
|
},
|
wrapperCol: {
|
xs: {span: 24},
|
sm: {span: 16},
|
},
|
confirmLoading: false,
|
form: this.$form.createForm(this),
|
validatorRules: {},
|
url: {
|
add: "/sys/sysDepartRole/deptRoleUserAdd",
|
getDeptRoleList:"/sys/sysDepartRole/getDeptRoleList",
|
getDeptRoleByUserId:"/sys/sysDepartRole/getDeptRoleByUserId"
|
},
|
designNameOption: [],
|
userId: "",
|
newRoleId:"",
|
oldRoleId:"",
|
designNameValue:[],
|
desformList: [],
|
}
|
},
|
created() {
|
|
},
|
methods: {
|
add(record,departId) {
|
this.userId = record.id;
|
this.currentDeptId = departId;
|
this.loadDesformList();
|
this.edit({});
|
},
|
edit(record) {
|
this.form.resetFields();
|
this.model = Object.assign({}, record);
|
this.visible = true;
|
getAction(this.url.getDeptRoleByUserId,{userId:this.userId,departId:this.currentDeptId}).then((res) => {
|
if (res.success) {
|
var designName = [];
|
for (let value of res.result) {
|
designName.push(value.droleId)
|
}
|
this.oldRoleId=designName.join(",");
|
this.designNameValue = designName;
|
this.newRoleId = designName.join(",");
|
}
|
});
|
},
|
close() {
|
this.$emit('close');
|
this.visible = false;
|
},
|
handleSubmit() {
|
const that = this;
|
// 触发表单验证
|
that.confirmLoading = true;
|
let httpurl = this.url.add;
|
let method = 'post';
|
let formData = Object.assign(this.model, {});
|
//时间格式化
|
formData.userId = this.userId;
|
formData.newRoleId=this.newRoleId;
|
formData.oldRoleId=this.oldRoleId;
|
httpAction(httpurl, formData, method).then((res) => {
|
if (res.success) {
|
that.$message.success(res.message);
|
that.$emit('reload');
|
that.$emit('ok');
|
} else {
|
that.$message.warning(res.message);
|
}
|
}).finally(() => {
|
that.confirmLoading = false;
|
that.close();
|
})
|
},
|
handleCancel() {
|
this.designNameOption=[];
|
this.designNameValue=[];
|
this.close()
|
},
|
designNameChange(selectedValue) {
|
this.newRoleId=selectedValue.join(",");
|
},
|
checkALL(){
|
var designName = [];
|
for (let value of this.desformList) {
|
designName.push(
|
value.id
|
)
|
}
|
this.designNameValue = designName;
|
this.newRoleId=designName.join(",");
|
},
|
cancelCheckALL(){
|
this.designNameValue=[];
|
this.newRoleId="";
|
},
|
/** 加载desform */
|
loadDesformList() {
|
getAction(this.url.getDeptRoleList, { departId: this.currentDeptId, userId:this.userId }).then((res) => {
|
if (res.success) {
|
this.desformList = res.result
|
var designName = [];
|
for (let value of this.desformList) {
|
designName.push({
|
value: value.id,
|
text: value.roleName,
|
})
|
}
|
this.designNameOption = designName;
|
}
|
});
|
},
|
}
|
|
}
|
</script>
|
|
<style scoped>
|
.drawer-bootom-button {
|
position: absolute;
|
bottom: 0;
|
width: 100%;
|
border-top: 1px solid #e8e8e8;
|
padding: 10px 16px;
|
text-align: right;
|
left: 0;
|
background: #fff;
|
border-radius: 0 0 2px 2px;
|
}
|
</style>
|
