D7QUANTAI/DSWeb/Areas/MvcShipping/Viewsjs/MsCwVouchersGl/core.js

/** 第一种 方法
 * 合并单元格
 * @param {} grid  要合并单元格的grid对象
 * @param {} rows  那合并那几列 [1,2,4]
 *

var mergeCells = function (grid, rows) {
    //得到grid的El对象

    var sdk0 = Ext.get(grid.getId() + "-body");
    var sdk1 = Ext.get(grid.getId() + "-body").first();
    var sdk2 = Ext.get(grid.getId() + "-body").first().first();

    var gridEl = Ext.get(grid.getId() + "-body").first().first().first();
    //得到所有可以有机会进行合并单元格行(tr)的集合
    var arrayTr = gridEl.select("tr");
    arrayTr.each(function (el) {//取出表头等没用的列
        if (el.getAttribute("class") == "x-grid-header-row") {
            arrayTr.removeElement(el)
        }
    })
    //定义一个辅助的内部函数
    var merge = function (rowspanObj, removeObjs) {
        var trIndex = 1;
        arrayTr.each(function (tr) {
            var arrayTd = tr.select("td");
            arrayTd.each(function (td) {
                if (td.getAttribute("class").indexOf("x-grid-cell-special") != -1) {
                    arrayTd.removeElement(td)
                }
            });
            //跨列
            if (trIndex == rowspanObj["tr"]) {
                var tdIndex = 1;
                arrayTd.each(function (td) {
                    if (tdIndex == rowspanObj["td"]) {
                        if (rowspanObj["rowspan"] != 1) {
                            td.set({ "rowspan": rowspanObj["rowspan"], "valign": "middle" });
                        }
                    }
                    tdIndex++;
                });
            }
            //删除
            Ext.each(removeObjs, function (obj) {
                var tdIndex = 1;
                if (trIndex == obj["tr"]) {
                    arrayTd.each(function (td) {
                        if (tdIndex == obj["td"]) {
                            td.set({ "style": "display:none" })
                        }
                        tdIndex++;
                    })
                }
            })
            trIndex++;
        })
        console.log(rowspanObj);
        console.log(removeObjs);
    }
    //要进行跨列操作的td对象{tr:1,td:2,rowspan:5}
    var rowspanObj = {};
    //要进行删除的td对象[{tr:2,td:2},{tr:3,td:2}]
    var removeObjs = [];
    //逐列去操作tr
    Ext.each(rows, function (rowIndex) {
        console.log("--------------------------------------");
        var trIndex = 1;
        var rowspan = 1;
        var divHtml = null; //单元格内的数值
        var trCount = arrayTr.getCount();
        arrayTr.each(function (tr) {
            //准备td集合
            var arrayTd = tr.select("td");
            arrayTd.each(function (td) {
                //移除序号,多选框等不进行合并的td
                if (td.getAttribute("class").indexOf("x-grid-cell-special") != -1) {
                    arrayTd.removeElement(td)
                }
            })
            //准备格式化每一列
            var tdIndex = 1;
            arrayTd.each(function (td) {
                if (tdIndex == rowIndex) {
                    if (!divHtml) {
                        divHtml = td.first().getHTML();
                        rowspanObj = { tr: trIndex, td: tdIndex, rowspan: rowspan }
                    } else {
                        var cellText = td.first().getHTML();
                        if (cellText == divHtml) {
                            rowspanObj["rowspan"] = rowspanObj["rowspan"] + 1;
                            removeObjs.push({ tr: trIndex, td: tdIndex });
                            if (trIndex == trCount) {
                                merge(rowspanObj, removeObjs); //执行合并函数
                            }
                        } else {
                            merge(rowspanObj, removeObjs); //执行合并函数
                            divHtml = cellText;
                            rowspanObj = { tr: trIndex, td: tdIndex, rowspan: rowspan }
                            removeObjs = [];
                        }
                    }
                }
                tdIndex++;
            })
            trIndex++;
        })
    })
}
*/



