<template>
  <div>
    <el-table :data="tableData" v-loading="loading" max-height="550px" border tooltip-effect="dark">
      <el-table-column prop="deptname" align="center" label="部门名称"></el-table-column>
      <el-table-column prop="deptcode" align="center" label="部门编码"></el-table-column>
      <el-table-column prop="description" align="center" label="部门描述"></el-table-column>
      <el-table-column prop="" align="center" label="操作">
        <template slot-scope="scope">
          <el-button icon="el-icon-edit" size="mini" type="primary" title="编辑" v-if="true" @click="edit(scope.row)">
          </el-button>
          <el-button icon="el-icon-delete" size="mini" type="danger" title="删除" v-if="true" @click="del(scope.row)">
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination @current-change="handleCurrentChange" @size-change="handleSizeChange"
      layout="total, prev, pager, next, sizes" :page-size="pagination.pageSize" :page-sizes="[10, 20, 30, 50]"
      :current-page="pagination.pageNum" :total="pagination.total">
    </el-pagination>
  </div>
</template>
<script>
  export default {
    props: {
      tableData: {
        type: Array,
        default: () => [],
      },
      pagination: {
        type: Object,
        default: () => {},
      },
      loading: {
        type: Boolean,
        default: () => true
      }
    },
    filters: {
      statusFilter(status) {
        const statusMap = {
          2: "danger",
          1: "success",
        };
        return statusMap[status];
      },
      statusName(status) {
        const statusMap = {
          2: "禁用",
          1: "启用",
        };
        return statusMap[status];
      },
    },
    methods: {
      edit(item) {
        this.$emit("edit", item);
      },
      del(item) {
        this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
          .then(() => {
            this.$store
              .dispatch("dept/DeptDelete", {
                id: item.id
              })
              .then((res) => {
                this.$emit("getData");
              });
          })
          .catch(() => {});
      },
      handleCurrentChange(val) {
        this.pagination.pageNum = val;
        this.$emit("getData");
      },
      handleSizeChange(val) {
        this.pagination.pageSize = val;
        this.pagination.pageNum = 1;
        this.$emit("getData");
      },
    },
  };

</script>
<style lang="scss" scoped>
</style>
