增加数据权限
This commit is contained in:
parent
d01089d910
commit
98fbfdf9f8
@ -113,7 +113,20 @@ export default {
|
||||
return await http.post(this.url, params);
|
||||
}
|
||||
},
|
||||
|
||||
dataMenu:{
|
||||
url: `${config.API_URL}/auth.data.permission.checked`,
|
||||
name: "数据权限",
|
||||
post: async function (params) {
|
||||
return await http.post(this.url, params);
|
||||
}
|
||||
},
|
||||
dataAuth:{
|
||||
url: `${config.API_URL}/auth.data.permission.add`,
|
||||
name: "数据授权",
|
||||
post: async function (params) {
|
||||
return await http.post(this.url, params);
|
||||
}
|
||||
},
|
||||
roleCode: {
|
||||
url: `${config.API_URL}/authorize.role.codes`,
|
||||
name: "角色对应CODE列表",
|
||||
|
||||
@ -2,37 +2,30 @@
|
||||
<!-- 自定义表格 -->
|
||||
<el-scrollbar height="100%">
|
||||
<div class="customTable">
|
||||
<div class="tableBody" v-if="list.length>0">
|
||||
<template v-for="(item,inde) in list" :key="inde">
|
||||
<div class="tableBody" v-for="(item,index) in list" :key="index">
|
||||
<div class="trTitle">
|
||||
<div class="name">
|
||||
<el-checkbox :indeterminate="item.isCheck" v-model="item.checked" @change="menuCheckChange(item)" :size="size">{{item.meta.title}}</el-checkbox>
|
||||
</div>
|
||||
<div class="coseBtn" @click="item.show=!item.show">
|
||||
<div class="coseBtnIcon">
|
||||
<span v-if="item.show"><el-icon-arrowDown /></span>
|
||||
<span v-else><el-icon-arrowRight /></span>
|
||||
{{item.category_name}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="item.show">
|
||||
<div class="tr" v-for="(em,ind) in item.children" :key="ind">
|
||||
<div class="childView">
|
||||
<div class="tr" v-for="(em,ind) in item.set_info" :key="ind">
|
||||
<div class="td module">
|
||||
<el-checkbox :indeterminate="em.isCheck" v-model="em.checked" @change="moduleCheckChange(item,em)" :size="size">{{em.meta.title}}</el-checkbox>
|
||||
<div class="textName">敏感数据权限</div>
|
||||
<div class="viewBox">
|
||||
<el-checkbox v-model="em.is_view" :size="size">{{em.resource_name}}</el-checkbox>
|
||||
</div>
|
||||
<div class="td tdChild">
|
||||
<div class="nextTd">
|
||||
<div class="tdName authority">
|
||||
<div class="boxName" v-for="(li,ind) in em.meta.data_permission" :key="ind">
|
||||
<el-checkbox v-model="li.checked" :size="size" @change="checkChange(item,em)"><span class="name">{{li.title}}</span></el-checkbox>
|
||||
</div>
|
||||
<div class="td module">
|
||||
<div class="textName">操作权限</div>
|
||||
<div class="viewBox">
|
||||
<el-checkbox v-model="em.action.view" :size="size">查看</el-checkbox>
|
||||
<el-checkbox v-model="em.action.edit" :size="size">编辑</el-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</template>
|
||||
@ -53,28 +46,6 @@ export default {
|
||||
watch:{
|
||||
data(val){
|
||||
if(val && val.length>0){
|
||||
val.forEach(item=>{
|
||||
item.show = true;
|
||||
if(item.children){
|
||||
item.children.forEach(em=>{
|
||||
if(em.meta.data_permission && em.meta.data_permission.length>0){
|
||||
let check = em.meta.data_permission.filter((li)=>li.checked).length;
|
||||
let ed = em.meta.data_permission.length;
|
||||
em.isCheck = check>0 && check != ed?true:false;
|
||||
if(ed>0){
|
||||
em.checked = check>0 && check== ed?true:false;
|
||||
}
|
||||
}
|
||||
})
|
||||
let check = item.children.filter((em)=>em.checked).length;
|
||||
let isCheck = item.children.filter((em)=>em.isCheck).length;
|
||||
let ed = item.children.length;
|
||||
|
||||
item.isCheck = (check>0 && check != ed) || (isCheck>0 && check != ed)?true:false;
|
||||
item.checked = check>0 && check== ed?true:false;
|
||||
}
|
||||
})
|
||||
|
||||
this.list = JSON.parse(JSON.stringify(val));
|
||||
}
|
||||
}
|
||||
@ -156,82 +127,115 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.module{
|
||||
flex-basis: 120px;
|
||||
.module {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.check{
|
||||
|
||||
.check {
|
||||
flex-basis: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.menu{
|
||||
flex:1;
|
||||
|
||||
.menu {
|
||||
flex: 1;
|
||||
}
|
||||
.authority{
|
||||
|
||||
.authority {
|
||||
flex-basis: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
.customTable{
|
||||
|
||||
.customTable {
|
||||
border: 1px solid var(--el-border-color-light);
|
||||
border-bottom: 0;
|
||||
}
|
||||
.tableBodyNull{
|
||||
border-top:1px solid var(--el-border-color-light);
|
||||
|
||||
.tableBodyNull {
|
||||
border-top: 1px solid var(--el-border-color-light);
|
||||
}
|
||||
.tableBody .trTitle{
|
||||
|
||||
.tableBody {
|
||||
display: flex;
|
||||
}
|
||||
.childView{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
}
|
||||
.tableBody .trTitle {
|
||||
background: #f5f7fa;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 36px;
|
||||
padding: 0 10px;
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
.name{
|
||||
border-right: 1px solid var(--el-border-color-light);
|
||||
flex-basis: 140px;
|
||||
.name {
|
||||
flex: 1;
|
||||
}
|
||||
.coseBtn{
|
||||
|
||||
.coseBtn {
|
||||
flex-basis: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
.coseBtnIcon{
|
||||
|
||||
.coseBtnIcon {
|
||||
width: 14px;
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBody .tr{
|
||||
|
||||
.tableBody .tr {
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
|
||||
.td {
|
||||
padding: 0 10px;
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
justify-content: space-between;
|
||||
border-bottom:1px solid var(--el-border-color-light);
|
||||
.td{
|
||||
padding: 0 10px;
|
||||
border-left: 1px solid var(--el-border-color-light);
|
||||
.nextTd{
|
||||
border-bottom:1px solid var(--el-border-color-light);
|
||||
.textName{
|
||||
flex-basis: 110px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-right: 1px solid var(--el-border-color-light);
|
||||
}
|
||||
.viewBox{
|
||||
padding: 0 0 0 10px;
|
||||
}
|
||||
.nextTd {
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
flex: 1;
|
||||
}
|
||||
.nextTd:last-child{
|
||||
.nextTd:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
.td:first-child{
|
||||
|
||||
.td:first-child {
|
||||
border-left: 0;
|
||||
}
|
||||
.tdChild{
|
||||
.td:last-child{
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.tdChild {
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
border-left: 1px solid var(--el-border-color-light);
|
||||
.tdName:first-child{
|
||||
|
||||
.tdName:first-child {
|
||||
border-left: 0;
|
||||
}
|
||||
.tdName{
|
||||
|
||||
.tdName {
|
||||
border-left: 1px solid var(--el-border-color-light);
|
||||
padding: 0 10px;
|
||||
width: 100%;
|
||||
@ -239,12 +243,14 @@ export default {
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
.boxName{
|
||||
|
||||
.boxName {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 20px;
|
||||
width: 120px;
|
||||
.name{
|
||||
|
||||
.name {
|
||||
width: 100px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -256,7 +262,4 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBody .tr:last-child{
|
||||
//border-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -36,6 +36,9 @@
|
||||
<div class="btnPot" v-if="activeNum==0">
|
||||
<el-button type="primary" v-auth="'addRoleAuth'" plain :size="size" :loading="isSave" @click="submit">保存权限</el-button>
|
||||
</div>
|
||||
<div class="btnPot" v-if="activeNum==1">
|
||||
<el-button type="primary" v-auth="'addDataPermission'" plain :size="size" :loading="isDataSave" @click="submitPermissions">保存权限</el-button>
|
||||
</div>
|
||||
<div class="btnPot" v-if="activeNum==2">
|
||||
<el-button type="danger" v-auth="'roleRemovedUsers'" plain :size="size" @click="deleteMember">移除成员</el-button>
|
||||
<el-button type="primary" v-auth="'roleAddedUsers'" plain :size="size" @click="getDeptTree">添加成员</el-button>
|
||||
@ -142,6 +145,7 @@
|
||||
},
|
||||
|
||||
isSave:false,
|
||||
isDataSave:false,
|
||||
activeNum:0,
|
||||
roleCheckList:[],
|
||||
role_id:"",
|
||||
@ -179,6 +183,7 @@
|
||||
if(flag){
|
||||
await this.getMenu();
|
||||
await this.getRoleList();
|
||||
await this.getDataList();
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -289,6 +294,7 @@
|
||||
this.role_id = data.id;
|
||||
this.getMenu();
|
||||
this.getRoleList();
|
||||
this.getDataList();
|
||||
},
|
||||
|
||||
// 保存权限
|
||||
@ -344,6 +350,34 @@
|
||||
return obj
|
||||
},
|
||||
|
||||
// 保存数据权限
|
||||
submitPermissions(){
|
||||
this.isDataSave = true;
|
||||
const params = this.setDataList(this.$refs.dataPermissions.list);
|
||||
setTimeout(async ()=>{
|
||||
const res = await this.$API.system.role.dataAuth.post(params);
|
||||
if(res.code === 200){
|
||||
this.$message.success("授权成功");
|
||||
await this.getDataList();
|
||||
}
|
||||
this.isDataSave = false;
|
||||
})
|
||||
},
|
||||
setDataList(list){
|
||||
let obj = {
|
||||
role_id:this.role_id,
|
||||
resource_info:[],
|
||||
}
|
||||
list.forEach(item=>{
|
||||
if(item.set_info && item.set_info.length>0){
|
||||
item.set_info.forEach(em=>{
|
||||
obj.resource_info.push(em)
|
||||
})
|
||||
}
|
||||
})
|
||||
return obj
|
||||
},
|
||||
|
||||
// 权限和角色成员
|
||||
userAvatar(row) {
|
||||
return row.name.substring(0, 1)
|
||||
@ -362,6 +396,18 @@
|
||||
this.menu.list = res.data;
|
||||
}
|
||||
},
|
||||
async getDataList() {
|
||||
if (this.role_id != "") {
|
||||
let params = {
|
||||
role_id: this.role_id,
|
||||
};
|
||||
this.dataPermissionsLoading = true;
|
||||
const res = await this.$API.system.role.dataMenu.post(params);
|
||||
this.dataPermissionsLoading = false;
|
||||
this.dataPermissions.list = res.data;
|
||||
}
|
||||
|
||||
},
|
||||
async getRoleList() {
|
||||
if(this.role_id!=""){
|
||||
let params = {
|
||||
@ -377,7 +423,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
async getDeptTree() {
|
||||
this.memberShow = true;
|
||||
const res = await this.$API.system.role.tree.post();
|
||||
|
||||
Loading…
Reference in New Issue
Block a user