团队页（布局）

src/components/layout/Footer.vue

@@ -82,22 +82,20 @@
               © 2021 shyoubai.com. All rights reserved
             </p>
           </div>
-          <div class="flex flex-wrap justify-center gap-x-4 gap-y-2">
-            <a href="#" class="text-gray-500 hover:text-primary transition-colors text-xs sm:text-sm">
-              隐私政策
+          <div class="flex flex-col sm:flex-row justify-center items-center gap-3 text-gray-500 text-sm">
+            <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=31010402009014"
+               class="flex items-center hover:text-primary transition-colors duration-200 group">
+              <img src="@/assets/images/gongan.png" alt="公安备案图标" class="h-4 mr-1.5 group-hover:scale-105 transition-transform">
+              <span>沪公网安备 31010402009014号</span>
             </a>
-            <span class="text-gray-500 hidden sm:inline">|</span>
-            <a href="#" class="text-gray-500 hover:text-primary transition-colors text-xs sm:text-sm">
-              使用条款
+
+            <span class="hidden sm:inline-block text-gray-400">|</span>
+
+            <a href="https://beian.miit.gov.cn/"
+               class="flex items-center hover:text-primary transition-colors duration-200 group">
+              <img src="@/assets/images/icp.png" alt="公安备案图标" class="h-4 mr-1.5 group-hover:scale-105 transition-transform">
+              <span>沪ICP备2021007173号-1</span>
             </a>
-            <span class="text-gray-500 hidden sm:inline">|</span>
-            <span class="text-gray-500 text-xs sm:text-sm">
-              沪公网安备 31010402009014号
-            </span>
-            <span class="text-gray-500 hidden sm:inline">|</span>
-            <span class="text-gray-500 text-xs sm:text-sm">
-              沪ICP备2021007173号-1
-            </span>
           </div>
         </div>
       </div>

src/views/Team.vue

@@ -12,9 +12,8 @@
       </div>
     </div>
 
-    <!-- 领导团队 -->
+    <!-- 技术团队介绍 -->
     <section class="py-16 md:py-24">
-
       <div class="container mx-auto px-4">
         <SectionTitle
             title="技术团队"
@@ -23,7 +22,6 @@
             align="center"
         />
 
-
         <div class="mt-16">
           <div class="bg-white rounded-2xl overflow-hidden shadow-lg p-6 mb-12">
             <div class="flex flex-col md:flex-row">
@@ -35,14 +33,19 @@
               <div class="md:w-2/3 md:pl-8">
                 <h3 class="text-2xl font-bold text-gray-900 mb-4">技术专家团队</h3>
                 <p class="text-gray-600 mb-6">
-                  酉佰是一支秉承着“开放透明、纪律严明、听从指挥、主观能动”管理风格的团队。我们遵循循序渐进，但绝不放任自流的管理理念。
+                  酉佰佰是一支秉承着"开放透明、纪律严明、听从指挥、主观能动"管理风格的团队。
+                  我们遵循循序渐进，但绝不放任自流的管理理念。
                 </p>
                 <p class="text-gray-600 mb-6">
-                  团队目前有10名成员左右，由一批具有金融、数理、工科等背景的海归硕士及国内顶尖院校硕士组成。公司团队工作开放透明，和谐融洽，注重深入研究、互相学习和分享交流。研究方面，公司按照对市场的理解，目前从现货市场入手，覆盖货币、债券、证券、商品等，未来将逐步拓展到期货、期权等衍生品市场，最后覆盖到全球市场。
+                  团队目前有10名成员左右，由一批具有金融、数理、工科等背景的海归硕士及国内顶尖院校硕士组成。
+                  公司团队工作开放透明，和谐融洽，注重深入研究、互相学习和分享交流。
                 </p>
                 <div class="flex flex-wrap gap-2">
-                  <span v-for="(skill, idx) in ['金融', '数理', '工科']" :key="idx"
-                        class="bg-blue-50 text-blue-700 px-3 py-1.5 rounded-lg text-sm">
+                  <span
+                      v-for="(skill, idx) in ['金融', '数理', '工科']"
+                      :key="idx"
+                      class="bg-blue-50 text-blue-700 px-3 py-1.5 rounded-lg text-sm"
+                  >
                     {{ skill }}
                   </span>
                 </div>
@@ -52,114 +55,62 @@
         </div>
       </div>
     </section>
-    <!-- 领导团队 -->
-    <section class="py-16 md:py-24">
-      <div class="container mx-auto px-4">
-        <SectionTitle
-            title="领导团队"
-            subtitle="核心管理"
-            description="我们的管理层拥有丰富的行业经验和专业知识"
-            align="center"
-        />
 
