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