司机管理数据加载完之后显示没有更多数据

This commit is contained in:
2023-08-28 15:05:51 +08:00
parent d479170d27
commit 0959da27ba

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="wrap" @scroll="handleScroll"> <div class="wrap" >
<div class="navBar"> <div class="navBar">
<van-nav-bar <van-nav-bar
title="司机管理" title="司机管理"
@ -19,34 +19,42 @@
</van-nav-bar> </van-nav-bar>
</div> </div>
<van-pull-refresh v-model="isLoading" @refresh="onRefresh"> <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
<div class="itemWrap" v-for="(item,index) in driverList" :key="index"> <van-list
<div class="name-status"> v-model="loading1"
<div class="namephone">{{ item.driverName }} / {{ item.driverPhone }}</div> :finished="finished"
<div class="twoBtn"> finished-text="没有更多了"
<button class="del" @click="handleStatus(item)">{{ item.states?.label == '启用' ? '停用' : '启用' }}</button> @load="onLoad"
<button class="revise" @click="updateDriver(item)">修改</button> >
<div class="itemWrap" v-for="(item,index) in driverList" :key="index">
<div class="name-status">
<div class="namephone">{{ item.driverName }} / {{ item.driverPhone }}</div>
<div class="twoBtn">
<button class="del" @click="handleStatus(item)">{{ item.states?.label == '启用' ? '停用' : '启用' }}</button>
<button class="revise" @click="updateDriver(item)">修改</button>
</div>
</div>
<div class="" style="display: flex">
<div class="sex" style="margin-right: 40px">
<span class="halfOpci">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</span>
<span class="allOpci">{{item.sex?.label}}</span>
</div>
<div class="carType">
<span class="halfOpci">准驾车型:</span>
<span class="allOpci">{{item.drivingModel}}</span>
</div>
</div>
<div>
<span class="halfOpci">身份证号:</span>
<span class="allOpci">{{ item.identityCardNumber }}</span>
</div>
<div>
<span class="halfOpci">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</span>
<span :class="item.states?.code == 1 ? 'statusYes' : 'statusNo'">{{ item.states?.label }}</span>
</div> </div>
</div> </div>
<div class="" style="display: flex">
<div class="sex" style="margin-right: 40px"> </van-list>
<span class="halfOpci">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</span> </van-pull-refresh>
<span class="allOpci">{{item.sex?.label}}</span>
</div>
<div class="carType">
<span class="halfOpci">准驾车型:</span>
<span class="allOpci">{{item.drivingModel}}</span>
</div>
</div>
<div>
<span class="halfOpci">身份证号:</span>
<span class="allOpci">{{ item.identityCardNumber }}</span>
</div>
<div>
<span class="halfOpci">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</span>
<span :class="item.states?.code == 1 ? 'statusYes' : 'statusNo'">{{ item.states?.label }}</span>
</div>
</div>
</van-pull-refresh>
</div> </div>
</template> </template>
@ -68,6 +76,8 @@ export default {
supplierType:'', supplierType:'',
count: 0, count: 0,
isLoading: false, isLoading: false,
loading1: false,
finished: false
} }
}, },
mounted() { mounted() {
@ -77,6 +87,16 @@ export default {
this.getDriverList() this.getDriverList()
}, },
methods:{ methods:{
async onLoad(){
this.pageNum++;
await this.getDriverList()
// 加载状态结束
this.loading1 = false;
// 数据全部加载完成
if (this.driverList.length >= this.total) {
this.finished = true;
}
},
onRefresh() { onRefresh() {
this.getDriverList() this.getDriverList()
setTimeout(() => { setTimeout(() => {
@ -143,15 +163,15 @@ export default {
} }
}); });
}, },
async handleScroll(){ // async handleScroll(){
let num = Math.ceil( this.total / 10) // let num = Math.ceil( this.total / 10)
if(num <= this.pageNum){ // if(num <= this.pageNum){
// console.log("不在加载数据") // // console.log("不在加载数据")
}else{ // }else{
this.pageNum++; // this.pageNum++;
await this.getDriverList() // await this.getDriverList()
} // }
}, // },
} }
} }