/** 第二种 方法
* Kunoy 
* 合并单元格 
* @param {} grid  要合并单元格的grid对象 
* @param {} cols  要合并哪几列 [1,2,4] 
*/
var mergeCells = function (grid, cols) {
    var arrayTr = document.getElementById(grid.getId() + "-body").firstChild.firstChild.firstChild.getElementsByTagName('tr');
    var trCount = arrayTr.length;
    var arrayTd;
    var td;
    var merge = function (rowspanObj, removeObjs) { //定义合并函数  
        if (rowspanObj.rowspan != 1) {
            arrayTd = arrayTr[rowspanObj.tr].getElementsByTagName("td"); //合并行  
            td = arrayTd[rowspanObj.td - 1];
            td.rowSpan = rowspanObj.rowspan;
            td.vAlign = "middle";
            Ext.each(removeObjs, function (obj) { //隐身被合并的单元格  
                arrayTd = arrayTr[obj.tr].getElementsByTagName("td");
                arrayTd[obj.td - 1].style.display = 'none';
            });
        }
    };
    var rowspanObj = {}; //要进行跨列操作的td对象{tr:1,td:2,rowspan:5}      
    var removeObjs = []; //要进行删除的td对象[{tr:2,td:2},{tr:3,td:2}]  
    var col;
    Ext.each(cols, function (colIndex) { //逐列去操作tr  
        var rowspan = 1;
        var divHtml = null; //单元格内的数值          
        for (var i = 1; i < trCount; i++) {  //i=0表示表头等没用的行  
            arrayTd = arrayTr[i].getElementsByTagName("td");
            var cold = 0;
            Ext.each(arrayTd, function (Td) { //获取RowNumber列和check列  
                if (Td.getAttribute("class").indexOf("x-grid-cell-special") != -1)
                    cold++;
            });
            col = colIndex + cold; //跳过RowNumber列和check列  
            if (!divHtml) {
                divHtml = arrayTd[col - 1].innerHTML;
                rowspanObj = { tr: i, td: col, rowspan: rowspan }
            } else {
                var cellText = arrayTd[col - 1].innerHTML;
                var addf = function () {
                    rowspanObj["rowspan"] = rowspanObj["rowspan"] + 1;
                    removeObjs.push({ tr: i, td: col });
                    if (i == trCount - 1)
                        merge(rowspanObj, removeObjs); //执行合并函数  
                };
                var mergef = function () {
                    merge(rowspanObj, removeObjs); //执行合并函数  
                    divHtml = cellText;
                    rowspanObj = { tr: i, td: col, rowspan: rowspan }
                    removeObjs = [];
                };
                if (cellText == divHtml) {
                    if (colIndex != cols[0]) {
                        //取得上一个合并的列号
                        //var iCol = col;
                        //if (colIndex != lastCol) {
                        //    iCol = lastCol;
                        //}

                        var iCol = lastCol + 1; //取得第一个合并的列号
                        var leftDisplay = arrayTd[iCol - 2].style.display; //判断左边单元格值是否已display  
                        if (leftDisplay == 'none')
                            addf();
                        else
                            mergef();
                    } else {
                        addf();
                        lastCol = col; //取得第一个合并的列号;
                    }
                } else {
                    mergef();
                }
            }
        }
        //lastCol = col; //取得上一个合并的列号
    });
};
//*/



