完善订单信息

src/bundle/group-buying/platform/order-detail.vue

@@ -8,35 +8,194 @@
 </route>
 
 <template>
-    <view class="">
+    <view class="pb-254rpx">
         <view>
             <navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
         </view>
 
         <view class="text-[#909399] text-26rpx leading-36rpx mx-102rpx mb-40rpx">
-            <text class="" v-if="orderType === OrderStatus.ToUse">请在2025.12.31(含)前使用</text>
+            <view class="" v-if="type === 'Direct'">
-            <text class="" v-if="orderType === OrderStatus.Finished">感谢购买，期待再次光临！</text>
+                <text v-if="orderType === OrderStatus.ToUse">请在2025.12.31(含)前使用</text>
-            <text class="" v-if="orderType === OrderStatus.AfterSaleApply">请耐心等待，我们会尽快处理您的请求</text>
+                <text v-if="orderType === OrderStatus.Used">感谢购买，期待再次光临！</text>
+            </view>
+            <view class="" v-if="type === 'Franchise'">
+                <text v-if="orderType === OrderStatus.ToUse">请在2025.12.31(含)前使用</text>
+                <text v-if="orderType === OrderStatus.Used">品一口香茗，让生活慢下来，从一杯好茶开始</text>
+                <view class="text-center mt-14rpx" v-if="orderType === OrderStatus.AfterSaleFinished">
+                    <view class="text-40rpx text-[#303133] leading-56rpx">退款成功￥128.00</view>
+                    <view class="text-28rpx text-[#606266] leading-40rpx mt-20rpx">谢谢您的信任，我们一定会做的更好</view>
+                    <view class="text-24rpx text-[#606266] leading-34rpx mt-12rpx">2025年4月13日  18:22</view>
+                </view>
+            </view>
+            <view class="" v-if="type === 'DouYin'">
+                <text v-if="orderType === OrderStatus.ToUse">请在2025.12.31(含)前使用</text>
+                <text v-if="orderType === OrderStatus.Used">品一口香茗，让生活慢下来，从一杯好茶开始</text>
+            </view>
         </view>
+
+        <!-- 套餐券 -->
         <view class="mx-30rpx">
