简介:当后台给你返回数据 假设此时返回13条数据 状态是10条‘审核通过’ 3条‘审核失败’ 前端设置每页显示10条 下面会有两页 此时 当你点击第二页的时候 在去更改状态值 只查询‘审核失败’,此时页面数据为空白
原因:此时你给后台创的是页面2 但是呢 就三条数据 页面二肯定为空 所有 当你每次查询的时候 都要将页面重置为1
<template>
<div>
<span class="ml20">状态:</span>
<Select
v-model="status"
placeholder="请选择状态"
style="width:150px;"
@on-change="stateChange"
>
<Option v-for="item in statusList" :value="item.value" :key="item.value">{{item.lable}}</Option>
</Select>
<Button
type="info"
class="mr20"
style="width:100px"
:loading="loading3"
@click="query(1)"
>
<span v-if="!loading3">查询</span>
<span v-else>查询</span>
</Button>
<div id="application_table" class="mt15">
<Table border :columns="columns1" :data="data1"></Table>
<div class="tr mt15">
<Page
v-if="startRow!=0"
:total="total"
:current="startRow"
:page-size="endRow"
@on-change="pageChange"
@on-page-size-change="pagesizechange"
show-sizer
show-total
></Page>
</div>
</div>
</div>
</template>
export defaule{
data(){
return{
loading3 :false,
status: "all",
statusList: [
{
lable: "全部",
value: "all"
},
{
lable: "注册无资料",
value: "0"
},
{
lable: "信贷员待审核",
value: "1"
},
{
lable: "审核通过",
value: "2"
},
{
lable: "审核失败",
value: "3"
}
], lable: "审核通过",
value: "2"
},
{
lable: "审核失败",
value: "3"
}
],
data1: [],
total: 0,
startRow: 1,
endRow: 10,
}
},
methods:{
/// 状态
stateChange(status) {
this.status = status;
},
//分页
pageChange(page) {
this.startRow = page;
this.query(page);
},
pagesizechange(page) {
this.startRow = 1;
this.endRow = page;
this.query(1);
},
//查询
query(startRow) {
let date1 = Date.parse(new Date(this.beginTime)) / 1000;
let date2 = Date.parse(new Date(this.endTime)) / 1000;
if (date1 > date2) {
this.$Modal.warning({
title: "提示",
content: "<p>开始时间不得大于结束时间</p>"
});
return false;
}
this.loading3 = true;
let data = {
channelCode: this.channel == "all" ? "" : this.channel,
loanStatus: this.status == "all" ? "" : this.status, //状态
pageNum: startRow,
pageSize: this.endRow,
phoneNumber: this.phone,
realName: this.name,
registerBeginTime: this.beginTime,
registerEndTime: this.endTime
};
this.http
.post(BASE_URL + "后台接口", data)
.then(data => {
if (data.code == "success") {
this.loading3 = false;
this.data1 = data.data.dataList;
this.startRow = Math.ceil(data.data.startRow / this.endRow);
this.total = data.data.total;
} else {
this.loading3 = false;
this.$Modal.warning({
title: "温馨提示",
content: "<p>" + data.message + "</p>"
});
}
})
.catch(err => {
console.log(err);
this.loading3 = false;
});
},
mounted(){
this.query(1);
}
}