|
|
@@ -201,7 +201,7 @@ layui.config({
|
|
|
/**
|
|
|
* 菜单点击
|
|
|
*/
|
|
|
- $(".layui-tab-title li:eq(0) i").remove();
|
|
|
+ //$(".layui-tab-title li:eq(0) i").remove();
|
|
|
element.on('nav(menu)', (elem) => {
|
|
|
/*if (elem.parent().find('.layui-nav-child').length > 0
|
|
|
|| elem.data('menu') == $('.layui-tab-item').attr('menu')) {
|
|
|
@@ -219,28 +219,115 @@ layui.config({
|
|
|
if(!menu) {
|
|
|
return;
|
|
|
}
|
|
|
- let has = false;
|
|
|
+ let isTabAdd = true;
|
|
|
$(".layui-tab-title li").each((i,dom) => {
|
|
|
const layid = $(dom).attr("lay-id");
|
|
|
if(layid == menu){
|
|
|
- has = true;
|
|
|
+ isTabAdd = false;
|
|
|
return;
|
|
|
}
|
|
|
})
|
|
|
|
|
|
- if(has){
|
|
|
- element.tabChange('index-nev', menu);
|
|
|
- return;
|
|
|
+ if(isTabAdd == true){
|
|
|
+ //新增一个Tab项
|
|
|
+ active.tabAdd('view/' + menu + '.html', menu, elem.text())
|
|
|
}
|
|
|
|
|
|
- //新增一个Tab项
|
|
|
- element.tabAdd('index-nev', {
|
|
|
- title: elem.text()
|
|
|
- ,content: '<iframe class="fast-iframe" src="view/' + menu + '.html"></iframe>'
|
|
|
- ,id: menu
|
|
|
- })
|
|
|
- element.tabChange('index-nev', menu);
|
|
|
- $(".layui-tab-title li:eq(0) i").remove();
|
|
|
+
|
|
|
+ active.tabChange(menu);
|
|
|
+ // $(".layui-tab-title li:eq(0) i").remove();
|
|
|
|
|
|
});
|
|
|
-});
|
|
|
+
|
|
|
+ //触发事件
|
|
|
+ const active = {
|
|
|
+ tabfilter : 'index-nev',
|
|
|
+ //在这里给active绑定几项事件，后面可通过active调用这些事件
|
|
|
+ tabAdd: function (url, id, name) {
|
|
|
+ //新增一个Tab项 传入三个参数，分别对应其标题，tab页面的地址，还有一个规定的id，是标签中data-id的属性值
|
|
|
+ //关于tabAdd的方法所传入的参数可看layui的开发文档中基础方法部分
|
|
|
+ element.tabAdd(active.tabfilter, {
|
|
|
+ title: name,
|
|
|
+ content: '<iframe class="fast-iframe" data-frameid="' + id + '" src="' + url + '"></iframe>',
|
|
|
+ id: id //规定好的id
|
|
|
+ })
|
|
|
+ CustomRightClick(id); //给tab绑定右击事件
|
|
|
+ },
|
|
|
+ tabChange: function (id) {
|
|
|
+ //切换到指定Tab项
|
|
|
+ element.tabChange(active.tabfilter, id); //根据传入的id传入到指定的tab项
|
|
|
+ },
|
|
|
+ tabDelete: function (id) {
|
|
|
+ element.tabDelete(active.tabfilter, id);//删除
|
|
|
+ },
|
|
|
+ tabDeleteAll: function (ids) {//删除所有
|
|
|
+ $.each(ids, function (i, item) {
|
|
|
+ element.tabDelete(active.tabfilter, item); //ids是一个数组，里面存放了多个id，调用tabDelete方法分别删除
|
|
|
+ })
|
|
|
+ },
|
|
|
+ tabRefresh: function (id) { //刷新页面
|
|
|
+ $("iframe[data-frameid='" + id + "']").attr("src", $("iframe[data-frameid='" + id + "']").attr("src")) //刷新框架
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ let timeOutIndex = -1;
|
|
|
+ function CustomRightClick(id) {
|
|
|
+ //取消右键 rightmenu属性开始是隐藏的 ，当右击的时候显示，左击的时候隐藏
|
|
|
+ $('.layui-tab-title').on('contextmenu', function () { return false; })
|
|
|
+ $('body').click(function () {
|
|
|
+ $('.rightmenu').hide();
|
|
|
+ });
|
|
|
+ //桌面点击右击
|
|
|
+ $('.layui-tab-title').on('contextmenu', function (e) {
|
|
|
+ var popupmenu = $(".rightmenu");
|
|
|
+ popupmenu.find("li").attr("data-id", id); //在右键菜单中的标签绑定id属性
|
|
|
+
|
|
|
+ //判断右侧菜单的位置
|
|
|
+ l = ($(document).width() - e.clientX) < popupmenu.width() ? (e.clientX - popupmenu.width()) : e.clientX - 200;
|
|
|
+ t = ($(document).height() - e.clientY) < popupmenu.height() ? (e.clientY - popupmenu.height()) : e.clientY - 30;
|
|
|
+ popupmenu.css({ left: l, top: t }).show(); //进行绝对定位
|
|
|
+
|
|
|
+ if(timeOutIndex != -1){
|
|
|
+ clearTimeout(timeOutIndex);
|
|
|
+ }
|
|
|
+ timeOutIndex = setTimeout(() => {
|
|
|
+ $('.rightmenu').hide();
|
|
|
+ }, 3000)
|
|
|
+
|
|
|
+ //alert("右键菜单")
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ $(".rightmenu li").click(function () {
|
|
|
+
|
|
|
+ //右键菜单中的选项被点击之后，判断type的类型，决定关闭所有还是关闭当前。
|
|
|
+ if ($(this).attr("data-type") == "closethis") {
|
|
|
+ //如果关闭当前，即根据显示右键菜单时所绑定的id，执行tabDelete
|
|
|
+ active.tabDelete($(this).attr("data-id"))
|
|
|
+ } else if ($(this).attr("data-type") == "closeall") {
|
|
|
+ var tabtitle = $(".layui-tab-title li");
|
|
|
+ var ids = new Array();
|
|
|
+ $.each(tabtitle, function (i) {
|
|
|
+ ids[i] = $(this).attr("lay-id");
|
|
|
+ })
|
|
|
+ //如果关闭所有 ，即将所有的lay-id放进数组，执行tabDeleteAll
|
|
|
+ active.tabDeleteAll(ids);
|
|
|
+ } else if ($(this).attr("data-type") == "closeothe") {
|
|
|
+ var id = $(this).attr("data-id");
|
|
|
+ var tabtitle = $(".layui-tab-title li");
|
|
|
+ var ids = new Array();
|
|
|
+ $.each(tabtitle, function (i) {
|
|
|
+ if (id != $(this).attr("lay-id")) {
|
|
|
+ ids[i] = $(this).attr("lay-id");
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ active.tabDeleteAll(ids);
|
|
|
+ } else if ($(this).attr("data-type") == "refreshsys") {
|
|
|
+ location.reload();
|
|
|
+ } else if ($(this).attr("data-type") == "refreshthis") {
|
|
|
+ active.tabRefresh($(this).attr("data-id"))
|
|
|
+ }
|
|
|
+ })
|
|
|
+});
|
leihy