-        <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8 mt-16">
-          <TeamMember
-              v-for="(leader, index) in leaders"
-              :key="index"
-              :member="leader"
-          />
-        </div>
-      </div>
-    </section>
-
-    <!-- 技术团队 -->
+    <!-- 发展规划 -->
     <section class="py-16 md:py-24 bg-gray-50">
       <div class="container mx-auto px-4">
         <SectionTitle
-            title="技术团队"
-            subtitle="专业卓越"
-            description="技术团队的核心成员拥有深厚的行业背景和技术专长"
+            title="发展规划"
+            subtitle="未来愿景"
+            description="酉佰佰团队的战略发展规划"
             align="center"
         />
 
         <div class="mt-16">
-          <div class="bg-white rounded-2xl overflow-hidden shadow-lg p-6 mb-12">
+          <div class="bg-white rounded-2xl overflow-hidden shadow-lg p-6">
             <div class="flex flex-col md:flex-row">
               <div class="md:w-1/3 mb-6 md:mb-0">
-                <div class="bg-gradient-to-br from-blue-50 to-indigo-100 rounded-xl h-56 flex items-center justify-center">
-                  <i class="fas fa-code text-5xl text-blue-500 opacity-50"></i>
+                <div class="bg-gradient-to-br from-amber-50 to-yellow-100 rounded-xl h-56 flex items-center justify-center">
+                  <i class="fas fa-chart-line text-5xl text-amber-500 opacity-50"></i>
                 </div>
               </div>
               <div class="md:w-2/3 md:pl-8">
-                <h3 class="text-2xl font-bold text-gray-900 mb-4">技术专家团队</h3>
+                <h3 class="text-2xl font-bold text-gray-900 mb-4">五年发展规划</h3>
                 <p class="text-gray-600 mb-6">
-                  我们的技术团队由多名资深架构师和行业专家组成，平均拥有8年以上相关领域经验。
-                  团队成员精通云计算、大数据、人工智能、物联网等前沿技术，致力于为客户提供创新的技术解决方案。
+                  酉佰佰团队刚经历了第一个五年的发展，展望未来，公司一方面致力于在宏观弱势期进行人才积累，
+                  另一方面也在积极地进行政治经济研究、产业企业研究、风险管理研究和投资等投资公司核心竞争力的孵化与锻炼。
+                </p>
+                <p class="text-gray-600">
+                  希望在2028年，公司第二个五年结束之际，能组建一支研究功底深厚、技能全面、初具实战能力的队伍。
                 </p>
-                <div class="flex flex-wrap gap-2">
-                  <span v-for="(skill, idx) in ['云计算', '大数据', 'AI/ML', '区块链', '物联网', '微服务', 'DevOps']" :key="idx"
-                        class="bg-blue-50 text-blue-700 px-3 py-1.5 rounded-lg text-sm">
-                    {{ skill }}
-                  </span>
               </div>
             </div>
           </div>
         </div>
-
-          <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6">
-            <TeamMember
-                v-for="(member, index) in techTeam"
-                :key="index"
-                :member="member"
-            />
-          </div>
-        </div>
       </div>
     </section>
 
-    <!-- 团队文化 -->
+    <!-- 研究领域 -->
     <section class="py-16 md:py-24">
       <div class="container mx-auto px-4">
-        <div class="flex flex-col lg:flex-row gap-16">
-          <div class="lg:w-5/12">
         <SectionTitle
-                title="团队文化"
-                subtitle="工作环境"
+            title="研究领域"
+            subtitle="专业覆盖"
+            description="我们的核心研究领域和发展方向"
+            align="center"
         />
 
