Browse Source

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

wangfei 6 years ago
parent
commit
f9f08345cf

+ 11
- 7
src/components/vue-load-more/index.vue View File

8
   >
8
   >
9
     <section class="inner" :style="{ transform: 'translate3d(0, 0px, 0)' }">
9
     <section class="inner" :style="{ transform: 'translate3d(0, 0px, 0)' }">
10
       <header class="pull-refresh">
10
       <header class="pull-refresh">
11
-        <slot name="pull-refresh">
11
+        <!-- <slot name="pull-refresh">
12
           <span class="down-tip">下拉更新</span>
12
           <span class="down-tip">下拉更新</span>
13
           <span class="up-tip">松开刷新数据</span>
13
           <span class="up-tip">松开刷新数据</span>
14
           <span class="refresh-tip">加载中……</span>
14
           <span class="refresh-tip">加载中……</span>
15
-        </slot>
15
+        </slot> -->
16
       </header>
16
       </header>
17
       <slot></slot>
17
       <slot></slot>
18
-      <footer class="load-more">
18
+      <footer class="load-more" v-show="!dataList.noFlag">
19
         <slot name="load-more">
19
         <slot name="load-more">
20
           <span v-show="downFlag === false">上拉加载更多</span>
20
           <span v-show="downFlag === false">上拉加载更多</span>
21
           <span v-show="downFlag === true">加载中……</span>
21
           <span v-show="downFlag === true">加载中……</span>
22
         </slot>
22
         </slot>
23
       </footer>
23
       </footer>
24
-      <div class="nullData" v-show="dataList.noFlag">暂无更多数据</div>
24
+      <!-- <div class="nullData" v-show="dataList.noFlag">暂无更多数据</div> -->
25
     </section>
25
     </section>
26
   </div>
26
   </div>
27
 </template>
27
 </template>
77
       this.startScroll = this.$el.scrollTop || 0
77
       this.startScroll = this.$el.scrollTop || 0
78
       this.touching = true // 留着有用,不能删除
78
       this.touching = true // 留着有用,不能删除
79
 
79
 
80
-      this.dataList.noFlag = false
81
-      this.$el.querySelector('.load-more').style.display = 'block'
80
+      // this.dataList.noFlag = false
81
+      // this.$el.querySelector('.load-more').style.display = 'block'
82
     },
82
     },
