Selaa lähdekoodia

fix: about修改

Lee 3 päivää sitten
vanhempi
commit
430fd55794
1 muutettua tiedostoa jossa 38 lisäystä ja 48 poistoa
  1. 38 48
      app/pages/about/components/about.vue

+ 38 - 48
app/pages/about/components/about.vue

@@ -2,7 +2,7 @@
  * @Author: LiZhiWei
  * @Date: 2026-01-21 08:51:46
  * @LastEditors: LiZhiWei
- * @LastEditTime: 2026-01-21 16:20:49
+ * @LastEditTime: 2026-01-21 18:00:08
  * @Description: 
 -->
 <template>
@@ -13,41 +13,21 @@
   >
     <div class="inner-container">
       <!-- Top Section -->
-      <div>
-        <div class="top-header">
-          <div class="title-wrapper pf-sc-semibold">
-            <span class="brand-text">绘家科技</span>
-            <span class="who-is-text">是谁</span>
-            <span class="separator"></span>
-          </div>
-          <div>
-            <span class="desc-text pf-sc-regular">
-              海南绘家科技有限公司矢志成为优秀的智慧社区组整体解决方案供应商和完整居住社区整体解决方案供应商。公司以技术研发为核心,深耕物业行业,致力于借助智能硬件、互联网、物联网、云计算、大数据分析、人工智能等技术推动物业服务企业发展线上线下社区服务业,实现数字化、智能化、精细化的管理与服务提升物业服务品质,提高企业管理效率,助力智慧社区建设。
-            </span>
-          </div>
-        </div>
-        <div class="company-desc-wrapper">
-          <span class="desc-text pf-sc-regular">
-            目前,公司拥有绘管家物业综合管理云平台、绘服务居民在线服务平台、绘享云大数据分析平台、无人值守停车场、人脸识别门禁、智能监控、智能充电桩、远程抄表、机械环保作业设备、地勤指挥中心、物业综合配套等全方位的智慧物业和智慧社区解决方案及服务体系。截止2025年12月绘管家已在住宅小区、商业广场、写字楼、政企办公楼、医院、工业园区、菜篮子农贸市场7个业态的项目落地,绘管家平台管理面积超1800万平方米,覆盖近800多个小区、50万+套房屋。
-          </span>
-        </div>
-      </div>
+
       <!-- Bottom Section -->
       <div class="bottom-section">
         <!-- Left Content -->
         <div class="left-content">
-          <div class="stats-title pf-sc-semibold">
-            <span class="stats-highlight">800+家</span>
-            <span>小区已经选择绘家</span>
+          <div class="title-wrapper pf-sc-semibold">
+            <span class="brand-text">绘家科技</span>
+            <span class="who-is-text">是谁</span>
           </div>
-          <div class="stats-grid">
-            <div v-for="(item, index) in stats" :key="index">
-              <div class="stat-label pf-sc-regular">
-                {{ item.label }}
-              </div>
-              <div class="stat-value d-din-pro-600-semibold">
-                {{ item.value }}
-              </div>
+          <div class="company-desc-wrapper">
+            <div class="desc-text pf-sc-regular">
+              海南绘家科技有限公司矢志成为优秀的智慧社区组整体解决方案供应商和完整居住社区整体解决方案供应商。公司以技术研发为核心,深耕物业行业,致力于借助智能硬件、互联网、物联网、云计算、大数据分析、人工智能等技术推动物业服务企业发展线上线下社区服务业,实现数字化、智能化、精细化的管理与服务提升物业服务品质,提高企业管理效率,助力智慧社区建设。
+            </div>
+            <div class="desc-text pf-sc-regular">
+              目前,公司拥有绘管家物业综合管理云平台、绘服务居民在线服务平台、绘享云大数据分析平台、无人值守停车场、人脸识别门禁、智能监控、智能充电桩、远程抄表、机械环保作业设备、地勤指挥中心、物业综合配套等全方位的智慧物业和智慧社区解决方案及服务体系。
             </div>
           </div>
           <button class="consult-btn">
@@ -55,7 +35,6 @@
             <div class="btn-icon"></div>
           </button>
         </div>
-
         <!-- Right Video Card -->
         <div class="video-card play-box">
           <!-- 极致毛玻璃圆盘 -->
@@ -64,6 +43,22 @@
           </div>
         </div>
       </div>
+      <div>
+        <div class="stats-title pf-sc-semibold">
+          <span class="stats-highlight">800+家</span>
+          <span>小区已经选择绘家</span>
+        </div>
+        <div class="stats-grid">
+          <div v-for="(item, index) in stats" :key="index">
+            <div class="stat-label pf-sc-regular">
+              {{ item.label }}
+            </div>
+            <div class="stat-value d-din-pro-600-semibold">
+              {{ item.value }}
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
 
     <!-- Video Modal -->
@@ -100,7 +95,7 @@
     { label: '服务客户', value: '300+' },
     { label: '管理小区', value: '800+' },
     { label: '城市合伙人', value: '3+' },
-    { label: '房屋', value: '500000+' },
+    { label: '房屋', value: '50w+' },
     { label: '账单资金', value: '15亿/年' },
   ]
 
@@ -136,8 +131,8 @@
 
 <style scoped lang="scss">
   .about-section {
-    @apply bg-white py-100px;
-    @apply lt-sm:py-120px;
+    @apply bg-white py-120px;
+    @apply lt-sm:pt-40px lt-sm:pb-120px;
   }
 
   .inner-container {
@@ -146,7 +141,7 @@
   }
 
   .top-header {
-    @apply flex items-center justify-between gap-68px;
+    @apply flex items-center justify-between gap-68px flex-col;
     @apply lt-sm:flex-col lt-sm:gap-36px;
   }
 
@@ -165,33 +160,28 @@
     @apply lt-sm:font-s-48px;
   }
 
-  .separator {
-    @apply inline-block w-32px h-6px bg-#1E293B align-middle ml-16px;
-    @apply lt-sm:hidden;
-  }
-
   .desc-text {
     @apply font-s-16px text-#000000 lh-26px;
     @apply lt-sm:font-s-26px lt-sm:lh-42px;
   }
 
   .company-desc-wrapper {
-    @apply mt-32px;
+    @apply flex flex-col gap-32px;
   }
 
   .bottom-section {
-    @apply mt-80px flex items-stretch justify-between gap-32px;
+    @apply flex items-stretch justify-between gap-64px;
     @apply lt-sm:flex-col lt-sm:mt-120px lt-sm:gap-56px;
   }
 
   .left-content {
-    @apply flex-1 flex flex-col gap-72px;
+    @apply flex-1 flex flex-col gap-40px;
     @apply lt-sm:items-center lt-sm:gap-56px;
   }
 
   .stats-title {
-    @apply font-s-36px lh-normal;
-    @apply lt-sm:font-s-48px lt-sm:text-center;
+    @apply font-s-36px lh-normal hidden;
+    @apply lt-sm:font-s-48px lt-sm:text-center lt-sm:mt-72px;
   }
 
   .stats-highlight {
@@ -199,8 +189,8 @@
   }
 
   .stats-grid {
-    @apply grid grid-cols-3 gap-y-48px;
-    @apply lt-sm:gap-x-144px lt-sm:gap-y-36px lt-sm:grid-cols-2;
+    @apply flex justify-between mt-72px;
+    @apply lt-sm:grid lt-sm:gap-x-132px lt-sm:gap-y-36px lt-sm:grid-cols-2 lt-sm:px-58px lt-sm:mt-36px;
   }
 
   .stat-label {