ulthon/ulthon_admin
1
0
Fork 0
mirror of https://gitee.com/ulthon/ulthon_admin.git synced 2026-07-09 03:22:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

将js代码架构改为app下渲染；

Browse Source
This commit is contained in:
augushong
2023-09-18 16:32:46 +08:00
parent 4d9434454e
commit ca729da0a9
86 changed files with 1572 additions and 719 deletions
Download Patch File Download Diff File Expand all files Collapse all files

189
public/static/plugs/lay-module/layuimini/miniTab.js
View File

@@ -1,16 +1,8 @@
/**
* date:2020/02/27
* author:Mr.Chung
* version:2.0
* description:layuimini tab框架扩展
*/
define(["jquery"], function ($) {
var element = layui.element,
$ = layui.$;
(function () {
var element = layui.element;
$ = layui.$;
var miniTab = {
/**
* 初始化tab
* @param options
@@ -20,10 +12,9 @@ define(["jquery"], function ($) {
options.multiModule = options.multiModule || false;
options.urlHashLocation = options.urlHashLocation || false;
options.maxTabNum = options.maxTabNum || 20;
options.menuList = options.menuList || []; // todo 后期菜单想改为不操作dom, 而是直接操作初始化传过来的数据
options.menuList = options.menuList || []; // todo 后期菜单想改为不操作dom, 而是直接操作初始化传过来的数据
options.homeInfo = options.homeInfo || {};
options.listenSwichCallback = options.listenSwichCallback || function () {
};
options.listenSwichCallback = options.listenSwichCallback || function () { };
miniTab.listen(options);
miniTab.listenRoll();
miniTab.listenSwitch(options);
@@ -44,22 +35,27 @@ define(["jquery"], function ($) {
options.title = options.title || null;
options.isIframe = options.isIframe || false;
options.maxTabNum = options.maxTabNum || 20;
if ($(".layuimini-tab .layui-tab-title li").length >= options.maxTabNum) {
if ($('.layuimini-tab .layui-tab-title li').length >= options.maxTabNum) {
layer.msg('Tab窗口已达到限定数量，请先关闭部分Tab');
return false;
}
var ele = element;
if (options.isIframe) ele = parent.layui.element;
ele.tabAdd('layuiminiTab', {
title: '<span class="layuimini-tab-active"></span><span>' + options.title + '</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>' //用于演示
, content: '<iframe width="100%" height="100%" frameborder="no" border="0" marginwidth="0" marginheight="0" src="' + options.href + '"></iframe>'
, id: options.tabId
title:
'<span class="layuimini-tab-active"></span><span>' +
options.title +
'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>', //用于演示
content:
'<iframe width="100%" height="100%" frameborder="no" border="0" marginwidth="0" marginheight="0" src="' +
options.href +
'"></iframe>',
id: options.tabId,
});
$('.layuimini-menu-left').attr('layuimini-tab-tag', 'add');
sessionStorage.setItem('layuiminimenu_' + options.tabId, options.title);
},
/**
* 切换选项卡
* @param tabId
@@ -75,7 +71,7 @@ define(["jquery"], function ($) {
*/
delete: function (tabId, isParent) {
// todo 未知BUG，不知道是不是layui问题，必须先删除元素
$(".layuimini-tab .layui-tab-title .layui-unselect.layui-tab-bar").remove();
$('.layuimini-tab .layui-tab-title .layui-unselect.layui-tab-bar').remove();
if (isParent === true) {
parent.layui.element.tabDelete('layuiminiTab', tabId);
@@ -90,7 +86,7 @@ define(["jquery"], function ($) {
openNewTabByIframe: function (options) {
options.href = options.href || null;
options.title = options.title || null;
var loading = parent.layer.load(0, {shade: false, time: 2 * 1000});
var loading = parent.layer.load(0, { shade: false, time: 2 * 1000 });
if (options.href === null || options.href === undefined) options.href = new Date().getTime();
var checkTab = miniTab.check(options.href, true);
if (!checkTab) {
@@ -109,7 +105,7 @@ define(["jquery"], function ($) {
* 在iframe层关闭当前tab方法
*/
deleteCurrentByIframe: function () {
var ele = $(".layuimini-tab .layui-tab-title li.layui-this", parent.document);
var ele = $('.layuimini-tab .layui-tab-title li.layui-this', parent.document);
if (ele.length > 0) {
var layId = $(ele[0]).attr('lay-id');
miniTab.delete(layId, true);
@@ -123,14 +119,14 @@ define(["jquery"], function ($) {
// 判断选项卡上是否有
var checkTab = false;
if (isIframe === undefined || isIframe === false) {
$(".layui-tab-title li").each(function () {
$('.layui-tab-title li').each(function () {
var checkTabId = $(this).attr('lay-id');
if (checkTabId != null && checkTabId === tabId) {
checkTab = true;
}
});
} else {
parent.layui.$(".layui-tab-title li").each(function () {
parent.layui.$('.layui-tab-title li').each(function () {
var checkTabId = $(this).attr('lay-id');
if (checkTabId != null && checkTabId === tabId) {
checkTab = true;
@@ -147,7 +143,12 @@ define(["jquery"], function ($) {
*/
openTabRignMenu: function (tabId, left) {
miniTab.closeTabRignMenu();
var menuHtml = '<div class="layui-unselect layui-form-select layui-form-selected layuimini-tab-mousedown layui-show" data-tab-id="' + tabId + '" style="left: ' + left + 'px!important">\n' +
var menuHtml =
'<div class="layui-unselect layui-form-select layui-form-selected layuimini-tab-mousedown layui-show" data-tab-id="' +
tabId +
'" style="left: ' +
left +
'px!important">\n' +
'<dl>\n' +
'<dd><a href="javascript:;" layuimini-tab-menu-close="current">关 闭 当 前</a></dd>\n' +
'<dd><a href="javascript:;" layuimini-tab-menu-close="other">关 闭 其 他</a></dd>\n' +
@@ -203,22 +204,22 @@ define(["jquery"], function ($) {
* 打开新窗口
*/
$('body').on('click', '[layuimini-href]', function () {
var loading = layer.load(0, {shade: false, time: 2 * 1000});
var loading = layer.load(0, { shade: false, time: 2 * 1000 });
var tabId = $(this).attr('layuimini-href'),
href = $(this).attr('layuimini-href'),
title = $(this).text(),
target = $(this).attr('target');
var el = $("[layuimini-href='" + href + "']", ".layuimini-menu-left");
var el = $("[layuimini-href='" + href + "']", '.layuimini-menu-left');
layer.close(window.openTips);
if (el.length) {
$(el).closest(".layui-nav-tree").find(".layui-this").removeClass("layui-this");
$(el).parent().addClass("layui-this");
$(el).closest('.layui-nav-tree').find('.layui-this').removeClass('layui-this');
$(el).parent().addClass('layui-this');
}
if (target === '_blank') {
layer.close(loading);
window.open(href, "_blank");
window.open(href, '_blank');
return false;
}
@@ -241,14 +242,14 @@ define(["jquery"], function ($) {
* 在iframe子菜单上打开新窗口
*/
$('body').on('click', '[layuimini-content-href]', function () {
var loading = parent.layer.load(0, {shade: false, time: 2 * 1000});
var loading = parent.layer.load(0, { shade: false, time: 2 * 1000 });
var tabId = $(this).attr('layuimini-content-href'),
href = $(this).attr('layuimini-content-href'),
title = $(this).attr('data-title'),
target = $(this).attr('target');
if (target === '_blank') {
parent.layer.close(loading);
window.open(href, "_blank");
window.open(href, '_blank');
return false;
}
if (tabId === null || tabId === undefined) tabId = new Date().getTime();
@@ -270,7 +271,7 @@ define(["jquery"], function ($) {
* 关闭选项卡
**/
$('body').on('click', '.layuimini-tab .layui-tab-title .layui-tab-close', function () {
var loading = layer.load(0, {shade: false, time: 2 * 1000});
var loading = layer.load(0, { shade: false, time: 2 * 1000 });
var $parent = $(this).parent();
var tabId = $parent.attr('lay-id');
if (tabId !== undefined || tabId !== null) {
@@ -283,9 +284,9 @@ define(["jquery"], function ($) {
* 选项卡操作
*/
$('body').on('click', '[layuimini-tab-close]', function () {
var loading = layer.load(0, {shade: false, time: 2 * 1000});
var loading = layer.load(0, { shade: false, time: 2 * 1000 });
var closeType = $(this).attr('layuimini-tab-close');
$(".layuimini-tab .layui-tab-title li").each(function () {
$('.layuimini-tab .layui-tab-title li').each(function () {
var tabId = $(this).attr('lay-id');
var id = $(this).attr('id');
var isCurrent = $(this).hasClass('layui-this');
@@ -307,16 +308,18 @@ define(["jquery"], function ($) {
/**
* 禁用网页右键
*/
$(".layuimini-tab .layui-tab-title").unbind("mousedown").bind("contextmenu", function (e) {
e.preventDefault();
return false;
});
$('.layuimini-tab .layui-tab-title')
.unbind('mousedown')
.bind('contextmenu', function (e) {
e.preventDefault();
return false;
});
/**
* 注册鼠标右键
*/
$('body').on('mousedown', '.layuimini-tab .layui-tab-title li', function (e) {
var left = $(this).offset().left - $('.layuimini-tab ').offset().left + ($(this).width() / 2),
var left = $(this).offset().left - $('.layuimini-tab ').offset().left + $(this).width() / 2,
tabId = $(this).attr('lay-id');
if (e.which === 3) {
miniTab.openTabRignMenu(tabId, left);
@@ -334,10 +337,10 @@ define(["jquery"], function ($) {
* tab右键选项卡操作
*/
$('body').on('click', '[layuimini-tab-menu-close]', function () {
var loading = layer.load(0, {shade: false, time: 2 * 1000});
var loading = layer.load(0, { shade: false, time: 2 * 1000 });
var closeType = $(this).attr('layuimini-tab-menu-close'),
currentTabId = $('.layuimini-tab-mousedown').attr('data-tab-id');
$(".layuimini-tab .layui-tab-title li").each(function () {
$('.layuimini-tab .layui-tab-title li').each(function () {
var tabId = $(this).attr('lay-id');
var id = $(this).attr('id');
if (id !== 'layuiminiHomeTabId') {
@@ -365,9 +368,7 @@ define(["jquery"], function ($) {
options.filter = options.filter || null;
options.multiModule = options.multiModule || false;
options.urlHashLocation = options.urlHashLocation || false;
options.listenSwichCallback = options.listenSwichCallback || function () {
};
options.listenSwichCallback = options.listenSwichCallback || function () { };
element.on('tab(' + options.filter + ')', function (data) {
var tabId = $(this).attr('lay-id');
if (options.urlHashLocation) {
@@ -378,9 +379,9 @@ define(["jquery"], function ($) {
}
// 判断是否为新增窗口
if ($('.layuimini-menu-left').attr('layuimini-tab-tag') === 'add') {
$('.layuimini-menu-left').attr('layuimini-tab-tag', 'no')
$('.layuimini-menu-left').attr('layuimini-tab-tag', 'no');
} else {
$("[layuimini-href]").parent().removeClass('layui-this');
$('[layuimini-href]').parent().removeClass('layui-this');
if (options.multiModule) {
miniTab.listenSwitchMultiModule(tabId);
} else {
@@ -403,10 +404,10 @@ define(["jquery"], function ($) {
options.menuList = options.menuList || [];
if (!options.urlHashLocation) return false;
var tabId = location.hash.replace(/^#/, '');
if (tabId === null || tabId === undefined || tabId ==='') return false;
if (tabId === null || tabId === undefined || tabId === '') return false;
// 判断是否为首页
if(tabId ===options.homeInfo.href) return false;
if (tabId === options.homeInfo.href) return false;
// 判断是否为右侧菜单
var menu = miniTab.searchMenu(tabId, options.menuList);
@@ -425,9 +426,9 @@ define(["jquery"], function ($) {
// 判断是否为快捷菜单
var isSearchMenu = false;
$("[layuimini-content-href]").each(function () {
if ($(this).attr("layuimini-content-href") === tabId) {
var title = $(this).attr("data-title");
$('[layuimini-content-href]').each(function () {
if ($(this).attr('layuimini-content-href') === tabId) {
var title = $(this).attr('data-title');
miniTab.create({
tabId: tabId,
href: tabId,
@@ -444,7 +445,10 @@ define(["jquery"], function ($) {
if (isSearchMenu) return false;
// 既不是右侧菜单、快捷菜单,就直接打开
var title = sessionStorage.getItem('layuiminimenu_' + tabId) === null ? tabId : sessionStorage.getItem('layuiminimenu_' + tabId);
var title =
sessionStorage.getItem('layuiminimenu_' + tabId) === null
? tabId
: sessionStorage.getItem('layuiminimenu_' + tabId);
miniTab.create({
tabId: tabId,
href: tabId,
@@ -460,11 +464,11 @@ define(["jquery"], function ($) {
* 监听滚动
*/
listenRoll: function () {
$(".layuimini-tab-roll-left").click(function () {
miniTab.rollClick("left");
$('.layuimini-tab-roll-left').click(function () {
miniTab.rollClick('left');
});
$(".layuimini-tab-roll-right").click(function () {
miniTab.rollClick("right");
$('.layuimini-tab-roll-right').click(function () {
miniTab.rollClick('right');
});
},
@@ -473,21 +477,21 @@ define(["jquery"], function ($) {
* @param tabId
*/
listenSwitchSingleModule: function (tabId) {
$("[layuimini-href]").each(function () {
if ($(this).attr("layuimini-href") === tabId) {
$('[layuimini-href]').each(function () {
if ($(this).attr('layuimini-href') === tabId) {
// 自动展开菜单栏
var addMenuClass = function ($element, type) {
if (type === 1) {
$element.addClass('layui-this');
if ($element.hasClass('layui-nav-item') && $element.hasClass('layui-this')) {
$(".layuimini-header-menu li").attr('class', 'layui-nav-item');
$('.layuimini-header-menu li').attr('class', 'layui-nav-item');
} else {
addMenuClass($element.parent().parent(), 2);
}
} else {
$element.addClass('layui-nav-itemed');
if ($element.hasClass('layui-nav-item') && $element.hasClass('layui-nav-itemed')) {
$(".layuimini-header-menu li").attr('class', 'layui-nav-item');
$('.layuimini-header-menu li').attr('class', 'layui-nav-item');
} else {
addMenuClass($element.parent().parent(), 2);
}
@@ -504,19 +508,21 @@ define(["jquery"], function ($) {
* @param tabId
*/
listenSwitchMultiModule: function (tabId) {
$("[layuimini-href]").each(function () {
if ($(this).attr("layuimini-href") === tabId) {
$('[layuimini-href]').each(function () {
if ($(this).attr('layuimini-href') === tabId) {
// 自动展开菜单栏
var addMenuClass = function ($element, type) {
if (type === 1) {
$element.addClass('layui-this');
if ($element.hasClass('layui-nav-item') && $element.hasClass('layui-this')) {
var moduleId = $element.parent().attr('id');
$(".layuimini-header-menu li").attr('class', 'layui-nav-item');
$("#" + moduleId + "HeaderId").addClass("layui-this");
$(".layuimini-menu-left .layui-nav.layui-nav-tree").attr('class', 'layui-nav layui-nav-tree layui-hide');
$("#" + moduleId).attr('class', 'layui-nav layui-nav-tree layui-this');
$('.layuimini-header-menu li').attr('class', 'layui-nav-item');
$('#' + moduleId + 'HeaderId').addClass('layui-this');
$('.layuimini-menu-left .layui-nav.layui-nav-tree').attr(
'class',
'layui-nav layui-nav-tree layui-hide',
);
$('#' + moduleId).attr('class', 'layui-nav layui-nav-tree layui-this');
} else {
addMenuClass($element.parent().parent(), 2);
}
@@ -524,10 +530,13 @@ define(["jquery"], function ($) {
$element.addClass('layui-nav-itemed');
if ($element.hasClass('layui-nav-item') && $element.hasClass('layui-nav-itemed')) {
var moduleId = $element.parent().attr('id');
$(".layuimini-header-menu li").attr('class', 'layui-nav-item');
$("#" + moduleId + "HeaderId").addClass("layui-this");
$(".layuimini-menu-left .layui-nav.layui-nav-tree").attr('class', 'layui-nav layui-nav-tree layui-hide');
$("#" + moduleId).attr('class', 'layui-nav layui-nav-tree layui-this');
$('.layuimini-header-menu li').attr('class', 'layui-nav-item');
$('#' + moduleId + 'HeaderId').addClass('layui-this');
$('.layuimini-menu-left .layui-nav.layui-nav-tree').attr(
'class',
'layui-nav layui-nav-tree layui-hide',
);
$('#' + moduleId).attr('class', 'layui-nav layui-nav-tree layui-this');
} else {
addMenuClass($element.parent().parent(), 2);
}
@@ -545,16 +554,19 @@ define(["jquery"], function ($) {
rollPosition: function () {
var $tabTitle = $('.layuimini-tab .layui-tab-title');
var autoLeft = 0;
$tabTitle.children("li").each(function () {
$tabTitle.children('li').each(function () {
if ($(this).hasClass('layui-this')) {
return false;
} else {
autoLeft += $(this).outerWidth();
}
});
$tabTitle.animate({
scrollLeft: autoLeft - $tabTitle.width() / 3
}, 200);
$tabTitle.animate(
{
scrollLeft: autoLeft - $tabTitle.width() / 3,
},
200,
);
},
/**
@@ -565,17 +577,22 @@ define(["jquery"], function ($) {
var $tabTitle = $('.layuimini-tab .layui-tab-title');
var left = $tabTitle.scrollLeft();
if ('left' === direction) {
$tabTitle.animate({
scrollLeft: left - 450
}, 200);
$tabTitle.animate(
{
scrollLeft: left - 450,
},
200,
);
} else {
$tabTitle.animate({
scrollLeft: left + 450
}, 200);
$tabTitle.animate(
{
scrollLeft: left + 450,
},
200,
);
}
}
},
};
return miniTab;
});
window.miniTab = miniTab;
})();