Layui table 合并单元格
合并单元格这里使用的是 done 回调方法,因为是先隐藏相同单元格然后给头行增加合并属性,所以逻辑是:

循环所有行,每次进入都判断当前行的唯一值是否跟上一个相同
如果唯一值相同则隐藏对应的单元格并加一合并行计数
不同就先把之前的行进行合并,然后保存当前行的唯一值
如果需要合并的单元格下有合计行,计算单元格的合计值
如果是最后一次循环,进行处理行的合并,不然你会发现列表的最后一行没有合并
记得把计算的合计值添加到合计行上
————————————————

ea.table.render({
   init: init,
   totalRow: true,
   cols: [[
       {field: ‘warehouse_id’,hide:true,search:’false’},
       {type: ‘checkbox’},
       {field: ‘warehouse.sort’, title: ‘序号’,width:70,totalRowText: ‘合计’},
       {field: ‘warehouse.serial_number’, title: ‘流水号’,width:120},
       {field: ‘warehouse.carNumber.title’, title: ‘车号’,width:100},
       {field: ‘warehouse.forward.title’, title: ‘发货单位’,minWidth:120},
       {field: ‘warehouse.consignee.title’, title: ‘收货单位’,width:80},
       {field: ‘warehouse.goods.title’, title: ‘货品’,width:80},
       {field: ‘warehouse.standards’, title: ‘规格’},
       {field: ‘gross_weight’, title: ‘毛重’,width:100,totalRow: true},
       {field: ‘tare_weight’, title: ‘皮重’,width:100,totalRow: true},
       {field: ‘net_weight’, title: ‘净重’,width:100,totalRow: true},
       {field: ‘type’,title: ‘类型’,width:70,search: ‘select’,selectList: {‘-1′:’付款’,0:’未知’,1:’收款’,2:’石料’,3:’叉车’,4:’运费’,5:’返点’},templet:function (d) {
               //0.未知 1.收款 2.石料 3.叉车 4.运费 5.返点
               var arr = [‘未知’,’收款’,’石料’,’叉车’,’运费’,’返点’];
               var color = [‘#707070′,’#00ee00′,’#00eedf’,’#eec500′,’#ee6a00′,’#EE00DB’];
               return ‘<span style=”color: ‘ + color[parseInt(d.type)] + ‘”>’ + arr[parseInt(d.type)] + ‘</span>’;
           }},
       {field: ‘title.title’, title: ‘收付对象’,minWidth:120,templet:function (d) {
               return d.title ? d.title.title : ‘-‘;
           }},
       {field: ‘number’, title: ‘数量’,width:70,search: ‘false’},
       {field: ‘unit’,title: ‘单位’,width:70,search: ‘false’},
       {field: ‘price’,title: ‘单价’,width:70,search: ‘false’},
       {field: ‘payable_amount’,title: ‘应收付金额’,width:100,search: ‘false’,totalRow: true},
       {field: ‘amount_paid’,title: ‘已收付金额’,width:100,search: ‘false’,totalRow: true},
       {field: ‘pending_amount’,title: ‘待收付金额’,width:100,search: ‘false’,totalRow: true},
       {width: 110, title: ‘操作’,fixed:’right’, templet: ea.table.tool},
   ]],
   done: function(){
    var mark = 1; //计算每次需要合并的格子数
    var trArr = $(“.layui-table-main>.layui-table”).find(“tr”);//所有行
    var current = ”;   //上个处理的数据唯一值
    var currentRow = ”;   //上个处理的行
    var totalRow = $(“.layui-table-total>.layui-table”).find(“tr”).eq(0).find(‘td’); //合计行
    var gross_weight = 0;   //毛重
    var tare_weight = 0;    //皮重
    var net_weight = 0;     //净重
    trArr.each(function (i, v){
        var is_same = current === trArr.eq(i).find(‘td’).eq(3).find(‘div’).find(‘span’).text();    // 当前行是否与上个处理行相同
        //相同则隐藏单元格
        if (is_same){
            //按需求前12列相同的单元格都要隐藏(根据你的需求修改)
            for (var k = 0; k < 12; k++) {
                trArr.eq(i).find(‘td’).eq(k).css(‘display’, ‘none’);
            }
            //计算合并行数
            mark += 1;
        }else{
            // 合并上个处理行
            if (current){
                for (var j = 0; j < 12; j++) {
                    currentRow.eq(j).attr(‘rowspan’, mark);
                }
            }
            //保存当前行
                currentRow = trArr.eq(i).find(‘td’);
                current = currentRow.eq(3).find(‘div’).find(‘span’).text();
            mark = 1;
            //计算合计行
            gross_weight += trArr.eq(i).find(‘td’).eq(9).text() * 1;
            tare_weight += trArr.eq(i).find(‘td’).eq(10).text() * 1;
            net_weight += trArr.eq(i).find(‘td’).eq(11).text() * 1;
        }
        // 循环结束处理合并
        if (trArr.length – 1 === i){
            for (var l = 0; l < 12; l++) {
                currentRow.eq(l).attr(‘rowspan’, mark);
            }
        }
    })
    // 计算合计
    totalRow.eq(9).find(‘div’).text(Math.round(gross_weight*100)/100);
    totalRow.eq(10).find(‘div’).text(Math.round(tare_weight*100)/100);
    totalRow.eq(11).find(‘div’).text(Math.round(net_weight*100)/100);
   }
});
219d6e183740ad9a70a9f85bdbbeacd7