From 9719647407c15c9fd365174cca7350ff081ae14b Mon Sep 17 00:00:00 2001
From: WindowBird <13870814+windows-bird@user.noreply.gitee.com>
Date: Tue, 7 Oct 2025 10:35:34 +0800
Subject: [PATCH] =?UTF-8?q?=E5=85=B3=E4=BA=8E=E6=88=91=E4=BB=AC=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E6=B7=BB=E5=8A=A0=E4=BA=8C=E7=BB=B4=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/about/aboutUs.vue | 281 +++++++++++++++++++++++++++++++
 1 file changed, 281 insertions(+)

diff --git a/app/components/about/aboutUs.vue b/app/components/about/aboutUs.vue
index 2a0d3b6..f23c758 100644
--- a/app/components/about/aboutUs.vue
+++ b/app/components/about/aboutUs.vue
@@ -52,6 +52,108 @@ const stats = [
   {number: '50+', label: '技术专利'},
   {number: '5年+', label: '行业经验'}
 ]
+
+// 发展历程
+const timeline = [
+  {
+    year: '2018',
+    title: '公司成立',
+    description: '创特物联正式成立，专注于物联网技术研发'
+  },
+  {
+    year: '2019',
+    title: '产品上线',
+    description: '首款共享电动车管理系统正式上线运营'
+  },
+  {
+    year: '2020',
+    title: '业务扩展',
+    description: '拓展至共享汽车、共享充电桩等多个领域'
+  },
+  {
+    year: '2021',
+    title: '技术突破',
+    description: '获得多项技术专利，建立完善的技术体系'
+  },
+  {
+    year: '2022',
+    title: '市场领先',
+    description: '成为行业领先的共享经济解决方案提供商'
+  },
+  {
+    year: '2023',
+    title: '持续创新',
+    description: '推出AI智能调度系统，引领行业技术发展'
+  }
+]
+
+// 合作伙伴
+const partners = [
+  {
+    name: '华为云',
+    logo: 'https://picsum.photos/120/60?random=partner1',
+    description: '云计算服务合作伙伴'
+  },
+  {
+    name: '腾讯云',
+    logo: 'https://picsum.photos/120/60?random=partner2',
+    description: '大数据分析合作伙伴'
+  },
+  {
+    name: '阿里云',
+    logo: 'https://picsum.photos/120/60?random=partner3',
+    description: '物联网平台合作伙伴'
+  },
+  {
+    name: '百度AI',
+    logo: 'https://picsum.photos/120/60?random=partner4',
+    description: '人工智能技术合作伙伴'
+  },
+  {
+    name: '京东物流',
+    logo: 'https://picsum.photos/120/60?random=partner5',
+    description: '物流配送合作伙伴'
+  },
+  {
+    name: '滴滴出行',
+    logo: 'https://picsum.photos/120/60?random=partner6',
+    description: '出行服务合作伙伴'
+  }
+]
+
+// 荣誉资质
+const honors = [
+  {
+    title: '高新技术企业',
+    icon: 'i-lucide-award',
+    year: '2020'
+  },
+  {
+    title: 'ISO9001质量认证',
+    icon: 'i-lucide-shield-check',
+    year: '2019'
+  },
+  {
+    title: '软件著作权',
+    icon: 'i-lucide-file-text',
+    year: '2021'
+  },
+  {
+    title: '发明专利',
+    icon: 'i-lucide-lightbulb',
+    year: '2022'
+  },
+  {
+    title: '行业创新奖',
+    icon: 'i-lucide-trophy',
+    year: '2023'
+  },
+  {
+    title: '优秀服务商',
+    icon: 'i-lucide-star',
+    year: '2023'
+  }
+]
 </script>
 
 <template>
