（表格合并行）

Zero0985

已于 2023-05-12 16:42:06 修改

阅读量70

点赞数

分类专栏： js 文章标签： vue.js javascript

于 2023-02-14 16:30:56 首次发布

本文链接：https://blog.csdn.net/qq_41742961/article/details/129029323

版权

js 专栏收录该内容

35 篇文章 0 订阅

订阅专栏

mergeTable(tableList,key) {
        /*（表格合并行）
        合并规则:根据后端接口数据相同字段返回的数据值一样合并
        rowspn合并思路：获取相同字段的数据值的总个数就是合并的rowspan
        row:获取相同字段不同值首次出现的下标
        tableList = [
            {"businessunit":"AMHK","product":"AMHK_Seed Capital Investment"},
            {"businessunit":"AMHK","product":"AMHK_Seed Capital Investment"},
            {"businessunit":"AMHK","product":"AMHK_Seed Capital Investment"},
            {"businessunit":"AMHK","product":"AMHK_Seed Capital Investment"},
            {"businessunit":"AMHK","product":"AMHK_Seed Capital Investment"},
            {"businessunit":"AMHK","product":"Total"},
            {"businessunit":"CCMHK_AI","product":"CCMHK_AI_GP commitment"},
        ]
        key:'businessunit'
        */
        let rowlist = []
        let rowspanList = Object.values(tableList.reduce((pre,cur,index)=> {
            if(cur[key] in pre) {
                pre[cur[key]] ++
            }else {
                pre[cur[key]] = 1
                rowlist.push(index)
            }
            return pre
        },{}))
        let mergeList = []
        rowlist.forEach((item,index)=> {
            mergeList.push({
                row: item,
                col: 0,
                rowspan: rowspanList[index],
                colspan: 0
            })
        })
        return mergeList
    }

spanMethods({ row, $rowIndex, column, data }) {
        let fields = ["Department", "BusinessUnit", "Product", "Project"]
        let cellValue = row[column.property]
        if (cellValue && fields.includes(column.property)) {
            let prevRow = data[$rowIndex - 1]
            let nextRow = data[$rowIndex + 1]
            if (prevRow && prevRow[column.property] === cellValue) {
                return { rowspan: 0, colspan: 0 }
            } else {
                let countRowspan = 1
                while (nextRow && nextRow[column.property] === cellValue) {
                    nextRow = data[++countRowspan + $rowIndex]
                }
                if (countRowspan > 1) {
                    return { rowspan: countRowspan, colspan: 1 }
                }
            }
        }
    },