|
|
@@ -1,11 +1,11 @@
|
|
1
|
1
|
<script setup lang="ts">
|
|
2
|
2
|
import CXBBasePage from "~/components/CXBBasePage/CXBBasePage.vue";
|
|
3
|
|
-import {encodePhone} from "~/utils";
|
|
4
|
|
-import {CDN_URL} from "~/config/app";
|
|
5
|
|
-import {useAddressStore} from "~/stores/addressStore";
|
|
|
3
|
+import { encodePhone } from "~/utils";
|
|
|
4
|
+import { CDN_URL } from "~/config/app";
|
|
|
5
|
+import { useAddressStore } from "~/stores/addressStore";
|
|
6
|
6
|
import FPrice from "~/components/FPrice/FPrice.vue";
|
|
7
|
|
-import {cancelOrder, takeOrder} from "~/apis/order.api";
|
|
8
|
|
-import {decodeBase64, encodeBase64} from "~/utils/http/helper";
|
|
|
7
|
+import { cancelOrder, takeOrder } from "~/apis/order.api";
|
|
|
8
|
+import { decodeBase64, encodeBase64 } from "~/utils/http/helper";
|
|
9
|
9
|
|
|
10
|
10
|
const addressIcon = CDN_URL + '/static/assets/dingwi_220624.png'
|
|
11
|
11
|
const addressStore = useAddressStore()
|
|
|
@@ -25,7 +25,7 @@ onLoad((options) => {
|
|
25
|
25
|
// console.log(options.detail)
|
|
26
|
26
|
if (options.detail) {
|
|
27
|
27
|
detail.value = JSON.parse(decodeBase64(options.detail))
|
|
28
|
|
- // detail.value = JSON.parse(decodeBase64(base64Json))
|
|
|
28
|
+ // detail.value = JSON.parse(decodeBase64(base64Json))
|
|
29
|
29
|
}
|
|
30
|
30
|
if (options.type) {
|
|
31
|
31
|
state.type = options.type
|
|
|
@@ -64,6 +64,8 @@ onLoad((options) => {
|
|
64
|
64
|
function handleCancelOrder() {
|
|
65
|
65
|
console.log('取消订单操作')
|
|
66
|
66
|
cancelOrder(detail.value.group_order_id).then(res => {
|
|
|
67
|
+ console.log('RES',res);
|
|
|
68
|
+
|
|
67
|
69
|
uni.showToast({
|
|
68
|
70
|
title: '取消成功',
|
|
69
|
71
|
icon: 'none'
|
|
|
@@ -73,11 +75,15 @@ function handleCancelOrder() {
|
|
73
|
75
|
uni.navigateBack()
|
|
74
|
76
|
}, 300)
|
|
75
|
77
|
|
|
76
|
|
- }).catch(error => {
|
|
77
|
|
-
|
|
78
|
|
- uni.navigateTo({
|
|
79
|
|
- url: '/pages/user/login/index?key=30'
|
|
80
|
|
- })
|
|
|
78
|
+ })
|
|
|
79
|
+ .catch(error => {
|
|
|
80
|
+ // uni.showToast({
|
|
|
81
|
+ // title: error,
|
|
|
82
|
+ // icon: 'none'
|
|
|
83
|
+ // })
|
|
|
84
|
+ // uni.navigateTo({
|
|
|
85
|
+ // url: '/pages/user/login/index?key=30'
|
|
|
86
|
+ // })
|
|
81
|
87
|
})
|
|
82
|
88
|
}
|
|
83
|
89
|
|
|
|
@@ -86,7 +92,7 @@ function handlePayment() {
|
|
86
|
92
|
// const { orderItem } = detail.value
|
|
87
|
93
|
// console.log(orderItem)
|
|
88
|
94
|
uni.navigateTo({
|
|
89
|
|
- url: '/pages/payment/index?' + `pay_price=${ detail.value.pay_price}&order_id=${ detail.value.group_order_id}&OrderList=${JSON.stringify( detail.value)}`
|
|
|
95
|
+ url: '/pages/payment/index?' + `pay_price=${detail.value.pay_price}&order_id=${detail.value.group_order_id}&OrderList=${JSON.stringify(detail.value)}`
|
|
90
|
96
|
// url: `/pages/payment/index`
|
|
91
|
97
|
})
|
|
92
|
98
|
}
|
|
|
@@ -181,14 +187,14 @@ const payType = computed(() => {
|
|
181
|
187
|
})
|
|
182
|
188
|
|
|
183
|
189
|
const getSymbol = (pay_type: string) => {
|
|
184
|
|
- if (pay_type === '5') {
|
|
185
|
|
- return '积分'
|
|
186
|
|
- } else {
|
|
187
|
|
- return '¥'
|
|
188
|
|
- }
|
|
|
190
|
+ if (pay_type === '5') {
|
|
|
191
|
+ return '积分'
|
|
|
192
|
+ } else {
|
|
|
193
|
+ return '¥'
|
|
|
194
|
+ }
|
|
189
|
195
|
}
|
|
190
|
196
|
function handleProductItemClick(
|
|
191
|
|
- item
|
|
|
197
|
+ item
|
|
192
|
198
|
) {
|
|
193
|
199
|
console.log(item.product_id)
|
|
194
|
200
|
// 大仓
|
|
|
@@ -200,167 +206,165 @@ function handleProductItemClick(
|
|
200
|
206
|
|
|
201
|
207
|
</script>
|
|
202
|
208
|
<template>
|
|
203
|
|
- <div class="p-3 flex flex-col gap-3 pb-safe text-[12px]" v-if="detail">
|
|
204
|
|
- <div
|
|
205
|
|
- class="rounded bg-white p-3 flex">
|
|
206
|
|
- <div class="flex flex-col flex-1 gap-2">
|
|
207
|
|
- <div class="flex items-center gap-2">
|
|
208
|
|
- <div class="flex text-sm text-gray-500 justify-between items-center w-full">
|
|
209
|
|
- <div class="flex-1 flex items-center gap-2">
|
|
210
|
|
- <div class="w-fit flex">
|
|
211
|
|
- <image :src="addressIcon" mode="widthFix" class="w-4 h-4"></image>
|
|
212
|
|
- </div>
|
|
213
|
|
- <div class="flex-1 flex">
|
|
214
|
|
- {{ detail.user_address }}
|
|
215
|
|
- </div>
|
|
|
209
|
+ <div class="p-3 flex flex-col gap-3 pb-safe text-[12px]" v-if="detail">
|
|
|
210
|
+ <div class="rounded bg-white p-3 flex">
|
|
|
211
|
+ <div class="flex flex-col flex-1 gap-2">
|
|
|
212
|
+ <div class="flex items-center gap-2">
|
|
|
213
|
+ <div class="flex text-sm text-gray-500 justify-between items-center w-full">
|
|
|
214
|
+ <div class="flex-1 flex items-center gap-2">
|
|
|
215
|
+ <div class="w-fit flex">
|
|
|
216
|
+ <image :src="addressIcon" mode="widthFix" class="w-4 h-4"></image>
|
|
|
217
|
+ </div>
|
|
|
218
|
+ <div class="flex-1 flex">
|
|
|
219
|
+ {{ detail.user_address }}
|
|
216
|
220
|
</div>
|
|
|
221
|
+ </div>
|
|
217
|
222
|
|
|
218
|
|
- <div class="w-4 flex i-tabler-chevron-right text-gray"></div>
|
|
|
223
|
+ <div class="w-4 flex i-tabler-chevron-right text-gray"></div>
|
|
219
|
224
|
|
|
220
|
|
- </div>
|
|
221
|
225
|
</div>
|
|
222
|
|
- <!-- <div class="flex text-sm font-bold">{{ data.addressInfo.detail }}</div>-->
|
|
223
|
|
- <div class="flex gap-2 items-center text-xs text-gray-500">
|
|
224
|
|
- <div>
|
|
225
|
|
- {{ detail.real_name }}
|
|
226
|
|
- </div>
|
|
227
|
|
- <div v-if="detail.user_phone">
|
|
228
|
|
- {{ encodePhone(detail.user_phone) }}
|
|
229
|
|
- </div>
|
|
|
226
|
+ </div>
|
|
|
227
|
+ <!-- <div class="flex text-sm font-bold">{{ data.addressInfo.detail }}</div>-->
|
|
|
228
|
+ <div class="flex gap-2 items-center text-xs text-gray-500">
|
|
|
229
|
+ <div>
|
|
|
230
|
+ {{ detail.real_name }}
|
|
|
231
|
+ </div>
|
|
|
232
|
+ <div v-if="detail.user_phone">
|
|
|
233
|
+ {{ encodePhone(detail.user_phone) }}
|
|
230
|
234
|
</div>
|
|
231
|
235
|
</div>
|
|
232
|
236
|
</div>
|
|
|
237
|
+ </div>
|
|
233
|
238
|
|
|
234
|
|
- <div class="bg-white rounded">
|
|
235
|
|
- <div class="flex items-center gap-2 text-sm font-bold f-hairline-bottom p-3" v-if="detail.merchant">
|
|
236
|
|
- <image :src="detail.merchant.mer_avatar" mode="widthFix" class="w-5 h-5"></image>
|
|
237
|
|
- <div>{{ detail.merchant.mer_name }}</div>
|
|
238
|
|
- </div>
|
|
|
239
|
+ <div class="bg-white rounded">
|
|
|
240
|
+ <div class="flex items-center gap-2 text-sm font-bold f-hairline-bottom p-3" v-if="detail.merchant">
|
|
|
241
|
+ <image :src="detail.merchant.mer_avatar" mode="widthFix" class="w-5 h-5"></image>
|
|
|
242
|
+ <div>{{ detail.merchant.mer_name }}</div>
|
|
|
243
|
+ </div>
|
|
239
|
244
|
|
|
240
|
|
- <div v-for="(productItem, productIndex) in detail.orderProduct" :key="productIndex" class="p-3">
|
|
241
|
|
- <div class="flex gap-2">
|
|
242
|
|
- <div @tap.stop="handleProductItemClick(productItem)">
|
|
243
|
|
- <image :src="productItem.cart_info.product.image" mode="widthFix" class="rounded w-20 h-20"></image>
|
|
|
245
|
+ <div v-for="(productItem, productIndex) in detail.orderProduct" :key="productIndex" class="p-3">
|
|
|
246
|
+ <div class="flex gap-2">
|
|
|
247
|
+ <div @tap.stop="handleProductItemClick(productItem)">
|
|
|
248
|
+ <image :src="productItem.cart_info.product.image" mode="widthFix" class="rounded w-20 h-20"></image>
|
|
244
|
249
|
|
|
245
|
|
- </div>
|
|
246
|
|
- <div class="flex flex-col w-full">
|
|
247
|
|
- <div class="flex flex-col text-sm ">
|
|
248
|
|
- <div class="flex justify-between" @tap.stop="handleProductItemClick(productItem)">
|
|
249
|
|
- <div class="flex">
|
|
250
|
|
- {{ productItem.cart_info.product.store_name }}
|
|
251
|
|
- </div>
|
|
252
|
|
- <div class="flex">¥{{ productItem.product_price }}</div>
|
|
|
250
|
+ </div>
|
|
|
251
|
+ <div class="flex flex-col w-full">
|
|
|
252
|
+ <div class="flex flex-col text-sm ">
|
|
|
253
|
+ <div class="flex justify-between" @tap.stop="handleProductItemClick(productItem)">
|
|
|
254
|
+ <div class="flex">
|
|
|
255
|
+ {{ productItem.cart_info.product.store_name }}
|
|
253
|
256
|
</div>
|
|
|
257
|
+ <div class="flex">¥{{ productItem.product_price }}</div>
|
|
|
258
|
+ </div>
|
|
254
|
259
|
|
|
255
|
260
|
|
|
256
|
|
- <div class="text-[11px] text-gray-500 flex justify-between">
|
|
257
|
|
- <div class="">{{ productItem.cart_info.productAttr.sku }}</div>
|
|
258
|
|
- <div class="">共{{ productItem.product_num }}件</div>
|
|
259
|
|
- </div>
|
|
260
|
|
-
|
|
|
261
|
+ <div class="text-[11px] text-gray-500 flex justify-between">
|
|
|
262
|
+ <div class="">{{ productItem.cart_info.productAttr.sku }}</div>
|
|
|
263
|
+ <div class="">共{{ productItem.product_num }}件</div>
|
|
261
|
264
|
</div>
|
|
|
265
|
+
|
|
262
|
266
|
</div>
|
|
263
|
267
|
</div>
|
|
264
|
268
|
</div>
|
|
|
269
|
+ </div>
|
|
265
|
270
|
|
|
266
|
271
|
|
|
267
|
|
- <div class=" flex flex-col gap-3 p-3">
|
|
268
|
|
- <div class="flex justify-end" v-if="detail.status == 1 || detail.status == 2 || detail.status == 3 || detail.status == 0">
|
|
269
|
|
- <nut-button size="small" plain type="default" @tap.stop="handeRefund">申请售后</nut-button>
|
|
270
|
|
- </div>
|
|
271
|
|
-<!-- <div class="flex justify-end" v-if="detail.status == 0">-->
|
|
272
|
|
-<!-- <nut-button size="small" plain type="default" @tap.stop="handeRefund">申请退款</nut-button>-->
|
|
273
|
|
-<!-- </div>-->
|
|
|
272
|
+ <div class=" flex flex-col gap-3 p-3">
|
|
|
273
|
+ <div class="flex justify-end"
|
|
|
274
|
+ v-if="detail.status == 1 || detail.status == 2 || detail.status == 3 || detail.status == 0">
|
|
|
275
|
+ <nut-button size="small" plain type="default" @tap.stop="handeRefund">申请售后</nut-button>
|
|
|
276
|
+ </div>
|
|
|
277
|
+ <!-- <div class="flex justify-end" v-if="detail.status == 0">-->
|
|
|
278
|
+ <!-- <nut-button size="small" plain type="default" @tap.stop="handeRefund">申请退款</nut-button>-->
|
|
|
279
|
+ <!-- </div>-->
|
|
274
|
280
|
|
|
275
|
|
- <div class="flex justify-between">
|
|
276
|
|
- <div>商品总额</div>
|
|
277
|
|
- <div class="text-gray">{{getSymbol(detail.pay_type)}}{{ detail.total_price }}</div>
|
|
278
|
|
- </div>
|
|
279
|
|
- <div class="flex justify-between">
|
|
280
|
|
- <div>优惠金额</div>
|
|
281
|
|
- <div class="text-gray">{{getSymbol(detail.pay_type)}}{{ detail.coupon_price }}</div>
|
|
282
|
|
- </div>
|
|
283
|
|
- <div class="flex justify-between">
|
|
284
|
|
- <div>运费</div>
|
|
285
|
|
- <div class="text-gray">
|
|
286
|
|
- {{getSymbol(detail.pay_type)}}{{ detail.pay_postage }}
|
|
287
|
|
- </div>
|
|
|
281
|
+ <div class="flex justify-between">
|
|
|
282
|
+ <div>商品总额</div>
|
|
|
283
|
+ <div class="text-gray">{{ getSymbol(detail.pay_type) }}{{ detail.total_price }}</div>
|
|
|
284
|
+ </div>
|
|
|
285
|
+ <div class="flex justify-between">
|
|
|
286
|
+ <div>优惠金额</div>
|
|
|
287
|
+ <div class="text-gray">{{ getSymbol(detail.pay_type) }}{{ detail.coupon_price }}</div>
|
|
|
288
|
+ </div>
|
|
|
289
|
+ <div class="flex justify-between">
|
|
|
290
|
+ <div>运费</div>
|
|
|
291
|
+ <div class="text-gray">
|
|
|
292
|
+ {{ getSymbol(detail.pay_type) }}{{ detail.pay_postage }}
|
|
288
|
293
|
</div>
|
|
289
|
|
- <div class="flex justify-between">
|
|
|
294
|
+ </div>
|
|
|
295
|
+ <div class="flex justify-between">
|
|
290
|
296
|
|
|
291
|
|
- <div>实付款</div>
|
|
292
|
|
- <div class="text-gray">
|
|
293
|
|
- <FPrice :price="detail.pay_price" ex-class="font-bold text-xl" symbol="积分" v-if="detail.pay_type == 5"></FPrice>
|
|
294
|
|
- <FPrice :price="detail.pay_price" ex-class="font-bold text-xl" v-else></FPrice>
|
|
295
|
|
- </div>
|
|
|
297
|
+ <div>实付款</div>
|
|
|
298
|
+ <div class="text-gray">
|
|
|
299
|
+ <FPrice :price="detail.pay_price" ex-class="font-bold text-xl" symbol="积分" v-if="detail.pay_type == 5">
|
|
|
300
|
+ </FPrice>
|
|
|
301
|
+ <FPrice :price="detail.pay_price" ex-class="font-bold text-xl" v-else></FPrice>
|
|
296
|
302
|
</div>
|
|
|
303
|
+ </div>
|
|
297
|
304
|
|
|
298
|
|
- <div class="h-0.2 bg-gray-100 my-2"></div>
|
|
|
305
|
+ <div class="h-0.2 bg-gray-100 my-2"></div>
|
|
299
|
306
|
|
|
300
|
|
-<!-- <div class="flex justify-between">-->
|
|
|
307
|
+ <!-- <div class="flex justify-between">-->
|
|
301
|
308
|
|
|
302
|
|
-<!-- <div>订单编号</div>-->
|
|
303
|
|
-<!-- <div class="text-gray">{{ detail.order_sn }}</div>-->
|
|
304
|
|
-<!-- </div>-->
|
|
305
|
|
- <div class="flex justify-between">
|
|
306
|
|
- <div>订单编号</div>
|
|
307
|
|
- <div class="flex gap-2">
|
|
308
|
|
- <div class="text-gray-400">{{ detail.order_sn }}</div>
|
|
309
|
|
- <div @click="handleClipboard">复制</div>
|
|
310
|
|
- </div>
|
|
|
309
|
+ <!-- <div>订单编号</div>-->
|
|
|
310
|
+ <!-- <div class="text-gray">{{ detail.order_sn }}</div>-->
|
|
|
311
|
+ <!-- </div>-->
|
|
|
312
|
+ <div class="flex justify-between">
|
|
|
313
|
+ <div>订单编号</div>
|
|
|
314
|
+ <div class="flex gap-2">
|
|
|
315
|
+ <div class="text-gray-400">{{ detail.order_sn }}</div>
|
|
|
316
|
+ <div @click="handleClipboard">复制</div>
|
|
311
|
317
|
</div>
|
|
312
|
|
- <div class="flex justify-between">
|
|
|
318
|
+ </div>
|
|
|
319
|
+ <div class="flex justify-between">
|
|
313
|
320
|
|
|
314
|
|
- <div>支付方式</div>
|
|
|
321
|
+ <div>支付方式</div>
|
|
315
|
322
|
|
|
316
|
|
- <div class="text-gray">{{ payType }}</div>
|
|
317
|
|
-<!-- <div class="text-gray">{{ detail.pay_type === '0' ? '微信' : '支付宝' }}</div>-->
|
|
318
|
|
- </div>
|
|
|
323
|
+ <div class="text-gray">{{ payType }}</div>
|
|
|
324
|
+ <!-- <div class="text-gray">{{ detail.pay_type === '0' ? '微信' : '支付宝' }}</div>-->
|
|
|
325
|
+ </div>
|
|
319
|
326
|
|
|
320
|
|
- <div class="flex justify-between">
|
|
|
327
|
+ <div class="flex justify-between">
|
|
321
|
328
|
|
|
322
|
|
- <div>下单时间</div>
|
|
323
|
|
- <div class="text-gray">{{ detail.create_time }}</div>
|
|
324
|
|
- </div>
|
|
|
329
|
+ <div>下单时间</div>
|
|
|
330
|
+ <div class="text-gray">{{ detail.create_time }}</div>
|
|
|
331
|
+ </div>
|
|
325
|
332
|
|
|
326
|
|
- <div class="flex justify-between" v-if="detail.status != 5">
|
|
|
333
|
+ <div class="flex justify-between" v-if="detail.status != 5">
|
|
327
|
334
|
|
|
328
|
|
- <div>支付时间</div>
|
|
329
|
|
- <div class="text-gray">{{ detail.pay_time }}</div>
|
|
330
|
|
- <!-- <div class="text-gray">{{ detail.pay_type === '0' ? '微信' : '支付宝' }}</div>-->
|
|
331
|
|
- </div>
|
|
|
335
|
+ <div>支付时间</div>
|
|
|
336
|
+ <div class="text-gray">{{ detail.pay_time }}</div>
|
|
|
337
|
+ <!-- <div class="text-gray">{{ detail.pay_type === '0' ? '微信' : '支付宝' }}</div>-->
|
|
332
|
338
|
</div>
|
|
333
|
|
-
|
|
334
|
339
|
</div>
|
|
|
340
|
+
|
|
335
|
341
|
</div>
|
|
|
342
|
+ </div>
|
|
336
|
343
|
|
|
337
|
|
- <div class="fixed bottom-0 bg-white p-safe items-center w-full">
|
|
338
|
|
- <div class="flex justify-end gap-2 p-3"
|
|
339
|
|
- v-if="detail.status == 5 || detail.type == 5"
|
|
340
|
|
- >
|
|
341
|
|
- <nut-button size="small" type="default" @tap.stop="handleCancelOrder"><div class="text-black">取消订单</div></nut-button>
|
|
342
|
|
- <nut-button size="small" plain type="primary" @tap.stop="handlePayment">立即支付</nut-button>
|
|
|
344
|
+ <div class="fixed bottom-0 bg-white p-safe items-center w-full">
|
|
|
345
|
+ <div class="flex justify-end gap-2 p-3" v-if="detail.status == 5 || detail.type == 5">
|
|
|
346
|
+ <nut-button size="small" type="default" @tap.stop="handleCancelOrder">
|
|
|
347
|
+ <div class="text-black">取消订单</div>
|
|
|
348
|
+ </nut-button>
|
|
|
349
|
+ <nut-button size="small" plain type="primary" @tap.stop="handlePayment">立即支付</nut-button>
|
|
343
|
350
|
|
|
344
|
|
- </div>
|
|
345
|
|
- <div class="flex justify-end gap-2 p-3"
|
|
346
|
|
- v-if="detail.status == 0 || detail.type == 0"
|
|
347
|
|
- >
|
|
348
|
|
- <nut-button size="small" type="primary" plain
|
|
349
|
|
- @tap.stop="handleRemindTheDelivery">提醒发货</nut-button>
|
|
|
351
|
+ </div>
|
|
|
352
|
+ <div class="flex justify-end gap-2 p-3" v-if="detail.status == 0 || detail.type == 0">
|
|
|
353
|
+ <nut-button size="small" type="primary" plain @tap.stop="handleRemindTheDelivery">提醒发货</nut-button>
|
|
350
|
354
|
|
|
351
|
|
- </div>
|
|
352
|
|
- <div class="flex justify-end gap-2 p-3" v-if="detail.status == 1 || detail.type == 1">
|
|
353
|
|
- <nut-button size="small" plain type="default" @tap.stop="handleShowLogistics">查看物流</nut-button>
|
|
|
355
|
+ </div>
|
|
|
356
|
+ <div class="flex justify-end gap-2 p-3" v-if="detail.status == 1 || detail.type == 1">
|
|
|
357
|
+ <nut-button size="small" plain type="default" @tap.stop="handleShowLogistics">查看物流</nut-button>
|
|
354
|
358
|
|
|
355
|
|
- <nut-button size="small" plain type="primary" @tap.stop="handleTakeOrder">确认收货</nut-button>
|
|
|
359
|
+ <nut-button size="small" plain type="primary" @tap.stop="handleTakeOrder">确认收货</nut-button>
|
|
356
|
360
|
|
|
357
|
|
- </div>
|
|
|
361
|
+ </div>
|
|
358
|
362
|
|
|
359
|
|
- <div class="flex justify-end gap-2 p-3" v-if="detail.status == 2 || detail.type == 2">
|
|
360
|
|
- <nut-button size="small" plain type="primary" @tap.stop="handleComment">去评价</nut-button>
|
|
|
363
|
+ <div class="flex justify-end gap-2 p-3" v-if="detail.status == 2 || detail.type == 2">
|
|
|
364
|
+ <nut-button size="small" plain type="primary" @tap.stop="handleComment">去评价</nut-button>
|
|
361
|
365
|
|
|
362
|
|
- </div>
|
|
363
|
366
|
</div>
|
|
|
367
|
+ </div>
|
|
364
|
368
|
</template>
|
|
365
|
369
|
|
|
366
|
370
|
<route lang="yaml">
|