|
@@ -9,13 +9,89 @@
|
|
|
</route>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
+import { getConfigByCode } from '@/api/common'
|
|
|
+import { orderDetail, orderPink, orderStatusEnum } from '@/api/order'
|
|
|
+import { formatNumber } from '@/utils'
|
|
|
+import { getPageParams } from '@/utils/page'
|
|
|
+
|
|
|
defineOptions({
|
|
|
name: 'OrderDetail', // 订单详情
|
|
|
})
|
|
|
+// z-paging
|
|
|
+const paging = ref(null)
|
|
|
+
|
|
|
+const id = ref<any>()
|
|
|
+const detail = ref<any>({})
|
|
|
+const orderStatusEnumData = ref<any>([])
|
|
|
+const openRedEnvelopeRate = ref<any>()
|
|
|
+const joinRedEnvelopeRate = ref<any>()
|
|
|
+async function getConfig(code: string) {
|
|
|
+ try {
|
|
|
+ const res = await getConfigByCode({ code })
|
|
|
+ if (res.code === '200') {
|
|
|
+ switch (code) {
|
|
|
+ case 'open_red_envelope_rate':
|
|
|
+ openRedEnvelopeRate.value = res.data.valueInfo
|
|
|
+ break
|
|
|
+ case 'join_red_envelope_rate':
|
|
|
+ joinRedEnvelopeRate.value = res.data.valueInfo
|
|
|
+ break
|
|
|
+ default:
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ catch {
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+async function getOrderStatus() {
|
|
|
+ try {
|
|
|
+ const res = await orderStatusEnum({ id: 1 })
|
|
|
+ if (res.code === '200') {
|
|
|
+ orderStatusEnumData.value = res.data
|
|
|
+ }
|
|
|
+ }
|
|
|
+ catch {
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+async function getDetail() {
|
|
|
+ getPink()
|
|
|
+ try {
|
|
|
+ const res = await orderDetail({ id: id.value })
|
|
|
+ if (res.code === '200') {
|
|
|
+ detail.value = res.data
|
|
|
+ paging.value.complete()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ catch {}
|
|
|
+}
|
|
|
+const pinkList = ref<any>([])
|
|
|
+async function getPink() {
|
|
|
+ try {
|
|
|
+ const res = await orderPink({ id: id.value })
|
|
|
+ if (res.code === '200') {
|
|
|
+ pinkList.value = res.data
|
|
|
+ }
|
|
|
+ }
|
|
|
+ catch {
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+onLoad(async (options) => {
|
|
|
+ const params = getPageParams(options)
|
|
|
+ id.value = params.id
|
|
|
+ await getOrderStatus()
|
|
|
+})
|
|
|
+onShow(() => {
|
|
|
+ getDetail()
|
|
|
+})
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <z-paging>
|
|
|
+ <z-paging ref="paging" refresher-only @refresh="getDetail">
|
|
|
<view class="pt-20rpx">
|
|
|
<!-- 状态显示 -->
|
|
|
<view class="mb-20rpx bg-#17AA68/80 py-20rpx text-center text-28rpx text-white">
|
|
@@ -34,56 +110,63 @@ defineOptions({
|
|
|
<!-- 地址 -->
|
|
|
<view class="mb-20rpx bg-white px-24rpx py-20rpx">
|
|
|
<!-- 无地址 -->
|
|
|
- <!-- <view class="flex items-center justify-between">
|
|
|
- <view class="text-28rpx text-[var(--wot-color-theme)]">
|
|
|
- Please provide your shipping address
|
|
|
- </view>
|
|
|
- <wd-icon name="arrow-right" color="#7D7D7D" size="28rpx" />
|
|
|
- </view> -->
|
|
|
+ <template v-if="!detail.orderAddressVO">
|
|
|
+ <view class="flex items-center justify-between">
|
|
|
+ <view class="text-28rpx text-[var(--wot-color-theme)]">
|
|
|
+ Please provide your shipping address
|
|
|
+ </view>
|
|
|
+ <wd-icon name="arrow-right" color="#7D7D7D" size="28rpx" />
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
<!-- 有地址 -->
|
|
|
- <view class="mb-18rpx flex justify-between border-b-1 border-b-#E1E1E1 border-b-solid pb-18rpx text-24rpx">
|
|
|
- <!-- 物流信息 -->
|
|
|
- <view>Delivery Partner</view>
|
|
|
- <view> DHL:DH47056JBM693B</view>
|
|
|
- </view>
|
|
|
- <view class="mb-20rpx text-24rpx">
|
|
|
- <text class="mr-20rpx">
|
|
|
- Aamir Khan
|
|
|
- </text>
|
|
|
- <text>0642251008</text>
|
|
|
- </view>
|
|
|
- <view class="text-22rpx text-#3A444C">
|
|
|
- 55/66 The Bliss Koolpunt Vlile 16, P3QM+RW8, San Kamphaeng, San Kamphaeng District, Chiang Mai 50130
|
|
|
- </view>
|
|
|
+ <template v-else>
|
|
|
+ <view class="mb-18rpx flex justify-between border-b-1 border-b-#E1E1E1 border-b-solid pb-18rpx text-24rpx">
|
|
|
+ <!-- 物流信息 -->
|
|
|
+ <view>{{ detail.deliveryName }}</view>
|
|
|
+ <view> DHL:{{ detail.deliveryCode || '-' }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="mb-20rpx text-24rpx">
|
|
|
+ <text class="mr-20rpx">
|
|
|
+ {{ detail?.orderAddressVO?.realName }}
|
|
|
+ </text>
|
|
|
+ <text>{{ detail?.orderAddressVO?.phone }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="text-22rpx text-#3A444C">
|
|
|
+ {{ detail?.orderAddressVO?.province }} {{ detail?.orderAddressVO?.city }} {{ detail?.orderAddressVO?.district }} {{ detail?.orderAddressVO?.detail }} {{ detail?.orderAddressVO?.postCode }}
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
</view>
|
|
|
<!-- 商品信息 -->
|
|
|
<wd-card type="rectangle" custom-class="px-24rpx! py-6rpx!" custom-content-class="py-18rpx!" custom-title-class="py-18rpx!">
|
|
|
<template #title>
|
|
|
<view class="flex items-center justify-between">
|
|
|
<view class="text-28rpx text-#000">
|
|
|
- Order ID:20250505123030120
|
|
|
+ Order ID:{{ detail?.orderInfoVO?.[0].orderNo }}
|
|
|
</view>
|
|
|
- <wd-text size="26rpx" type="primary" text="To Ship" />
|
|
|
+ <wd-text size="26rpx" type="primary" :text="orderStatusEnumData.find((i:any) => i.code === detail?.status)?.name" />
|
|
|
</view>
|
|
|
</template>
|
|
|
<view class="flex items-center gap-24rpx">
|
|
|
- <image
|
|
|
- src="/static/images/avatar.jpg"
|
|
|
- class="h-140rpx w-140rpx shrink-0"
|
|
|
- />
|
|
|
+ <view class="h-140rpx w-140rpx shrink-0">
|
|
|
+ <image
|
|
|
+ :src="detail?.orderInfoVO?.[0]?.image"
|
|
|
+ class="w-full"
|
|
|
+ mode="widthFix"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
<view class="flex-1">
|
|
|
<view class="line-clamp-2 text-28rpx text-#000">
|
|
|
- SUCGLES for iPhone 14 Plus Case with MagSafe [Ultra Strong Magnetic]
|
|
|
+ {{ detail?.orderInfoVO?.[0].productName }}
|
|
|
</view>
|
|
|
<view class="py-4rpx text-24rpx text-#3A444C">
|
|
|
- Color:Black Grey
|
|
|
+ Color:{{ detail?.orderInfoVO?.[0].sku }}
|
|
|
</view>
|
|
|
<view class="flex items-center justify-between text-24rpx">
|
|
|
<view class="text-[var(--wot-color-theme)]">
|
|
|
- ৳ 300
|
|
|
+ ৳ {{ formatNumber(detail?.orderInfoVO?.[0].price) }}
|
|
|
</view>
|
|
|
<view class="text-#3A444C">
|
|
|
- Quantity:1
|
|
|
+ Quantity:{{ detail?.orderInfoVO?.[0].payNum }}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -98,7 +181,7 @@ defineOptions({
|
|
|
<view class="flex flex-col gap-16rpx text-#3A444C">
|
|
|
<view class="flex items-center justify-between text-24rpx">
|
|
|
<text>SubTotal</text>
|
|
|
- <text>৳1,000.00</text>
|
|
|
+ <text>৳{{ formatNumber(detail.totalPrice) }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -109,7 +192,7 @@ defineOptions({
|
|
|
<view class="flex flex-col gap-16rpx text-#3A444C">
|
|
|
<view class="flex items-center justify-between text-24rpx">
|
|
|
<text>SubTotal</text>
|
|
|
- <text>৳1,000.00</text>
|
|
|
+ <text>৳{{ formatNumber(detail.payPrice) }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -117,7 +200,7 @@ defineOptions({
|
|
|
<view class="flex flex-col gap-16rpx text-#3A444C">
|
|
|
<view class="flex items-center justify-between text-24rpx">
|
|
|
<text>Placed on</text>
|
|
|
- <text>2025/05/05 12:30:30</text>
|
|
|
+ <text>{{ detail.createTime }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|