//控制列
//对象表格控制
objectSpanMethod1({ rowIndex, columnIndex }) {
if (columnIndex === 0 || columnIndex === 1) {
const _row = this.flitterData(this.projectTarget,columnIndex).one[rowIndex];
const _col = _row > 0 ? 1 : 0;
return {
rowspan: _row,
colspan: _col
};
}
},
// 维度内容相同的合并单元格
flitterData(arr,columnIndex) {
let spanOneArr = [];
let concatOne = 0;
arr.forEach((item, index) => {
if (index === 0) {
spanOneArr.push(1);
} else {
//name 修改
if(columnIndex===0){
if (item.r1 === arr[index - 1].r1) {
//第一列需合并相同内容的判断条件
spanOneArr[concatOne] += 1;
spanOneArr.push(0);
} else {
spanOneArr.push(1);
concatOne = index;
}
}else if(columnIndex===1){
if (item.r2 === arr[index - 1].r2) {
//第二列需合并相同内容的判断条件
spanOneArr[concatOne] += 1;
spanOneArr.push(0);
} else {
spanOneArr.push(1);
concatOne = index;
}
}
}
});
return {one: spanOneArr};
},
//控制行
arraySpanMethod({ row, column, rowIndex, columnIndex }) {
// alert(this.flitterData(this.partsList).one[rowIndex]+'\n'+JSON.stringify(row)+"----"+'\n'+"-------------"+rowIndex+"--"+columnIndex);
if (columnIndex === 1) {
const _row = this.flitterData(this.partsList).one[rowIndex];
const _col = _row > 1 ? 1 : 2;
return [_row, _col];
}else if (columnIndex === 2) {
const _row = this.flitterData(this.partsList).one[rowIndex];
if(_row==1){
return [0,0];
}
}
},
// 维度内容相同的合并单元格
flitterData(arr) {
let spanOneArr = [];
let concatOne = 0;
arr.forEach((item, index) => {
if (index === 0) {
spanOneArr.push(1);
} else {
//name 修改
if (item.partNameFather === arr[index - 1].partNameFather) {
//第一列需合并相同内容的判断条件
spanOneArr[concatOne] += 1;
spanOneArr.push(0);
} else {
spanOneArr.push(1);
concatOne = index;
}
}
});
return {
one: spanOneArr
};
},
========================================================
背景色控制
body
js
// 改变某一列单元格背景颜色
tableCellStyle({ row, column, rowIndex, columnIndex }) {
//console.log(row); // 基本都在这里面 其余的可自行打印
// 这里写逻辑判断(看你是什么需求)
if (columnIndex === 1&&row.oneSign===1&&rowIndex!=0) {
return 'background:#ED7D31;color:white;borderColor:#EDEDF2'
}
}
css
/deep/.el-input__inner[Color="tran"]{
background: transparent !important;
border: 0px;
}