wangxiaowei/chazhi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善页面

Browse Source
This commit is contained in:
wangxiaowei
2025-09-09 22:33:38 +08:00
parent ff964fbc87
commit 0064e83e20
23 changed files with 1344 additions and 162 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/components/order/ComboCard.vue
View File

@ -1,21 +1,21 @@
<template>
<view class="">
<!-- 平台团购直营店 -->
<view v-if="type === 'Direct'" class="bg-white rounded-10rpx p-30rpx">
<view v-if="type === GroupBuyingCategory.Direct" 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">
<wd-img width="100%" height="100%" :src="`${OSS}icon/icon_tea.png`"></wd-img>
<view class="mr-10rpx flex items-center">
<wd-img width="40rpx" height="40rpx" :src="`${OSS}icon/icon_tea_room.png`"></wd-img>
</view>
<view class="flex items-center" @click="comboCard.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"></wd-icon>
</view>
</view>
<view class="font-400 text-28rpx leading-40rpx mt-12rpx">
<view class="font-400 text-28rpx leading-40rpx">
<text class="text-[#4C9F44]" v-if="orderType === GroupBuyingCategoryOrderStatus.ToUse">待使用</text>
<text class="text-[#606266]" v-if="orderType === GroupBuyingCategoryOrderStatus.Used">已使用</text>
<text class="text-[#C9C9C9]" v-if="orderType === GroupBuyingCategoryOrderStatus.AfterSaleFinished">已退款</text>
<text class="text-[#C9C9C9]" v-if="orderType === GroupBuyingCategoryOrderStatus.Refunded">已退款</text>
</view>
</view>
<view class="mt-22rpx">
@ -34,7 +34,7 @@
<view class="mt-10rpx">有效期至2025-03-23</view>
</view>
</view>
<view class="text-center flex items-center text-28rpx mt-28rpx justify-start">
<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-[#4C9F44] text-[#4C9F44]">立即预定</view>
@ -45,11 +45,11 @@
</view>
<!-- 平台团购加盟店和抖音团购 -->
<view v-if="type === 'Franchise' || type === 'DouYin'" class="bg-white rounded-10rpx p-30rpx">
<view v-if="type === GroupBuyingCategory.Franchise || type === GroupBuyingCategory.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">
<wd-img width="100%" height="100%" :src="`${OSS}icon/icon_tea.png`"></wd-img>
<view class="mr-10rpx flex items-center">
<wd-img width="40rpx" height="40rpx" :src="`${OSS}icon/icon_tea_room.png`"></wd-img>
</view>
<view class="flex items-center" @click="comboCard.handleToStore">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-400rpx line-1">这是茶馆的名称这是茶馆的名称这是茶馆的名称</view>
@ -74,10 +74,46 @@
<wd-tag bg-color="#F3F3F3" color="#606266" custom-class="!px-16rpx">3小时</wd-tag>
</view>
</view>
<view class="text-center flex items-center text-28rpx mt-28rpx justify-end">
<view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx" v-if="type === 'Franchise'">申请退款</view>
<view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#4C9F44] text-[#4C9F44]" v-if="type === 'DouYin'">立即预定</view>
<view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx" v-if="type === GroupBuyingCategory.Franchise">申请退款</view>
<view class="w-178rpx h-70rpx leading-70rpx rounded-8rpx border-[2rpx] border-[#4C9F44] text-[#4C9F44]" v-if="type === GroupBuyingCategory.DouYin">立即预定</view>
</view>
</view>
</view>
</view>
</view>
<!-- 茶室预约 -->
<view v-if="type === ReserveCategory.TeaRoom" class="bg-white rounded-10rpx p-30rpx">
<view class="flex justify-between items-center">
<view class="flex items-center">
<view class="mr-10rpx flex items-center">
<wd-img width="40rpx" height="40rpx" :src="`${OSS}icon/icon_tea_room.png`"></wd-img>
</view>
<view class="flex items-center" @click="comboCard.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"></wd-icon>
</view>
</view>
<view class="font-400 text-28rpx leading-40rpx mt-12rpx">
<text class="text-[#4C9F44]" v-if="orderType === ReserveCategoryOrderStatus.Consuming">消费中</text>
<text class="text-[#606266]" v-if="orderType === ReserveCategoryOrderStatus.Reserved">已预约</text>
<text class="text-[#C9C9C9]" v-if="orderType === ReserveCategoryOrderStatus.Serving">服务中</text>
</view>
</view>
<view class="mt-22rpx">
<view class="flex items-center">
<view class="w-200rpx h-200rpx mr-28rpx">
<wd-img width="100%" height="100%" :src="`${OSS}images/home/home_image5.png`"></wd-img>
</view>
<view class="flex-1">
<view @click="comboCard.handleToOrderDetail">
<view class="font-500 text-30rpx text-[#303133] leading-42rpx line-1 w-400rpx">这是茶室包间的名称</view>
<view class="font-400 leading-36rpx text-26rpx text-[#606266] mt-34rpx">
<view>预约时间：03/18 08:00-12:00</view>
<view class="mt-18rpx">预约时长：2小时</view>
</view>
</view>
</view>
</view>
@ -87,7 +123,8 @@
</template>
<script lang="ts" setup name="ComboCard">
import { GroupBuyingCategoryOrderStatus } from '@/utils/order'
import { GroupBuyingCategory, GroupBuyingCategoryOrderStatus } from '@/utils/groupBuying'
import { ReserveCategory, ReserveCategoryOrderStatus } from '@/utils/platformService'
/**
* ComboCard 套餐卡片组件
@ -98,11 +135,11 @@
const props = defineProps({
/**
* 类型: 直营(Direct)、加盟(Franchise)、抖音(DouYin) 等
* 类型: 直营(direct)、加盟(franchise)、抖音(douyin) 等
*/
type: {
type: String,
default: 'Direct'
default: GroupBuyingCategory.Direct
},
/**
* 订单类型: 待使用、退款等
@ -110,7 +147,7 @@
*/
orderType: {
type: String,
default: 'toUse'
default: GroupBuyingCategoryOrderStatus.ToUse
}
})
@ -150,4 +187,4 @@
<script lang="ts">
export default {}
</script>
</script>