<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>
|