/** 第三种 方法
* ruantao1989 
* 合并单元格  
* @param {} grid  要合并单元格的grid对象  
* @param {} cols  要合并哪几列 例如 [1,2,4]  
*
var mergeCells = function (grid, cols) {
    //==>ExtJs4.2的<tbody>改到上层<table>的lastChild . <tbody>是各个<tr>的集合  
    var arrayTr = document.getElementById(grid.getId() + "-body").firstChild.firstChild.lastChild.getElementsByTagName('tr');

    var trCount = arrayTr.length;  //<tr>总行数  
    var arrayTd;
    var td;

    //==>显示层将目标格的样式改为.display='none';        
    var merge = function (rowspanObj, removeObjs)//定义合并函数    
    {
        if (0 != rowspanObj.rowspan) {
            arrayTd = arrayTr[rowspanObj.tr].getElementsByTagName("td"); //合并行    
            td = arrayTd[rowspanObj.td - 1];
            td.rowSpan = rowspanObj.rowspan;
            td.vAlign = "middle";
            //    td.style.font-size = '20px';  
            //    $(td).hide();  
            $(td).css("font-size", "15px");
            $(td).attr("title", $(td).text());
            $(td).find('span').attr("title", $(td).text());
            $(td).css('color', 'rgb(148, 201, 36)');
            var height = $(td).innerHeight();
            if (removeObjs.length > 0) {
                $(td).css("padding-top", height / 3);
                //  var showIndex = Math.ceil(removeObjs.length/2);  
            }

            //隐身被合并的单元格    
            Ext.each(removeObjs, function (obj) {
                arrayTd = arrayTr[obj.tr].getElementsByTagName("td");
                arrayTd[obj.td - 1].style.display = 'none';
                arrayTd[obj.td - 1].style.borderTop = "none";
            });

        }
    };
    //==>显示层将目标格的样式改为.display='none';       

    var rowspanObj = {}; //要进行跨列操作的td对象{tr:1,td:2,rowspan:5}        
    var removeObjs = []; //要进行删除的td对象[{tr:2,td:2},{tr:3,td:2}]    
    var col;
    //==>逐列靠表内具体数值去合并各个<tr> (表内数值一样则合并)   

//    try {


        Ext.each(cols, function (colIndex) {
            var rowspan = 1;
            var divHtml = null; //单元格内的数值            
            for (var i = 0; i < trCount; i++)//==>从第一行数据0开始  
            {
                //==>一个arrayTr[i]是一整行的所有数据, 一个arrayTd是 <td xxxx ><div>具体数值</div></td> ,  
                arrayTd = arrayTr[i].getElementsByTagName("td");
                var cold = 0;
                //          Ext.each(arrayTd,function(Td){ //获取RowNumber列和check列    
                //              if(Td.getAttribute("class").indexOf("x-grid-cell-special") != -1)    
                //                  cold++;                                 
                //          });    
                col = colIndex + cold; //跳过RowNumber列和check列    

                if (!divHtml) {
                    divHtml = arrayTd[col - 1].innerHTML;
                    divHtml = $(divHtml).text(); //==>拿到真正数值,相比Ext4.1多了一层<div>  
                    rowspanObj = { tr: i, td: col, rowspan: rowspan }
                }
                else {
                    var cellText = arrayTd[col - 1].innerHTML;
                    cellText = $(cellText).text(); //==>拿到真正数值   


                    var addf = function () {
                        rowspanObj["rowspan"] = rowspanObj["rowspan"] + 1;
                        removeObjs.push({ tr: i, td: col });
                        if (i == trCount - 1) {
                            merge(rowspanObj, removeObjs); //执行合并函数    
                        }
                    };
                    var mergef = function () {
                        merge(rowspanObj, removeObjs); //执行合并函数    
                        divHtml = cellText;
                        rowspanObj = { tr: i, td: col, rowspan: rowspan }
                        removeObjs = [];
                    };

                    if (cellText == divHtml) {
                        if (colIndex != cols[0]) {
                            var leftDisplay = arrayTd[col - 2].style.display; //判断左边单元格值是否已display    
                            if (leftDisplay == 'none') {
                                addf();
                            }
                            else {
                                mergef();
                            }
                        }
                        else {
                            addf();
                        }
                    }
                    else {
                        mergef();
                    }
                }
            }
        });


//    } catch (e) {
//        console.log(e.message)
//    }
}; 
*/