<template>
  <div class="app-container container">
    <SearchBar ref="SearchBar" @search="loadData" />
    <Table
      ref="Table"
      :list="list"
      @getList="loadData"
      v-loading="loading"
      previewType="caj"
      currentKey="pageNo"
      sizeKey="pageCount"
      totalKey="totalElements"
    />
  </div>
</template>
<script>
import SearchBar from "./components/searchBar/index.vue";
import Table from "./components/table/index.vue";
import {
  getNewspaperList,
  getPeriodicalsList, //期刊
  getConferenceList, //会议
  getThesisList, //论文
} from "@/api/resource/index";
export default {
  components: {
    SearchBar,
    Table,
  },
  data() {
    return {
      list: {
        records: [],
        totalElements: 0,
        pageCount: 10,
        pageNo: 1,
      },
      loading: false,
    };
  },

  methods: {
    /**
     * @params {boolean} refresh 是否需要重置 当手动进行回车时需要重置pageNo
     */
    async loadData(refresh = false) {
      this.loading = true;
      const { activeTab, keyword, currentYear } = this.$refs.SearchBar;
      if (refresh) {
        this.list.pageNo = 1;
      }
      const { pageNo, pageCount } = this.list;
      const params = {
        keyword,
        pageNo,
        pageCount,
        year: currentYear,
      };
      let request;
      switch (activeTab) {
        case "报纸":
          request = getNewspaperList;
          break;
        case "期刊":
          request = getPeriodicalsList;
          break;
        case "会议":
          request = getConferenceList;
          break;
        case "论文":
          request = getThesisList;
          break;
      }
      let res = await request(params);
      if (res.code == 200) {
        this.list = res.data;
        this.list.pageCount = Number(this.list.pageCount);
        this.list.pageNo = Number(this.list.pageNo);
        this.loading = false;
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.container {
  background-color: #f7f8fa;
  padding: 20px;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
</style>
