|
|
|
@ -23,15 +23,16 @@ |
|
|
|
<view class="goods-order" v-for="goods in order.item" :key="goods.id"> |
|
|
|
<view class="goods-order" v-for="goods in order.item" :key="goods.id"> |
|
|
|
<view class="order-content"> |
|
|
|
<view class="order-content"> |
|
|
|
<shopro-mini-card :title="goods.goods_title" :image="goods.goods_image"> |
|
|
|
<shopro-mini-card :title="goods.goods_title" :image="goods.goods_image"> |
|
|
|
<template #describe> |
|
|
|
<!-- <template #describe> |
|
|
|
<view class="order-sku u-ellipsis-1"> |
|
|
|
<view class="order-sku u-ellipsis-1"> |
|
|
|
<text class="order-num">数量:{{ goods.goods_num || 0 }};</text> |
|
|
|
<text class="order-num">数量:{{ goods.goods_num || 0 }};</text> |
|
|
|
{{ goods.goods_sku_text ? goods.goods_sku_text : '' }} |
|
|
|
{{ goods.goods_sku_text ? goods.goods_sku_text : '' }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
</template> --> |
|
|
|
<template #cardBottom> |
|
|
|
<template #cardBottom> |
|
|
|
<view class="order-price-box u-flex "> |
|
|
|
<view class="order-price-box u-flex " style="justify-content: space-between;"> |
|
|
|
<text class="order-price font-OPPOSANS">￥{{ goods.goods_price || 0 }}</text> |
|
|
|
<text class="order-price font-OPPOSANS">￥{{ goods.goods_price || 0 }}</text> |
|
|
|
|
|
|
|
<text>x{{goods.goods_num}}</text> |
|
|
|
<button class="u-reset-button status-btn" |
|
|
|
<button class="u-reset-button status-btn" |
|
|
|
v-if="goods.status_name">{{ goods.status_name }}</button> |
|
|
|
v-if="goods.status_name">{{ goods.status_name }}</button> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -45,7 +46,7 @@ |
|
|
|
<text class="all-unit">￥</text> |
|
|
|
<text class="all-unit">￥</text> |
|
|
|
{{ order.discount_fee }} ，运费： |
|
|
|
{{ order.discount_fee }} ，运费： |
|
|
|
<text class="all-unit">￥</text> |
|
|
|
<text class="all-unit">￥</text> |
|
|
|
{{ order.dispatch_amount }} ，{{ order.status <= 0 ? '需付款' : '实付款' }}： |
|
|
|
{{ order.dispatch_amount }} ，{{ order.status <= 0 ? '合计金额' : '实付款' }}： |
|
|
|
<view class="all-money font-OPPOSANS">{{ order.total_fee }}</view> |
|
|
|
<view class="all-money font-OPPOSANS">{{ order.total_fee }}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
@ -55,7 +56,7 @@ |
|
|
|
<button v-if="orderBtn === 'cancel'" @tap.stop="onCancel(order.id, orderIndex)" |
|
|
|
<button v-if="orderBtn === 'cancel'" @tap.stop="onCancel(order.id, orderIndex)" |
|
|
|
class="u-reset-button obtn1">取消订单</button> |
|
|
|
class="u-reset-button obtn1">取消订单</button> |
|
|
|
<button v-if="orderBtn === 'pay'" @tap.stop="onPay(order.id)" |
|
|
|
<button v-if="orderBtn === 'pay'" @tap.stop="onPay(order.id)" |
|
|
|
class="u-reset-button obtn2">立即支付</button> |
|
|
|
class="u-reset-button obtn2">去支付</button> |
|
|
|
<button v-if="orderBtn === 'groupon'" |
|
|
|
<button v-if="orderBtn === 'groupon'" |
|
|
|
@tap.stop="jump('/pages/activity/groupon/detail', { id: order.ext_arr.groupon_id })" |
|
|
|
@tap.stop="jump('/pages/activity/groupon/detail', { id: order.ext_arr.groupon_id })" |
|
|
|
class="u-reset-button obtn2"> |
|
|
|
class="u-reset-button obtn2"> |
|
|
|
@ -82,8 +83,12 @@ |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
<script> |
|
|
|
|
|
|
|
import { mapMutations, mapActions, mapState, mapGetters } from 'vuex'; |
|
|
|
export default { |
|
|
|
export default { |
|
|
|
components: {}, |
|
|
|
components: {}, |
|
|
|
|
|
|
|
computed: { |
|
|
|
|
|
|
|
...mapGetters(['isLogin']), |
|
|
|
|
|
|
|
}, |
|
|
|
data() { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
return { |
|
|
|
isEmpty: false, |
|
|
|
isEmpty: false, |
|
|
|
@ -94,19 +99,19 @@ |
|
|
|
orderList: [], |
|
|
|
orderList: [], |
|
|
|
orderState: [{ |
|
|
|
orderState: [{ |
|
|
|
id: 0, |
|
|
|
id: 0, |
|
|
|
title: '全部', |
|
|
|
title: '全部订单', |
|
|
|
type: 'all' |
|
|
|
type: 'all' |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
{ |
|
|
|
id: 1, |
|
|
|
id: 1, |
|
|
|
title: '待付款', |
|
|
|
title: '待支付', |
|
|
|
type: 'nopay' |
|
|
|
type: 'nopay' |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
// { |
|
|
|
id: 2, |
|
|
|
// id: 2, |
|
|
|
title: '待发货', |
|
|
|
// title: '待发货', |
|
|
|
type: 'nosend' |
|
|
|
// type: 'nosend' |
|
|
|
}, |
|
|
|
// }, |
|
|
|
{ |
|
|
|
{ |
|
|
|
id: 3, |
|
|
|
id: 3, |
|
|
|
title: '待收货', |
|
|
|
title: '待收货', |
|
|
|
@ -114,7 +119,7 @@ |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
{ |
|
|
|
id: 4, |
|
|
|
id: 4, |
|
|
|
title: '待评价', |
|
|
|
title: '已完成', |
|
|
|
type: 'nocomment' |
|
|
|
type: 'nocomment' |
|
|
|
} |
|
|
|
} |
|
|
|
] |
|
|
|
] |
|
|
|
@ -127,7 +132,12 @@ |
|
|
|
this.orderList = []; |
|
|
|
this.orderList = []; |
|
|
|
this.currentPage = 1; |
|
|
|
this.currentPage = 1; |
|
|
|
this.lastPage = 1; |
|
|
|
this.lastPage = 1; |
|
|
|
this.getOrderList(); |
|
|
|
if(this.isLogin){ |
|
|
|
|
|
|
|
this.getOrderList(); |
|
|
|
|
|
|
|
}else{ |
|
|
|
|
|
|
|
this.isEmpty = true |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
methods: { |
|
|
|
jump(path, parmas) { |
|
|
|
jump(path, parmas) { |
|
|
|
@ -162,6 +172,8 @@ |
|
|
|
that.lastPage = res.data.last_page; |
|
|
|
that.lastPage = res.data.last_page; |
|
|
|
that.loadStatus = that.currentPage < res.data.last_page ? 'loadmore' : 'nomore'; |
|
|
|
that.loadStatus = that.currentPage < res.data.last_page ? 'loadmore' : 'nomore'; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
}).catch((res)=>{ |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
@ -265,20 +277,22 @@ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.line-active { |
|
|
|
.line-active { |
|
|
|
background: rgba(230, 184, 115, 1); |
|
|
|
// background: rgba(230, 184, 115, 1); |
|
|
|
|
|
|
|
background-color: #17C161; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.order-list { |
|
|
|
.order-list { |
|
|
|
background: #fff; |
|
|
|
background: #fff; |
|
|
|
margin: 20rpx 0; |
|
|
|
margin: 20rpx 24rpx; |
|
|
|
|
|
|
|
border-radius: 20rpx; |
|
|
|
.order-bottom { |
|
|
|
.order-bottom { |
|
|
|
padding-bottom: 20rpx; |
|
|
|
padding-bottom: 20rpx; |
|
|
|
|
|
|
|
|
|
|
|
.btn-box { |
|
|
|
.btn-box { |
|
|
|
justify-content: flex-end; |
|
|
|
justify-content: flex-end; |
|
|
|
|
|
|
|
margin-top: 29rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.all-msg { |
|
|
|
.all-msg { |
|
|
|
@ -296,10 +310,10 @@ |
|
|
|
font-size: 26rpx; |
|
|
|
font-size: 26rpx; |
|
|
|
color: #333; |
|
|
|
color: #333; |
|
|
|
font-weight: 500; |
|
|
|
font-weight: 500; |
|
|
|
|
|
|
|
color:#FE1B26; |
|
|
|
&::before { |
|
|
|
&::before { |
|
|
|
content: '￥'; |
|
|
|
content: '￥'; |
|
|
|
font-size: 20rpx; |
|
|
|
font-size: 18rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -320,7 +334,8 @@ |
|
|
|
.obtn2 { |
|
|
|
.obtn2 { |
|
|
|
width: 160rpx; |
|
|
|
width: 160rpx; |
|
|
|
line-height: 60rpx; |
|
|
|
line-height: 60rpx; |
|
|
|
background: linear-gradient(90deg, rgba(233, 180, 97, 1), rgba(238, 204, 137, 1)); |
|
|
|
background: #17C161; |
|
|
|
|
|
|
|
// background: linear-gradient(90deg, rgba(233, 180, 97, 1), rgba(238, 204, 137, 1)); |
|
|
|
box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22); |
|
|
|
box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22); |
|
|
|
border-radius: 30rpx; |
|
|
|
border-radius: 30rpx; |
|
|
|
margin-right: 20rpx; |
|
|
|
margin-right: 20rpx; |
|
|
|
@ -347,7 +362,7 @@ |
|
|
|
.order-head { |
|
|
|
.order-head { |
|
|
|
padding: 0 25rpx; |
|
|
|
padding: 0 25rpx; |
|
|
|
height: 77rpx; |
|
|
|
height: 77rpx; |
|
|
|
border-bottom: 1rpx solid #dfdfdf; |
|
|
|
// border-bottom: 1rpx solid #dfdfdf; |
|
|
|
|
|
|
|
|
|
|
|
.no { |
|
|
|
.no { |
|
|
|
font-size: 26rpx; |
|
|
|
font-size: 26rpx; |
|
|
|
@ -356,12 +371,12 @@ |
|
|
|
|
|
|
|
|
|
|
|
.state { |
|
|
|
.state { |
|
|
|
font-size: 26rpx; |
|
|
|
font-size: 26rpx; |
|
|
|
color: #a8700d; |
|
|
|
color: #17C161; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.goods-order { |
|
|
|
.goods-order { |
|
|
|
border-bottom: 1px solid rgba(223, 223, 223, 0.5); |
|
|
|
// border-bottom: 1px solid rgba(223, 223, 223, 0.5); |
|
|
|
padding: 20rpx 20rpx 0; |
|
|
|
padding: 20rpx 20rpx 0; |
|
|
|
margin-bottom: 20rpx; |
|
|
|
margin-bottom: 20rpx; |
|
|
|
|
|
|
|
|
|
|
|
@ -384,11 +399,11 @@ |
|
|
|
.order-price-box { |
|
|
|
.order-price-box { |
|
|
|
.status-btn { |
|
|
|
.status-btn { |
|
|
|
height: 32rpx; |
|
|
|
height: 32rpx; |
|
|
|
border: 1rpx solid rgba(207, 169, 114, 1); |
|
|
|
border: 1rpx solid #17C161; |
|
|
|
border-radius: 15rpx; |
|
|
|
border-radius: 15rpx; |
|
|
|
font-size: 20rpx; |
|
|
|
font-size: 20rpx; |
|
|
|
font-weight: 400; |
|
|
|
font-weight: 400; |
|
|
|
color: rgba(168, 112, 13, 1); |
|
|
|
color: #17C161; |
|
|
|
padding: 0 10rpx; |
|
|
|
padding: 0 10rpx; |
|
|
|
margin-left: 20rpx; |
|
|
|
margin-left: 20rpx; |
|
|
|
background: rgba(233, 183, 102, 0.16); |
|
|
|
background: rgba(233, 183, 102, 0.16); |
|
|
|
@ -398,7 +413,7 @@ |
|
|
|
font-size: 26rpx; |
|
|
|
font-size: 26rpx; |
|
|
|
|
|
|
|
|
|
|
|
font-weight: 600; |
|
|
|
font-weight: 600; |
|
|
|
color: rgba(51, 51, 51, 1); |
|
|
|
color:#FE1B26; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
liudan
2 years ago
