Преглед изворни кода

feat(角色授权): 给角色授权时,增加对节点选中/不选中时的响应事件

qihao пре 2 година
родитељ
комит
26371dcd24
1 измењених фајлова са 21 додато и 0 уклоњено
  1. 21 0
      src/views/system/role/components/role-auth.vue

+ 21 - 0
src/views/system/role/components/role-auth.vue

@@ -14,11 +14,13 @@
       <el-tree
         ref="tree"
         show-checkbox
+        check-strictly
         :data="authData"
         node-key="id"
         :default-expand-all="true"
         :props="{ label: 'name' }"
         :default-checked-keys="checkedKeys"
+        @check="handleCheck"
       >
         <!-- <template v-slot="{ data }">
           <span>
@@ -126,6 +128,25 @@
       /* 更新visible */
       updateVisible(value) {
         this.$emit('update:visible', value);
+      },
+      handleCheck(data,node){
+        console.log(data);
+        const  _this = this
+        // 获取当前节点是否被选中
+        const isChecked = this.$refs.tree.getNode(data).checked
+        // 如果当前节点被选中,则遍历上级节点和下级子节点并选中,如果当前节点取消选中,则遍历下级节点并取消选中
+        if(isChecked){
+          // 判断该节点是否有下级节点,如果有那么遍历设置下级节点为选中
+          data.children && setChildrenChecked(data.children,true)
+        }else{
+          // 如果节点取消选中,不做处理
+        }
+        function setChildrenChecked(node,isChecked){
+          node.forEach(item => {
+            item.children && setChildrenChecked(item.children,isChecked)
+            _this.$refs.tree.setChecked(item.id,isChecked)
+          })
+        }
       }
     },
     watch: {