czg_team/cashier_weapp
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单分页

Browse Source
This commit is contained in:
魏啾
2024-05-09 15:48:49 +08:00
parent 75610b685f
commit 678c8fa053
1 changed files with 158 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
pages/order/order.vue
View File

@@ -89,12 +89,14 @@
</view>
<!-- 新订单 -->
<view class="orderList" v-if="navtabindex == 0">
<view class="listBox" v-for="(item,i) in groupList" :key="i" @click="orderinfoTo(item)" >
<view class="listBox" v-for="(item,i) in groupList" :key="i" @click="orderinfoTo(item)">
<view class="df">
<view style="display: flex;">
<text >{{item.proName.length>10?item.proName.substring(0,10)+'...':item.proName}}</text><u-icon name="arrow-right" color="#000" size="28"></u-icon>
<text>{{item.proName.length>10?item.proName.substring(0,10)+'...':item.proName}}</text><u-icon
name="arrow-right" color="#000" size="28"></u-icon>
</view>
<text :class="[item.status=='unpaid'||item.status=='unused'?'state':'state2']">{{item.status|statusFirter}}</text>
<text
:class="[item.status=='unpaid'||item.status=='unused'?'state':'state2']">{{item.status|statusFirter}}</text>
</view>
<view class="df" style="justify-content: flex-start;margin-top: 32rpx;">
<image style="width:120rpx; height: 120rpx;border-radius: 12rpx 12rpx 12rpx 12rpx;"
@@ -105,7 +107,8 @@
<view>实付：<text style="color: #FF4C11;">￥{{item.payAmount}}</text></view>
</view>
</view>
<u-button v-if="item.status=='unused'" type="primary" shape="circle" class="buttonStyle" text="查看券码"></u-button>
<u-button v-if="item.status=='unused'" type="primary" shape="circle" class="buttonStyle"
text="查看券码"></u-button>
</view>
</view>
<image style="margin:32rpx auto;" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/nomore.png"
@@ -120,7 +123,7 @@
data() {
return {
active: 0,
navtabindex:0,
navtabindex: 0,
tabs: [{
name: '全部',
type: 1,
@@ -148,7 +151,7 @@
}
],
list: [],
groupList:[ ],
groupList: [],
is_end: false,
swiperCurrent: '',
form: {
@@ -170,26 +173,30 @@
this.init_fn()
},
onReachBottom() {
this.orderorderList()
if (this.navtabindex == 0) {
// 获取团购订单
this.getorderList()
} else {
this.orderorderList()
}
},
filters:{
statusFirter(e){
filters: {
statusFirter(e) {
// 状态: unpaid-待付款;unused-待使用;closed-已完成;refunding-退款中;refund-已退款;cancelled-已取消;
if(e=='closed') return'已完成'
else if(e=='unpaid') return'待付款'
else if(e=='unused') return'待使用'
else if(e=='refunding') return'退款中'
else if(e=='refund') return'已退款'
else if(e=='cancelled') return'已取消'
if (e == 'closed') return '已完成'
else if (e == 'unpaid') return '待付款'
else if (e == 'unused') return '待使用'
else if (e == 'refunding') return '退款中'
else if (e == 'refund') return '已退款'
else if (e == 'cancelled') return '已取消'
else return "1"
}
},
methods: {
// 切换导航栏
navtabclick(i){
navtabclick(i) {
this.navtabindex = i
this.init_fn()
},
async loginwxuserInfo() {
let res = await this.api.loginwxuserInfo({
@@ -205,7 +212,7 @@
orderId: e.id
})
},
orderinfoTo(e){
orderinfoTo(e) {
uni.pro.navigateTo('order/order_groupdetail', {
orderId: e.id
})
@@ -215,10 +222,14 @@
this.groupList = []
this.is_end = false
this.form.page = 1
this.form.size = 10
this.form.status = 'loadmore'
this.orderorderList()
if (this.navtabindex == 0) {
// 获取团购订单
this.getorderList()
} else {
this.orderorderList()
}
},
orderswitch(e, a) {
this.active = a
@@ -236,48 +247,51 @@
userId: uni.cache.get('userInfo').id, //userId
status: this.swiperCurrent
})
if (res.data.length == 0) {
this.is_end = true
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list.length == 0) {
this.is_end = true
}
return false;
} else {
this.form.status = 'loading';
this.form.page = ++this.form.page;
setTimeout(() => {
this.list = [...this.list, ...res.data];
if (res.data.length == 10) {
this.form.status = 'loading';
} else {
this.is_end = true;
if (res.data.pageNum == res.data.pages) {
this.form.status = 'nomore';
} else {
this.form.status = 'loading';
}
}, 500)
}
},
async getorderList(){
async getorderList() {
let res = await this.api.groupOrderInfo({
page: this.form.page,
size: this.form.size,
userId: uni.cache.get('userInfo').id, //userId
status: this.swiperCurrent
})
if(res.data.list.length ==0){
this.is_end = true
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list == 0) {
this.is_end = true
}
return false;
}else{
} else {
this.form.status = 'loading';
this.form.page = ++this.form.page;
setTimeout(() => {
this.groupList = [...this.groupList, ...res.data.list];
if (res.data.list.length == 10) {
this.form.status = 'loading';
} else {
this.is_end = true;
if (res.data.pageNum == res.data.pages) {
this.form.status = 'nomore';
} else {
this.form.status = 'loading';
}
}, 500)
// console.log(res,'返回的数据')
}
}
}
@@ -296,10 +310,12 @@
width: 100%;
height: 56rpx;
background: #ffd158;
.navtabpost{
.navtabpost {
position: relative;
.navtabone {
margin-left:-10rpx;
margin-left: -10rpx;
width: 162rpx;
height: 56rpx;
background: #FFEAB1;
@@ -312,8 +328,9 @@
text-align: center;
z-index: 10;
}
.navtabtow {
margin-left:-10rpx;
margin-left: -10rpx;
z-index: 9;
width: 166rpx;
height: 56rpx;
@@ -476,20 +493,24 @@
}
}
}
.orderList{
.orderList {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.listBox{
.listBox {
padding: 16rpx 18rpx;
margin-top: 48rpx;font-size: 32rpx;
margin-top: 48rpx;
font-size: 32rpx;
width: 694rpx;
height: 248rpx;
background: #FFFFFF;
border-radius: 24rpx 24rpx 24rpx 24rpx;
position: relative;
.buttonStyle{
.buttonStyle {
position: absolute;
right: 20rpx;
bottom: 50rpx;
@@ -499,21 +520,31 @@
border-radius: 32rpx 32rpx 32rpx 32rpx;
border: none;
}
.state{
.state {
color: #FF4C11;
}
.state2{
.state2 {
color: #999;
}
.fontStyle{
font-size: 28rpx;font-weight: 400;color: #666666;
.fontStyle {
font-size: 28rpx;
font-weight: 400;
color: #666666;
}
}
}
.df{ display: flex; align-items: center; justify-content: space-between; }
.ml-20{
.df {
display: flex;
align-items: center;
justify-content: space-between;
}
.ml-20 {
margin-left: 20rpx;
}
}
</style>