duanshuwen/nianxx-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: migrate font-size classes to text-[size] syntax

Browse Source 
Additionally update spacing utilities and refactor the OrderQrcode component:
- Switch popup implementation from uni-popup to van-popup
- Remove the deprecated SCSS stylesheet
- Clean up component template and script code
This commit is contained in:
DEV_DSW
2026-05-29 09:21:36 +08:00
parent 02fef5dd89
commit e52f916231
44 changed files with 202 additions and 340 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/CreateServiceOrder/index.vue
View File

@@ -9,23 +9,23 @@
</div>
<div v-if="!isCallSuccess" class="border-box p-12">
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12">
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
<span class="font-500 line-height-22 mr-20">所在位置</span>
<input placeholder="请填写所在位置" v-model="roomId" />
</div>
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12">
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
<span class="font-500 line-height-22 mr-20">联系电话</span>
<input placeholder="请填写联系电话" v-model="contactPhone" @input="handleContactPhoneInput" />
</div>
<div class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12">
<div class="bg-F5F7FA border-box p-12 rounded-10 text-[14px] font-500 color-171717 mb-12">
<div class="font-500 line-height-22 mb-12">需求信息描述</div>
<textarea class="h-80" placeholder="请输入需求信息描述" placeholder-class="font-size-14 font-400" maxlength="100"
<textarea class="h-80" placeholder="请输入需求信息描述" placeholder-class="text-[14px] font-400" maxlength="100"
v-model="contactText" />
</div>
<div class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12">
<div class="bg-F5F7FA border-box p-12 rounded-10 text-[14px] font-500 color-171717 mb-12">
<div class="font-500 line-height-22 mb-12">照片上传</div>
<div class="w-80 h-80 bg-white rounded-8 overflow-hidden flex flex-items-center flex-justify-center">
@@ -45,13 +45,13 @@
<div v-else class="border-box card-content flex flex-items-center p-12">
<div class="border-box left flex-full pr-20">
<div class="font-size-12 color-525866 line-height-20 mb-4">
<div class="text-[12px] color-525866 line-height-20 mb-4">
所在位置：{{ roomId }}
</div>
<div class="font-size-12 color-525866 line-height-20 mb-4">
<div class="text-[12px] color-525866 line-height-20 mb-4">
联系方式: {{ contactPhone }}
</div>
<div class="font-size-12 color-525866 line-height-20 ellipsis-2">
<div class="text-[12px] color-525866 line-height-20 ellipsis-2">
需求描述: {{ contactspan }}
</div>
</div>

2
src/components/CustomEmpty/index.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="empty-container flex flex-col items-center justify-center">
<img class="empty-image" :src="emptyIcon" mode="aspectFit" />
<span class="font-size-12 text-center color-99A0AE mt-8">
<span class="text-[12px] text-center color-99A0AE mt-8">
{{ statusText }}
</span>
</div>

10
src/components/DateRangeSection/index.vue
View File

@@ -1,19 +1,19 @@
<template>
<div class="border-box flex flex-items-center flex-justify-between mb-12">
<div class="left flex flex-items-center">
<span class="font-size-12 color-99A0AE mr-4">入住</span>
<span class="font-size-12 color-171717 mr-16">
<span class="text-[12px] color-99A0AE mr-4">入住</span>
<span class="text-[12px] color-171717 mr-16">
{{ selectedDate.startDate }}
</span>
<span class="total border-box rounded-50 flex flex-items-center font-size-11 color-43669A relative">{{
selectedDate.totalDays }}晚</span>
<span class="font-size-12 color-99A0AE ml-16">离店</span>
<span class="font-size-12 color-171717 ml-4">
<span class="text-[12px] color-99A0AE ml-16">离店</span>
<span class="text-[12px] color-171717 ml-4">
{{ selectedDate.endDate }}
</span>
</div>
<div class="flex flex-items-center" v-if="showBtn" @click="emit('click')">
<span class="font-size-12 theme-color-500 line-height-16">房间详情</span>
<span class="text-[12px] theme-color-500 line-height-16">房间详情</span>
<van-icon name="arrow-right" size="15" color="#99A0AE" />
</div>
</div>

4
src/components/DetailPopup/index.vue
View File

@@ -12,11 +12,11 @@
<div class="rounded-12 bg-white ml-12 mr-12 mb-40">
<div class="border-box border-bottom flex flex-items-center flex-justify-between pt-12 pb-12 ml-12 mr-12">
<span class="font-size-16 font-500 color-171717">在线支付</span>
<span class="font-size-14 color-171717">239</span>
<span class="text-[14px] color-171717">239</span>
</div>
<div class="border-box flex flex-items-center flex-justify-between pt-12 pb-12 ml-12 mr-12">
<span class="font-size-16 font-500 color-171717">房费</span>
<span class="font-size-14 color-171717">239</span>
<span class="text-[14px] color-171717">239</span>
</div>
</div>
</div>

12
src/components/Feedback/index.vue
View File

@@ -9,13 +9,13 @@
</div>
<div v-if="!isCallSuccess" class="border-box p-12">
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12">
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
<span class="font-500 line-height-22 mr-20">联系电话</span>
<input placeholder="请填写联系电话" v-model="contactPhone" />
</div>
<div class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12">
<div class="bg-F5F7FA border-box p-12 rounded-10 text-[14px] font-500 color-171717 mb-12">
<div class="font-500 line-height-22 mb-12">意见内容</div>
<textarea class="h-80" placeholder="请输入反馈意见" placeholder-class="font-size-14 font-400" maxlength="100"
<textarea class="h-80" placeholder="请输入反馈意见" placeholder-class="text-[14px] font-400" maxlength="100"
v-model="contactText" />
</div>
@@ -26,17 +26,17 @@
</div>
<div v-else class="border-box left flex-full p-12">
<div class="font-size-12 color-525866 line-height-20 mb-4">
<div class="text-[12px] color-525866 line-height-20 mb-4">
联系方式: {{ contactPhone }}
</div>
<div class="font-size-12 color-525866 line-height-20 ellipsis-2">
<div class="text-[12px] color-525866 line-height-20 ellipsis-2">
意见内容: {{ contactText }}
</div>
</div>
<div class="footer-help flex flex-items-center pl-12 mb-12">
<img class="help-icon mr-4" src="./images/icon_volume.png" />
<span class="font-size-12 font-500 color-FA7319">
<span class="text-[12px] font-500 color-FA7319">
{{ appName }}收到您的意见将第一时间为您处理!
</span>
</div>

4
src/components/GoodDetail/index.vue
View File

@@ -13,11 +13,11 @@
}">
<div class="flex flex-items-center flex-row flex-shrink-0 mr-8">
<zn-icon :name="moduleItem.moduleIcon" size="20" color="#333"></zn-icon>
<span class="ml-4 font-size-14 color-171717 line-height-20">
<span class="ml-4 text-[14px] color-171717 line-height-20">
{{ moduleItem.moduleTitle }}
</span>
</div>
<span class="flex-full font-size-12 color-525866 line-height-20 mt-4">
<span class="flex-full text-[12px] color-525866 line-height-20 mt-4">
{{ moduleItem.moduleContent }}
</span>
</div>