-            <combo :type="'GroupBuying'" :order-type="orderType"></combo>
+            <combo-coupon :type="'Franchise'" :order-type="orderType"></combo-coupon>
+        </view>
+
+        <!-- 适用门店 -->
+        <view class="bg-white rounded-16rpx px-30rpx pb-32rpx mx-30rpx mt-20rpx">
+            <view class="pt-32rpx text-[#303133] text-32rpx leading-44rpx">适用门店</view>
+            <view class="mt-26rpx flex items-center">
+                <view class="mr-24rpx">
+                    <wd-img width="170rpx" height="170rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
+                </view>
+                <view class="flex-1 flex justify-between items-center relative">
+                    <view class="">
+                        <view class="text-[#303133] text-30rpx leading-40rpx line-2">这是商家的名称这是</view>
+                        <view class="mt-26rpx text-[#909399] text-24rpx leading-34rpx">距您9km</view>
+                        <view class="flex items-center mt-14rpx">
+                            <view class="mr-8rpx">
+                                <wd-img width="28rpx" height="28rpx" :src="`${OSS}icon/icon_location.png`"/>
+                            </view>
+                            <view class="ml-2rpx text-26rpx text-[#606266] line-1 w-300rpx">青浦区仓路478号青浦区仓路478号青浦区仓路478号青浦区仓路478号青浦区仓路478号青浦区仓路478号</view>
+                        </view>
+                    </view>
+                    <view class="flex absolute top-1/2 right-0 -translate-y-1/2">
+                        <view class="text-center mr-20rpx" @click="orderDetail.handleLocation">
+                            <wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_nav.png`"/>
+                        </view>
+                        <view class="text-center" @click="orderDetail.handleCallPhone">
+                            <wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_phone.png`"/>
+                        </view>
+                    </view>
+                </view>
+            </view>
+        </view>
+
+        <!-- 订单信息 -->
+        <view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx">
+            <view class="text-[#303133] text-32rpx leading-44rpx">订单信息</view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>订单编号</view>
+                <view>
+                    <text>7327328627526903</text>
+                    <wd-divider vertical />
+                    <text class="text-[#4C9F44]">复制</text>
+                </view>
+            </view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>交易方式</view>
+                <view>微信支付</view>
+            </view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>创建时间</view>
+                <view>2019-05-16 12:20:26</view>
+            </view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>付款时间</view>
+                <view>2019-05-16 13:20:26</view>
+            </view>
+        </view>
+
+        <!-- 售后订单 -->
+        <view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" v-if="orderType === OrderStatus.AfterSaleFinished">
+            <view class="text-[#303133] text-32rpx leading-44rpx">售后订单</view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>售后原因</view>
+                <view>买多了/买错了</view>
+            </view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>退款金额</view>
+                <view>￥159.22</view>
+            </view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>申请时间</view>
+                <view>2019-05-16 13:20:26</view>
+            </view>
+            <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
+                <view>退款编号</view>
+                <view>
+                    <text>7327328627526903</text>
+                    <wd-divider vertical />
+                    <text class="text-[#4C9F44]">复制</text>
+                </view>
+            </view>
+        </view>
+
+        <!-- 操作按钮 -->
+        <view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx" v-if="type !== 'Franchise' && orderType !== OrderStatus.Used">
+            <!-- 平台团购直营店 -->
+            <view class="mt-34rpx" v-if="type === 'Direct'">
+                <!-- 待使用 -->
+                <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderType === OrderStatus.ToUse">
+                    <view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx">申请退款</view>
+                    <view class="w-330rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">立即预定</view>
+                </view>
+
+                <!-- 已使用 -->
+                <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderType === OrderStatus.Used">
+                    <view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">再次预定</view>
+                </view>
+            </view>
+
+            <!-- 平台团购加盟店 -->
+            <view class="" v-if="type === 'Franchise'">
+                <!-- 待使用 -->
+                <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderType === OrderStatus.ToUse">
+                    <view class="w-630rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#fff]">申请退款</view>
+                </view>
+
+                <!-- 已退款 -->
+                <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderType === OrderStatus.AfterSaleFinished">
+                    <view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx">联系商家</view>
+                    <view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx">联系平台</view>
+                </view>
+            </view>
+
+            <!-- 抖音团购 -->
+            <view class="" v-if="type === 'DouYin'">
+                <!-- 待使用 -->
+                <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderType === OrderStatus.ToUse">
+                    <view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">立即预定</view>
+                </view>
+            </view>
         </view>
     </view>
 </template>
 
 <script lang="ts" setup>
-    import Combo from '@/components/order/Combo.vue'
+    import ComboCoupon from '@/components/order/ComboCoupon.vue'
     import { OrderStatus, OrderStatusText } from '@/utils/order'
+    import {toast} from '@/utils/toast'
+
+	const OSS = inject('OSS')
 
     const title = ref<string>('')
     const type = ref<string>('') // 订单类型：团购、抖音等
     const orderType = ref<string>('') // 订单状态：待使用、退款等
 
     onLoad((args) => {
-        title.value = OrderStatusText[args.orderType]
+        if ((args.type === 'Direct' || args.type === 'Franchise') && args.orderType === OrderStatus.Used) {
+            title.value = '交易完成'
+        } else {
+            title.value = OrderStatusText[args.orderType]
+        }
+
         type.value = args.type
         orderType.value = args.orderType
     })
+
+    const orderDetail = {
+        // 处理导航逻辑
+        handleLocation: () => {
+            toast.info('正在导航...')
+            // 可以使用uni.navigateTo或其他方式打开地图应用
+            uni.navigateTo({
+                url: '/pages/map/map' // 假设有一个地图页面
+            })
+        },
+
+        // 处理拨打电话逻辑
+        handleCallPhone: () => {
+     
+        },
+    }
 </script>
 
 

src/bundle/group-buying/platform/order-list.vue

@@ -72,13 +72,14 @@
         }
     ])
 
