更新前端

This commit is contained in:
不胜舟
2023-04-06 16:41:48 +08:00
parent 2364ebb519
commit 5d10a304b3
56 changed files with 100137 additions and 95097 deletions
+248 -187
View File
@@ -11,6 +11,7 @@ layui.define(['jquery', 'element'], function(exports) {
var tabData = new Array();
var tabDataCurrent = 0;
var contextTabDOM;
pearTab.prototype.render = function(opt) {
@@ -24,6 +25,7 @@ layui.define(['jquery', 'element'], function(exports) {
height: opt.height,
tabMax: opt.tabMax,
session: opt.session ? opt.session : false,
preload: opt.preload ? opt.preload : false,
closeEvent: opt.closeEvent,
success: opt.success ? opt.success : function(id) {}
}
@@ -63,53 +65,62 @@ layui.define(['jquery', 'element'], function(exports) {
option.success(sessionStorage.getItem(option.elem + "-pear-tab-data-current"));
$("body .layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title").on("contextmenu", "li", function(e) {
$("body .layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title").on("contextmenu", "li",
function(e) {
// 获取当前元素位置
var top = e.clientY;
var left = e.clientX;
var menuWidth = 100;
var currentId = $(this).attr("lay-id");
var menu = "<ul><li class='item' id='" + option.elem +
"closeThis'>关闭当前</li><li class='item' id='" + option.elem +
"closeOther'>关闭其他</li><li class='item' id='" + option.elem +
"closeAll'>关闭所有</li></ul>";
// 获取当前元素位置
var top = e.clientY;
var left = e.clientX;
var currentId = $(this).attr("lay-id");
var menu = "<ul><li class='item' id='" + option.elem + "closeThis'>关闭当前</li><li class='item' id='" + option.elem +
"closeOther'>关闭其他</li><li class='item' id='" + option.elem + "closeAll'>关闭所有</li></ul>";
// 初始化
layer.open({
type: 1,
title: false,
shade: false,
skin: 'pear-tab-menu',
closeBtn: false,
area: ['100px', '108px'],
fixed: true,
offset: [top, left],
content: menu, //iframe的url,
success: function(layero, index) {
layer.close(lastIndex);
lastIndex = index;
menuEvent(option,index);
var timer;
$(layero).on('mouseout', function() {
timer = setTimeout(function() {
layer.close(index);
}, 30)
});
$(layero).on('mouseover', function() {
clearTimeout(timer);
});
// 清除 item 右击
$(layero).on('contextmenu',function(){
return false;
})
contextTabDOM = $(this);
var isOutsideBounds = (left + menuWidth) > $(window).width();
if (isOutsideBounds) {
left = $(window).width() - menuWidth;
}
});
return false;
})
// 初始化
layer.open({
type: 1,
title: false,
shade: false,
skin: 'pear-tab-menu',
closeBtn: false,
area: [menuWidth + 'px', '108px'],
fixed: true,
anim: false,
isOutAnim: false,
offset: [top, left],
content: menu, //iframe的url,
success: function(layero, index) {
layer.close(lastIndex);
lastIndex = index;
menuEvent(option, index);
var timer;
$(layero).on('mouseout', function() {
timer = setTimeout(function() {
layer.close(index);
}, 30)
});
$(layero).on('mouseover', function() {
clearTimeout(timer);
});
// 清除 item 右击
$(layero).on('contextmenu', function() {
return false;
})
}
});
return false;
})
mousewheelAndTouchmoveHandler(option)
return new pearTab(option);
}
@@ -119,6 +130,21 @@ layui.define(['jquery', 'element'], function(exports) {
element.on('tab(' + this.option.elem + ')', function(data) {
var id = $("#" + elem + " .layui-tab-title .layui-this").attr("lay-id");
sessionStorage.setItem(option.elem + "-pear-tab-data-current", id);
if (!option.preload) {
var $iframe = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-content").find(
"iframe[id='" + id + "']");
var iframeUrl = $iframe.attr("src");
if (!iframeUrl || iframeUrl === "about:blank") {
// 获取 url 并重载
tabData.forEach(function(item, index) {
if (item.id === id) {
iframeUrl = item.url;
}
})
tabIframeLoading(elem);
$iframe.attr("src", iframeUrl);
}
}
callback(id);
});
}
@@ -146,16 +172,17 @@ layui.define(['jquery', 'element'], function(exports) {
pearTab.prototype.addTab = function(opt) {
var title = '';
if (opt.close) {
title += '<span class="pear-tab-active"></span><span class="able-close">' + opt.title +
title += '<span class="pear-tab-active"></span><span class="able-close title">' + opt.title +
'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
} else {
title += '<span class="pear-tab-active"></span><span class="disable-close">' + opt.title +
title += '<span class="pear-tab-active"></span><span class="disable-close title">' + opt.title +
'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
}
element.tabAdd(this.option.elem, {
title: title,
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id + '" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;"></iframe>',
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
'" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></>',
id: opt.id
});
tabData.push(opt);
@@ -165,15 +192,45 @@ layui.define(['jquery', 'element'], function(exports) {
}
var index = 0;
// 根据过滤 fliter 标识, 重置选项卡标题
pearTab.prototype.changeTabTitleById = function(elem, id, title) {
var currentTab = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title [lay-id='" + id +
"'] .title");
currentTab.html(title);
}
// 根据过滤 filter 标识, 删除执行选项卡
// 根据过滤 filter 标识, 删除指定选项卡
pearTab.prototype.delTabByElem = function(elem, id, callback) {
var currentTab = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title [lay-id='" + id + "']");
if (currentTab.find("span").is(".able-close")) {
tabDelete(elem, id, callback);
}
}
// 根据过滤 filter 标识, 删除其他选项卡
pearTab.prototype.delOtherTabByElem = function(elem, callback) {
var currentId = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title .layui-this").attr(
"lay-id");
var tabtitle = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title li");
$.each(tabtitle, function(i) {
if ($(this).attr("lay-id") != currentId) {
if ($(this).find("span").is(".able-close")) {
tabDelete(elem, $(this).attr("lay-id"), callback);
}
}
})
}
// 根据过滤 filter 标识, 删除全部选项卡
pearTab.prototype.delAllTabByElem = function(elem, callback) {
var currentId = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title .layui-this").attr(
"lay-id");
var tabtitle = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title li");
$.each(tabtitle, function(i) {
if ($(this).find("span").is(".able-close")) {
tabDelete(elem, $(this).attr("lay-id"), callback);
}
})
}
// 根据过滤 filter 标识, 删除当前选项卡
pearTab.prototype.delCurrentTabByElem = function(elem, callback) {
var currentTab = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title .layui-this");
@@ -187,37 +244,23 @@ layui.define(['jquery', 'element'], function(exports) {
pearTab.prototype.addTabOnlyByElem = function(elem, opt, time) {
var title = '';
if (opt.close) {
title += '<span class="pear-tab-active"></span><span class="able-close">' + opt.title +
title += '<span class="pear-tab-active"></span><span class="able-close title">' + opt.title +
'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>'
} else {
title += '<span class="pear-tab-active"></span><span class="disable-close">' + opt.title +
title += '<span class="pear-tab-active"></span><span class="disable-close title">' + opt.title +
'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>'
}
if ($(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title li[lay-id]").length <= 0) {
if (time != false && time != 0) {
var load = '<div id="pear-tab-loading' + index + '" class="pear-tab-loading">' +
'<div class="ball-loader">' +
'<span></span><span></span><span></span><span></span>' +
'</div>' +
'</div>'
$("#" + elem).find(".pear-tab").append(load);
var pearLoad = $("#" + elem).find("#pear-tab-loading" + index);
pearLoad.css({
display: "block"
});
setTimeout(function() {
pearLoad.fadeOut(500);
}, time);
index++;
}
element.tabAdd(elem, {
title: title,
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id + '" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;"></iframe>',
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
'" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
id: opt.id
});
if (time != false && time != 0) {
tabIframeLoading(elem, opt.id);
}
tabData.push(opt);
sessionStorage.setItem(elem + "-pear-tab-data", JSON.stringify(tabData));
} else {
@@ -229,29 +272,16 @@ layui.define(['jquery', 'element'], function(exports) {
})
if (isData == false) {
if (time != false && time != 0) {
var load = '<div id="pear-tab-loading' + index + '" class="pear-tab-loading">' +
'<div class="ball-loader">' +
'<span></span><span></span><span></span><span></span>' +
'</div>' +
'</div>'
$("#" + elem).find(".pear-tab").append(load);
var pearLoad = $("#" + elem).find("#pear-tab-loading" + index);
pearLoad.css({
display: "block"
});
setTimeout(function() {
pearLoad.fadeOut(500);
}, time);
index++;
}
element.tabAdd(elem, {
title: title,
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id + '" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;"></iframe>',
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
'" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
id: opt.id
});
if (time != false && time != 0) {
tabIframeLoading(elem, opt.id);
}
tabData.push(opt);
sessionStorage.setItem(elem + "-pear-tab-data", JSON.stringify(tabData));
@@ -265,79 +295,59 @@ layui.define(['jquery', 'element'], function(exports) {
pearTab.prototype.addTabOnly = function(opt, time) {
var title = '';
if (opt.close) {
title += '<span class="pear-tab-active"></span><span class="able-close">' + opt.title +
title += '<span class="pear-tab-active"></span><span class="able-close title">' + opt.title +
'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
} else {
title += '<span class="pear-tab-active"></span><span class="disable-close">' + opt.title +
title += '<span class="pear-tab-active"></span><span class="disable-close title">' + opt.title +
'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
}
if ($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]").length <= 0) {
if (time != false && time != 0) {
var load = '<div id="pear-tab-loading' + index + '" class="pear-tab-loading">' +
'<div class="ball-loader">' +
'<span></span><span></span><span></span><span></span>' +
'</div>' +
'</div>';
$("#" + this.option.elem).find(".pear-tab").append(load);
var pearLoad = $("#" + this.option.elem).find("#pear-tab-loading" + index);
pearLoad.css({
display: "block"
});
setTimeout(function() {
pearLoad.fadeOut(500);
}, time);
index++;
}
if ($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]").length <=
0) {
element.tabAdd(this.option.elem, {
title: title,
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id + '" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;"></iframe>',
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
'" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
id: opt.id
});
if (time != false && time != 0) {
tabIframeLoading(this.option.elem, opt.id);
}
tabData.push(opt);
sessionStorage.setItem(this.option.elem + "-pear-tab-data", JSON.stringify(tabData));
sessionStorage.setItem(this.option.elem + "-pear-tab-data-current", opt.id);
} else {
var isData = false;
$.each($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]"), function() {
if ($(this).attr("lay-id") == opt.id) {
isData = true;
}
})
$.each($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]"),
function() {
if ($(this).attr("lay-id") == opt.id) {
isData = true;
}
})
if (isData == false) {
if ($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]").length >= this.option.tabMax) {
layer.msg("最多打开" + this.option.tabMax + "个标签页", {
icon: 2,
time: 1000,
shift: 6
});
return false;
}
if (time != false && time != 0) {
var load = '<div id="pear-tab-loading' + index + '" class="pear-tab-loading">' +
'<div class="ball-loader">' +
'<span></span><span></span><span></span><span></span>' +
'</div>' +
'</div>'
$("#" + this.option.elem).find(".pear-tab").append(load);
var pearLoad = $("#" + this.option.elem).find("#pear-tab-loading" + index);
pearLoad.css({
display: "block"
});
setTimeout(function() {
pearLoad.fadeOut(500);
}, time);
index++;
if (this.option.tabMax != false) {
if ($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]")
.length >= this.option.tabMax) {
layer.msg("最多打开" + this.option.tabMax + "个标签页", {
icon: 2,
time: 1000,
shift: 6
});
return false;
}
}
element.tabAdd(this.option.elem, {
title: title,
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id + '" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;"></iframe>',
content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
'" scrolling="auto" frameborder="0" src="' +
opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
id: opt.id
});
if (time != false && time != 0) {
tabIframeLoading(this.option.elem, opt.id);
}
tabData.push(opt);
sessionStorage.setItem(this.option.elem + "-pear-tab-data", JSON.stringify(tabData));
sessionStorage.setItem(this.option.elem + "-pear-tab-data-current", opt.id);
@@ -350,36 +360,39 @@ layui.define(['jquery', 'element'], function(exports) {
// 刷 新 指 定 的 选 项 卡
pearTab.prototype.refresh = function(time) {
// 刷 新 指 定 的 选 项 卡
var $iframe = $(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-content .layui-show")
.find("iframe");
if (time != false && time != 0) {
var load = '<div id="pear-tab-loading' + index + '" class="pear-tab-loading">' +
'<div class="ball-loader">' +
'<span></span><span></span><span></span><span></span>' +
'</div>' +
'</div>'
var elem = this.option.elem;
$("#" + this.option.elem).find(".pear-tab").append(load);
var pearLoad = $("#" + this.option.elem).find("#pear-tab-loading" + index);
pearLoad.css({
display: "block"
});
index++;
setTimeout(function() {
pearLoad.fadeOut(500, function() {
pearLoad.remove();
});
}, time);
$(".layui-tab[lay-filter='" + elem + "'] .layui-tab-content .layui-show").find("iframe")[0].contentWindow
.location.reload(true);
} else {
$(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-content .layui-show").find("iframe")[0].contentWindow
.location.reload(true);
tabIframeLoading(this.option.elem);
}
$iframe.attr("src", $iframe.attr("src"));
}
function tabIframeLoading(elem, id) {
var load = '<div id="pear-tab-loading' + index + '" class="pear-tab-loading">' +
'<div class="ball-loader">' +
'<span></span><span></span><span></span><span></span>' +
'</div>' +
'</div>'
var $iframe = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-content .layui-show").find("iframe");
if (id) {
$iframe = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-content").find("iframe[id='" + id +
"']");
}
$iframe.parent().append(load);
var pearLoad = $("#" + elem).find("#pear-tab-loading" + index);
pearLoad.css({
display: "block"
});
index++;
$iframe.on("load", function() {
pearLoad.fadeOut(1000, function() {
pearLoad.remove();
});
})
}
function tabDelete(elem, id, callback, option) {
//根据 elem id 来删除指定的 layui title li
var tabTitle = $(".layui-tab[lay-filter='" + elem + "']").find(".layui-tab-title");
@@ -388,7 +401,8 @@ layui.define(['jquery', 'element'], function(exports) {
var nextNode = removeTab.next("li");
if (!removeTab.hasClass("layui-this")) {
removeTab.remove();
var tabContent = $(".layui-tab[lay-filter='" + elem + "']").find("iframe[id='" + id + "']").parent();
var tabContent = $(".layui-tab[lay-filter='" + elem + "']").find("iframe[id='" + id + "']")
.parent();
tabContent.remove();
tabData = JSON.parse(sessionStorage.getItem(elem + "-pear-tab-data"));
@@ -452,31 +466,37 @@ layui.define(['jquery', 'element'], function(exports) {
$.each(option.data, function(i, item) {
var TitleItem = '';
if (option.index == index) {
TitleItem += '<li lay-id="' + item.id + '" class="layui-this"><span class="pear-tab-active"></span>';
TitleItem += '<li lay-id="' + item.id +
'" class="layui-this"><span class="pear-tab-active"></span>';
} else {
TitleItem += '<li lay-id="' + item.id + '" ><span class="pear-tab-active"></span>';
}
if (item.close) {
// 当 前 选 项 卡 可 以 关 闭
TitleItem += '<span class="able-close">' + item.title + '</span>';
TitleItem += '<span class="able-close title">' + item.title + '</span>';
} else {
// 当 前 选 项 卡 不 允 许 关 闭
TitleItem += '<span class="disable-close">' + item.title + '</span>';
TitleItem += '<span class="disable-close title">' + item.title + '</span>';
}
TitleItem += '<i class="layui-icon layui-unselect layui-tab-close">ဆ</i></li>';
title += TitleItem;
if (option.index == index) {
// 处 理 显 示 内 容
content += '<div class="layui-show layui-tab-item"><iframe id="' + item.id + '" data-frameid="' + item.id +
content += '<div class="layui-show layui-tab-item"><iframe id="' + item.id +
'" data-frameid="' + item.id +
'" src="' + item.url +
'" frameborder="no" border="0" marginwidth="0" marginheight="0" style="width: 100%;height: 100%;"></iframe></div>'
'" frameborder="no" border="0" marginwidth="0" marginheight="0" style="width: 100%;height: 100%;" allowfullscreen="true"></iframe></div>'
} else {
if (!option.preload) {
item.url = "about:blank";
}
// 处 理 显 示 内 容
content += '<div class="layui-tab-item"><iframe id="' + item.id + '" data-frameid="' + item.id + '" src="' +
content += '<div class="layui-tab-item"><iframe id="' + item.id + '" data-frameid="' +
item.id + '" src="' +
item.url +
'" frameborder="no" border="0" marginwidth="0" marginheight="0" style="width: 100%;height: 100%;"></iframe></div>'
'" frameborder="no" border="0" marginwidth="0" marginheight="0" style="width: 100%;height: 100%;" allowfullscreen="true"></iframe></div>'
}
index++;
});
@@ -517,11 +537,11 @@ layui.define(['jquery', 'element'], function(exports) {
})
}
function menuEvent(option,index) {
function menuEvent(option, index) {
$("#" + option.elem + "closeThis").click(function() {
var currentTab = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title .layui-this");
var currentTab = contextTabDOM;
if (currentTab.find("span").is(".able-close")) {
var currentId = currentTab.attr("lay-id");
tabDelete(option.elem, currentId, option.closeEvent, option);
@@ -535,12 +555,13 @@ layui.define(['jquery', 'element'], function(exports) {
})
$("#" + option.elem + "closeOther").click(function() {
var currentId = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title .layui-this").attr("lay-id");
var currentId = contextTabDOM.attr("lay-id");
var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
$.each(tabtitle, function(i) {
if ($(this).attr("lay-id") != currentId) {
if ($(this).find("span").is(".able-close")) {
tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent, option);
tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent,
option);
}
}
})
@@ -548,7 +569,7 @@ layui.define(['jquery', 'element'], function(exports) {
})
$("#" + option.elem + "closeAll").click(function() {
var currentId = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title .layui-this").attr("lay-id");
var currentId = contextTabDOM.attr("lay-id");
var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
$.each(tabtitle, function(i) {
if ($(this).find("span").is(".able-close")) {
@@ -559,11 +580,10 @@ layui.define(['jquery', 'element'], function(exports) {
})
}
function toolEvent(option) {
$("body .layui-tab[lay-filter='" + option.elem + "']").on("click", "#closeThis", function() {
var currentTab = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title .layui-this");
var currentTab = $(".layui-tab[lay-filter='" + option.elem +
"'] .layui-tab-title .layui-this");
if (currentTab.find("span").is(".able-close")) {
var currentId = currentTab.attr("lay-id");
tabDelete(option.elem, currentId, option.closeEvent, option);
@@ -576,19 +596,22 @@ layui.define(['jquery', 'element'], function(exports) {
})
$("body .layui-tab[lay-filter='" + option.elem + "']").on("click", "#closeOther", function() {
var currentId = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title .layui-this").attr("lay-id");
var currentId = $(".layui-tab[lay-filter='" + option.elem +
"'] .layui-tab-title .layui-this").attr("lay-id");
var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
$.each(tabtitle, function(i) {
if ($(this).attr("lay-id") != currentId) {
if ($(this).find("span").is(".able-close")) {
tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent, option);
tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent,
option);
}
}
})
})
$("body .layui-tab[lay-filter='" + option.elem + "']").on("click", "#closeAll", function() {
var currentId = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title .layui-this").attr("lay-id");
var currentId = $(".layui-tab[lay-filter='" + option.elem +
"'] .layui-tab-title .layui-this").attr("lay-id");
var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
$.each(tabtitle, function(i) {
if ($(this).find("span").is(".able-close")) {
@@ -598,5 +621,43 @@ layui.define(['jquery', 'element'], function(exports) {
})
}
function mousewheelAndTouchmoveHandler(option) {
var $bodyTab = $("body .layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title")
var $tabTitle = $('#' + option.elem + ' .layui-tab-title');
var mouseScrollStep = 100
// 鼠标滚轮
$bodyTab.on("mousewheel DOMMouseScroll", function(e) {
e.originalEvent.preventDefault()
var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? "top" :
"down")) || // chrome & ie
(e.originalEvent.detail && (e.originalEvent.detail > 0 ? "down" : "top")); // firefox
var scrollLeft = $tabTitle.scrollLeft();
if (delta === "top") {
scrollLeft -= mouseScrollStep
} else if (delta === "down") {
scrollLeft += mouseScrollStep
}
$tabTitle.scrollLeft(scrollLeft)
});
// 触摸移动
var touchX = 0;
$bodyTab.on("touchstart", function(e) {
var touch = e.originalEvent.targetTouches[0];
touchX = touch.pageX
})
$bodyTab.on("touchmove", function(e) {
var event = e.originalEvent;
if (event.targetTouches.length > 1) return;
event.preventDefault();
var touch = event.targetTouches[0];
var distanceX = touchX - touch.pageX
var scrollLeft = $tabTitle.scrollLeft();
touchX = touch.pageX
$tabTitle.scrollLeft(scrollLeft += distanceX)
});
}
exports(MOD_NAME, new pearTab());
})