diff --git a/lib/layui/lay/okmodules/okTab.js b/lib/layui/lay/okmodules/okTab.js index 2b7501d..d6d6c72 100644 --- a/lib/layui/lay/okmodules/okTab.js +++ b/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 = $("
" + $("#tabTitle").html() + "
"); + 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 += ('{0}').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(""); - + if (_this.children("i").length < 1) { _this.prepend(""); } @@ -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); }); - + }); diff --git a/pages/article/article.html b/pages/article/article.html index 72e2a70..ce351a7 100644 --- a/pages/article/article.html +++ b/pages/article/article.html @@ -5,9 +5,6 @@ 文章列表 - - -