看下效果:

1、在el-table上添加属性span-method

2、里面参数的示例如下(平铺的数据即可):
[{"itemResType": "CPU","itemModelType": null,"itemKey": "cpu.cores","itemName": "CPU核数","itemUnit": "核","logicPoolId": 58,"extLogicTotal": 333,"remainValue": 303,"useValue": 30,"quotaValue": 1,"tips": null,"quotaBefore": 1,"totalUseValue": 31},{"itemResType": "MEM","itemModelType": null,"itemKey": "memory.total","itemName": "内存","itemUnit": "Gi","logicPoolId": 58,"extLogicTotal": 2288.1,"remainValue": 2208.1,"useValue": 80,"quotaValue": 1,"tips": null,"quotaBefore": 1,"totalUseValue": 81},{"itemResType": "GPU","itemModelType": "NVIDIA-NVIDIA GeForce RTX 2070","itemKey": "gpu.card","itemName": "GPU卡数","itemUnit": "张","logicPoolId": 58,"extLogicTotal": 3,"remainValue": 1,"useValue": 2,"quotaValue": 1,"tips": "单卡最大显存16Gi","quotaBefore": 1,"totalUseValue": 3},{"itemResType": "GPU","itemModelType": "NVIDIA-GRID P40-1Q","itemKey": "gpu.card","itemName": "GPU卡数","itemUnit": "张","logicPoolId": 58,"extLogicTotal": 3,"remainValue": 1,"useValue": 2,"quotaValue": 1,"tips": "单卡最大显存1Gi","quotaBefore": 1,"totalUseValue": 3},{"itemResType": "NPU","itemModelType": "Ascend910B4","itemKey": "npu.card","itemName": "NPU卡数","itemUnit": "张","logicPoolId": 58,"extLogicTotal": 16,"remainValue": 8,"useValue": 8,"quotaValue": 3.95,"tips": "单卡最大显存256Gi","quotaBefore": 3.95,"totalUseValue": 11.95}
]
3、合并单元格方法如下(index.ts):
核心:将key相同的行进行合并,也可以换成你们所选择的id或者name等,只要是唯一标识即可,代码如下
// 合并单元格
export const objectSpanMethod = (data: any[]) => {console.log('----quotaItems---------',data)return ({ row, column, rowIndex, columnIndex }) => {if (columnIndex === 0) { // 只对第一列应用合并规则// 查找相同itemName的起始行let startRow = rowIndexwhile (startRow > 0 && data[startRow - 1].itemKey === row.itemKey) {startRow--}// 计算相同itemName的行数let rowspan = 1while (startRow + rowspan < data.length &&data[startRow + rowspan].itemKey === row.itemKey) {rowspan++}// 如果是相同itemName的第一行,则返回合并行数if (rowIndex === startRow) {return {rowspan: rowspan,colspan: 1}} else {// 非第一行则隐藏单元格return {rowspan: 0,colspan: 0}}}}
}
4、引入公共方法:

5、大功告成,有问题的小伙伴在评论区留言!!