<template>
  <el-table class="xt-table" :data="tableData" border style="width: 100%">
    <el-table-column fixed prop="date" label="日期" width="150">
    </el-table-column>
    <el-table-column prop="name" label="姓名" width="120"> </el-table-column>
    <el-table-column prop="province" label="省份" width="120">
    </el-table-column>
    <el-table-column prop="city" label="市区" width="120"> </el-table-column>
    <el-table-column prop="address" label="地址" width="300"> </el-table-column>
    <el-table-column prop="zip" label="邮编" width="120"> </el-table-column>
    <el-table-column fixed="right" label="操作" width="100">
      <template slot-scope="scope">
        <el-button @click="look(scope.row)" type="text" size="small"
          >查看</el-button
        >
        <el-button @click="edit(scope.row)" type="text" size="small"
          >编辑</el-button
        >
        <el-button @click="remove(scope.row)" type="text" size="small"
          >删除</el-button
        >
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  name: "El-table",
  props: {
    tableData: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  data() {
    return {};
  },
  // 销毁组件时执行
  methods: {
    look(row) {
      this.$emit('look', row)
    },
    edit(row) {
      this.$emit('edit', row)
    },
    remove(row) {
      this.$emit('remove', row)
    },
  },
};
</script>

<style lang="scss" scoped>
.xt-table {
}
.mgr20{
  margin-right:20px
}
.eee{
  color:#999
}
</style>
