117 lines
5.0 KiB
TypeScript
117 lines
5.0 KiB
TypeScript
import { Card, CardContent } from "@/components/ui/card"
|
||
import { Button } from "@/components/ui/button"
|
||
import { ChevronRight } from "lucide-react"
|
||
import Image from "next/image"
|
||
import Link from "next/link"
|
||
|
||
export default function TeamGroupsSection() {
|
||
const groups = [
|
||
{
|
||
name: "机械架构组",
|
||
code: "MEST",
|
||
icon: "/icons/mest.svg",
|
||
description: "负责设计和制造机器人的物理结构，包括底盘、武器系统和机械部件。",
|
||
responsibilities: ["3D 建模与 CAD 出图", "CNC 加工制造", "机械结构分析与优化", "结构装配与测试"],
|
||
},
|
||
{
|
||
name: "电传测控组",
|
||
code: "ELCT",
|
||
icon: "/icons/elct.svg",
|
||
description: "开发机器人的配电与控制系统, 涵盖电路设计、功率管理和嵌入式开发。",
|
||
responsibilities: [
|
||
"电路设计与 PCB Layout",
|
||
"功率管理系统设计",
|
||
"电机控制和驱动开发",
|
||
"传感器集成与信号处理",
|
||
"控制理论应用",
|
||
],
|
||
},
|
||
{
|
||
name: "视觉算法组",
|
||
code: "VSAG",
|
||
icon: "/icons/vsag.svg",
|
||
description: "开发计算机视觉和人工智能系统，使机器人能够感知和理解周围环境，实现自主操作。",
|
||
responsibilities: ["计算机视觉算法开发", "对象识别与跟踪", "机器学习模型训练", "实时图像处理优化"],
|
||
},
|
||
{
|
||
name: "宣传筹划组",
|
||
code: "PRAM",
|
||
icon: "/icons/pram.svg",
|
||
description:
|
||
"管理团队品牌、文档、社交媒体和外联工作，以宣传我们的团队并获得赞助，并规划赛季任务、维护战队开发环境。",
|
||
responsibilities: ["平面与视觉设计", "社交媒体运营", "招商引资", "战队开发平台运维与项目管理"],
|
||
},
|
||
]
|
||
|
||
return (
|
||
<section id="team-groups" className="py-20 relative overflow-hidden">
|
||
<div className="absolute right-0 top-0 bottom-0 red-section z-0" />
|
||
|
||
<div className="container mx-auto px-4 relative z-10">
|
||
<div className="flex flex-col md:flex-row gap-8 items-start">
|
||
<div className="md:w-1/3">
|
||
<div className="red-accent pl-4">
|
||
<h2 className="text-3xl font-bold mb-2 uppercase">团队架构</h2>
|
||
<p className="text-xs font-mono text-muted-foreground uppercase mb-4">TEAM STRUCTURE</p>
|
||
</div>
|
||
<div className="diagonal-line mb-8"></div>
|
||
<div className="content-overlay">
|
||
<p className="text-muted-foreground mb-6 leading-relaxed">
|
||
Simba Robotics 将任务划分给四个不同专精方向的技术小组，团结协作，完成机器人的开发。
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div className="md:w-2/3">
|
||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
{groups.map((group, index) => (
|
||
<Card
|
||
key={index}
|
||
className="border-white/10 bg-background/60 backdrop-blur-sm overflow-hidden card-hover-effect"
|
||
>
|
||
<CardContent className="p-0">
|
||
<div className="bg-primary/10 p-4 flex items-center gap-4 border-b border-white/10">
|
||
<div className="p-3 bg-background/30 flex items-center justify-center">
|
||
<Image
|
||
src={group.icon || "/placeholder.svg"}
|
||
alt={group.name}
|
||
width={48}
|
||
height={48}
|
||
className="w-12 h-12"
|
||
/>
|
||
</div>
|
||
<div>
|
||
<h3 className="text-xl font-bold">{group.name}</h3>
|
||
<p className="text-xs font-mono text-primary">{group.code}</p>
|
||
</div>
|
||
</div>
|
||
<div className="p-4">
|
||
<p className="text-muted-foreground mb-4 leading-relaxed">{group.description}</p>
|
||
<h4 className="font-bold mb-2 text-primary text-sm">关键职能:</h4>
|
||
<ul className="space-y-1 pl-5 list-disc text-muted-foreground text-sm">
|
||
{group.responsibilities.map((item, idx) => (
|
||
<li key={idx}>{item}</li>
|
||
))}
|
||
</ul>
|
||
|
||
<Link href={`/teams?tab=${group.code.toLowerCase()}`}>
|
||
<Button
|
||
variant="ghost"
|
||
size="sm"
|
||
className="mt-4 w-full border border-white/10 button-hover-effect"
|
||
>
|
||
了解更多 <ChevronRight className="ml-1 h-4 w-4" />
|
||
</Button>
|
||
</Link>
|
||
</div>
|
||
</CardContent>
|
||
</Card>
|
||
))}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
)
|
||
}
|