add tree

data/permission/tree.json

@@ -0,0 +1,14 @@
+[{
+	"title": "江西" 
+	,"children": [{
+	  "title": "南昌"
+	  ,"children": [{
+		"title": "高新区"
+	  }]
+	}]
+  },{
+	"title": "陕西"
+	,"children": [{
+	  "title": "西安"
+	}]
+  }]

pages/role/role-add.html

@@ -38,8 +38,7 @@
         <div class="layui-form-item">
             <label class="layui-form-label">权限</label>
             <div class="layui-input-block">
-                <!--权限树-->
-                <ul class="ztree" id="permissionTree"></ul>
+				<div id="permissionTree"></div>
             </div>
         </div>
         <div class="layui-form-item">
@@ -52,30 +51,18 @@
 </div>
 <!--js逻辑-->
 <script src="../../lib/layui/layui.js"></script>
-<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
-<script src="../../lib/zTree_v3/js/jquery.ztree.all.js"></script>
 <script type="text/javascript">
-    layui.use(["element", "form", "okLayer", "okUtils"], function () {
+    layui.use(["element", "form", "tree", "okLayer", "okUtils"], function () {
         var form = layui.form;
+		var tree = layui.tree;
         var okLayer = layui.okLayer;
         var okUtils = layui.okUtils;
 
-        // zTree设置
-        var setting = {
-            data: {
-                simpleData: {enable: true, idKey: "id", pIdKey: "parentId", rootPId: 0}
-            },
-            check: {enable: true, chkStyle: "checkbox", radioType: "all"}
-        };
-
-        // zTree异步请求所有权限树节点
-        var treeObj;
-        okUtils.ajax("../../data/permission-tree.json", "get").done(function (response) {
-            treeObj = $.fn.zTree.init($("#permissionTree"), setting, response);
-            treeObj.expandAll(true);
-        }).fail(function (error) {
-            console.log(error)
-        });
+        tree.render({
+		  elem: "#permissionTree",
+		  data: "../../data/permission/tree.json",
+		  showCheckbox: true
+		});
 
         form.on("submit(add)", function (data) {
             // 权限节点校验