iview table 表 重复行列合并

iview table表 重复行列合并

iview官方例子:iview table表格
1、唯一且重复的合并
2、在唯一合并下的不唯一且重复的合并
3、不唯一且重复在上一个不唯一合并条件下的合并
return [1,2] => 将1行2列合并,同时需要将第一行第二列(或第一行第一列的表格删除)的表格删除使其return [0,0]
·······································································
计算合并的列与数量

			//表合并
            handleData(data) {
                let that = this
                //是唯一值但有重复的合并
                //所有的不同的加油站
                let stationArr = []
                data.forEach(e => {
                    !stationArr.includes(e.StationCode) ? stationArr.push(e.StationCode) : stationArr
                })
                // 设置加油站的默认跨行数0
                let stationObj = []
                stationArr.forEach(e => {
                    stationObj.push({
                        id: e,
                        num: 0
                    })
                })
                // 跨行数计算
                data.forEach(e => {
                    //加油站的
                    stationObj.forEach(item => {
                        e.StationCode == item.id ? item.num++ : item.num
                    })
                })
                //将计算好的合并数赋给第一条重复的数据,其它重复的数据合并的参数全部置空
                data.forEach(e => {
                    //加油站
                    stationObj.forEach((item, index) => {
                        if (e.StationCode == item.id) {
                            if (stationArr.includes(e.StationCode)) {
                                e.mergeCol = item.num
                                stationArr.splice(stationArr.indexOf(e.StationCode), 1)
                            } else {
                                e.mergeCol = 0
                            }
                        }
                    })
                })

				//不唯一且重复的情况下,在唯一的基础上合并重复
                for (var j = 0; j < data.length; j++) {
                    //  > 1 StationCode表示 有合并需要在StationCode合并的row中 再合并
                    if (data[j].mergeCol > 1) {
                        for (var k = 0; k < data[j].mergeCol; k++) {
                            //天数合并
                            if (data[j + k].dayalready !== 1) {
                                if (k + 1 < data[j].mergeCol) {
                                    data[j + k].mergeDay = 1
                                    for (var b = k + 1; b < data[j].mergeCol; b++) {
                                        if (data[j + k].Day === data[j + b].Day) {
                                            data[j + k].mergeDay++
                                            data[j + b].mergeDay = 0
                                            data[j + b].dayalready = 1
                                        } else {
                                            break
                                        }

                                    }
                                }

                            }
                        }
                    }
                    //不唯一且重复(只有0和1),在上一个重复的合并下再次细分合并
                    //短信合并
                    if (data[j].mergeDay > 1) {
                        for (var k = 0; k < data[j].mergeDay; k++) {
                            //短信合并
                            if (data[j + k].noticealready !== 1) {
                                if (k + 1 < data[j].mergeDay) {
                                    data[j + k].mergeNotice = 1
                                    for (var b = k + 1; b < data[j].mergeDay; b++) {
                                        if (data[j + k].Notice === data[j + b].Notice) {
                                            data[j + k].mergeNotice++
                                            data[j + b].mergeNotice = 0
                                            data[j + b].noticealready = 1
                                        } else {
                                            break
                                        }
                                    }
                                }

                            }
                        }
                    }
                }
                return data
            },

合并的表格代码(本例只合并列)

	//在数据处理时在每个重复并需要合并的第一个插入了含合并数量的值
 			//表格合并
            handleSpan({row, column, rowIndex, columnIndex}) {
                // 序号、加油站合并、状态、时间
                if (columnIndex == 0 || columnIndex == 1 || columnIndex == 2 || columnIndex == 3) {
                    return {
                        rowspan: row.mergeCol === 0 ? 0 : row.mergeCol, //从第一个开始计算合并数,将计算的合并数赋值到对应的第一个(或最后一个)对象中,mergeCol有值则代表合并,为0则代表删除
                        colspan: row.mergeCol === 0 ? 0 : 1
                    };
                }
                // 持续天数合并
                if (columnIndex == 4) {
                    return {
                        rowspan: row.mergeDay === 0 ? 0 : row.mergeDay,
                        colspan: row.mergeDay === 0 ? 0 : 1
                    };
                }
                // 是否发送短信
                if (columnIndex == 7) {
                    return {
                        rowspan: row.mergeNotice === 0 ? 0 : row.mergeNotice,
                        colspan: row.mergeNotice === 0 ? 0 : 1
                    };
                }
            },
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值