easyui将表格进行分组合并，根据数据的值进行分组，不在一个组内不进行合并操作

刚刚接手到公司的考勤功能，需要将考勤数据与加班数据分两行显示，但是计算加班及休假时间有需要显示在一行，大概是这样的;

网络上找了很多有关表格合并的功能，发现都是直接根据相同值进行合并；
自己动手改，将数据进行分组

var rows = tTable.datagrid("getRows");
            var map = {},
                dest = [];
            var rowNumber=[];
            for(var m = 0; m < rows.length; m++){
                var ai = rows[m];
                rowNumber.push({
                    rownumber:m,
                    userName:ai.userName
                });
                if(!map[ai.userName]){
                    dest.push({
                        userName: ai.userName,
                        item: [ai],
                    });
                    map[ai.userName] = ai;
                }else{
                    for(var n = 0; n < dest.length; n++){
                        var dj = dest[n];
                        var number=rowNumber[n];
                        if(dj.userName== ai.userName){
                            dj.item.push(ai);

                        }
                    }
                }
            }

将数据根据userName进行分组

for(m=0;m<dest.length;m++){
        var count=null;
        var name=dest[m].userName;
        var length=dest[m].item.length;
        for(var d=0;d<rowNumber.length;d++){
            if(name==rowNumber[d].userName){
                if(count==null){
                    count=rowNumber[d].rownumber;
                }else{
                   if(count>rowNumber[d].rownumber){
                       count=rowNumber[d].rownumber;
                   }
                }
            }
        }

然后根据分组将数据的行数标记出来并且获取到一组数据的length

      for (j = ColArray.length - 1; j >= 0; j--) {
            PerTxt = "";
            buyprocode = "";
            tmpA = 1;
            tmpB = 0;

            for (i = 0; i <= dest[m].item.length; i++) {
                if (i == dest[m].item.length) {
                    CurTxt = "";
                    newbuyprocode = "";
                }

                else {
                    CurTxt=dest[m].item[ColArray[j]];
                    //CurTxt = tTable.datagrid("getRows")[i][ColArray[j]];
                    //newbuyprocode = tTable.datagrid("getRows")[i]["buyprojectCode"];
                }
                if (PerTxt == CurTxt) {
                    tmpA += 1;
                }else {

                    tmpB += tmpA;
                    var index=i - tmpA;
                    tTable.datagrid("mergeCells", {
                        index: count,
                        field: ColArray[j],　　//合并字段
                        rowspan: length,
                        colspan: null
                    });
                    tTable.datagrid("mergeCells", { //根据ColArray[j]进行合并
                        index: count,
                        field: "Ideparture",
                        rowspan: length,
                        colspan: null
                    });

                    tmpA = 1;
                }
                PerTxt = CurTxt;
               // buyprocode = newbuyprocode;
            }
        }

根据分组数据将一组数据传入合并，这里要注意，rowspan的值是数据组的长度，index则是开始合并的行数

在datagrid中进行调用

 onLoadSuccess: function (data) {
            if (data.rows.length > 0) {
                mergeCellsByField("test-table-simple","number,remarks");
            }
        },

其中test-table-simple是table的id，number及remarks是需要合并的列明，可以队列名进行指定
我本来是做后端的，前段也是半路出家，虽然功能实现了，也有很多性能问题，后续有优化会发上来

最后附上效果图