4
src/components/RefundPopup/index.vue
View File

@@ -14,11 +14,11 @@
<uni-icons fontFamily="znicons" size="20" color="#333">
{{ iconsMap["zn-refund"] }}
</uni-icons>
<span class="font-size-14 font-600 color-171717 ml-8">
<span class="text-[14px] font-600 color-171717 ml-8">
{{ refundTitle }}
</span>
</div>
<div class="font-size-14 color-525866 line-height-16 mb-4" v-for="(item, index) in commodityPurchaseInstruction"
<div class="text-[14px] color-525866 line-height-16 mb-4" v-for="(item, index) in commodityPurchaseInstruction"
:key="index">
{{ item }}
</div>

4
src/components/Stepper/index.vue
View File

@@ -1,9 +1,7 @@
<template>
<div class="stepper-wrapper border-box flex flex-items-center rounded-8">
<uni-icons type="minus" size="24" color="#D1D1D1" @click="decrease" />
<text
class="stepper-text text-center font-size-14 font-500 color-000 ml-4 mr-4"
>
<text class="stepper-text text-center text-[14px] font-500 color-000 ml-4 mr-4">
{{ value }} {{ unit }}
</text>
<uni-icons type="plus" size="24" color="#198CFF" @click="increase" />

11
src/components/UseDateRange/index.vue
View File

@@ -7,16 +7,13 @@
<scroll-div class="date-scroll" scroll-x>
<div class="date-list">
<block v-for="item in openDateRangeList" :key="item.date">
<div
class="date-item"
:class="{ selected: isSameDate(selectedDate, item.date) }"
@click="onDateClick(item)"
>
<div class="label font-size-12">{{ item.weekDesc }}</div>
<div class="date-item" :class="{ selected: isSameDate(selectedDate, item.date) }"
@click="onDateClick(item)">
<div class="label text-[12px]">{{ item.weekDesc }}</div>
<div class="md font-size-16 font-600">
{{ formatMD(item.date) }}
</div>
<div class="status font-size-12">{{ item.canOrder }}</div>
<div class="status text-[12px]">{{ item.canOrder }}</div>
<div v-if="isSameDate(selectedDate, item.date)" class="check">
✔
</div>

33
src/pages/booking/components/ConactSection/index.vue
View File

@@ -3,7 +3,7 @@
<div class="border-box bg-white p-12 rounded-12 flex flex-items-center mb-12">
<div class="flex-full">
<div class="font-size-16 font-500 color-000 line-height-24">选择数量</div>
<div class="font-size-12 color-A3A3A3 line-height-16">请选择套餐数量</div>
<div class="text-[12px] color-A3A3A3 line-height-16">请选择套餐数量</div>
</div>
<div class="right">
<Stepper v-model="count" />
@@ -11,40 +11,27 @@
</div>
<!-- 使用日期 -->
<UseDateRange
v-if="orderData.reservationEnabled"
:openDateRangeList="orderData.openDateRangeList"
v-model:selectedDate="reservationDate"
/>
<UseDateRange v-if="orderData.reservationEnabled" :openDateRangeList="orderData.openDateRangeList"
v-model:selectedDate="reservationDate" />
<!-- 联系方式 -->
<div class="bg-white rounded-12 overflow-hidden">
<div
class="border-box border-bottom font-size-16 font-500 color-000 line-height-24 p-12"
>
<div class="border-box border-bottom font-size-16 font-500 color-000 line-height-24 p-12">
联系方式
</div>
<div class="flex flex-items-center border-box p-12">
<div class="font-size-14 font-500 color-525866 mr-12">联系人姓名</div>
<div class="text-[14px] font-500 color-525866 mr-12">联系人姓名</div>
<div class="right">
<input
class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
v-model.trim="userFormList[0].visitorName"
placeholder="请输入联系人"
maxlength="20"
/>
<input class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
v-model.trim="userFormList[0].visitorName" placeholder="请输入联系人" maxlength="20" />
</div>
</div>
<div class="flex flex-items-center border-box p-12">
<div class="font-size-14 font-500 color-525866 mr-12">手机号码</div>
<div class="text-[14px] font-500 color-525866 mr-12">手机号码</div>
<div class="right">
<input
class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
v-model.trim="userFormList[0].contactPhone"
placeholder="请输入联系手机"
maxlength="11"
/>
<input class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
v-model.trim="userFormList[0].contactPhone" placeholder="请输入联系手机" maxlength="11" />
</div>
</div>
</div>

2
src/pages/booking/components/FooterSection/index.vue
View File

@@ -4,7 +4,7 @@
{{ totalAmt }}
</span>
<!-- <div class="flex flex-items-center" @click="emit('detailClick')">
<span class="font-size-12 color-A3A3A3 mr-4">明细</span>
<span class="text-[12px] color-A3A3A3 mr-4">明细</span>
<uni-icons type="up" size="16" color="#A3A3A3" />
</div> -->
<div class="btn border-box rounded-10 flex flex-items-center ml-auto pl-8" @click="handleBooking">

27
src/pages/booking/components/UserSection/index.vue
View File

@@ -10,31 +10,20 @@
</div>
<div class="border-box pl-12 pr-12">
<div
class="border-box border-bottom pt-12 pb-12 flex flex-items-center"
v-for="(item, index) in userFormList"
:key="index"
>
<div class="font-size-14 font-500 color-525866 mr-12">住客姓名</div>
<div class="border-box border-bottom pt-12 pb-12 flex flex-items-center" v-for="(item, index) in userFormList"
:key="index">
<div class="text-[14px] font-500 color-525866 mr-12">住客姓名</div>
<div class="right">
<input
class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
v-model.trim="item.visitorName"
placeholder="请输入姓名"
maxlength="11"
/>
<input class="border-box px-4 py-2 font-size-15 color-000 line-height-20" v-model.trim="item.visitorName"
placeholder="请输入姓名" maxlength="11" />
</div>
</div>
<div class="flex flex-items-center border-box pt-12 pb-12">
<div class="font-size-14 font-500 color-525866 mr-12">联系手机</div>
<div class="text-[14px] font-500 color-525866 mr-12">联系手机</div>
<div class="right">
<input
class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
v-model.trim="userFormList[0].contactPhone"
placeholder="请输入联系手机"
maxlength="11"
/>
<input class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
v-model.trim="userFormList[0].contactPhone" placeholder="请输入联系手机" maxlength="11" />
</div>
</div>
</div>

6
src/pages/booking/index.vue
View File

