<template>
  <div>
    <el-table :span-method="arraySpanMethod" :row-class-name="tableClassName" v-loading="loading" highlight-current-row :data="data1" :header-cell-style="{background:'#EEEEEE',color:'#333'}" size="mini" :height="height" @row-click="rowClick" style="width:100%"  border>
      <el-table-column v-for="col in layout" :key="col.tablecolid" :prop="col.columnname" :label="col.title" :width="col.width">
        <template slot-scope="scope">
          <!-- 自定义表格显示内容 -->
          <slot v-if="custom" name="customcol" :column="{data:scope.row,columnname:col.columnname}"></slot>
          <!-- 否则就是默认 -->
          <span v-else>{{scope.row[col.columnname]}}</span>
          <!-- 操作结构内容 -->
          <slot v-if="col.columnname === 'product_handle'" name="product_handle" :data="scope.row"></slot>
          <slot v-if="col.columnname === 'project_handle'" name="project_handle" :data="scope.row"></slot>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {mapGetters} from "vuex"
export default {
  /*
    layout:表结构数据;
    data:表渲染数据;
    custom:是否启用自定义结构;
    opwidth:操作列宽度
  */
  props:['layout','data1','custom','height','endFalse'],
  data () {
    return {
    }
  },
  computed:{
    ...mapGetters({
      loading:'loading'
    })
  },
  methods:{
    rowClick (row) {
      this.$emit('rowClick',row)
    },
    tableClassName ({row,rowIndex}) {
      row.index = rowIndex
    },
    arraySpanMethod({row, column, rowIndex, columnIndex}) {
      if(columnIndex == 0 || columnIndex == 1 || columnIndex == this.layout.length - 1 && this.endFalse) {
        let _row = this.calcMerge().row[rowIndex]
        let _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan:_col
        }
      }
    },
    calcMerge() {
      let rowArr = [],
          colArr = [],
          rowIndex = 0,
          colIndex = 0
      this.data1.forEach((item,index) => {
        if(index == 0) {
          rowArr.push(1)
          colArr.push(1)
        } else {
          if(item.projectnum == this.data1[index - 1].projectnum) {
            rowArr[rowIndex] +=1
            rowArr.push(0)
          } else {
            rowArr.push(1)
            rowIndex = index
          }
        }
      })
      return {
        row:rowArr,
        col:colArr
      }
    }
  },
  mounted () {
  }
}

</script>
<style>
</style>