@@ -207,6 +309,185 @@ const stats = [
       </div>
     </section>
 
+    <!-- Professional Team Development -->
+    <section class="py-16 md:py-20">
+      <div class="container mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto text-center">
+          <h2 class="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-8">
+            专业团队研发
+          </h2>
+          <p class="text-xl text-gray-600 dark:text-gray-300 mb-12 max-w-2xl mx-auto">
+            我们的专业团队将为您精心研发更专业的系统
+          </p>
+          
+          <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-12">
+            <div class="text-center p-6 bg-white dark:bg-gray-800 rounded-xl shadow-lg">
+              <div class="w-16 h-16 mx-auto mb-4 bg-blue-600 dark:bg-blue-500 rounded-full flex items-center justify-center">
+                <UIcon name="i-lucide-code" class="w-8 h-8 text-white" />
+              </div>
+              <h3 class="text-xl font-semibold text-gray-900 dark:text-white mb-2">技术研发</h3>
+              <p class="text-gray-600 dark:text-gray-300">资深工程师团队，专注技术创新与产品优化</p>
+            </div>
+            
+            <div class="text-center p-6 bg-white dark:bg-gray-800 rounded-xl shadow-lg">
+              <div class="w-16 h-16 mx-auto mb-4 bg-green-600 dark:bg-green-500 rounded-full flex items-center justify-center">
+                <UIcon name="i-lucide-settings" class="w-8 h-8 text-white" />
+              </div>
+              <h3 class="text-xl font-semibold text-gray-900 dark:text-white mb-2">系统集成</h3>
+              <p class="text-gray-600 dark:text-gray-300">完善的系统架构，确保稳定可靠的运行</p>
+            </div>
+            
+            <div class="text-center p-6 bg-white dark:bg-gray-800 rounded-xl shadow-lg">
+              <div class="w-16 h-16 mx-auto mb-4 bg-purple-600 dark:bg-purple-500 rounded-full flex items-center justify-center">
+                <UIcon name="i-lucide-headphones" class="w-8 h-8 text-white" />
+              </div>
+              <h3 class="text-xl font-semibold text-gray-900 dark:text-white mb-2">专业服务</h3>
+              <p class="text-gray-600 dark:text-gray-300">7×24小时技术支持，全程贴心服务</p>
+            </div>
+          </div>
+          
+          <!-- QR Code Section -->
+          <div class="bg-white dark:bg-gray-800 rounded-2xl p-8 shadow-xl max-w-md mx-auto">
+            <div class="text-center">
+              <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">
+                扫码了解更多
+              </h3>
+              <div class="w-48 h-48 mx-auto mb-4 bg-gray-100 dark:bg-gray-700 rounded-lg flex items-center justify-center">
+                <div class="text-center">
+                  <div class="w-32 h-32 mx-auto mb-2 bg-black rounded-lg flex items-center justify-center">
+                    <div class="w-24 h-24 bg-white rounded-lg flex items-center justify-center">
+                      <div class="w-16 h-16 bg-gradient-to-br from-purple-400 via-pink-500 to-red-500 rounded-lg flex items-center justify-center">
+                        <UIcon name="i-lucide-zap" class="w-8 h-8 text-white" />
+                      </div>
+                    </div>
+                  </div>
+                  <p class="text-sm text-gray-600 dark:text-gray-400">微信扫码咨询</p>
+                </div>
+              </div>
+              <p class="text-sm text-gray-600 dark:text-gray-300">
+                专业团队为您提供一对一咨询服务
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Company Timeline -->
+    <section class="py-16 md:py-20 bg-white dark:bg-gray-800">
+      <div class="container mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="text-center mb-16">
+          <h2 class="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-4">
+            发展历程
+          </h2>
+          <p class="text-xl text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">
+            从创立到发展，见证我们的成长足迹
+          </p>
+        </div>
+        
+        <div class="max-w-4xl mx-auto">
+          <div class="relative">
+            <!-- Timeline line -->
+            <div class="absolute left-1/2 transform -translate-x-1/2 w-1 h-full bg-blue-200 dark:bg-gray-600"></div>
+            
+            <div class="space-y-12">
+              <div 
+                v-for="(item, index) in timeline" 
+                :key="item.year"
+                class="relative flex items-center"
+                :class="index % 2 === 0 ? 'flex-row' : 'flex-row-reverse'"
+              >
+                <!-- Timeline dot -->
+                <div class="absolute left-1/2 transform -translate-x-1/2 w-4 h-4 bg-blue-600 dark:bg-blue-500 rounded-full border-4 border-white dark:border-gray-800 z-10"></div>
+                
+                <!-- Content -->
+                <div 
+                  class="w-5/12 p-6 bg-white dark:bg-gray-700 rounded-xl shadow-lg"
+                  :class="index % 2 === 0 ? 'mr-auto' : 'ml-auto'"
+                >
+                  <div class="text-blue-600 dark:text-blue-400 font-bold text-lg mb-2">
+                    {{ item.year }}
+                  </div>
+                  <h3 class="text-xl font-semibold text-gray-900 dark:text-white mb-2">
+                    {{ item.title }}
+                  </h3>
+                  <p class="text-gray-600 dark:text-gray-300">
+                    {{ item.description }}
+                  </p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Partners Section -->
+    <section class="py-16 md:py-20">
+      <div class="container mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="text-center mb-16">
+          <h2 class="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-4">
+            合作伙伴
+          </h2>
+          <p class="text-xl text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">
+            与行业领先企业携手，共创美好未来
+          </p>
+        </div>
+        
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-8">
+          <div 
+            v-for="partner in partners" 
+            :key="partner.name"
+            class="text-center p-4 bg-white dark:bg-gray-800 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300"
+          >
+            <img 
+              :src="partner.logo" 
+              :alt="partner.name"
+              class="w-full h-12 object-contain mb-3"
+            >
+            <h3 class="text-sm font-semibold text-gray-900 dark:text-white mb-1">
+              {{ partner.name }}
+            </h3>
+            <p class="text-xs text-gray-600 dark:text-gray-300">
+              {{ partner.description }}
+            </p>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Honors Section -->
+    <section class="py-16 md:py-20 bg-white dark:bg-gray-800">
+      <div class="container mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="text-center mb-16">
+          <h2 class="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-4">
+            荣誉资质
+          </h2>
+          <p class="text-xl text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">
+            专业认证，品质保证
+          </p>
+        </div>
+        
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+          <div 
+            v-for="honor in honors" 
+            :key="honor.title"
+            class="text-center p-6 bg-gradient-to-br from-blue-50 to-indigo-50 dark:from-gray-700 dark:to-gray-600 rounded-xl hover:shadow-lg transition-all duration-300"
+          >
+            <div class="w-16 h-16 mx-auto mb-4 bg-yellow-500 dark:bg-yellow-600 rounded-full flex items-center justify-center">
+              <UIcon :name="honor.icon" class="w-8 h-8 text-white" />
+            </div>
+            <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">
+              {{ honor.title }}
+            </h3>
+            <p class="text-blue-600 dark:text-blue-400 font-medium">
+              {{ honor.year }}
+            </p>
+          </div>
+        </div>
+      </div>
+    </section>
+
     <!-- Contact Section -->
     <!--    <section class="py-16 md:py-20">-->
     <!--      <div class="container mx-auto px-4 sm:px-6 lg:px-8">-->