修改充值后内容不刷新的问题,修改部分接口传参空值的问题,调整接口地址,,正在做分页

This commit is contained in:
2024-07-24 17:33:37 +08:00
parent 526e775cd8
commit 42412cb4ff
17 changed files with 281 additions and 21 deletions

View File

@@ -0,0 +1,143 @@
Component({
/**
* 组件的属性列表
*/
properties: {
currentIndex: { //当前页码
type: Number,
value: 1
},
totalPage: {
type: Number
}
},
/**
* 组件的初始数据
*/
data: {
index: 1,
total: 10,
pageMask: false,
prevBtnDis: true,
nextBtnDis: false
},
/**
* 组件的方法列表
*/
lifetimes: {
// 在组件实例进入页面节点树时执行
attached: function () {
this.setData({
index: this.properties.currentIndex,
total: this.properties.totalPage
})
}
},
methods: {
// 设置异步请求之后的页面、总记录数
setPage(index, total){
this.setData({
index,
total
})
},
//每次改变页码就调用该函数
triggerParent: function () {
// 通知父组件当前加载的页数
// 自定义组件向父组件传值
const option = {
currentIndex: this.data.index
};
// pagingChange 自定义名称事件,父组件中使用
this.triggerEvent('pagingChange', option)
},
//开启页码弹窗
showPagePopUp: function () {
this.setData({
pageMask: true
})
},
//关闭页码弹窗
hidePagePopUp: function () {
this.setData({
pageMask: false
})
},
//更改页码点击事件
onChangePage: function (e) {
//console.log("更改页码事件:",e);
this.setData({
pageMask: false,
index: e.currentTarget.dataset.index //点击的页数
})
// 先判断当前页数是否需要更新disabled的状态
this.updateBtnDis();
this.triggerParent();
},
//上一页点击事件
prevPage: function () {
if(this.data.index <= 1) return;
let num = this.data.index - 1;
this.setData({
index: num
})
this.triggerParent();
// 更新按钮状态
this.updateBtnDis();
},
//下一页点击事件
nextPage: function () {
if(this.data.index >= this.data.total) return;
let num = this.data.index + 1;
this.setData({
index: num
})
this.triggerParent();
// 更新按钮状态
this.updateBtnDis();
},
//判断按钮是否为disabled
updateBtnDis: function () {
let index = this.data.index;
let total = this.data.total;
if(index == total && index == 1){ // 都为起始页和总页数都为1
this.setData({
nextBtnDis: true,
prevBtnDis: true
})
}else if (index == total) { // 最后一页
this.setData({
nextBtnDis: true
})
} else if (index == 1){ // 第一页
this.setData({
prevBtnDis: true
})
}else{
this.setData({
prevBtnDis: false
})
this.setData({
nextBtnDis: false
})
}
}
}
})

View File

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

View File

@@ -0,0 +1,16 @@
<!--components/pagination/index.wxml-->
<view class="page-control">
<view class="page-control-btns">
<view class="page-btn {{prevBtnDis?'btn-disabled':''}}" bindtap="prevPage">上一页</view>
<view class="page-number" bindtap="shopPagePopup"><text>{{index}}</text>/<text>{{total}}</text></view>
<view class="page-btn {{nextBtnDis?'btn-disabled':''}}" bindtap="nextPage">下一页</view>
</view>
<view class="page-container" hidden="{{!pageMask}}">
<view class="page-mask" bindtap="hidePagePopup"></view>
<view class="page-popup">
<view class="page-popup-box">
<view class="page-line" wx:for="{{total}}" wx:for-index="idx" data-index="{{idx+1}}" bindtap="changePage">第{{item+1}}页</view>
</view>
</view>
</view>
</view>

View File

@@ -0,0 +1,83 @@
/* components/pagination/index.wxss */
view,text,image{
padding: 0;
margin: 0;
box-sizing: border-box;
}
.page-control{
width: 100%;
}
.page-control .page-control-btns{
width: 100%;
padding: 20rpx 0;
display: flex;
align-items: center;
justify-content: space-around;
}
.page-control .page-control-btns .page-number{
width: 20%;
text-align: center;
color: #333;
}
.page-control .page-control-btns .page-number:active{
background-color: #ddd;
}
.page-control .page-control-btns .page-btn{
width: 30%;
padding: 15rpx 20rpx;
font-size: 30rpx;
background-color: #0099CC;
color: #fff;
border-radius: 10rpx;
text-align: center;
}
.page-control .page-control-btns .page-btn:active{
opacity: .5;
}
.page-control .page-control-btns .btn-disabled{
background-color: #ddd;
color: #999;
}
.page-container{
position: fixed;
top: 0rpx;
left: 0rpx;
width: 100%;
height: 100%;
z-index: 999;
}
.page-mask{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-color: rgba(0,0,0,0.5);
}
.page-popup{
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
}
.page-popup-box{
width: 60%;
margin: 0 auto;
background-color: #fff;
height: 60%;
border-radius: 10rpx;
z-index: 9999;
overflow: auto;
}
.page-line{
width: 100%;
height: 80rpx;
line-height: 80rpx;
padding: 0rpx 20rpx;
border-bottom: 1rpx solid #e2e2e2;
}
.page-line:active{
background-color: #ddd;
}

View File

@@ -4,8 +4,6 @@
}
.options {
background-color: #fff;
padding: 20rpx;
margin-left: 32rpx;
@@ -15,7 +13,8 @@
border-radius: 5rpx;
box-sizing: border-box;
width: calc(100% - 64rpx);
max-height: 50vh;
max-height: 40vh;
overflow: auto;
}
.option {