触底加载

src/views/tabbar/Home.vue

@@ -25,7 +25,13 @@
       <div class="end" @click="endShow">{{endTime}}</div>
     </div>
 
-    <van-pull-refresh v-model="isloading" @refresh="onRefresh">
+    <van-pull-refresh v-model="isloading" @refresh="onRefresh" v-if="list.length">
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了~"
+        @load="onmore"
+      >
         <div class="order-item" v-for="(item, index) in list" :key="item.id">
           <div class="title">{{item.order_status_display }}</div>
           <div class="item flex-h flex-vc">
@@ -48,7 +54,7 @@
           </div>
           <div class="item flex-h flex-vc">
             <div class="item-title">联系电话：</div>
-          <div class="item-desc phone">{{item.telephone}}</div>
+            <div class="item-desc phone" @click="callPhone(item)">{{item.telephone}}</div>
           </div>
           <div class="item flex-h flex-vc">
             <div class="item-title">提交时间：</div>
@@ -77,7 +83,11 @@
           <div class="material" v-if="item.pay_order != ''">
             <div class="item-title">已支付耗材</div>
             <div v-for="(parent, index) in item.pay_order" :key="index">
-            <div class="ma-item flex-h flex-hb" v-for="(child, index) in parent.goods" :key="index">
+              <div
+                class="ma-item flex-h flex-hb"
+                v-for="(child, index) in parent.goods"
+                :key="index"
+              >
                 <div class="one">{{child.parent_detail.goods_name}}</div>
                 <div class="one">{{child.good_detail.goods_name}}*{{child.number}}</div>
                 <div class="one">￥{{child.price}}</div>
@@ -125,7 +135,11 @@
               class="btn-item"
               @click="starRepir(item.id,index)"
             >开始维修</div>
-          <div v-if="item.is_can_see_appraisal==1" class="btn-item" @click="look_comment(item)">查看评价</div>
+            <div
+              v-if="item.is_can_see_appraisal==1"
+              class="btn-item"
+              @click="look_comment(item)"
+            >查看评价</div>
             <div
               v-if="item.is_can_see_material==1"
               class="btn-item sf-btn"
@@ -134,8 +148,9 @@
           </div>
         </div>
         <!-- 空数据 -->
-      <van-empty class="custom-image" description="暂无工单哦~" v-if="!list.length && !more" />
+      </van-list>
     </van-pull-refresh>
+    <van-empty class="custom-image" description="暂无工单哦~" v-if="!list.length && !more" />
     <div class="blank"></div>
     <!-- 发起转单弹窗 -->
     <van-popup v-model="zdShow" close-icon="close">
@@ -242,6 +257,9 @@ export default {
             page: 1,
             more: true,
             locked: false,
+            // 上拉加载
+            loading: false,
+            finished: false,
             limit: 10,
             status: {}, // 工作状态
 
@@ -281,6 +299,14 @@ export default {
         this.getUserInfo()
     },
     methods: {
+      callPhone(item){
+        console.log('电话',item)
+        let phoneNumber = item.telephone
+        window.location.href = 'tel://' + phoneNumber
+      },
+      onmore(){
+        this.getList()
+      },
         preview(img, index){
             let temp = img.map(item=>{
                 return item.url
@@ -297,6 +323,7 @@ export default {
             this.showStart = true
         },
         formatter(type, val) {
+
             if (type === "year") {
                 return `${val}年`;
             } else if (type === "month") {
@@ -355,6 +382,8 @@ export default {
             this.more = true
             this.locked = false
             this.isloading = false
+            this.loading = false
+            this.finished = false
         },
         getStatus () {
             this.$http
@@ -402,6 +431,8 @@ export default {
                         this.locked = false
                         this.isloading = false
                         this.count = data.count
+                        this.loading = false
+                        this.finished = !data.more;
                     })
                     .catch(() => {
                         this.locked = false

src/views/tabbar/admin_home.vue

@@ -36,6 +36,12 @@
     </div>
 
     <van-pull-refresh v-model="isloading" @refresh="onRefresh">
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了~"
+        @load="onmore"
+      >
       <div class="order-item" v-for="(item, index) in list" :key="index">
         <div class="title">{{item.order_status_display }}</div>
         <div class="item flex-h flex-vc">
@@ -103,6 +109,7 @@
       </div>
       <!-- 空数据 -->
       <van-empty class="custom-image" description="暂无工单哦~" v-if="!list.length && !more" />
+      </van-list>
     </van-pull-refresh>
     <div class="blank"></div>
     <!-- 取消工单原因弹窗 -->
@@ -216,6 +223,9 @@ export default {
             more: true,
             locked: false,
             limit: 10,
+            // 上拉加载
+            loading: false,
+            finished: false,
 
             imgList: [],
             // 转单
@@ -228,6 +238,9 @@ export default {
         this.getWorkers()
     },
     methods: {
+      onmore(){
+        this.getList()
+      },
       preview(img, index){
             let temp = img.map(item=>{
                 return item.url
@@ -369,6 +382,8 @@ export default {
             this.more = true
             this.locked = false
             this.isloading = false
+            this.loading = false
+            this.finished = false
         },
         // 获取工单列表
         getList () {
@@ -402,6 +417,8 @@ export default {
                         this.locked = false
                         this.isloading = false
                         this.count = data.count
+                        this.loading = false
+                        this.finished = !data.more;
                         if(data.worker){
                           this.worker_id = data.worker.id
                           this.workerName = data.worker.name