@@ -18,7 +18,7 @@
</div>
<div class="border-box border-bottom">
<div class="font-size-12 color-99A0AE line-height-16 pb-12 break-all">
<div class="text-[12px] color-99A0AE line-height-16 pb-12 break-all">
{{ orderData.commodityDescription }}
</div>
@@ -32,9 +32,9 @@
</div>
<div class="border-box flex flex-items-center flex-justify-between pt-12">
<span class="font-size-12 color-525866 line-height-18">取消政策及说明</span>
<span class="text-[12px] color-525866 line-height-18">取消政策及说明</span>
<div class="flex flex-items-center">
<span class="font-size-12 theme-color-500 line-height-16" @click="refundVisible = true">取消政策</span>
<span class="text-[12px] theme-color-500 line-height-16" @click="refundVisible = true">取消政策</span>
<uni-icons type="right" size="15" color="#99A0AE" />
</div>
</div>

6
src/pages/home/components/AnswerComponent/index.vue
View File

@@ -9,17 +9,17 @@
<span class="font-size-16 font-500 span-color-900 ml-6"> {{ title }}</span>
</div>
<!-- 文字内容，最多显示3行 -->
<div v-if="processedContent" class="answer-content font-size-12 font-color-600">
<div v-if="processedContent" class="answer-content text-[12px] font-color-600">
<ChatMarkdown :text="processedContent" />
</div>
<!-- 超过3行时显示...提示 -->
<div v-if="!finish" class="flex flex-row flex-items-center mt-8">
<span class="font-size-12 font-400 font-color-600">正在生成</span>
<span class="text-[12px] font-400 font-color-600">正在生成</span>
<ChatLoading />
</div>
<div v-if="isOverflow" class="flex flex-row flex-items-center flex-justify-between mt-4"
@click="lookDetailAction">
<span class="font-size-12 font-400 theme-color-500 mr-4">查看完整{{ tag }}</span>
<span class="text-[12px] font-400 theme-color-500 mr-4">查看完整{{ tag }}</span>
<uni-icons class="icon-active" type="right" size="14" color="opacity"></uni-icons>
</div>

2
src/pages/home/components/ChatMoreTips/index.vue
View File

@@ -2,7 +2,7 @@
<div class="more-tips bg-white border-box">
<div class="font-size-0 whitespace-nowrap scroll-x">
<div class="more-tips-item border-box inline-block mr-8" v-for="(item, index) in guideWords" :key="index">
<span :class="['font-500 font-size-12 text-center', `color-${index}`]" @click="sendReply(item)">
<span :class="['font-500 text-[12px] text-center', `color-${index}`]" @click="sendReply(item)">
{{ item }}
</span>
</div>

2
src/pages/home/components/ChatTopWelcome/index.vue
View File

@@ -6,7 +6,7 @@ v
<SpriteAnimator :src="spriteStyle.ipLargeImage" :frameWidth="spriteStyle.frameWidth"
:frameHeight="spriteStyle.frameHeight" :totalFrames="spriteStyle.totalFrames" :columns="spriteStyle.columns"
:displayWidth="spriteStyle.displayWidth" :fps="16" />
<div class="welcome-text font-size-14 font-500 font-family-misans-vf color-171717 line-height-24">
<div class="welcome-text text-[14px] font-500 font-family-misans-vf color-171717 line-height-24">
{{ welcomeContent }}
</div>
</div>

4
src/pages/home/components/FacilityLocationCard/index.vue
View File

@@ -4,7 +4,7 @@
<div class="facility-location-card__body px-24 pb-24">
<div class="facility-location-card__title-row flex flex-items-center">
<div class="facility-location-card__badge color-2563EB bg-EFF6FF font-size-12 font-900">
<div class="facility-location-card__badge color-2563EB bg-EFF6FF text-[12px] font-900">
{{ type.text }}
</div>
<div class="facility-location-card__title color-1E293B font-size-18 font-900 ellipsis-1">
@@ -12,7 +12,7 @@
</div>
</div>
<div class="facility-location-card__distance flex flex-items-center color-94A3B8 font-size-14 font-900">
<div class="facility-location-card__distance flex flex-items-center color-94A3B8 text-[14px] font-900">
<span class="facility-location-card__distance-icon">{{ distance.icon }}</span>
<span>{{ distance.text }}</span>
</div>

2
src/pages/home/components/GeneratorPhotoComponent/index.vue
View File

@@ -14,7 +14,7 @@
<img class="g_title mt-20" :src="props.toolCall.componentNameParams.title" />
<span class="font-size-14 font-400 color-white my-12 text-center">
<span class="text-[14px] font-400 color-white my-12 text-center">
{{ props.toolCall.componentNameParams.description }}
</span>

14
src/pages/home/components/LongTextGuideCard/index.vue
View File

@@ -4,17 +4,17 @@
<div v-for="item in cards" :key="item.id"
class="long-text-guide-card__summary-card bg-white rounded-24 border-box" :class="{ 'is-disabled': disabled }"
@click="openDetail(item)">
<div class="long-text-guide-card__badge font-size-12 font-900" :class="`is-${item.badgeTone}`">
<div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
{{ item.badge }}
</div>
<div class="long-text-guide-card__summary-title color-1E293B font-size-18 font-900">
{{ item.title }}
</div>
<div class="long-text-guide-card__summary-text color-94A3B8 font-size-14 font-500 ellipsis-2">
<div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-500 ellipsis-2">
{{ item.summary }}
</div>
<div class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
<text class="color-CBD5E1 font-size-12 font-800">{{ item.footer }}</text>
<text class="color-CBD5E1 text-[12px] font-800">{{ item.footer }}</text>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</div>
</div>
@@ -29,7 +29,7 @@
<div class="long-text-guide-card__detail-title color-1E293B font-size-18 font-900 ellipsis-1">
{{ activeItem.title }}
</div>
<div class="long-text-guide-card__badge long-text-guide-card__detail-badge font-size-12 font-900"
<div class="long-text-guide-card__badge long-text-guide-card__detail-badge text-[12px] font-900"
:class="`is-${activeItem.badgeTone}`">
{{ activeItem.badge }}
</div>
@@ -55,7 +55,7 @@
</div>
<div class="long-text-guide-card__tip-block bg-ECFDF5">
<div v-for="(tip, index) in activeItem.tips || []" :key="tip"
class="long-text-guide-card__tip color-047857 font-size-14 font-800">
class="long-text-guide-card__tip color-047857 text-[14px] font-800">
{{ index + 1 }} {{ tip }}
</div>
</div>
@@ -87,9 +87,9 @@
<div class="long-text-guide-card__map-bar flex flex-items-center bg-white">
<div class="flex-full">
<div class="color-1E293B font-size-15 font-900">{{ activeItem.action.title }}</div>
<div class="color-94A3B8 font-size-12 font-800 mt-2">{{ activeItem.action.subtitle }}</div>
<div class="color-94A3B8 text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
</div>
<div class="long-text-guide-card__nav-btn color-white bg-0F172A font-size-14 font-900"
<div class="long-text-guide-card__nav-btn color-white bg-0F172A text-[14px] font-900"
@click="handleAction(activeItem)">
{{ activeItem.action.buttonText }}
</div>

6
src/pages/home/components/LongTextGuideCardPreview/index.vue
View File

