From 653cdd5139f42fdd41af7e8e9457c5eb6d303658 Mon Sep 17 00:00:00 2001
From: DEV_DSW <562304744@qq.com>
Date: Fri, 29 May 2026 10:21:21 +0800
Subject: [PATCH] style: update flex alignment classes and clean up UI styles

Replace all deprecated `flex-items-center` utility classes with standard `items-center` across components. Additionally, update font weight classes from `font-900` to `font-bold`, standardize hex color class syntax to use bracket notation, and remove unused SCSS styles from the SharedVisual component.
---
 src/components/CreateServiceOrder/index.vue   | 15 ++++----
 src/components/DateRangeSection/index.vue     |  8 ++---
 src/components/DetailPopup/index.vue          |  6 ++--
 src/components/Feedback/index.vue             |  9 +++--
 src/components/GoodDetail/index.vue           |  2 +-
 src/components/RefundPopup/index.vue          |  4 +--
 src/components/Stepper/index.vue              |  2 +-
 src/components/SurveyQuestionnaire/index.vue  |  4 +--
 src/components/UseDateRange/index.vue         |  2 +-
 .../components/ConactSection/index.vue        |  6 ++--
 .../components/FooterSection/index.vue        |  8 ++---
 .../booking/components/UserSection/index.vue  |  6 ++--
 src/pages/booking/index.vue                   |  6 ++--
 .../home/components/AnswerComponent/index.vue |  7 ++--
 .../home/components/ChatMoreTips/index.vue    |  2 +-
 .../home/components/ChatTopWelcome/index.vue  |  2 +-
 .../components/FacilityLocationCard/index.vue | 16 ++++-----
 .../home/components/FaqHelpCard/index.vue     | 10 +++---
 .../GeneratorPhotoComponent/index.vue         |  4 +--
 .../components/LongTextGuideCard/index.vue    | 26 +++++++-------
 .../LongTextGuideCardPreview/index.vue        |  8 ++---
 .../components/MapNavigationCard/index.vue    | 10 +++---
 .../home/components/MoreService/index.vue     |  4 +--
 .../home/components/NoticeCard/index.vue      | 20 +++++------
 .../home/components/NoticeMessage/detail.vue  |  2 +-
 .../components/OpenMapComponent/index.vue     |  6 ++--
 .../home/components/PoiCompareCard/index.vue  | 34 +++++++++----------
 .../home/components/PoiDetailCard/index.vue   | 10 +++---
 .../RecommendationListCard/index.vue          |  6 ++--
 .../home/components/RoutePlanCard/index.vue   | 32 ++++++++---------
 .../home/components/ScenicImageCard/index.vue |  6 ++--
 .../components/SharedVisual/ActionRow.vue     |  6 ++--
 .../components/SharedVisual/BadgePill.vue     |  3 +-
 .../components/SharedVisual/DetailShell.vue   | 13 +++----
 .../components/SharedVisual/styles/index.scss | 15 --------
 .../order/components/AmtSection/index.vue     |  8 ++---
 .../order/components/FooterSection/index.vue  |  6 ++--
 .../order/components/GoodsInfo/index.vue      |  2 +-
 .../order/components/VoucherList/index.vue    |  4 +--
 src/pages/quick/index.vue                     |  9 +++--
 40 files changed, 163 insertions(+), 186 deletions(-)

diff --git a/src/components/CreateServiceOrder/index.vue b/src/components/CreateServiceOrder/index.vue
index 87bb933..5e4760f 100644
--- a/src/components/CreateServiceOrder/index.vue
+++ b/src/components/CreateServiceOrder/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="create-service-order">
     <div class="w-full bg-white  border-ff overflow-hidden rounded-20">
-      <div class=" order-header w-vw flex flex-items-center flex-justify-between bg-theme-color-50">
+      <div class=" order-header w-vw flex items-center flex-justify-between bg-theme-color-50">
         <span class="text-[18px] font-medium text-[#171717] text-left ml-12">
           {{ isCallSuccess ? "服务已创建" : "呼叫服务" }}
         </span>
@@ -9,12 +9,12 @@
       </div>
 
       <div v-if="!isCallSuccess" class=" p-[12px]">
-        <div class="bg-F5F7FA  flex flex-items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
+        <div class="bg-F5F7FA  flex items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
           <span class="font-medium line-height-22 mr-20">所在位置</span>
           <input placeholder="请填写所在位置" v-model="roomId" />
         </div>
 
-        <div class="bg-F5F7FA  flex flex-items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
+        <div class="bg-F5F7FA  flex items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
           <span class="font-medium line-height-22 mr-20">联系电话</span>
           <input placeholder="请填写联系电话" v-model="contactPhone" @input="handleContactPhoneInput" />
         </div>
@@ -28,7 +28,7 @@
         <div class="bg-F5F7FA  p-[12px] rounded-10 text-[14px] font-medium text-[#171717] mb-[12px]">
           <div class="font-medium line-height-22 mb-[12px]">照片上传</div>
 
-          <div class="w-80 h-80 bg-white rounded-8 overflow-hidden flex flex-items-center flex-justify-center">
+          <div class="w-80 h-80 bg-white rounded-8 overflow-hidden flex items-center flex-justify-center">
             <div v-if="contentImgUrl" class="w-full h-full relative inline-block">
               <img class="w-full h-full block" :src="contentImgUrl" mode="aspectFill" />
               <uni-icons class="close-btn absolute z-10" type="close" size="20" color="#6A717F"
@@ -36,14 +36,14 @@
               </uni-icons>
             </div>
 
-            <div v-else class="w-full h-full flex flex-items-center flex-justify-center" @click="handleChooseImage">
+            <div v-else class="w-full h-full flex items-center flex-justify-center" @click="handleChooseImage">
               <zn-icon name="zn-camera" size="24" color="#6A717F"></zn-icon>
             </div>
           </div>
         </div>
       </div>
 
-      <div v-else class=" card-content flex flex-items-center p-[12px]">
+      <div v-else class=" card-content flex items-center p-[12px]">
         <div class=" left flex-1 pr-20">
           <div class="text-[12px] text-ink-600 leading-[20px] mb-4">
             所在位置：{{ roomId }}
@@ -59,8 +59,7 @@
         <img v-if="contentImgUrl" class="right rounded-6" :src="contentImgUrl" mode="aspectFill" />
       </div>
 
-      <div
-        class="btn rounded-[5px]0 text-white bg-button flex flex-items-center flex-justify-center ml-12 mr-12 mb-[12px]"
+      <div class="btn rounded-[5px]0 text-white bg-button flex items-center flex-justify-center ml-12 mr-12 mb-[12px]"
         @click="handleCall">
         {{ isCallSuccess ? "查看服务" : "立即呼叫" }}
       </div>
diff --git a/src/components/DateRangeSection/index.vue b/src/components/DateRangeSection/index.vue
index 5a97840..cf79e7c 100644
--- a/src/components/DateRangeSection/index.vue
+++ b/src/components/DateRangeSection/index.vue
@@ -1,18 +1,18 @@
 <template>
-  <div class=" flex flex-items-center flex-justify-between mb-[12px]">
-    <div class="left flex flex-items-center">
+  <div class=" flex items-center flex-justify-between mb-[12px]">
+    <div class="left flex items-center">
       <span class="text-[12px] text-ink-400 mr-[4px]">入住</span>
       <span class="text-[12px] text-[#171717] mr-16">
         {{ selectedDate.startDate }}
       </span>
