impr:导航展开收缩icon

css/okadmin.css

@@ -1,8 +1,17 @@
 @import "../lib/layui/css/layui.css";
 @import "../font/iconfont.css";
 @import "../lib/animate/animate.css";
-/*所有页面的CSS代码都写在这里*/
+
+/*全局样式*/
 html,body{width: 100%;height: 100%;}
+/*全站黑白色*/
+/*html{webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:grayscale(100%);filter:gray}*/
+
+/* 公共样式 */
+.tal{text-align:left;}
+.tac{text-align:center;}
+.tar{text-align:right;}
+
 /*登陆页面*/
 .login-body{background:url(../imgs/bg.png) no-repeat center center fixed;background-size:cover}
 .login-body .login-box{width:300px;height:300px;border:1px solid #1a312c;position:absolute;left:50%;top:50%;margin-left:-150px;margin-top:-150px;border-radius:5px}
@@ -26,7 +35,16 @@ html,body{width: 100%;height: 100%;}
 .menu-switch{width:30px;height:30px;position:relative;left:200px;top:16px;color:#fff;background-color:#1AA094;text-align:center;line-height:30px;cursor:pointer}
 .weather{margin: 15px 0 0 20px;}
 .textMarquee{float:left;width:450px;margin-top: 20px;}
-.layui-nav-tree .layui-nav-child a{padding-left:36px}
+/*nav导航菜单展开收缩图标 start*/
+.layui-nav.arrow1 .layui-nav-more{font-family:layui-icon !important;font-size:12px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;width:auto;height:auto;line-height:normal;border:none;top:15px;margin:0;padding:0;display:inline-block;transition:all .1s;-webkit-transition:all .1s}
+.layui-nav.arrow1 .layui-nav-more:before{content:"\e654"}
+.layui-nav.arrow1 .layui-nav-itemed > a > .layui-nav-more{transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);width:12px;text-align:center}
+.layui-nav.arrow1 .layui-nav-itemed > a > .layui-nav-more:before{content:'';width:8px;height:2px;background-color:rgba(255,255,255,.7);display:inline-block;vertical-align:middle}
+.layui-nav.arrow2 .layui-nav-more{font-family:layui-icon!important;font-size:12px;font-weight:600;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;line-height:normal;border:0;margin:-7px 0 0 0;padding:0;width:12px;height:12px;display:inline-block;-webkit-transition:all .3s ease;transition:all .3s ease}
+.layui-nav.arrow2 .layui-nav-more:before{content:"\e61a"}
+.layui-nav.arrow2 .layui-nav-itemed>a>.layui-nav-more{-ms-transform:rotate(-180deg);-moz-transform:rotate(-180deg);-webkit-transform:rotate(-180deg);-o-transform:rotate(-180deg);transform:rotate(-180deg)}
+/*nav导航菜单展开收缩图标 end*/
+.layui-nav-tree .layui-nav-child a{padding-left:36px;}
 .content-body{position:absolute;top:60px;right:0;bottom:42px;left:200px;z-index:1;overflow:hidden;}
 .content-body .layui-tab{margin:0;}
 .content-body .layui-tab-content{position:absolute;top:40px;bottom:0;width:100%;padding:0;z-index:-999;overflow:hidden}
@@ -85,11 +103,6 @@ okToolbar span{float:right;line-height:30px}
 ::-webkit-scrollbar-corner:vertical{background-color:#535353}
 ::-webkit-scrollbar-resizer:vertical{background-color:#FF6E00}
 
-/* 公共样式 */
-.tal{text-align:left;}
-.tac{text-align:center;}
-.tar{text-align:right;}
-
 /*三级菜单、四级菜单、五级菜单、六级菜单、七级菜单、八级菜单、九级菜单、十级菜单*/
 .layui-nav-tree .layui-nav-item .layui-nav-child .layui-nav-child a{padding-left: 54px;}
 .layui-nav-tree .layui-nav-item .layui-nav-child .layui-nav-child .layui-nav-child a{padding-left: 74px;}

data/menu.json

@@ -98,52 +98,52 @@
             "spread": false,
             "children": [
                 {
-                    "title": "登陆",
+                    "title": "登陆页面",
                     "path": "pages/other/login.html",
                     "font": "layui-icon",
-                    "icon": "",
+                    "icon": "",
                     "spread": false
                 },
                 {
-                    "title": "注册",
+                    "title": "注册页面",
                     "path": "pages/other/reg.html",
                     "font": "layui-icon",
-                    "icon": "",
+                    "icon": "",
                     "spread": false
                 },
                 {
                     "title": "忘记密码",
                     "path": "pages/other/forget.html",
                     "font": "layui-icon",
-                    "icon": "",
+                    "icon": "",
                     "spread": false
                 },
                 {
                     "title": "403页面",
                     "path": "pages/other/403.html",
-                    "font": "iconfont",
+                    "font": "layui-icon",
-                    "icon": "",
+                    "icon": "",
                     "spread": false
                 },
                 {
                     "title": "404页面",
                     "path": "pages/other/404.html",
-                    "font": "iconfont",
+                    "font": "layui-icon",
-                    "icon": "",
+                    "icon": "",
                     "spread": false
                 },
                 {
                     "title": "500页面",
                     "path": "pages/other/500.html",
-                    "font": "iconfont",
+                    "font": "layui-icon",
-                    "icon": "",
+                    "icon": "",
                     "spread": false
                 },
                 {
                     "title": "捐赠列表",
                     "path": "pages/other/donate.html",
-                    "font": "iconfont",
+                    "font": "layui-icon",
-                    "icon": "",
+                    "icon": "",
                     "spread": false
                 }
             ]

index.html

@@ -46,7 +46,8 @@
     <!--左侧导航区域-->
     <div class="layui-side layui-bg-black">
         <div class="layui-side-scroll">
-            <ul class="layui-nav layui-nav-tree" lay-shrink="all" lay-filter="navFilter">
+            <!--可自定义选择展开收缩图标: 默认|arrow1|arrow2-->
+            <ul class="layui-nav layui-nav-tree arrow2" lay-shrink="all" lay-filter="navFilter">
             </ul>
         </div>
     </div>

js/okadmin.js

@@ -1,16 +1,35 @@
 layui.use(["element", "layer", "okTab", "okMenu", "okUtils", "okLayer"], function () {
-    var element = layui.element;
+    let element = layui.element;
-    var layer = layui.layer;
+    let layer = layui.layer;
-    var okTab = layui.okTab;
+    let okTab = layui.okTab;
-    var okMenu = layui.okMenu;
+    let okMenu = layui.okMenu;
-    var $ = layui.jquery;
+    let $ = layui.jquery;
-    var okUtils = layui.okUtils;
+    let okUtils = layui.okUtils;
-    var okLayer = layui.okLayer;
+    let okLayer = layui.okLayer;
+
+    let config = {
+        /**
+         * 刷新页面后是否记住上次打开tab菜单
+         */
+        isRememberTab: true,
+        /**
+         * 是否显示底部版权信息
+         */
+        isShowCopyright: true,
+        /**
+         * 是否显示公告
+         */
+        isShowNotice: true,
+        /**
+         * 是否显示天气信息
+         */
+        isShowWeather: true
+    };
 
     /**
      * localhost运行提示
      */
-    var href = location.href;
+    let href = location.href;
     if (href.substring(0, 4) != "http") {
         layer.msg("请先部署到localhost环境下再访问！", {icon: 7, time: 3000, anim: 1});
     }
@@ -40,21 +59,25 @@ layui.use(["element", "layer", "okTab", "okMenu", "okUtils", "okLayer"], functio
      * 监听导航菜单的点击
      */
     element.on("nav(navFilter)", function (elem) {
-        var path = elem.context.attributes.path;
+        let path = elem.context.attributes.path;
         if (path && path.textContent != "") {
             // var title = elem.context.innerHTML;
-            var title = elem.context.innerText;
+            let title = elem.context.innerText;
             title = title.substring(title.indexOf(" "), title.length);
-            var path = path.textContent;
+            let pathValue = path.textContent;
-            okTab.add(title, path)
+            okTab.add(title, pathValue)
         }
     });
 
     /**
      * 修改copyright结束时间
      */
-    var data = new Date();
+    // if (!config.isShowCopyright) {
-    var year = data.getFullYear();
+    //     $(".layui-footer").remove();
+    //     $(".content-body").css("bottom", "0px");
+    // }
+    let data = new Date();
+    let year = data.getFullYear();
     $("#endYear").text(year);
 
     /**
@@ -99,7 +122,9 @@ layui.use(["element", "layer", "okTab", "okMenu", "okUtils", "okLayer"], functio
      * 弹窗皮肤
      */
     $("#alertSkin").click(function () {
-        okLayer.open("皮肤动画", "pages/system/alertSkin.html", "50%", "45%", function (layero) {}, function () {});
+        okLayer.open("皮肤动画", "pages/system/alertSkin.html", "50%", "45%", function (layero) {
+        }, function () {
+        });
     });
 
     /**
@@ -109,7 +134,12 @@ layui.use(["element", "layer", "okTab", "okMenu", "okUtils", "okLayer"], functio
         okLayer.confirm("确定要锁定账户吗？", function (index) {
             layer.close(index);
             $(".yy").show();
-            layer.prompt({btn: ['确定'], title: '输入密码解锁(123456)', closeBtn: 0, formType: 1}, function (value, index, elem) {
+            layer.prompt({
+                btn: ['确定'],
+                title: '输入密码解锁(123456)',
+                closeBtn: 0,
+                formType: 1
+            }, function (value, index, elem) {
                 if (value == "123456") {
                     layer.close(index);
                     $(".yy").hide();