耀实惠小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

382 lines
7.7 KiB

<template>
<view>
<!-- 收获地址 -->
<view class="address_box" v-if="Object.keys(order).length>0">
<view class="name_box">
<text class="name_title">收货人</text>
<text class="user_name">{{order.addressName}}</text>
<text class="phone">{{order.addressPhone }}</text>
</view>
<view class="address">
<image :src="IMG_URL +'address_positions.png'" mode=""></image>
<text>{{order.address + order.addressDetail}}</text>
</view>
</view>
<!-- 商品信息 -->
<view class="order_box" v-if="Object.keys(order).length>0">
<view class="item">
<view class="time">
<text class="time_text">{{order.createTime}}</text>
<view class="phone" @click="call(order.addressPhone)">一键拨号</view>
</view>
<view class="goods_item" v-for="item in orderDetailList" :key="item.id">
<image :src="item.goodPic2" mode=""></image>
<view class="right_box flex-1">
<text class="title">{{item.goodName}}</text>
<view class="center_box">
<view class="money_box">
<!-- <text class="min red"></text> -->
<text class="bigs red">¥{{item.goodPrice}}</text>
</view>
<!-- <text class="back_money">再返消费金¥{{item.getPrice}}</text> -->
<text class="back_iconx">×{{item.goodNum}}</text>
</view>
<text>{{item.goodSku}}</text>
</view>
</view>
<view class="total_box">
<text class="sum_back_momey" v-if="status !== 4 && order.giveMoneySum">总消费金¥ +{{order.giveMoneySum}} {{order.giveIntegerSum ? '总兑购金'+order.giveIntegerSum +'元': ''}}</text>
<text class="text_price">合计</text>
<text class="price">¥{{order.payMoney}}</text>
</view>
</view>
<template v-if="status == 4">
<view class="row">
<text class="text_title">售后原因:</text>
<view class="text_right">
<text style="margin-right: 20rpx;">{{select_text}}</text>
<u-icon name="arrow-down" color="#707070"></u-icon>
</view>
</view>
<view class="parse_box">
{{}}
</view>
<view class="pic_box">
<image ></image>
</view>
</template>
</view>
</view>
</template>
<script>
import { IMG_URL } from '@/env.js';
export default {
data() {
return {
id: '',
status: null,
IMG_URL,
goodsInfo: {},
order: {},
orderDetailList: []
}
},
onLoad(options) {
this.id = options.id;
this.status = options.status;
this.getDetele(options.id)
},
methods: {
call(phone) {
uni.makePhoneCall({
phoneNumber: phone,
success(res) {
},
fail(err) {
}
})
},
// 获取订单详情
getDetele(id){
uni.showLoading();
this.$api('oneOrderById',{id}).then(res => {
let { code, result, message} = res;
if(code == 200) {
this.$Toast(result);
console.log(result)
this.order = result.order
result.orderDetailList.forEach(item => {
item.goodPic2 = item.goodPic == null? "": item.goodPic.split(',')[0];
})
this.orderDetailList = result.orderDetailList
uni.hideLoading()
}else {
uni.hideLoading()
this.$Toast(message);
}
}).catch(err => {
uni.hideLoading()
this.$Toast(err.message);
})
},
todetails() {
uni.navigateTo({
url: "/pagesA/my_other_list/webmaster/after_sales_order/after_sales_order_details/after_sales_order_details"
})
}
}
}
</script>
<style lang="scss" scoped>
.address_box {
width: 711rpx;
margin: 13rpx auto 0;
padding-bottom: 20rpx;
border-radius: 14rpx;
box-shadow: 0 3rpx 6rpx 0 rgba(0, 0, 0, 0.3);
.name_box {
padding-top: 34rpx;
margin-left: 23rpx;
display: flex;
.name_title {
font-size: 28rpx;
color: #707070;
line-height: 74rpx;
}
.user_name {
width: 231rpx;
height: 74rpx;
line-height: 74rpx;
padding-left: 14rpx;
box-sizing: border-box;
background-color: #F5F5F5;
color: #000000;
font-size: 28rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.phone {
width: 318rpx;
height: 74rpx;
margin-left: 12rpx;
line-height: 74rpx;
padding-left: 24rpx;
box-sizing: border-box;
background-color: #F5F5F5;
color: #000000;
font-size: 28rpx;
}
}
.address {
display: flex;
margin-top: 53rpx;
margin-left: 23rpx;
image {
width: 32rpx;
height: 42rpx;
}
text {
display: flex;
margin-left: 24rpx;
width: 478rpx;
font-size: 28rpx;
color: #707070;
}
}
}
.order_box {
margin-top: 22rpx;
padding-bottom: 20rpx;
.item {
width: 711rpx;
margin: 0 auto;
border-radius: 24rpx;
padding-bottom: 18rpx;
box-shadow: 0 3rpx 6rpx 0 rgba(0, 0, 0, 0.3);
.time {
width: 648rpx;
margin: 0 auto;
padding-top: 34rpx;
padding-bottom: 15rpx;
border-bottom: 1px solid rgba(112, 112, 112, 0.2);
display: flex;
justify-content: space-between;
font-size: 32rpx;
.time_text {
color: #333;
}
.phone {
color: #01AEEA;
}
}
.goods_item {
display: flex;
width: 648rpx;
margin: 0 auto;
margin-top: 22rpx;
padding-bottom: 26rpx;
border-bottom: 1px solid rgba(112, 112, 112, 0.2);
&:last-child {
border-bottom: none;
}
image {
width: 200rpx;
height: 200rpx;
border-radius: 20rpx;
}
.right_box {
display: flex;
flex-direction: column;
font-size: 26rpx;
margin-left: 25rpx;
.title {
color: #000;
font-size: 33rpx;
}
.center_box {
display: flex;
justify-content: space-between;
color: #01AEEA;
font-size: 32rpx;
.back_iconx{
font-size: 38rpx;
}
.money_box {
.red {
color: #DB0618;
}
.min {
font-size: 20rpx;
}
.bigs {
font-size: 36rpx;
}
}
.back_money{
color: #fff;
background-color: #FFA952;
border-radius: 15rpx;
height: 47rpx;
line-height: 47rpx;
box-sizing: border-box;
font-size: 20rpx;
padding-left: 15rpx;
padding-right: 15rpx;
}
.back_iconx{
font-size: 38rpx;
}
}
}
}
.total_box {
display: flex;
width: 648rpx;
margin: 0 auto;
justify-content: flex-end;
font-size: 28rpx;
align-items: center;
padding-top: 10rpx;
.sum_back_momey{
height: 47rpx;
line-height: 47rpx;
border-radius: 10rpx;
padding-left: 15rpx;
padding-right: 15rpx;
margin-right: 45rpx;
color: #fff;
background-color: #FFA952;
font-size: 26rpx;
}
.text_price{
font-size: 34rpx;
}
.price{
font-size: 36rpx;
}
text {
&:last-child {
color: #DB0618;
}
}
}
.gather {
width: 235rpx;
height: 60rpx;
margin-top: 23rpx;
margin-right: 21rpx;
border: 1rpx solid #01AEEA;
color: #01AEEA;
font-size: 24rpx;
border-radius: 30rpx;
line-height: 60rpx;
}
}
position: relative;
.received {
position: absolute;
top: 18rpx;
right: 122rpx;
width: 181rpx;
height: 108rpx;
}
}
.row{
margin: 40rpx auto 0;
padding-bottom: 20rpx;
display: flex;
justify-content: space-between;
width: 691rpx;
font-size: 32rpx;
border-bottom: 1px solid #707070;
.text_title{
margin-left: 20rpx;
}
.text_right{
margin-right: 40rpx;
}
}
.parse_box{
margin: 40rpx 36rpx 0;
font-size: 32rpx;
}
.pic_box {
display: flex;
width: 660rpx;
border-bottom: 1rpx solid #BCBCBC;
margin: 0 auto;
padding-bottom: 16rpx;
align-items: center;
image {
width: 160rpx;
height: 160rpx;
border-radius: 15rpx;
}
}
</style>