<template>
  <div>
    <search v-model="query" search-placeholder="搜索通证标识"></search>
    <transfer-record-list @nextPage="nextPage" class="list-table" :transfer-list="transferList" />
  </div>
</template>

<script>
import Search from "../newProductList/Search";
import TransferRecordList from "./TransferRecordList";
import {GO_URLS} from "../../config/URLS";
export default {
  name: "TransferRecord",
  data() {
    return {
      query: {
        // 查询通证列表的查询条件
        type: 0,
        identifier: '',
        amount_sort: 0
      },
      page: 1,
      page_size: 50,
      transferList: [], // 查询到的通证列表
      total: 0
    }
  },
  components: {
    Search,
    TransferRecordList
  },
  mounted() {
    this.getList(true);
  },
  watch: {
    query: {
      handler() {
        this.getList(true);
      },
      deep: true
    }
  },
  methods: {
    /**
     * @param refresh 当查询条件改变时传入整个列表刷新，否则查询数据添加到 passList
     */
    async getList(refresh) {
      if (refresh) {
        this.page = 1;
      }
      const params = Object.assign(
          {},
          this.query,
          {
            page: this.page,
            page_size: this.page_size
          }
      )

      if (params.identifier === '') delete params.identifier;

      const res = await this.$ajax({
        type: "get",
        url: GO_URLS.transferList,
        params
      });
      this.total = res.data.total;
      if (refresh) {
        this.transferList = res.data.results || [];
      } else {
        this.transferList = this.transferList.concat(res.data.results);
      }
    },
    /**
     * 滚动加载通证列表
     */
    async nextPage() {
      if (this.total > this.page * this.page_size) {
        this.page += 1;
        await this.getList(false);
      }
    }
  },
}
</script>

<style scoped>
.list-table {
  margin-top: 21px;
}
</style>