@@ -4,18 +4,18 @@
<div class="w-vw"></div>
<div class="flex flex-col px-16 pt-16 pb-12 border-box" @click="openDetail(item)">
<div class="long-text-guide-card__badge font-size-12 font-900" :class="`is-${item.badgeTone}`">
<div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
{{ item.badge }}
</div>
<div class="long-text-guide-card__summary-title color-1E293B font-size-18 font-900">
{{ item.title }}
</div>
<div class="long-text-guide-card__summary-text color-94A3B8 font-size-14 font-500 ellipsis-2">
<div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-500 ellipsis-2">
{{ item.summary }}
</div>
<div class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
<span class="color-CBD5E1 font-size-12 font-800">{{ item.footer }}</span>
<span class="color-CBD5E1 text-[12px] font-800">{{ item.footer }}</span>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</div>

4
src/pages/home/components/MapNavigationCard/index.vue
View File

@@ -2,7 +2,7 @@
<div class="map-navigation-card bg-white rounded-24 overflow-hidden w-full">
<div class="map-navigation-card__media">
<img class="map-navigation-card__image block w-full" :src="data.image" mode="aspectFill" />
<div class="map-navigation-card__badge flex flex-items-center color-white font-size-12 font-900">
<div class="map-navigation-card__badge flex flex-items-center color-white text-[12px] font-900">
<span class="map-navigation-card__badge-icon">{{ badge.icon }}</span>
<span>{{ badge.text }}</span>
</div>
@@ -13,7 +13,7 @@
<div class="map-navigation-card__title color-1E293B font-size-18 font-900 ellipsis-1">
{{ data.title }}
</div>
<div class="map-navigation-card__distance color-94A3B8 font-size-14 font-900 ellipsis-1">
<div class="map-navigation-card__distance color-94A3B8 text-[14px] font-900 ellipsis-1">
{{ data.distance }}
</div>
</div>

4
src/pages/home/components/MoreService/index.vue
View File

@@ -14,11 +14,11 @@
<div class="font-size-16 color-000 line-height-24 font-500">
{{ item.title }}
</div>
<div class="font-size-12 color-A3A3A3 line-height-16">
<div class="text-[12px] color-A3A3A3 line-height-16">
{{ item.content }}
</div>
</div>
<div class="right border-box font-size-12 color-white line-height-16" @click="handleClick(item)">
<div class="right border-box text-[12px] color-white line-height-16" @click="handleClick(item)">
{{ item.btnText }}
</div>
</div>

8
src/pages/home/components/NoticeCard/index.vue
View File

@@ -4,14 +4,14 @@
<div class="notice-card__summary-title color-B45309 font-size-16 font-900">
{{ summary.title }}
</div>
<div class="notice-card__summary-content color-D97706 font-size-14 font-900">
<div class="notice-card__summary-content color-D97706 text-[14px] font-900">
{{ summary.content }}
</div>
<div class="notice-card__summary-footer flex flex-items-center flex-justify-between">
<div class="notice-card__summary-time color-D97706 font-size-12 font-900">
<div class="notice-card__summary-time color-D97706 text-[12px] font-900">
{{ summary.publishTime }}
</div>
<div class="notice-card__summary-link color-B45309 font-size-14 font-900" :class="{ 'is-disabled': disabled }"
<div class="notice-card__summary-link color-B45309 text-[14px] font-900" :class="{ 'is-disabled': disabled }"
@click="openDetail">
{{ summary.actionText }}
</div>
@@ -41,7 +41,7 @@
</div>
<div class="notice-card__divider"></div>
<div v-for="paragraph in paragraphs" :key="paragraph.id"
class="notice-card__paragraph color-475569 font-size-14 font-800">
class="notice-card__paragraph color-475569 text-[14px] font-800">
<span v-for="segment in paragraph.segments" :key="segment.text"
:class="{ 'notice-card__strong': segment.strong }">
{{ segment.text }}

8
src/pages/home/components/NoticeMessage/detail.vue
View File

@@ -13,14 +13,14 @@
<div class="pt-16 px-12 pb-24 border-box">
<div class="color-171717 font-size-16 font-weight-600">{{ detailTitle }}</div>
<div v-if="publishTime" class="notice-time-tag flex flex-row flex-items-center mt-16">
<div v-if="publishTime" class="notice-time-tag flex flex-row flex-items-center mt-[16px]">
<uni-icons type="clock" size="18" color="#5A6780" />
<span class="color-171717 font-size-12 font-weight-600 ml-8">发布时间：{{ publishTime }}</span>
<span class="color-171717 text-[12px] font-weight-600 ml-8">发布时间：{{ publishTime }}</span>
</div>
<div class="mt-16 mx-12 bg-gray w-full height-1"></div>
<div class="mt-[16px] mx-12 bg-gray w-full height-1"></div>
<div class="mt-16 color-666 font-size-14 line-height-20">{{ noticeContent }}</div>
<div class="mt-[16px] color-666 text-[14px] line-height-20">{{ noticeContent }}</div>
</div>
</div>
</div>

4
src/pages/home/components/OpenMapComponent/index.vue
View File

@@ -9,8 +9,8 @@
</div>
</div>
<div class="center ml-12">
<div class="font-color-900 font-size-14">打开导览地图</div>
<div class="font-color-500 font-size-12 mt-6">距你 {{ distance }} · 步行 {{ walk }}</div>
<div class="font-color-900 text-[14px]">打开导览地图</div>
<div class="font-color-500 text-[12px] mt-6">距你 {{ distance }} · 步行 {{ walk }}</div>
</div>
<div class="ml-12 flex flex-items-center flex-justify-center w-32 h-32 rounded-full bg-F2F5F8">
<uni-icons class="mb-2" type="right" size="12" color="#99A0AE" />

18
src/pages/home/components/PoiCompareCard/index.vue
View File

