## tableMerge.js 文件替换
layui.define(['table'], function (exports) {
var $ = layui.jquery;
var mod = {
render: function (myTable) {
var tableBox = $('#'+myTable.id).next().children('.layui-table-box'),
$main = $(tableBox.children('.layui-table-body').children('table').children('tbody').children('tr').toArray().reverse()),
$fixLeft = $(tableBox.children('.layui-table-fixed-l').children('.layui-table-body').children('table').children('tbody').children('tr').toArray().reverse()),
$fixRight = $(tableBox.children('.layui-table-fixed-r').children('.layui-table-body').children('table').children('tbody').children('tr').toArray().reverse()),
cols = myTable.cols[0], mergeRecord = {},heigth = 28;
for (let i = 0; i < cols.length; i++) {
var item3 = cols[i], field=item3.field;
if (item3.merge) {
var mergeField = [field];
if (item3.merge !== true) {
if (typeof item3.merge == 'string') {
mergeField = [item3.merge]
} else {
mergeField = item3.merge
}
}
mergeRecord[i] = {mergeField: mergeField, rowspan:1}
}
}
$main.each(function (i) {
let margeRow=0;
for (var item in mergeRecord) {
if (i==$main.length-1 || isMaster(i, item)) {
$(this).children('[data-key$="-'+item+'"]').attr('rowspan', mergeRecord[item].rowspan);
$fixLeft.eq(i).children('[data-key$="-'+item+'"]').attr('rowspan', mergeRecord[item].rowspan);
$fixRight.eq(i).children('[data-key$="-'+item+'"]').attr('rowspan', mergeRecord[item].rowspan);
heigth=$(this).children('[data-key$="-'+item+'"]').height();
if(heigth){
$fixRight.eq(i).children('[data-key$="-'+item+'"]').height(heigth);
$fixLeft.eq(i).children('[data-key$="-'+item+'"]').height(heigth);
}
if(mergeRecord[item].rowspan>1){
margeRow=mergeRecord[item].rowspan;
}
mergeRecord[item].rowspan = 1;
} else {
$(this).children('[data-key$="-'+item+'"]').remove();
$fixLeft.eq(i).children('[data-key$="-'+item+'"]').remove();
$fixRight.eq(i).children('[data-key$="-'+item+'"]').remove();
mergeRecord[item].rowspan +=1;
}
}
if(margeRow>1){
let tr=$(this);
let lnextTR=$fixLeft.eq(i);
let rnextTR=$fixRight.eq(i);
let trArray=[];
for(let i=0;i<margeRow;i++){
trArray.push(tr);
trArray.push(lnextTR);
trArray.push(rnextTR);
tr=tr.next();
lnextTR=lnextTR.next();
rnextTR=rnextTR.next();
}
for(let i=0;i<trArray.length;i++){
trArray[i].hover(
function(){
for(let j=0;j<trArray.length;j++){
if(j!=i){
trArray[j].addClass("layui-table-hover");
}
}
},
function(){
for(let j=0;j<trArray.length;j++){
if(j!=i){
trArray[j].removeClass("layui-table-hover");
}
}
}
);
}
}
})
function isMaster (index, item) {
var mergeField = mergeRecord[item].mergeField;
var dataLength = layui.table.cache[myTable.id].length;
for (var i=0; i<mergeField.length; i++) {
if (layui.table.cache[myTable.id][dataLength-2-index][mergeField[i]]
!== layui.table.cache[myTable.id][dataLength-1-index][mergeField[i]]) {
return true;
}
}
return false;
}
}
};
exports('tableMerge', mod);
});
JS调用
done : function(res, curr, count) {
layui.tableMerge.render(this);
let maxWidth = 0;
let fixedRight = $(".layui-table-fixed-r");
fixedRight
.children(".layui-table-header")
.children("table")
.children("thead")
.children("tr")
.each(function () {
$(this).children("th").children("div").removeClass();
$(this).children("th").children("div").addClass("layui-table-cell");
});
fixedRight
.children(".layui-table-body")
.children("table")
.children("tbody")
.children("tr")
.each(function () {
$(this).children("td").children("div").removeClass();
$(this).children("td").children("div").addClass("layui-table-cell");
maxWidth = $(this).width();
});
fixedRight
.children(".layui-table-header")
.children("table")
.children("thead")
.children("tr")
.each(function () {
$(this).children("th").children("div").width(maxWidth);
});
$(".layui-table-fixed-r").css('width',maxWidth);
$(".layui-table-body.layui-table-main tr td:last-child div").css('width',maxWidth);
}