<template>
    <div class="table">
      <el-table
        :data="tableData"
        border
        :style="{'width': width}"
        :height="height">
        <el-table-column
          align="center"
          prop="inviteCode"
          label="邀请码">
        </el-table-column>
        <el-table-column
          align="center"
          prop="realName"
          label="绑定人">
        </el-table-column>
        <el-table-column
          align="center"
          label="手机号">
          <template slot-scope="scope">
            {{scope.row.phone}}
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="city"
          label="绑定企业">
          <template slot-scope="scope">
            <span style="color: #3F9EFF;">{{negativeTurnZero(scope.row.bind)}}</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="address"
          label="审核中企业">
          <template slot-scope="scope">
            <span style="color: #3F9EFF;">{{negativeTurnZero(scope.row.examine)}}</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="zip"
          label="已开户企业">
          <template slot-scope="scope">
            <span style="color: #3F9EFF;">{{negativeTurnZero(scope.row.openAccount)}}</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          fixed="right"
          label="操作"
          width="100">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="goUrl('/workstation/InvitationCode/index')">查看</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!-- 占位 -->
      <div style="height: 20px;"></div>
      <div :style="{'width': width}" style="overflow: auto">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes="pageSizes"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </div>
    </div>
</template>

<script>
  import { negativeTurnZero } from "@/util/validate";
  /*
  * width     表格宽度滚动
  * pageSizes 分页数组
  * pageSize  分页默认选中
  * total     合计
  * height    表格高度
  * tableData 表格数据
  * */
export default {
  name: "bench",
  props: {
    width: {
      type: String,
      default: 1375 + 'px'
    },
    pageSizes: {
      default: [10, 20, 30, 40]
    },
    pageSize: {
      type: Number,
      default: 10
    },
    total: {
      type: Number,
      default: 0
    },
    height: {
      type: Number,
      default: 400
    },
    tableData: []
  },
  data(){
      return {
      }
  },
  methods: {
    negativeTurnZero,
    goUrl(url){
      this.$router.push(url)
    },
    handleSizeChange(val) {
      this.$emit('handleSizeChange', val)
    },
    handleCurrentChange(val) {
      this.$emit('handleCurrentChange', val)
    }
  },
}
</script>

<style scoped>
  .table{
    text-align: center;
  }
</style>
