bootstrapTable根据数据计算单元格 的合并问题

关于boostrapTable单元格合并问题：
group By 列
max,sum列

插件自带使用方式：
//$(target).bootstrapTable(‘mergeCells’, { index: index, field: 字段名, colspan: colspan, rowspan: count });
（把多格合并为一格），所需的参数如下：
– index：所要合并的格所在行的索引（index）
– field：所在列的字段名
– rowspan：合并的行总数目
– colspan：合并的列总数目
api说明：https://blog.csdn.net/liushuiziyouliu/article/details/80988458

以下为个人封装：

 //调用自自己写的合并函数
     var arr = ["地市"];//组合键盘 , "区县"
     var cols = ["合计（地市）"];//受影响列，非groupBy分组字段
     var data = $('#table').bootstrapTable('getData', true);
 
 mergeCellsLLJ(data, arr, cols, 1, $('#table'));
/**
		 * 合并列
		 * @param data            原始数据（在服务端完成排序）
		 * @param fieldName      groupBy字段
		 * @param cols                受影响列
		 * @param colspan=1     合并列总数     
		 * @param target    
**/
function mergeCellsLLJ(data, fieldName, cols,colspan, target) {
    //声明一个map计算相同属性值在data对象出现的次数和
    //根据组合键，判断Rowspan的值
    var parList = data[0];
    var count = 0;
    var arrRows = [];
    for (var i = 0; i < data.length; i++) 
    {
        var nowRow = data[i];
        //if (Object.getOwnPropertyNames(parList).length==0)
        //fieldName  parList={}，所以循环无效
       
        var sflag = true;
        for (rowindex in fieldName)
         {
            var skey = fieldName[rowindex];
            if (nowRow[skey] != parList[skey])  sflag = false;
        }
		
		//计算和并行数RowSpan
        if (sflag)   count ++;
        else
        {
            parList = {}; 
            for (var j = 0; j < fieldName.length; j++) {
                //组件键  key--&gt;value
                parList[fieldName[j]] = nowRow[fieldName[j]];
            }
            arrRows.push(count); //在赋值之前，先把上次的值存储起来...
            count = 1;
        }
       
        //console.log(i.toString() + "  " + count + "  " + nowRow["xx"] + "  " + nowRow["xx2"]);
        if (i+1== data.length) 
        {
            arrRows.push(count);
        } //最后一行时候就添加大数组中  //data.length这里写成了fieldName.length
    }
    
    console.log(arrRows);
    for (var procol in fieldName) {
        var index = 0;
        for (var rI in arrRows) {
            var count = arrRows[rI];
            console.log(count);
            $(target).bootstrapTable('mergeCells', { index: index, field: fieldName[procol], colspan: colspan, rowspan: count 		   });
            index += count;
        }
    }

    for (var procol in cols)
    {
        var index = 0;
        for (var rI in arrRows)
        {
            var count = arrRows[rI];

            $(target).bootstrapTable('mergeCells', { index: index, field: cols[procol], colspan: colspan, rowspan: count });

            index += count;
        }
    }

}

 //调用自自己写的合并函数
     var arr = ["地市"];//组合键盘 , "区县"
     var cols = ["合计（地市）"];//受影响列，非groupBy分组字段
     var data = $('#table').bootstrapTable('getData', true);   

  mergeCellsLLJPage(data, arr, cols, 1, $('#table'), (MergeIndex - 1) * 15);

onLoadSuccess***: function () {
             	//调用，如果后端分页，就这里调用就可以；
            },
            maintainSelected: true,
            ***onPageChange***: function (number, size) {
      			点击页码事件
                MergeIndex = number;
          },
          ***onPostBody***: function (data) {
          		//如果是客户端分页，就这里调用
                if (data && data.length > 0) {
                     	//调用
                }
              },
//这种可以解决前端***客户端时***分页  的合并问题
/**
		 * 合并列
		 * @param data            原始数据（在服务端完成排序）
		 * @param fieldName      groupBy字段
		 * @param cols                受影响列
		 * @param colspan=1     合并列总数     
		 * @param target    
		 * @param sindex  合并开始行索引  
**/
        function mergeCellsLLJPage(data, fieldName, cols, colspan, target, sindex) {
            //声明一个map计算相同属性值在data对象出现的次数和
            //根据组合键，判断Rowspan的值
            var parList = data[sindex];
            var count = 0;
            var arrRows = [];
            var erowI = sindex + 15 > data.length ? data.length : sindex + 15;
            for (var i = sindex; i < erowI; i++) {
                var nowRow = data[i];
                //if (Object.getOwnPropertyNames(parList).length==0)
                //fieldName  parList={}，所以循环无效
                var sflag = true;
                for (rowindex in fieldName) {
                    var skey = fieldName[rowindex];
                    if (nowRow[skey] != parList[skey]) {
                        sflag = false;
                    }
                }
                if (sflag) {
                    count++
                }
                else {
                    parList = {};
                    for (var j = 0; j < fieldName.length; j++) {
                        //组件键  key-->value
                        parList[fieldName[j]] = nowRow[fieldName[j]];
                    }
                    arrRows.push(count); //在赋值之前，先把上次的值存储起来...
                    count = 1;
                }
                if (i + 1 == erowI) {
                    arrRows.push(count);
                } //最后一行时候就添加大数组中  //data.length这里写成了fieldName.length
            }
            var index = 0;
            for (var rI in arrRows) {
                var count = arrRows[rI];
                //Max列1：
                for (var procol in cols) {
                    $(target).bootstrapTable('mergeCells', { index: index, field: cols[procol], colspan: colspan, rowspan: count });
                }
                //groupBy列1：
                for (var procol in fieldName) {
                    $(target).bootstrapTable('mergeCells', { index: index, field: fieldName[procol], colspan: colspan, rowspan: count });
                }
                index += count;
            }
        }

代码007普通

打赏 收藏 海报 链接