菜单增加左侧树

src/main/webapp/WEB-INF/system/menu/menu.html

-@layout("/common/_container.html",{plugins:["table","layer","sweet-alert"],js:["/assets/modular/system/menu/menu.js"]}){
+@layout("/common/_container.html",{plugins:["table","layer","sweet-alert","ztree"],js:["/assets/modular/system/menu/menu.js"]}){
 <div class="row" id="menuPage">
+    <div class="col-lg-2 col-sm-3 p-r-0">
+        <div class="card card-outline-theme">
+            <div class="card-header">
+                <h5 class="m-b-0 text-white">菜单树</h5>
+            </div>
+            <div class="card-body">
+                <ul id="menuTree" class="ztree"></ul>
+            </div>
+        </div>
+    </div>
+    <div class="col-lg-10 col-sm-9">
+        <div class="row">
             <div class="col-lg-12">
                 <div class="card card-outline-theme m-b-10">
                     <div class="card-body">
@@ -37,8 +49,8 @@
                     </div>
                 </div>
             </div>
-</div>
-<div class="row">
+        </div>
+        <div class="row">
             <div class="col-lg-12">
                 <div class="card card-outline-theme m-b-0">
                     <div class="card-body p-t-0 p-b-0">
@@ -73,5 +85,7 @@
                     </div>
                 </div>
             </div>
+        </div>
+    </div>
 </div>
 @}
\ No newline at end of file

src/main/webapp/assets/modular/system/menu/menu.js

@@ -8,7 +8,8 @@ var Menu = {
     layerIndex: -1,
     condition: {
         menuName: "",
-        level: ""
+        level: "",
+        menuId: ""
     }
 };
 
@@ -101,18 +102,31 @@ Menu.delMenu = function () {
 Menu.search = function () {
     var queryData = {};
 
+    queryData['menuId'] = Menu.condition.menuId;
     queryData['menuName'] = Menu.condition.menuName;
     queryData['level'] = Menu.condition.level;
 
     Menu.table.refresh({query: queryData});
 };
 
+/**
+ * 选择菜单树时候
+ */
+Menu.onClickMenuTree = function (e, treeId, treeNode) {
+    Menu.condition.menuId = treeNode.id;
+    Menu.search();
+};
+
 $(function () {
     Menu.app = new Vue({
         el: '#menuPage',
         data: Menu.condition
     });
 
+    var ztree = new $ZTree("menuTree", "/menu/selectMenuTreeList");
+    ztree.bindOnClick(Menu.onClickMenuTree);
+    ztree.init();
+
     var defaultColunms = Menu.initColumn();
     var table = new BSTable(Menu.id, "/menu/list", defaultColunms);
     table.setPaginationType("client");