搜索结果页分页问题处理，店铺及用户页布局修改还原

pages/mobile/search/_keycode.vue

@@ -45,7 +45,7 @@
       <a @click="goLastPage">返回上一页</a>
     </div>
     <remind-box :title="collectResult" :timeoutCount="timeoutCount"></remind-box>
-    <loading v-show="isSearchingMore"></loading>
+    <loading v-show="isSearchSearchingMore"></loading>
     <login-box @onLoginBoxClose="showLoginBox = false" v-if="showLoginBox"></login-box>
   </div>
 </template>
@@ -68,7 +68,7 @@
         collectResult: '收藏成功',
         timeoutCount: 0,
         searchLists: [],
-        isSearchingMore: false,
+        isSearchSearchingMore: false,
         showLoginBox: false
       }
     },
@@ -99,12 +99,8 @@
     computed: {
       productList () {
         let list = this.$store.state.searchData.searchList.lists.data
-        if (this.isSearchingMore) {
-          this.searchLists = this.searchLists.concat(list.components)
-          this.isSearchingMore = false
-        } else {
-          this.searchLists = list.components
-        }
+        this.searchLists = this.searchLists.concat(list.components)
+        this.isSearchSearchingMore = false
         return list
       },
       allPage () {
@@ -177,12 +173,13 @@
       },
       getMoreSearch: function () {
         this.page++
-        this.isSearchingMore = true
-        this.$store.dispatch('searchData/searchForListInMobile', {count: 15, filter: {}, keyword: this.$route.query.w, page: this.page, sorting: {'GO_RESERVE': 'DESC', 'GO_SEARCH': 'DESC'}})
+        this.isSearchSearchingMore = true
+        this.$store.dispatch('searchData/searchForListInMobile', {count: 15, filter: {}, keyword: this.$route.query.w, page: this.page, sorting: {'RESERVE': 'DESC'}})
       },
       scroll: function () {
         let scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
-        if (Math.ceil(scrolled + window.screen.availHeight) >= document.body.scrollHeight && !this.isSearchingMore && this.page < this.allPage) {
+        console.log(Math.ceil(scrolled + window.screen.availHeight) >= document.body.scrollHeight)
+        if (Math.ceil(scrolled + window.screen.availHeight) >= document.body.scrollHeight && !this.isSearchSearchingMore && this.page < this.allPage) {
           this.getMoreSearch()
         }
       }

pages/mobile/shop/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="shop" id="shop">
+  <div class="shop">
     <div class="shop-top">
       <p><i class="iconfont icon-dianpu1"></i><span>{{list.totalElements || 0}}</span>家店铺</p>
       <span @click="onClick()">{{downName}} <i class="iconfont icon-arrow-down"></i></span>
@@ -98,16 +98,15 @@
     mounted: function () {
       let _this = this
       _this.$nextTick(function () {
-        document.getElementById('shop').addEventListener('scroll', function () {
+        window.addEventListener('scroll', function () {
           _this.scroll()
         }, false)
       })
     },
     methods: {
       scroll: function () {
-        let obj = document.getElementById('shop')
-        let scrolled = obj.scrollTop
-        if (Math.ceil(scrolled + obj.clientHeight) >= obj.scrollHeight && !this.isSearchingMore && this.page < this.allPage) {
+        let scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
+        if (Math.ceil(scrolled + window.screen.availHeight) >= document.body.scrollHeight && !this.isSearchingMore && this.page < this.allPage) {
           this.getMoreStore()
         }
       },
@@ -189,130 +188,126 @@
 
 <style scoped lang="scss">
   .shop{
-    position: fixed;
-    width: 100%;
-    top: .88rem;
-    bottom: .98rem;
-    overflow-y: auto;
+    margin-bottom: .98rem;
     min-height: 10rem;
     background: #e2e4e6;
-  .shop-top{
-    width:100%;
-    height:1.14rem;
-    line-height: 1.14rem;
-    padding:0 .3rem;
-    position:relative;
-    background:#fff;
-    .supdown{
-      position:absolute;
-      top:.8rem;
-      right:.2rem;
-      z-index:1;
-      background:#616264;
-      border-radius:.1rem;
-      li{
-        font-size: .28rem;
-        color:#ffffff;
-        height: .32rem;
-        line-height: .32rem;
-        margin: .4rem .3rem;
-      }
-    }
-    p{
-      font-size:.24rem;
-      color:#000;
-      display: inline-block;
-      i{
-        font-size: .53rem;
-        color:#418ef7;
-      }
-      span{
-        font-size:.3rem;
-        color:#f94f28;
-        margin:0 .1rem;
+    .shop-top{
+      width:100%;
+      height:1.14rem;
+      line-height: 1.14rem;
+      padding:0 .3rem;
+      position:relative;
+      background:#fff;
+      .supdown{
+        position:absolute;
+        top:.8rem;
+        right:.2rem;
+        z-index:1;
+        background:#616264;
+        border-radius:.1rem;
+        li{
+          font-size: .28rem;
+          color:#ffffff;
+          height: .32rem;
+          line-height: .32rem;
+          margin: .4rem .3rem;
+        }
       }
-    }
-    >span{
-      font-size:.28rem;
-      color:#53a0f7;
-      float: right;
-    }
-  }
-  .shop-list {
-    background:#fff;
-    margin-top:.1rem;
-    padding-bottom:.1rem;
-    box-shadow: 0 .03rem .01rem 0 #cdcbcb96;
-    h3{
-      font-size: .32rem;
-      line-height: .4rem;
-      margin: 0 0 0 .27rem;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      padding-top: .1rem;
-      position: relative;
-      top: .1rem;
-    }
-    .list-item{
-      width:6.77rem;
-      margin-left:.39rem;
-      .item-img{
-        position:relative;
-        width:2.42rem;
-        height:1.69rem;
+      p{
+        font-size:.24rem;
+        color:#000;
         display: inline-block;
-        vertical-align: middle;
         i{
-          display:block;
-          position:absolute;
-          width:.65rem;
-          height:.33rem;
+          font-size: .53rem;
+          color:#418ef7;
         }
-        img{
-          display:inline-block;
-          width:100%;
-          height:100%;
-          border:.04rem solid #eee;
-          background-color: #fff;
+        span{
+          font-size:.3rem;
+          color:#f94f28;
+          margin:0 .1rem;
         }
       }
-      .list-item-phone{
-        width:3.95rem;
-        padding:.18rem 0;
-        position:relative;
-        display: inline-block;
-        vertical-align: middle;
-        margin-left: .2rem;
-        p{
-          font-size:.28rem;
-          line-height: .67rem;
-          margin:0;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          width: 3.2rem;
-        }
-        i{
-          display:block;
-          position:absolute;
-          top: -.06rem;
-          right: -.06rem;
-          font-size:.5rem;
-          color:#ff7800;
-          width: .6rem;
-          height: .6rem;
-          text-align: center;
-          line-height: .6rem;
+      >span{
+        font-size:.28rem;
+        color:#53a0f7;
+        float: right;
+      }
+    }
+    .shop-list {
+      background:#fff;
+      margin-top:.1rem;
+      padding-bottom:.1rem;
+      box-shadow: 0 .03rem .01rem 0 #cdcbcb96;
+      h3{
+        font-size: .32rem;
+        line-height: .4rem;
+        margin: 0 0 0 .27rem;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        padding-top: .1rem;
+        position: relative;
+        top: .1rem;
+      }
+      .list-item{
+        width:6.77rem;
+        margin-left:.39rem;
+        .item-img{
+          position:relative;
+          width:2.42rem;
+          height:1.69rem;
+          display: inline-block;
+          vertical-align: middle;
+          i{
+            display:block;
+            position:absolute;
+            width:.65rem;
+            height:.33rem;
+          }
+          img{
+            display:inline-block;
+            width:100%;
+            height:100%;
+            border:.04rem solid #eee;
+            background-color: #fff;
+          }
         }
-        i.active{
-          color:#333;
+        .list-item-phone{
+          width:3.95rem;
+          padding:.18rem 0;
+          position:relative;
+          display: inline-block;
+          vertical-align: middle;
+          margin-left: .2rem;
+          p{
+            font-size:.28rem;
+            line-height: .67rem;
+            margin:0;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            width: 3.2rem;
+          }
+          i{
+            display:block;
+            position:absolute;
+            top: -.06rem;
+            right: -.06rem;
+            font-size:.5rem;
+            color:#ff7800;
+            width: .6rem;
+            height: .6rem;
+            text-align: center;
+            line-height: .6rem;
+          }
+          i.active{
+            color:#333;
+          }
         }
       }
-    }
-    &:active {
-      background: #e1e1e1;
-    }
+      &:active {
+        background: #e1e1e1;
+      }
     }
   }
 

pages/mobile/user/index.vue

@@ -201,11 +201,7 @@
 
 <style scoped lang="scss">
   .user-content{
-    position: fixed;
-    top: .88rem;
-    bottom: .98rem;
-    width: 100%;
-    overflow-y: auto;
+    margin-bottom: .98rem;
     background: #dfe2e4;
 
     .none-state{
@@ -375,8 +371,8 @@
         padding:.2rem;
         position:relative;
         &:active{
-           background: #e1e1e1;
-         }
+          background: #e1e1e1;
+        }
         p{
           font-size:.28rem;
           line-height:.4rem;