el-table给合并行添加颜色

<template>
  <el-table :data="tableData"  style="width: 100%" 
  :row-class-name="tableRowClassName"
  :span-method="spanMethod"
  >
    <el-table-column prop="date"  label="日期" width="180"> </el-table-column>
    <el-table-column prop="name" label="姓名" width="180"> </el-table-column>
    <el-table-column prop="address" label="地址"> </el-table-column>
  </el-table>
</template>


<script>
  export default {
	  created(){
	  
	  	for(let i in this.tableData){
		  	if(i==0){
			  	this.spanArr.push(i);
			  	this.pos=0;
			  	this.tableData[i].color='color1';
			}else{
				if(this.tabelData[i].id==this.tableData[i-1].id){
					this.spanArr[this.pos]+=1;
					this.spanArr.push(0);
					this.spanArr[i].color=this.spanArr[i-1].color;
					
				}else{
					this.spanArr.push(1);
					this.pos=1;
					if(this.spanArr[i-1].color=='color1'){
						this.spanArr[i].color='color2'
					}else{
						this.spanArr[i].color='color1'
					}
				}
			}
		}
		console.log(JSON.stringfy(this.tabelData));
	  },
    methods: {
      tableRowClassName({row, rowIndex}) {
        if (row.color=='color1') {
          return 'warning-row';
        } else if (row.color=='color2') {
          return 'success-row';
        }
        return '';
      },
      spanMethod({row,column,rowIndex,columnIndex}){
      	if(columnIndex==0){
			const row =this.spanArr[rowIndex];
			const col =row>0?1:0;
			return{
				rowspan:row;
				colspan:col;
			}
		}
      },
    },
    data() {
      return {
        tableData: [{
	      id:1,
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
        }, {
	      id:2,
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
	      id:3,
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
        }, {
	      id:4,
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }]
      }
    }
  }
</script>
<style>
  .el-table .warning-row {
    background: oldlace;
  }

  .el-table .success-row {
    background: #f0f9eb;
  }
</style>

加粗样式