瀏覽代碼

事件列表上拉加载优化

seimin 2 年之前
父節點
當前提交
4910af0db9
共有 1 個文件被更改,包括 16 次插入48 次删除
  1. 16 48
      src/views/incidentList.vue

+ 16 - 48
src/views/incidentList.vue

@@ -123,9 +123,9 @@
123
                 </div>
123
                 </div>
124
               </div>
124
               </div>
125
             </div>
125
             </div>
126
-            <template slot="pulldown" slot-scope="props">
126
+            <template v-if="customPullDown" slot="pulldown" slot-scope="props">
127
               <div
127
               <div
128
-                v-if="props.pullDownRefreshObj"
128
+                v-if="props.pullDownRefresh"
129
                 class="cube-pulldown-wrapper"
129
                 class="cube-pulldown-wrapper"
130
                 :style="props.pullDownStyle"
130
                 :style="props.pullDownStyle"
131
               >
131
               >
@@ -136,7 +136,7 @@
136
                 >
136
                 >
137
                   <span
137
                   <span
138
                     :class="{
138
                     :class="{
139
-                      rotate: props.bubbleY > pullDownRefreshThreshold - 80
139
+                      rotate: props.bubbleY > pullDownRefreshThreshold - 40
140
                     }"
140
                     }"
141
                     >↓</span
141
                     >↓</span
142
                   >
142
                   >
@@ -151,10 +151,10 @@
151
                 </div>
151
                 </div>
152
               </div>
152
               </div>
153
             </template>
153
             </template>
154
-            <div class="wushuju" v-if="!loadShow && items.length === 0">
154
+            <!-- <div class="wushuju" v-if="!loadShow && items.length === 0">
155
               <img src="./../../static/images/wushuju.svg" alt />
155
               <img src="./../../static/images/wushuju.svg" alt />
156
               <p>暂无事件</p>
156
               <p>暂无事件</p>
157
-            </div>
157
+            </div> -->
158
           </cube-scroll>
158
           </cube-scroll>
159
         </div>
159
         </div>
160
       </div>
160
       </div>
@@ -245,7 +245,7 @@ export default {
245
       searchState: 0,
245
       searchState: 0,
246
       type: "all",
246
       type: "all",
247
       isToday: "",
247
       isToday: "",
248
-      sum: 1000,
248
+      sum: 20,
249
       idx: 0,
249
       idx: 0,
250
       stateClass: "",
250
       stateClass: "",
251
       loadShow: true
251
       loadShow: true
@@ -470,7 +470,7 @@ export default {
470
       this.loadShow = true;
470
       this.loadShow = true;
471
       this.items = [];
471
       this.items = [];
472
       this.idx = 0;
472
       this.idx = 0;
473
-      this.sum = 1000;
473
+      this.sum = 20;
474
       this.getData();
474
       this.getData();
475
     },
475
     },
476
     toIncidentDetails(data) {
476
     toIncidentDetails(data) {
@@ -549,7 +549,8 @@ export default {
549
               this.items = res.data.list;
549
               this.items = res.data.list;
550
             }
550
             }
551
           } else {
551
           } else {
552
-            this.pullUpLoad = false;
552
+            this.$refs.scroll.forceUpdate();
553
+            // this.pullUpLoad = false;
553
           }
554
           }
554
           this.loadShow = false;
555
           this.loadShow = false;
555
         });
556
         });
@@ -570,54 +571,21 @@ export default {
570
               this.items = res.data.data;
571
               this.items = res.data.data;
571
             }
572
             }
572
           } else {
573
           } else {
573
-            this.pullUpLoad = false;
574
+            this.$refs.scroll.forceUpdate();
575
+            // this.pullUpLoad = false;
574
           }
576
           }
575
           this.loadShow = false;
577
           this.loadShow = false;
576
         });
578
         });
577
       }
579
       }
578
     },
580
     },
579
     onPullingDown() {
581
     onPullingDown() {
580
-      var that = this;
581
-      that.idx = 0;
582
-      that.sum = 1000;
583
-      setTimeout(() => {
584
-        that.getData();
585
-      }, 1000);
582
+      this.idx = 0;
583
+      this.sum = 20;
584
+      this.getData();
586
     },
585
     },
587
     onPullingUp() {
586
     onPullingUp() {
588
-      var that = this;
589
-      that.idx = that.idx + 1;
590
-      that.getData();
591
-    },
592
-    updatePullDownRefresh(val) {
593
-      this.pullDownRefresh = val;
594
-    },
595
-    updatePullDownRefreshThreshold(val) {
596
-      this.pullDownRefreshThreshold = val;
597
-    },
598
-    updatePullDownRefreshTxt(val) {
599
-      this.pullDownRefreshTxt = val;
600
-    },
601
-    updatePullUpLoad(val) {
602
-      this.pullUpLoad = val;
603
-    },
604
-    updatePullUpLoadThreshold(val) {
605
-      this.pullUpLoadThreshold = val;
606
-    },
607
-    updatePullUpLoadMoreTxt(val) {
608
-      this.pullUpLoadMoreTxt = val;
609
-    },
610
-    updatePullUpLoadNoMoreTxt(val) {
611
-      this.pullUpLoadNoMoreTxt = val;
612
-    },
613
-    updateCustomPullDown(val) {
614
-      this.customPullDown = val;
615
-    },
616
-    rebuildScroll() {
617
-      Vue.nextTick(() => {
618
-        this.$refs.scroll.destroy();
619
-        this.$refs.scroll.initScroll();
620
-      });
587
+      this.idx = this.idx + 1;
588
+      this.getData();
621
     },
589
     },
622
     // 获取事件状态
590
     // 获取事件状态
623
     getStateList(){
591
     getStateList(){