树状结构改变某个单元格颜色,根据层级判断是否展示数据
<el-table :data="tableData" style="width: 100%;" :row-key="tableRowKey" border :highlight-current-row="true" :cell-style="tableCellStyle" :tree-props="treeProps" v-on:row-click="rowClick" v-loading="loading" height="100%">
<el-table-column type="index" label="#" width="50" align="center"></el-table-column>
<el-table-column prop="InspectionNodeName" label="环节名称">
<template slot-scope="scope">
{{dataRender(scope.row,['InspectionNodeName'], 'InspectionNodeName')}}
</template>
</el-table-column>
<el-table-column prop="FileName" label="文件名称">
<template slot-scope="scope">
<el-link v-on:click="handleClick(scope.row)" type="primary">{{dataRender(scope.row,['FileRecordInfo', 'FileName'])}}</el-link>
</template>
</el-table-column>
<el-table-column label="状态" width="200">
<template slot-scope="scope">
{{dataRender(scope.row,['Status','Name'])}}
</template>
</el-table-column>
<el-table-column label="检验人" width="200">
<template slot-scope="scope">
{{dataRender(scope.row,['Creator','Name'])}}
</template>
</el-table-column>
<el-table-column label="检验时间" width="150">
<template slot-scope="scope">{{dataRender(scope.row,['CreateTime'], 'Date')}}</template>
</el-table-column>
</el-table>
tableRowKey:function(row) {
return row.Id + row.CreateTime + row.CreateDate + row.InspectionNodeName + row.BusinessTemplateTypeName + row.FileName
},
// 改变某一行单元格背景颜色
tableCellStyle({ row, column, rowIndex, columnIndex}) {
let rowBackground = {};
if (this.isAnd) {
if (row.FileRecordId) {
if (columnIndex>1) {
if (row.Status) {
if (row.Status.Value==0||row.Status.Value==1) {
rowBackground.background = '#CAF982'
}
if (row.Status.Value>1) {
rowBackground.background = '#173F00'
}
}
}
}
if (!row.FileRecordId) {
if (columnIndex == 1) {
if (row.Status) {
if (row.Status.Value==0||row.Status.Value==1) {
rowBackground.background = '#CAF982'
}
if (row.Status.Value>1) {
rowBackground.background = '#173F00'
}
}
}
}
}
return rowBackground
},
//重绘列表框
dataRender:function(data, fieldList, type){
var value = '';
// 判断哪些单元格展示数据,哪些不展示数据
if(utils.isEmpty(data.BusinessTemplateTypeName)){
if(type == "InspectionNodeName"){
value = utils.dataRender(data, fieldList)
}
} else {
if(type !== "InspectionNodeName"){
value = utils.dataRender(data, fieldList);
}
if(type == "Date"){
value = utils.DateFormat(value);
}
}
return value;
}
实现效果