+    // 店铺类型
+
     // 搜索
     const keywords = ref<string>('')
 
     // tab
     const tab = ref<number>(0)
 
-
     const orderList = {
         // 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
 		upCallback: (mescroll) => {

src/bundle/reserve-room/room.vue

@@ -256,7 +256,6 @@
                     value: 15005837859  
                 }
             ]
-     
         },
 
         // tab切换获取index

src/components/order/Combo.vue

@@ -1,88 +0,0 @@
-<template>
-    <view>
-        <view class="bg-white rounded-16rpx p-30rpx" v-if="orderType === OrderStatus.ToUse">
-            <view class="">
-                <view class="flex items-center" @click="combo.handleToStore">
-                    <view class="w-190rpx h-190rpx mr-30rpx">
-                        <wd-img width="100%" height="100%" :src="`${OSS}images/home/home_image5.png`"></wd-img>
-                    </view>
-                    <view class="flex-1">
-                        <view class="flex justify-between items-center" @click="combo.handleToStore">
-                            <view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-400rpx line-1">团购套餐的可以点击跳转 </view>
-                            <wd-icon name="chevron-right" size="32rpx" v-if="type === 'GroupBuying'"></wd-icon>
-                            <view class="text-26rpx leading-36rpx text-[#909399]" v-if="type === 'DouYin'">￥324</view>
-                        </view>
-                        <view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
-                            <view class="">3小时</view>
-                            <view v-if="type === 'GroupBuying'">x1</view>
-                        </view>
-                        <view class="text-[#606266] text-right mt-26rpx" v-if="type === 'GroupBuying'">
-                            <text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
-                            <text class="tetx-32rpx leading-36rpx">￥29.32</text>
-                            <wd-icon name="chevron-right" size="32rpx"></wd-icon>
-                        </view>
-                        <view class="font-400 text-26rpx text-[#606266] leading-40rpx mt-40rpx" v-if="type === 'DouYin'">
-                            适用包间：青茶、红茶、绿茶
-                        </view>
-                    </view>
-                </view>
-
-                <view class="mt-30rpx font-500 leading-48rpx" v-if="type === 'GroupBuying'">
-                    <view class="text-26rpx text-[#606266]">有效期：2025.04.04-2025.12.31</view>
-                    <view class="text-28rpx text-[#303133] mt-18rpx">
-                        <text class="mr-20rpx">券码 1052 4258 5654 125</text>
-                        <text class="text-[#4C9F44]">复制</text>
-                    </view>
-                </view>
-            </view>
-        </view>
-    </view>
-</template>
-
-<script lang="ts" setup name="Combo">
-    import { OrderStatus, OrderStatusText } from '@/utils/order'
-
-	/**
-	 * Combo 套餐组件
-	 * @description 订单详情页下的套餐卡片详情
-     */
-
-	const OSS = inject('OSS')
-
-	defineProps({
-        /**
-         * 订单类型：团购、抖音等
-        */
-        type: {
-            type: String,
-            default: ''
-        },
-        /**
-         * 订单类型：待使用、退款等
-        */
-        orderType: {
-            type: String,
-            default: ''
-        }
-    })
-
-    const combo = {
-        // 跳转到对饮茶室的详情页
-        handleToStore: () => {
-            uni.navigateTo({
-                url: '/pages/store/store-detail/store-detail'
-            })
-        },
-
-        // 跳转到团购订单详情页
-        handleToGroupBuyingDetail: () => {
-            uni.navigateTo({
-                url: `/bundle/group-buying/platform/order-detail?type=${OrderStatus.ToUse}`
-            })
-        }
-    }
-</script>
-
-<script lang="ts">
-    export default {}
-</script>

src/components/order/ComboCard.vue

@@ -1,7 +1,7 @@
 <template>
     <view class="">
         <!-- 团购和抖音团购 -->
-        <view v-if="type === 'GroupBuying'" class="bg-white rounded-10rpx p-30rpx">
+        <view v-if="type === 'Direct' || type === 'Franchise' || type === 'DouYin'" class="bg-white rounded-10rpx p-30rpx">
             <view class="flex justify-between items-center">
                 <view class="flex items-center">
                     <view class="w-40rpx h-40rpx mr-10rpx">
