Browse Source

左侧导航优化

yangc 7 years ago
parent
commit
9a39cd4631

+ 10 - 3
src/main/webapp/resources/js/index/app.js

@@ -24335,14 +24335,21 @@ define(['toaster', 'charts', 'ngTable', 'common/services', 'common/directives',
                 if (newObj.link) {
                     window.location.href = newObj.link
                 }
-                closeRow($scope.roleList);
                 roopCall($scope.roleList, function (item) {
                     if (item.roleId == newObj.roleId) {
                         $scope.currentObj = item;
+                        // item.collapsed = !item.collapsed;
+                    } else {
+                        item.collapsed = !hasChildrenObj(item) && (item.roleId != newObj.roleId);
                     }
-                    item.collapsed = !hasChildrenObj(item) && (item.roleId != newObj.roleId);
                 })
-                $scope.currentObj.selected = 'selected';
+                // 父级菜单不选择
+                if ($scope.currentObj.link) {
+                    closeRow($scope.roleList);
+                    $scope.currentObj.selected = 'selected';
+                } else {
+                    $scope.currentObj.selected = null;
+                }
             }
         }, false);
     }])

+ 11 - 5
src/main/webapp/resources/lib/treeview/css/angular.treeview.css

@@ -16,9 +16,10 @@ div[data-angular-treeview] {
 div[data-tree-model] ul {
   margin: 0;
   padding: 0;
-  list-style: none; 
+  list-style: none;
   border: none;
   overflow: hidden;
+  cursor: pointer;
 }
 
 div[data-tree-model] li {
@@ -81,14 +82,17 @@ div.treeView>ul>li>span{
   font-size: 14px;
   color: #333;
   font-weight: bold;
+  width: 88%;
 }
 div.treeView>ul>li>span.selected{
-    padding-left: 36px;
+  padding-left: 36px;
 }
 div.treeView>ul>li>div>ul>li>span{
   font-size: 14px;
   font-weight: bold;
   color: #666;
+  width: 76%;
+  padding-left: 22px;
 }
 div.treeView>ul>li:nth-child(2)>div>ul>li>span,div.treeView>ul>li:nth-child(4)>div>ul>li>span,div.treeView>ul>li:nth-child(5)>div>ul>li>span{
   font-weight: normal;
@@ -96,6 +100,8 @@ div.treeView>ul>li:nth-child(2)>div>ul>li>span,div.treeView>ul>li:nth-child(4)>d
 div.treeView>ul>li>div>ul>li>div>ul>li>span{
   font-size: 14px;
   color: #666;
+  width: 90%;
+  padding-left: 40px;
 }
 div.treeView>ul>li>i{
   margin-left: 10px;
@@ -103,10 +109,10 @@ div.treeView>ul>li>i{
   top: 8px;
 }
 div.treeView>ul>li>div>ul>li>i{
-  margin-left: 22px;
+  /*margin-left: 22px;*/
 }
 div.treeView>ul>li>div>ul>li>div>ul>li>i{
-  margin-left: 40px;
+  /*margin-left: 40px;*/
 }
 div.treeView>ul>li>div>ul>li>div>ul>li{
   /*width: 100%;*/
@@ -153,5 +159,5 @@ div[data-tree-model] li i, div[data-tree-model] li span {
 div[data-tree-model] li .selected {
   font-weight: bold;
   color: #3f84f6;
-  padding: 1px 5px;
+  /*padding: 1px 5px;*/
 }

+ 10 - 8
src/main/webapp/resources/lib/treeview/js/angular.treeview.js

@@ -47,13 +47,13 @@
 				//tree template
 				var template =
 					'<ul>' +
-						'<li data-ng-repeat="node in ' + treeModel + '"' + '>' +
-							'<i class="collapsed" data-ng-show="node.' + nodeChildren + '.length && node.collapsed" data-ng-click="' + treeId + '.selectNodeHead(node)"></i>' +
-							'<i class="expanded" data-ng-show="node.' + nodeChildren + '.length && !node.collapsed" data-ng-click="' + treeId + '.selectNodeHead(node)"></i>' +
+						'<li data-ng-repeat="node in ' + treeModel + '"' + ' data-ng-click="' + treeId + '.selectNodeLabel(node, $event)">' +
+							'<i class="collapsed" data-ng-show="node.' + nodeChildren + '.length && node.collapsed"></i>' +
+							'<i class="expanded" data-ng-show="node.' + nodeChildren + '.length && !node.collapsed"></i>' +
 							'<i class="normal" data-ng-hide="node.' + nodeChildren + '.length"></i> ' +
-							'<span data-ng-class="node.selected" data-ng-click="' + treeId + '.selectNodeLabel(node)">{{node.' + nodeLabel + '}}</span>' +
-							'<b data-ng-show="node.' + nodeChildren + '.length && node.collapsed" data-ng-click="' + treeId + '.selectNodeHead(node)"><i class="fa fa-angle-right"></i></b>' +
-							'<b data-ng-show="node.' + nodeChildren + '.length && !node.collapsed" data-ng-click="' + treeId + '.selectNodeHead(node)"><i class="fa fa-angle-down"></i></b>' +
+							'<span data-ng-class="node.selected">{{node.' + nodeLabel + '}}</span>' +
+							'<b data-ng-show="node.' + nodeChildren + '.length && node.collapsed"><i class="fa fa-angle-right"></i></b>' +
+							'<b data-ng-show="node.' + nodeChildren + '.length && !node.collapsed"><i class="fa fa-angle-down"></i></b>' +
 							'<b data-ng-hide="node.' + nodeChildren + '.length"><i class="fa fa-angle-right"></i></b> ' +
 							'<div data-ng-hide="node.collapsed" data-tree-id="' + treeId + '" data-tree-model="node.' + nodeChildren + '" data-node-id=' + nodeId + ' data-node-label=' + nodeLabel + ' data-node-children=' + nodeChildren + '></div>' +
 						'</li>' +
@@ -76,8 +76,10 @@
 							selectedNode.collapsed = !selectedNode.collapsed;
 						};
 						//if node label clicks,
-						scope[treeId].selectNodeLabel = scope[treeId].selectNodeLabel || function( selectedNode ){
-
+						scope[treeId].selectNodeLabel = scope[treeId].selectNodeLabel || function( selectedNode, e ){
+							if (e) {
+								e.stopPropagation();
+							}
 							//remove highlight from previous node
 							if( scope[treeId].currentNode && scope[treeId].currentNode.selected ) {
 								scope[treeId].currentNode.selected = undefined;