Skip to content

Commit 4fddbcc

Browse files
YunaiVYunaiV
committed
trade：完善订单详情
1 parent 588ce1c commit 4fddbcc

File tree

7 files changed

+126
-72
lines changed

7 files changed

+126
-72
lines changed

‎src/api/mall/trade/order/index.ts

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -41,15 +41,22 @@ export interface OrderVO {
4141
refundPrice?: number | null // 退款金额
4242
couponId?: number | null // 优惠劵编号
4343
couponPrice?: number | null // 优惠劵减免金额
44+
vipPrice?: number | null // VIP 减免金额
4445
pointPrice?: number | null // 积分抵扣的金额
4546
receiverAreaName?: string //收件人地区名字
4647
items?: OrderItemRespVO[] // 订单项列表
47-
// 用户信息
48+
// 下单用户信息
4849
user?: {
4950
id?: number | null
5051
nickname?: string
5152
avatar?: string
5253
}
54+
// 推广用户信息
55+
brokerageUser?: {
56+
id?: number | null
57+
nickname?: string
58+
avatar?: string
59+
}
5360
// 订单操作日志
5461
logs?: OrderLogRespVO[]
5562
}
@@ -114,21 +121,21 @@ export interface DeliveryVO {
114121
}
115122

116123
// 订单发货
117-
export const delivery = async (data: DeliveryVO) => {
124+
export const deliveryOrder = async (data: DeliveryVO) => {
118125
return await request.put({ url: `/trade/order/delivery`, data })
119126
}
120127

121128
// 订单备注
122-
export const updateRemark = async (data: any) => {
129+
export const updateOrderRemark = async (data: any) => {
123130
return await request.put({ url: `/trade/order/update-remark`, data })
124131
}
125132

126133
// 订单调价
127-
export const updatePrice = async (data: any) => {
134+
export const updateOrderPrice = async (data: any) => {
128135
return await request.put({ url: `/trade/order/update-price`, data })
129136
}
130137

131138
// 修改订单地址
132-
export const updateAddress = async (data: any) => {
139+
export const updateOrderAddress = async (data: any) => {
133140
return await request.put({ url: `/trade/order/update-address`, data })
134141
}

‎src/utils/constants.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -375,3 +375,17 @@ export const BrokerageWithdrawTypeEnum = {
375375
name: '支付宝'
376376
}
377377
}
378+
379+
/**
380+
* 配送方式枚举
381+
*/
382+
export const DeliveryTypeEnum = {
383+
EXPRESS: {
384+
type: 1,
385+
name: '快递发货'
386+
},
387+
PICK_UP: {
388+
type: 2,
389+
name: '到店自提'
390+
}
391+
}

‎src/views/mall/trade/order/detail/index.vue

Lines changed: 95 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -3,35 +3,21 @@
33
<!-- 订单信息 -->
44
<el-descriptions title="订单信息">
55
<el-descriptions-item label="订单号: ">{{ formData.no }}</el-descriptions-item>
6-
<el-descriptions-item label="配送方式: ">
7-
<dict-tag :type="DICT_TYPE.TRADE_DELIVERY_TYPE" :value="formData.deliveryType!" />
8-
</el-descriptions-item>
9-
<!-- TODO 营销活动待实现 -->
10-
<el-descriptions-item label="营销活动: ">秒杀活动</el-descriptions-item>
6+
<el-descriptions-item label="买家: ">{{ formData?.user?.nickname }}</el-descriptions-item>
117
<el-descriptions-item label="订单类型: ">
128
<dict-tag :type="DICT_TYPE.TRADE_ORDER_TYPE" :value="formData.type!" />
139
</el-descriptions-item>
14-
<el-descriptions-item label="收货人: ">{{ formData.receiverName }}</el-descriptions-item>
15-
<el-descriptions-item label="买家留言: ">{{ formData.userRemark }}</el-descriptions-item>
1610
<el-descriptions-item label="订单来源: ">
1711
<dict-tag :type="DICT_TYPE.TERMINAL" :value="formData.terminal!" />
1812
</el-descriptions-item>
19-
<el-descriptions-item label="联系电话: ">{{ formData.receiverMobile }}</el-descriptions-item>
13+
<el-descriptions-item label="买家留言: ">{{ formData.userRemark }}</el-descriptions-item>
2014
<el-descriptions-item label="商家备注: ">{{ formData.remark }}</el-descriptions-item>
2115
<el-descriptions-item label="支付单号: ">{{ formData.payOrderId }}</el-descriptions-item>
2216
<el-descriptions-item label="付款方式: ">
2317
<dict-tag :type="DICT_TYPE.PAY_CHANNEL_CODE" :value="formData.payChannelCode!" />
2418
</el-descriptions-item>
25-
<!-- <el-descriptions-item label="买家: ">{{ formData.user.nickname }}</el-descriptions-item> -->
26-
<!-- TODO @puhui999：待实现：跳转会员 -->
27-
<el-descriptions-item label="收货地址: ">
28-
{{ formData.receiverAreaName }} {{ formData.receiverDetailAddress }}
29-
<el-link
30-
v-clipboard:copy="formData.receiverAreaName + ' ' + formData.receiverDetailAddress"
31-
v-clipboard:success="clipboardSuccess"
32-
icon="ep:document-copy"
33-
type="primary"
34-
/>
19+
<el-descriptions-item label="推广用户: " v-if="formData.brokerageUser">
20+
{{ formData.brokerageUser?.nickname }}
3521
</el-descriptions-item>
3622
</el-descriptions>
3723

@@ -45,10 +31,18 @@
4531
调整价格
4632
</el-button>
4733
<el-button type="primary" @click="remark">备注</el-button>
48-
<el-button v-if="formData.status! === 10" type="primary" @click="delivery">
34+
<el-button
35+
v-if="formData.status! === 10 && formData.deliveryType === DeliveryTypeEnum.EXPRESS.type"
36+
type="primary"
37+
@click="delivery"
38+
>
4939
发货
5040
</el-button>
51-
<el-button v-if="formData.status! === 10" type="primary" @click="updateAddress">
41+
<el-button
42+
v-if="formData.status! === 10 && formData.deliveryType === DeliveryTypeEnum.EXPRESS.type"
43+
type="primary"
44+
@click="updateAddress"
45+
>
5246
修改地址
5347
</el-button>
5448
</el-descriptions-item>
@@ -95,64 +89,91 @@
9589
</el-row>
9690
</el-descriptions-item>
9791
</el-descriptions>
98-
<el-descriptions :column="6">
92+
<el-descriptions :column="4">
93+
<!-- 第一层 -->
9994
<el-descriptions-item label="商品总额: ">
100-
{{ fenToYuan(formData.totalPrice!) }}元
95+
{{ fenToYuan(formData.totalPrice!) }} 元
10196
</el-descriptions-item>
10297
<el-descriptions-item label="运费金额: ">
103-
{{ fenToYuan(formData.deliveryPrice!) }}元
98+
{{ fenToYuan(formData.deliveryPrice!) }} 元
10499
</el-descriptions-item>
105100
<el-descriptions-item label="订单调价: ">
106-
{{ fenToYuan(formData.adjustPrice!) }}元
101+
{{ fenToYuan(formData.adjustPrice!) }} 元
107102
</el-descriptions-item>
108-
103+
<el-descriptions-item v-for="item in 1" :key="item" label-class-name="no-colon" />
104+
<!-- 第二层 -->
109105
<el-descriptions-item>
110-
<template #label><span style="color: red">商品优惠: </span></template>
111-
{{ fenToYuan(formData.couponPrice!) }}元
106+
<template #label><span style="color: red">优惠劵优惠: </span></template>
107+
{{ fenToYuan(formData.couponPrice!) }} 元
112108
</el-descriptions-item>
113109
<el-descriptions-item>
114-
<template #label><span style="color: red">订单优惠: </span></template>
115-
{{ fenToYuan(formData.discountPrice!) }}元
110+
<template #label><span style="color: red">VIP 优惠: </span></template>
111+
{{ fenToYuan(formData.vipPrice!) }} 元
112+
</el-descriptions-item>
113+
<el-descriptions-item>
114+
<template #label><span style="color: red">活动优惠: </span></template>
115+
{{ fenToYuan(formData.discountPrice!) }} 元
116116
</el-descriptions-item>
117117
<el-descriptions-item>
118118
<template #label><span style="color: red">积分抵扣: </span></template>
119-
{{ fenToYuan(formData.pointPrice!) }}元
119+
{{ fenToYuan(formData.pointPrice!) }} 元
120120
</el-descriptions-item>
121-
122-
<el-descriptions-item v-for="item in 5" :key="item" label-class-name="no-colon" />
123-
<!-- 占位 -->
121+
<!-- 第三层 -->
122+
<el-descriptions-item v-for="item in 3" :key="item" label-class-name="no-colon" />
124123
<el-descriptions-item label="应付金额: ">
125-
{{ fenToYuan(formData.payPrice!) }}元
124+
{{ fenToYuan(formData.payPrice!) }} 元
126125
</el-descriptions-item>
127126
</el-descriptions>
128127

129-
<!-- TODO 芋艿：需要改改 -->
130-
<el-descriptions :column="4" title="物流信息">
131-
<el-descriptions-item label="物流公司: ">
132-
{{ deliveryExpressList.find((item) => item.id === formData.logisticsId)?.name }}
133-
</el-descriptions-item>
134-
<el-descriptions-item label="运单号: ">{{ formData.logisticsNo }}</el-descriptions-item>
135-
<el-descriptions-item label="发货时间: ">
136-
{{ formatDate(formData.deliveryTime!) }}
137-
</el-descriptions-item>
138-
<el-descriptions-item label="物流状态: ">
139-
<!-- TODO 物流状态怎么获取？ -->
140-
<dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="formData.deliveryStatus!" />
141-
</el-descriptions-item>
142-
<!-- 占位 4 -->
143-
<el-descriptions-item v-for="item in 4" :key="item" label-class-name="no-colon" />
144-
<el-descriptions-item label="物流详情: ">
145-
<el-timeline>
146-
<el-timeline-item
147-
v-for="(express, index) in expressTrackList"
148-
:key="index"
149-
:timestamp="formatDate(express.time)"
150-
>
151-
{{ express.content }}
152-
</el-timeline-item>
153-
</el-timeline>
128+
<!-- 物流信息 -->
129+
<el-descriptions :column="4" title="收货信息">
130+
<el-descriptions-item label="配送方式: ">
131+
<dict-tag :type="DICT_TYPE.TRADE_DELIVERY_TYPE" :value="formData.deliveryType!" />
154132
</el-descriptions-item>
133+
<el-descriptions-item label="收货人: ">{{ formData.receiverName }}</el-descriptions-item>
134+
<el-descriptions-item label="联系电话: ">{{ formData.receiverMobile }}</el-descriptions-item>
135+
<!-- 快递配送 -->
136+
<div v-if="formData.deliveryType === DeliveryTypeEnum.EXPRESS.type">
137+
<el-descriptions-item label="收货地址: " v-if="formData.receiverDetailAddress">
138+
{{ formData.receiverAreaName }} {{ formData.receiverDetailAddress }}
139+
<el-link
140+
v-clipboard:copy="formData.receiverAreaName + ' ' + formData.receiverDetailAddress"
141+
v-clipboard:success="clipboardSuccess"
142+
icon="ep:document-copy"
143+
type="primary"
144+
/>
145+
</el-descriptions-item>
146+
<el-descriptions-item label="物流公司: " v-if="formData.logisticsId">
147+
{{ deliveryExpressList.find((item) => item.id === formData.logisticsId)?.name }}
148+
</el-descriptions-item>
149+
<el-descriptions-item label="运单号: " v-if="formData.logisticsId">
150+
{{ formData.logisticsNo }}
151+
</el-descriptions-item>
152+
<el-descriptions-item label="发货时间: " v-if="formatDate.deliveryTime">
153+
{{ formatDate(formData.deliveryTime) }}
154+
</el-descriptions-item>
155+
<el-descriptions-item v-for="item in 2" :key="item" label-class-name="no-colon" />
156+
<el-descriptions-item label="物流详情: " v-if="expressTrackList.length > 0">
157+
<el-timeline>
158+
<el-timeline-item
159+
v-for="(express, index) in expressTrackList"
160+
:key="index"
161+
:timestamp="formatDate(express.time)"
162+
>
163+
{{ express.content }}
164+
</el-timeline-item>
165+
</el-timeline>
166+
</el-descriptions-item>
167+
</div>
168+
<!-- 自提门店 -->
169+
<div v-if="formData.deliveryType === DeliveryTypeEnum.PICK_UP.type">
170+
<el-descriptions-item label="自提门店: " v-if="formData.pickUpStoreId">
171+
{{ pickUpStore.name }}
172+
</el-descriptions-item>
173+
</div>
155174
</el-descriptions>
175+
176+
<!-- 订单日志 -->
156177
<el-descriptions title="订单操作日志">
157178
<el-descriptions-item labelClassName="no-colon">
158179
<el-timeline>
@@ -196,6 +217,8 @@ import OrderUpdateAddressForm from '@/views/mall/trade/order/form/OrderUpdateAdd
196217
import OrderUpdatePriceForm from '@/views/mall/trade/order/form/OrderUpdatePriceForm.vue'
197218
import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
198219
import { useTagsViewStore } from '@/store/modules/tagsView'
220+
import { DeliveryTypeEnum } from '@/utils/constants'
221+
import * as DeliveryPickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore'
199222
200223
defineOptions({ name: 'TradeOrderDetail' })
201224
@@ -271,10 +294,20 @@ const clipboardSuccess = () => {
271294
/** 初始化 **/
272295
const deliveryExpressList = ref([]) // 物流公司
273296
const expressTrackList = ref([]) // 物流详情
297+
const pickUpStore = ref({}) // 自提门店
274298
onMounted(async () => {
275299
await getDetail()
276-
deliveryExpressList.value = await DeliveryExpressApi.getSimpleDeliveryExpressList()
277-
expressTrackList.value = await TradeOrderApi.getExpressTrackList(formData.value.id!)
300+
// 如果配送方式为快递，则查询物流公司
301+
if (formData.value.deliveryType === DeliveryTypeEnum.EXPRESS.type) {
302+
deliveryExpressList.value = await DeliveryExpressApi.getSimpleDeliveryExpressList()
303+
if (form.value.logisticsId) {
304+
expressTrackList.value = await TradeOrderApi.getExpressTrackList(formData.value.id!)
305+
}
306+
} else if (formData.value.deliveryType === DeliveryTypeEnum.PICK_UP.type) {
307+
pickUpStore.value = await DeliveryPickUpStoreApi.getDeliveryPickUpStore(
308+
formData.value.pickUpStoreId
309+
)
310+
}
278311
})
279312
</script>
280313
<style lang="scss" scoped>
@@ -312,7 +345,7 @@ onMounted(async () => {
312345
313346
// 时间线样式调整
314347
:deep(.el-timeline) {
315-
margin: 10px 0px 0px 160px;
348+
margin: 10px 0 0 160px;
316349
317350
.el-timeline-item__wrapper {
318351
position: relative;

‎src/views/mall/trade/order/form/OrderDeliveryForm.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ const open = async (row: TradeOrderApi.OrderVO) => {
5454
resetForm()
5555
// 设置数据
5656
copyValueToTarget(formData.value, row)
57-
if (row.logisticsId === null || row.logisticsId === 0) {
57+
if (row.logisticsId === 0) {
5858
expressType.value = 'none'
5959
}
6060
dialogVisible.value = true
@@ -73,7 +73,7 @@ const submitForm = async () => {
7373
data.logisticsId = 0
7474
data.logisticsNo = ''
7575
}
76-
await TradeOrderApi.delivery(data)
76+
await TradeOrderApi.deliveryOrder(data)
7777
message.success(t('common.updateSuccess'))
7878
dialogVisible.value = false
7979
// 发送操作成功的事件

‎src/views/mall/trade/order/form/OrderUpdateAddressForm.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ const submitForm = async () => {
6969
formLoading.value = true
7070
try {
7171
const data = unref(formData)
72-
await TradeOrderApi.updateAddress(data)
72+
await TradeOrderApi.updateOrderAddress(data)
7373
message.success(t('common.updateSuccess'))
7474
dialogVisible.value = false
7575
// 发送操作成功的事件

‎src/views/mall/trade/order/form/OrderUpdatePriceForm.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ const submitForm = async () => {
6969
data.adjustPrice = convertToInteger(data.adjustPrice)
7070
delete data.payPrice
7171
delete data.newPayPrice
72-
await TradeOrderApi.updatePrice(data)
72+
await TradeOrderApi.updateOrderPrice(data)
7373
message.success(t('common.updateSuccess'))
7474
dialogVisible.value = false
7575
// 发送操作成功的事件

‎src/views/mall/trade/order/form/OrderUpdateRemarkForm.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ const submitForm = async () => {
4949
formLoading.value = true
5050
try {
5151
const data = unref(formData)
52-
await TradeOrderApi.updateRemark(data)
52+
await TradeOrderApi.updateOrderRemark(data)
5353
message.success(t('common.updateSuccess'))
5454
dialogVisible.value = false
5555
// 发送操作成功的事件

0 commit comments

Comments
 (0)