/**
* 合并行方法
* @param {Number} rowIndex 行索引
* @param {Number} columnIndex 列索引
* @param {Array} dataSource 数据源
* @param {Array} mergeCfg 合并配置 例如:[{searchKey: 'score', columnIndex: 0 }] searchKey：需检索的属性，columnIndex：代表要合并的列数
*/
export function mergeRows(rowIndex:any, columnIndex:any, dataSource:any, mergeCfg:any) {
for (let item of mergeCfg) {
let searchKey = item.searchKey
if (columnIndex === item.columnIndex) { // 要合并的列
if (rowIndex !== 0 && dataSource[rowIndex][searchKey] === dataSource[rowIndex - 1][searchKey]) { // 非第一行合并规则
return [0, 0]
} else { // 第一行合并规则
let rowIndexCount = rowIndex
let count = 0
while (rowIndexCount + 1 < dataSource.length) { // 用当前行数据跟后续行数数据对比
if (dataSource[rowIndexCount + 1][searchKey] === dataSource[rowIndexCount][searchKey]) {
rowIndexCount++
count++
} else { // 数据不相等跳出循环
break
}
}
return [count + 1, 1]
}
}
}
}
//调用
cellMerges( {row, column, rowIndex, columnIndex}:any){
// 合并行条件
const mergeCfg = [
{ searchKey: 'typeIndex', columnIndex: 0 },
{ searchKey: 'typeIndex', columnIndex: 1 },
{ searchKey: 'typeIndex', columnIndex: 3 },
{ searchKey: 'typeIndex', columnIndex: 5 }
]
return mergeRows(rowIndex, columnIndex, this.dataSource, mergeCfg)
}
// Element
<el-table
:data="dataSource"
:span-method="cellMerges"
>
</el-table >
网友评论