@@ -15,14 +15,14 @@
:class="{ 'is-disabled': disabled }" @click="handleSelect(item)">
<img class="poi-compare-card__image block w-full" :src="item.image" mode="aspectFill" />
<div v-for="field in item.fields" :key="field.label" class="poi-compare-card__field">
<div class="poi-compare-card__field-label color-94A3B8 font-size-12 font-800">
<div class="poi-compare-card__field-label color-94A3B8 text-[12px] font-800">
{{ field.label }}
</div>
<div v-if="field.tone" class="poi-compare-card__chip font-size-12 font-900"
<div v-if="field.tone" class="poi-compare-card__chip text-[12px] font-900"
:class="getToneClass(field.tone)">
{{ field.value }}
</div>
<div v-else class="poi-compare-card__field-value color-1E293B font-size-14 font-900">
<div v-else class="poi-compare-card__field-value color-1E293B text-[14px] font-900">
{{ field.value }}
</div>
</div>
@@ -45,7 +45,7 @@
<div class="poi-compare-card__detail-title color-1E293B font-size-20 font-900 flex-full">
{{ detail.title }}
</div>
<div class="poi-compare-card__compare-label color-94A3B8 font-size-12 font-900">
<div class="poi-compare-card__compare-label color-94A3B8 text-[12px] font-900">
{{ detail.compareLabel }}
</div>
</div>
@@ -54,29 +54,29 @@
<div class="poi-compare-card__table-head poi-compare-card__table-row">
<div></div>
<div v-for="item in items" :key="item.id || item.name"
class="poi-compare-card__table-title color-1E293B font-size-14 font-900">
class="poi-compare-card__table-title color-1E293B text-[14px] font-900">
{{ item.name }}
</div>
</div>
<div v-for="row in detail.rows" :key="row.label" class="poi-compare-card__table-row poi-compare-card__data-row">
<div class="poi-compare-card__row-label color-94A3B8 font-size-12 font-900">
<div class="poi-compare-card__row-label color-94A3B8 text-[12px] font-900">
{{ row.label }}
</div>
<div v-for="cell in row.values" :key="row.label + '-' + cell.text"
class="poi-compare-card__cell color-1E293B font-size-14 font-900" :class="getCellClass(cell.tone)">
class="poi-compare-card__cell color-1E293B text-[14px] font-900" :class="getCellClass(cell.tone)">
{{ cell.text }}
</div>
</div>
</div>
<div class="poi-compare-card__recommend">
<div class="poi-compare-card__recommend-title color-94A3B8 font-size-12 font-900">
<div class="poi-compare-card__recommend-title color-94A3B8 text-[12px] font-900">
{{ detail.recommendTitle }}
</div>
<div class="poi-compare-card__tips">
<div v-for="tip in detail.tips" :key="tip.text" class="poi-compare-card__tip flex gap-10">
<div class="poi-compare-card__dot rounded-full flex-shrink-0" :class="getDotClass(tip.tone)" />
<div class="poi-compare-card__tip-text color-334155 font-size-14 font-900">
<div class="poi-compare-card__tip-text color-334155 text-[14px] font-900">
{{ tip.text }}
</div>
</div>

2
src/pages/home/components/PoiDetailCard/index.vue
View File

@@ -15,7 +15,7 @@
<div class="poi-detail-card__tip flex flex-items-center gap-10">
<div class="poi-detail-card__spark color-047857 font-size-18 font-900">✦</div>
<div class="poi-detail-card__tip-text color-047857 font-size-14 font-800">
<div class="poi-detail-card__tip-text color-047857 text-[14px] font-800">
{{ data.tip?.text }}
</div>
</div>

4
src/pages/home/components/RecommendationListCard/index.vue
View File

@@ -11,12 +11,12 @@
{{ item.title }}
</div>
<div
class="recommendation-list-card__distance flex flex-items-center gap-4 mt-4 color-94A3B8 font-size-12 font-800">
class="recommendation-list-card__distance flex flex-items-center gap-4 mt-4 color-94A3B8 text-[12px] font-800">
<span class="recommendation-list-card__pin">⌖</span>
<span>{{ item.distance }}</span>
</div>
<div
class="recommendation-list-card__button flex flex-items-center flex-justify-center mt-12 color-334155 font-size-12 font-900"
class="recommendation-list-card__button flex flex-items-center flex-justify-center mt-12 color-334155 text-[12px] font-900"
@click.stop="handleSelect(item)">
{{ getActionText(item) }}
</div>

14
src/pages/home/components/RoutePlanCard/index.vue
View File

@@ -9,7 +9,7 @@
{{ data.title }}
</div>
<div class="route-plan-card__tags flex flex-items-center">
<div v-for="tag in summaryTags" :key="tag.id || tag.text" class="route-plan-card__tag font-size-12 font-900"
<div v-for="tag in summaryTags" :key="tag.id || tag.text" class="route-plan-card__tag text-[12px] font-900"
:class="getTagClass(tag.tone)">
{{ tag.text }}
</div>
@@ -29,7 +29,7 @@
<div class="route-plan-card__detail-title color-1E293B font-size-18 font-900 ellipsis-1 flex-full">
{{ data.title }}
</div>
<div class="route-plan-card__detail-badge color-047857 bg-ECFDF5 font-size-12 font-900">
<div class="route-plan-card__detail-badge color-047857 bg-ECFDF5 text-[12px] font-900">
{{ detail.badge }}
</div>
</div>
@@ -38,7 +38,7 @@
<template v-for="(node, index) in nodes" :key="node.id || node.title">
<div class="route-plan-card__node-wrap" :class="{ 'is-disabled': disabled }" @click="handleSelect(node)">
<div
class="route-plan-card__node-number flex flex-items-center flex-justify-center rounded-full color-047857 bg-ECFDF5 font-size-12 font-900">
class="route-plan-card__node-number flex flex-items-center flex-justify-center rounded-full color-047857 bg-ECFDF5 text-[12px] font-900">
{{ index + 1 }}
</div>
<div class="route-plan-card__node bg-white rounded-20 flex flex-items-center">
@@ -47,10 +47,10 @@
<div class="route-plan-card__node-title color-1E293B font-size-16 font-900 ellipsis-1">
{{ node.title }}
</div>
<div class="route-plan-card__node-desc color-94A3B8 font-size-12 font-800 ellipsis-1">
<div class="route-plan-card__node-desc color-94A3B8 text-[12px] font-800 ellipsis-1">
{{ node.description }}
</div>
<div v-if="node.tag" class="route-plan-card__node-tag color-D97706 bg-FFFBEB font-size-12 font-900">
<div v-if="node.tag" class="route-plan-card__node-tag color-D97706 bg-FFFBEB text-[12px] font-900">
{{ node.tag }}
</div>
</div>
@@ -61,7 +61,7 @@
<div class="route-plan-card__connector-line"></div>
<div class="route-plan-card__connector-arrow"></div>
<div
class="route-plan-card__connector-chip flex flex-items-center bg-F8FAFC rounded-full color-64748B font-size-12 font-900">
class="route-plan-card__connector-chip flex flex-items-center bg-F8FAFC rounded-full color-64748B text-[12px] font-900">
<span class="route-plan-card__connector-icon">{{ connectors[index].icon }}</span>
<span>{{ connectors[index].text }}</span>
</div>
@@ -70,7 +70,7 @@
</div>
<div v-if="tips.length" class="route-plan-card__tips bg-F8FAFC rounded-20">
<div class="route-plan-card__tips-title color-64748B font-size-14 font-900">
<div class="route-plan-card__tips-title color-64748B text-[14px] font-900">
{{ detail.tipsTitle }}
</div>
<div v-for="tip in tips" :key="tip"

2
src/pages/home/components/ScenicImageCard/index.vue
View File

@@ -13,7 +13,7 @@
<div v-if="caption.title" class="scenic-image-card__title color-white font-size-18 font-900 ellipsis-1">
{{ caption.title }}
</div>
<div v-if="caption.subtitle" class="scenic-image-card__subtitle color-white font-size-14 font-900 ellipsis-1">
<div v-if="caption.subtitle" class="scenic-image-card__subtitle color-white text-[14px] font-900 ellipsis-1">
{{ caption.subtitle }}
</div>
</div>

2
src/pages/home/components/SharedVisual/ActionRow.vue
View File

