创建了管理后台

2020-06-23 17:33:56 +08:00
parent d2b2e8d262
commit 75c563c714
4 changed files with 237 additions and 0 deletions
--- a/web/admin/html/body/header_edit.html
+++ b/web/admin/html/body/header_edit.html
@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+    <title>头部编辑
+    </title>
+    <link rel="stylesheet" href="/layui/css/layui.css">
+</head>
+
+<body>
+    <div class="layui-layout layui-layout-admin">
+        <div id="header"></div>
+        <div id="side"></div>
+        <div class="layui-body" style="left: 250px; top: 100px;">
+            <button id="button">test</button>
+            <div id="test1"></div>
+        </div>
+        <div id="footer"></div>
+    </div>
+
+    <script src="/layui/layui.js"></script>
+    <script src="/js/jquery-3.2.1.js"></script>
+    <script>
+        var inst1
+        var tree
+        var myData = [{
+            title: 'ROOT' //一级菜单
+            , id: 1
+            , checked: false
+        }]
+        layui.use(['layer', 'form', 'element', 'tree'], function () {
+            var layer = layui.layer
+                , form = layui.form;
+            var element = layui.element;
+            tree = layui.tree;
+            var index=1;
+            inst1 = tree.render({
+                elem: '#test1'  //绑定元素
+                , edit: ['add', 'update', 'del']
+                , data: myData
+                , id: 'myData'
+                , showCheckbox: false
+                , operate: function (obj) {
+                    var type = obj.type; //得到操作类型：add、update、del
+                    var data = obj.data; //得到当前节点的数据
+                    var elem = obj.elem; //得到当前节点元素
+                    if(type==='add'){
+                        ++index;
+                        return index;
+                    }else if(type==='update'){
+                        console.log(JSON.stringify(data))
+                        console.log(JSON.stringify(elem))
+                    }else{
+                        
+                    }
+                   
+                }
+
+            });
+
+        });
+        $('#header').load("/admin/html/header.html");
+        $('#side').load("/admin/html/side.html");
+        $('#footer').load("/html/footer.html");
+        $('#button').click(function () {
+            layer.msg(JSON.stringify(tree.getChecked('myData')))
+        })
+    </script>
+    <style>
+        #icon {
+            float: right;
+        }
+
+        .body {
+            bottom: 0;
+        }
+    </style>
+</body>
+
+</html>