<template>
 <div class="list-data" 
    v-infinite-scroll="loadMore" 
    infinite-scroll-disabled="loading"     
    infinite-scroll-distance="10">
      <equipment-list :list="list"></equipment-list>
      <div class="loading" v-if="loading">
         <span id="load-text">{{loadText}}</span>
      </div>
 </div>
</template>
<script>
    import { findPage } from '@/api/api'
    import EquipmentList from 'common/list/EquipmentList.vue'
    export default {
        data(){
            return {
               loading:false,
               loadText:'正在加载...',
               list: [],
               param: {
                 pageIndex: 0,
                 pageSize: 10
               }
         },
         components:{
            EquipmentList
         },
         methods: {
            getList(callBack){
               findPage(this.param).then(response => {
                  if(response.ret){
                    let data = response.datas
                    if(!data){data = []}

                    // 上次list的长度
                    let len = this.list.length
         
                    // 拼接数据
                    this.list = this.list.concat(data)

                    if (data && data.length == 0 && !len) {
                      this.loadText = '没有找到相关数据'
                    } else if (data && data.length < 10) {
                      this.loadText = '暂无更多数据'
                    } else {
                      this.loading = false
                    }

                    callBack && callBack()
                  }
                },reject => {})
            },
            loadMore() {
               this.loading = true
               this.param.pageIndex += 1
               this.getList()
            }
         }
     }
</script>
<style>
  .list-data{
    height: 100%;
    overflow-y: auto;
  }
</style>