<template>
  <el-row>
    <basic-container>
      <avue-crud
        :option="option"
        :table-loading="loading"
        :data="dataSource"
        :page.sync="page"
        ref="crud"
        v-model="crudValues"
        :permission="permissionList"
        @search-change="searchChange"
        @search-reset="searchReset"
        @current-change="currentChange"
        @size-change="sizeChange"
        class="customPage"
      >
      </avue-crud>
    </basic-container>
  </el-row>
</template>

<script>
import {mapGetters} from "vuex";
import {getList} from "@/api/tenant/personnelserve";

const page = {
  pageSize: 10,
  currentPage: 1,
  total: 0,
}
const baseOptions = {
  size: 'medium',
  dateBtn: false,
  addBtn: false,
  editBtn: false,
  delBtn: false,
  height: "auto",
  reserveSelection: false,
  border: true,
  columnBtn: false,
  refreshBtn: false,
  menu: true,
  tip: false,
  selection: false,
  align: 'center',
  searchMenuSpan: 6,
  searchLabelWidth: 60,
}
export default {
  data() {
    return {
      loading: false,
      dataSource: [],
      crudValues: {},
      page: Object.assign({}, page)
    }
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.tenant_main_talents_latent_index_add, false),
        viewBtn: true,
        delBtn: this.vaildData(this.permission.tenant_main_talents_latent_index_del, false),
        editBtn: this.vaildData(this.permission.tenant_main_talents_latent_index_edit, false),
      };
    },
    option() {
      return {
        ...baseOptions,
        column: [
          {
            label: "姓名",
            prop: "name",
            search: true,
            searchSpan: 6,
          },
          {
            label: "身份证",
            prop: "idNumber",
            search: true,
            searchSpan: 6,
          },
          {
            label: "手机号",
            prop: "phone",
          },
        ]
      }
    }
  },
  methods: {
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      const {releaseTimeRange} = params;
      let values = {
        ...params,
      };
      this.loading = true;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(values, this.query)
      ).then((res) => {
        const {total, records, page} = res.data.data
        this.page.total = total;
        // this.page.currentPage = page
        this.dataSource = records;
        this.loading = false;
      });
    },
  }
}

</script>

<style lang="scss" scoped>


</style>
