423 lines
19 KiB
JavaScript
423 lines
19 KiB
JavaScript
|
/**
|
|||
|
|
* date:2020/09/29
|
|||
|
|
* author:Mr.Q
|
|||
|
|
* version:1.6
|
|||
|
|
* description:watercloud 主体框架扩展
|
|||
|
|
*/
|
|||
|
|
layui.define(["jquery", "layer", 'table', 'soulTable', 'common', 'tabletree'], function (exports) {
|
|||
|
|
var $ = layui.jquery,
|
|||
|
|
layer = layui.layer,
|
|||
|
|
soulTable = layui.soulTable,
|
|||
|
|
tabletree = layui.tabletree,
|
|||
|
|
common = layui.common,
|
|||
|
|
table = layui.table;
|
|||
|
|
|
|||
|
|
var obj = {
|
|||
|
|
//table渲染封装里面有字段权限
|
|||
|
|
rendertable: function (options) {
|
|||
|
|
var serchHeight = parseInt(60 + ($(".table-search-fieldset").height() || 0));
|
|||
|
|
var defaults = {
|
|||
|
|
elem: '#currentTableId',//主键
|
|||
|
|
toolbar: '#toolbarDemo',//工具栏
|
|||
|
|
defaultToolbar: ['filter', 'exports', 'print'],//默认工具栏
|
|||
|
|
search: true,//搜索按钮
|
|||
|
|
method: 'get',//请求方法
|
|||
|
|
cellMinWidth: 100,//最小宽度
|
|||
|
|
limit: 10,//每页数据 默认
|
|||
|
|
limits: [10, 20, 30, 40, 50],
|
|||
|
|
id:'currentTableId',
|
|||
|
|
height: 'full-' + serchHeight,
|
|||
|
|
loading: false,
|
|||
|
|
autoSort: false,
|
|||
|
|
page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
|
|||
|
|
layout: ['skip', 'prev', 'page', 'next', 'limit', 'count'] //自定义分页布局
|
|||
|
|
,curr: 1 //设定初始在第 1 页
|
|||
|
|
, groups: 3 //只显示 1 个连续页码
|
|||
|
|
, first: false //不显示首页
|
|||
|
|
, last: false //不显示尾页
|
|||
|
|
},
|
|||
|
|
authorizeFields: true, // 字段权限开关
|
|||
|
|
autoColumnWidth: true,
|
|||
|
|
overflow: { // 默认所有表格都超出
|
|||
|
|
type: 'tips'
|
|||
|
|
, hoverTime: 300 // 悬停时间，单位ms, 悬停 hoverTime 后才会显示，默认为 0
|
|||
|
|
, color: 'black' // 字体颜色
|
|||
|
|
, bgColor: 'white' // 背景色
|
|||
|
|
, header: true, // 表头支持 overflow
|
|||
|
|
total: true // 合计行支持 overflow
|
|||
|
|
},
|
|||
|
|
contextmenu: {
|
|||
|
|
header: [
|
|||
|
|
{
|
|||
|
|
name: '复制',
|
|||
|
|
icon: 'layui-icon layui-icon-template',
|
|||
|
|
click: function (obj) {
|
|||
|
|
soulTable.copy(obj.text)
|
|||
|
|
layer.msg('复制成功！')
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '导出excel',
|
|||
|
|
icon: 'layui-icon layui-icon-download-circle',
|
|||
|
|
click: function () {
|
|||
|
|
soulTable.export(this.id)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '重载表格',
|
|||
|
|
icon: 'layui-icon layui-icon-refresh-1',
|
|||
|
|
click: function () {
|
|||
|
|
table.reload(this.id)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
// 表格内容右键菜单配置
|
|||
|
|
body: [
|
|||
|
|
{
|
|||
|
|
name: '复制',
|
|||
|
|
icon: 'layui-icon layui-icon-template',
|
|||
|
|
click: function (obj) {
|
|||
|
|
soulTable.copy(obj.text)
|
|||
|
|
layer.msg('复制成功！')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
// 合计栏右键菜单配置
|
|||
|
|
total: [{
|
|||
|
|
name: '复制',
|
|||
|
|
icon: 'layui-icon layui-icon-template',
|
|||
|
|
click: function (obj) {
|
|||
|
|
soulTable.copy(obj.text)
|
|||
|
|
layer.msg('复制成功！')
|
|||
|
|
}
|
|||
|
|
}]
|
|||
|
|
},
|
|||
|
|
excel: {
|
|||
|
|
filename: '表格信息' + new Date().formatDate() + '.xlsx',
|
|||
|
|
},
|
|||
|
|
request: {
|
|||
|
|
pageName: 'page' //页码的参数名称，默认：page
|
|||
|
|
, limitName: 'rows' //每页数据量的参数名，默认：limit
|
|||
|
|
},
|
|||
|
|
parseData: function (res) { //res 即为原始返回的数据
|
|||
|
|
return {
|
|||
|
|
"code": res.state, //解析接口状态
|
|||
|
|
"msg": res.message, //解析提示文本
|
|||
|
|
"count": res.count, //解析数据长度
|
|||
|
|
"data": res.data //解析数据列表
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
var doneCallback = options.done;
|
|||
|
|
var options = $.extend(defaults, options);
|
|||
|
|
if (document.body.clientWidth < 500 && !!options.defaultToolbar) {
|
|||
|
|
for (var i = 0; i < options.defaultToolbar.length; i++) {
|
|||
|
|
if (options.defaultToolbar[i] == "print") {
|
|||
|
|
options.defaultToolbar.splice(i, 1);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (options.search) {
|
|||
|
|
options.defaultToolbar = !options.defaultToolbar ? [] : options.defaultToolbar;
|
|||
|
|
options.defaultToolbar.push({
|
|||
|
|
title: '搜索',
|
|||
|
|
layEvent: 'TABLE_SEARCH',
|
|||
|
|
icon: 'layui-icon-search'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
//ie缓存问题
|
|||
|
|
options.url = common.urlAddTime(options.url);
|
|||
|
|
//字段权限
|
|||
|
|
if (options.authorizeFields) {
|
|||
|
|
options.cols = common.tableAuthorizeFields(options.cols);
|
|||
|
|
}
|
|||
|
|
options.done = function (res, curr, count) {
|
|||
|
|
//关闭加载
|
|||
|
|
//layer.closeAll('loading');
|
|||
|
|
//固定列引发的问题
|
|||
|
|
//table.resize(options.id);
|
|||
|
|
//obj.tableResize(options.id);
|
|||
|
|
if (doneCallback) {
|
|||
|
|
doneCallback(res, curr, count);
|
|||
|
|
}
|
|||
|
|
soulTable.render(this);
|
|||
|
|
table.resize();
|
|||
|
|
};
|
|||
|
|
return table.render(options);
|
|||
|
|
},
|
|||
|
|
//table刷新
|
|||
|
|
reloadtable: function (options) {
|
|||
|
|
layer.load(0, { shade: false });
|
|||
|
|
var defaults = {
|
|||
|
|
elem: 'currentTableId',//主键
|
|||
|
|
page: true,//分页参数
|
|||
|
|
curr: 1,//当前页
|
|||
|
|
where: {}
|
|||
|
|
};
|
|||
|
|
var options = $.extend(defaults, options);
|
|||
|
|
options.where.time = new Date().Format("yyyy-MM-dd hh:mm:ss");
|
|||
|
|
if (options.page) {
|
|||
|
|
if (options.page == true) {
|
|||
|
|
table.reload(options.elem, {
|
|||
|
|
page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
|
|||
|
|
layout: ['skip', 'prev', 'page', 'next', 'limit', 'count'] //自定义分页布局
|
|||
|
|
, groups: 3 //只显示 1 个连续页码
|
|||
|
|
, first: false //不显示首页
|
|||
|
|
, last: false, //不显示尾页
|
|||
|
|
curr: options.curr
|
|||
|
|
}
|
|||
|
|
, where: options.where
|
|||
|
|
}, 'data');
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
table.reload(options.elem, {
|
|||
|
|
page: options.page
|
|||
|
|
, where: options.where
|
|||
|
|
}, 'data');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
//执行搜索重载
|
|||
|
|
table.reload(options.elem, {
|
|||
|
|
where: options.where
|
|||
|
|
}, 'data');
|
|||
|
|
}
|
|||
|
|
//关闭加载
|
|||
|
|
layer.closeAll('loading');
|
|||
|
|
},
|
|||
|
|
//tabletree渲染封装里面有字段权限
|
|||
|
|
rendertreetable: function (options) {
|
|||
|
|
//样式不协调，先不加
|
|||
|
|
var serchHeight = parseInt(60 + ($(".table-search-fieldset").height() || 0));
|
|||
|
|
var defaults = {
|
|||
|
|
elem: '#currentTableId',//主键
|
|||
|
|
toolbar: '#toolbarDemo',//工具栏
|
|||
|
|
defaultToolbar: ['filter', 'exports', 'print'],//默认工具栏
|
|||
|
|
search: true,//搜索按钮
|
|||
|
|
loading: false,
|
|||
|
|
treeIdName: 'F_Id', // id字段名称
|
|||
|
|
treePidName: 'F_ParentId', // pid字段名称
|
|||
|
|
filter:true,
|
|||
|
|
treeColIndex: 1,
|
|||
|
|
treeSpid: 0,
|
|||
|
|
limit: 99999,//每页数据 默认
|
|||
|
|
page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
|
|||
|
|
layout: ['count'] //自定义分页布局
|
|||
|
|
, first: false //不显示首页
|
|||
|
|
, last: false //不显示尾页
|
|||
|
|
},
|
|||
|
|
height: 'full-' + serchHeight,
|
|||
|
|
method: 'get',//请求方法
|
|||
|
|
cellMinWidth: 60,//最小宽度
|
|||
|
|
authorizeFields: true, // 字段权限开关
|
|||
|
|
overflow: { // 默认所有表格都超出
|
|||
|
|
type: 'tips'
|
|||
|
|
, hoverTime: 300 // 悬停时间，单位ms, 悬停 hoverTime 后才会显示，默认为 0
|
|||
|
|
, color: 'black' // 字体颜色
|
|||
|
|
, bgColor: 'white' // 背景色
|
|||
|
|
, header: true, // 表头支持 overflow
|
|||
|
|
total: true // 合计行支持 overflow
|
|||
|
|
},
|
|||
|
|
contextmenu: {
|
|||
|
|
header: [
|
|||
|
|
{
|
|||
|
|
name: '复制',
|
|||
|
|
icon: 'layui-icon layui-icon-template',
|
|||
|
|
click: function (obj) {
|
|||
|
|
soulTable.copy(obj.text)
|
|||
|
|
layer.msg('复制成功！')
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '导出excel',
|
|||
|
|
icon: 'layui-icon layui-icon-download-circle',
|
|||
|
|
click: function () {
|
|||
|
|
soulTable.export(this.id)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '重载表格',
|
|||
|
|
icon: 'layui-icon layui-icon-refresh-1',
|
|||
|
|
click: function () {
|
|||
|
|
table.reload(this.id)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
// 表格内容右键菜单配置
|
|||
|
|
body: [
|
|||
|
|
{
|
|||
|
|
name: '复制',
|
|||
|
|
icon: 'layui-icon layui-icon-template',
|
|||
|
|
click: function (obj) {
|
|||
|
|
soulTable.copy(obj.text)
|
|||
|
|
layer.msg('复制成功！')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
// 合计栏右键菜单配置
|
|||
|
|
total: [{
|
|||
|
|
name: '复制',
|
|||
|
|
icon: 'layui-icon layui-icon-template',
|
|||
|
|
click: function (obj) {
|
|||
|
|
soulTable.copy(obj.text)
|
|||
|
|
layer.msg('复制成功！')
|
|||
|
|
}
|
|||
|
|
}]
|
|||
|
|
},
|
|||
|
|
excel: {
|
|||
|
|
filename: '表格信息' + new Date().formatDate() + '.xlsx',
|
|||
|
|
},
|
|||
|
|
parseData: function (res) { //res 即为原始返回的数据
|
|||
|
|
return {
|
|||
|
|
"code": res.state, //解析接口状态
|
|||
|
|
"msg": res.message, //解析提示文本
|
|||
|
|
"count": res.count, //解析数据长度
|
|||
|
|
"data": res.data //解析数据列表
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
var doneCallback = options.done;
|
|||
|
|
var options = $.extend(defaults, options);
|
|||
|
|
if (document.body.clientWidth < 500 && !!options.defaultToolbar) {
|
|||
|
|
for (var i = 0; i < options.defaultToolbar.length; i++) {
|
|||
|
|
if (options.defaultToolbar[i] == "print") {
|
|||
|
|
options.defaultToolbar.splice(i, 1);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
//搜索框按钮
|
|||
|
|
if (options.search) {
|
|||
|
|
options.defaultToolbar = !options.defaultToolbar ? [] : options.defaultToolbar;
|
|||
|
|
options.defaultToolbar.push({
|
|||
|
|
title: '搜索',
|
|||
|
|
layEvent: 'TABLE_SEARCH',
|
|||
|
|
icon: 'layui-icon-search'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
//ie缓存问题
|
|||
|
|
options.url = common.urlAddTime(options.url);
|
|||
|
|
//字段权限
|
|||
|
|
if (options.authorizeFields) {
|
|||
|
|
options.cols = common.tableAuthorizeFields(options.cols);
|
|||
|
|
}
|
|||
|
|
options.done = function (res, curr, count) {
|
|||
|
|
//关闭加载
|
|||
|
|
//layer.closeAll('loading');
|
|||
|
|
if (doneCallback) {
|
|||
|
|
doneCallback(res, curr, count);
|
|||
|
|
}
|
|||
|
|
table.resize();
|
|||
|
|
};
|
|||
|
|
tabletree.render(options);
|
|||
|
|
return options;
|
|||
|
|
},
|
|||
|
|
//table行点击事件及按钮显示控制
|
|||
|
|
tableRowClick: function (type, tableFilter, tableId, oneList, moreList, clickfunction) {
|
|||
|
|
var oneList = !!oneList ? oneList : [];
|
|||
|
|
var moreList = !!moreList ? moreList : [];
|
|||
|
|
//type是checkbox或者radio
|
|||
|
|
$(document).on("click", ".layui-table-body table.layui-table tbody tr", function () {
|
|||
|
|
var obj = event ? event.target : event.srcElement;
|
|||
|
|
// 获取事件名称
|
|||
|
|
var tag = obj.tagName;
|
|||
|
|
var index = $(this).attr('data-index');
|
|||
|
|
var tableBox = $(this).parents('.layui-table-box');
|
|||
|
|
//存在固定列
|
|||
|
|
if (tableBox.find(".layui-table-fixed.layui-table-fixed-l").length > 0) {
|
|||
|
|
tableDiv = tableBox.find(".layui-table-fixed.layui-table-fixed-l");
|
|||
|
|
} else {
|
|||
|
|
tableDiv = tableBox.find(".layui-table-body.layui-table-main");
|
|||
|
|
}
|
|||
|
|
var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.laytable-cell-" + type + " div.layui-form-" + type + " I");
|
|||
|
|
if (checkCell.length > 0) {
|
|||
|
|
//div和td生效
|
|||
|
|
if (tag == 'DIV' || tag == "TD") {
|
|||
|
|
checkCell.click();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
//对td的单击事件进行拦截停止，防止事件冒泡再次触发上述的单击事件（Table的单击行事件不会拦截，依然有效）
|
|||
|
|
$(document).on("click", "td div.laytable-cell-" + type + " div.layui-form-" + type + "", function (e) {
|
|||
|
|
e.stopPropagation();
|
|||
|
|
});
|
|||
|
|
table.on('row(' + tableFilter+')', function (obj) {
|
|||
|
|
obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
|
|||
|
|
if (clickfunction) {
|
|||
|
|
clickfunction(obj);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
//多选框监听
|
|||
|
|
table.on(type+'(' + tableFilter + ')', function (obj) {
|
|||
|
|
//控制按钮
|
|||
|
|
var data = table.checkStatus(tableId).data;
|
|||
|
|
var buttonHumanized = sessionStorage.getItem('watercloudButtonHumanized');
|
|||
|
|
if (!buttonHumanized) {
|
|||
|
|
if (obj.type == "all") {
|
|||
|
|
if (obj.checked && table.cache[tableId].length != 0) {
|
|||
|
|
if (table.cache[tableId].length > 1) {
|
|||
|
|
for (var i = 0; i < oneList.length; i++) {
|
|||
|
|
$('[name="' + oneList[i] + '"]').addClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
for (var i = 0; i < moreList.length; i++) {
|
|||
|
|
$('[name="' + moreList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
for (var i = 0; i < oneList.length; i++) {
|
|||
|
|
$('[name="' + oneList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
for (var i = 0; i < moreList.length; i++) {
|
|||
|
|
$('[name="' + moreList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
for (var i = 0; i < oneList.length; i++) {
|
|||
|
|
$('[name="' + oneList[i] + '"]').addClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
for (var i = 0; i < moreList.length; i++) {
|
|||
|
|
$('[name="' + moreList[i] + '"]').addClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
if (data.length > 1) {
|
|||
|
|
for (var i = 0; i < oneList.length; i++) {
|
|||
|
|
$('[name="' + oneList[i] + '"]').addClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
for (var i = 0; i < moreList.length; i++) {
|
|||
|
|
$('[name="' + moreList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else if (data.length == 1) {
|
|||
|
|
for (var i = 0; i < oneList.length; i++) {
|
|||
|
|
$('[name="' + oneList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
for (var i = 0; i < moreList.length; i++) {
|
|||
|
|
$('[name="' + moreList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
for (var i = 0; i < oneList.length; i++) {
|
|||
|
|
$('[name="' + oneList[i] + '"]').addClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
for (var i = 0; i < moreList.length; i++) {
|
|||
|
|
$('[name="' + moreList[i] + '"]').addClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
for (var i = 0; i < oneList.length; i++) {
|
|||
|
|
$('[name="' + oneList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
for (var i = 0; i < moreList.length; i++) {
|
|||
|
|
$('[name="' + moreList[i] + '"]').removeClass("layui-hide");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
table.resize();
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
exports("commonTable", obj);
|
|||
|
|
});
|