@@ -13,9 +13,9 @@
                     </view>
                 </view>
                 <view class="font-400 text-28rpx leading-40rpx mt-12rpx">
-                    <text class="text-[#4C9F44]">待使用</text>
+                    <text class="text-[#4C9F44]" v-if="orderType === OrderStatus.ToUse">待使用</text>
-                    <!-- <text class="text-[#606266]">已使用</text>
+                    <text class="text-[#606266]" v-if="orderType === OrderStatus.Used">已使用</text>
-                    <text class="text-[#C9C9C9]">已退款</text> -->
+                    <text class="text-[#C9C9C9]" v-if="orderType === OrderStatus.AfterSaleFinished">已退款</text>
                 </view>
             </view>
             <view class="mt-22rpx">
@@ -24,7 +24,7 @@
                         <wd-img width="100%" height="100%" :src="`${OSS}images/home/home_image5.png`"></wd-img>
                     </view>
                     <view class="flex-1">
-                        <view @click="comboCard.handleToGroupBuyingDetail">
+                        <view @click="comboCard.handleToOrderDetail">
                             <view class="font-500 text-30rpx text-[#303133] leading-42rpx line-1 w-400rpx">这是套餐的名字这是套餐的名字这是套餐的名字这是套餐的名字这是套餐的名字</view>
                             <view>
                                 <wd-tag bg-color="#F3F3F3" color="#606266" custom-class="!px-16rpx">3小时</wd-tag>
@@ -37,9 +37,9 @@
                         </view>
        
                         <!-- TODO 直营店有申请退款和立即预定按钮，加盟店只有申请退款按钮，抖音只有立即预定按钮 -->
-                        <view class="text-center flex items-center text-28rpx mt-28rpx" v-if="type === 'GroupBuying' ? 'justify-start' : 'justify-end'">
+                        <view class="text-center flex items-center text-28rpx mt-28rpx" v-if="type === 'Direct' ? 'justify-start' : 'justify-end'">
-                            <view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx">申请退款</view>
+                            <view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx" v-if="type === 'Direct' || type === 'Franchise'">申请退款</view>
-                            <view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#4C9F44] text-[#4C9F44]">立即预定</view>
+                            <view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#4C9F44] text-[#4C9F44]" v-if="type === 'Direct' || type === 'DouYin'">立即预定</view>
                         </view>
                     </view>
                 </view>
@@ -59,9 +59,20 @@
 	const OSS = inject('OSS')
 
 	const props = defineProps({
+        /**
+         * 类型: 直营(Direct)、抖音(DouYin)、加盟(Franchise) 等
+        */
         type: {
             type: String,
-            default: 'GroupBuying'
+            default: 'Direct'
+        },
+        /**
+         * 订单类型: 待使用、退款等
+         * TODO 这里的orderType在接入接口的时候需要改为类似于data.orderType这种形式
+        */
+        orderType: {
+            type: String,
+            default: 'toUse'
         }
     })
 
@@ -74,7 +85,7 @@
         },
 
         // 跳转到团购订单详情页
