Merge branch 'dev' of http://git.ycjcjy.com/SpaceOfCheng/wechat into dev

src/components/vue-load-more/index.vue

@@ -8,20 +8,20 @@
   >
     <section class="inner" :style="{ transform: 'translate3d(0, 0px, 0)' }">
       <header class="pull-refresh">
-        <slot name="pull-refresh">
+        <!-- <slot name="pull-refresh">
           <span class="down-tip">下拉更新</span>
           <span class="up-tip">松开刷新数据</span>
           <span class="refresh-tip">加载中……</span>
-        </slot>
+        </slot> -->
       </header>
       <slot></slot>
-      <footer class="load-more">
+      <footer class="load-more" v-show="!dataList.noFlag">
         <slot name="load-more">
           <span v-show="downFlag === false">上拉加载更多</span>
           <span v-show="downFlag === true">加载中……</span>
         </slot>
       </footer>
-      <div class="nullData" v-show="dataList.noFlag">暂无更多数据</div>
+      <!-- <div class="nullData" v-show="dataList.noFlag">暂无更多数据</div> -->
     </section>
   </div>
 </template>
@@ -77,8 +77,8 @@ export default {
       this.startScroll = this.$el.scrollTop || 0
       this.touching = true // 留着有用，不能删除
 
-      this.dataList.noFlag = false
-      this.$el.querySelector('.load-more').style.display = 'block'
+      // this.dataList.noFlag = false
+      // this.$el.querySelector('.load-more').style.display = 'block'
     },
     touchMove (e) {
       if (this.dataList.noFlag || !this.touching) {
@@ -137,6 +137,10 @@ export default {
       //   return
       // }
 
+      if (this.dataList.noFlag) {
+        return
+      }
+
       let outerHeight = this.$el.clientHeight
       let innerHeight = this.$el.querySelector('.inner').clientHeight
       let scrollTop = this.$el.scrollTop
@@ -184,7 +188,7 @@ export default {
 <style lang="scss" scoped>
 .yo-scroll {
   font-size: 0.24rem;
-  position: absolute;
+  position: fixed;
   top: 0;
   right: 0;
   bottom: 0;

src/pages/user/library/booksList/index.vue

@@ -1,33 +1,40 @@
 <template>
   <div class="mainPage">
-    <div>
-      <div class="noData" v-if="show && (books.list || []).length < 1">
-        <img src="../../../../common/icon/kong.png" alt>
-        <span>暂无内容</span>
+    <loadMore :on-infinite="onInfinite" :dataList="scrollData">
+      <div class="box">
+        <div class="noData" v-if="show && (books.list || []).length < 1">
+          <img src="../../../../common/icon/kong.png" alt>
+          <span>暂无内容</span>
+        </div>
+        <ul>
+          <li v-for="(item, index) in (books.list || [])" :key="index" v-if="show">
+            <libraryListItem
+              :data="item"
+              :status="mineBookStatus(item)"
+              @appointmentBook="appointmentBook"
+            ></libraryListItem>
+          </li>
+        </ul>
       </div>
-      <ul>
-        <li v-for="(item, index) in (books.list || [])" :key="index" v-if="show">
-          <libraryListItem :data="item" :status="mineBookStatus(item)" @appointmentBook="appointmentBook"></libraryListItem>
-        </li>
-      </ul>
-      <van-dialog v-model="showAppointmentDialog" :show-confirm-button="false">
-        <div class="dialogContent">
-          <span class="title">确认在线预约当前图书?</span>
-          <div>
-            <span style="color: #666;">在线预约需在{{reserveEndDate}}前前往案场借阅图书, 否则 将取消预约资格</span>
-          </div>
-          <div class="btn">
-            <a @click="sureAppointmentBook">确定</a>
-            <a @click="showAppointmentDialog = false">取消</a>
-          </div>
+    </loadMore>
+    <van-dialog v-model="showAppointmentDialog" :show-confirm-button="false">
+      <div class="dialogContent">
+        <span class="title">确认在线预约当前图书?</span>
+        <div>
+          <span style="color: #666;">在线预约需在{{reserveEndDate}}前前往案场借阅图书, 否则 将取消预约资格</span>
+        </div>
+        <div class="btn">
+          <a @click="sureAppointmentBook">确定</a>
+          <a @click="showAppointmentDialog = false">取消</a>
         </div>
-      </van-dialog>
-    </div>
+      </div>
+    </van-dialog>
   </div>
 </template>
 
 <script>
 import libraryListItem from '../../../../components/libraryListItem/index'
+import loadMore from '@/components/vue-load-more/index'
 import { createNamespacedHelpers } from 'vuex'
 import toolClass from '../../../../util/util'
 const { mapState: mapBookState, mapActions: mapBookAction } = createNamespacedHelpers('book')
@@ -43,14 +50,20 @@ export default {
       },
       reserveBookId: '',
       show: false,
+      scrollData: {
+        noFlag: false // 暂无更多数据显示
+      },
     }
   },
   created () {
     this.query.bookType = this.$route.query.type
     this.query.caseid = this.$route.query.caseid
-    this.getBookList(this.query).then(() => {
-      this.show = true
+    this.$nextTick(() => {
+      this.onInfinite()
     })
+    // this.getBookList(this.query).then(() => {
+    //   this.show = true
+    // })
     this.getMineBook({
       page: 1,
       pagesize: 1000,
@@ -61,12 +74,13 @@ export default {
       books: x => x.books,
       mineBooks: x => x.minebooks,
     }),
-    reserveEndDate() {
+    reserveEndDate () {
       return toolClass.calDate(7)
     }
   },
   components: {
     libraryListItem,
+    loadMore
   },
   methods: {
     ...mapBookAction([
@@ -93,6 +107,20 @@ export default {
     },
     mineBookStatus (item) {
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus
+    },
+    onInfinite () {
+      let more = this.$el.querySelector('.load-more')
+      this.getBookList(this.query).then((res) => {
+        this.show = true
+        this.query.page++
+        res.list = res.list || []
+        if (res.list.length < res.pageSize) {
+          more.style.display = 'none'// 隐藏加载条
+          this.scrollData.noFlag = true
+        } else {
+          more.style.display = 'none'// 隐藏加载条
+        }
+      })
     }
   }
 }
@@ -100,16 +128,16 @@ export default {
 
 <style lang="scss" scoped>
 .mainPage {
-  > div {
+  .box {
     width: 100%;
-    position: absolute;
-    left: 0;
-    top: 0;
-    bottom: 0;
-    overflow-y: scroll;
-    -webkit-overflow-scrolling: touch;
-    transform: translateZ(0);
-    -webkit-transform: translateZ(0);
+    // position: absolute;
+    // left: 0;
+    // top: 0;
+    // bottom: 0;
+    // overflow-y: scroll;
+    // -webkit-overflow-scrolling: touch;
+    // transform: translateZ(0);
+    // -webkit-transform: translateZ(0);
     .noData {
       width: 100%;
       margin: 0.5rem auto 0;
@@ -130,13 +158,13 @@ export default {
         margin: 0.05rem auto 0;
       }
     }
-    >ul{
-      padding: 0 .16rem;
-      margin-bottom: .1rem;
+    > ul {
+      padding: 0 0.16rem;
+      margin-bottom: 0.1rem;
       position: relative;
       overflow: hidden;
-      li{
-        margin: .1rem auto 0;
+      li {
+        margin: 0.1rem auto 0;
       }
     }
   }

src/pages/user/library/booksSearch/index.vue

@@ -1,35 +1,41 @@
 <template>
   <div class="mainPage flex-v">
-    <div class="header flex-h">
-      <div class="flex-item flex-h">
-        <i class="iconfont icon-sousuo"></i>
-        <div class="flex-item">
-          <div>
-            <input type="text" v-model="searchKey" placeholder="请输入图书名">
+    <loadMore :on-infinite="onInfinite" :dataList="scrollData">
+      <div class="header flex-h">
+        <div class="flex-item flex-h">
+          <i class="iconfont icon-sousuo"></i>
+          <div class="flex-item">
+            <div>
+              <input type="text" v-model="searchKey" placeholder="请输入图书名">
+            </div>
           </div>
         </div>
+        <a @click="search">搜索</a>
       </div>
-      <a @click="search">搜索</a>
-    </div>
-    <div class="searchRemark" v-if="showSearch">
-      <span>
-        关于“
-        <em>{{doSearchKey}}</em>”的搜索结果：
-      </span>
-    </div>
-    <div class="flex-item" :hidden="!showSearch">
-      <div>
-        <div class="noData" v-if="(books.list || []).length < 1">
-          <img src="../../../../common/icon/kong.png" alt>
-          <span>暂无内容</span>
+      <div class="searchRemark" v-if="showSearch">
+        <span>
+          关于“
+          <em>{{doSearchKey}}</em>”的搜索结果：
+        </span>
+      </div>
+      <div class="flex-item list" :hidden="!showSearch">
+        <div>
+          <div class="noData" v-if="(books.list || []).length < 1">
+            <img src="../../../../common/icon/kong.png" alt>
+            <span>暂无内容</span>
+          </div>
+          <ul v-else>
+            <li v-for="(item, index) in books.list" :key="index">
+              <libraryListItem
+                :data="item"
+                :status="mineBookStatus(item)"
+                @appointmentBook="appointmentBook"
+              ></libraryListItem>
+            </li>
+          </ul>
         </div>
-        <ul v-else>
-          <li v-for="(item, index) in books.list" :key="index">
-            <libraryListItem :data="item" :status="mineBookStatus(item)" @appointmentBook="appointmentBook"></libraryListItem>
-          </li>
-        </ul>
       </div>
-    </div>
+    </loadMore>
     <van-dialog v-model="showAppointmentDialog" :show-confirm-button="false">
       <div class="dialogContent">
         <span class="title">确认在线预约当前图书?</span>
@@ -48,6 +54,7 @@
 <script>
 import libraryListItem from '../../../../components/libraryListItem/index'
 import toolClass from '../../../../util/util'
+import loadMore from '@/components/vue-load-more/index'
 import { mapState, createNamespacedHelpers } from 'vuex'
 const { mapState: mapBookState, mapActions: mapBookAction } = createNamespacedHelpers('book')
 export default {
@@ -62,6 +69,9 @@ export default {
       pagesize: 10,
       doSearchKey: '',
       reserveBookId: '',
+      scrollData: {
+        noFlag: false // 暂无更多数据显示
+      },
     }
   },
   created () {
@@ -76,13 +86,14 @@ export default {
       books: x => x.books,
       mineBooks: x => x.minebooks,
     }),
-    reserveEndDate() {
+    reserveEndDate () {
       return toolClass.calDate(7)
     }
   },
   mounted () {
   },
   components: {
+    loadMore,
     libraryListItem
   },
   methods: {
@@ -95,7 +106,7 @@ export default {
     search () { // 搜索
       if (this.searchKey !== '') {
         this.doSearchKey = this.searchKey
-        this.getSearchList()
+        this.onInfinite()
       } else {
         this.$toast('搜索关键词不能为空')
       }
@@ -128,7 +139,26 @@ export default {
     },
     mineBookStatus (item) {
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus
-    }
+    },
+    onInfinite () {
+      let more = this.$el.querySelector('.load-more')
+      this.getBookList({
+        caseid: this.caseid,
+        name: this.doSearchKey,
+        page: this.page,
+        pagesize: this.pagesize,
+      }).then((res) => {
+        this.showSearch = true
+        this.page++
+        res.list = res.list || []
+        if (res.list.length < res.pageSize) {
+          more.style.display = 'none'// 隐藏加载条
+          this.scrollData.noFlag = true
+        } else {
+          more.style.display = 'none'// 隐藏加载条
+        }
+      })
+    },
   }
 }
 </script>
@@ -187,19 +217,19 @@ export default {
       }
     }
   }
-  > .flex-item {
+  .list {
     position: relative;
     overflow: hidden;
     > div {
       width: 100%;
-      position: absolute;
-      left: 0;
-      top: 0;
-      bottom: 0;
-      overflow-y: scroll;
-      -webkit-overflow-scrolling: touch;
-      transform: translateZ(0);
-      -webkit-transform: translateZ(0);
+      // position: absolute;
+      // left: 0;
+      // top: 0;
+      // bottom: 0;
+      // overflow-y: scroll;
+      // -webkit-overflow-scrolling: touch;
+      // transform: translateZ(0);
+      // -webkit-transform: translateZ(0);
       .noData {
         width: 100%;
         margin: 0.5rem auto 0;
@@ -229,7 +259,7 @@ export default {
           width: 100%;
           position: relative;
           overflow: hidden;
-          margin: .1rem auto 0;
+          margin: 0.1rem auto 0;
         }
       }
     }

src/pages/user/mainPage/libraryIndex/index.vue

@@ -34,7 +34,11 @@
           <h1>精选推荐</h1>
           <ul>
             <li v-for="(item, index) in books.list" :key="index">
-              <libraryListItem :data="item" :status="mineBookStatus(item)" @appointmentBook="appointmentBook"></libraryListItem>
+              <libraryListItem
+                :data="item"
+                :status="mineBookStatus(item)"
+                @appointmentBook="appointmentBook"
+              ></libraryListItem>
             </li>
           </ul>
         </div>
@@ -85,8 +89,8 @@ export default {
       currentCaseName: '',
       cases: [],
       indexSearchKey: '',
-      page: 0,
-      pagesize: 8,
+      page: 1,
+      pagesize: 3,
       scrollData: {
         noFlag: false // 暂无更多数据显示
       },
@@ -103,7 +107,7 @@ export default {
       books: x => x.recommends,
       mineBooks: x => x.minebooks,
     }),
-    reserveEndDate() {
+    reserveEndDate () {
       return toolClass.calDate(7)
     }
   },
@@ -175,20 +179,19 @@ export default {
         page: 1,
         pagesize: 1000,
       })
-      this.page++
       let more = this.$el.querySelector('.load-more')
       this.getRecommendBook({
         caseid: this.currentCaseId,
         page: this.page,
         pagesize: this.pagesize,
       }).then((res) => {
-        console.log(res)
+        this.page++
         res.list = res.list || []
         if (res.list.length < res.pageSize) {
-          more.style.display='none'// 隐藏加载条
+          more.style.display = 'none'// 隐藏加载条
           this.scrollData.noFlag = true
         } else {
-          more.style.display='none'// 隐藏加载条
+          more.style.display = 'none'// 隐藏加载条
         }
       })
     },
@@ -212,7 +215,7 @@ export default {
       this.$router.push({ name: 'booksList', query: { type: item.BookTypeId, caseid: this.currentCaseId } })
     },
     moreNav () {
-      this.$router.push({ name: 'libraryNavList', query: {caseid: this.currentCaseId} })
+      this.$router.push({ name: 'libraryNavList', query: { caseid: this.currentCaseId } })
     },
     mineBookStatus (item) {
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus