refactor: 重构首页布局并新增团队页面

- 删除 insights-section 和 testimonials-section 组件 - 新增团队页面 (team/) 及相关组件 - 添加"解决方案"导航项 - 新增 home-solutions-section、methodology-section、team-section 组件 - 优化首页内容结构和产品区块
2026-04-21 17:42:51 +08:00
parent 3ea5cf849e
commit b117372b03
14 changed files with 449 additions and 423 deletions
@@ -9,41 +9,57 @@ import type { ReactNode } from 'react';

 const ServicesSection = dynamic(
  () => import('@/components/sections/services-section').then(mod => ({ default: mod.ServicesSection })),
-  { 
+  {
    loading: () => <SectionSkeleton />,
-    ssr: false 
+    ssr: false
+  }
+);
+
+const HomeSolutionsSection = dynamic(
+  () => import('@/components/sections/home-solutions-section').then(mod => ({ default: mod.HomeSolutionsSection })),
+  {
+    loading: () => <SectionSkeleton />,
+    ssr: false
  }
 );

 const ProductsSection = dynamic(
  () => import('@/components/sections/products-section').then(mod => ({ default: mod.ProductsSection })),
-  { 
+  {
    loading: () => <SectionSkeleton />,
-    ssr: false 
+    ssr: false
  }
 );

 const CasesSection = dynamic(
  () => import('@/components/sections/cases-section').then(mod => ({ default: mod.CasesSection })),
-  { 
+  {
    loading: () => <SectionSkeleton />,
-    ssr: false 
+    ssr: false
  }
 );

 const AboutSection = dynamic(
  () => import('@/components/sections/about-section').then(mod => ({ default: mod.AboutSection })),
-  { 
+  {
    loading: () => <SectionSkeleton />,
-    ssr: false 
+    ssr: false
+  }
+);
+
+const TeamSection = dynamic(
+  () => import('@/components/sections/team-section').then(mod => ({ default: mod.TeamSection })),
+  {
+    loading: () => <SectionSkeleton />,
+    ssr: false
  }
 );

 const NewsSection = dynamic(
  () => import('@/components/sections/news-section').then(mod => ({ default: mod.NewsSection })),
-  { 
+  {
    loading: () => <SectionSkeleton />,
-    ssr: false 
+    ssr: false
  }
 );

@@ -83,9 +99,11 @@ function HomeContent({ heroStats }: { heroStats: ReactNode }) {
    <main className="min-h-screen bg-white dark:bg-(--color-bg-primary)">
      <HeroSection heroStats={heroStats} />
      <ServicesSection />
+      <HomeSolutionsSection />
      <ProductsSection />
      <CasesSection />
      <AboutSection />
+      <TeamSection />
      <NewsSection />
    </main>
  );
@@ -7,6 +7,7 @@ import { StaticLink } from '@/components/ui/static-link';
 import { Button } from '@/components/ui/button';
 import { PageHeader } from '@/components/ui/page-header';
 import { ArrowRight, Lightbulb, Cpu, Users, CheckCircle2 } from 'lucide-react';
+import { MethodologySection } from '@/components/sections/methodology-section';

 export default function SolutionsPage() {
  const contentRef = useRef(null);
@@ -236,6 +237,8 @@ export default function SolutionsPage() {
        </div>
      </div>

+      <MethodologySection />
+
      <motion.div
        initial={{ opacity: 0, y: 20 }}
        animate={isContentInView ? { opacity: 1, y: 0 } : {}}
@@ -0,0 +1,125 @@
+'use client';
+
+import { motion } from 'framer-motion';
+import { useInView } from 'framer-motion';
+import { useRef } from 'react';
+import { StaticLink } from '@/components/ui/static-link';
+import { Button } from '@/components/ui/button';
+import { PageHeader } from '@/components/ui/page-header';
+import { Shield, Building2, Users, Code, Target, ArrowRight } from 'lucide-react';
+
+const TEAM_PILLARS = [
+  {
+    icon: Shield,
+    title: '12年+ 行业深耕',
+    description: '核心团队长期从事技术咨询、企业数字化等领域，服务覆盖金融、制造、零售、政务、农业等多个行业，积累了丰富的跨行业经验和最佳实践。',
+  },
+  {
+    icon: Building2,
+    title: '大型 IT 企业背景',
+    description: '开发团队成员来自多个大型传统 IT 企业，具备扎实的工程能力、规范化的交付流程和严格的质量意识，确保每一个项目都经得起考验。',
+  },
+  {
+    icon: Users,
+    title: '复合型技术团队',
+    description: '我们的团队成员既懂技术又懂业务，能够深入理解客户的真实场景和痛点，提供真正可落地的解决方案，而非纸上谈兵。',
+  },
+  {
+    icon: Code,
+    title: '全栈技术能力',
+    description: '团队掌握从前端到后端、从云原生到数据智能、从移动端到物联网的全栈技术能力，能够应对各种复杂的技术挑战。',
+  },
+  {
+    icon: Target,
+    title: '结果导向交付',
+    description: '我们不以"项目上线"为终点，而是以"客户业务是否真正改善"为衡量标准。每一个交付成果，都追求可量化的业务价值。',
+  },
+];
+
+export function TeamClient() {
+  const contentRef = useRef(null);
+  const isContentInView = useInView(contentRef, { once: true, margin: '-100px' });
+
+  return (
+    <div className="min-h-screen bg-white">
+      <PageHeader
+        title="核心团队"
+        description="核心团队从事技术咨询、企业数字化等行业 12 年+，开发团队成员来自于多个大型传统 IT 企业"
+      />
+
+      <div ref={contentRef} className="container-wide py-12 md:py-16">
+        <motion.div
+          initial={{ opacity: 0, y: 20 }}
+          animate={isContentInView ? { opacity: 1, y: 0 } : {}}
+          transition={{ duration: 0.6 }}
+          className="max-w-5xl mx-auto"
+        >
+          {/* 团队概述 */}
+          <motion.div
+            initial={{ opacity: 0, y: 20 }}
+            animate={isContentInView ? { opacity: 1, y: 0 } : {}}
+            transition={{ duration: 0.6, delay: 0.1 }}
+            className="bg-[#FFFBF5] rounded-2xl p-8 md:p-12 border border-[#E5E5E5] mb-16"
+          >
+            <h2 className="text-2xl font-bold text-[#1C1C1C] mb-6 text-center">关于我们的团队</h2>
+            <div className="space-y-4 max-w-3xl mx-auto text-center">
+              <p className="text-[#5C5C5C] leading-relaxed">
+                我们的核心团队长期从事<span className="text-[#C41E3A] font-medium">技术咨询</span>、<span className="text-[#C41E3A] font-medium">企业数字化</span>等行业，拥有 12 年以上的深厚积累。
+              </p>
+              <p className="text-[#5C5C5C] leading-relaxed">
+                开发团队成员来自于多个<span className="text-[#C41E3A] font-medium">大型传统 IT 企业</span>，具备扎实的工程能力和规范化的交付经验。
+              </p>
+              <p className="text-[#5C5C5C] leading-relaxed">
+                我们相信，优秀的技术咨询不仅需要过硬的技术能力，更需要深入理解客户的业务场景和真实需求。
+                每一位成员都是既懂技术又懂业务的复合型人才。
+              </p>
+            </div>
+          </motion.div>
+
+          {/* 团队优势 */}
+          <div className="mb-16">
+            <h2 className="text-2xl font-bold text-[#1C1C1C] mb-8 text-center">团队优势</h2>
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+              {TEAM_PILLARS.map((item, idx) => {
+                const Icon = item.icon;
+                return (
+                  <motion.div
+                    key={item.title}
+                    initial={{ opacity: 0, y: 20 }}
+                    animate={isContentInView ? { opacity: 1, y: 0 } : {}}
+                    transition={{ duration: 0.5, delay: 0.2 + idx * 0.1 }}
+                    className={idx >= 3 ? 'md:col-span-1 lg:col-start-1' : ''}
+                  >
+                    <div className="bg-white rounded-xl p-6 border border-[#E5E5E5] hover:border-[#C41E3A]/30 hover:shadow-md transition-all duration-300 h-full">
+                      <div className="w-12 h-12 bg-[#C41E3A] rounded-xl flex items-center justify-center mb-4">
+                        <Icon className="w-6 h-6 text-white" />
+                      </div>
+                      <h3 className="text-lg font-bold text-[#1C1C1C] mb-2">{item.title}</h3>
+                      <p className="text-sm text-[#5C5C5C] leading-relaxed">{item.description}</p>
+                    </div>
+                  </motion.div>
+                );
+              })}
+            </div>
+          </div>
+
+          {/* CTA */}
+          <motion.div
+            initial={{ opacity: 0, y: 20 }}
+            animate={isContentInView ? { opacity: 1, y: 0 } : {}}
+            transition={{ duration: 0.6, delay: 0.5 }}
+            className="text-center"
+          >
+            <p className="text-lg text-[#5C5C5C] mb-6">想与我们的团队交流？</p>
+            <Button size="lg" asChild>
+              <StaticLink href="/contact">
+                联系我们
+                <ArrowRight className="ml-2 w-4 h-4" />
+              </StaticLink>
+            </Button>
+          </motion.div>
+        </motion.div>
+      </div>
+    </div>
+  );
+}
@@ -0,0 +1,11 @@
+import { COMPANY_INFO } from '@/lib/constants';
+import { TeamClient } from './client';
+
+export const metadata = {
+  title: `核心团队 - ${COMPANY_INFO.name}`,
+  description: `了解${COMPANY_INFO.name}的核心团队。我们的团队成员拥有丰富的行业经验和技术专长，致力于为客户提供专业的数字化转型服务。`,
+};
+
+export default function TeamPage() {
+  return <TeamClient />;
+}