lilei 2 years ago
parent
commit
379034795d
1 changed files with 42 additions and 4 deletions
  1. 42 4
      src/views/power/role/menuModal.vue

+ 42 - 4
src/views/power/role/menuModal.vue

@@ -28,9 +28,11 @@
             :autoExpandParent="autoExpandParent"
             v-model="checkedKeys"
             :treeData="treeData"
-          />
+          >
+          <a-icon v-if="authType == 0" slot="switcherIcon" type="file" />
+          </a-tree>
           </div>
-          <a-form-model-item :label-col="{span: 0}" :wrapper-col="{span: 24}" style="text-align: center;">
+          <a-form-model-item :label-col="{span: 0}" :wrapper-col="{span: 24}" style="text-align: center;margin: 18px 0 0;">
             <a-button type="primary" id="roleMenuEdit-save" @click="handleSubmit()" :style="{ marginRight: '8px' }">保存</a-button>
             <a-button id="roleMenuEdit-cancel" :style="{ marginLeft: '8px' }" @click="isshow=false">取消</a-button>
           </a-form-model-item>
@@ -91,7 +93,7 @@ export default {
       // this.autoExpandParent = false
     },
     onCheck (checkedKeys, info) {
-      console.log(checkedKeys, info.halfCheckedKeys)
+      // console.log(checkedKeys, info.halfCheckedKeys)
       this.halfCheckedKeys = info.halfCheckedKeys
       this.checkedKeys = checkedKeys
     },
@@ -148,6 +150,7 @@ export default {
           if(_this.isPriceNode(node)){
             data.splice(i,1)
           }else{
+            node.class = 'isLeaf'
             const hasNode = arr.find(item => item == node.id)
             const hasCheck = _this.checkedKeys.find(item => item == node.id)
             if (hasNode && !hasCheck) {
@@ -166,6 +169,7 @@ export default {
         if(!_this.isPriceNode(node)){
           // 删除此节点
           node.checkable = false
+          node.title = node.title.replace('(必选)','')
           if(!node.children||node.children.length==0){
             data.splice(i,1)
           }
@@ -195,6 +199,7 @@ export default {
       this.checkedData = arr ? arr.split(',') : []
       // 找出叶子节点
       const treeData = this.nowData.allMenuList
+      
       this.expandedKeys.push(treeData.id)
       if(this.authType == 1){
         this.findLeaf(treeData, this.checkedData)
@@ -206,6 +211,21 @@ export default {
       // console.log(this.checkedData)
       // console.log(this.checkedKeys)
       this.treeData = treeData
+
+      if(this.authType == 0){
+        let leafNodes = []
+        setTimeout(()=>{
+          if(leafNodes.length == 0){
+            leafNodes = document.querySelectorAll('ul > li.leafNode:first-child')
+            for(let i=0;i<leafNodes.length;i++){
+              const cn = leafNodes[i].parentNode.className
+              leafNodes[i].parentNode.className += cn.indexOf('leafParent')<0 ? ' leafParent' : ''
+              leafNodes[i].parentNode.parentNode.style.padding = '6px 0'
+            }
+          }
+        },100)
+      }
+      
     }
   },
   watch: {
@@ -260,10 +280,28 @@ export default {
     -webkit-box-shadow: inset 0 0 2px #d1d1d1;
     background: #e4e4e4;
   }
+  .ant-tree li ul{
+    white-space: pre-wrap;
+  }
+
+  .leafParent{
+    display: inline-block;
+    width: 80%;
+    float: right;
+  }
+  
+  .isLeaf{
+    display: inline-block;
+    width: 25%;
+  }
   .leafNode{
     display: inline-block;
+    padding: 0;
+    &:first-child{
+      padding: 0;
+    }
     .ant-tree-node-content-wrapper{
-      color: red;
+      color: rgb(209, 4, 4);
     }
   }
 }