From 051f7d1134f2d4f190017209809fee185942d548 Mon Sep 17 00:00:00 2001
From: DEV_DSW <562304744@qq.com>
Date: Fri, 29 May 2026 09:28:37 +0800
Subject: [PATCH] style: fix style utility class inconsistencies and correct
 CSS syntax

Clean up style-related code across all components:
- Replace deprecated color-* classes with text-[color]/text-white equivalents
- Remove redundant border-box declarations and fix broken empty box-sizing rule
- Correct invalid rounded corner class syntax
- Standardize line-height to leading-[value] utilities
- Uniform margin and padding notation to [xxpx] format
---
 src/components/CreateServiceOrder/index.vue   | 26 +++++++++----------
 src/components/DateRangeSection/index.vue     |  6 ++---
 src/components/DetailPopup/index.vue          | 10 +++----
 src/components/Feedback/index.vue             | 20 +++++++-------
 src/components/GoodDetail/index.vue           |  8 +++---
 src/components/RefundPopup/index.vue          | 10 +++----
 src/components/Stepper/index.vue              |  4 +--
 src/components/SurveyQuestionnaire/index.vue  |  6 ++---
 src/components/UseDateRange/index.vue         |  6 ++---
 .../components/ConactSection/index.vue        | 22 ++++++++--------
 .../components/FooterSection/index.vue        |  8 +++---
 .../booking/components/UserSection/index.vue  | 21 +++++++--------
 src/pages/booking/index.vue                   | 12 ++++-----
 src/pages/goods/index.vue                     |  2 +-
 .../home/components/AnswerComponent/index.vue |  6 ++---
 .../home/components/ChatCardMine/index.vue    |  2 +-
 .../home/components/ChatLongAnswer/index.vue  |  2 +-
 .../home/components/ChatMoreTips/index.vue    |  4 +--
 .../home/components/ChatTopWelcome/index.vue  |  4 +--
 .../components/FacilityLocationCard/index.vue |  2 +-
 .../GeneratorPhotoComponent/index.vue         | 14 +++++-----
 .../components/LongTextGuideCard/index.vue    | 13 +++++-----
 .../LongTextGuideCardPreview/index.vue        |  4 +--
 .../components/MapNavigationCard/index.vue    |  4 +--
 .../home/components/MoreService/index.vue     |  8 +++---
 .../home/components/NoticeMessage/detail.vue  |  8 +++---
 .../home/components/NoticeMessage/index.vue   |  2 +-
 .../components/OpenMapComponent/index.vue     |  4 +--
 .../home/components/PoiCompareCard/index.vue  |  4 +--
 .../home/components/PoiDetailCard/index.vue   |  4 +--
 .../home/components/ScenicImageCard/index.vue |  6 ++---
 .../components/SharedVisual/ActionRow.vue     |  2 +-
 .../components/SharedVisual/BadgePill.vue     |  2 +-
 .../components/SharedVisual/CardShell.vue     |  2 +-
 .../components/SharedVisual/DetailShell.vue   |  2 +-
 .../order/components/AmtSection/index.vue     |  8 +++---
 .../order/components/FooterSection/index.vue  |  8 +++---
 .../order/components/GoodsInfo/index.vue      | 15 +++++------
 .../components/OrderCard/OrderCardContent.vue |  8 +++---
 .../order/components/OrderCard/index.vue      |  8 +++---
 .../order/components/OrderInfo/index.vue      |  6 ++---
 .../order/components/OrderQrcode/index.vue    |  2 +-
 .../order/order/components/UserInfo/index.vue |  6 ++---
 .../order/components/VoucherList/index.vue    |  6 ++---
 src/pages/order/order/detail.vue              |  2 +-
 src/pages/quick/index.vue                     |  8 +++---
 46 files changed, 167 insertions(+), 170 deletions(-)

diff --git a/src/components/CreateServiceOrder/index.vue b/src/components/CreateServiceOrder/index.vue
index b1f3458..f33309b 100644
--- a/src/components/CreateServiceOrder/index.vue
+++ b/src/components/CreateServiceOrder/index.vue
@@ -1,31 +1,31 @@
 <template>
   <div class="create-service-order">
-    <div class="w-full bg-white border-box border-ff overflow-hidden rounded-20">
-      <div class="border-box order-header w-vw flex flex-items-center flex-justify-between bg-theme-color-50">
+    <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">
         <span class="font-size-18 font-500 color-171717 text-left ml-12">
           {{ isCallSuccess ? "服务已创建" : "呼叫服务" }}
         </span>
         <img class="header-icon" src="https://oss.nianxx.cn/mp/static/version_101/home/feedback.png" />
       </div>
 
-      <div v-if="!isCallSuccess" class="border-box p-12">
-        <div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
+      <div v-if="!isCallSuccess" class=" p-[12px]">
+        <div class="bg-F5F7FA  flex flex-items-center p-[12px] 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 text-[14px] color-171717 mb-12">
+        <div class="bg-F5F7FA  flex flex-items-center p-[12px] 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 text-[14px] font-500 color-171717 mb-12">
+        <div class="bg-F5F7FA  p-[12px] 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="text-[14px] font-400" maxlength="100"
             v-model="contactText" />
         </div>
 
-        <div class="bg-F5F7FA border-box p-12 rounded-10 text-[14px] font-500 color-171717 mb-12">
+        <div class="bg-F5F7FA  p-[12px] 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">
@@ -43,15 +43,15 @@
         </div>
       </div>
 
-      <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="text-[12px] color-525866 line-height-20 mb-4">
+      <div v-else class=" card-content flex flex-items-center p-[12px]">
+        <div class=" left flex-full pr-20">
+          <div class="text-[12px] text-[#525866] leading-[20px] mb-4">
             所在位置：{{ roomId }}
           </div>
-          <div class="text-[12px] color-525866 line-height-20 mb-4">
+          <div class="text-[12px] text-[#525866] leading-[20px] mb-4">
             联系方式: {{ contactPhone }}
           </div>
-          <div class="text-[12px] color-525866 line-height-20 ellipsis-2">
+          <div class="text-[12px] text-[#525866] leading-[20px] ellipsis-2">
             需求描述: {{ contactspan }}
           </div>
         </div>
@@ -59,7 +59,7 @@
         <img v-if="contentImgUrl" class="right rounded-6" :src="contentImgUrl" mode="aspectFill" />
       </div>
 
-      <div class="btn rounded-50 color-white bg-button flex flex-items-center flex-justify-center ml-12 mr-12 mb-12"
+      <div class="btn rounded-[5px]0 text-white bg-button flex flex-items-center flex-justify-center ml-12 mr-12 mb-12"
         @click="handleCall">
         {{ isCallSuccess ? "查看服务" : "立即呼叫" }}
       </div>
diff --git a/src/components/DateRangeSection/index.vue b/src/components/DateRangeSection/index.vue
index 3d40d39..4169ecf 100644
--- a/src/components/DateRangeSection/index.vue
+++ b/src/components/DateRangeSection/index.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="border-box flex flex-items-center flex-justify-between mb-12">
+  <div class=" flex flex-items-center flex-justify-between mb-12">
     <div class="left flex flex-items-center">
-      <span class="text-[12px] color-99A0AE mr-4">入住</span>
+      <span class="text-[12px] color-99A0AE mr-[4px]">入住</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">{{
+      <span class="total  rounded-[5px]0 flex flex-items-center font-size-11 color-43669A relative">{{
         selectedDate.totalDays }}晚</span>
       <span class="text-[12px] color-99A0AE ml-16">离店</span>
       <span class="text-[12px] color-171717 ml-4">
diff --git a/src/components/DetailPopup/index.vue b/src/components/DetailPopup/index.vue
index cb4f6b7..b6ffedc 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 border-box">
-      <div class="border-box flex flex-items-center justify-between pt-12 pb-12 relative">
+    <div class="refund-popup bg-F5F7FA ">
+      <div class=" flex flex-items-center justify-between pt-12 pb-12 relative">
         <div class="flex-full font-size-16 color-171717 line-height-24 text-center">
           明细详情
         </div>
@@ -9,12 +9,12 @@
         <uni-icons class="close absolute" type="close" size="20" color="#CACFD8" @click="handleClose" />
       </div>
       <!-- 内容区域 -->
-      <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">
+      <div class="rounded-[12px] bg-white ml-12 mr-12 mb-40">
+        <div class=" 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="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">
+        <div class=" 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="text-[14px] color-171717">239</span>
         </div>
diff --git a/src/components/Feedback/index.vue b/src/components/Feedback/index.vue
index 105c7e6..9ba6106 100644
--- a/src/components/Feedback/index.vue
+++ b/src/components/Feedback/index.vue
@@ -1,41 +1,41 @@
 <template>
   <div class="create-service-order">
-    <div class="w-full bg-white border-box border-ff overflow-hidden rounded-20">
-      <div class="border-box order-header w-vw flex flex-items-center flex-justify-between bg-theme-color-50">
+    <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">
         <span class="font-size-18 font-500 color-171717 text-left ml-12">
           {{ isCallSuccess ? "反馈已创建" : "反馈意见" }}
         </span>
         <img class="header-icon" src="https://oss.nianxx.cn/mp/static/version_101/home/feedback.png" />
       </div>
 
-      <div v-if="!isCallSuccess" class="border-box p-12">
-        <div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
+      <div v-if="!isCallSuccess" class=" p-[12px]">
+        <div class="bg-F5F7FA  flex flex-items-center p-[12px] 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 text-[14px] font-500 color-171717 mb-12">
+        <div class="bg-F5F7FA  p-[12px] 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="text-[14px] font-400" maxlength="100"
             v-model="contactText" />
         </div>
 
-        <div class="btn rounded-50 color-white bg-button flex flex-items-center flex-justify-center"
+        <div class="btn rounded-[5px]0 text-white bg-button flex flex-items-center flex-justify-center"
           @click="handleCall">
           立即提交
         </div>
       </div>
 
-      <div v-else class="border-box left flex-full p-12">
-        <div class="text-[12px] color-525866 line-height-20 mb-4">
+      <div v-else class=" left flex-full p-[12px]">
+        <div class="text-[12px] text-[#525866] leading-[20px] mb-4">
           联系方式: {{ contactPhone }}
         </div>
-        <div class="text-[12px] color-525866 line-height-20 ellipsis-2">
+        <div class="text-[12px] text-[#525866] leading-[20px] 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" />
+        <img class="help-icon mr-[4px]" src="./images/icon_volume.png" />
         <span class="text-[12px] font-500 color-FA7319">
           {{ appName }}收到您的意见将第一时间为您处理!
         </span>
diff --git a/src/components/GoodDetail/index.vue b/src/components/GoodDetail/index.vue
index 16d39d4..d300247 100644
--- a/src/components/GoodDetail/index.vue
+++ b/src/components/GoodDetail/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="border-box border-top-8">
-    <div v-if="goodsData.commodityPurchaseInstruction" class="border-box pl-12 pr-12">
+  <div class=" border-top-8">
+    <div v-if="goodsData.commodityPurchaseInstruction" class=" pl-12 pr-12">
       <ModuleTitle v-if="showTitle" :title="goodsData.commodityPurchaseInstruction.templateTitle" />
       <div v-for="(moduleItem, index) in goodsData.commodityPurchaseInstruction
         .commodityPurchaseInstructionModuleEntityList" :key="index">
@@ -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 text-[14px] color-171717 line-height-20">
+            <span class="ml-4 text-[14px] color-171717 leading-[20px]">
               {{ moduleItem.moduleTitle }}
             </span>
           </div>
-          <span class="flex-full text-[12px] color-525866 line-height-20 mt-4">
+          <span class="flex-full text-[12px] text-[#525866] leading-[20px] mt-4">
             {{ moduleItem.moduleContent }}
           </span>
         </div>
diff --git a/src/components/RefundPopup/index.vue b/src/components/RefundPopup/index.vue
index 44fd645..6b39ea6 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 border-box">
-      <div class="border-box flex flex-items-center justify-between pt-12 pb-12 relative">
+    <div class="refund-popup bg-F5F7FA ">
+      <div class=" flex flex-items-center justify-between pt-12 pb-12 relative">
         <div class="flex-full font-size-16 color-171717 line-height-24 text-center">
           取消政策
         </div>
@@ -9,7 +9,7 @@
         <uni-icons class="close absolute" type="close" size="20" color="#CACFD8" @click="handleClose" />
       </div>
       <!-- 内容区域 -->
-      <div class="border-box rounded-12 bg-white p-12 ml-12 mr-12 mb-40">
+      <div class=" rounded-[12px] bg-white p-[12px] ml-12 mr-12 mb-40">
         <div class="flex flex-items-center mb-8">
           <uni-icons fontFamily="znicons" size="20" color="#333">
             {{ iconsMap["zn-refund"] }}
@@ -18,8 +18,8 @@
             {{ refundTitle }}
           </span>
         </div>
-        <div class="text-[14px] color-525866 line-height-16 mb-4" v-for="(item, index) in commodityPurchaseInstruction"
-          :key="index">
+        <div class="text-[14px] text-[#525866] line-height-16 mb-4"
+          v-for="(item, index) in commodityPurchaseInstruction" :key="index">
           {{ item }}
         </div>
       </div>