83
     touchMove (e) {
83
     touchMove (e) {
84
       if (this.dataList.noFlag || !this.touching) {
84
       if (this.dataList.noFlag || !this.touching) {
137
       //   return
137
       //   return
138
       // }
138
       // }
139
 
139
 
140
+      if (this.dataList.noFlag) {
141
+        return
142
+      }
143
+
140
       let outerHeight = this.$el.clientHeight
144
       let outerHeight = this.$el.clientHeight
141
       let innerHeight = this.$el.querySelector('.inner').clientHeight
145
       let innerHeight = this.$el.querySelector('.inner').clientHeight
142
       let scrollTop = this.$el.scrollTop
146
       let scrollTop = this.$el.scrollTop
184
 <style lang="scss" scoped>
188
 <style lang="scss" scoped>
185
 .yo-scroll {
189
 .yo-scroll {
186
   font-size: 0.24rem;
190
   font-size: 0.24rem;
187
-  position: absolute;
191
+  position: fixed;
188
   top: 0;
192
   top: 0;
189
   right: 0;
193
   right: 0;
190
   bottom: 0;
194
   bottom: 0;

+ 66
- 38
src/pages/user/library/booksList/index.vue View File

1
 <template>
1
 <template>
2
   <div class="mainPage">
2
   <div class="mainPage">
3
-    <div>
4
-      <div class="noData" v-if="show && (books.list || []).length < 1">
5
-        <img src="../../../../common/icon/kong.png" alt>
6
-        <span>暂无内容</span>
3
+    <loadMore :on-infinite="onInfinite" :dataList="scrollData">
4
+      <div class="box">
5
+        <div class="noData" v-if="show && (books.list || []).length < 1">
6
+          <img src="../../../../common/icon/kong.png" alt>
7
+          <span>暂无内容</span>
8
+        </div>
9
+        <ul>
10
+          <li v-for="(item, index) in (books.list || [])" :key="index" v-if="show">
11
+            <libraryListItem
12
+              :data="item"
13
+              :status="mineBookStatus(item)"
14
+              @appointmentBook="appointmentBook"
15
+            ></libraryListItem>
16
+          </li>
17
+        </ul>
7
       </div>
18
       </div>
8
-      <ul>
9
-        <li v-for="(item, index) in (books.list || [])" :key="index" v-if="show">
10
-          <libraryListItem :data="item" :status="mineBookStatus(item)" @appointmentBook="appointmentBook"></libraryListItem>
11
-        </li>
12
-      </ul>
13
-      <van-dialog v-model="showAppointmentDialog" :show-confirm-button="false">
14
-        <div class="dialogContent">
15
-          <span class="title">确认在线预约当前图书?</span>
16
-          <div>
17
-            <span style="color: #666;">在线预约需在{{reserveEndDate}}前前往案场借阅图书, 否则 将取消预约资格</span>
18
-          </div>
19
-          <div class="btn">
20
-            <a @click="sureAppointmentBook">确定</a>
21
-            <a @click="showAppointmentDialog = false">取消</a>
22
-          </div>
19
+    </loadMore>
20
+    <van-dialog v-model="showAppointmentDialog" :show-confirm-button="false">
21
+      <div class="dialogContent">
22
+        <span class="title">确认在线预约当前图书?</span>
23
+        <div>
24
+          <span style="color: #666;">在线预约需在{{reserveEndDate}}前前往案场借阅图书, 否则 将取消预约资格</span>
25
+        </div>
26
+        <div class="btn">
27
+          <a @click="sureAppointmentBook">确定</a>
28
+          <a @click="showAppointmentDialog = false">取消</a>
23
         </div>
29
         </div>
24
-      </van-dialog>
25
-    </div>
30
+      </div>
31
+    </van-dialog>
26
   </div>
32
   </div>
27
 </template>
33
 </template>
28
 
34
 
29
 <script>
35
 <script>
30
 import libraryListItem from '../../../../components/libraryListItem/index'
36
 import libraryListItem from '../../../../components/libraryListItem/index'
37
+import loadMore from '@/components/vue-load-more/index'
31
 import { createNamespacedHelpers } from 'vuex'
38
 import { createNamespacedHelpers } from 'vuex'
32
 import toolClass from '../../../../util/util'
39
 import toolClass from '../../../../util/util'
33
 const { mapState: mapBookState, mapActions: mapBookAction } = createNamespacedHelpers('book')
40
 const { mapState: mapBookState, mapActions: mapBookAction } = createNamespacedHelpers('book')
43
       },
50
       },
44
       reserveBookId: '',
51
       reserveBookId: '',
45
       show: false,
52
       show: false,
53
+      scrollData: {
54
+        noFlag: false // 暂无更多数据显示
55
+      },
46
     }
56
     }
47
   },
57
   },
48
   created () {
58
   created () {
49
     this.query.bookType = this.$route.query.type
59
     this.query.bookType = this.$route.query.type
50
     this.query.caseid = this.$route.query.caseid
60
     this.query.caseid = this.$route.query.caseid
51
-    this.getBookList(this.query).then(() => {
52
-      this.show = true
61
+    this.$nextTick(() => {
62
+      this.onInfinite()
53
     })
63
     })
64
+    // this.getBookList(this.query).then(() => {
65
+    //   this.show = true
66
+    // })
54
     this.getMineBook({
67
     this.getMineBook({
55
       page: 1,
68
       page: 1,
56
       pagesize: 1000,
69
       pagesize: 1000,
61
       books: x => x.books,
74
       books: x => x.books,
62
       mineBooks: x => x.minebooks,
75
       mineBooks: x => x.minebooks,
63
     }),
76
     }),
64
-    reserveEndDate() {
77
+    reserveEndDate () {
65
       return toolClass.calDate(7)
78
       return toolClass.calDate(7)
66
     }
79
     }
67
   },
80
   },
68
   components: {
81
   components: {
69
     libraryListItem,
82
     libraryListItem,
83
+    loadMore
70
   },
84
   },
71
   methods: {
85
   methods: {
72
     ...mapBookAction([
86
     ...mapBookAction([
93
     },
107
     },
94
     mineBookStatus (item) {
108
     mineBookStatus (item) {
95
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus
109
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus
110
+    },
111
+    onInfinite () {
112
+      let more = this.$el.querySelector('.load-more')
113
+      this.getBookList(this.query).then((res) => {
114
+        this.show = true
115
+        this.query.page++
116
+        res.list = res.list || []
117
+        if (res.list.length < res.pageSize) {
118
+          more.style.display = 'none'// 隐藏加载条
119
+          this.scrollData.noFlag = true
120
+        } else {
121
+          more.style.display = 'none'// 隐藏加载条
122
+        }
123
+      })
96
     }
124
     }
97
   }
125
   }
98
 }
126
 }