-        handleToGroupBuyingDetail: () => {
+        handleToOrderDetail: () => {
             uni.navigateTo({
                 url: `/bundle/group-buying/platform/order-detail?type=${props.type}&orderType=${OrderStatus.ToUse}`
             })

src/components/order/ComboCoupon.vue

@@ -0,0 +1,186 @@
+<template>
+    <view>
+        <!-- 平台团购直营店、抖音团购待使用 -->
+        <view class="bg-white rounded-16rpx p-30rpx" v-if="type === 'Direct' || type === 'Franchise' || type === 'DouYin'">
+            <view class="flex items-center" @click="comboCoupon.handleToStore">
+                <view class="mr-30rpx">
+                    <wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img>
+                </view>
+                <view class="flex-1">
+                    <view class="flex justify-between items-center" @click="comboCoupon.handleToStore">
+                        <view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-362rpx line-1">团购套餐的可以点击跳转团购套餐的可以点击跳转团购套餐的可以点击跳转 </view>
+                        <wd-icon name="chevron-right" size="32rpx" v-if="type === 'Direct'"></wd-icon>
+                        <view class="text-26rpx leading-36rpx text-[#909399]" v-if="type === 'DouYin'">￥324</view>
+                    </view>
+                    <view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
+                        <view>3小时</view>
+                        <view v-if="type === 'Direct'">x1</view>
+                    </view>
+                    <view class="text-[#606266] text-right mt-26rpx" v-if="type === 'Direct'">
+                        <text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
+                        <text class="tetx-32rpx leading-36rpx">￥29.32</text>
+                        <wd-icon name="chevron-right" size="32rpx"></wd-icon>
+                    </view>
+                    <view class="font-400 text-26rpx text-[#606266] leading-40rpx mt-40rpx" v-if="type === 'DouYin'">
+                        适用包间：青茶、红茶、绿茶
+                    </view>
+                </view>
+            </view>
+
+            <!-- 平台团购直营店待使用 -->
+            <view class="mt-30rpx font-500 leading-48rpx" v-if="type === 'Direct' && orderType === OrderStatus.ToUse">
+                <view class="text-26rpx text-[#606266]">有效期：2025.04.04-2025.12.31</view>
+                <view class="text-28rpx text-[#303133] mt-18rpx">
+                    <text class="mr-20rpx">券码 1052 4258 5654 125</text>
+                    <text class="text-[#4C9F44]">复制</text>
+                </view>
+            </view>
+        </view>
+
+        <!-- 抖音团购已使用 -->
+        <view class="bg-white rounded-16rpx p-30rpx" v-if="orderType === OrderStatus.Used && type === 'DouYin'">
+            <view class="flex items-center" @click="comboCoupon.handleToStore">
+                <view class="mr-30rpx">
+                    <wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img>
+                </view>
+                <view class="flex-1">
+                    <view class="flex justify-between items-center" @click="comboCoupon.handleToStore">
+                        <view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-300rpx line-1">这是团购套餐的名字</view>
+                        <view class="text-26rpx leading-36rpx text-[#909399] mt-8rpx">￥324</view>
+                    </view>
+                    <view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
+                        3小时
+                    </view>
+                    <view class="font-400 text-26rpx text-[#606266] leading-40rpx mt-40rpx">
+                        适用包间：青茶、红茶、绿茶
+                    </view>
+                </view>
+            </view>
+        </view>
+
+        <!-- 平台团购直营店已使用 -->
+        <view class="coupon-bg" v-if="type === 'Direct' && orderType === OrderStatus.Used">
+            <view class="flex items-center px-30rpx pt-30rpx pb-40rpx" @click="comboCoupon.handleToStore">
+                <view class="mr-30rpx">
+                    <wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img>
+                </view>
+                <view class="flex-1">
+                    <view class="flex justify-between items-center" @click="comboCoupon.handleToStore">
+                        <view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1 w-300rpx">这个是包间的名称</view>
+                        <wd-icon name="chevron-right" size="32rpx"></wd-icon>
+                        <view class="text-26rpx leading-36rpx text-[#909399]">￥324</view>
+                    </view>
+                    <view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
+                        <view>3小时</view>
+                        <view>x1</view>
+                    </view>
+                    <view class="text-[#606266] text-right mt-26rpx">
+                        <text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
+                        <text class="tetx-32rpx leading-36rpx">￥29.32</text>
+                        <wd-icon name="chevron-right" size="32rpx"></wd-icon>
+                    </view>
+                </view>
+            </view>
+
+            <view class="px-30rpx mt-28rpx pb-48rpx">
+                <view class="text-30rpx leading-42rpx text-[#303133]">预约信息</view>
+                <view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx">
+                    <view class="mb-20rpx">预约时间：2025-03-18  09:00-12:00</view>
+                    <view>预约时长：3小时</view>
+                </view>
+            </view>
+        </view>
+
+        <!-- 平台团购加盟-待使用 -->
+        <view class="coupon-bg2 p-30rpx" v-if="type === 'Franchise' && orderType === OrderStatus.ToUse">      
+            <view class="flex items-center">
+                <view class="mr-30rpx">
+                    <wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img>
+                </view>
+                <view class="flex-1">
+                    <view class="flex justify-between items-center" @click="comboCoupon.handleToStore">
+                        <view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1 w-300rpx">团购套餐的可以点击跳转</view>
+                        <wd-icon name="chevron-right" size="32rpx"></wd-icon>
+                    </view>
+                    <view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
+                        <view>3小时</view>
+                        <view>x1</view>
+                    </view>
+                    <view class="text-[#606266] text-right mt-26rpx">
+                        <text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
+                        <text class="tetx-32rpx leading-36rpx">￥29.32</text>
+                        <wd-icon name="chevron-right" size="32rpx"></wd-icon>
+                    </view>
+                </view>
+            </view>
+            <view class="mt-30rpx font-500 leading-48rpx text-[#606266] text-26rpx pb-44rpx">
+                有效期：2025.04.04-2025.12.31
+            </view>
+            <view class="px-30rpx mt-60rpx">
+                <view class="text-center">
+                    <wd-img width="230rpx" height="230rpx" :src="`${OSS}images/reserve_room/reserve_room_image3.png`"></wd-img>
+                </view>
+                <view class="text-28rpx text-[#303133] mt-32rpx text-center">
+                    <text class="mr-20rpx">券码 1052 4258 5654 125</text>
+                    <text class="text-[#4C9F44]">复制</text>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script lang="ts" setup name="ComboCoupon">
+    import { OrderStatus, OrderStatusText } from '@/utils/order'
+
+	/**
+	 * Combo 套餐券组件
+	 * @description 订单详情页下的套餐卡片详情，带有券码、二维码内容
+     */
+
+	const OSS = inject('OSS')
+
+	defineProps({
+        /**
+         * 类型: 直营(Direct)、抖音(DouYin)、加盟(Franchise) 等
+        */
+        type: {
+            type: String,
+            default: ''
+        },
+        /**
+         * 订单类型: 待使用、退款等
+         * TODO 这里的orderType在接入接口的时候需要改为类似于data.orderType这种形式
+        */
+        orderType: {
+            type: String,
+            default: ''
+        }
+    })
+
+    const comboCoupon = {
+        handleToStore: () => {
+            uni.navigateTo({
+                url: '/src/bundle/group-buying/platform/store-detail'
+            })
+        }
+    }
+</script>
+
+<script lang="ts">
+    export default {}
+</script>
+
+
+<style lang="scss" scoped>
+    .coupon-bg {
+        background-image: url(#{$OSS}images/order/order_image2.png);
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+    }  
+    
+    .coupon-bg2 {
+        background-image: url(#{$OSS}images/order/order_image1.png);
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+    }
+</style>

src/utils/order.ts

@@ -2,11 +2,12 @@ export enum OrderStatus {
     All = 'all',             // 全部订单
     Pending = 'pending',     // 待付款
     Reserved = 'reserved',   // 预约单
-    Confirm = 'Reserved',    // 待确认
+    Confirm = 'confirm',     // 待确认
     Finished = 'finished',   // 已完结
     ToUse = 'toUse',         // 待使用
+    Used = 'used',           // 已使用 = 交易完成(平台团购直营店)
     AfterSaleApply = 'afterSaleApply',   // 申请售后
-    AfterSaleFinished = 'afterSaleFinished' // 售后完成
+    AfterSaleFinished = 'afterSaleFinished' // 售后完成 = 已退款(平台团购直营店)
 }
 
 export const OrderStatusText: Record<OrderStatus, string> = {
@@ -16,6 +17,7 @@ export const OrderStatusText: Record<OrderStatus, string> = {
     [OrderStatus.Confirm]: '待确认',
     [OrderStatus.Finished]: '已完结',
     [OrderStatus.ToUse]: '待使用',
+    [OrderStatus.Used]: '已使用',
     [OrderStatus.AfterSaleApply]: '申请售后',
     [OrderStatus.AfterSaleFinished]: '售后完成'
 }