手机求购下拉加载

components/mobile/Home.vue

@@ -67,7 +67,7 @@
     },
     computed: {
       purchaseManList () {
-        return this.$store.state.applyPurchase.purchaseManList.purchaseManList.data
+        return this.$store.state.applyPurchase.purchaseManList.purchaseHomeList.data.content
       }
     },
     methods: {

components/mobile/applyPurchase/SeekList.vue

@@ -1,6 +1,6 @@
 <template>
   <ul class="seek-list">
-    <li v-for="(item, index) in purchaseManList.content">
+    <li v-for="(item, index) in purchaseManList">
       <p>
       <span v-if="item.inquiry.enterprise && item.inquiry.enterprise.enName">{{item.inquiry.enterprise.enName | enterpriseFilter}}</span>
       <span v-else>{{item.userName | userNameFilter}}</span>

nuxt.config.js

@@ -1,7 +1,7 @@
 const path = require('path')
 const isProdMode = Object.is(process.env.NODE_ENV, 'production')
 const baseUrl = process.env.BASE_URL || (isProdMode ? 'http://192.168.253.60:9090/platform-b2c/' : 'http://10.1.51.90:8080/platform-b2c/')
-const commonUrl = process.env.COMMON_URL || (isProdMode ? 'https://api-inquiry.usoftmall.com/' : 'http://10.1.51.88:8080/')
+const commonUrl = process.env.COMMON_URL || (isProdMode ? 'https://api-inquiry.usoftmall.com/' : 'http://218.17.158.219:24000/')
 
 module.exports = {
   router: {

pages/index.vue

@@ -104,7 +104,7 @@
         }),
         store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: 1, pageSize: 50, enUU: store.state.option.user.data.enterprise ? store.state.option.user.data.enterprise.uu : null})
       ]) : Promise.all([
-        store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: 1, pageSize: 5, enUU: store.state.option.user.data.enterprise ? store.state.option.user.data.enterprise.uu : null})
+        store.dispatch('applyPurchase/loadMobileHomeList', {pageNumber: 1, pageSize: 5, enUU: store.state.option.user.data.enterprise ? store.state.option.user.data.enterprise.uu : null})
       ])
     },
     computed: {

pages/mobile/applyPurchase/list/index.vue

@@ -4,8 +4,9 @@
       <img src="/images/mobile/@2x/applyPurchase/home/seek-title.png" alt="">
       <span>最新求购信息</span>
     </div>
-    <seek-list :purchaseManList="purchaseManList"></seek-list>
+    <seek-list :purchaseManList="purchaseManListData"></seek-list>
     <loading v-show="isSearchSearchingMore"></loading>
+    <div v-if="purchaseManList && false"></div>
   </div>
 </template>
 <script>
@@ -21,16 +22,19 @@
       return {
         isSearchSearchingMore: false,
         page: 1,
-        size: 10
+        size: 10,
+        purchaseManListData: []
       }
     },
