From e380c08a22f7546ad187b5bb8a3571db146133a2 Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期三, 16 十月 2024 16:56:13 +0800
Subject: [PATCH] 1
---
src/views/console/authority/role/index.vue | 74 +++++++++++++++++++++++++-----------
1 files changed, 51 insertions(+), 23 deletions(-)
diff --git a/src/views/console/authority/role/index.vue b/src/views/console/authority/role/index.vue
index c78d10e..9cb57d4 100644
--- a/src/views/console/authority/role/index.vue
+++ b/src/views/console/authority/role/index.vue
@@ -29,7 +29,7 @@
<div class="treeMain">
<el-tabs tab-position="left" class="demo-tabs" v-model="menuActiveName" @tab-click="(tab,event)=>menuHandleClick(tab,event,'0')">
<el-tab-pane v-for="(item,index) in menuGrantList" :label="item.title" :name="item.title">
- <el-tree ref="tree0" v-if="showtree" :data="treeData" :props="{ label: 'title',children: 'children'}" node-key="id" show-checkbox @check-change="(item,isCheck)=>treeHandleCheckChange(item,isCheck,index)" :default-checked-keys="treeCheck" default-expand-all />
+ <el-tree ref="tree0" v-if="showtree" :data="treeData" :props="{ label: 'title',children: 'children'}" node-key="id" show-checkbox @check-change="(item,isCheck)=>treeHandleCheckChange(item,isCheck,index)" :default-checked-keys="treeCheck" default-expand-all :check-strictly="true"/>
</el-tab-pane>
</el-tabs>
</div>
@@ -38,7 +38,7 @@
<div class="treeMain">
<el-tabs tab-position="left" class="demo-tabs" v-model="menuActiveName" @tab-click="(tab,event)=>menuHandleClick(tab,event,'1')">
<el-tab-pane v-for="(item,index) in menuGrantList" :label="item.title" :name="item.title">
- <el-tree ref="tree1" v-if="showtree" :data="treeData1" :props="{ label: 'title',children: 'children'}" node-key="id" show-checkbox @check-change="(item,isCheck)=>treeHandleCheckChange(item,isCheck,index)" :default-checked-keys="treeCheck" default-expand-all />
+ <el-tree ref="tree1" v-if="showtree" :data="treeData1" :props="{ label: 'title',children: 'children'}" node-key="id" show-checkbox @check-change="(item,isCheck)=>treeHandleCheckChange(item,isCheck,index)" :default-checked-keys="treeCheck" default-expand-all :check-strictly="true"/>
</el-tab-pane>
</el-tabs>
</div>
@@ -167,19 +167,45 @@
this.menuHandleText = event.target.innerText;
},
treeHandleCheckChange(item,isCheck,index) {
+ var that = this;
if(isCheck) {
- console.log(item.id,111)
- if(!this.treeCheck.includes(item.id)) {
- this.treeCheck.push(item.id);
+ function checkoutId(val){
+ if(!that.treeCheck.includes(val.id)) {
+ that.treeCheck.push(val.id);
+ }
+ if(val.children) {
+ val.children.forEach(item1=> {
+ checkoutId(item1);
+ })
+ }
}
- }else {
- if(this.treeCheck.length != 0) {
- this.treeCheck.forEach((val,valIndex)=> {
- if(val == item.id) {
- this.treeCheck.splice(valIndex,1);
+ checkoutId(item);
+ that.$refs.tree0[index].setCheckedKeys(this.treeCheck,false);
+ }else { //鍙栨秷閫変腑
+ if(item.children) { //鏈塩hildren
+ function delCheckoutId(val){
+ that.treeCheck.forEach((val1,valIndex)=> {
+ if(val1 == val.id) {
+ that.treeCheck.splice(valIndex,1);
+ }
+ })
+ if(val.children) {
+ val.children.forEach(item1=> {
+ delCheckoutId(item1);
+ })
}
- })
- }
+ }
+ delCheckoutId(item);
+ that.$refs.tree0[index].setCheckedKeys(this.treeCheck,false);
+ }else { //娌℃湁children
+ if(this.treeCheck.length != 0) {
+ this.treeCheck.forEach((val,valIndex)=> {
+ if(val == item.id) {
+ this.treeCheck.splice(valIndex,1);
+ }
+ })
+ }
+ }
}
},
setTreeList(arr,name,index=0) {
@@ -187,7 +213,6 @@
this.treeData1 = [];
arr.forEach(item=> {
if(item.title == name) {
- //this.treeData = item.children;
if(index == '0') {
this.treeData = item.children;
}
@@ -226,17 +251,17 @@
this.tableData.forEach(item=> {
item.active = false;
})
- this.tableData[index].active = true; //閫変腑
+ this.tableData[index].active = true; //宸︿晶鍒囨崲瑙掕壊閫変腑
this.showtree = false;
this.tableLiId = id; //瑙掕壊id
this.$nextTick(()=> {
this.showtree = true;
//鑿滃崟
- this.menuGrantList = res.data.menu.filter(item=> { //杩囨护鎺夋病鏈塩hildren鐨�
+ this.menuGrantList = res.data.menu.filter(item=> { //杩囨护鎺夋病鏈塩hildren鐨�,杩欓噷鏄痳es锛屼笉鏄痳esp锛屾槸鑿滃崟tree宸︿晶鐨勯�夐」
return item.children;
});
//鍗＄墖
- this.menuGrantList1 = [];
+ this.menuGrantList1 = []; //card鐨則ree宸︿晶鐨勯�夐」
res.data.card.forEach(item=> {
this.menuGrantList.forEach(item1=> {
if(item.id == item1.id) {
@@ -246,15 +271,18 @@
})
this.menuActiveName = this.menuGrantList[0].title;//榛樿绗竴涓彍鍗�
this.setTreeList(this.menuGrantList,this.menuActiveName);//灞曠ず鏍戯紙宸︿晶鑿滃崟list锛屽乏渚ц彍鍗曞悕瀛楋級
- var lastId = [];
- var lastId = this.extractLastLevelIds(this.menuGrantList); //鑾峰彇鏈�鍚庝竴绾d
- var idarr = this.findOverlap(lastId,resp.data.menu); //鎵惧嚭涓や釜鏁扮粍閲嶅悎鐨勯儴鍒�
- var lastId1 = [];
- var lastId1 = this.extractLastLevelIds(this.menuGrantList1); //鑾峰彇鏈�鍚庝竴绾d
- var idarr1 = this.findOverlap(lastId1,resp.data.card); //鎵惧嚭涓や釜鏁扮粍閲嶅悎鐨勯儴鍒�
+ var idarr = resp.data.menu.concat(resp.data.card);
+ this.treeCheck = [...new Set(idarr)]; //鑾峰彇閫変腑鏁版嵁
+ // var lastId = [];
+ // var lastId = this.extractLastLevelIds(this.menuGrantList); //鑾峰彇鏈�鍚庝竴绾d
+ // var idarr = this.findOverlap(lastId,resp.data.menu); //鎵惧嚭涓や釜鏁扮粍閲嶅悎鐨勯儴鍒�
- this.treeCheck = [...idarr,...idarr1]; //鑾峰彇閫変腑鏁版嵁
+ // var lastId1 = [];
+ // var lastId1 = this.extractLastLevelIds(this.menuGrantList1); //鑾峰彇鏈�鍚庝竴绾d
+ // var idarr1 = this.findOverlap(lastId1,resp.data.card); //鎵惧嚭涓や釜鏁扮粍閲嶅悎鐨勯儴鍒�
+
+ // this.treeCheck = [...idarr,...idarr1]; //鑾峰彇閫変腑鏁版嵁
})
}
})
--
Gitblit v1.9.3