mall-web-ssr/pages/mobile/applyPurchase/list/index.vue

<template>
  <div class="mobile-content">
    <div class="seek-title">
      <img src="/images/mobile/@2x/applyPurchase/home/seek-title.png" alt="">
      <span>最新求购信息</span>
    </div>
    <seek-list :purchaseManList="purchaseManList"></seek-list>
    <loading v-show="isSearchSearchingMore"></loading>
  </div>
</template>
<script>
  import SeekList from '~components/mobile/applyPurchase/SeekList.vue'
  import {Loading} from '~components/mobile/common'
  export default {
    layout: 'mobile',
    components: {
      SeekList,
      Loading
    },
    data () {
      return {
        isSearchSearchingMore: false,
        page: 1,
        size: 10
      }
    },
//    mounted: function () {
//      let _this = this
//      _this.$nextTick(function () {
//        window.addEventListener('scroll', function () {
//          _this.scroll()
//        }, false)
//      })
//    },
    fetch ({store}) {
      return Promise.all([
        store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: store.state.option.user.data.enterprise ? store.state.option.user.data.enterprise.uu : null})
      ])
    },
    computed: {
      purchaseManList () {
        return this.$store.state.applyPurchase.purchaseManList.purchaseManList.data
      },
      allPage () {
        return Math.floor(this.purchaseManList.totalElements / this.purchaseManList.size) + Math.floor(this.purchaseManList.totalElements % this.purchaseManList.size > 0 ? 1 : 0)
      }
    },
    methods: {
      scroll: function () {
        let scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
        if (Math.ceil(scrolled + window.screen.availHeight) >= document.body.scrollHeight && !this.isSearchSearchingMore && this.page < this.allPage) {
          this.getMoreSearch()
        }
      },
      getMoreSearch: function () {
        this.page++
        this.isSearchSearchingMore = true
        this.$store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: this.page, pageSize: this.size, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null})
      }
    }
  }
</script>