-//    mounted: function () {
-//      let _this = this
-//      _this.$nextTick(function () {
-//        window.addEventListener('scroll', function () {
-//          _this.scroll()
-//        }, false)
-//      })
+    mounted: function () {
+      this.$nextTick(() => {
+        window.addEventListener('scroll', this.scroll, false)
+      })
+    },
+//    watch: {
+//      $route: function (val, oldVal) {
+//        window.removeEventListener('scroll', this.scroll, false)
+//      }
 //    },
     fetch ({store}) {
       return Promise.all([
@@ -39,6 +43,9 @@
     },
     computed: {
       purchaseManList () {
+        let list = this.$store.state.applyPurchase.purchaseManList.purchaseManList.data
+        this.purchaseManListData = this.purchaseManListData.concat(list.content)
+        this.isSearchSearchingMore = false
         return this.$store.state.applyPurchase.purchaseManList.purchaseManList.data
       },
       allPage () {

pages/mobile/user/index.vue

@@ -25,7 +25,7 @@
         <i class="iconfont icon-sousuo"></i>
         </span>
       </div>
-      <seek-list :userType="userType" :seekType="seekType" :purchaseManList="purchaseManList"></seek-list>
+      <seek-list :userType="userType" :seekType="seekType" :purchaseManList="purchaseManListData"></seek-list>
     </div>
     <div class="shop-list" v-if="activeType == 'store'" v-for="item in focusPage.content" @click="goStoreDetail(item.storeInfo.uuid)">
       <h3>{{item.storeName}}</h3>
@@ -35,8 +35,8 @@
           <img :src="item.storeInfo.logoUrl || '/images/component/default.png'">
         </div>
         <div class="list-item-phone">
-          <p>电话：<span>{{item.storeInfo.enterprise.enTel}}</span></p>
-          <p>传真：<span>{{item.storeInfo.enterprise.enFax}}</span></p>
+          <p>电话：<span>{{item.storeInfo.enterprise ? item.storeInfo.enterprise.enTel : '-'}}</span></p>
+          <p>传真：<span>{{item.storeInfo.enterprise ? item.storeInfo.enterprise.enFax : '-'}}</span></p>
           <p>联系商家：<a @click="selectStoreInfo(item, $event)">点击查看</a></p>
           <i class="iconfont icon-shoucang" @click="cancelFocus('store', item, $event)"></i>
         </div>
@@ -70,13 +70,15 @@
       </div>
     </div>
     <page-loading v-show="showLoading"></page-loading>
+    <loading v-show="isSearchSearchingMore"></loading>
+    <div v-if="purchaseManList && false"></div>
     <div v-if="purchaseManListFetching && false"></div>
   </div>
 </template>
 
 <script>
   import SeekList from '~components/mobile/applyPurchase/SeekList.vue'
-  import {RemindBox} from '~components/mobile/common'
+  import {RemindBox, Loading} from '~components/mobile/common'
   import PageLoading from '~components/common/loading/PageLoading.vue'
   export default {
     layout: 'mobile',
@@ -93,21 +95,32 @@
         storeInfo: {},
         seekType: 'wait',
         showLoading: false,
-        seekKeyword: ''
+        seekKeyword: '',
+        isSearchSearchingMore: false,
+        isChange: false,
+        seekPage: 1,
+        seekSize: 10,
+        purchaseManListData: []
       }
     },
     components: {
       RemindBox,
       SeekList,
-      PageLoading
+      PageLoading,
+      Loading
     },
     fetch ({ store, route }) {
       return Promise.all([
         store.dispatch('product/saveStores', { count: 100, page: 1, type: 'component' }),
         store.dispatch('shop/StoreFocusPage', { count: 100, page: 1 }),
-        store.dispatch(route.query.type === 'saler' ? 'applyPurchase/loadPurchaseManList' : 'applyPurchase/loadBuyerPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: store.state.option.user.data.enterprise ? store.state.option.user.data.enterprise.uu : store.state.option.user.data.userUU})
+        store.dispatch(route.query.type === 'saler' ? 'applyPurchase/loadPurchaseManList' : 'applyPurchase/loadBuyerUnSayPricePurchaseManList', {pageNumber: 1, pageSize: 10, enUU: store.state.option.user.data.enterprise ? store.state.option.user.data.enterprise.uu : store.state.option.user.data.userUU})
       ])
     },
+    mounted: function () {
+      this.$nextTick(() => {
+        window.addEventListener('scroll', this.scroll, false)
+      })
+    },
     methods: {
       cancelFocus: function (type, item, event) {
         event.stopPropagation()
@@ -163,46 +176,48 @@
       switchSeek: function (type) {
         this.seekType = type
         this.showLoading = true
-        if (this.userType !== 'saler') {
-          if (type === 'wait') {
-            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null})
-          } else if (type === 'done') {
-            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, _state: 'done'})
-          } else {
-            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, _state: 'done'})
-          }
-        } else {
-          if (type === 'wait') {
-            this.$store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise.uu})
-          } else if (type === 'done') {
-            this.$store.dispatch('applyPurchase/loadVendorPurchaseManList', {pageNumber: 1, pageSize: 10, _state: 'done', filter: {vendUU: this.$store.state.option.user.data.enterprise.uu, fromDate: null, endDate: null}})
-          } else {
-            this.$store.dispatch('applyPurchase/loadVendorPurchaseManList', {pageNumber: 1, pageSize: 10, _state: 'done', filter: {vendUU: this.$store.state.option.user.data.enterprise.uu, fromDate: null, endDate: null}})
-          }
-        }
+        this.seekKeyword = ''
+        this.isChange = true
+        this.seekPage = 1
+        this.reloadData()
       },
       switchType: function () {
+        this.seekType = 'wait'
         this.$router.push('/mobile/user' + (this.userType === 'saler' ? '' : '?type=saler'))
       },
       searchSeek: function () {
+        this.reloadData()
+      },
+      reloadData: function () {
         let type = this.seekType
         if (this.userType !== 'saler') {
           if (type === 'wait') {
-            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, keyword: this.seekKeyword})
+            this.$store.dispatch('applyPurchase/loadBuyerUnSayPricePurchaseManList', {pageNumber: this.seekPage, pageSize: this.seekSize, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, keyword: this.seekKeyword})
           } else if (type === 'done') {
-            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, _state: 'done', keyword: this.seekKeyword})
+            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: this.seekPage, pageSize: this.seekSize, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, _state: 'done', keyword: this.seekKeyword})
           } else {
-            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, _state: 'done', keyword: this.seekKeyword})
+            this.$store.dispatch('applyPurchase/loadBuyerPurchaseManList', {pageNumber: this.seekPage, pageSize: this.seekSize, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, _state: 'done', keyword: this.seekKeyword})
           }
         } else {
           if (type === 'wait') {
-            this.$store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: 1, pageSize: 10, enUU: this.$store.state.option.user.data.enterprise.uu, keyword: this.seekKeyword})
+            this.$store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: this.seekPage, pageSize: this.seekSize, enUU: this.$store.state.option.user.data.enterprise.uu, keyword: this.seekKeyword})
           } else if (type === 'done') {
-            this.$store.dispatch('applyPurchase/loadVendorPurchaseManList', {pageNumber: 1, pageSize: 10, _state: 'done', filter: {vendUU: this.$store.state.option.user.data.enterprise.uu, fromDate: null, endDate: null, keyword: this.seekKeyword}})
+            this.$store.dispatch('applyPurchase/loadVendorPurchaseManList', {pageNumber: this.seekPage, pageSize: this.seekSize, _state: 'done', filter: {vendUU: this.$store.state.option.user.data.enterprise.uu, fromDate: null, endDate: null, keyword: this.seekKeyword}})
           } else {
-            this.$store.dispatch('applyPurchase/loadVendorPurchaseManList', {pageNumber: 1, pageSize: 10, _state: 'done', filter: {vendUU: this.$store.state.option.user.data.enterprise.uu, fromDate: null, endDate: null, keyword: this.seekKeyword}})
+            this.$store.dispatch('applyPurchase/loadVendorPurchaseManList', {pageNumber: this.seekPage, pageSize: this.seekSize, _state: 'done', filter: {vendUU: this.$store.state.option.user.data.enterprise.uu, fromDate: null, endDate: null, keyword: this.seekKeyword}})
           }
         }
