task#11265,分页数据加载更多

This commit is contained in:
2024-02-23 17:15:28 +08:00
parent 9ad6b28342
commit f761af1e57

View File

@ -19,19 +19,26 @@
</div>
</div>
<van-pull-refresh class="refresh" v-model="isLoading" @refresh="onRefresh" v-show="!show">
<div class="listWrap">
<div class="listItem" v-for="(item,index) in pageList" :key="index" @click="noMultipleClicks(goPageDetail,item.batchCode)">
<div class="line1">
<div><span>审核批次:</span><span>{{item.batchCode}}</span></div>
<div class="viewBtn">查看</div>
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
>
<div class="listWrap">
<div class="listItem" v-for="(item,index) in pageList" :key="index" @click="noMultipleClicks(goPageDetail,item.batchCode)">
<div class="line1">
<div><span>审核批次:</span><span>{{item.batchCode}}</span></div>
<div class="viewBtn">查看</div>
</div>
<div><span>报销金额:</span><span class="redColor">{{item.totalAmount}}</span><span class="greColor">/{{item.auditSuccessAmount}}</span></div>
<div><span>案件数量:</span><span>{{item.orderCount}}</span><span class="greColor">/{{item.auditSuccessCount}}</span></div>
<div><span>提交人员:</span><span>{{ item.createUser }}</span></div>
<div><span>提交时间:</span><span>{{ item.createTime }}</span></div>
</div>
<div><span>报销金额:</span><span class="redColor">{{item.totalAmount}}</span><span class="greColor">/{{item.auditSuccessAmount}}</span></div>
<div><span>案件数量:</span><span>{{item.orderCount}}</span><span class="greColor">/{{item.auditSuccessCount}}</span></div>
<div><span>提交人员:</span><span>{{ item.createUser }}</span></div>
<div><span>提交时间:</span><span>{{ item.createTime }}</span></div>
</div>
</div>
</van-list>
</van-pull-refresh>
<div class="bgEmptyImg" v-show="show" >
<img src="@/assets/empty.png" />
@ -48,20 +55,19 @@ export default {
mixins: [myMixins],
data(){
return{
tabArr: [{name: '待审核', status: 1,num:0}, {name: '已审核', status: 2,num:0},],
tabArr: [ {name: '待审核', status: 1,num:0},{name: '已审核', status: 2,num:0},],
activeIndex: 0,
pageList:[],
pageNum:1,
pageSize:10,
total:'',
isLoading:"",
loading: false,
finished: false,
noClick:true
}
},
async mounted() {
/*let token = localStorage.getItem('token');
this.$dialog.alert({
message: token
});*/
await this.getCount();
await this.getList()
},
@ -71,14 +77,31 @@ export default {
},
},
methods:{
async onLoad(){
console.log('00000000000000000000')
this.pageNum++;
await this.getList()
// 加载状态结束
this.loading = false;
// 数据全部加载完成
if (this.pageList.length >= this.total) {
this.finished = true;
}
},
async changeTab(index) {
this.activeIndex = index
this.pageNum = 1
this.pageList = [];
this.total=0
this.loading=false
this.finished=false
await this.getList()
// await this.onLoad()
},
onRefresh() {
this.getList()
this.pageNum=1
// this.getList()
setTimeout(() => {
this.$toast('刷新成功');
this.isLoading = false;
@ -90,7 +113,19 @@ export default {
pageSize:this.pageSize,
type: this.activeIndex+1
})
this.pageList=res.data
this.total=res.total
if(this.pageNum == 1){// 第一页直接赋值
this.pageList=res.data
}else{// 第二页数据拼接
console.log("第二页数据拼接")
let preList = this.pageList;
console.log("preList",preList)
let arr = res.data;
console.log("arr",arr)
this.pageList = preList.concat(arr)
console.log("this.pageList",this.pageList)
}
},
async getCount(){
let res=await reimburseBatchCount()
@ -121,6 +156,7 @@ export default {
.wrap{
@include wh(100%,100%);
box-sizing: border-box;
overflow-y: auto;
}
.navBar{
margin-bottom: 46px;
@ -133,17 +169,24 @@ export default {
width: 100%;
}
}
::v-deep .van-list__finished-text{
background-color: #F4F5F7 !important;
padding-bottom: 10px;
}
/*::v-deep .van-nav-bar__content{
background-color: #354683 !important;
}*/
::v-deep .van-pull-refresh{
height: calc(100% - 86px) ;
}
//::v-deep .van-pull-refresh{
// height: calc(100% - 86px) ;
//}
.tab_wrap {
@include fontWeightSize(500, 14px);
@include flexColAround();
padding: 2px 0 10px 0;
background: #2C395F;
position: fixed;
z-index: 11;
width: 100%;
div {
padding-top: 8px;
color: #FFFFFF;