diff --git a/src/components/Stepper/index.vue b/src/components/Stepper/index.vue
index f543b28..6c68fa9 100644
--- a/src/components/Stepper/index.vue
+++ b/src/components/Stepper/index.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="stepper-wrapper border-box flex flex-items-center rounded-8">
+  <div class="stepper-wrapper  flex flex-items-center rounded-8">
     <uni-icons type="minus" size="24" color="#D1D1D1" @click="decrease" />
-    <text class="stepper-text text-center text-[14px] font-500 color-000 ml-4 mr-4">
+    <text class="stepper-text text-center text-[14px] font-500 color-000 ml-4 mr-[4px]">
       {{ value }} {{ unit }}
     </text>
     <uni-icons type="plus" size="24" color="#198CFF" @click="increase" />
diff --git a/src/components/SurveyQuestionnaire/index.vue b/src/components/SurveyQuestionnaire/index.vue
index e7c3fae..6f5b48b 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-box border-ff overflow-hidden rounded-20">
-      <div class="border-box flex flex-items-center flex-justify-between bg-theme-color-50">
+    <div class="bg-white  border-ff overflow-hidden rounded-20">
+      <div class=" flex flex-items-center flex-justify-between bg-theme-color-50">
         <span class="font-size-18 font-500 color-171717 text-left ml-12">
           调查问卷
         </span>
@@ -10,7 +10,7 @@
 
       <img class="w-full" :src="surveyData.bannerUrl" mode="widthFix" />
 
-      <div class="h-44 m-12 rounded-50 bg-button color-white flex flex-items-center flex-justify-center"
+      <div class="h-44 m-[12px] rounded-[5px]0 bg-button text-white flex flex-items-center flex-justify-center"
         @click="handleCall">
         前往填写
       </div>
diff --git a/src/components/UseDateRange/index.vue b/src/components/UseDateRange/index.vue
index 1edba24..fd38c99 100644
--- a/src/components/UseDateRange/index.vue
+++ b/src/components/UseDateRange/index.vue
@@ -1,9 +1,9 @@
 <template>
-  <div class="bg-white rounded-12 overflow-hidden mb-12">
-    <div class="border-box font-size-16 font-500 color-000 line-height-24 p-12">
+  <div class="bg-white rounded-[12px] overflow-hidden mb-12">
+    <div class=" font-size-16 font-500 color-000 line-height-24 p-[12px]">
       使用日期
     </div>
-    <div class="flex flex-items-center border-box">
+    <div class="flex 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 0168ca9..fd5a2c1 100644
--- a/src/pages/booking/components/ConactSection/index.vue
+++ b/src/pages/booking/components/ConactSection/index.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- 选择数量 -->
-  <div class="border-box bg-white p-12 rounded-12 flex flex-items-center mb-12">
+  <div class=" bg-white p-[12px] rounded-[12px] 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="text-[12px] color-A3A3A3 line-height-16">请选择套餐数量</div>
@@ -15,23 +15,23 @@
     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="bg-white rounded-[12px] overflow-hidden">
+    <div class=" border-bottom font-size-16 font-500 color-000 line-height-24 p-[12px]">
       联系方式
     </div>
-    <div class="flex flex-items-center border-box p-12">
-      <div class="text-[14px] font-500 color-525866 mr-12">联系人姓名</div>
+    <div class="flex flex-items-center  p-[12px]">
+      <div class="text-[14px] font-500 text-[#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=" px-4 py-2 font-size-15 color-000 leading-[20px]" v-model.trim="userFormList[0].visitorName"
+          placeholder="请输入联系人" maxlength="20" />
       </div>
     </div>
 
-    <div class="flex flex-items-center border-box p-12">
-      <div class="text-[14px] font-500 color-525866 mr-12">手机号码</div>
+    <div class="flex flex-items-center  p-[12px]">
+      <div class="text-[14px] font-500 text-[#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=" px-4 py-2 font-size-15 color-000 leading-[20px]" v-model.trim="userFormList[0].contactPhone"
+          placeholder="请输入联系手机" maxlength="11" />
       </div>
     </div>
   </div>
diff --git a/src/pages/booking/components/FooterSection/index.vue b/src/pages/booking/components/FooterSection/index.vue
index a1c3884..9a03907 100644
--- a/src/pages/booking/components/FooterSection/index.vue
+++ b/src/pages/booking/components/FooterSection/index.vue
@@ -1,15 +1,15 @@
 <template>
-  <div class="booking-footer border-box bg-white flex flex-items-center font-family-misans-vf">
+  <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">
       {{ totalAmt }}
     </span>
     <!-- <div class="flex flex-items-center" @click="emit('detailClick')">
-      <span class="text-[12px] color-A3A3A3 mr-4">明细</span>
+      <span class="text-[12px] color-A3A3A3 mr-[4px]">明细</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">
+    <div class="btn  rounded-10 flex 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="font-size-16 font-500 color-white">立即支付</span>
+      <span class="font-size-16 font-500 text-white">立即支付</span>
     </div>
   </div>
 </template>
diff --git a/src/pages/booking/components/UserSection/index.vue b/src/pages/booking/components/UserSection/index.vue
index 7866932..5172912 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-12 overflow-hidden mb-12">
-    <div class="flex flex-items-center border-box p-12 border-bottom">
+  <div class="bg-white rounded-[12px] overflow-hidden mb-12">
+    <div class="flex flex-items-center  p-[12px] border-bottom">
       <div class="font-size-16 font-500 color-000 line-height-24 flex-full">
         入住信息
       </div>
@@ -9,21 +9,20 @@
       </div>
     </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="text-[14px] font-500 color-525866 mr-12">住客姓名</div>
+    <div class=" pl-12 pr-12">
+      <div class=" border-bottom pt-12 pb-12 flex flex-items-center" v-for="(item, index) in userFormList" :key="index">
+        <div class="text-[14px] font-500 text-[#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"
+          <input class=" px-4 py-2 font-size-15 color-000 leading-[20px]" v-model.trim="item.visitorName"
             placeholder="请输入姓名" maxlength="11" />
         </div>
       </div>
 
-      <div class="flex flex-items-center border-box pt-12 pb-12">
-        <div class="text-[14px] font-500 color-525866 mr-12">联系手机</div>
+      <div class="flex flex-items-center  pt-12 pb-12">
+        <div class="text-[14px] font-500 text-[#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=" px-4 py-2 font-size-15 color-000 leading-[20px]" v-model.trim="userFormList[0].contactPhone"
+            placeholder="请输入联系手机" maxlength="11" />
         </div>
       </div>
     </div>