@@ -7,7 +7,7 @@
<slot name="icon">{{ icon }}</slot>
</div>
<div class="visual-action-row__body flex-full">
<div class="visual-action-row__title color-1E293B font-size-14 font-900 ellipsis-1">{{ title }}</div>
<div class="visual-action-row__title color-1E293B text-[14px] font-900 ellipsis-1">{{ title }}</div>
<div v-if="subtitle" class="visual-action-row__subtitle ellipsis-1">
{{ subtitle }}
</div>

2
src/pages/home/components/SharedVisual/DetailShell.vue
View File

@@ -5,7 +5,7 @@
@click="$emit('back')">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</div>
<div class="visual-detail__title flex-full color-1E293B font-size-14 font-900 ellipsis-1">{{ title }}</div>
<div class="visual-detail__title flex-full color-1E293B text-[14px] font-900 ellipsis-1">{{ title }}</div>
<BadgePill v-if="tag" :label="tag" :tone="tone" />
</div>
<slot />

11
src/pages/order/order/components/AmtSection/index.vue
View File

@@ -10,16 +10,11 @@
</span>
</div>
</div>
<div
v-if="orderData.orderStatus === '0'"
class="font-size-11 color-99A0AE mt-4"
>
<div v-if="orderData.orderStatus === '0'" class="font-size-11 color-99A0AE mt-4">
超时后，订单将自动取消
</div>
<div
v-if="['1', '2'].includes(orderData.orderStatus)"
class="border-box border-top flex flex-items-center flex-justify-between font-size-12 pt-12 mt-12"
>
<div v-if="['1', '2'].includes(orderData.orderStatus)"
class="border-box border-top flex flex-items-center flex-justify-between text-[12px] pt-12 mt-12">
<div class="color-525866">取消政策及说明</div>
<div class="flex flex-items-center" @click="emit('click')">
<span class="theme-color-500 mr-4">查看详情</span>

4
src/pages/order/order/components/FooterSection/index.vue
View File

@@ -1,12 +1,12 @@
<template>
<div class="footer bg-white border-box flex flex-items-center flex-justify-between p-12">
<button v-if="['1', '2'].includes(statusCode)"
class="left border-none border-box bg-white rounded-10 flex flex-items-center flex-justify-center font-size-14 font-500 color-525866 mr-12"
class="left border-none border-box bg-white rounded-10 flex flex-items-center flex-justify-center text-[14px] font-500 color-525866 mr-12"
@click="emit('refund', orderData)">
申请退款
</button>
<button :class="[
'right border-none rounded-10 flex flex-full flex-items-center flex-justify-center font-size-14 font-500 bg-theme-color-500',
'right border-none rounded-10 flex flex-full flex-items-center flex-justify-center text-[14px] font-500 bg-theme-color-500',
{
'bg-FF3D60': statusCode === '0',
'color-white': ['1', '2', '3', '4', '5', '6'].includes(statusCode),

24
src/pages/order/order/components/GoodsInfo/index.vue
View File

@@ -1,28 +1,20 @@
<template>
<div v-if="orderType == 0" class="border-box bg-white p-12 rounded-12 mb-12">
<!-- 酒店类型入住离店日期部分 -->
<DateRangeSection
v-if="orderData.orderType == 0"
:selectedDate="selectedDate"
/>
<DateRangeSection v-if="orderData.orderType == 0" :selectedDate="selectedDate" />
<div class="font-size-16 font-500 color-000 line-height-24 ellipsis-1">
{{ orderData.commodityName }}
</div>
<div
class="border-box border-bottom font-size-12 color-99A0AE line-height-16 pb-12"
>
<div class="border-box border-bottom text-[12px] color-99A0AE line-height-16 pb-12">
{{ orderData.commodityDescription }}
</div>
<!-- 权益部分 -->
<div class="border-box flex flex-items-center pt-12">
<span
class="bg-F7F7F7 border-box rounded-4 font-size-11 color-525866 mr-4 pt-4 pb-4 pl-6 pr-6"
v-for="(item, index) in commodityFacilityList"
:key="index"
>
<span class="bg-F7F7F7 border-box rounded-4 font-size-11 color-525866 mr-4 pt-4 pb-4 pl-6 pr-6"
v-for="(item, index) in commodityFacilityList" :key="index">
{{ item }}
</span>
</div>
@@ -33,15 +25,13 @@
{{ orderData.commodityName }}
</div>
<div class="flex font-size-12">
<div class="flex text-[12px]">
<span class="w-60 color-99A0AE">购买数量</span>
<span class="color-525866">{{ commodityAmount }}</span>
</div>
<div
v-if="orderData.orderStatus === '0'"
class="border-box border-top pt-12 font-size-14 font-500 color-171717 mt-12"
>
<div v-if="orderData.orderStatus === '0'"
class="border-box border-top pt-12 text-[14px] font-500 color-171717 mt-12">
凭[电子凭证]直接验证使用
</div>
</div>

4
src/pages/order/order/components/OrderCard/InfoRow.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="info-row flex items-center mt-8">
<span class="label font-size-12 color-99A0AE">{{ label }}：</span>
<span class="value flex-full font-size-12 color-99A0AE">{{ value }}</span>
<span class="label text-[12px] color-99A0AE">{{ label }}：</span>
<span class="value flex-full text-[12px] color-99A0AE">{{ value }}</span>
</div>
</template>

21
src/pages/order/order/components/OrderCard/OrderCardContent.vue
View File

@@ -1,27 +1,18 @@
<template>
<div class="card-content border-box pt-12">
<div class="flex items-center justify-between">
<div
class="left flex-full font-size-14 line-height-20 color-171717 mr-12"
>
<div class="left flex-full text-[14px] line-height-20 color-171717 mr-12">
{{ orderData.commodityName }}
</div>
<div
:class="[
'right font-size-18 font-bold line-height-20',
orderData.orderStatus === '0' ? 'color-FF3D60' : 'color-525866',
]"
>
<div :class="[
'right font-size-18 font-bold line-height-20',
orderData.orderStatus === '0' ? 'color-FF3D60' : 'color-525866',
]">
{{ orderData.orderAmt }}
</div>
</div>
<!-- 动态渲染信息行 -->
<InfoRow
v-for="item in displayItems"
:key="item.label"
:label="item.label"
:value="item.value"
/>
<InfoRow v-for="item in displayItems" :key="item.label" :label="item.label" :value="item.value" />
</div>
</template>

23
src/pages/order/order/components/OrderCard/index.vue
View File