-            <p class="text-gray-600 mt-6 mb-8">
-              我们致力于打造一个充满活力、开放包容、鼓励创新的工作环境。
-              为团队成员提供良好的发展平台和职业成长空间。
-            </p>
-
-            <div class="space-y-5">
-              <div v-for="(feature, index) in cultureFeatures" :key="index" class="flex">
-                <div class="w-12 h-12 rounded-lg bg-amber-50 flex items-center justify-center mr-4 text-amber-600">
-                  <i :class="feature.icon"></i>
-                </div>
-                <div>
-                  <h3 class="font-medium text-gray-900">{{ feature.title }}</h3>
-                  <p class="text-gray-600 text-sm mt-1">{{ feature.description }}</p>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <div class="lg:w-7/12">
-            <div class="grid grid-cols-2 gap-4">
-              <div v-for="i in 4" :key="i" class="rounded-xl overflow-hidden aspect-square">
-                <div :class="['h-full flex items-center justify-center',
-                           `bg-gradient-to-br ${i === 1 ? 'from-blue-100 to-blue-200' :
-                            i === 2 ? 'from-amber-100 to-amber-200' :
-                            i === 3 ? 'from-indigo-100 to-indigo-200' :
-                            'from-green-100 to-green-200'}`]">
-                  <i :class="[i === 1 ? 'fas fa-users' :
-                            i === 2 ? 'fas fa-laptop-code' :
-                            i === 3 ? 'fas fa-brain' : 'fas fa-glass-cheers']"
-                     class="text-4xl opacity-30"></i>
-                </div>
-              </div>
+        <div class="mt-16 grid md:grid-cols-3 gap-8">
+          <div
+              v-for="(field, index) in researchFields"
+              :key="index"
+              class="bg-white rounded-2xl overflow-hidden shadow-lg p-6 hover:shadow-xl transition-shadow"
+          >
+            <div class="w-16 h-16 rounded-full bg-blue-100 flex items-center justify-center mb-4">
+              <i :class="field.icon" class="text-2xl text-blue-600"></i>
             </div>
+            <h3 class="text-xl font-bold text-gray-900 mb-2">{{ field.title }}</h3>
+            <p class="text-gray-600">{{ field.description }}</p>
           </div>
         </div>
       </div>
@@ -171,7 +122,7 @@
         <div class="max-w-3xl mx-auto text-center">
           <h2 class="text-3xl md:text-4xl font-bold mb-6">加入我们的团队</h2>
           <p class="text-xl text-blue-300 mb-8">
-            如果你才华横溢、充满激情、渴望成长，我们欢迎你加入酉佰大家庭
+            如果你才华横溢、充满激情、渴望成长，我们欢迎你加入酉佰佰大家庭
           </p>
           <router-link
               to="/careers"
@@ -188,44 +139,46 @@
 
 <script setup>
 import SectionTitle from '@/components/ui/SectionTitle.vue'
-import TeamMember from '@/components/ui/TeamMember.vue'
 
-const leaders = [
-  { name: '张总', position: '创始人 & CEO', description: '拥有15年行业经验，成功创办两家企业' },
-  { name: '李经理', position: '技术总监', description: '前全球500强企业技术负责人，系统架构专家' },
-  { name: '王女士', position: '运营总监', description: '项目管理专家，曾管理过多个千万级项目' },
-  { name: '陈总监', position: '市场总监', description: '资深营销专家，拥有丰富的品牌建设经验' }
-]
-
-const techTeam = [
-  { name: '张工', position: '首席架构师' },
-  { name: '李工', position: '大数据专家' },
-  { name: '陈工', position: 'AI研究员' },
-  { name: '刘工', position: '云平台专家' },
-  { name: '王工', position: '前端技术专家' },
-  { name: '赵工', position: '安全专家' },
-]
-
-const cultureFeatures = [
+const researchFields = [
   {
-    title: '学习与发展',
-    icon: 'fas fa-book-reader',
-    description: '每年提供专项培训预算和职业发展计划'
+    icon: 'fas fa-coins',
+    title: '现货市场',
+    description: '覆盖货币、债券、证券、商品等核心领域，深入研究市场动态'
   },
   {
-    title: '创新文化',
-    icon: 'fas fa-lightbulb',
-    description: '鼓励创新思维，设有专项创新奖励基金'
+    icon: 'fas fa-chart-bar',
+    title: '衍生品市场',
+    description: '逐步拓展期货、期权等衍生品市场研究，完善投资体系'
   },
   {
-    title: '灵活办公',
-    icon: 'fas fa-laptop-house',
-    description: '提供灵活的办公时间和远程工作机会'
-  },
-  {
-    title: '团队建设',
-    icon: 'fas fa-users',
-    description: '定期组织团建活动和兴趣小组交流'
+    icon: 'fas fa-globe-americas',
+    title: '全球市场',
+    description: '最终覆盖全球市场，打造国际化研究能力与投资视野'
   }
 ]
+
+/*
+换一种排版布局，要把这几个图片用进去，分别是src/assets/images/team.png，
+src/assets/images/team0001.jpeg，
+src/assets/images/team0003.jpeg
+ */
 </script>
+
+<style scoped>
+/* 响应式调整 */
+@media (max-width: 768px) {
+  .flex-col.md\:flex-row {
+    flex-direction: column;
+  }
+
+  .md\:w-1\/3, .md\:w-2\/3 {
+    width: 100%;
+  }
+
+  .md\:pl-8 {
+    padding-left: 0;
+    padding-top: 1.5rem;
+  }
+}
+</style>