|
|
|
@ -1,7 +1,7 @@ |
|
|
|
|
<template> |
|
|
|
|
<BaseContainer class="order-detail"> |
|
|
|
|
<NavBar title="订单详情" /> |
|
|
|
|
<template v-if="orderInfo.id"> |
|
|
|
|
<NavBar title="订单详情"/> |
|
|
|
|
<view v-if="orderInfo.id" class="detail-box" @click="showOperateBox = false;"> |
|
|
|
|
<!-- 退款 --> |
|
|
|
|
<view class="section return" v-if="orderInfo.refund_reason && orderInfo.refund_status === 0"> |
|
|
|
|
<view>卖家拒绝退款</view> |
|
|
|
@ -18,20 +18,29 @@ |
|
|
|
|
<view class="time">{{ orderInfo._status._msg }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="section status" v-if="orderInfo.refund_status === 0 && !orderInfo.refund_reason"> |
|
|
|
|
<view class="image"> |
|
|
|
|
<!-- <view class="image"> |
|
|
|
|
<image :src="orderInfo.status_pic" /> |
|
|
|
|
</view> |
|
|
|
|
</view> --> |
|
|
|
|
<view class="text"> |
|
|
|
|
<view>{{ orderInfo._status._title }}</view> |
|
|
|
|
<view class="time">{{ orderInfo._status._msg }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="section contact"> |
|
|
|
|
<view> |
|
|
|
|
<text>{{ orderInfo.real_name }}</text> |
|
|
|
|
<text>{{ orderInfo.user_phone }}</text> |
|
|
|
|
</view> |
|
|
|
|
<view class="address">{{ orderInfo.user_address }}</view> |
|
|
|
|
<view class="express-delivery-info flex"> |
|
|
|
|
<image src="@/static/images/special/car.png" mode="aspectFill"></image> |
|
|
|
|
<view class="info-box"> |
|
|
|
|
<view class="info-title flex">您的快递已发车 <text class="more"></text> </view> |
|
|
|
|
<view class="info-time">2023-05-25 22:34:23</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="address-info flex"> |
|
|
|
|
<image src="@/static/images/special/location.png" mode="aspectFill"></image> |
|
|
|
|
<view class="info-box"> |
|
|
|
|
<view class="info-title flex">{{ orderInfo.real_name }} <text>{{ orderInfo.user_phone }}</text> </view> |
|
|
|
|
<view class="info-time">{{ orderInfo.user_address }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="section goods"> |
|
|
|
|
<view class="goods-bd" v-for="cart of orderInfo.cartInfo" :key="cart.unique"> |
|
|
|
@ -40,23 +49,21 @@ |
|
|
|
|
</view> |
|
|
|
|
<view class="text"> |
|
|
|
|
<view class="name">{{ cart.productInfo.store_name }}</view> |
|
|
|
|
<view class="money"> |
|
|
|
|
<view class="price"> |
|
|
|
|
¥ |
|
|
|
|
<text>{{ cart.truePrice }}</text> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="money flex flex-center-x"> |
|
|
|
|
<view class="price">¥<text>{{ cart.truePrice }}</text></view> |
|
|
|
|
<view class="num">x{{ cart.cart_num }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view v-if="orderInfo._status._type === 3"> |
|
|
|
|
<!-- <view v-if="orderInfo._status._type === 3"> |
|
|
|
|
<view class="num">x{{ cart.cart_num }}</view> |
|
|
|
|
<navigator :url="`/pages/my/order_reply?unique=${cart.unique}`"> |
|
|
|
|
评价 |
|
|
|
|
</navigator> |
|
|
|
|
</view> |
|
|
|
|
</view> --> |
|
|
|
|
</view> |
|
|
|
|
<view class="goods-ft"> |
|
|
|
|
共{{ orderInfo.total_num }}件商品,总金额 |
|
|
|
|
<text>¥{{ orderInfo.pay_price }}</text> |
|
|
|
|
<view class="goods-ft flex flex-center-x"> |
|
|
|
|
<view class="li">共 <text> {{ orderInfo.total_num }} </text> 件商品</view> |
|
|
|
|
<view class="sum-money">合计:<text>¥<text style="color: #F8473E;font-size: 32rpx;">{{ orderInfo.pay_price }}</text></text></view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<!-- 待收货 --> |
|
|
|
@ -72,103 +79,121 @@ |
|
|
|
|
快递单号:<text id="account">{{ orderInfo.delivery_id }}</text> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<button type="button" @click="copyNo" id="copy">复制单号</button> |
|
|
|
|
<button type="button" @click="copyNo(orderInfo.delivery_id)" id="copy">复制单号</button> |
|
|
|
|
</view> |
|
|
|
|
<view class="section list"> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<view>订单编号:</view> |
|
|
|
|
<view>{{ orderInfo.order_id }}</view> |
|
|
|
|
<view class="flex flex-center-x">{{ orderInfo.order_id }} <text @click="copyNo(orderInfo.order_id)">复制</text> </view> |
|
|
|
|
</view> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<view>下单时间:</view> |
|
|
|
|
<view>创建时间:</view> |
|
|
|
|
<view>{{ orderInfo.add_time }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view v-if="orderInfo._status._type > 0" class="li-item flex"> |
|
|
|
|
<view>付款时间:</view> |
|
|
|
|
<view>{{ orderInfo.add_time }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view v-if="orderInfo._status._type > 0" class="li-item flex"> |
|
|
|
|
<view>发货时间:</view> |
|
|
|
|
<view>{{ orderInfo.add_time }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="section list"> |
|
|
|
|
<view v-if="orderInfo._status._type > 0" class="li-item flex"> |
|
|
|
|
<view>支付方式:</view> |
|
|
|
|
<view>{{ orderInfo._status._payType }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<view>商品金额:</view> |
|
|
|
|
<view>¥{{ orderInfo.total_price }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<view>支付方式:</view> |
|
|
|
|
<view>{{ orderInfo._status._payType }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view v-if="orderInfo.total_postage > 0" class="li-item flex"> |
|
|
|
|
<view>运费:</view> |
|
|
|
|
<view>¥{{ orderInfo.total_postage }}</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view v-if="orderInfo.use_gold > 0" class="li-item flex"> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<view>优惠金额:</view> |
|
|
|
|
<view style="color: #FF3A37;">¥{{ orderInfo.total_price - money }}</view> |
|
|
|
|
</view> |
|
|
|
|
<!-- <view v-if="orderInfo.use_gold > 0" class="li-item flex"> |
|
|
|
|
<view>使用{{ gold_name }}:</view> |
|
|
|
|
<view>{{ orderInfo.use_gold }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view v-if="orderInfo.back_gold > 0" class="li-item flex"> |
|
|
|
|
<view>退还{{ gold_name }}:</view> |
|
|
|
|
<view>¥{{ orderInfo.back_gold }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> --> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<view>配送费:</view> |
|
|
|
|
<view>¥{{ orderInfo.total_postage }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<view>实付款:</view> |
|
|
|
|
<view>¥{{ orderInfo.pay_price }}</view> |
|
|
|
|
<view>实际支付:</view> |
|
|
|
|
<view>¥{{ money }}</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="li-item flex"> |
|
|
|
|
<!-- <view class="li-item flex"> |
|
|
|
|
<view>买家留言:</view> |
|
|
|
|
<view class="msg">{{ orderInfo.mark }}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> --> |
|
|
|
|
</view> |
|
|
|
|
<view class="footer"> |
|
|
|
|
<view v-if="showOperateBox" class="operate-box"> |
|
|
|
|
<view class="apply-invoicing" @click.stop="applyInvoicing">申请开票</view> |
|
|
|
|
<view class="delete-order" @click.stop="removeOrder('删除')">删除订单</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="footer flex flex-center-x"> |
|
|
|
|
<view class="more-operate" @click.stop="showOperateBox = !showOperateBox;">更多</view> |
|
|
|
|
<template v-if="orderInfo._status._type === 0"> |
|
|
|
|
<view class="blue footer-btn" @click="submit">立即付款</view> |
|
|
|
|
<view class="footer-btn" @click="removeOrder('取消')">取消订单</view> |
|
|
|
|
<view class="red footer-btn" @click="submit">付款</view> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if=" |
|
|
|
|
<!-- <template v-else-if=" |
|
|
|
|
orderInfo._status._type === 1 && |
|
|
|
|
!orderInfo.refund_reason && |
|
|
|
|
orderInfo.refund_status === 0 && |
|
|
|
|
orderInfo.pay_price > 0 |
|
|
|
|
"> |
|
|
|
|
<view class="footer-btn" @click="applyRefundOrder">申请退款</view> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if="orderInfo._status._type === 2"> |
|
|
|
|
<view class="blue footer-btn" @click="userTake">确认收货</view> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if=" |
|
|
|
|
</template> --> |
|
|
|
|
<!-- <template v-else-if=" |
|
|
|
|
orderInfo._status._type === 3 && |
|
|
|
|
!orderInfo.refund_reason && |
|
|
|
|
orderInfo.refund_status === 0 && |
|
|
|
|
orderInfo.pay_price > 0 |
|
|
|
|
"> |
|
|
|
|
<view class="footer-btn" @click="applyRefundOrder">申请退款</view> |
|
|
|
|
<view class="footer-btn" @click="removeOrder('删除')">删除订单</view> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if=" |
|
|
|
|
<view class="footer-btn" @click="applyRefundOrder">申请退款</view> |
|
|
|
|
</template> --> |
|
|
|
|
<!-- <template v-else-if=" |
|
|
|
|
orderInfo._status._type === 4 && |
|
|
|
|
!orderInfo.refund_reason && |
|
|
|
|
orderInfo.refund_status === 0 && |
|
|
|
|
orderInfo.pay_price > 0 |
|
|
|
|
"> |
|
|
|
|
<view class="footer-btn" @click="applyRefundOrder">申请退款</view> |
|
|
|
|
<view class="footer-btn" @click="removeOrder('删除')">删除订单</view> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if=" |
|
|
|
|
<view class="footer-btn" @click="applyRefundOrder">申请退款</view> |
|
|
|
|
</template> --> |
|
|
|
|
<!-- <template v-else-if=" |
|
|
|
|
!orderInfo.refund_reason && |
|
|
|
|
orderInfo.refund_status === 0 && |
|
|
|
|
orderInfo._status._type === 3 && |
|
|
|
|
orderInfo.pay_price > 0 |
|
|
|
|
"> |
|
|
|
|
<view class="blue footer-btn" @click="applyRefundOrder()"> 再次申请 </view> |
|
|
|
|
<view class="footer-btn" @click="removeOrder('删除')">删除订单</view> |
|
|
|
|
</template> |
|
|
|
|
<view class="red footer-btn" @click="applyRefundOrder()"> 再次申请 </view> |
|
|
|
|
</template> --> |
|
|
|
|
<view @click="removeOrder('删除')" class="footer-btn" v-else-if=" |
|
|
|
|
orderInfo.refund_status === 2 || |
|
|
|
|
(orderInfo._status._type === 3 && orderInfo.pay_price === 0) |
|
|
|
|
">删除订单</view> |
|
|
|
|
<view class="footer-btn" @click="services">联系客服</view> |
|
|
|
|
<!-- <view class="footer-btn" @click="services">联系客服</view> --> |
|
|
|
|
<view class="footer-btn" v-if="orderInfo.status >= 1" @click="express">查看物流</view> |
|
|
|
|
<template v-else-if="orderInfo._status._type === 2"> |
|
|
|
|
<view class="red footer-btn" @click="userTake">确认收货</view> |
|
|
|
|
</template> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<!-- 支付弹窗 --> |
|
|
|
|
<PayDialog :open.sync="payDialogOpen" :money="money" :now_money="now_money" :special_id="id" |
|
|
|
|
:pay_type_num="pay_type_num" :is-wechat="isWechat" :is-alipay="is_alipay" :is-balance="is_yue" |
|
|
|
|
:template-id="templateId" :wxpay-h5="wxpayH5" @change="changeVal" /> |
|
|
|
|
</template> |
|
|
|
|
</view> |
|
|
|
|
</BaseContainer> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
@ -198,7 +223,8 @@ |
|
|
|
|
wxpayH5: 0, |
|
|
|
|
site_name: "", |
|
|
|
|
gold_name: "", |
|
|
|
|
isOpenWeixing: false |
|
|
|
|
isOpenWeixing: false, |
|
|
|
|
showOperateBox: false, |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
computed: { |
|
|
|
@ -242,6 +268,7 @@ |
|
|
|
|
is_yue: !!is_yue, |
|
|
|
|
wxpayH5: !!wxpayH5, |
|
|
|
|
}); |
|
|
|
|
console.log('money', this); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
subscribeTemplate() { |
|
|
|
@ -252,9 +279,9 @@ |
|
|
|
|
submit() { |
|
|
|
|
this.payDialogOpen = true; |
|
|
|
|
}, |
|
|
|
|
copyNo() { |
|
|
|
|
copyNo(num) { |
|
|
|
|
uni.setClipboardData({ |
|
|
|
|
data: this.orderInfo.delivery_id, |
|
|
|
|
data: num, |
|
|
|
|
success: () => { |
|
|
|
|
this.$util.showMsg("复制成功"); |
|
|
|
|
}, |
|
|
|
@ -377,11 +404,31 @@ |
|
|
|
|
url: "/pages/my/express?uni=" + this.orderId, |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
applyInvoicing() { |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: `/pages/store/applyInvoicing?orderNum=${this.orderInfo.order_id}&money=${this.money}`, |
|
|
|
|
}); |
|
|
|
|
this.showOperateBox = false; |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
|
.order-detail { |
|
|
|
|
background: linear-gradient(to top, #f6f6f6 0%, #f6f6f6 60%, #F6F8FA 70%, #A1BFFD 100%); |
|
|
|
|
display: flex; |
|
|
|
|
flex-direction: column; |
|
|
|
|
height: 100vh; |
|
|
|
|
padding-bottom: 130rpx; |
|
|
|
|
.nav-box { |
|
|
|
|
background: transparent!important; |
|
|
|
|
} |
|
|
|
|
.detail-box { |
|
|
|
|
flex: 1; |
|
|
|
|
overflow-y: auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.order-detail .section { |
|
|
|
|
background-color: #ffffff; |
|
|
|
|
} |
|
|
|
@ -419,9 +466,9 @@ |
|
|
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
padding: 32rpx 30rpx; |
|
|
|
|
background-color: #2c8eff; |
|
|
|
|
background-color: transparent; |
|
|
|
|
font-size: 30rpx; |
|
|
|
|
color: #ffffff; |
|
|
|
|
color: #333; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.status .image { |
|
|
|
@ -445,19 +492,51 @@ |
|
|
|
|
|
|
|
|
|
.order-detail .section.status view:first-child { |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 42rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.status .time { |
|
|
|
|
margin-top: 10rpx; |
|
|
|
|
margin-top: 22rpx; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
line-height: 24rpx; |
|
|
|
|
opacity: 0.8; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.contact { |
|
|
|
|
padding: 40rpx 30rpx; |
|
|
|
|
background: #ffffff url(@/static/images/address-line.jpg) left bottom/749rpx 3rpx repeat-x; |
|
|
|
|
font-size: 30rpx; |
|
|
|
|
color: #282828; |
|
|
|
|
padding: 40rpx 16rpx; |
|
|
|
|
font-size: 32rpx; |
|
|
|
|
line-height: 32rpx; |
|
|
|
|
color: #333; |
|
|
|
|
width: 690rpx; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
background: #fff; |
|
|
|
|
border-radius: 10rpx; |
|
|
|
|
.express-delivery-info, .address-info { |
|
|
|
|
margin-bottom: 60rpx; |
|
|
|
|
image { |
|
|
|
|
width: 44rpx; |
|
|
|
|
height: 44rpx; |
|
|
|
|
margin-right: 16rpx; |
|
|
|
|
} |
|
|
|
|
.info-box { |
|
|
|
|
flex: 1; |
|
|
|
|
.info-title { |
|
|
|
|
align-items: center; |
|
|
|
|
padding-right: 20rpx; |
|
|
|
|
text { |
|
|
|
|
margin-left: auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.info-time { |
|
|
|
|
margin-top: 24rpx; |
|
|
|
|
color: #999; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.address-info .info-box .info-title text { |
|
|
|
|
margin-left: 40rpx!important; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.contact text text { |
|
|
|
@ -469,71 +548,50 @@ |
|
|
|
|
font-size: 26rpx; |
|
|
|
|
color: #868686; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods { |
|
|
|
|
width: 690rpx; |
|
|
|
|
margin: 20rpx auto 0; |
|
|
|
|
padding: 40rpx 30rpx 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .goods-bd { |
|
|
|
|
display: flex; |
|
|
|
|
padding: 26rpx 30rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .image { |
|
|
|
|
width: 230rpx; |
|
|
|
|
height: 128rpx; |
|
|
|
|
border-radius: 10rpx; |
|
|
|
|
overflow: hidden; |
|
|
|
|
margin-right: 20rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods image { |
|
|
|
|
display: block; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
object-fit: cover; |
|
|
|
|
pointer-events: none; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .text { |
|
|
|
|
flex: 1; |
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .name { |
|
|
|
|
-webkit-line-clamp: 2; |
|
|
|
|
overflow: hidden; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
line-height: 40rpx; |
|
|
|
|
color: #343434; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .price, |
|
|
|
|
.order-detail .section.goods .vip-price { |
|
|
|
|
display: inline-block; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .price { |
|
|
|
|
font-size: 26rpx; |
|
|
|
|
color: #9a9a9a; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .price text { |
|
|
|
|
font-size: 26rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .vip-price { |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .vip-price image { |
|
|
|
|
display: inline-block; |
|
|
|
|
width: 46rpx; |
|
|
|
|
height: 21rpx; |
|
|
|
|
pointer-events: none; |
|
|
|
|
-webkit-touch-callout: none; |
|
|
|
|
border-bottom: 1rpx solid rgba(187, 187, 187, 0.32); |
|
|
|
|
padding-bottom: 33rpx; |
|
|
|
|
.image { |
|
|
|
|
width: 156rpx; |
|
|
|
|
height: 184rpx; |
|
|
|
|
margin-right: 52rpx; |
|
|
|
|
image { |
|
|
|
|
display: block; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.text { |
|
|
|
|
flex: 1; |
|
|
|
|
.name { |
|
|
|
|
color: #333; |
|
|
|
|
line-height: 35rpx; |
|
|
|
|
height: 70rpx; |
|
|
|
|
} |
|
|
|
|
.money { |
|
|
|
|
margin-top: auto; |
|
|
|
|
.price { |
|
|
|
|
font-size: 22rpx; |
|
|
|
|
color: #F8473E; |
|
|
|
|
text { |
|
|
|
|
font-size: 32rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.num { |
|
|
|
|
margin-left: auto; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
color: #999; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .goods-bd>view:last-child { |
|
|
|
@ -561,21 +619,24 @@ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .goods-ft { |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: flex-end; |
|
|
|
|
align-items: center; |
|
|
|
|
height: 93rpx; |
|
|
|
|
padding-right: 30rpx; |
|
|
|
|
padding-left: 30rpx; |
|
|
|
|
border-top: 1px solid #f0f0f0; |
|
|
|
|
font-size: 26rpx; |
|
|
|
|
color: #282828; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.goods .goods-ft text { |
|
|
|
|
font-weight: bold; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #ff6b00; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
height: 92rpx; |
|
|
|
|
.li { |
|
|
|
|
font-size: 25rpx; |
|
|
|
|
color: #999; |
|
|
|
|
text { |
|
|
|
|
color: #333; |
|
|
|
|
margin: 0 5rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.sum-money { |
|
|
|
|
font-size: 25rpx; |
|
|
|
|
color: #999; |
|
|
|
|
>text { |
|
|
|
|
color: #F8473E; |
|
|
|
|
font-size: 22rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.express { |
|
|
|
@ -583,6 +644,8 @@ |
|
|
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
padding: 30rpx; |
|
|
|
|
width: 690rpx; |
|
|
|
|
margin: 20rpx auto 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.express .image { |
|
|
|
@ -633,16 +696,31 @@ |
|
|
|
|
padding: 30rpx; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #282828; |
|
|
|
|
width: 690rpx; |
|
|
|
|
margin: 20rpx auto 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .section.list .li-item { |
|
|
|
|
&+.li-item { |
|
|
|
|
margin-top: 30rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
text { |
|
|
|
|
width: 90rpx; |
|
|
|
|
height: 42rpx; |
|
|
|
|
background: #FFFFFF; |
|
|
|
|
border-radius: 21rpx; |
|
|
|
|
border: 2rpx solid #BBBBBB; |
|
|
|
|
text-align: center; |
|
|
|
|
line-height: 42rpx; |
|
|
|
|
margin-left: auto; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
color: #bbb; |
|
|
|
|
} |
|
|
|
|
view:nth-child(1) { |
|
|
|
|
width: 180rpx; |
|
|
|
|
} |
|
|
|
|
view:nth-child(2) { |
|
|
|
|
flex: 1; |
|
|
|
|
text-align: right; |
|
|
|
|
color: #868686; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -657,43 +735,73 @@ |
|
|
|
|
text-align: left; |
|
|
|
|
word-break: break-all; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .operate-box { |
|
|
|
|
position: fixed; |
|
|
|
|
left: 60rpx; |
|
|
|
|
bottom: 110rpx; |
|
|
|
|
background: #fff; |
|
|
|
|
box-shadow: 0rpx 8rpx 18rpx 0rpx rgba(49,49,49,0.16); |
|
|
|
|
padding: 0 16rpx; |
|
|
|
|
z-index: 100; |
|
|
|
|
&:after { |
|
|
|
|
content: ''; |
|
|
|
|
position: absolute; |
|
|
|
|
left: 10rpx; |
|
|
|
|
bottom: -35rpx; |
|
|
|
|
width: 0; |
|
|
|
|
height: 0; |
|
|
|
|
border: 20rpx solid; |
|
|
|
|
border-color: #fff transparent transparent transparent; |
|
|
|
|
} |
|
|
|
|
>view { |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #333; |
|
|
|
|
height: 84rpx; |
|
|
|
|
line-height: 84rpx; |
|
|
|
|
&.apply-invoicing { |
|
|
|
|
border-bottom: 1rpx solid #e5e5e5; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.order-detail .footer { |
|
|
|
|
position: fixed; |
|
|
|
|
bottom: 0; |
|
|
|
|
left: 0; |
|
|
|
|
z-index: 9; |
|
|
|
|
width: 100%; |
|
|
|
|
padding: 20rpx 30rpx; |
|
|
|
|
padding-bottom: calc(20rpx + var(--safe-bottom)); |
|
|
|
|
padding: 0 30rpx 0 60rpx; |
|
|
|
|
height: 130rpx; |
|
|
|
|
background-color: #ffffff; |
|
|
|
|
overflow: hidden; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
text-align: right; |
|
|
|
|
.more-operate { |
|
|
|
|
margin-right: auto; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #666; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.order-detail .footer { |
|
|
|
|
.footer-btn { |
|
|
|
|
display: inline-block; |
|
|
|
|
width: 150rpx; |
|
|
|
|
width: 160rpx; |
|
|
|
|
height: 60rpx; |
|
|
|
|
border: 1px solid #dedede; |
|
|
|
|
border: 1px solid #CCCCCC; |
|
|
|
|
border-radius: 30rpx; |
|
|
|
|
vertical-align: middle; |
|
|
|
|
font-size: 27rpx; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
line-height: 60rpx; |
|
|
|
|
text-align: center; |
|
|
|
|
color: #aaa; |
|
|
|
|
color: #666; |
|
|
|
|
|
|
|
|
|
&.blue { |
|
|
|
|
border-color: #2c8eff; |
|
|
|
|
background-color: #2c8eff; |
|
|
|
|
&.red { |
|
|
|
|
border-color: #FF4B33; |
|
|
|
|
background-color: #FF4B33; |
|
|
|
|
color: #ffffff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.footer-btn+.footer-btn { |
|
|
|
|
margin-left: 15rpx; |
|
|
|
|
margin-left: 8rpx; |
|
|
|
|
} |
|
|
|
|
</style> |