diff --git a/src/pages/booking/index.vue b/src/pages/booking/index.vue
index 3ae88e2..5d8dab7 100644
--- a/src/pages/booking/index.vue
+++ b/src/pages/booking/index.vue
@@ -6,9 +6,9 @@
       </template>
     </TopNavBar>
 
-    <div class="booking-content flex-full border-box p-12 overflow-hidden scroll-y">
+    <div class="booking-content flex-full  p-[12px] overflow-hidden scroll-y">
       <!-- 预约内容 -->
-      <div class="border-box bg-white p-12 rounded-12 mb-12">
+      <div class=" bg-white p-[12px] rounded-[12px] mb-12">
         <!-- 酒店类型入住离店日期部分 -->
         <DateRangeSection v-if="orderData.orderType == 0" :selectedDate="selectedDate" :showBtn="true"
           @click="navigateToDetail(orderData)" />
@@ -17,22 +17,22 @@
           {{ orderData.commodityName }}
         </div>
 
-        <div class="border-box border-bottom">
+        <div class=" border-bottom">
           <div class="text-[12px] color-99A0AE line-height-16 pb-12 break-all">
             {{ orderData.commodityDescription }}
           </div>
 
           <!-- 权益部分 -->
           <div class="flex flex-items-center mb-8">
-            <span class="bg-F7F7F7 border-box rounded-4 font-size-11 color-525866 mr-4 pt-4 pb-4 pl-6 pr-6"
+            <span class="bg-F7F7F7  rounded-4 font-size-11 text-[#525866] mr-[4px] pt-4 pb-4 pl-6 pr-6"
               v-for="(item, index) in orderData.commodityFacilityList" :key="index">
               {{ item }}
             </span>
           </div>
         </div>
 
-        <div class="border-box flex flex-items-center flex-justify-between pt-12">
-          <span class="text-[12px] color-525866 line-height-18">取消政策及说明</span>
+        <div class=" flex flex-items-center flex-justify-between pt-12">
+          <span class="text-[12px] text-[#525866] line-height-18">取消政策及说明</span>
           <div class="flex flex-items-center">
             <span class="text-[12px] theme-color-500 line-height-16" @click="refundVisible = true">取消政策</span>
             <uni-icons type="right" size="15" color="#99A0AE" />
diff --git a/src/pages/goods/index.vue b/src/pages/goods/index.vue
index 091ebac..47a600e 100644
--- a/src/pages/goods/index.vue
+++ b/src/pages/goods/index.vue
@@ -47,7 +47,7 @@
         class="flex items-center ml-auto pl-[8px] rounded-[10px] w-[120px] h-[48px] bg-linear-[90deg, #ff3d60_57%, #ff990c_100%]"
         @click="navigateToPay(goodsData)">
         <img class="w-[34px] h-[48px]" src="https://oss.nianxx.cn/mp/static/version_101/common/btn.png" />
-        <span class="font-size-16 font-500 color-white">立即预定</span>
+        <span class="font-size-16 font-500 text-white">立即预定</span>
       </div>
     </div>
 
diff --git a/src/pages/home/components/AnswerComponent/index.vue b/src/pages/home/components/AnswerComponent/index.vue
index 7a617b3..76249ad 100644
--- a/src/pages/home/components/AnswerComponent/index.vue
+++ b/src/pages/home/components/AnswerComponent/index.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
+  <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-12 border-box">
+    <div class="flex flex-col px-16 pt-16 pb-12 ">
       <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" />
@@ -19,7 +19,7 @@
       </div>
       <div v-if="isOverflow" class="flex flex-row flex-items-center flex-justify-between mt-4"
         @click="lookDetailAction">
-        <span class="text-[12px] font-400 theme-color-500 mr-4">查看完整{{ tag }}</span>
+        <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/ChatCardMine/index.vue b/src/pages/home/components/ChatCardMine/index.vue
index eeb3068..bd6ace8 100644
--- a/src/pages/home/components/ChatCardMine/index.vue
+++ b/src/pages/home/components/ChatCardMine/index.vue
@@ -2,7 +2,7 @@
   <!-- 外层行容器：接收来自父组件的对齐类（如 flex flex-justify-end） -->
   <div class="chat-mine-row">
     <div class="chat-mine bg-17294E">
-      <span class="font-size-15 color-white">{{ text }}</span>
+      <span class="font-size-15 text-white">{{ text }}</span>
       <slot></slot>
     </div>
   </div>
diff --git a/src/pages/home/components/ChatLongAnswer/index.vue b/src/pages/home/components/ChatLongAnswer/index.vue
index 6323d4d..ca050b5 100644
--- a/src/pages/home/components/ChatLongAnswer/index.vue
+++ b/src/pages/home/components/ChatLongAnswer/index.vue
@@ -8,7 +8,7 @@
     <!-- ✅ 滚动区域 -->
     <div class="flex-full overflow-hidden chat-scroll" scroll-y :scroll-into-div="scrollIntodivId" scroll-with-animation
       @scroll="onScroll" @touchstart="onTouchStart" @touchend="onTouchEnd" @touchcancel="onTouchEnd">
-      <div class="flex flex-col pt-12 px-12 pb-24 border-box gap-10">
+      <div class="flex flex-col pt-12 px-12 pb-24  gap-10">
         <div v-if="headerSections.title || headerSections.tag" class="long-answer-header">
           <div v-if="headerSections.title" class="long-answer-title">
             {{ headerSections.title.contentValue }}
diff --git a/src/pages/home/components/ChatMoreTips/index.vue b/src/pages/home/components/ChatMoreTips/index.vue
index f655826..e075f22 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 border-box">
+  <div class="more-tips bg-white ">
     <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">
+      <div class="more-tips-item  inline-block mr-8" v-for="(item, index) in guideWords" :key="index">
         <span :class="['font-500 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 110b229..1bd78c3 100644
--- a/src/pages/home/components/ChatTopWelcome/index.vue
+++ b/src/pages/home/components/ChatTopWelcome/index.vue
@@ -1,8 +1,8 @@
 v
 <template>
-  <div class="welcome-content border-box p-12">
+  <div class="welcome-content  p-[12px]">
     <div class="wrap rounded-20">
-      <div class="flex flex-items-center flex-justify-between border-box pl-12 pr-12">
+      <div class="flex 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 f98029c..70e8b37 100644
--- a/src/pages/home/components/FacilityLocationCard/index.vue
+++ b/src/pages/home/components/FacilityLocationCard/index.vue
@@ -28,7 +28,7 @@
       </div>
 
       <div
-        class="facility-location-card__button flex flex-items-center flex-justify-center bg-0F172A color-white font-size-18 font-900"
+        class="facility-location-card__button flex flex-items-center flex-justify-center bg-0F172A text-white font-size-18 font-900"
         :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/GeneratorPhotoComponent/index.vue b/src/pages/home/components/GeneratorPhotoComponent/index.vue
