task#11265,分页数据加载更多
This commit is contained in:
@ -19,6 +19,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<van-pull-refresh class="refresh" v-model="isLoading" @refresh="onRefresh" v-show="!show">
|
<van-pull-refresh class="refresh" v-model="isLoading" @refresh="onRefresh" v-show="!show">
|
||||||
|
<van-list
|
||||||
|
v-model="loading"
|
||||||
|
:finished="finished"
|
||||||
|
finished-text="没有更多了"
|
||||||
|
@load="onLoad"
|
||||||
|
>
|
||||||
<div class="listWrap">
|
<div class="listWrap">
|
||||||
<div class="listItem" v-for="(item,index) in pageList" :key="index" @click="noMultipleClicks(goPageDetail,item.batchCode)">
|
<div class="listItem" v-for="(item,index) in pageList" :key="index" @click="noMultipleClicks(goPageDetail,item.batchCode)">
|
||||||
<div class="line1">
|
<div class="line1">
|
||||||
@ -32,6 +38,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</van-list>
|
||||||
</van-pull-refresh>
|
</van-pull-refresh>
|
||||||
<div class="bgEmptyImg" v-show="show" >
|
<div class="bgEmptyImg" v-show="show" >
|
||||||
<img src="@/assets/empty.png" />
|
<img src="@/assets/empty.png" />
|
||||||
@ -48,20 +55,19 @@ export default {
|
|||||||
mixins: [myMixins],
|
mixins: [myMixins],
|
||||||
data(){
|
data(){
|
||||||
return{
|
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,
|
activeIndex: 0,
|
||||||
pageList:[],
|
pageList:[],
|
||||||
pageNum:1,
|
pageNum:1,
|
||||||
pageSize:10,
|
pageSize:10,
|
||||||
|
total:'',
|
||||||
isLoading:"",
|
isLoading:"",
|
||||||
|
loading: false,
|
||||||
|
finished: false,
|
||||||
noClick:true
|
noClick:true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async mounted() {
|
async mounted() {
|
||||||
/*let token = localStorage.getItem('token');
|
|
||||||
this.$dialog.alert({
|
|
||||||
message: token
|
|
||||||
});*/
|
|
||||||
await this.getCount();
|
await this.getCount();
|
||||||
await this.getList()
|
await this.getList()
|
||||||
},
|
},
|
||||||
@ -71,14 +77,31 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods:{
|
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) {
|
async changeTab(index) {
|
||||||
this.activeIndex = index
|
this.activeIndex = index
|
||||||
this.pageNum = 1
|
this.pageNum = 1
|
||||||
this.pageList = [];
|
this.pageList = [];
|
||||||
|
this.total=0
|
||||||
|
this.loading=false
|
||||||
|
this.finished=false
|
||||||
await this.getList()
|
await this.getList()
|
||||||
|
// await this.onLoad()
|
||||||
},
|
},
|
||||||
onRefresh() {
|
onRefresh() {
|
||||||
this.getList()
|
this.pageNum=1
|
||||||
|
// this.getList()
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.$toast('刷新成功');
|
this.$toast('刷新成功');
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
@ -90,7 +113,19 @@ export default {
|
|||||||
pageSize:this.pageSize,
|
pageSize:this.pageSize,
|
||||||
type: this.activeIndex+1
|
type: this.activeIndex+1
|
||||||
})
|
})
|
||||||
|
this.total=res.total
|
||||||
|
if(this.pageNum == 1){// 第一页直接赋值
|
||||||
this.pageList=res.data
|
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(){
|
async getCount(){
|
||||||
let res=await reimburseBatchCount()
|
let res=await reimburseBatchCount()
|
||||||
@ -121,6 +156,7 @@ export default {
|
|||||||
.wrap{
|
.wrap{
|
||||||
@include wh(100%,100%);
|
@include wh(100%,100%);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
.navBar{
|
.navBar{
|
||||||
margin-bottom: 46px;
|
margin-bottom: 46px;
|
||||||
@ -133,17 +169,24 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
::v-deep .van-list__finished-text{
|
||||||
|
background-color: #F4F5F7 !important;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
}
|
||||||
/*::v-deep .van-nav-bar__content{
|
/*::v-deep .van-nav-bar__content{
|
||||||
background-color: #354683 !important;
|
background-color: #354683 !important;
|
||||||
}*/
|
}*/
|
||||||
::v-deep .van-pull-refresh{
|
//::v-deep .van-pull-refresh{
|
||||||
height: calc(100% - 86px) ;
|
// height: calc(100% - 86px) ;
|
||||||
}
|
//}
|
||||||
.tab_wrap {
|
.tab_wrap {
|
||||||
@include fontWeightSize(500, 14px);
|
@include fontWeightSize(500, 14px);
|
||||||
@include flexColAround();
|
@include flexColAround();
|
||||||
padding: 2px 0 10px 0;
|
padding: 2px 0 10px 0;
|
||||||
background: #2C395F;
|
background: #2C395F;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 11;
|
||||||
|
width: 100%;
|
||||||
div {
|
div {
|
||||||
padding-top: 8px;
|
padding-top: 8px;
|
||||||
color: #FFFFFF;
|
color: #FFFFFF;
|
||||||
|
Reference in New Issue
Block a user