<template>
  <div class="app-container container">
    <SearchBar ref="SearchBar" @search="loadData" />
    <Table ref="Table" :list="list" @getList="loadData" v-loading="loading" />
  </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: {
    async loadData() {
      this.loading = true;
      const { activeTab, keyword } = this.$refs.SearchBar;
      const { pageNo, pageCount } = this.$refs.Table.queryParams;
      const params = {
        keyword,
        pageNo,
        pageCount,
      };
      if (keyword) {
        params.pageNo = 1;
      }
      console.log(params);
      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.loading = false;
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.container {
  background-color: #f7f8fa;
  padding: 20px 40px;
}
</style>