index 0b1929d..027994a 100644
--- a/src/pages/home/components/GeneratorPhotoComponent/index.vue
+++ b/src/pages/home/components/GeneratorPhotoComponent/index.vue
@@ -1,9 +1,9 @@
 <template>
-  <div class="container w-full border-box border-ff overflow-hidden rounded-24 flex flex-col">
+  <div class="container w-full  border-ff overflow-hidden rounded-24 flex flex-col">
     <!-- 占位撑开 -->
     <div class="w-vw"></div>
-    <div class="content flex flex-col m-4 border-box rounded-24">
-      <div class="flex flex-col p-6 border-box flex-items-center justify-center">
+    <div class="content flex flex-col m-4  rounded-24">
+      <div class="flex flex-col p-6  flex-items-center justify-center">
         <img class="w-full rounded-20" :src="props.toolCall.componentNameParams.background" mode="widthFix" />
 
         <!-- 左上角标签 -->
@@ -14,14 +14,14 @@
 
         <img class="g_title mt-20" :src="props.toolCall.componentNameParams.title" />
 
-        <span class="text-[14px] font-400 color-white my-12 text-center">
+        <span class="text-[14px] font-400 text-white my-12 text-center">
           {{ props.toolCall.componentNameParams.description }}
         </span>
 
-        <div class="w-full border-box px-12 pb-8 flex flex-row" @click="jumpClick">
-          <div class="btn-bg w-full border-box p-4 rounded-24 flex flex-row">
+        <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 border-box p-16 rounded-20 flex flex-row flex-items-center flex-justify-center color-white text-center font-size-18 font-800">
+              class="btn-bg-sub w-full  p-16 rounded-20 flex flex-row flex-items-center flex-justify-center text-white text-center font-size-18 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 df0d94c..0b780f2 100644
--- a/src/pages/home/components/LongTextGuideCard/index.vue
+++ b/src/pages/home/components/LongTextGuideCard/index.vue
@@ -1,9 +1,8 @@
 <template>
   <div class="long-text-guide-card w-full">
     <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 border-box" :class="{ 'is-disabled': disabled }"
