root
/
ok-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完善okTab

v1.0
bobi 2019-05-18 00:34:10 +08:00
parent 125fc53ded
commit 609e5c6318
7 changed files with 79 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
js/okadmin.js
View File

@ -1,7 +1,11 @@
layui.use(["element", "layer"], function () {
var element = layui.element;
layui.config({
base: "lib/okPlugins/"
}).extend({
okTab: "okTab",
}).use(["element", "layer", "okTab"], function () {
var $ = layui.jquery;
var layer = layui.layer;
var okTab = layui.okTab;
/**
* localhost运行提示
@ -37,90 +41,9 @@ layui.use(["element", "layer"], function () {
// var title = $(this).find("a").html();
var path = $(this).children("a").attr("path");
var tabId = $(this).children("a").attr("tab-id");
tabAdd(title, path, tabId);
okTab.add(title, path, tabId);
});
/**
* 添加tab
* @param title 标题
* @param path 路径
* @param tabId tabId必须唯一
*/
// window.tabAdd = function (title, path, tabId) {
// if (self == top) {
// // console.log("不在iframe中")
// tabAdd1(title, path, tabId)
// } else {
// // console.log("在iframe中")
// tabAdd2(title, path, tabId)
// }
// }
function tabAdd(title, path, tabId) {
// 参数校验
if (!parameterCheck(title, path, tabId)) {
return false;
}
// 去重复选项卡
var okFrame = $(".ok-frame");
for (var i = 0; i < okFrame.length; i++) {
var _tabId = okFrame.eq(i).attr("tab-id");
if (_tabId == tabId) {
element.tabChange("ok-tab", tabId);
event.stopPropagation();
return;
}
}
// 添加选项卡
element.tabAdd("ok-tab", {
title: title,
content: "<iframe src='" + path + "' tab-id='" + tabId + "' class='ok-frame' frameborder='0' scrolling='yes' width='100%' height='100%'></iframe>",
id: tabId
});
// 切换选项卡
element.tabChange("ok-tab", tabId);
}
// function tabAdd2(title, path, tabId) {
// // 参数校验
// parameterCheck(title, path, tabId);
// // 去重复选项卡
// var parentOkFrame = $(".ok-frame", parent.document);
// for (var i = 0; i < parentOkFrame.length; i++) {
// var _tabId = parentOkFrame.eq(i).attr("tab-id");
// if (_tabId == tabId) {
// console.warn("tabId=" + tabId + "有重复元素,请检查！")
// parent.layui.element.tabChange("ok-tab", tabId);
// event.stopPropagation();
// return;
// }
// }
// // 添加选项卡
// parent.layui.element.tabAdd("ok-tab", {
// title: title,
// content: "<iframe src='" + path + "' tab-id='" + tabId + "' class='ok-frame' frameborder='0' scrolling='yes' width='100%' height='100%'></iframe>",
// id: tabId
// });
// // 切换选项卡
// parent.layui.element.tabChange("ok-tab", tabId);
// }
function parameterCheck(title, path, tabId) {
if (title == undefined || title == "") {
console.error("title未定义")
return false;
}
if (path == undefined || path == "") {
console.error("path未定义")
return false;
}
if (tabId == undefined || tabId == "") {
console.error("tabId未定义")
return false;
}
return true;
}
/**
* 修改copyright结束时间
*/

49
lib/okPlugins/okTab.js
View File

@ -1,16 +1,14 @@
"use strict";
layui.define(["element", "layer"], function (exports) {
layui.define(["element"], function (exports) {
var element = window.top.layui.element;
var layer = layui.layer;
var $ = layui.jquery;
var okTab = {
add: function (title, path, tabId) {
console.log("title:", title, "path:", path, "tabId:", tabId);
// 参数校验
if (!okTab.parameterCheck(title, path, tabId)) {
return false;
}
// 参数校验
if (!okTab.parameterCheck(title, path, tabId)) {
return false;
}
// 去重复选项卡
var okFrame = $(".ok-frame", window.top.document);
for (var i = 0; i < okFrame.length; i++) {
@ -30,21 +28,28 @@ layui.define(["element", "layer"], function (exports) {
// 切换选项卡
element.tabChange("ok-tab", tabId);
},
parameterCheck: function(title, path, tabId) {
if (title == undefined || title == "") {
console.error("title未定义")
return false;
}
if (path == undefined || path == "") {
console.error("path未定义")
return false;
}
if (tabId == undefined || tabId == "") {
console.error("tabId未定义")
return false;
}
return true;
}
/**
* 参数校验
* @param title
* @param path
* @param tabId
* @returns {boolean}
*/
parameterCheck: function (title, path, tabId) {
if (title == undefined || title == "") {
console.error("title未定义")
return false;
}
if (path == undefined || path == "") {
console.error("path未定义")
return false;
}
if (tabId == undefined || tabId == "") {
console.error("tabId未定义")
return false;
}
return true;
}
}
exports("okTab", okTab);

2
lib/okPlugins/okUtils.js
View File

@ -99,7 +99,7 @@ layui.define("layer", function (exports) {
},
date: {
/**
* 格式化时间
* 格式化日期时间
* @param date
* @param fmt
* @returns {*}

1
pages/use/use-okLayer.html
View File

@ -71,7 +71,6 @@ okLayer.open("添加用户", "user-add.html", "90%", "90%", function() {})
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script src="../../js/okadmin.js"></script>
<script>
layui.use(["element", "code"], function () {
layui.code({about: false});

9
pages/use/use-okTab-sub.html
View File

@ -46,19 +46,18 @@ okTab.tabAdd("ok-tool", "http://www.xlbweb.cn", "11-1")
}).extend({
okTab: "okTab",
okLayer: "okLayer",
}).use(["element", "code", "okTab", "okLayer"], function () {
}).use(["element", "code", "okTab"], function () {
var $ = layui.jquery;
var okTab = layui.okTab;
var okLayer = layui.okLayer;
layui.code({about: false});
$("#addTab1").click(function () {
okTab.add("okLayer", "pages/use/use-okLayer.html", "12-1");
okTab.add("okLayerSub", "pages/use/use-okLayer.html", "12-1");
});
$("#addTab2").click(function () {
okTab.add("ok-tool", "http://tool.xlbweb.cn", "12-2");
okTab.add("ok-toolSub", "http://tool.xlbweb.cn", "12-2");
});
})
</script>

17
pages/use/use-okTab.html
View File

@ -67,7 +67,8 @@ okTab.tabAdd("ok-tool", "http://www.xlbweb.cn", "11-1")
<button class="layui-btn" id="addTab1">打开一个新的Tab1</button>
<button class="layui-btn" id="addTab2">打开一个新的Tab2</button>
<button class="layui-btn" id="addTab3">在子页面打开一个新的Tab3</button>
<button class="layui-btn" id="addTab3">参数填写的Tab2</button>
<button class="layui-btn" id="addTab4">在子页面打开一个新的Tab3</button>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
@ -87,14 +88,22 @@ okTab.tabAdd("ok-tool", "http://www.xlbweb.cn", "11-1")
$("#addTab1").click(function () {
okTab.add("okLayer", "pages/use/use-okLayer.html", "11-1");
});
$("#addTab2").click(function () {
okTab.add("ok-tool", "http://tool.xlbweb.cn", "11-2");
});
$("#addTab3").click(function () {
okLayer.open("子页面", "use-okTab-sub.html", "90%", "90%", function() {})
// 参数漏写
// okTab.add("test");
// okTab.add("test", "");
// okTab.add("test", "http://tool.xlbweb.cn");
okTab.add("test", "http://tool.xlbweb.cn", "");
});
$("#addTab4").click(function () {
okLayer.open("子页面", "use-okTab-sub.html", "90%", "90%", function() {})
});
})
</script>
</body>

29
pages/use/use-okUtils.html
View File

@ -41,11 +41,36 @@ okUtils.ajax("/user/batchDel", "post", {idsStr: idsStr}).done(function (response
<!--代码块2-->
<blockquote class="layui-elem-quote">
okUtils.xxx()
okUtils.table.xxx()
</blockquote>
<pre class="layui-code" lay-title="JavaScript" lay-encode="true">
xxx
// 做批量操作时，table行数据检查
okUtils.table.batchCheck(table)
// table页面操作执行成功后的提示
okUtils.table.successMsg()
</pre>
<!--代码块3-->
<blockquote class="layui-elem-quote">
okUtils.isNum()
</blockquote>
<pre class="layui-code" lay-title="JavaScript" lay-encode="true">
// 判断是否为一个正常的数字
okUtils.isNum()
// 判断一个数字是否包括在某个范围
okUtils.isNum(num, begin, end)
</pre>
<!--代码块3-->
<blockquote class="layui-elem-quote">
okUtils.date.xxx()
</blockquote>
<pre class="layui-code" lay-title="JavaScript" lay-encode="true">
// 格式化日期时间
okUtils.dateFormat(date, fmt)
</pre>
</div>
<!--js逻辑-->