@@ -1,23 +1,17 @@
<template>
<div
class="order-card bg-white border-box p-12 rounded-12 m-12"
@click.stop="handleCardClick"
>
<div class="order-card bg-white border-box p-12 rounded-12 m-12" @click.stop="handleCardClick">
<!-- 卡片头部 -->
<div class="card-header flex items-center">
<div class="status-info flex items-center flex-full">
<img class="status-icon mr-4" :src="getStatusIcon()" />
<div class="order-title font-size-14 line-height-20 color-525866">
<div class="order-title text-[14px] line-height-20 color-525866">
{{ getOrderTypeName() }}
</div>
</div>
<div
v-if="orderData.status !== 'pending'"
:class="[
'status-tag font-size-12',
`tag-${orderData.orderStatus || orderData.workOrderStatus}`,
]"
>
<div v-if="orderData.status !== 'pending'" :class="[
'status-tag text-[12px]',
`tag-${orderData.orderStatus || orderData.workOrderStatus}`,
]">
{{ getStatusspan(orderData.orderStatus || orderData.workOrderStatus) }}
</div>
</div>
@@ -27,9 +21,8 @@
<div v-if="orderData.orderStatus === '0'" class="span-right">
<button
class="go-pay border-box border-none font-size-14 color-white bg-FF3D60 rounded-5 inline-block span-center line-height-30"
@click.stop="handleCardClick"
>
class="go-pay border-box border-none text-[14px] color-white bg-FF3D60 rounded-5 inline-block span-center line-height-30"
@click.stop="handleCardClick">
去支付
</button>
</div>

20
src/pages/order/order/components/OrderInfo/index.vue
View File

@@ -1,23 +1,21 @@
<template>
<div class="bg-white border-box rounded-10 p-12">
<div class="flex mb-8 font-size-12">
<div class="flex mb-8 text-[12px]">
<span class="w-60 color-99A0AE">订单编号</span>
<span class="color-525866">{{ orderData.orderId }}</span>
</div>
<div class="flex mb-8 font-size-12">
<div class="flex mb-8 text-[12px]">
<span class="w-60 color-99A0AE">下单时间</span>
<span class="color-525866">{{ orderData.createTime }}</span>
</div>
<div class="flex font-size-12">
<div class="flex text-[12px]">
<span class="w-60 color-99A0AE">支付状态</span>
<span
:class="[
{
'color-FF3D60': statusCode === '0' || statusCode === '3',
'color-21B466': ['1', '2', '4', '5', '6'].includes(statusCode),
},
]"
>
<span :class="[
{
'color-FF3D60': statusCode === '0' || statusCode === '3',
'color-21B466': ['1', '2', '4', '5', '6'].includes(statusCode),
},
]">
{{ statusspan }}
</span>
</div>

127
src/pages/order/order/components/OrderQrcode/index.vue
View File

