add: tab刷新记忆

lib/layui/lay/okmodules/okTab.js

@@ -19,7 +19,7 @@ String.prototype.format = function () {
 };
 
 /**打开已经打开的tabMenu**/
-let OpenTabMenuFun = function ($,fun) {
+let OpenTabMenuFun = function ($, fun) {
    var tabMenu = localStorage.getItem("tabMenu");//已经打开的tab页面
    var tabMenuLeft = localStorage.getItem("tabMenuLeft");//tab的位置
    if (tabMenu) {
@@ -28,24 +28,28 @@ let OpenTabMenuFun = function ($,fun) {
          left: tabMenuLeft
       }, 50);
       $("#tabContent").html(tabMenu.tabContent);
-      if(typeof fun == 'function'){
+      if (typeof fun == 'function') {
          fun();
       }
    }
 };
+
 /**存储打开的tabMenu**/
 function saveTabMenuFun($) {
+   let tabTitle = $("<div>" + $("#tabTitle").html() + "</div>");
+   tabTitle.find("i.layui-tab-close").remove();
    let tabMenu = JSON.stringify({
-      tabTitle: $("#tabTitle").html(),
+      tabTitle: tabTitle.html(),
       tabContent: $("#tabContent").html()
    });
    localStorage.setItem('tabMenu', tabMenu);
    localStorage.setItem('tabMenuLeft', $("#tabTitle").css('left'));
 }
+
 /**tab的位置**/
-function saveTabMenuPosition(num){
-   // num = num || $("#tabTitle").css('left');
-   // localStorage.setItem('tabMenuLeft', num);
+function saveTabMenuPosition(num) {
+   num = num || $("#tabTitle").css('left');
+   localStorage.setItem('tabMenuLeft', num);
 }
 
 layui.define(["element", "jquery"], function (exports) {
@@ -62,7 +66,7 @@ layui.define(["element", "jquery"], function (exports) {
             parseData: ''//这是一个方法处理url请求地址的返回值(该方法必须提供一个返回值)
          }
       };
-   
+
    /**
     * 导航初始化的操作(只执行一次)
     * @param option 配置tabConfig参数
@@ -73,10 +77,10 @@ layui.define(["element", "jquery"], function (exports) {
       $.extend(true, _this.tabConfig, option); //函数用于将一个或多个对象的内容合并到目标对象。http://www.runoob.com/jquery/misc-extend.html
       this.tabDelete(); //关闭导航页的操作
       this.tab(); //tab导航切换时的操作
-      
+
       return _this;
    };
-   
+
    //生成左侧菜单
    var temp = "";
    okTab.prototype.navBar = function (strData) {
@@ -102,7 +106,7 @@ layui.define(["element", "jquery"], function (exports) {
       }
       return ulItem;
    };
-   
+
    /**
     * 递归生成菜单
     * @param data 数据
@@ -160,24 +164,24 @@ layui.define(["element", "jquery"], function (exports) {
             }
          }
          temp += ('<cite>{0}</cite></a>').format(data.title);
-         
+
       }
    }
-   
+
    /**
     * 定位tab位置
     * @param superEle 父级元素
     * @param ele 当前tab
     */
    okTab.prototype.positionTab = function (contEle, ele) {
-      
+
       var superEle = $(".ok-tab");//父级元素
       contEle = $(contEle);//tab内容存放的父元素
       ele = $(ele);//当前的tab
-      
+
       var menuSet = $(".okadmin-side a[lay-id]");//获取所有菜单集合
       var thatLayId = ele.attr('lay-id');
-      
+
       var contWidth = contEle.width(),//父级元素宽度
          superWidth = parseInt(superEle.width()) - 40 * 3,//可显示的宽度
          subWidth = ele.outerWidth(),//当前元素宽度
@@ -185,7 +189,7 @@ layui.define(["element", "jquery"], function (exports) {
          leftWidth = 0,//左边距离
          postLeft = Math.abs(contEle.position().left);//当前移动的位置
       var maxMoveWidth = contWidth - superWidth;//最大可移动的宽度
-      
+
       /*console.log("maxMoveWidth：" + maxMoveWidth);
       console.log("superWidth：" + superWidth);
       console.log("contWidth：" + contWidth);*/
@@ -227,7 +231,7 @@ layui.define(["element", "jquery"], function (exports) {
          /**存储tab位置**/
          saveTabMenuPosition(0);
       }
-      
+
       /**
        * 左侧菜单的样式和多级菜单的展开
        */
@@ -241,7 +245,7 @@ layui.define(["element", "jquery"], function (exports) {
          }
       }
    };
-   
+
    // 点击导航页的操作
    okTab.prototype.tab = function () {
       var that = this;
@@ -258,7 +262,7 @@ layui.define(["element", "jquery"], function (exports) {
          that.positionTab(elMove, thatElem);
       });
    };
-   
+
    //删除tab页的操作（此处为点击关闭按钮的操作）
    okTab.prototype.tabDelete = function () {
       var that = this;
@@ -270,12 +274,12 @@ layui.define(["element", "jquery"], function (exports) {
          saveTabMenuFun($);
       });
    };
-   
+
    //添加tab页
    okTab.prototype.tabAdd = function (_thisa) {
       var that = this;
       var _this = $(_thisa).clone(true);//拷贝dom（js： _this.cloneNode(true) ）
-      
+
       var openTabNum = that.tabConfig.openTabNum;
       var tabFilter = that.tabConfig.tabFilter;
       var url = _this.attr("data-url");//选项卡的页面路径
@@ -283,9 +287,9 @@ layui.define(["element", "jquery"], function (exports) {
       var thatTabNum = $('.ok-tab-title > li').length;//当前已经打开的选项卡的数量
       var iframes = $(".ok-tab-content iframe");
       var isClose = _this.attr('is-close') || "true";
-      
+
       _this.prepend("<strong style='display: none;' is-close=" + isClose + " lay-id=" + tabId + "></strong>");
-      
+
       if (_this.children("i").length < 1) {
          _this.prepend("<i class='layui-icon'></i>");
       }
@@ -316,7 +320,7 @@ layui.define(["element", "jquery"], function (exports) {
                return;
             }
          }
-         
+
          if (thatTabNum >= openTabNum) {
             layer.msg('最多只能同时打开' + openTabNum + '个选项卡哦。不然系统会卡的！');
             return;
@@ -329,15 +333,15 @@ layui.define(["element", "jquery"], function (exports) {
             content: contentIframe,
             id: tabId
          });
-         
+
          // 切换选项卡
          element.tabChange(tabFilter, tabId);
          this.navMove("rightmax");
          /**保存展开的tab**/
-         saveTabMenuFun($);
+         // saveTabMenuFun($);
       }
    };
-   
+
    //重新对导航进行渲染(此处有个回调函数，主要用作渲染完成之后的操作)
    okTab.prototype.render = function (fun) {
       var _this = this;//data
@@ -358,7 +362,7 @@ layui.define(["element", "jquery"], function (exports) {
             }
          });
          /**打开缓存中的tab**/
-         OpenTabMenuFun($,function () {
+         OpenTabMenuFun($, function () {
             // var filter = _this.tabConfig.tabFilter;
             element.render("tab");
          });
@@ -379,7 +383,7 @@ layui.define(["element", "jquery"], function (exports) {
          alert("你的菜单配置有误请查看菜单配置说明");
       }
    };
-   
+
    //刷新当前tab页
    okTab.prototype.refresh = function (_this) {
       if (!($(_this).hasClass("refreshThis"))) {
@@ -392,7 +396,7 @@ layui.define(["element", "jquery"], function (exports) {
          layer.msg("客官请不要频繁点击哦！我会反应不过来的");
       }
    };
-   
+
    /**
     * 关闭tab标签页操作
     * @param num 默认为1
@@ -406,7 +410,7 @@ layui.define(["element", "jquery"], function (exports) {
       var that = this;
       let openTabs = $('.ok-tab-title > li strong[lay-id]').not('strong[is-close=false]'),//获取已打开的tab元素(除开不会被关闭的导航)
          thatLayID = $('.ok-tab-title > li.layui-this strong[lay-id]').not('strong[is-close=false]').attr("lay-id") || '';//获取当前打开的tab元素ID(除开不会被关闭的导航)
-      
+
       var filter = that.tabConfig.tabFilter;
       if (thatLayID.length < 1 && num == 1) {
          layer.msg("您不能关闭当前页哦 (๑╹◡╹)ﾉ");
@@ -443,7 +447,7 @@ layui.define(["element", "jquery"], function (exports) {
       /**保存展开的tab**/
       saveTabMenuFun($);
    };
-   
+
    /**
     * 移动标签导航
     * @param moveId
@@ -459,11 +463,11 @@ layui.define(["element", "jquery"], function (exports) {
          contWidth = parseInt(contEle.width()),//移动元素的总宽度
          elTabs = $(".ok-tab-title li"),//所有已存在的tab集合
          postLeft = contEle.position().left;//当前移动的位置
-      
+
       /*elTabs.each(function (i, j) {
         moveWidth += $(j).outerWidth() * 1;
       });*/
-      
+
       var movePost = moveId.toLowerCase().indexOf("left") < 0 ? -1 : 1;//移动方向
       var step = parseInt((superWidth * 0.25 < 20 ? 20 : superWidth * 0.25));//移动步长
       var moveLeft = postLeft + step * movePost;
@@ -523,10 +527,10 @@ layui.define(["element", "jquery"], function (exports) {
          saveTabMenuPosition(0);
       }
    };
-   
+
    exports("okTab", function (option) {
       return new okTab().init(option);
    });
-   
+
 });
 

pages/article/article.html

@@ -5,9 +5,6 @@
     <title>文章列表</title>
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
     <link rel="stylesheet" href="../../lib/layui/css/layui.css">
-    <link rel="stylesheet" href="../../css/scroll-bar.css">
-    <link rel="stylesheet" href="../../css/sub-page.css">
-    <link rel="stylesheet" href="//at.alicdn.com/t/font_693759_wytlyqhtdtj1nhfr.css">
     <link rel="stylesheet" href="../../lib/nprogress/nprogress.css">
 </head>
 <body>