layer单元格合并
layer单元格合并
标签(空格分隔): layer
layer数据表格
function tableList()
{
table.render({
elem: '#file_table',
id: 'idTest',
url: "{:U('Baobiao/decorationReport')}", //数据接口
method: 'post',
where: {
start_time: $("#start_time").val(),
end_time: $("#end_time").val(),
department_ids: (layui.formSelects.value('selectId', 'valStr')),
house: $("#house").val(),
},
page: {
limit: 20,//默认每页几条
groups: 10,//连续显示几页
layout: ['count', 'limit', 'prev', 'page', 'next', 'skip'],//分页位置
first: "首页",
last: "尾页",
theme: "#0085ff"
},
cols: [[ //表头
{
field: 'number',
title: '交易编号',
event: 'numberEvent',
style: 'color:#0085FF',
width: 150,
}, {
field: 'transaction_username',
title: '成交人',
width: 100,
}, {
field: 'department_username',
title: '成交部门',
width: 130,
}, {
field: 'customer_name',
title: '成交客户',
width: 130,
}, {
field: 'customer_number',
title: '客源编号',
event: 'customerEvent',
style: 'color:#0085FF',
width: 150,
}, {
field: 'house_address',
title: '房屋地址',
width: 100,
},{
field: 'measure_at',
title: '量房时间',
width: 100,
}, {
field: 'approval_at',
title: '成交时间',
width: 100,
}, {
field: 'total_commission',
title: '总佣金(元)',
width: 100,
}, {
field: 'username',
title: '经纪人',
width: 100,
}, {
field: 'commission_ratio',
title: '分成比例(%)',
width: 100,
}, {
field: 'commission_money',
title: '分成业绩(元)',
width: 130,
}, {
field: 'accrual_money',
title: '计提业绩(元)',
width: 130,
}, {
field: 'commission_type',
title: '分成缘由',
width: 123,
}
]],
done : function(res, curr, count) {
merge(res);
}
});
}
// 合并单元格
function merge(res)
{
var data = res.data;
var mergeIndex = 0;//定位需要添加合并属性的行数
var mark = 1; //这里涉及到简单的运算,mark是计算每次需要合并的格子数
var columsName = [
'',
'',
'',
'',
'',
'',
'',
'',
''
];
var columsIndex = [0,1,2,3,4,5,6,7,8,9];//需要合并的列索引值
for (var k = 0; k < columsName.length; k++) { //这里循环所有要合并的列
var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行
for (var i = 1; i < res.data.length; i++) { //这里循环表格当前的数据
var tdCurArr = trArr.eq(i).find("td").eq(columsIndex[k]);//获取当前行的当前列
var tdPreArr = trArr.eq(mergeIndex).find("td").eq(columsIndex[k]);//获取相同列的第一列
if (data[i]['number'] === data[i-1]['number']) { //后一行的值与前一行的值做比较,相同就需要合并
mark += 1;
//相同列的第一列增加rowspan属性
tdPreArr.each(function () {
$(this).attr("rowspan", mark);
});
//当前行隐藏
tdCurArr.each(function () {
$(this).css("display", "none");
});
}else {
mergeIndex = i;
mark = 1;//一旦前后两行的值不一样了,那么需要合并的格子数mark就需要重新计算
}
}
mergeIndex = 0;
mark = 1;
}
}
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 用 C# 插值字符串处理器写一个 sscanf
· Java 中堆内存和栈内存上的数据分布和特点
· 开发中对象命名的一点思考
· .NET Core内存结构体系(Windows环境)底层原理浅谈
· C# 深度学习:对抗生成网络(GAN)训练头像生成模型
· 手把手教你更优雅的享受 DeepSeek
· AI工具推荐:领先的开源 AI 代码助手——Continue
· 探秘Transformer系列之(2)---总体架构
· V-Control:一个基于 .NET MAUI 的开箱即用的UI组件库
· 乌龟冬眠箱湿度监控系统和AI辅助建议功能的实现