|
|
|
@ -56,48 +56,29 @@ |
|
|
|
style="width: 80rpx;height: 14rpx;position: absolute;bottom: 8rpx;left: 32rpx;" /> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="tab2"> |
|
|
|
<view class="tabs2" @tap="checkTabs2(10)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==10?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==10?'#000':'#777'}"> |
|
|
|
全部</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(0)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==0?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==0?'#000':'#777'}"> |
|
|
|
待支付</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(1)" v-if="tab1Checked !='quanbu' && tab1Checked == 'fantuan'" |
|
|
|
:style="{'background':tab2Checked==1?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==1?'#000':'#777'}"> |
|
|
|
待成团</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(2)" v-if="tab1Checked !='quanbu' && tab1Checked == 'fantuan'" |
|
|
|
:style="{'background':tab2Checked==2?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==2?'#000':'#777'}"> |
|
|
|
待消费</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(3)" v-if="tab1Checked !='quanbu' && tab1Checked != 'ershou'" |
|
|
|
:style="{'background':tab2Checked==3?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==3?'#000':'#777'}"> |
|
|
|
待接单</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(4)" v-if="tab1Checked !='quanbu' && tab1Checked != 'ershou'" |
|
|
|
:style="{'background':tab2Checked==4?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==4?'#000':'#777'}"> |
|
|
|
待取货</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(5)" v-if="tab1Checked !='quanbu' && tab1Checked != 'ershou'" |
|
|
|
:style="{'background':tab2Checked==5?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==5?'#000':'#777'}"> |
|
|
|
待送达</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(6)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==6?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==6?'#000':'#777'}"> |
|
|
|
已完成</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(7)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==7?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==7?'#000':'#777'}"> |
|
|
|
待退款</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(8)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==8?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==8?'#000':'#777'}"> |
|
|
|
已退款</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(9)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==9?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==9?'#000':'#777'}"> |
|
|
|
已取消</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(11)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==11?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==8?'#000':'#777'}"> |
|
|
|
售后中</view> |
|
|
|
<view class="tabs2" @tap="checkTabs2(12)" v-if="tab1Checked !='quanbu'" |
|
|
|
:style="{'background':tab2Checked==12?'rgba(166, 255, 234, 1)':'rgba(247, 248, 248, 0.6)','color':tab2Checked==9?'#000':'#777'}"> |
|
|
|
已售后</view> |
|
|
|
<view class="tab2" v-if="tab1Checked !='quanbu'"> |
|
|
|
<view class="status-current"> |
|
|
|
<text class="status-current-label">当前状态</text> |
|
|
|
<text class="status-current-value">{{statusFilterText}}</text> |
|
|
|
</view> |
|
|
|
<view class="status-filter-btn" @tap="openStatusPopup"> |
|
|
|
<text>筛选状态</text> |
|
|
|
<uni-icons type="bottom" size="14" color="#0d4d42"></uni-icons> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<uni-popup ref="statusPopup" background-color="#fff"> |
|
|
|
<view class="status-popup"> |
|
|
|
<view class="status-popup-title">选择订单状态</view> |
|
|
|
<view class="status-popup-sub">选择后立即刷新订单列表</view> |
|
|
|
<view class="status-popup-list"> |
|
|
|
<view class="status-popup-item" v-for="item in statusFilterOptions" :key="item.value" |
|
|
|
:class="{'status-popup-item-active': tab2Checked == item.value}" @tap="selectStatus(item.value)"> |
|
|
|
{{item.label}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</uni-popup> |
|
|
|
<view class="content" :style="{top:tab1Checked =='quanbu'?'415rpx':'500rpx'}"> |
|
|
|
<view class="empty-order" v-if="orderList.length <= 0 && loadStatus != 'loading'"> |
|
|
|
<view class="empty-icon">单</view> |
|
|
|
@ -324,6 +305,34 @@ |
|
|
|
menuButtonInfo: {} |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
statusFilterOptions() { |
|
|
|
const allOptions = [ |
|
|
|
{ label: '全部', value: 10 }, |
|
|
|
{ label: '待支付', value: 0 }, |
|
|
|
{ label: '待成团', value: 1 }, |
|
|
|
{ label: '待消费', value: 2 }, |
|
|
|
{ label: '待接单', value: 3 }, |
|
|
|
{ label: '待取货', value: 4 }, |
|
|
|
{ label: '待送达', value: 5 }, |
|
|
|
{ label: '已完成', value: 6 }, |
|
|
|
{ label: '待退款', value: 7 }, |
|
|
|
{ label: '已退款', value: 8 }, |
|
|
|
{ label: '已取消', value: 9 }, |
|
|
|
{ label: '售后中', value: 11 }, |
|
|
|
{ label: '已售后', value: 12 } |
|
|
|
]; |
|
|
|
if (this.tab1Checked == 'fantuan') return allOptions; |
|
|
|
if (this.tab1Checked == 'ershou') { |
|
|
|
return allOptions.filter(item => [10, 0, 6, 7, 8, 9, 11, 12].includes(item.value)); |
|
|
|
} |
|
|
|
return allOptions.filter(item => ![1, 2].includes(item.value)); |
|
|
|
}, |
|
|
|
statusFilterText() { |
|
|
|
const selected = this.statusFilterOptions.find(item => item.value == this.tab2Checked); |
|
|
|
return selected ? selected.label : '全部'; |
|
|
|
} |
|
|
|
}, |
|
|
|
onReachBottom() { |
|
|
|
if (this.searchForm.pageNum >= this.totalPages) return; |
|
|
|
// this.status = 'loading'; |
|
|
|
@ -389,6 +398,7 @@ |
|
|
|
this.tab1Checked = type |
|
|
|
if(type == 'quanbu'){ |
|
|
|
this.searchForm.searchType = 0 |
|
|
|
delete this.searchForm.searchStatus |
|
|
|
}else if(type == 'fantuan'){ |
|
|
|
this.searchForm.searchType = 1 |
|
|
|
}else if(type == 'paotui'){ |
|
|
|
@ -398,6 +408,10 @@ |
|
|
|
}else if(type == 'ershou'){ |
|
|
|
this.searchForm.searchType = 4 |
|
|
|
} |
|
|
|
this.tab2Checked = 10 |
|
|
|
if(type != 'quanbu') { |
|
|
|
this.searchForm.searchStatus = this.tab2Checked |
|
|
|
} |
|
|
|
this.searchForm.pageNum = 1 |
|
|
|
this.getOrderList() |
|
|
|
}, |
|
|
|
@ -487,6 +501,13 @@ |
|
|
|
this.searchForm.pageNum = 1 |
|
|
|
this.getOrderList(); |
|
|
|
}, |
|
|
|
openStatusPopup() { |
|
|
|
this.$refs.statusPopup.open('bottom'); |
|
|
|
}, |
|
|
|
selectStatus(type) { |
|
|
|
this.checkTabs2(type); |
|
|
|
this.$refs.statusPopup.close(); |
|
|
|
}, |
|
|
|
payAgain(item){ |
|
|
|
this.payData = item; |
|
|
|
this.$refs.payPopup.open('bottom'); |
|
|
|
@ -612,8 +633,11 @@ |
|
|
|
border-bottom-left-radius: 48rpx; |
|
|
|
border-bottom-right-radius: 48rpx; |
|
|
|
box-shadow: 0 18rpx 44rpx rgba(0, 35, 28, 0.06); |
|
|
|
position: relative; |
|
|
|
position: fixed; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
overflow: hidden; |
|
|
|
z-index: 10; |
|
|
|
} |
|
|
|
|
|
|
|
.title::after { |
|
|
|
@ -716,7 +740,7 @@ |
|
|
|
|
|
|
|
.nav-tab { |
|
|
|
flex-shrink: 0; |
|
|
|
position: absolute; |
|
|
|
position: fixed; |
|
|
|
top: 250rpx; |
|
|
|
left: 2.5%; |
|
|
|
background: rgba(255, 255, 255, 0.92); |
|
|
|
@ -726,7 +750,7 @@ |
|
|
|
box-shadow: 0 18rpx 42rpx rgba(0, 35, 28, 0.07); |
|
|
|
box-sizing: border-box; |
|
|
|
border: 1px solid rgba(255, 255, 255, 0.86); |
|
|
|
z-index: 1; |
|
|
|
z-index: 11; |
|
|
|
} |
|
|
|
|
|
|
|
.content { |
|
|
|
@ -759,29 +783,98 @@ |
|
|
|
} |
|
|
|
|
|
|
|
.tab2 { |
|
|
|
height: auto; |
|
|
|
height: 78rpx; |
|
|
|
width: 100%; |
|
|
|
overflow-x: scroll; |
|
|
|
overflow-y: hidden; |
|
|
|
margin-top: 16rpx; |
|
|
|
white-space: nowrap; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
|
|
|
|
.tabs2 { |
|
|
|
width: 156rpx; |
|
|
|
height: 70rpx; |
|
|
|
line-height: 70rpx; |
|
|
|
text-align: center; |
|
|
|
.status-current { |
|
|
|
flex: 1; |
|
|
|
height: 72rpx; |
|
|
|
line-height: 72rpx; |
|
|
|
background: rgba(248, 255, 250, 0.88); |
|
|
|
border: 1px solid rgba(166, 255, 234, 0.4); |
|
|
|
border: 1px solid rgba(166, 255, 234, 0.36); |
|
|
|
border-radius: 999rpx; |
|
|
|
padding: 0 24rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
box-shadow: 0 8rpx 18rpx rgba(0, 35, 28, 0.04); |
|
|
|
} |
|
|
|
|
|
|
|
.status-current-label { |
|
|
|
color: #7b8883; |
|
|
|
font-weight: 800; |
|
|
|
margin-right: 18rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.status-current-value { |
|
|
|
color: #0d4d42; |
|
|
|
font-weight: 900; |
|
|
|
margin-right: 20rpx; |
|
|
|
display: inline-block; |
|
|
|
-webkit-overflow-scrolling: touch; |
|
|
|
} |
|
|
|
|
|
|
|
.status-filter-btn { |
|
|
|
width: 190rpx; |
|
|
|
height: 72rpx; |
|
|
|
line-height: 72rpx; |
|
|
|
margin-left: 18rpx; |
|
|
|
border-radius: 999rpx; |
|
|
|
background: rgba(166, 255, 234, 0.88); |
|
|
|
color: #0d4d42; |
|
|
|
font-weight: 900; |
|
|
|
text-align: center; |
|
|
|
box-shadow: 0 8rpx 18rpx rgba(0, 35, 28, 0.04); |
|
|
|
} |
|
|
|
|
|
|
|
.status-popup { |
|
|
|
background: linear-gradient(180deg, #ffffff 0%, #f7fffb 100%); |
|
|
|
border-radius: 40rpx 40rpx 0 0; |
|
|
|
padding: 36rpx 30rpx 46rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
box-shadow: 0 -18rpx 44rpx rgba(0, 35, 28, 0.12); |
|
|
|
} |
|
|
|
|
|
|
|
.status-popup-title { |
|
|
|
color: #173f36; |
|
|
|
font-size: 34rpx; |
|
|
|
font-weight: 900; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
.status-popup-sub { |
|
|
|
margin-top: 10rpx; |
|
|
|
color: #74817d; |
|
|
|
font-size: 24rpx; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
.status-popup-list { |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
margin-top: 30rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.status-popup-item { |
|
|
|
width: 31.3%; |
|
|
|
height: 74rpx; |
|
|
|
line-height: 74rpx; |
|
|
|
margin: 0 1% 18rpx; |
|
|
|
border-radius: 999rpx; |
|
|
|
background: rgba(248, 255, 250, 0.9); |
|
|
|
border: 1px solid rgba(166, 255, 234, 0.42); |
|
|
|
box-sizing: border-box; |
|
|
|
color: #60706c; |
|
|
|
font-weight: 900; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
.status-popup-item-active { |
|
|
|
background: rgba(166, 255, 234, 1); |
|
|
|
color: #0d4d42; |
|
|
|
box-shadow: 0 10rpx 22rpx rgba(0, 35, 28, 0.08); |
|
|
|
} |
|
|
|
|
|
|
|
.ziqu-xuanfu { |
|
|
|
position: absolute; |
|
|
|
top: 0; |
|
|
|
|
wangfukang
1 month ago