-      <span class="total  rounded-[5px]0 flex flex-items-center text-[11px] color-43669A relative">{{
+      <span class="total  rounded-[5px]0 flex items-center text-[11px] color-43669A relative">{{
         selectedDate.totalDays }}晚</span>
       <span class="text-[12px] text-ink-400 ml-16">离店</span>
       <span class="text-[12px] text-[#171717] ml-4">
         {{ selectedDate.endDate }}
       </span>
     </div>
-    <div class="flex flex-items-center" v-if="showBtn" @click="emit('click')">
+    <div class="flex items-center" v-if="showBtn" @click="emit('click')">
       <span class="text-[12px] theme-color-500 leading-[16px]">房间详情</span>
       <van-icon name="arrow-right" size="15" color="#99A0AE" />
     </div>
diff --git a/src/components/DetailPopup/index.vue b/src/components/DetailPopup/index.vue
index 41dfdd5..ffeeda9 100644
--- a/src/components/DetailPopup/index.vue
+++ b/src/components/DetailPopup/index.vue
@@ -1,7 +1,7 @@
 <template>
   <uni-popup ref="popupRef" type="bottom" :safe-area="false" @maskClick="handleClose">
     <div class="refund-popup bg-F5F7FA ">
-      <div class=" flex flex-items-center justify-between pt-[12px] pb-[12px] relative">
+      <div class=" flex items-center justify-between pt-[12px] pb-[12px] relative">
         <div class="flex-1 text-[16px] text-[#171717] leading-[24px] text-center">
           明细详情
         </div>
@@ -10,11 +10,11 @@
       </div>
       <!-- 内容区域 -->
       <div class="rounded-[12px] bg-white ml-12 mr-12 mb-40">
-        <div class=" border-bottom flex flex-items-center flex-justify-between pt-[12px] pb-[12px] ml-12 mr-12">
+        <div class=" border-bottom flex items-center flex-justify-between pt-[12px] pb-[12px] ml-12 mr-12">
           <span class="text-[16px] font-medium text-[#171717]">在线支付</span>
           <span class="text-[14px] text-[#171717]">239</span>
         </div>
-        <div class=" flex flex-items-center flex-justify-between pt-[12px] pb-[12px] ml-12 mr-12">
+        <div class=" flex items-center flex-justify-between pt-[12px] pb-[12px] ml-12 mr-12">
           <span class="text-[16px] font-medium text-[#171717]">房费</span>
           <span class="text-[14px] text-[#171717]">239</span>
         </div>
diff --git a/src/components/Feedback/index.vue b/src/components/Feedback/index.vue
index 0fe66b3..f531bb4 100644
--- a/src/components/Feedback/index.vue
+++ b/src/components/Feedback/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="create-service-order">
     <div class="w-full bg-white  border-ff overflow-hidden rounded-20">
-      <div class=" order-header w-vw flex flex-items-center flex-justify-between bg-theme-color-50">
+      <div class=" order-header w-vw flex items-center flex-justify-between bg-theme-color-50">
         <span class="text-[18px] font-medium text-[#171717] text-left ml-12">
           {{ isCallSuccess ? "反馈已创建" : "反馈意见" }}
         </span>
@@ -9,7 +9,7 @@
       </div>
 
       <div v-if="!isCallSuccess" class=" p-[12px]">
-        <div class="bg-F5F7FA  flex flex-items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
+        <div class="bg-F5F7FA  flex items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
           <span class="font-medium line-height-22 mr-20">联系电话</span>
           <input placeholder="请填写联系电话" v-model="contactPhone" />
         </div>
@@ -19,8 +19,7 @@
             v-model="contactText" />
         </div>
 
-        <div class="btn rounded-[5px]0 text-white bg-button flex flex-items-center flex-justify-center"
-          @click="handleCall">
+        <div class="btn rounded-[5px]0 text-white bg-button flex items-center flex-justify-center" @click="handleCall">
           立即提交
         </div>
       </div>
@@ -34,7 +33,7 @@
         </div>
       </div>
 
-      <div class="footer-help flex flex-items-center pl-12 mb-[12px]">
+      <div class="footer-help flex items-center pl-12 mb-[12px]">
         <img class="help-icon mr-[4px]" src="./images/icon_volume.png" />
         <span class="text-[12px] font-medium color-FA7319">
           {{ appName }}收到您的意见将第一时间为您处理!
diff --git a/src/components/GoodDetail/index.vue b/src/components/GoodDetail/index.vue
index f0d246d..3c9d67c 100644
--- a/src/components/GoodDetail/index.vue
+++ b/src/components/GoodDetail/index.vue
@@ -11,7 +11,7 @@
               .commodityPurchaseInstructionModuleEntityList.length -
             1,
         }">
-          <div class="flex flex-items-center flex-row flex-shrink-0 mr-8">
+          <div class="flex items-center flex-row flex-shrink-0 mr-[8px]">
             <zn-icon :name="moduleItem.moduleIcon" size="20" color="#333"></zn-icon>
             <span class="ml-4 text-[14px] text-[#171717] leading-[20px]">
               {{ moduleItem.moduleTitle }}
diff --git a/src/components/RefundPopup/index.vue b/src/components/RefundPopup/index.vue
index 01ad148..7134f2b 100644
--- a/src/components/RefundPopup/index.vue
+++ b/src/components/RefundPopup/index.vue
@@ -1,7 +1,7 @@
 <template>
   <uni-popup ref="popupRef" type="bottom" :safe-area="false" @maskClick="handleClose">
     <div class="refund-popup bg-F5F7FA ">
-      <div class=" flex flex-items-center justify-between pt-[12px] pb-[12px] relative">
+      <div class=" flex items-center justify-between pt-[12px] pb-[12px] relative">
         <div class="flex-1 text-[16px] text-[#171717] leading-[24px] text-center">
           取消政策
         </div>
@@ -10,7 +10,7 @@
       </div>
       <!-- 内容区域 -->
       <div class=" rounded-[12px] bg-white p-[12px] ml-12 mr-12 mb-40">
-        <div class="flex flex-items-center mb-8">
+        <div class="flex items-center mb-8">
           <uni-icons fontFamily="znicons" size="20" color="#333">
             {{ iconsMap["zn-refund"] }}
           </uni-icons>
diff --git a/src/components/Stepper/index.vue b/src/components/Stepper/index.vue
index f9df8ff..1642add 100644
--- a/src/components/Stepper/index.vue
+++ b/src/components/Stepper/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="stepper-wrapper  flex flex-items-center rounded-8">
+  <div class="stepper-wrapper  flex items-center rounded-8">
     <uni-icons type="minus" size="24" color="#D1D1D1" @click="decrease" />
     <text class="stepper-text text-center text-[14px] font-medium text-black ml-4 mr-[4px]">
       {{ value }} {{ unit }}
diff --git a/src/components/SurveyQuestionnaire/index.vue b/src/components/SurveyQuestionnaire/index.vue
index e10fe18..a74ac7a 100644
--- a/src/components/SurveyQuestionnaire/index.vue
+++ b/src/components/SurveyQuestionnaire/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="survey-questionnaire w-vw-24">
     <div class="bg-white  border-ff overflow-hidden rounded-20">
-      <div class=" flex flex-items-center flex-justify-between bg-theme-color-50">
+      <div class=" flex items-center flex-justify-between bg-theme-color-50">
         <span class="text-[18px] font-medium text-[#171717] text-left ml-12">
           调查问卷
         </span>
@@ -10,7 +10,7 @@
 
       <img class="w-full" :src="surveyData.bannerUrl" mode="widthFix" />
 
-      <div class="h-44 m-[12px] rounded-[5px]0 bg-button text-white flex flex-items-center flex-justify-center"
+      <div class="h-44 m-[12px] rounded-[5px]0 bg-button text-white flex items-center flex-justify-center"
         @click="handleCall">
         前往填写
       </div>
diff --git a/src/components/UseDateRange/index.vue b/src/components/UseDateRange/index.vue
index b1ee9d8..654bed3 100644
--- a/src/components/UseDateRange/index.vue
+++ b/src/components/UseDateRange/index.vue
@@ -3,7 +3,7 @@
     <div class=" text-[16px] font-medium text-black leading-[24px] p-[12px]">
       使用日期
     </div>
-    <div class="flex flex-items-center ">
+    <div class="flex items-center ">
       <scroll-div class="date-scroll" scroll-x>
         <div class="date-list">
           <block v-for="item in openDateRangeList" :key="item.date">
diff --git a/src/pages/booking/components/ConactSection/index.vue b/src/pages/booking/components/ConactSection/index.vue
index 17487f1..46c9ebc 100644
--- a/src/pages/booking/components/ConactSection/index.vue
+++ b/src/pages/booking/components/ConactSection/index.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- 选择数量 -->
-  <div class=" bg-white p-[12px] rounded-[12px] flex flex-items-center mb-[12px]">
+  <div class=" bg-white p-[12px] rounded-[12px] flex items-center mb-[12px]">
     <div class="flex-1">
       <div class="text-[16px] font-medium text-black leading-[24px]">选择数量</div>
       <div class="text-[12px] color-A3A3A3 leading-[16px]">请选择套餐数量</div>
@@ -19,7 +19,7 @@
     <div class=" border-bottom text-[16px] font-medium text-black leading-[24px] p-[12px]">
       联系方式
     </div>
-    <div class="flex flex-items-center  p-[12px]">
+    <div class="flex items-center  p-[12px]">
       <div class="text-[14px] font-medium text-ink-600 mr-12">联系人姓名</div>
       <div class="right">
         <input class=" px-4 py-2 text-[15px] text-black leading-[20px]" v-model.trim="userFormList[0].visitorName"
@@ -27,7 +27,7 @@
       </div>
     </div>
 
-    <div class="flex flex-items-center  p-[12px]">
+    <div class="flex items-center  p-[12px]">
       <div class="text-[14px] font-medium text-ink-600 mr-12">手机号码</div>
       <div class="right">
         <input class=" px-4 py-2 text-[15px] text-black leading-[20px]" v-model.trim="userFormList[0].contactPhone"
diff --git a/src/pages/booking/components/FooterSection/index.vue b/src/pages/booking/components/FooterSection/index.vue
index 41ff5b5..50d1b52 100644
--- a/src/pages/booking/components/FooterSection/index.vue
+++ b/src/pages/booking/components/FooterSection/index.vue
@@ -1,13 +1,13 @@
 <template>
-  <div class="booking-footer  bg-white flex flex-items-center font-family-misans-vf">
-    <span class="amt font-size-20 font-bold color-FF3D60 line-height-28 flex flex-items-center mr-8">
+  <div class="booking-footer  bg-white flex items-center font-family-misans-vf">
+    <span class="amt font-size-20 font-bold color-FF3D60 line-height-28 flex items-center mr-[8px]">
       {{ totalAmt }}
     </span>
-    <!-- <div class="flex flex-items-center" @click="emit('detailClick')">
+    <!-- <div class="flex items-center" @click="emit('detailClick')">
       <span class="text-[12px] color-A3A3A3 mr-[4px]">明细</span>
       <uni-icons type="up" size="16" color="#A3A3A3" />
     </div> -->
-    <div class="btn  rounded-10 flex flex-items-center ml-auto pl-8" @click="handleBooking">
+    <div class="btn  rounded-10 flex items-center ml-auto pl-8" @click="handleBooking">
       <img class="icon" src="https://oss.nianxx.cn/mp/static/version_101/common/btn.png" />
       <span class="text-[16px] font-medium text-white">立即支付</span>
     </div>
diff --git a/src/pages/booking/components/UserSection/index.vue b/src/pages/booking/components/UserSection/index.vue
index b9a93b5..71535f5 100644
--- a/src/pages/booking/components/UserSection/index.vue
+++ b/src/pages/booking/components/UserSection/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="bg-white rounded-[12px] overflow-hidden mb-[12px]">
-    <div class="flex flex-items-center  p-[12px] border-bottom">
+    <div class="flex items-center  p-[12px] border-bottom">
       <div class="text-[16px] font-medium text-black leading-[24px] flex-1">
         入住信息
       </div>
@@ -10,7 +10,7 @@
     </div>
 
     <div class=" pl-12 pr-12">
-      <div class=" border-bottom pt-[12px] pb-[12px] flex flex-items-center" v-for="(item, index) in userFormList"
+      <div class=" border-bottom pt-[12px] pb-[12px] flex items-center" v-for="(item, index) in userFormList"
         :key="index">
         <div class="text-[14px] font-medium text-ink-600 mr-12">住客姓名</div>
         <div class="right">
@@ -19,7 +19,7 @@
         </div>
       </div>
 
-      <div class="flex flex-items-center  pt-[12px] pb-[12px]">
+      <div class="flex items-center  pt-[12px] pb-[12px]">
         <div class="text-[14px] font-medium text-ink-600 mr-12">联系手机</div>
         <div class="right">
           <input class=" px-4 py-2 text-[15px] text-black leading-[20px]" v-model.trim="userFormList[0].contactPhone"
diff --git a/src/pages/booking/index.vue b/src/pages/booking/index.vue
index b69d0fb..bc7fc09 100644
--- a/src/pages/booking/index.vue
+++ b/src/pages/booking/index.vue
@@ -23,7 +23,7 @@
           </div>
 
           <!-- 权益部分 -->
-          <div class="flex flex-items-center mb-8">
+          <div class="flex items-center mb-8">
             <span
               class="bg-[#f7f7f7]  rounded-[4px] text-[11px] text-ink-600 mr-[4px] pt-[4px] pb-[4px] pl-[6px] pr-[6px]"
               v-for="(item, index) in orderData.commodityFacilityList" :key="index">
@@ -32,9 +32,9 @@
           </div>
         </div>
 
-        <div class=" flex flex-items-center flex-justify-between pt-[12px]">
+        <div class=" flex items-center flex-justify-between pt-[12px]">
           <span class="text-[12px] text-ink-600 line-height-18">取消政策及说明</span>
-          <div class="flex flex-items-center">
+          <div class="flex items-center">
             <span class="text-[12px] theme-color-500 leading-[16px]" @click="refundVisible = true">取消政策</span>
             <uni-icons type="right" size="15" color="#99A0AE" />
           </div>
diff --git a/src/pages/home/components/AnswerComponent/index.vue b/src/pages/home/components/AnswerComponent/index.vue
index 8199b90..83fbae3 100644
--- a/src/pages/home/components/AnswerComponent/index.vue
+++ b/src/pages/home/components/AnswerComponent/index.vue
@@ -2,7 +2,7 @@
   <div class="w-full bg-white  border-ff overflow-hidden rounded-20 flex flex-col">
     <!-- 占位撑开 -->
     <div class="w-vw"></div>
-    <div class="flex flex-col px-16 pt-16 pb-[12px] ">
+    <div class="flex flex-col px-[16px] pt-16 pb-[12px] ">
       <div v-if="tag" class="long-answer-tag">{{ tag }}</div>
       <div v-if="title" class="flex flex-row flex-items-start flex-justify-start mb-4">
         <uni-icons class="icon-active" type="fire-filled" size="18" color="opacity" />
@@ -13,12 +13,11 @@
         <ChatMarkdown :text="processedContent" />
       </div>
       <!-- 超过3行时显示...提示 -->
-      <div v-if="!finish" class="flex flex-row flex-items-center mt-8">
+      <div v-if="!finish" class="flex flex-row items-center mt-8">
         <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">
+      <div v-if="isOverflow" class="flex flex-row items-center flex-justify-between mt-4" @click="lookDetailAction">
         <span class="text-[12px] font-400 theme-color-500 mr-[4px]">查看完整{{ tag }}</span>
         <uni-icons class="icon-active" type="right" size="14" color="opacity"></uni-icons>
       </div>
diff --git a/src/pages/home/components/ChatMoreTips/index.vue b/src/pages/home/components/ChatMoreTips/index.vue
index 1b6b9e9..02f64bd 100644
--- a/src/pages/home/components/ChatMoreTips/index.vue
+++ b/src/pages/home/components/ChatMoreTips/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="more-tips bg-white ">
     <div class="font-size-0 whitespace-nowrap scroll-x">
-      <div class="more-tips-item  inline-block mr-8" v-for="(item, index) in guideWords" :key="index">
+      <div class="more-tips-item  inline-block mr-[8px]" v-for="(item, index) in guideWords" :key="index">
         <span :class="['font-medium text-[12px] text-center', `color-${index}`]" @click="sendReply(item)">
           {{ item }}
         </span>
diff --git a/src/pages/home/components/ChatTopWelcome/index.vue b/src/pages/home/components/ChatTopWelcome/index.vue
index f13b89a..b5c1056 100644
--- a/src/pages/home/components/ChatTopWelcome/index.vue
+++ b/src/pages/home/components/ChatTopWelcome/index.vue
@@ -2,7 +2,7 @@ v
 <template>
   <div class="welcome-content  p-[12px]">
     <div class="wrap rounded-20">
-      <div class="flex flex-items-center flex-justify-between  pl-12 pr-12">
+      <div class="flex items-center flex-justify-between  pl-12 pr-12">
         <SpriteAnimator :src="spriteStyle.ipLargeImage" :frameWidth="spriteStyle.frameWidth"
           :frameHeight="spriteStyle.frameHeight" :totalFrames="spriteStyle.totalFrames" :columns="spriteStyle.columns"
           :displayWidth="spriteStyle.displayWidth" :fps="16" />
diff --git a/src/pages/home/components/FacilityLocationCard/index.vue b/src/pages/home/components/FacilityLocationCard/index.vue
index d1fcdbe..a34d46f 100644
--- a/src/pages/home/components/FacilityLocationCard/index.vue
+++ b/src/pages/home/components/FacilityLocationCard/index.vue
@@ -3,32 +3,32 @@
     <img class="facility-location-card__image block w-full" :src="data.image" mode="aspectFill" />
 
     <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 text-[12px] font-900">
+      <div class="facility-location-card__title-row flex items-center">
+        <div class="facility-location-card__badge color-2563EB bg-EFF6FF text-[12px] font-bold">
           {{ type.text }}
         </div>
-        <div class="facility-location-card__title color-1E293B text-[18px] font-900 truncate">
+        <div class="facility-location-card__title text-[#1e293b] text-[18px] font-bold truncate">
           {{ data.title }}
         </div>
       </div>
 
-      <div class="facility-location-card__distance flex flex-items-center color-94A3B8 text-[14px] font-900">
+      <div class="facility-location-card__distance flex items-center color-94A3B8 text-[14px] font-bold">
         <span class="facility-location-card__distance-icon">{{ distance.icon }}</span>
         <span>{{ distance.text }}</span>
       </div>
 
-      <div class="facility-location-card__location bg-F8FAFC rounded-20">
-        <div class="facility-location-card__location-label flex flex-items-center color-64748B text-[13px] font-900">
+      <div class="facility-location-card__location bg-[#f8fafc] rounded-20">
+        <div class="facility-location-card__location-label flex items-center color-64748B text-[13px] font-bold">
           <span class="facility-location-card__location-dot">{{ location.icon }}</span>
           <span>{{ location.label }}</span>
         </div>
-        <div class="facility-location-card__location-text color-1E293B text-[16px] font-900">
+        <div class="facility-location-card__location-text text-[#1e293b] text-[16px] font-bold">
           {{ location.text }}
         </div>
       </div>
 
       <div
-        class="facility-location-card__button flex flex-items-center flex-justify-center bg-0F172A text-white text-[18px] font-900"
+        class="facility-location-card__button flex items-center flex-justify-center bg-0F172A text-white text-[18px] font-bold"
         :class="{ 'is-disabled': disabled }" @click="handleAction">
         <span class="facility-location-card__button-icon">{{ action.icon }}</span>
         <span>{{ action.text }}</span>
diff --git a/src/pages/home/components/FaqHelpCard/index.vue b/src/pages/home/components/FaqHelpCard/index.vue
index ecfb2ec..7ff42cf 100644
--- a/src/pages/home/components/FaqHelpCard/index.vue
+++ b/src/pages/home/components/FaqHelpCard/index.vue
@@ -1,10 +1,10 @@
 <template>
   <div class="faq-help-card bg-white rounded-24 w-full">
-    <div class="faq-help-card__header flex flex-items-center">
-      <div class="faq-help-card__icon flex flex-items-center flex-justify-center rounded-full text-[16px] font-900">
+    <div class="faq-help-card__header flex items-center">
+      <div class="faq-help-card__icon flex items-center flex-justify-center rounded-full text-[16px] font-bold">
         {{ data.icon }}
       </div>
-      <div class="faq-help-card__title color-1E293B font-size-20 font-900">
+      <div class="faq-help-card__title text-[#1e293b] font-size-20 font-bold">
         {{ data.title }}
       </div>
     </div>
@@ -12,9 +12,9 @@
     <div class="faq-help-card__divider"></div>
 
     <div class="faq-help-card__list">
-      <div v-for="item in questions" :key="item.id || item.text" class="faq-help-card__item flex flex-items-center"
+      <div v-for="item in questions" :key="item.id || item.text" class="faq-help-card__item flex items-center"
         :class="{ 'is-disabled': disabled }" @click="handleSelect(item)">
-        <div class="faq-help-card__question color-475569 text-[18px] font-900 truncate flex-1">
+        <div class="faq-help-card__question color-475569 text-[18px] font-bold truncate flex-1">
           {{ item.text }}
         </div>
         <uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
diff --git a/src/pages/home/components/GeneratorPhotoComponent/index.vue b/src/pages/home/components/GeneratorPhotoComponent/index.vue
index 63b1c1f..6f5f9ab 100644
--- a/src/pages/home/components/GeneratorPhotoComponent/index.vue
+++ b/src/pages/home/components/GeneratorPhotoComponent/index.vue
@@ -3,7 +3,7 @@
     <!-- 占位撑开 -->
     <div class="w-vw"></div>
     <div class="content flex flex-col m-4  rounded-24">
-      <div class="flex flex-col p-6  flex-items-center justify-center">
+      <div class="flex flex-col p-6  items-center justify-center">
         <img class="w-full rounded-20" :src="props.toolCall.componentNameParams.background" mode="widthFix" />
 
         <!-- 左上角标签 -->
@@ -21,7 +21,7 @@
         <div class="w-full  px-12 pb-8 flex flex-row" @click="jumpClick">
           <div class="btn-bg w-full  p-4 rounded-24 flex flex-row">
             <div
-              class="btn-bg-sub w-full  p-16 rounded-20 flex flex-row flex-items-center flex-justify-center text-white text-center text-[18px] font-800">
+              class="btn-bg-sub w-full  p-16 rounded-20 flex flex-row items-center flex-justify-center text-white text-center text-[18px] font-800">
               {{ props.toolCall.componentNameParams.buttonName }}
             </div>
           </div>
diff --git a/src/pages/home/components/LongTextGuideCard/index.vue b/src/pages/home/components/LongTextGuideCard/index.vue
index 9a52922..0e3a99b 100644
--- a/src/pages/home/components/LongTextGuideCard/index.vue
+++ b/src/pages/home/components/LongTextGuideCard/index.vue
@@ -3,16 +3,16 @@
     <div v-if="mode === 'list'" class="long-text-guide-card__list w-full">
       <div v-for="item in cards" :key="item.id" class="long-text-guide-card__summary-card bg-white rounded-24 "
         :class="{ 'is-disabled': disabled }" @click="openDetail(item)">
-        <div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
+        <div class="long-text-guide-card__badge text-[12px] font-bold" :class="`is-${item.badgeTone}`">
           {{ item.badge }}
         </div>
-        <div class="long-text-guide-card__summary-title color-1E293B text-[18px] font-900">
+        <div class="long-text-guide-card__summary-title text-[#1e293b] text-[18px] font-bold">
           {{ item.title }}
         </div>
         <div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-medium ellipsis-2">
           {{ item.summary }}
         </div>
-        <div class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
+        <div class="long-text-guide-card__summary-footer flex items-center flex-justify-between">
           <text class="color-CBD5E1 text-[12px] font-800">{{ item.footer }}</text>
           <uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
         </div>
@@ -20,15 +20,15 @@
     </div>
 
     <div v-else class="long-text-guide-card__detail-card bg-white rounded-24  overflow-hidden">
-      <div class="long-text-guide-card__detail-header flex flex-items-center border-bottom-F1F5F9">
-        <div class="long-text-guide-card__back flex flex-items-center flex-justify-center rounded-full font-700"
+      <div class="long-text-guide-card__detail-header flex items-center border-bottom-F1F5F9">
+        <div class="long-text-guide-card__back flex items-center flex-justify-center rounded-full font-700"
           @click="closeDetail">
           <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
         </div>
-        <div class="long-text-guide-card__detail-title color-1E293B text-[18px] font-900 truncate">
+        <div class="long-text-guide-card__detail-title text-[#1e293b] text-[18px] font-bold truncate">
           {{ activeItem.title }}
         </div>
-        <div class="long-text-guide-card__badge long-text-guide-card__detail-badge text-[12px] font-900"
+        <div class="long-text-guide-card__badge long-text-guide-card__detail-badge text-[12px] font-bold"
           :class="`is-${activeItem.badgeTone}`">
           {{ activeItem.badge }}
         </div>
@@ -49,7 +49,7 @@
         <image v-if="activeItem.image" class="long-text-guide-card__main-image w-full rounded-14 block"
           :src="activeItem.image" mode="aspectFill" />
 
-        <div class="long-text-guide-card__section-title color-1E293B text-[16px] font-900">
+        <div class="long-text-guide-card__section-title text-[#1e293b] text-[16px] font-bold">
           {{ activeItem.sectionTitle }}
         </div>
         <div class="long-text-guide-card__tip-block bg-ECFDF5">
@@ -79,16 +79,16 @@
           <div class="long-text-guide-card__map-image-wrap relative">
             <img class="long-text-guide-card__map-image w-full block" :src="activeItem.action.image"
               mode="aspectFill" />
-            <div class="long-text-guide-card__map-tag text-white font-size-10 font-900">
+            <div class="long-text-guide-card__map-tag text-white font-size-10 font-bold">
               {{ activeItem.action.tag }}
             </div>
           </div>
-          <div class="long-text-guide-card__map-bar flex flex-items-center bg-white">
+          <div class="long-text-guide-card__map-bar flex items-center bg-white">
             <div class="flex-1">
-              <div class="color-1E293B text-[15px] font-900">{{ activeItem.action.title }}</div>
+              <div class="text-[#1e293b] text-[15px] font-bold">{{ activeItem.action.title }}</div>
               <div class="color-94A3B8 text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
             </div>
-            <div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-900"
+            <div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-bold"
               @click="handleAction(activeItem)">
               {{ activeItem.action.buttonText }}
             </div>
@@ -104,7 +104,7 @@
           <img class="long-text-guide-card__photo-image w-full block" :src="activeItem.action.image"
             mode="aspectFill" />
           <div
-            class="long-text-guide-card__expand flex flex-items-center flex-justify-center rounded-full text-white text-[18px] font-900">
+            class="long-text-guide-card__expand flex items-center flex-justify-center rounded-full text-white text-[18px] font-bold">
             ↗
           </div>
         </div>
diff --git a/src/pages/home/components/LongTextGuideCardPreview/index.vue b/src/pages/home/components/LongTextGuideCardPreview/index.vue
index a4a6475..c7b0afd 100644
--- a/src/pages/home/components/LongTextGuideCardPreview/index.vue
+++ b/src/pages/home/components/LongTextGuideCardPreview/index.vue
@@ -2,19 +2,19 @@
   <div class="w-full bg-white  border-ff overflow-hidden rounded-20 flex flex-col">
     <!-- 占位撑开 -->
     <div class="w-vw"></div>
-    <div class="flex flex-col px-16 pt-16 pb-[12px] " @click="openDetail(item)">
+    <div class="flex flex-col px-[16px] pt-16 pb-[12px] " @click="openDetail(item)">
 
-      <div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
+      <div class="long-text-guide-card__badge text-[12px] font-bold" :class="`is-${item.badgeTone}`">
         {{ item.badge }}
       </div>
 
-      <div class="long-text-guide-card__summary-title color-1E293B text-[18px] font-900">
+      <div class="long-text-guide-card__summary-title text-[#1e293b] text-[18px] font-bold">
         {{ item.title }}
       </div>
       <div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-medium ellipsis-2">
         {{ item.summary }}
       </div>
-      <div class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
+      <div class="long-text-guide-card__summary-footer flex items-center flex-justify-between">
         <span class="color-CBD5E1 text-[12px] font-800">{{ item.footer }}</span>
         <uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
       </div>
diff --git a/src/pages/home/components/MapNavigationCard/index.vue b/src/pages/home/components/MapNavigationCard/index.vue
index f83cae0..fc08593 100644
--- a/src/pages/home/components/MapNavigationCard/index.vue
+++ b/src/pages/home/components/MapNavigationCard/index.vue
@@ -2,23 +2,23 @@
   <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 text-white text-[12px] font-900">
+      <div class="map-navigation-card__badge flex items-center text-white text-[12px] font-bold">
         <span class="map-navigation-card__badge-icon">{{ badge.icon }}</span>
         <span>{{ badge.text }}</span>
       </div>
     </div>
 
-    <div class="map-navigation-card__content flex flex-items-center">
+    <div class="map-navigation-card__content flex items-center">
       <div class="map-navigation-card__info flex-1">
-        <div class="map-navigation-card__title color-1E293B text-[18px] font-900 truncate">
+        <div class="map-navigation-card__title text-[#1e293b] text-[18px] font-bold truncate">
           {{ data.title }}
         </div>
-        <div class="map-navigation-card__distance color-94A3B8 text-[14px] font-900 truncate">
+        <div class="map-navigation-card__distance color-94A3B8 text-[14px] font-bold truncate">
           {{ data.distance }}
         </div>
       </div>
       <div
-        class="map-navigation-card__button flex flex-items-center flex-justify-center bg-0F172A text-white text-[18px] font-900"
+        class="map-navigation-card__button flex items-center flex-justify-center bg-0F172A text-white text-[18px] font-bold"
         :class="{ 'is-disabled': disabled }" @click="handleAction">
         <span class="map-navigation-card__button-icon">{{ action.icon }}</span>
         <span>{{ action.text }}</span>
diff --git a/src/pages/home/components/MoreService/index.vue b/src/pages/home/components/MoreService/index.vue
index ba7ab0a..a3f528c 100644
--- a/src/pages/home/components/MoreService/index.vue
+++ b/src/pages/home/components/MoreService/index.vue
@@ -1,14 +1,14 @@
 <template>
   <van-popup ref="popup" position="bottom" v-model:show="show">
     <div class="popup-content  pt-[12px] pl-12 pr-12">
-      <div class="header flex flex-items-center pb-[12px]">
+      <div class="header flex items-center pb-[12px]">
         <div class="title flex-1 text-center text-[17px] text-black font-medium ml-24">更多服务</div>
         <van-icon name="cross" size="24" color="#CACFD8" @click="close" />
       </div>
 
       <div class="list bg-white  pl-20 pr-20">
         <div class="item  border-bottom pt-20 pb-20" v-for="(item, index) in list" :key="index">
-          <div class="flex flex-items-center flex-justify-center">
+          <div class="flex items-center flex-justify-center">
             <img v-if="item.icon" class="left" :src="item.icon" />
             <div class="center flex-1">
               <div class="text-[16px] text-black leading-[24px] font-medium">
diff --git a/src/pages/home/components/NoticeCard/index.vue b/src/pages/home/components/NoticeCard/index.vue
index 7421547..3d1f989 100644
--- a/src/pages/home/components/NoticeCard/index.vue
+++ b/src/pages/home/components/NoticeCard/index.vue
@@ -1,17 +1,17 @@
 <template>
   <div class="notice-card w-full">
     <div v-if="!detailOpen" class="notice-card__summary bg-FFFBEB rounded-24 w-full">
-      <div class="notice-card__summary-title color-B45309 text-[16px] font-900">
+      <div class="notice-card__summary-title color-B45309 text-[16px] font-bold">
         {{ summary.title }}
       </div>
-      <div class="notice-card__summary-content color-D97706 text-[14px] font-900">
+      <div class="notice-card__summary-content color-D97706 text-[14px] font-bold">
         {{ summary.content }}
       </div>
-      <div class="notice-card__summary-footer flex flex-items-center flex-justify-between">
-        <div class="notice-card__summary-time color-D97706 text-[12px] font-900">
+      <div class="notice-card__summary-footer flex items-center flex-justify-between">
+        <div class="notice-card__summary-time color-D97706 text-[12px] font-bold">
           {{ summary.publishTime }}
         </div>
-        <div class="notice-card__summary-link color-B45309 text-[14px] font-900" :class="{ 'is-disabled': disabled }"
+        <div class="notice-card__summary-link color-B45309 text-[14px] font-bold" :class="{ 'is-disabled': disabled }"
           @click="openDetail">
           {{ summary.actionText }}
         </div>
@@ -19,12 +19,12 @@
     </div>
 
     <div v-else class="notice-card__detail bg-white rounded-24 overflow-hidden w-full">
-      <div class="notice-card__detail-head flex flex-items-center">
-        <div class="notice-card__back flex flex-items-center flex-justify-center rounded-full flex-shrink-0"
+      <div class="notice-card__detail-head flex items-center">
+        <div class="notice-card__back flex items-center flex-justify-center rounded-full flex-shrink-0"
           @click="closeDetail">
           <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
         </div>
-        <div class="notice-card__head-title color-1E293B text-[18px] font-900">
+        <div class="notice-card__head-title text-[#1e293b] text-[18px] font-bold">
           {{ detail.navTitle }}
         </div>
       </div>
@@ -32,10 +32,10 @@
       <image class="notice-card__image block w-full" :src="detail.image" mode="aspectFill" />
 
       <div class="notice-card__detail-body">
-        <div class="notice-card__detail-title color-1E293B font-size-20 font-900">
+        <div class="notice-card__detail-title text-[#1e293b] font-size-20 font-bold">
           {{ detail.title }}
         </div>
-        <div class="notice-card__time-pill flex flex-items-center bg-F8FAFC color-475569 text-[13px] font-900">
+        <div class="notice-card__time-pill flex items-center bg-[#f8fafc] color-475569 text-[13px] font-bold">
           <span class="notice-card__time-icon">{{ detail.timeIcon }}</span>
           <span>{{ detail.publishTime }}</span>
         </div>
diff --git a/src/pages/home/components/NoticeMessage/detail.vue b/src/pages/home/components/NoticeMessage/detail.vue
index cd56b48..7b843d3 100644
--- a/src/pages/home/components/NoticeMessage/detail.vue
+++ b/src/pages/home/components/NoticeMessage/detail.vue
@@ -13,7 +13,7 @@
         <div class="pt-16 px-12 pb-24 ">
           <div class="text-[#171717] text-[16px] font-weight-600">{{ detailTitle }}</div>
 
-          <div v-if="publishTime" class="notice-time-tag flex flex-row flex-items-center mt-[16px]">
+          <div v-if="publishTime" class="notice-time-tag flex flex-row items-center mt-[16px]">
             <uni-icons type="clock" size="18" color="#5A6780" />
             <span class="text-[#171717] text-[12px] font-weight-600 ml-8">发布时间：{{ publishTime }}</span>
           </div>
diff --git a/src/pages/home/components/OpenMapComponent/index.vue b/src/pages/home/components/OpenMapComponent/index.vue
index 57e8570..17a70e6 100644
--- a/src/pages/home/components/OpenMapComponent/index.vue
+++ b/src/pages/home/components/OpenMapComponent/index.vue
@@ -2,9 +2,9 @@
     <div class="w-full bg-white  border-ff overflow-hidden rounded-20 flex flex-col">
         <!-- 占位撑开 -->
         <div class="w-vw"></div>
-        <div class="flex flex-items-center flex-justify-between p-[12px] " @click="openMap">
+        <div class="flex items-center flex-justify-between p-[12px] " @click="openMap">
             <div class="rounded-[16px] p-16 bg-theme-color-50">
-                <div class="w-32 h-32 rounded-full bg-white flex flex-items-center flex-justify-center">
+                <div class="w-32 h-32 rounded-full bg-white flex items-center flex-justify-center">
                     <uni-icons type="location" size="16" color="#171717" />
                 </div>
             </div>
@@ -12,7 +12,7 @@
                 <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">
+            <div class="ml-12 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" />
             </div>
         </div>
diff --git a/src/pages/home/components/PoiCompareCard/index.vue b/src/pages/home/components/PoiCompareCard/index.vue
index 75c6c72..ca379b1 100644
--- a/src/pages/home/components/PoiCompareCard/index.vue
+++ b/src/pages/home/components/PoiCompareCard/index.vue
@@ -1,11 +1,11 @@
 <template>
   <div class="poi-compare-card w-full">
     <div v-if="!isDetail" class="poi-compare-card__overdiv bg-white rounded-24 overflow-hidden">
-      <div class="poi-compare-card__head flex flex-items-center">
-        <div class="poi-compare-card__mark flex flex-items-center flex-justify-center rounded-full flex-shrink-0">
+      <div class="poi-compare-card__head flex items-center">
+        <div class="poi-compare-card__mark flex items-center flex-justify-center rounded-full flex-shrink-0">
           {{ data.icon }}
         </div>
-        <div class="poi-compare-card__title color-1E293B text-[18px] font-900 truncate flex-1">
+        <div class="poi-compare-card__title text-[#1e293b] text-[18px] font-bold truncate flex-1">
           {{ data.title }}
         </div>
       </div>
@@ -18,11 +18,11 @@
             <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 text-[12px] font-900"
+            <div v-if="field.tone" class="poi-compare-card__chip text-[12px] font-bold"
               :class="getToneClass(field.tone)">
               {{ field.value }}
             </div>
-            <div v-else class="poi-compare-card__field-value color-1E293B text-[14px] font-900">
+            <div v-else class="poi-compare-card__field-value text-[#1e293b] text-[14px] font-bold">
               {{ field.value }}
             </div>
           </div>
@@ -30,22 +30,22 @@
       </div>
 
       <div
-        class="poi-compare-card__primary flex flex-items-center flex-justify-center bg-0F172A text-white text-[15px] font-900"
+        class="poi-compare-card__primary flex items-center flex-justify-center bg-0F172A text-white text-[15px] font-bold"
         :class="{ 'is-disabled': disabled }" @click="openDetail">
         {{ data.detailButtonText }}
       </div>
     </div>
 
     <div v-else class="poi-compare-card__detail-card bg-white rounded-24 overflow-hidden">
-      <div class="poi-compare-card__detail-head flex flex-items-center">
-        <div class="poi-compare-card__back flex flex-items-center flex-justify-center rounded-full flex-shrink-0"
+      <div class="poi-compare-card__detail-head flex items-center">
+        <div class="poi-compare-card__back flex items-center flex-justify-center rounded-full flex-shrink-0"
           @click="closeDetail">
           <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
         </div>
-        <div class="poi-compare-card__detail-title color-1E293B font-size-20 font-900 flex-1">
+        <div class="poi-compare-card__detail-title text-[#1e293b] font-size-20 font-bold flex-1">
           {{ detail.title }}
         </div>
-        <div class="poi-compare-card__compare-label color-94A3B8 text-[12px] font-900">
+        <div class="poi-compare-card__compare-label color-94A3B8 text-[12px] font-bold">
           {{ 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 text-[14px] font-900">
+            class="poi-compare-card__table-title text-[#1e293b] text-[14px] font-bold">
             {{ 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 text-[12px] font-900">
+          <div class="poi-compare-card__row-label color-94A3B8 text-[12px] font-bold">
             {{ row.label }}
           </div>
           <div v-for="cell in row.values" :key="row.label + '-' + cell.text"
-            class="poi-compare-card__cell color-1E293B text-[14px] font-900" :class="getCellClass(cell.tone)">
+            class="poi-compare-card__cell text-[#1e293b] text-[14px] font-bold" :class="getCellClass(cell.tone)">
             {{ cell.text }}
           </div>
         </div>
       </div>
 
       <div class="poi-compare-card__recommend">
-        <div class="poi-compare-card__recommend-title color-94A3B8 text-[12px] font-900">
+        <div class="poi-compare-card__recommend-title color-94A3B8 text-[12px] font-bold">
           {{ 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 text-[14px] font-900">
+            <div class="poi-compare-card__tip-text text-[#334155] text-[14px] font-bold">
               {{ tip.text }}
             </div>
           </div>
@@ -85,8 +85,8 @@
 
       <div class="poi-compare-card__actions grid grid-cols-2 gap-14">
         <div v-for="action in detail.actions" :key="action.id || action.text"
-          class="poi-compare-card__action flex flex-items-center flex-justify-center text-[15px] font-900"
-          :class="[action.primary ? 'poi-compare-card__action--primary bg-0F172A text-white' : 'poi-compare-card__action--secondary color-334155', { 'is-disabled': disabled }]"
+          class="poi-compare-card__action flex items-center flex-justify-center text-[15px] font-bold"
+          :class="[action.primary ? 'poi-compare-card__action--primary bg-0F172A text-white' : 'poi-compare-card__action--secondary text-[#334155]', { 'is-disabled': disabled }]"
           @click="handleAction(action)">
           <span class="poi-compare-card__action-icon">{{ action.icon }}</span>
           <span>{{ action.text }}</span>
diff --git a/src/pages/home/components/PoiDetailCard/index.vue b/src/pages/home/components/PoiDetailCard/index.vue
index d22859a..4553407 100644
--- a/src/pages/home/components/PoiDetailCard/index.vue
+++ b/src/pages/home/components/PoiDetailCard/index.vue
@@ -2,26 +2,26 @@
   <div class="poi-detail-card bg-white rounded-24  overflow-hidden">
     <div class="poi-detail-card__hero relative">
       <image class="poi-detail-card__image w-full h-full block rounded-18" :src="data.image" mode="aspectFill" />
-      <div class="poi-detail-card__badge flex flex-items-center gap-4 font-size-10 font-900">
+      <div class="poi-detail-card__badge flex items-center gap-4 font-size-10 font-bold">
         <span class="poi-detail-card__badge-icon">⌖</span>
         <span>{{ data.badge?.text }}</span>
       </div>
     </div>
 
     <div class="poi-detail-card__body">
-      <div class="poi-detail-card__title color-1E293B font-size-24 font-900">
+      <div class="poi-detail-card__title text-[#1e293b] font-size-24 font-bold">
         {{ data.title }}
       </div>
 
-      <div class="poi-detail-card__tip flex flex-items-center gap-10">
-        <div class="poi-detail-card__spark color-047857 text-[18px] font-900">✦</div>
+      <div class="poi-detail-card__tip flex items-center gap-10">
+        <div class="poi-detail-card__spark color-047857 text-[18px] font-bold">✦</div>
         <div class="poi-detail-card__tip-text color-047857 text-[14px] font-800">
           {{ data.tip?.text }}
         </div>
       </div>
 
       <div
-        class="poi-detail-card__button flex flex-items-center flex-justify-center gap-8 text-white bg-0F172A text-[16px] font-900"
+        class="poi-detail-card__button flex items-center flex-justify-center gap-8 text-white bg-0F172A text-[16px] font-bold"
         :class="{ 'is-disabled': disabled }" @click="handleAction">
         <span class="poi-detail-card__button-icon">↗</span>
         <span>{{ data.action?.text }}</span>
diff --git a/src/pages/home/components/RecommendationListCard/index.vue b/src/pages/home/components/RecommendationListCard/index.vue
index 37c611c..b7471d4 100644
--- a/src/pages/home/components/RecommendationListCard/index.vue
+++ b/src/pages/home/components/RecommendationListCard/index.vue
@@ -7,16 +7,16 @@
         :class="{ 'is-disabled': disabled }" @click="handleSelect(item)">
         <img class="recommendation-list-card__image block w-full" :src="item.image" mode="aspectFill" />
         <div class="recommendation-list-card__body p-16">
-          <div class="recommendation-list-card__name color-1E293B text-[18px] font-900 truncate">
+          <div class="recommendation-list-card__name text-[#1e293b] text-[18px] font-bold truncate">
             {{ item.title }}
           </div>
           <div
-            class="recommendation-list-card__distance flex flex-items-center gap-4 mt-4 color-94A3B8 text-[12px] font-800">
+            class="recommendation-list-card__distance 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-[12px] color-334155 text-[12px] font-900"
+            class="recommendation-list-card__button flex items-center flex-justify-center mt-[12px] text-[#334155] text-[12px] font-bold"
             @click.stop="handleSelect(item)">
             {{ getActionText(item) }}
           </div>
diff --git a/src/pages/home/components/RoutePlanCard/index.vue b/src/pages/home/components/RoutePlanCard/index.vue
index 486bb15..a9db9fd 100644
--- a/src/pages/home/components/RoutePlanCard/index.vue
+++ b/src/pages/home/components/RoutePlanCard/index.vue
@@ -1,15 +1,15 @@
 <template>
   <div class="route-plan-card w-full">
     <div v-if="!detailOpen"
-      class="route-plan-card__summary flex flex-items-center bg-white rounded-24 overflow-hidden w-full"
+      class="route-plan-card__summary flex items-center bg-white rounded-24 overflow-hidden w-full"
       :class="{ 'is-disabled': disabled }" @click="openDetail">
       <img class="route-plan-card__cover block flex-shrink-0" :src="data.image" mode="aspectFill" />
       <div class="route-plan-card__body flex-1">
-        <div class="route-plan-card__title color-1E293B text-[18px] font-900 truncate">
+        <div class="route-plan-card__title text-[#1e293b] text-[18px] font-bold truncate">
           {{ 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 text-[12px] font-900"
+        <div class="route-plan-card__tags flex items-center">
+          <div v-for="tag in summaryTags" :key="tag.id || tag.text" class="route-plan-card__tag text-[12px] font-bold"
             :class="getTagClass(tag.tone)">
             {{ tag.text }}
           </div>
@@ -21,15 +21,15 @@
     </div>
 
     <div v-else class="route-plan-card__detail bg-white rounded-24 overflow-hidden w-full">
-      <div class="route-plan-card__detail-head flex flex-items-center">
-        <div class="route-plan-card__back flex flex-items-center flex-justify-center rounded-full flex-shrink-0"
+      <div class="route-plan-card__detail-head flex items-center">
+        <div class="route-plan-card__back flex items-center flex-justify-center rounded-full flex-shrink-0"
           @click="closeDetail">
           <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
         </div>
-        <div class="route-plan-card__detail-title color-1E293B text-[18px] font-900 truncate flex-1">
+        <div class="route-plan-card__detail-title text-[#1e293b] text-[18px] font-bold truncate flex-1">
           {{ data.title }}
         </div>
-        <div class="route-plan-card__detail-badge color-047857 bg-ECFDF5 text-[12px] font-900">
+        <div class="route-plan-card__detail-badge color-047857 bg-ECFDF5 text-[12px] font-bold">
           {{ detail.badge }}
         </div>
       </div>
@@ -38,19 +38,19 @@
         <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 text-[12px] font-900">
+              class="route-plan-card__node-number flex items-center flex-justify-center rounded-full color-047857 bg-ECFDF5 text-[12px] font-bold">
               {{ index + 1 }}
             </div>
-            <div class="route-plan-card__node bg-white rounded-20 flex flex-items-center">
+            <div class="route-plan-card__node bg-white rounded-20 flex items-center">
               <img class="route-plan-card__node-image block flex-shrink-0" :src="node.image" mode="aspectFill" />
               <div class="route-plan-card__node-body flex-1">
-                <div class="route-plan-card__node-title color-1E293B text-[16px] font-900 truncate">
+                <div class="route-plan-card__node-title text-[#1e293b] text-[16px] font-bold truncate">
                   {{ node.title }}
                 </div>
                 <div class="route-plan-card__node-desc color-94A3B8 text-[12px] font-800 truncate">
                   {{ node.description }}
                 </div>
-                <div v-if="node.tag" class="route-plan-card__node-tag color-D97706 bg-FFFBEB text-[12px] font-900">
+                <div v-if="node.tag" class="route-plan-card__node-tag color-D97706 bg-FFFBEB text-[12px] font-bold">
                   {{ 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 text-[12px] font-900">
+              class="route-plan-card__connector-chip flex items-center bg-[#f8fafc] rounded-full color-64748B text-[12px] font-bold">
               <span class="route-plan-card__connector-icon">{{ connectors[index].icon }}</span>
               <span>{{ connectors[index].text }}</span>
             </div>
@@ -69,12 +69,12 @@
         </template>
       </div>
 
-      <div v-if="tips.length" class="route-plan-card__tips bg-F8FAFC rounded-20">
-        <div class="route-plan-card__tips-title color-64748B text-[14px] font-900">
+      <div v-if="tips.length" class="route-plan-card__tips bg-[#f8fafc] rounded-20">
+        <div class="route-plan-card__tips-title color-64748B text-[14px] font-bold">
           {{ detail.tipsTitle }}
         </div>
         <div v-for="tip in tips" :key="tip"
-          class="route-plan-card__tip flex flex-items-center color-334155 text-[13px] font-900">
+          class="route-plan-card__tip flex items-center text-[#334155] text-[13px] font-bold">
           <div class="route-plan-card__tip-dot rounded-full flex-shrink-0"></div>
           <div>{{ tip }}</div>
         </div>
diff --git a/src/pages/home/components/ScenicImageCard/index.vue b/src/pages/home/components/ScenicImageCard/index.vue
index ac5cf21..9611bf3 100644
--- a/src/pages/home/components/ScenicImageCard/index.vue
+++ b/src/pages/home/components/ScenicImageCard/index.vue
@@ -4,16 +4,16 @@
     <img class="scenic-image-card__image block w-full" :src="data.image" mode="aspectFill" />
 
     <div
-      class="scenic-image-card__expand flex flex-items-center flex-justify-center rounded-full text-white text-[18px] font-900"
+      class="scenic-image-card__expand flex items-center flex-justify-center rounded-full text-white text-[18px] font-bold"
       @click.stop="handleAction">
       {{ action.icon }}
     </div>
 
     <div v-if="hasCaption" class="scenic-image-card__caption">
-      <div v-if="caption.title" class="scenic-image-card__title text-white text-[18px] font-900 truncate">
+      <div v-if="caption.title" class="scenic-image-card__title text-white text-[18px] font-bold truncate">
         {{ caption.title }}
       </div>
-      <div v-if="caption.subtitle" class="scenic-image-card__subtitle text-white text-[14px] font-900 truncate">
+      <div v-if="caption.subtitle" class="scenic-image-card__subtitle text-white text-[14px] font-bold truncate">
         {{ caption.subtitle }}
       </div>
     </div>
diff --git a/src/pages/home/components/SharedVisual/ActionRow.vue b/src/pages/home/components/SharedVisual/ActionRow.vue
index be94714..e00b816 100644
--- a/src/pages/home/components/SharedVisual/ActionRow.vue
+++ b/src/pages/home/components/SharedVisual/ActionRow.vue
@@ -1,13 +1,13 @@
 <template>
-  <div class="visual-action-row flex flex-items-center gap-[12px] p-[12px] bg-white rounded-18 "
+  <div class="visual-action-row flex items-center gap-[12px] p-[12px] bg-white rounded-18 "
     :class="{ 'is-disabled': disabled }" @click="handleClick">
     <div
-      class="visual-action-row__icon flex flex-items-center flex-justify-center w-42 h-42 rounded-14 text-[18px] font-900"
+      class="visual-action-row__icon flex items-center flex-justify-center w-42 h-42 rounded-14 text-[18px] font-bold"
       :class="toneClass">
       <slot name="icon">{{ icon }}</slot>
     </div>
     <div class="visual-action-row__body flex-1">
-      <div class="visual-action-row__title color-1E293B text-[14px] font-900 truncate">{{ title }}</div>
+      <div class="visual-action-row__title text-[#1e293b] text-[14px] font-bold truncate">{{ title }}</div>
       <div v-if="subtitle" class="visual-action-row__subtitle truncate">
         {{ subtitle }}
       </div>
diff --git a/src/pages/home/components/SharedVisual/BadgePill.vue b/src/pages/home/components/SharedVisual/BadgePill.vue
index cf420f3..509da34 100644
--- a/src/pages/home/components/SharedVisual/BadgePill.vue
+++ b/src/pages/home/components/SharedVisual/BadgePill.vue
@@ -1,6 +1,5 @@
 <template>
-  <div
-    class="visual-badge flex flex-items-center flex-justify-center rounded-[5px]0 font-size-10 font-800 whitespace-nowrap"
+  <div class="visual-badge flex items-center flex-justify-center rounded-[5px]0 font-size-10 font-800 whitespace-nowrap"
     :class="toneClass">
     <slot>{{ label }}</slot>
   </div>
diff --git a/src/pages/home/components/SharedVisual/DetailShell.vue b/src/pages/home/components/SharedVisual/DetailShell.vue
index 637047f..0b75c5f 100644
--- a/src/pages/home/components/SharedVisual/DetailShell.vue
+++ b/src/pages/home/components/SharedVisual/DetailShell.vue
@@ -1,11 +1,12 @@
 <template>
   <CardShell variant="detail">
-    <div class="visual-detail__header flex flex-items-center px-16  border-bottom-F1F5F9">
-      <div class="visual-detail__back mr-8 rounded-full bg-F8FAFC color-334155 font-900 text-center"
+    <div class="min-h-[48px] flex items-center px-[16px]  border-bottom-F1F5F9">
+      <div
+        class="w-[30px] h-[30px] text-[22px] leading-[28px] mr-[8px] rounded-full bg-[#f8fafc] text-[#334155] font-bold text-center"
         @click="$emit('back')">
-        <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
+        <van-icon name="arrow-left" size="16" color="#CBD5E1"></van-icon>
       </div>
-      <div class="visual-detail__title flex-1 color-1E293B text-[14px] font-900 truncate">{{ title }}</div>
+      <div class="flex-1 text-[#1e293b] text-[14px] font-bold truncate">{{ title }}</div>
       <BadgePill v-if="tag" :label="tag" :tone="tone" />
     </div>
     <slot />
@@ -33,7 +34,3 @@ defineProps({
 
 defineEmits(["back"]);
 </script>
-
-<style scoped lang="scss">
-@import "./styles/index.scss";
-</style>
diff --git a/src/pages/home/components/SharedVisual/styles/index.scss b/src/pages/home/components/SharedVisual/styles/index.scss
index a7c948f..ee8e5d6 100644
--- a/src/pages/home/components/SharedVisual/styles/index.scss
+++ b/src/pages/home/components/SharedVisual/styles/index.scss
@@ -62,21 +62,6 @@
   background: #f5f3ff;
 }
 
-.visual-detail__header {
-  min-height: 48px;
-}
-
-.visual-detail__back {
-  width: 30px;
-  height: 30px;
-  font-size: 22px;
-  line-height: 28px;
-}
-
-.visual-detail__title {
-  min-width: 0;
-}
-
 .visual-action-row {}
 
 .visual-action-row__icon {}
diff --git a/src/pages/order/order/components/AmtSection/index.vue b/src/pages/order/order/components/AmtSection/index.vue
index 2c7d2a5..e325367 100644
--- a/src/pages/order/order/components/AmtSection/index.vue
+++ b/src/pages/order/order/components/AmtSection/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="bg-white  rounded-[12px] p-[12px] mb-[12px]">
-    <div class="flex flex-items-center flex-justify-between">
-      <div class="flex flex-items-center">
+    <div class="flex items-center flex-justify-between">
+      <div class="flex items-center">
         <span class="text-[16px] text-[#171717] leading-[24px] font-medium">
           订单金额
         </span>
@@ -14,9 +14,9 @@
       超时后，订单将自动取消
     </div>
     <div v-if="['1', '2'].includes(orderData.orderStatus)"
-      class=" border-top flex flex-items-center flex-justify-between text-[12px] pt-[12px] mt-[12px]">
+      class=" border-top flex items-center flex-justify-between text-[12px] pt-[12px] mt-[12px]">
       <div class="text-ink-600">取消政策及说明</div>
-      <div class="flex flex-items-center" @click="emit('click')">
+      <div class="flex items-center" @click="emit('click')">
         <span class="theme-color-500 mr-[4px]">查看详情</span>
         <uni-icons type="right" size="12" color="#99A0AE" />
       </div>
diff --git a/src/pages/order/order/components/FooterSection/index.vue b/src/pages/order/order/components/FooterSection/index.vue
index 2696e12..72c96dd 100644
--- a/src/pages/order/order/components/FooterSection/index.vue
+++ b/src/pages/order/order/components/FooterSection/index.vue
@@ -1,12 +1,12 @@
 <template>
-  <div class="footer bg-white  flex flex-items-center flex-justify-between p-[12px]">
+  <div class="footer bg-white  flex items-center flex-justify-between p-[12px]">
     <button v-if="['1', '2'].includes(statusCode)"
-      class="left border-none  bg-white rounded-10 flex flex-items-center flex-justify-center text-[14px] font-medium text-ink-600 mr-12"
+      class="left border-none  bg-white rounded-10 flex items-center flex-justify-center text-[14px] font-medium text-ink-600 mr-12"
       @click="emit('refund', orderData)">
       申请退款
     </button>
     <button :class="[
-      'right border-none rounded-10 flex flex-1 flex-items-center flex-justify-center text-[14px] font-medium bg-theme-color-500',
+      'right border-none rounded-10 flex flex-1 items-center flex-justify-center text-[14px] font-medium bg-theme-color-500',
       {
         'text-[#ff3d60]': statusCode === '0',
         'text-white': ['1', '2', '3', '4', '5', '6'].includes(statusCode),
diff --git a/src/pages/order/order/components/GoodsInfo/index.vue b/src/pages/order/order/components/GoodsInfo/index.vue
index 942f70c..a6d5760 100644
--- a/src/pages/order/order/components/GoodsInfo/index.vue
+++ b/src/pages/order/order/components/GoodsInfo/index.vue
@@ -12,7 +12,7 @@
     </div>
 
     <!-- 权益部分 -->
-    <div class=" flex flex-items-center pt-[12px]">
+    <div class=" flex items-center pt-[12px]">
       <span class="bg-[#f7f7f7]  rounded-[4px] text-[11px] text-ink-600 mr-[4px] pt-[4px] pb-[4px] pl-[6px] pr-[6px]"
         v-for="(item, index) in commodityFacilityList" :key="index">
         {{ item }}
diff --git a/src/pages/order/order/components/VoucherList/index.vue b/src/pages/order/order/components/VoucherList/index.vue
index 7a52b6f..139e381 100644
--- a/src/pages/order/order/components/VoucherList/index.vue
+++ b/src/pages/order/order/components/VoucherList/index.vue
@@ -4,7 +4,7 @@
       核销凭证列表
     </span>
 
-    <div class="flex flex-items-center flex-justify-between py-12" :class="[
+    <div class="flex items-center flex-justify-between py-12" :class="[
       index + 1 === props.orderData.commodityPackageConfig.length
         ? ''
         : 'border-bottom',
@@ -21,7 +21,7 @@
         </div>
       </div>
 
-      <div class="flex flex-items-center px-14 py-8 rounded-8"
+      <div class="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] text-white">出示凭证</span>
         <span v-else class="text-[14px] span-color-300">已核销</span>
diff --git a/src/pages/quick/index.vue b/src/pages/quick/index.vue
index b72b4c7..279d2f1 100644
--- a/src/pages/quick/index.vue
+++ b/src/pages/quick/index.vue
@@ -7,9 +7,8 @@
       <Tabs @change="handleTabChange" />
 
       <!-- 选择入住、离店日期 0:是酒店 -->
-      <div v-if="didSelectedTabItem && didSelectedTabItem.orderType == 0"
-        class="bg-white  flex flex-items-center p-[12px]">
-        <div class="in flex flex-items-center">
+      <div v-if="didSelectedTabItem && didSelectedTabItem.orderType == 0" class="bg-white  flex items-center p-[12px]">
+        <div class="in flex items-center">
           <span class="text-[11px] font-medium text-ink-400 mr-[4px]">入住</span>
           <span class="text-[14px] font-medium text-[#171717]">
             {{ selectedDate.startDate }}
@@ -17,11 +16,11 @@
         </div>
 
         <!-- 几晚 -->
-        <span class="nights bg-E5E8EE  text-[11px] font-medium text-ink-600 rounded-[5px]0 ml-8 mr-8">
+        <span class="nights bg-E5E8EE  text-[11px] font-medium text-ink-600 rounded-[5px]0 ml-8 mr-[8px]">
           {{ selectedDate.totalDays }}晚
         </span>
 
-        <div class="out flex flex-items-center">
+        <div class="out flex items-center">
           <span class="text-[11px] font-medium text-ink-400 mr-[4px]">离店</span>
           <span class="text-[14px] font-medium text-[#171717]">
             {{ selectedDate.endDate }}