<template>
|
<el-dialog :visible.sync="isShowEdit" width="740px" title="编辑权限" :modal-append-to-body="false"
|
:close-on-click-modal="false">
|
<!--自定义了页脚的按钮-->
|
<el-row :gutter="20">
|
<el-col :span="6">
|
<span>姓名：</span>
|
<span>{{ info.userName }}</span>
|
</el-col>
|
<el-col :span="6">
|
<span>用户账号：</span>
|
<span>{{ info.userAccount }}</span>
|
</el-col>
|
</el-row>
|
<el-tabs v-model="defaultActive" type="card" style="margin-top:20px;">
|
<el-tab-pane :label="item.name" :name="item.code" v-for="item in newSystemData"
|
:key="item.code">
|
<role-sel-module :roleAll="item.roleAll" :checkIdList="item.checkIdList"
|
:allIdList="item.allIdList" :visible="isShowEdit" @updateData="updateData"
|
:systemId="item.code">
|
</role-sel-module>
|
</el-tab-pane>
|
</el-tabs>
|
<template slot="footer">
|
<el-button size="mini" key="back" @click="isShowEdit = false">
|
取消
|
</el-button>
|
<el-button size="mini" :loading="loading" key="submit" type="primary" @click="handleOk"
|
:disabled="newSystemData.length === 0">
|
提交
|
</el-button>
|
</template>
|
</el-dialog>
|
</template>
|
<script>
|
import AccountManageApi from '@/api/accountManage'
|
import roleSelModule from './roleSel.vue'
|
import systemData from "@/utils/systemConfig.js"
|
export default {
|
name: 'AuthorityEdit',
|
components: {
|
roleSelModule
|
},
|
props: {
|
// 显示隐藏
|
visibleAuthority: {
|
type: Boolean,
|
required: true
|
},
|
// 角色相关信息
|
info: {
|
type: Object,
|
required: true
|
}
|
},
|
data() {
|
return {
|
isShowEdit: false,
|
spinLoading: false,
|
// 提交按钮加载中
|
loading: false,
|
//平台权限下拉数据
|
newSystemData: systemData,
|
//默认选中tab页
|
defaultActive: null,
|
//============接口传参==========
|
roleCodes: []
|
}
|
},
|
watch: {
|
visibleAuthority(newV) {
|
if (newV) {
|
this.getSyetemUserRoleData();
|
}
|
this.isShowEdit = newV
|
},
|
/**
|
* 监控内部显示属性变化
|
* 传递到外部调用变量
|
*/
|
isShowEdit: function (newDialogShow, oldDialogShow) {
|
this.$emit('update:visibleAuthority', newDialogShow)
|
}
|
},
|
methods: {
|
//获取用户角色信息
|
getSyetemUserRoleData() {
|
if (this.newSystemData.length) {
|
let _code = this.newSystemData[0].code;
|
this.defaultActive = _code;
|
this.newSystemData.forEach((item) => {
|
this.sendRequest(item);
|
})
|
}
|
},
|
//发送请求
|
sendRequest(item) {
|
this.spinLoading = true;
|
AccountManageApi.getRoleIds(
|
{
|
systemId: item.code,
|
userId: this.info.id,
|
}
|
).then((res) => {
|
if (res.code === '200' && res.data) {
|
// 全部角色的id集合
|
const idsList = []
|
if (res.data.roleAll && res.data.roleAll.length) {
|
res.data.roleAll.forEach(item => {
|
idsList.push(item.id)
|
})
|
this.$set(item, "roleAll", res.data.roleAll)
|
}
|
this.$set(item, "allIdList", idsList)
|
this.$set(item, "checkIdList", res.data.roleIdList)
|
} else {
|
this.$message.error(res.message);
|
}
|
this.spinLoading = false;
|
})
|
},
|
//获取选中角色
|
updateData(obj) {
|
this.newSystemData.forEach((v) => {
|
if (v.code === obj.systemId) {
|
this.$set(v, "roleCodes", obj.roleCodes)
|
}
|
})
|
},
|
/**
|
* 确定
|
*/
|
handleOk() {
|
this.loading = true
|
this.newSystemData.forEach((item, index) => {
|
if (!item.roleCodes || !item.roleCodes.length) {
|
AccountManageApi.unBindUserRole(
|
{
|
systemId: item.code,
|
userId: this.info.id, // 用户ID
|
}
|
).then((res) => {
|
if (res.code == 200) {
|
if (index === this.newSystemData.length - 1) {
|
this.$message.success('角色设置成功！')
|
this.$emit('ok')
|
this.isShowEdit = false;
|
this.loading = false
|
}
|
} else {
|
this.$message.error(res.message)
|
this.loading = false
|
}
|
})
|
} else {
|
AccountManageApi.bindUserRole(
|
{
|
roleCodes: item.roleCodes, // 角色IDS
|
systemId: item.code,
|
userId: this.info.id, // 用户ID
|
}
|
).then((res) => {
|
if (res.code == 200) {
|
if (index === this.newSystemData.length - 1) {
|
this.$message.success('角色设置成功！')
|
this.$emit('ok')
|
this.isShowEdit = false;
|
this.loading = false
|
}
|
} else {
|
this.$message.error(res.message)
|
this.loading = false
|
}
|
})
|
}
|
})
|
},
|
}
|
}
|
</script>
|
<style lang="scss" scoped>
|
.role-list-wrapper {
|
width: 100%;
|
}
|
</style>
|