@@ -1,56 +1,33 @@
<template>
<uni-popup
ref="popupRef"
type="bottom"
:safe-area="false"
@maskClick="handleClose"
@change="handlePopupChange"
>
<div class="refund-popup bg-F5F7FA border-box">
<div
class="border-box flex flex-items-center justify-between pt-12 pb-12 relative"
>
<div class="flex flex-col flex-items-center flex-full">
<div class="flex-full font-size-16 span-color-900 span-center">
<van-popup ref="popupRef" position="bottom" v-model:show="show">
<div class="rounded-t-[15px] pb-10 bg-[#F5F7FA]">
<div class="flex items-center justify-between pt-[12px] pb-[12px] relative">
<div class="flex flex-col items-center flex-1">
<div class="flex-1 text-[16px] text-[#181B25] text-center">
核销凭证
</div>
<div class="flex-full font-size-12 span-color-600 span-center mt-4">
<div class="flex-1 text-[12px] text-[#666666] text-center mt-[4px]">
请向工作人员出示此码
</div>
</div>
<!-- 关闭按钮 -->
<uni-icons
class="close absolute"
type="close"
size="20"
color="#CACFD8"
@click="handleClose"
/>
<van-icon class="top-[14px] right-[12px] absolute" name="cross" size="20" color="#CACFD8"
@click="handleClose" />
</div>
<div
class="bg-white border-box rounded-12 flex flex-col flex-items-center flex-justify-center p-12 mb-12 mx-12"
>
<div
class="flex w-full flex-row flex-items-center flex-justify-between py-4"
>
<div class="bg-white rounded-[12px] flex flex-col items-center justify-center p-[12px] mb-[12px] mx-[12px]">
<div class="flex w-full flex-row items-center justify-between py-[4px]">
<div>
<div
class="font-size-16 font-500 color-000 line-height-24 ellipsis-1"
>
<div class="text-[16px] font-medium text-black leading-[24px] truncate">
{{ selectedVoucher.name }}
</div>
</div>
<div v-if="selectedVoucher" class="flex flex-row">
<div
class="bg-F5F7FA span-color-600 font-size-12 p-4 rounded-4 mr-4"
>
<div class="bg-[#F5F7FA] text-[#666666] font-medium px-[4px] rounded-[4px] mr-[4px]">
总计{{ selectedVoucher.count }}{{ selectedVoucher.unit }}
</div>
<div
class="bg-theme-color-50 theme-color-500 font-size-12 p-4 rounded-4"
>
<div class="bg-[#F0F8F3] text-[#0CCD58] text-[12px] p-[4px] rounded-[4px]">
剩{{ selectedVoucher.count - selectedVoucher.writeOffCount
}}{{ selectedVoucher.unit }}可用
</div>
@@ -58,84 +35,64 @@
</div>
<div
class="flex flex-col w-full flex-items-center flex-justify-center border-box rounded-8 border pt-16 pb-32 mt-12"
>
<div
class="flex flex-row flex-justify-between border-box w-full px-12"
>
<div
class="bg-theme-color-50 theme-color-500 font-size-14 px-12 line-height-24 rounded-12"
>
class="flex flex-col w-full items-center justify-center rounded-[8px] border border-ink-200 pt-[16px] pb-[32px] mt-[12px]">
<div class="flex flex-row justify-between w-full px-[12px]">
<div class="bg-[#F9FAFB] text-[#0CCD58] text-[14px] px-[12px] leading-[24px] rounded-[12px]">
凭证{{
selectedVoucherList.length > 1 ? currentVoucherIndex + 1 : ""
}}
</div>
<div
class="span-color-500 font-size-14 px-12 line-height-24 rounded-12"
>
<div class="text-ink-500 text-[14px] px-[12px] leading-[24px] rounded-[12px]">
此码仅可核销{{
selectedVoucher.count - selectedVoucher.writeOffCount
}}份
</div>
</div>
<div
class="flex flex-items-center flex-justify-center mt-20 p-20 rounded-12 border borderColor"
:style="{ borderColor: selectedVoucher?.color }"
>
<Qrcode
v-if="showQrcode"
:size="props.size"
:unit="props.unit"
:val="qrcodeVal"
:loadMake="true"
:onval="true"
/>
<div class="flex items-center justify-center mt-[20px] p-[20px] rounded-[12px] border border-[#0CCD58]"
:style="{ borderColor: selectedVoucher?.color }">
<Qrcode v-if="showQrcode" :size="props.size" :unit="props.unit" :val="qrcodeVal" :loadMake="true"
:onval="true" />
</div>
<div
v-if="false"
class="mt-20 bg-theme-color-50 theme-color-500 font-size-14 px-12 line-height-24 rounded-12"
>
<div v-if="false"
class="mt-[20px] bg-theme-color-50 text-[#0CCD58] text-[14px] px-12 line-height-24 rounded-12">
{{ selectedVoucher.name }}
</div>
</div>
<div
v-if="selectedVoucherList.length > 1"
class="flex flex-row w-full flex-items-center flex-justify-between mt-16 mb-24"
>
<div v-if="selectedVoucherList.length > 1"
class="flex flex-row w-full items-center justify-between mt-[16px] mb-[24px]">
<div class="actions-btn" @click.stop="upAction">
<uni-icons type="left" size="16" color="#171717" />
<van-icon name="arrow-left" size="16" color="#171717" />
</div>
<div class="flex flex-col">
<div class="flex flex-row flex-justify-center flex-items-center">
<div class="theme-color-500 font-size-16">
<div class="flex flex-row justify-center items-center">
<div class="text-[#0CCD58] text-[16px]">
{{ currentVoucherIndex + 1 }}
</div>
<div class="span-color-600 font-size-12">
<div class="text-[#02C34E] text-[12px]">
/{{ selectedVoucherList.length }}
</div>
</div>
<div class="span-color-600 font-size-14">扫码后点击下一张</div>
<div class="text-[#02C34E] text-[14px]">扫码后点击下一张</div>
</div>
<div class="actions-btn" @click.stop="downAction">
<uni-icons type="right" size="16" color="#171717" />
<div class="w-10 h-10 rounded-full bg-[#f5f5f5] flex items-center justify-center" @click.stop="downAction">
<van-icon type="right" size="16" color="#171717" />
</div>
</div>
<div v-else class="mb-24"></div>
<div v-else class="mb-[24px]"></div>
</div>
</div>
</uni-popup>
</van-popup>
</template>
<script setup>
import { ref, watch, computed, nextTick, defineProps, defineEmits, defineExpose } from "vue";
import Qrcode from "@/components/Qrcode/index.vue";
import { defineProps, defineEmits } from "vue";
import { ref, watch, computed, nextTick } from "vue";
const props = defineProps({
// 弹窗显示状态
@@ -177,6 +134,7 @@ const emit = defineEmits([
// 弹窗引用
const popupRef = ref(null);
const show = ref(false)
// 控制二维码渲染
const showQrcode = ref(false);
@@ -208,8 +166,8 @@ const qrcodeVal = computed(() => {
});
// 方法定义
const show = () => popupRef.value && popupRef.value.open();
const hide = () => popupRef.value && popupRef.value.close();
const open = () => show.value = true;
const close = () => show.value = false;
const handlePopupChange = ({ show }) => {
// popup 真实打开后再渲染二维码，避免 canvas 尺寸为 0 报错
@@ -297,8 +255,9 @@ const downAction = () => {
if (idx >= len) idx = 0;
currentVoucherIndex.value = idx;
};
</script>
<style scoped lang="scss">
@import "./styles/index.scss";
</style>
defineExpose({
open,
close,
})
</script>

23
src/pages/order/order/components/OrderQrcode/styles/index.scss
View File

@@ -1,23 +0,0 @@
.refund-popup {
border-radius: 15px 15px 0 0;
padding-bottom: 40px;
}
.close {
top: 14px;
right: 12px;
}
.borderColor {
border-color: #0ccd58;
}
.actions-btn {
width: 40px;
height: 40px;
border-radius: 20px;
background-color: #f5f5f5;
display: flex;
align-items: center;
justify-content: center;
}

4
src/pages/order/order/components/UserInfo/index.vue
View File

@@ -1,12 +1,12 @@
<template>
<div class="bg-white border-box rounded-10 p-12 mb-12" v-if="hasConsumerData">
<div v-for="(item, index) in consumerList" :key="index">
<div class="flex mb-8 font-size-12">
<div class="flex mb-8 text-[12px]">
<span class="w-60 color-99A0AE">住客姓名</span>
<span class="color-525866">{{ item.visitorName }}</span>
</div>
</div>
<div class="flex font-size-12">
<div class="flex text-[12px]">
<span class="w-60 color-99A0AE">联系电话</span>
<span class="color-525866">{{ contactPhone }}</span>
</div>

34
src/pages/order/order/components/VoucherList/index.vue
View File

@@ -4,39 +4,27 @@
核销凭证列表
</span>
<div
class="flex flex-items-center flex-justify-between py-12"
:class="[
index + 1 === props.orderData.commodityPackageConfig.length
? ''
: 'border-bottom',
]"
v-for="(item, index) in props.orderData.commodityPackageConfig"
:key="item.name"
>
<div class="flex flex-items-center flex-justify-between py-12" :class="[
index + 1 === props.orderData.commodityPackageConfig.length
? ''
: 'border-bottom',
]" v-for="(item, index) in props.orderData.commodityPackageConfig" :key="item.name">
<div class="flex flex-col">
<span class="span-color-900 font-size-16">{{ item.name }}</span>
<div class="flex flex-row mt-8">
<div class="bg-F5F7FA span-color-600 font-size-12 p-4 rounded-4 mr-4">
<div class="bg-F5F7FA span-color-600 text-[12px] p-4 rounded-4 mr-4">
总计{{ item.count }}{{ item.unit }}
</div>
<div
class="bg-theme-color-50 theme-color-500 font-size-12 p-4 rounded-4"
>
<div class="bg-theme-color-50 theme-color-500 text-[12px] p-4 rounded-4">
剩{{ item.count - item.writeOffCount }}{{ item.unit }}可用
</div>
</div>
</div>
<div
class="flex flex-items-center px-14 py-8 rounded-8"
:class="[item.packageStatus === 0 ? 'bg-theme-color-500' : 'bg-gray']"
@click="handleShowQrcode(item, index)"
>
<span v-if="item.packageStatus === 0" class="font-size-14 color-white"
>出示凭证</span
>
<span v-else class="font-size-14 span-color-300">已核销</span>
<div class="flex flex-items-center px-14 py-8 rounded-8"
:class="[item.packageStatus === 0 ? 'bg-theme-color-500' : 'bg-gray']" @click="handleShowQrcode(item, index)">
<span v-if="item.packageStatus === 0" class="text-[14px] color-white">出示凭证</span>
<span v-else class="text-[14px] span-color-300">已核销</span>
</div>
</div>
</div>

4
src/pages/quick/index.vue
View File

@@ -11,7 +11,7 @@
class="bg-white border-box flex flex-items-center p-12">
<div class="in flex flex-items-center">
<span class="font-size-11 font-500 color-99A0AE mr-4">入住</span>
<span class="font-size-14 font-500 color-171717">
<span class="text-[14px] font-500 color-171717">
{{ selectedDate.startDate }}
</span>
</div>
@@ -23,7 +23,7 @@
<div class="out flex flex-items-center">
<span class="font-size-11 font-500 color-99A0AE mr-4">离店</span>
<span class="font-size-14 font-500 color-171717">
<span class="text-[14px] font-500 color-171717">
{{ selectedDate.endDate }}
</span>
</div>