refactor(ui): clean up stepper and standardize margin spacing

- replace uni-icons with van-icon in Stepper component
- fix semantic markup by replacing <text> tag with <span> in Stepper
- inline SCSS styles for Stepper and remove unused image and style files
- standardize ml-4 utility class to ml-[4px] across multiple UI components for consistent exact 4px horizontal margins

src/components/DateRangeSection/index.vue

@@ -8,7 +8,7 @@
       <span class="total rounded-[5px] 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">
+      <span class="text-[12px] text-[#171717] ml-[4px]">
         {{ selectedDate.endDate }}
       </span>
     </div>

src/components/GoodDetail/index.vue

@@ -13,7 +13,7 @@
         }">
           <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]">
+            <span class="ml-[4px] text-[14px] text-[#171717] leading-[20px]">
               {{ moduleItem.moduleTitle }}
             </span>
           </div>

src/components/Stepper/index.vue

@@ -1,10 +1,10 @@
 <template>
-  <div class="stepper-wrapper  flex items-center rounded-[8px]">
+  <div class="bg-[#f3f9ff] p-[4px_7px] flex items-center rounded-[8px]">
-    <uni-icons type="minus" size="24" color="#D1D1D1" @click="decrease" />
+    <van-icon name="minus" size="24" color="#D1D1D1" @click="decrease" />
-    <text class="stepper-text text-center text-[14px] font-medium text-black ml-4 mr-[4px]">
+    <span class="max-w-[40px] text-center text-[14px] font-medium text-black ml-[4px] mr-[4px]">
       {{ value }} {{ unit }}
-    </text>
+    </span>
-    <uni-icons type="plus" size="24" color="#198CFF" @click="increase" />
+    <van-icon name="plus" size="24" color="#198CFF" @click="increase" />
   </div>
 </template>
 
@@ -65,7 +65,3 @@ const increase = () => {
   }
 };
 </script>
-
-<style scoped lang="scss">
-@import "./styles/index.scss";
-</style>

src/components/Stepper/styles/index.scss

@@ -1,8 +0,0 @@
-.stepper-wrapper {
-  background-color: #f3f9ff;
-  padding: 4px 7px;
-}
-
-.stepper-text {
-  max-width: 40px;
-}

src/pages/album/index.vue

@@ -2,7 +2,7 @@
   <div class="bg-[#f5f7fa] flex flex-col h-screen overflow-hidden">
     <TopNavBar title="房间相册" backgroundColor="transparent" />
     <div class="p-8">
-      <span class="ml-4 text-[18px] text-[#171717] font-medium">全部({{ albumList.length }})</span>
+      <span class="ml-[4px] text-[18px] text-[#171717] font-medium">全部({{ albumList.length }})</span>
     </div>
 
     <scroll-div scroll-y class="scroll-container overflow-auto">

src/pages/order/order/components/AmtSection/index.vue

@@ -5,7 +5,7 @@
         <span class="text-[16px] text-[#171717] leading-[24px] font-medium">
           订单金额
         </span>
-        <span class="amt text-[18px] font-bold color-FF3D60 ml-4">
+        <span class="amt text-[18px] font-bold color-FF3D60 ml-[4px]">
           {{ orderData.payAmt }}
         </span>
       </div>