<template>
  <div class="app-container">
    <van-nav-bar
      title="政策法规"
      left-arrow
      fixed
      placeholder
      @click-left="onClickLeft"
    />
    <van-tabs animated type="card" color="#007b76" style="margin-top: 10px;">

      <van-tab title="政策法规">
        <van-list
          v-model="loading"
          :finished="finished"
          finished-text="没有更多了"
          style="margin-top: 10px;"
          @load="getList"
        >
          <van-cell v-for="(item,index) in List" icon="play" :key="index" :title="item.title" :to="{name:'policyDetail', query: {id:item.id}}">
            <template #label>
              <p style="float: right;">发布时间：{{item.newsTime}}</p>
            </template>
          </van-cell>
        </van-list>
      </van-tab>

      <van-tab title="交易规则">
        <van-list
          v-model="secondLoading"
          :finished="secondFinished"
          finished-text="没有更多了"
          style="margin-top: 10px;"
          @load="getSecondList"
        >
          <van-cell v-for="(item,index) in secondList" icon="play" :key="index" :title="item.title" :to="{name:'policyDetail', query: {id:item.id}}">
            <template #label>
              <p style="float: right;">发布时间：{{item.newsTime}}</p>
            </template>
          </van-cell>
        </van-list>
      </van-tab>

      <van-tab title="资料下载">
        <van-list
          v-model="threeLoading"
          :finished="threeFinished"
          finished-text="没有更多了"
          style="margin-top: 10px;"
          @load="getThreeList"
        >
          <van-cell v-for="(item,index) in threeList" icon="play" :key="index" :title="item.title" :to="{name:'policyDetail', query: {id:item.id}}">
          <template #label>
            <p style="float: right;">发布时间：{{item.newsTime}}</p>
          </template>
        </van-cell>
        </van-list>
      </van-tab>

    </van-tabs>
  </div>
</template>

<script>
  import { newList } from "@/api/index";
export default {
  name: "policy",
  data() {
    return {
      //是否显示加载
      loading: false,
      //是否滚动到底部
      finished: false,
      //是否显示加载
      secondLoading: false,
      //是否滚动到底部
      secondFinished: false,
      //是否显示加载
      threeLoading: false,
      //是否滚动到底部
      threeFinished: false,
      //政策法规集合
      List:[],
      //交易规则集合
      secondList:[],
      //资料下载集合
      threeList:[],
      //政策法规查询参数
      queryParams: {
        deptId:100,
        pageNum:1,
        pageSize:10,
        number:3
      },
      //交易规则查询参数
      querySecondParams: {
        deptId:100,
        pageNum:1,
        pageSize:10,
        number:4
      },
      //资料下载查询参数
      queryThreeParams: {
        deptId:100,
        pageNum:1,
        pageSize:10,
        number:5
      },
    };
  },
  created() {

  },
  methods: {
    //政策法规集合
    getList(){
      this.loading = true;
      newList(this.queryParams).then(response => {
        this.List = response.rows;
        console.log(response)
        if(this.List.length >= response.total){
          this.finished = true;
          return;
        }
        this.queryParams.pageNum += 1 ;
        this.loading = false;
      });
    },
    //交易规则集合
    getSecondList(){
      this.secondLoading = true;
      newList(this.querySecondParams).then(response => {
        this.secondList = response.rows;
        if(this.secondList.length >= response.total){
          this.secondFinished = true;
          return;
        }
        this.querySecondParams.pageNum += 1 ;
        this.secondLoading = false;
      });
    },
    //资料下载集合
    getThreeList(){
      this.threeLoading = true;
      newList(this.queryThreeParams).then(response => {
        this.threeList = response.rows;
        if(this.threeList.length >= response.total){
          this.threeFinished = true;
          return;
        }
        this.queryThreeParams.pageNum += 1 ;
        this.threeLoading = false;
      });
    },
  },
};
</script>

<style scoped lang="scss">
.app-container {
}
  .titleClass{

  }
</style>