100
 
128
 
101
 <style lang="scss" scoped>
129
 <style lang="scss" scoped>
102
 .mainPage {
130
 .mainPage {
103
-  > div {
131
+  .box {
104
     width: 100%;
132
     width: 100%;
105
-    position: absolute;
106
-    left: 0;
107
-    top: 0;
108
-    bottom: 0;
109
-    overflow-y: scroll;
110
-    -webkit-overflow-scrolling: touch;
111
-    transform: translateZ(0);
112
-    -webkit-transform: translateZ(0);
133
+    // position: absolute;
134
+    // left: 0;
135
+    // top: 0;
136
+    // bottom: 0;
137
+    // overflow-y: scroll;
138
+    // -webkit-overflow-scrolling: touch;
139
+    // transform: translateZ(0);
140
+    // -webkit-transform: translateZ(0);
113
     .noData {
141
     .noData {
114
       width: 100%;
142
       width: 100%;
115
       margin: 0.5rem auto 0;
143
       margin: 0.5rem auto 0;
130
         margin: 0.05rem auto 0;
158
         margin: 0.05rem auto 0;
131
       }
159
       }
132
     }
160
     }
133
-    >ul{
134
-      padding: 0 .16rem;
135
-      margin-bottom: .1rem;
161
+    > ul {
162
+      padding: 0 0.16rem;
163
+      margin-bottom: 0.1rem;
136
       position: relative;
164
       position: relative;
137
       overflow: hidden;
165
       overflow: hidden;
138
-      li{
139
-        margin: .1rem auto 0;
166
+      li {
167
+        margin: 0.1rem auto 0;
140
       }
168
       }
141
     }
169
     }
142
   }
170
   }

+ 68
- 38
src/pages/user/library/booksSearch/index.vue View File

1
 <template>
1
 <template>
2
   <div class="mainPage flex-v">
2
   <div class="mainPage flex-v">
3
-    <div class="header flex-h">
4
-      <div class="flex-item flex-h">
5
-        <i class="iconfont icon-sousuo"></i>
6
-        <div class="flex-item">
7
-          <div>
8
-            <input type="text" v-model="searchKey" placeholder="请输入图书名">
3
+    <loadMore :on-infinite="onInfinite" :dataList="scrollData">
4
+      <div class="header flex-h">
5
+        <div class="flex-item flex-h">
6
+          <i class="iconfont icon-sousuo"></i>
7
+          <div class="flex-item">
8
+            <div>
9
+              <input type="text" v-model="searchKey" placeholder="请输入图书名">
10
+            </div>
9
           </div>
11
           </div>
10
         </div>
12
         </div>
13
+        <a @click="search">搜索</a>
11
       </div>
14
       </div>
12
-      <a @click="search">搜索</a>
13
-    </div>
14
-    <div class="searchRemark" v-if="showSearch">
15
-      <span>
16
-        关于“
17
-        <em>{{doSearchKey}}</em>”的搜索结果:
18
-      </span>
19
-    </div>
20
-    <div class="flex-item" :hidden="!showSearch">
21
-      <div>
22
-        <div class="noData" v-if="(books.list || []).length < 1">
23
-          <img src="../../../../common/icon/kong.png" alt>
24
-          <span>暂无内容</span>
15
+      <div class="searchRemark" v-if="showSearch">
16
+        <span>
17
+          关于“
18
+          <em>{{doSearchKey}}</em>”的搜索结果:
19
+        </span>
20
+      </div>
21
+      <div class="flex-item list" :hidden="!showSearch">
22
+        <div>
23
+          <div class="noData" v-if="(books.list || []).length < 1">
24
+            <img src="../../../../common/icon/kong.png" alt>
25
+            <span>暂无内容</span>
26
+          </div>
27
+          <ul v-else>
28
+            <li v-for="(item, index) in books.list" :key="index">
29
+              <libraryListItem
30
+                :data="item"
31
+                :status="mineBookStatus(item)"
32
+                @appointmentBook="appointmentBook"
33
+              ></libraryListItem>
34
+            </li>
35
+          </ul>
25
         </div>
36
         </div>
