1
|
<template>
|
1
|
<template>
|
2
|
- <div class="status-desc">
|
|
|
3
|
- <p>{{detail.statusName}}</p>
|
|
|
4
|
- <p>申请时间: {{detail.createTime}}</p>
|
|
|
5
|
- </div>
|
|
|
6
|
- <div class="exchange-progress">
|
|
|
7
|
- <ul>
|
|
|
8
|
- <li v-for="status in detail.statusList"
|
|
|
9
|
- class="{{ status.act ==='Y' ? 'passed' : ''}}">
|
|
|
10
|
- <div class="progress-desc">
|
|
|
11
|
- <p>{{status.name}}</p>
|
|
|
12
|
- </div>
|
|
|
13
|
- </li>
|
|
|
14
|
- </ul>
|
|
|
15
|
- <div v-if="detail.status == 20"
|
|
|
16
|
- class="logistics-detail">
|
|
|
17
|
- <template v-if="detail.notice">
|
|
|
18
|
- <a href="/me/logistic?order_code={{sourceOrderCode}}&type=refund">
|
|
|
19
|
- <h2>{{detail.notice.title}}</h2>
|
|
|
20
|
- <p>物流公司: {{detail.notice.expressCompany}}<br>快递单号: {{detail.notice.expressNumber}}</p>
|
|
|
21
|
- <span class="right"><span class="icon icon-right"></span></span>
|
|
|
22
|
- </a>
|
|
|
23
|
- </template>
|
|
|
24
|
- </div>
|
|
|
25
|
- <div v-else class="progress-todo">
|
|
|
26
|
- <template v-if="detail.notice">
|
|
|
27
|
- <p>{{detail.notice.title}}</p>
|
|
|
28
|
- <p class="phone">{{detail.notice.remark}}</p>
|
|
|
29
|
- </template>
|
|
|
30
|
- </div>
|
|
|
31
|
- <div v-if="(detail.deliveryTpye === '10' || type ==='refund') && detail.status == 10"
|
|
|
32
|
- class="logistics">
|
|
|
33
|
- <a href="/me/return/logistics?applyid={{applyid}}">填写商品寄回的快递信息</a>
|
2
|
+ <template v-if="show">
|
|
|
3
|
+ <div class="status-desc">
|
|
|
4
|
+ <p>{{detail.statusName}}</p>
|
|
|
5
|
+ <p>申请时间: {{detail.createTime}}</p>
|
34
|
</div>
|
6
|
</div>
|
35
|
- </div>
|
|
|
36
|
- <div class="exchange-details">
|
|
|
37
|
- <h2 v-if="type ==='refund'">退货详情 <i>RETURN DETAILS</i></h2>
|
|
|
38
|
- <h2 v-else>换货详情 <i>EXCHANGE DETAILS</i></h2>
|
|
|
39
|
- <div class="exchange-product-wrapper">
|
|
|
40
|
- <div class="exchange-product" v-for="goods in detail.goodsList">
|
|
|
41
|
- <div class="goods-info">
|
|
|
42
|
- <div class="img-box">
|
|
|
43
|
- <img :src="goods.goodsImage | resize 49 65">
|
7
|
+ <div class="exchange-progress">
|
|
|
8
|
+ <ul>
|
|
|
9
|
+ <li v-for="status in detail.statusList"
|
|
|
10
|
+ class="{{ status.act ==='Y' ? 'passed' : ''}}">
|
|
|
11
|
+ <div class="progress-desc">
|
|
|
12
|
+ <p>{{status.name}}</p>
|
44
|
</div>
|
13
|
</div>
|
45
|
- <div class="goods-detail">
|
|
|
46
|
- <p class="name">{{goods.productName}}</p>
|
|
|
47
|
- <p class="size">
|
|
|
48
|
- <span v-if="goods.colorName">颜色: {{goods.colorName}}</span>
|
|
|
49
|
- <span v-if="goods.sizeName">尺码: {{goods.sizeName}}</span>
|
|
|
50
|
- </p>
|
14
|
+ </li>
|
|
|
15
|
+ </ul>
|
|
|
16
|
+ <div v-if="detail.status == 20"
|
|
|
17
|
+ class="logistics-detail">
|
|
|
18
|
+ <template v-if="detail.notice">
|
|
|
19
|
+ <a href="/me/logistic?order_code={{sourceOrderCode}}&type=refund">
|
|
|
20
|
+ <h2>{{detail.notice.title}}</h2>
|
|
|
21
|
+ <p>物流公司: {{detail.notice.expressCompany}}<br>快递单号: {{detail.notice.expressNumber}}</p>
|
|
|
22
|
+ <span class="right"><span class="icon icon-right"></span></span>
|
|
|
23
|
+ </a>
|
|
|
24
|
+ </template>
|
|
|
25
|
+ </div>
|
|
|
26
|
+ <div v-else class="progress-todo">
|
|
|
27
|
+ <template v-if="detail.notice">
|
|
|
28
|
+ <p>{{detail.notice.title}}</p>
|
|
|
29
|
+ <p class="phone">{{detail.notice.remark}}</p>
|
|
|
30
|
+ </template>
|
|
|
31
|
+ </div>
|
|
|
32
|
+ <div v-if="(detail.deliveryTpye === '10' || type ==='refund') && detail.status == 10"
|
|
|
33
|
+ class="logistics">
|
|
|
34
|
+ <a href="/me/return/logistics?applyid={{applyid}}">填写商品寄回的快递信息</a>
|
|
|
35
|
+ </div>
|
|
|
36
|
+ </div>
|
|
|
37
|
+ <div class="exchange-details">
|
|
|
38
|
+ <h2 v-if="type ==='refund'">退货详情 <i>RETURN DETAILS</i></h2>
|
|
|
39
|
+ <h2 v-else>换货详情 <i>EXCHANGE DETAILS</i></h2>
|
|
|
40
|
+ <div class="exchange-product-wrapper">
|
|
|
41
|
+ <div class="exchange-product" v-for="goods in detail.goodsList">
|
|
|
42
|
+ <div class="goods-info">
|
|
|
43
|
+ <div class="img-box">
|
|
|
44
|
+ <img :src="goods.goodsImage | resize 49 65">
|
|
|
45
|
+ </div>
|
|
|
46
|
+ <div class="goods-detail">
|
|
|
47
|
+ <p class="name">{{goods.productName}}</p>
|
|
|
48
|
+ <p class="size">
|
|
|
49
|
+ <span v-if="goods.colorName">颜色: {{goods.colorName}}</span>
|
|
|
50
|
+ <span v-if="goods.sizeName">尺码: {{goods.sizeName}}</span>
|
|
|
51
|
+ </p>
|
|
|
52
|
+ </div>
|
|
|
53
|
+ <div class="goods-price">
|
|
|
54
|
+ <p>¥ {{goods.salesPrice}}</p>
|
|
|
55
|
+ <p>×1</p>
|
|
|
56
|
+ </div>
|
51
|
</div>
|
57
|
</div>
|
52
|
- <div class="goods-price">
|
|
|
53
|
- <p>¥ {{goods.salesPrice}}</p>
|
|
|
54
|
- <p>×1</p>
|
58
|
+ <div class="exchange-reason">
|
|
|
59
|
+ <p v-if="goods.newColorName || goods.newSizeName">换货颜色尺码: {{goods.newColorName}} {{goods.newSizeName}}</p>
|
|
|
60
|
+ <p v-if="goods.reasonName">换货原因: {{goods.reasonName}}</p>
|
|
|
61
|
+ <blockquote v-if="goods.remark">{{goods.remark}}</blockquote>
|
|
|
62
|
+ <ul v-if="goods.evidenceImages.length > 0" class="exchange-img">
|
|
|
63
|
+ <li v-for="image in goods.evidenceImages">
|
|
|
64
|
+ <img :src="image | resize 154 154">
|
|
|
65
|
+ </li>
|
|
|
66
|
+ </ul>
|
55
|
</div>
|
67
|
</div>
|
56
|
</div>
|
68
|
</div>
|
57
|
- <div class="exchange-reason">
|
|
|
58
|
- <p v-if="goods.newColorName || goods.newSizeName">换货颜色尺码: {{goods.newColorName}} {{goods.newSizeName}}</p>
|
|
|
59
|
- <p v-if="goods.reasonName">换货原因: {{goods.reasonName}}</p>
|
|
|
60
|
- <blockquote v-if="goods.remark">{{goods.remark}}</blockquote>
|
|
|
61
|
- <ul v-if="goods.evidenceImages.length > 0" class="exchange-img">
|
|
|
62
|
- <li v-for="image in goods.evidenceImages">
|
|
|
63
|
- <img :src="image | resize 154 154">
|
|
|
64
|
- </li>
|
|
|
65
|
- </ul>
|
|
|
66
|
- </div>
|
|
|
67
|
</div>
|
69
|
</div>
|
68
|
</div>
|
70
|
</div>
|
69
|
- </div>
|
|
|
70
|
- <div class="exchange-express" v-if="type ==='refund'">
|
|
|
71
|
- <div class="exchange-address" v-if="detail.returnAmount">
|
|
|
72
|
- <p>退款金额: ¥{{detail.returnAmount}}</p>
|
|
|
73
|
- <p>(现金:¥{{detail.returnAmountTotal}} - YOHO币:{{detail.returnYohoCoin}} - 优惠券:{{detail.returnCouponAmount}})</p>
|
71
|
+ <div class="exchange-express" v-if="type ==='refund'">
|
|
|
72
|
+ <div class="exchange-address" v-if="detail.returnAmount">
|
|
|
73
|
+ <p>退款金额: ¥{{detail.returnAmount}}</p>
|
|
|
74
|
+ <p>(现金:¥{{detail.returnAmountTotal}} - YOHO币:{{detail.returnYohoCoin}} - 优惠券:{{detail.returnCouponAmount}})</p>
|
|
|
75
|
+ </div>
|
|
|
76
|
+ <div class="exchange-type">
|
|
|
77
|
+ <span href="" class="primary">退款方式<span class="right">{{detail.returnAmountModeName}}</span>
|
|
|
78
|
+ </span>
|
|
|
79
|
+ <div class="amount-modeinfo" v-if="detail.returnAmountModeInfo && detail.returnAmountModeInfo.length">
|
|
|
80
|
+ <p v-if="detail.returnAmountModeInfo[0].bankName">银行 <span>{{detail.returnAmountModeInfo[0].bankName}}</span></p>
|
|
|
81
|
+ <p v-if="detail.returnAmountModeInfo[0].bankCard">卡号 <span>{{detail.returnAmountModeInfo[0].bankCard}}</span></p>
|
|
|
82
|
+ <p v-if="detail.returnAmountModeInfo[0].payeeName">姓名 <span>{{detail.returnAmountModeInfo[0].payeeName}}</span></p>
|
|
|
83
|
+ <p v-if="detail.returnAmountModeInfo[0].alipayAccount">账号 <span>{{detail.returnAmountModeInfo[0].alipayAccount}}</span></p>
|
|
|
84
|
+ <p v-if="detail.returnAmountModeInfo[0].alipayName">姓名 <span>{{detail.returnAmountModeInfo[0].alipayName}}</span></p>
|
|
|
85
|
+ </div>
|
|
|
86
|
+ <span class="amount-info" v-if="detail.returnAmountInfo">{{detail.returnAmountInfo}}</span>
|
|
|
87
|
+ </div>
|
74
|
</div>
|
88
|
</div>
|
75
|
- <div class="exchange-type">
|
|
|
76
|
- <span href="" class="primary">退款方式<span class="right">{{detail.returnAmountModeName}}</span>
|
|
|
77
|
- </span>
|
|
|
78
|
- <div class="amount-modeinfo" v-if="detail.returnAmountModeInfo && detail.returnAmountModeInfo.length">
|
|
|
79
|
- <p v-if="detail.returnAmountModeInfo[0].bankName">银行 <span>{{detail.returnAmountModeInfo[0].bankName}}</span></p>
|
|
|
80
|
- <p v-if="detail.returnAmountModeInfo[0].bankCard">卡号 <span>{{detail.returnAmountModeInfo[0].bankCard}}</span></p>
|
|
|
81
|
- <p v-if="detail.returnAmountModeInfo[0].payeeName">姓名 <span>{{detail.returnAmountModeInfo[0].payeeName}}</span></p>
|
|
|
82
|
- <p v-if="detail.returnAmountModeInfo[0].alipayAccount">账号 <span>{{detail.returnAmountModeInfo[0].alipayAccount}}</span></p>
|
|
|
83
|
- <p v-if="detail.returnAmountModeInfo[0].alipayName">姓名 <span>{{detail.returnAmountModeInfo[0].alipayName}}</span></p>
|
89
|
+ <div class="exchange-express" v-else>
|
|
|
90
|
+ <div class="exchange-address">
|
|
|
91
|
+ <p><span>{{detail.consigneeName}}</span><span>{{detail.mobile}}</span></p>
|
|
|
92
|
+ <p>{{detail.province}} {{detail.city}} {{detail.county}} <br>{{detail.address}}</p>
|
|
|
93
|
+ </div>
|
|
|
94
|
+ <div class="exchange-type">
|
|
|
95
|
+ <span class="primary">换货方式<span class="right">{{detail.deliveryTpyeName}}</span></span>
|
84
|
</div>
|
96
|
</div>
|
85
|
- <span class="amount-info" v-if="detail.returnAmountInfo">{{detail.returnAmountInfo}}</span>
|
|
|
86
|
</div>
|
97
|
</div>
|
87
|
- </div>
|
|
|
88
|
- <div class="exchange-express" v-else>
|
|
|
89
|
- <div class="exchange-address">
|
|
|
90
|
- <p><span>{{detail.consigneeName}}</span><span>{{detail.mobile}}</span></p>
|
|
|
91
|
- <p>{{detail.province}} {{detail.city}} {{detail.county}} <br>{{detail.address}}</p>
|
98
|
+ <div class="exchange-order">
|
|
|
99
|
+ <a class="primary" href="/me/order/detail?orderCode={{sourceOrderCode}}">原订单详情
|
|
|
100
|
+ <span class="right"><span class="icon icon-right"></span></span>
|
|
|
101
|
+ </a>
|
92
|
</div>
|
102
|
</div>
|
93
|
- <div class="exchange-type">
|
|
|
94
|
- <span class="primary">换货方式<span class="right">{{detail.deliveryTpyeName}}</span></span>
|
103
|
+ <div v-if="detail.canCancel ==='Y'" class="exchange-options">
|
|
|
104
|
+ <button @click="cancel">取消申请</button>
|
95
|
</div>
|
105
|
</div>
|
96
|
- </div>
|
|
|
97
|
- <div class="exchange-order">
|
|
|
98
|
- <a class="primary" href="/me/order/detail?orderCode={{sourceOrderCode}}">原订单详情
|
|
|
99
|
- <span class="right"><span class="icon icon-right"></span></span>
|
|
|
100
|
- </a>
|
|
|
101
|
- </div>
|
|
|
102
|
- <div v-if="detail.canCancel ==='Y'" class="exchange-options">
|
|
|
103
|
- <button @click="cancel">取消申请</button>
|
|
|
104
|
- </div>
|
106
|
+ </template>
|
105
|
</template>
|
107
|
</template>
|
106
|
|
108
|
|
107
|
<script>
|
109
|
<script>
|
|
@@ -117,6 +119,7 @@ |
|
@@ -117,6 +119,7 @@ |
117
|
data() {
|
119
|
data() {
|
118
|
return {
|
120
|
return {
|
119
|
id: '',
|
121
|
id: '',
|
|
|
122
|
+ show: false,
|
120
|
sourceOrderCode: '',
|
123
|
sourceOrderCode: '',
|
121
|
detail: {}
|
124
|
detail: {}
|
122
|
};
|
125
|
};
|
|
@@ -161,7 +164,8 @@ |
|
@@ -161,7 +164,8 @@ |
161
|
type: this.type
|
164
|
type: this.type
|
162
|
}
|
165
|
}
|
163
|
}).then(res => {
|
166
|
}).then(res => {
|
164
|
- if (res.data) {
|
167
|
+ if (res.code === 200) {
|
|
|
168
|
+ this.show = true;
|
165
|
this.detail = res.data;
|
169
|
this.detail = res.data;
|
166
|
if (!this.detail.goodsList) {
|
170
|
if (!this.detail.goodsList) {
|
167
|
return;
|
171
|
return;
|
|
@@ -174,8 +178,14 @@ |
|
@@ -174,8 +178,14 @@ |
174
|
// return util.getImgHost(p) + '?imageView2/2/w/154/h/154';
|
178
|
// return util.getImgHost(p) + '?imageView2/2/w/154/h/154';
|
175
|
// })
|
179
|
// })
|
176
|
});
|
180
|
});
|
|
|
181
|
+ } else if (result.code !== 500) {
|
|
|
182
|
+ tip(result.message);
|
|
|
183
|
+ } else {
|
|
|
184
|
+ tip('数据获取失败');
|
177
|
}
|
185
|
}
|
178
|
- });
|
186
|
+ }).fail(() => {
|
|
|
187
|
+ tip('网络错误');
|
|
|
188
|
+ });;
|
179
|
}
|
189
|
}
|
180
|
};
|
190
|
};
|
181
|
</script>
|
191
|
</script>
|