<template>
  <el-table :data="tableData" style="width: 100%" :header-cell-style="{ background: 'rgba(45, 116, 231,0.2)', 
      color: '#333333', height: '35px', textAlign: 'center' }" :cell-style="{padding:'5px 0'}" height="200px" @row-dblclick="rowClick">
    <template slot="empty">
      <img src="@/assets/icon/null.png" alt="暂无数据" style="width:100px" />
    </template>
    <el-table-column label="序号" align="center" width="50">
      <template slot-scope="scope">{{scope.$index+1}}</template>
    </el-table-column>
    <el-table-column prop="pipeCategory" label="类别" align="center"></el-table-column>
    <el-table-column label="类型" align="center">
      <template slot-scope="{row}">
        <span v-if="row.pipeCategory=='污水'">ws</span>
        <span v-else-if="row.pipeCategory=='雨水'">ys</span>
        <span v-else-if="row.pipeCategory=='雨污河流'">hs</span>
      </template>
    </el-table-column>
    <el-table-column :prop="type=='pipe'?'pipeId':'juneid'" label="部件标识码" align="center" width="100" show-overflow-tooltip></el-table-column>
  </el-table>
</template>

<script>
export default {
  props: {
    type: {
      type: String,
      default: 'pipe'
    },
    tableData: {
      type: Array,
      default: []
    }
  },
  methods: {
    rowClick(row) {
      this.$emit("row-dblclick", row)
    }
  }
}
</script>

<style lang="scss" scoped>
// .el-table >>> .el-table__cell {
//   padding: 2px 0 !important;
// }
</style>