26
-        <ul v-else>
27
-          <li v-for="(item, index) in books.list" :key="index">
28
-            <libraryListItem :data="item" :status="mineBookStatus(item)" @appointmentBook="appointmentBook"></libraryListItem>
29
-          </li>
30
-        </ul>
31
       </div>
37
       </div>
32
-    </div>
38
+    </loadMore>
33
     <van-dialog v-model="showAppointmentDialog" :show-confirm-button="false">
39
     <van-dialog v-model="showAppointmentDialog" :show-confirm-button="false">
34
       <div class="dialogContent">
40
       <div class="dialogContent">
35
         <span class="title">确认在线预约当前图书?</span>
41
         <span class="title">确认在线预约当前图书?</span>
48
 <script>
54
 <script>
49
 import libraryListItem from '../../../../components/libraryListItem/index'
55
 import libraryListItem from '../../../../components/libraryListItem/index'
50
 import toolClass from '../../../../util/util'
56
 import toolClass from '../../../../util/util'
57
+import loadMore from '@/components/vue-load-more/index'
51
 import { mapState, createNamespacedHelpers } from 'vuex'
58
 import { mapState, createNamespacedHelpers } from 'vuex'
52
 const { mapState: mapBookState, mapActions: mapBookAction } = createNamespacedHelpers('book')
59
 const { mapState: mapBookState, mapActions: mapBookAction } = createNamespacedHelpers('book')
53
 export default {
60
 export default {
62
       pagesize: 10,
69
       pagesize: 10,
63
       doSearchKey: '',
70
       doSearchKey: '',
64
       reserveBookId: '',
71
       reserveBookId: '',
72
+      scrollData: {
73
+        noFlag: false // 暂无更多数据显示
74
+      },
65
     }
75
     }
66
   },
76
   },
67
   created () {
77
   created () {
76
       books: x => x.books,
86
       books: x => x.books,
77
       mineBooks: x => x.minebooks,
87
       mineBooks: x => x.minebooks,
78
     }),
88
     }),
79
-    reserveEndDate() {
89
+    reserveEndDate () {
80
       return toolClass.calDate(7)
90
       return toolClass.calDate(7)
81
     }
91
     }
82
   },
92
   },
83
   mounted () {
93
   mounted () {
84
   },
94
   },
85
   components: {
95
   components: {
96
+    loadMore,
86
     libraryListItem
97
     libraryListItem
87
   },
98
   },
88
   methods: {
99
   methods: {
95
     search () { // 搜索
106
     search () { // 搜索
96
       if (this.searchKey !== '') {
107
       if (this.searchKey !== '') {
97
         this.doSearchKey = this.searchKey
108
         this.doSearchKey = this.searchKey
98
-        this.getSearchList()
109
+        this.onInfinite()
99
       } else {
110
       } else {
100
         this.$toast('搜索关键词不能为空')
111
         this.$toast('搜索关键词不能为空')
101
       }
112
       }
128
     },
139
     },
129
     mineBookStatus (item) {
140
     mineBookStatus (item) {
130
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus
141
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus
131
-    }
142
+    },
143
+    onInfinite () {
144
+      let more = this.$el.querySelector('.load-more')
145
+      this.getBookList({
146
+        caseid: this.caseid,
147
+        name: this.doSearchKey,
148
+        page: this.page,
149
+        pagesize: this.pagesize,
150
+      }).then((res) => {
151
+        this.showSearch = true
152
+        this.page++
153
+        res.list = res.list || []
154
+        if (res.list.length < res.pageSize) {
155
+          more.style.display = 'none'// 隐藏加载条
156
+          this.scrollData.noFlag = true
157
+        } else {
158
+          more.style.display = 'none'// 隐藏加载条
159
+        }
160
+      })
161
+    },
132
   }
162
   }
133
 }
163
 }
134
 </script>
164
 </script>
187
       }
217
       }
188
     }
218
     }
189
   }
219
   }