-        @click="openDetail(item)">
+      <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}`">
           {{ item.badge }}
         </div>
@@ -20,7 +19,7 @@
       </div>
     </div>
 
-    <div v-else class="long-text-guide-card__detail-card bg-white rounded-24 border-box overflow-hidden">
+    <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"
           @click="closeDetail">
@@ -80,7 +79,7 @@
           <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 color-white font-size-10 font-900">
+            <div class="long-text-guide-card__map-tag text-white font-size-10 font-900">
               {{ activeItem.action.tag }}
             </div>
           </div>
@@ -89,7 +88,7 @@
               <div class="color-1E293B font-size-15 font-900">{{ 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 color-white bg-0F172A text-[14px] font-900"
+            <div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-900"
               @click="handleAction(activeItem)">
               {{ activeItem.action.buttonText }}
             </div>
@@ -105,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 color-white font-size-18 font-900">
+            class="long-text-guide-card__expand flex flex-items-center flex-justify-center rounded-full text-white font-size-18 font-900">
             ↗
           </div>
         </div>
diff --git a/src/pages/home/components/LongTextGuideCardPreview/index.vue b/src/pages/home/components/LongTextGuideCardPreview/index.vue
index 3e48406..21cc073 100644
--- a/src/pages/home/components/LongTextGuideCardPreview/index.vue
+++ b/src/pages/home/components/LongTextGuideCardPreview/index.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
+  <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-12 border-box" @click="openDetail(item)">
+    <div class="flex flex-col px-16 pt-16 pb-12 " @click="openDetail(item)">
 
       <div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
         {{ item.badge }}
diff --git a/src/pages/home/components/MapNavigationCard/index.vue b/src/pages/home/components/MapNavigationCard/index.vue
index eb9fc2b..6bd02bb 100644
--- a/src/pages/home/components/MapNavigationCard/index.vue
+++ b/src/pages/home/components/MapNavigationCard/index.vue
@@ -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 text-[12px] font-900">
+      <div class="map-navigation-card__badge flex flex-items-center text-white text-[12px] font-900">
         <span class="map-navigation-card__badge-icon">{{ badge.icon }}</span>
         <span>{{ badge.text }}</span>
       </div>
@@ -18,7 +18,7 @@
         </div>
       </div>
       <div
-        class="map-navigation-card__button flex flex-items-center flex-justify-center bg-0F172A color-white font-size-18 font-900"
+        class="map-navigation-card__button flex flex-items-center flex-justify-center bg-0F172A text-white font-size-18 font-900"
         :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 fe4aa76..f455fb9 100644
--- a/src/pages/home/components/MoreService/index.vue
+++ b/src/pages/home/components/MoreService/index.vue
@@ -1,13 +1,13 @@
 <template>
   <van-popup ref="popup" position="bottom" v-model:show="show">
-    <div class="popup-content border-box pt-12 pl-12 pr-12">
+    <div class="popup-content  pt-12 pl-12 pr-12">
       <div class="header flex flex-items-center pb-12">
         <div class="title flex-full text-center font-size-17 color-000 font-500 ml-24">更多服务</div>
         <van-icon name="cross" size="24" color="#CACFD8" @click="close" />
       </div>
 
-      <div class="list bg-white border-box pl-20 pr-20">
-        <div class="item border-box border-bottom pt-20 pb-20" v-for="(item, index) in list" :key="index">
+      <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">
             <img v-if="item.icon" class="left" :src="item.icon" />
             <div class="center flex-full">
@@ -18,7 +18,7 @@
                 {{ item.content }}
               </div>
             </div>
-            <div class="right border-box text-[12px] color-white line-height-16" @click="handleClick(item)">
+            <div class="right  text-[12px] text-white line-height-16" @click="handleClick(item)">
               {{ item.btnText }}
             </div>
           </div>
diff --git a/src/pages/home/components/NoticeMessage/detail.vue b/src/pages/home/components/NoticeMessage/detail.vue
index 462ac33..15ffd19 100644
--- a/src/pages/home/components/NoticeMessage/detail.vue
+++ b/src/pages/home/components/NoticeMessage/detail.vue
@@ -7,10 +7,10 @@
 
     <!-- ✅ 滚动区域 -->
     <div class="flex-full overflow-hidden" scroll-y>
-      <div class="pb-24 border-box overflow-hidden">
+      <div class="pb-24  overflow-hidden">
         <img v-if="coverImage" class="w-full block" :src="coverImage" mode="aspectFill" />
 
-        <div class="pt-16 px-12 pb-24 border-box">
+        <div class="pt-16 px-12 pb-24 ">
           <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-[16px]">
@@ -20,7 +20,7 @@
 
           <div class="mt-[16px] mx-12 bg-gray w-full height-1"></div>
 
-          <div class="mt-[16px] color-666 text-[14px] line-height-20">{{ noticeContent }}</div>
+          <div class="mt-[16px] color-666 text-[14px] leading-[20px]">{{ noticeContent }}</div>
         </div>
       </div>
     </div>
@@ -70,6 +70,6 @@ const noticeContent = computed(() => {
   background: linear-gradient(180deg, #f4f7fb 0%, #e9eef6 100%);
   border: 1px solid #d6dde8;
   border-radius: 14px;
-  box-sizing: border-box;
+  box-sizing: ;
 }
 </style>
diff --git a/src/pages/home/components/NoticeMessage/index.vue b/src/pages/home/components/NoticeMessage/index.vue
index d561dbb..25d97b8 100644
--- a/src/pages/home/components/NoticeMessage/index.vue
+++ b/src/pages/home/components/NoticeMessage/index.vue
@@ -101,7 +101,7 @@ const clickItem = (item) => {
   border: 1px solid #C7D2FE;
   width: fit-content;
   max-width: 100%;
-  box-sizing: border-box;
+  box-sizing: ;
 }
 
 .noMessage-text {
diff --git a/src/pages/home/components/OpenMapComponent/index.vue b/src/pages/home/components/OpenMapComponent/index.vue
index 82cbe85..c72cde8 100644
--- a/src/pages/home/components/OpenMapComponent/index.vue
+++ b/src/pages/home/components/OpenMapComponent/index.vue
@@ -1,8 +1,8 @@
 <template>
-    <div class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
+    <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-12 border-box" @click="openMap">
+        <div class="flex flex-items-center flex-justify-between p-[12px] " @click="openMap">
             <div class="rounded-16 p-16 bg-theme-color-50">
                 <div class="w-32 h-32 rounded-full bg-white flex flex-items-center flex-justify-center">
                     <uni-icons type="location" size="16" color="#171717" />
diff --git a/src/pages/home/components/PoiCompareCard/index.vue b/src/pages/home/components/PoiCompareCard/index.vue
index d2ae0dd..0c87998 100644
--- a/src/pages/home/components/PoiCompareCard/index.vue
+++ b/src/pages/home/components/PoiCompareCard/index.vue
@@ -30,7 +30,7 @@
       </div>
 
       <div
-        class="poi-compare-card__primary flex flex-items-center flex-justify-center bg-0F172A color-white font-size-15 font-900"
+        class="poi-compare-card__primary flex flex-items-center flex-justify-center bg-0F172A text-white font-size-15 font-900"
         :class="{ 'is-disabled': disabled }" @click="openDetail">
         {{ data.detailButtonText }}
       </div>
@@ -86,7 +86,7 @@
       <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 font-size-15 font-900"
-          :class="[action.primary ? 'poi-compare-card__action--primary bg-0F172A color-white' : 'poi-compare-card__action--secondary color-334155', { 'is-disabled': disabled }]"
+          :class="[action.primary ? 'poi-compare-card__action--primary bg-0F172A text-white' : 'poi-compare-card__action--secondary color-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 fc9893b..ce318bf 100644
--- a/src/pages/home/components/PoiDetailCard/index.vue
+++ b/src/pages/home/components/PoiDetailCard/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="poi-detail-card bg-white rounded-24 border-box overflow-hidden">
+  <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">
@@ -21,7 +21,7 @@
       </div>
 
       <div
-        class="poi-detail-card__button flex flex-items-center flex-justify-center gap-8 color-white bg-0F172A font-size-16 font-900"
+        class="poi-detail-card__button flex flex-items-center flex-justify-center gap-8 text-white bg-0F172A font-size-16 font-900"
         :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/ScenicImageCard/index.vue b/src/pages/home/components/ScenicImageCard/index.vue
index f83e370..8af2086 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 color-white font-size-18 font-900"
+      class="scenic-image-card__expand flex flex-items-center flex-justify-center rounded-full text-white font-size-18 font-900"
       @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 color-white font-size-18 font-900 ellipsis-1">
+      <div v-if="caption.title" class="scenic-image-card__title text-white font-size-18 font-900 ellipsis-1">
         {{ caption.title }}
       </div>
-      <div v-if="caption.subtitle" class="scenic-image-card__subtitle color-white text-[14px] font-900 ellipsis-1">
+      <div v-if="caption.subtitle" class="scenic-image-card__subtitle text-white text-[14px] font-900 ellipsis-1">
         {{ caption.subtitle }}
       </div>
     </div>
diff --git a/src/pages/home/components/SharedVisual/ActionRow.vue b/src/pages/home/components/SharedVisual/ActionRow.vue
index 042a2a8..3321119 100644
--- a/src/pages/home/components/SharedVisual/ActionRow.vue
+++ b/src/pages/home/components/SharedVisual/ActionRow.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="visual-action-row flex flex-items-center gap-12 p-12 bg-white rounded-18 border-box"
+  <div class="visual-action-row flex 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 font-size-18 font-900"
diff --git a/src/pages/home/components/SharedVisual/BadgePill.vue b/src/pages/home/components/SharedVisual/BadgePill.vue
index 4f03ea7..cf420f3 100644
--- a/src/pages/home/components/SharedVisual/BadgePill.vue
+++ b/src/pages/home/components/SharedVisual/BadgePill.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="visual-badge flex flex-items-center flex-justify-center rounded-50 font-size-10 font-800 whitespace-nowrap"
+    class="visual-badge flex 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/CardShell.vue b/src/pages/home/components/SharedVisual/CardShell.vue
index ae022d3..1f36b4d 100644
--- a/src/pages/home/components/SharedVisual/CardShell.vue
+++ b/src/pages/home/components/SharedVisual/CardShell.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="visual-card-shell w-full bg-white border-F1F5F9 rounded-24 border-box overflow-hidden"
+  <div class="visual-card-shell w-full bg-white border-F1F5F9 rounded-24  overflow-hidden"
     :class="[{ 'is-pressable': pressable, 'is-disabled': disabled }, variantClass]" @click="handleClick">
     <slot />
   </div>
diff --git a/src/pages/home/components/SharedVisual/DetailShell.vue b/src/pages/home/components/SharedVisual/DetailShell.vue
index 2feebe4..6c3934a 100644
--- a/src/pages/home/components/SharedVisual/DetailShell.vue
+++ b/src/pages/home/components/SharedVisual/DetailShell.vue
@@ -1,6 +1,6 @@
 <template>
   <CardShell variant="detail">
-    <div class="visual-detail__header flex flex-items-center px-16 border-box border-bottom-F1F5F9">
+    <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"
         @click="$emit('back')">
         <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
diff --git a/src/pages/order/order/components/AmtSection/index.vue b/src/pages/order/order/components/AmtSection/index.vue
index 5bcb780..bffa18a 100644
--- a/src/pages/order/order/components/AmtSection/index.vue
+++ b/src/pages/order/order/components/AmtSection/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-white border-box rounded-12 p-12 mb-12">
+  <div class="bg-white  rounded-[12px] p-[12px] mb-12">
     <div class="flex flex-items-center flex-justify-between">
       <div class="flex flex-items-center">
         <span class="font-size-16 color-171717 line-height-24 font-500">
@@ -14,10 +14,10 @@
       超时后，订单将自动取消
     </div>
     <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>
+      class=" border-top flex flex-items-center flex-justify-between text-[12px] pt-12 mt-12">
+      <div class="text-[#525866]">取消政策及说明</div>
       <div class="flex flex-items-center" @click="emit('click')">
-        <span class="theme-color-500 mr-4">查看详情</span>
+        <span class="theme-color-500 mr-[4px]">查看详情</span>
         <uni-icons type="right" size="12" color="#99A0AE" />
       </div>
     </div>
diff --git a/src/pages/order/order/components/FooterSection/index.vue b/src/pages/order/order/components/FooterSection/index.vue
index bd215ec..c471d20 100644
--- a/src/pages/order/order/components/FooterSection/index.vue
+++ b/src/pages/order/order/components/FooterSection/index.vue
@@ -1,15 +1,15 @@
 <template>
-  <div class="footer bg-white border-box flex flex-items-center flex-justify-between p-12">
+  <div class="footer bg-white  flex flex-items-center flex-justify-between p-[12px]">
     <button v-if="['1', '2'].includes(statusCode)"
-      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"
+      class="left border-none  bg-white rounded-10 flex flex-items-center flex-justify-center text-[14px] font-500 text-[#525866] mr-12"
       @click="emit('refund', orderData)">
       申请退款
     </button>
     <button :class="[
       '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),
+        'text-[#ff3d60]': statusCode === '0',
+        'text-white': ['1', '2', '3', '4', '5', '6'].includes(statusCode),
       },
     ]" @click="handleButtonClick(orderData)">
       {{ buttonspan }}
diff --git a/src/pages/order/order/components/GoodsInfo/index.vue b/src/pages/order/order/components/GoodsInfo/index.vue
index e67a6a3..a15e1de 100644
--- a/src/pages/order/order/components/GoodsInfo/index.vue
+++ b/src/pages/order/order/components/GoodsInfo/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="orderType == 0" class="border-box bg-white p-12 rounded-12 mb-12">
+  <div v-if="orderType == 0" class=" bg-white p-[12px] rounded-[12px] mb-12">
     <!-- 酒店类型入住离店日期部分 -->
     <DateRangeSection v-if="orderData.orderType == 0" :selectedDate="selectedDate" />
 
@@ -7,31 +7,30 @@
       {{ orderData.commodityName }}
     </div>
 
-    <div class="border-box border-bottom text-[12px] color-99A0AE line-height-16 pb-12">
+    <div class=" 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"
+    <div class=" flex flex-items-center pt-12">
+      <span class="bg-F7F7F7  rounded-4 font-size-11 text-[#525866] mr-[4px] pt-4 pb-4 pl-6 pr-6"
         v-for="(item, index) in commodityFacilityList" :key="index">
         {{ item }}
       </span>
     </div>
   </div>
 
-  <div v-if="orderType != 0" class="border-box bg-white p-12 rounded-12 mb-12">
+  <div v-if="orderType != 0" class=" bg-white p-[12px] rounded-[12px] mb-12">
     <div class="font-size-16 font-500 color-000 line-height-24 ellipsis-1 mb-8">
       {{ orderData.commodityName }}
     </div>
 
     <div class="flex text-[12px]">
       <span class="w-60 color-99A0AE">购买数量</span>
-      <span class="color-525866">{{ commodityAmount }}</span>
+      <span class="text-[#525866]">{{ commodityAmount }}</span>
     </div>
 
-    <div v-if="orderData.orderStatus === '0'"
-      class="border-box border-top pt-12 text-[14px] font-500 color-171717 mt-12">
+    <div v-if="orderData.orderStatus === '0'" class=" border-top pt-12 text-[14px] font-500 color-171717 mt-12">
       凭[电子凭证]直接验证使用
     </div>
   </div>
diff --git a/src/pages/order/order/components/OrderCard/OrderCardContent.vue b/src/pages/order/order/components/OrderCard/OrderCardContent.vue
index e6acfa5..08ce3ae 100644
--- a/src/pages/order/order/components/OrderCard/OrderCardContent.vue
+++ b/src/pages/order/order/components/OrderCard/OrderCardContent.vue
@@ -1,12 +1,12 @@
 <template>
-  <div class="card-content border-box pt-12">
+  <div class="card-content  pt-12">
     <div class="flex items-center justify-between">
-      <div class="left flex-full text-[14px] line-height-20 color-171717 mr-12">
+      <div class="left flex-full text-[14px] leading-[20px] 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',
+        'right font-size-18 font-bold leading-[20px]',
+        orderData.orderStatus === '0' ? 'color-FF3D60' : 'text-[#525866]',
       ]">
         {{ orderData.orderAmt }}
       </div>
diff --git a/src/pages/order/order/components/OrderCard/index.vue b/src/pages/order/order/components/OrderCard/index.vue
index 9ce1624..e105f8b 100644
--- a/src/pages/order/order/components/OrderCard/index.vue
+++ b/src/pages/order/order/components/OrderCard/index.vue
@@ -1,10 +1,10 @@
 <template>
-  <div class="order-card bg-white border-box p-12 rounded-12 m-12" @click.stop="handleCardClick">
+  <div class="order-card bg-white  p-[12px] rounded-[12px] m-[12px]" @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 text-[14px] line-height-20 color-525866">
+        <img class="status-icon mr-[4px]" :src="getStatusIcon()" />
+        <div class="order-title text-[14px] leading-[20px] text-[#525866]">
           {{ getOrderTypeName() }}
         </div>
       </div>
@@ -21,7 +21,7 @@
 
     <div v-if="orderData.orderStatus === '0'" class="span-right">
       <button
-        class="go-pay border-box border-none text-[14px] color-white bg-FF3D60 rounded-5 inline-block span-center line-height-30"
+        class="go-pay  border-none text-[14px] text-white text-[#ff3d60] rounded-[5px] inline-block text-center leading-[30px]"
         @click.stop="handleCardClick">
         去支付
       </button>
diff --git a/src/pages/order/order/components/OrderInfo/index.vue b/src/pages/order/order/components/OrderInfo/index.vue
index 1f536d6..31c43a5 100644
--- a/src/pages/order/order/components/OrderInfo/index.vue
+++ b/src/pages/order/order/components/OrderInfo/index.vue
@@ -1,12 +1,12 @@
 <template>
-  <div class="bg-white border-box rounded-10 p-12">
+  <div class="bg-white  rounded-10 p-[12px]">
     <div class="flex mb-8 text-[12px]">
       <span class="w-60 color-99A0AE">订单编号</span>
-      <span class="color-525866">{{ orderData.orderId }}</span>
+      <span class="text-[#525866]">{{ orderData.orderId }}</span>
     </div>
     <div class="flex mb-8 text-[12px]">
       <span class="w-60 color-99A0AE">下单时间</span>
-      <span class="color-525866">{{ orderData.createTime }}</span>
+      <span class="text-[#525866]">{{ orderData.createTime }}</span>
     </div>
     <div class="flex text-[12px]">
       <span class="w-60 color-99A0AE">支付状态</span>
diff --git a/src/pages/order/order/components/OrderQrcode/index.vue b/src/pages/order/order/components/OrderQrcode/index.vue
index 4dc4bf5..3b0ab08 100644
--- a/src/pages/order/order/components/OrderQrcode/index.vue
+++ b/src/pages/order/order/components/OrderQrcode/index.vue
@@ -56,7 +56,7 @@
           </div>
 
           <div v-if="false"
-            class="mt-[20px] bg-theme-color-50 text-[#0CCD58] text-[14px] px-12 line-height-24 rounded-12">
+            class="mt-[20px] bg-theme-color-50 text-[#0CCD58] text-[14px] px-12 line-height-24 rounded-[12px]">
             {{ selectedVoucher.name }}
           </div>
         </div>
diff --git a/src/pages/order/order/components/UserInfo/index.vue b/src/pages/order/order/components/UserInfo/index.vue
index 2050fd0..550d6f5 100644
--- a/src/pages/order/order/components/UserInfo/index.vue
+++ b/src/pages/order/order/components/UserInfo/index.vue
@@ -1,14 +1,14 @@
 <template>
-  <div class="bg-white border-box rounded-10 p-12 mb-12" v-if="hasConsumerData">
+  <div class="bg-white  rounded-10 p-[12px] mb-12" v-if="hasConsumerData">
     <div v-for="(item, index) in consumerList" :key="index">
       <div class="flex mb-8 text-[12px]">
         <span class="w-60 color-99A0AE">住客姓名</span>
-        <span class="color-525866">{{ item.visitorName }}</span>
+        <span class="text-[#525866]">{{ item.visitorName }}</span>
       </div>
     </div>
     <div class="flex text-[12px]">
       <span class="w-60 color-99A0AE">联系电话</span>
-      <span class="color-525866">{{ contactPhone }}</span>
+      <span class="text-[#525866]">{{ contactPhone }}</span>
     </div>
   </div>
 </template>
diff --git a/src/pages/order/order/components/VoucherList/index.vue b/src/pages/order/order/components/VoucherList/index.vue
index aef57e9..0f6950d 100644
--- a/src/pages/order/order/components/VoucherList/index.vue
+++ b/src/pages/order/order/components/VoucherList/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-white border-box rounded-12 px-12 pt-12 mb-12">
+  <div class="bg-white  rounded-[12px] px-12 pt-12 mb-12">
     <span class="font-size-16 color-171717 line-height-24 font-500">
       核销凭证列表
     </span>
@@ -12,7 +12,7 @@
       <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 text-[12px] p-4 rounded-4 mr-4">
+          <div class="bg-F5F7FA span-color-600 text-[12px] p-4 rounded-4 mr-[4px]">
             总计{{ item.count }}{{ item.unit }}
           </div>
           <div class="bg-theme-color-50 theme-color-500 text-[12px] p-4 rounded-4">
@@ -23,7 +23,7 @@
 
       <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-if="item.packageStatus === 0" class="text-[14px] text-white">出示凭证</span>
         <span v-else class="text-[14px] span-color-300">已核销</span>
       </div>
     </div>
diff --git a/src/pages/order/order/detail.vue b/src/pages/order/order/detail.vue
index 3cfdf7b..96cfd1f 100644
--- a/src/pages/order/order/detail.vue
+++ b/src/pages/order/order/detail.vue
@@ -2,7 +2,7 @@
   <div class="order-detail-page flex flex-col h-screen">
     <TopNavBar titleAlign="center" :background="$theme - color - 100" title="订单详情" />
 
-    <div class="order-detail-wrapper border-box flex-full overflow-hidden scroll-y">
+    <div class="order-detail-wrapper  flex-full overflow-hidden scroll-y">
       <OrderStatusInfo :orderData="orderData" />
 
       <VoucherList v-if="orderData.orderType != 0 && orderData.orderStatus === '2'" :orderData="orderData"
diff --git a/src/pages/quick/index.vue b/src/pages/quick/index.vue
index be86370..351b82c 100644
--- a/src/pages/quick/index.vue
+++ b/src/pages/quick/index.vue
@@ -8,21 +8,21 @@
 
       <!-- 选择入住、离店日期 0:是酒店 -->
       <div v-if="didSelectedTabItem && didSelectedTabItem.orderType == 0"
-        class="bg-white border-box flex flex-items-center p-12">
+        class="bg-white  flex flex-items-center p-[12px]">
         <div class="in flex flex-items-center">
-          <span class="font-size-11 font-500 color-99A0AE mr-4">入住</span>
+          <span class="font-size-11 font-500 color-99A0AE mr-[4px]">入住</span>
           <span class="text-[14px] font-500 color-171717">
             {{ selectedDate.startDate }}
           </span>
         </div>
 
         <!-- 几晚 -->
-        <span class="nights bg-E5E8EE border-box font-size-11 font-500 color-525866 rounded-50 ml-8 mr-8">
+        <span class="nights bg-E5E8EE  font-size-11 font-500 text-[#525866] rounded-[5px]0 ml-8 mr-8">
           {{ selectedDate.totalDays }}晚
         </span>
 
         <div class="out flex flex-items-center">
-          <span class="font-size-11 font-500 color-99A0AE mr-4">离店</span>
+          <span class="font-size-11 font-500 color-99A0AE mr-[4px]">离店</span>
           <span class="text-[14px] font-500 color-171717">
             {{ selectedDate.endDate }}
           </span>