gongzhiyong
abbbf7210c
- 移除静态 website/Dockerfile、nginx、旧 css/js - 新增 Next.js 应用、组件与样式；pnpm 依赖 Made-with: Cursor
66 lines
2.5 KiB
TypeScript
66 lines
2.5 KiB
TypeScript
const phases = [
|
|
{
|
|
phase: "对齐",
|
|
description: "身份、策略与叙事口径一致，避免「各说各话」",
|
|
status: "进行中",
|
|
},
|
|
{
|
|
phase: "贯通",
|
|
description: "人机链路在一条交付故事线下可走通，关键闸门有据可查",
|
|
status: "规划中",
|
|
},
|
|
{
|
|
phase: "规模化",
|
|
description: "编队模板与审批策略可按组织复制，而不是单次项目手工拼装",
|
|
status: "展望",
|
|
},
|
|
];
|
|
|
|
export function Roadmap() {
|
|
return (
|
|
<section className="py-20 sm:py-32">
|
|
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
|
|
<div className="mx-auto max-w-2xl text-center">
|
|
<p className="text-sm font-medium tracking-widest text-accent uppercase">
|
|
阶段性方向
|
|
</p>
|
|
<h2 className="mt-4 text-3xl font-bold tracking-tight sm:text-4xl">
|
|
三层递进
|
|
</h2>
|
|
<p className="mt-4 text-sm text-muted-foreground">
|
|
仅给出时间无序的递进意象，方便对齐讨论；不绑定季度、不设里程碑编号
|
|
</p>
|
|
</div>
|
|
|
|
<div className="mt-16">
|
|
<div className="relative">
|
|
{/* Connection Line */}
|
|
<div className="absolute left-1/2 top-0 h-full w-px -translate-x-1/2 bg-gradient-to-b from-accent/50 via-border to-border hidden lg:block" />
|
|
|
|
<div className="grid gap-8 lg:grid-cols-3">
|
|
{phases.map((item, index) => (
|
|
<div key={item.phase} className="relative">
|
|
{/* Circle Indicator */}
|
|
<div className="mx-auto mb-6 flex h-16 w-16 items-center justify-center rounded-full border-2 border-accent/30 bg-background">
|
|
<span className="text-2xl font-bold text-accent">{index + 1}</span>
|
|
</div>
|
|
|
|
<div className="rounded-xl border border-border bg-card/50 p-6 text-center">
|
|
<span className="inline-block rounded-full bg-accent/10 px-3 py-1 text-xs font-medium text-accent">
|
|
{item.status}
|
|
</span>
|
|
<h3 className="mt-4 text-xl font-bold">{item.phase}</h3>
|
|
<p className="mt-3 text-sm leading-relaxed text-muted-foreground">
|
|
{item.description}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|