190
-  > .flex-item {
220
+  .list {
191
     position: relative;
221
     position: relative;
192
     overflow: hidden;
222
     overflow: hidden;
193
     > div {
223
     > div {
194
       width: 100%;
224
       width: 100%;
195
-      position: absolute;
196
-      left: 0;
197
-      top: 0;
198
-      bottom: 0;
199
-      overflow-y: scroll;
200
-      -webkit-overflow-scrolling: touch;
201
-      transform: translateZ(0);
202
-      -webkit-transform: translateZ(0);
225
+      // position: absolute;
226
+      // left: 0;
227
+      // top: 0;
228
+      // bottom: 0;
229
+      // overflow-y: scroll;
230
+      // -webkit-overflow-scrolling: touch;
231
+      // transform: translateZ(0);
232
+      // -webkit-transform: translateZ(0);
203
       .noData {
233
       .noData {
204
         width: 100%;
234
         width: 100%;
205
         margin: 0.5rem auto 0;
235
         margin: 0.5rem auto 0;
229
           width: 100%;
259
           width: 100%;
230
           position: relative;
260
           position: relative;
231
           overflow: hidden;
261
           overflow: hidden;
232
-          margin: .1rem auto 0;
262
+          margin: 0.1rem auto 0;
233
         }
263
         }
234
       }
264
       }
235
     }
265
     }

+ 12
- 9
src/pages/user/mainPage/libraryIndex/index.vue View File

34
           <h1>精选推荐</h1>
34
           <h1>精选推荐</h1>
35
           <ul>
35
           <ul>
36
             <li v-for="(item, index) in books.list" :key="index">
36
             <li v-for="(item, index) in books.list" :key="index">
37
-              <libraryListItem :data="item" :status="mineBookStatus(item)" @appointmentBook="appointmentBook"></libraryListItem>
37
+              <libraryListItem
38
+                :data="item"
39
+                :status="mineBookStatus(item)"
40
+                @appointmentBook="appointmentBook"
41
+              ></libraryListItem>
38
             </li>
42
             </li>
39
           </ul>
43
           </ul>
40
         </div>
44
         </div>
85
       currentCaseName: '',
89
       currentCaseName: '',
86
       cases: [],
90
       cases: [],
87
       indexSearchKey: '',
91
       indexSearchKey: '',
88
-      page: 0,
89
-      pagesize: 8,
92
+      page: 1,
93
+      pagesize: 3,
90
       scrollData: {
94
       scrollData: {
91
         noFlag: false // 暂无更多数据显示
95
         noFlag: false // 暂无更多数据显示
92
       },
96
       },
103
       books: x => x.recommends,
107
       books: x => x.recommends,
104
       mineBooks: x => x.minebooks,
108
       mineBooks: x => x.minebooks,
105
     }),
109
     }),
106
-    reserveEndDate() {
110
+    reserveEndDate () {
107
       return toolClass.calDate(7)
111
       return toolClass.calDate(7)
108
     }
112
     }
109
   },
113
   },
175
         page: 1,
179
         page: 1,
176
         pagesize: 1000,
180
         pagesize: 1000,
177
       })
181
       })
178
-      this.page++
179
       let more = this.$el.querySelector('.load-more')
182
       let more = this.$el.querySelector('.load-more')
180
       this.getRecommendBook({
183
       this.getRecommendBook({
181
         caseid: this.currentCaseId,
184
         caseid: this.currentCaseId,
182
         page: this.page,
185
         page: this.page,
183
         pagesize: this.pagesize,
186
         pagesize: this.pagesize,
184
       }).then((res) => {
187
       }).then((res) => {
185
-        console.log(res)
188
+        this.page++
186
         res.list = res.list || []
189
         res.list = res.list || []
187
         if (res.list.length < res.pageSize) {
190
         if (res.list.length < res.pageSize) {
188
-          more.style.display='none'// 隐藏加载条
191
+          more.style.display = 'none'// 隐藏加载条
189
           this.scrollData.noFlag = true
192
           this.scrollData.noFlag = true
190
         } else {
193
         } else {
191
-          more.style.display='none'// 隐藏加载条
194
+          more.style.display = 'none'// 隐藏加载条
192
         }
195
         }
193
       })
196
       })
194
     },
197
     },
212
       this.$router.push({ name: 'booksList', query: { type: item.BookTypeId, caseid: this.currentCaseId } })
215
       this.$router.push({ name: 'booksList', query: { type: item.BookTypeId, caseid: this.currentCaseId } })
213
     },
216
     },
214
     moreNav () {
217
     moreNav () {
215
-      this.$router.push({ name: 'libraryNavList', query: {caseid: this.currentCaseId} })
218
+      this.$router.push({ name: 'libraryNavList', query: { caseid: this.currentCaseId } })
216
     },
219
     },
217
     mineBookStatus (item) {
220
     mineBookStatus (item) {
218
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus
221
       return ((this.mineBooks.list || []).filter(x => x.BookId === item.BookId && (x.BorrowStatus == '4' || x.BorrowStatus == '1' || x.BorrowStatus == '0'))[0] || {}).BorrowStatus