+      },
+      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.seekPage < this.allPage) {
+          this.getMoreSearch()
+        }
+      },
+      getMoreSearch: function () {
+        this.seekPage++
+        this.isSearchSearchingMore = true
+        this.reloadData()
       }
     },
     computed: {
@@ -232,12 +247,28 @@
       focusPage () {
         return this.$store.state.shop.storeInfo.focusPage.data
       },
+      purchase () {
+        return this.$store.state.applyPurchase.purchaseManList.purchaseManList
+      },
       purchaseManList () {
-        return this.$store.state.applyPurchase.purchaseManList.purchaseManList.data
+        let list = this.purchase.data.content
+        if (this.isChange) {
+          this.purchaseManListData = []
+          this.seekPage = 1
+          this.isChange = false
+        } else {
+          this.purchaseManListData = this.purchaseManListData.concat(list)
+          this.isSearchSearchingMore = false
+        }
+        console.log(this.purchaseManListData)
+        return this.purchase.data.content
+      },
+      allPage () {
+        return Math.floor(this.purchase.data.totalElements / this.purchase.data.size) + Math.floor(this.purchase.data.totalElements % this.purchase.data.size > 0 ? 1 : 0)
       },
       purchaseManListFetching () {
         this.showLoading = false
-        return this.$store.state.applyPurchase.purchaseManList.purchaseManList.fetching
+        return this.purchase.fetching
       }
     }
   }

store/applyPurchase.js

@@ -28,6 +28,16 @@ import axios from '~plugins/axios'
 // }
 
 export const actions = {
+  // 获取手机端首页求购数据
+  loadMobileHomeList ({ commit }, params = {}) {
+    commit('purchaseManList/REQUEST_MOBILE_HOME_SEEK')
+    return axios.get('/inquiry/public', {params})
+      .then(response => {
+        commit('purchaseManList/GET_MOBILE_HOME_SEEK_SUCCESS', response.data)
+      }, err => {
+        commit('purchaseManList/GET_MOBILE_HOME_SEEK_FAILURE', err)
+      })
+  },
 // 采购商列表
   loadPurchaseManList ({ commit }, params = {}) {
     commit('purchaseManList/REQUEST_PURCHASEMAN')
@@ -83,6 +93,15 @@ export const actions = {
         commit('purchaseManList/GET_PURCHASEMAN_FAILURE', err)
       })
   },
+  loadBuyerUnSayPricePurchaseManList ({ commit }, params = {}) {
+    commit('purchaseManList/REQUEST_PURCHASEMAN')
+    return axios.get('/inquiry/buyer/list', {params})
+      .then(response => {
+        commit('purchaseManList/GET_PURCHASEMAN_SUCCESS', response.data)
+      }, err => {
+        commit('purchaseManList/GET_PURCHASEMAN_FAILURE', err)
+      })
+  },
   loadVendorPurchaseManList ({ commit }, params = {}) {
     commit('purchaseManList/REQUEST_PURCHASEMAN')
     return axios.get('/inquiry/public/quotation/list', {params})

store/applyPurchase/purchaseManList.js

@@ -1,4 +1,8 @@
 export const state = () => ({
+  purchaseHomeList: {
+    fetching: false,
+    data: []
+  },
   purchaseManList: {
     fetching: false,
     data: []
@@ -18,6 +22,16 @@ export const state = () => ({
 })
 
 export const mutations = {
+  REQUEST_MOBILE_HOME_SEEK (state) {
+    state.purchaseHomeList.fetching = true
+  },
+  GET_MOBILE_HOME_SEEK_FAILURE (state) {
+    state.purchaseHomeList.fetching = false
+  },
+  GET_MOBILE_HOME_SEEK_SUCCESS (state, result) {
+    state.purchaseHomeList.fetching = false
+    state.purchaseHomeList.data = result
+  },
   REQUEST_PURCHASEMAN (state) {
     state.purchaseManList.fetching = true
   },