64 lines
1.3 KiB
Markdown
64 lines
1.3 KiB
Markdown
|
# Swarm Command Center
|
||
|
|
|
||
|
|
Sci-Fi 风格的多智能体协作系统前端界面。
|
||
|
|
|
||
|
|
## 技术栈
|
||
|
|
|
||
|
|
- **React 18** - UI 框架
|
||
|
|
- **TypeScript** - 类型安全
|
||
|
|
- **Vite** - 构建工具
|
||
|
|
- **Tailwind CSS** - 样式框架
|
||
|
|
- **Lucide React** - 图标库
|
||
|
|
|
||
|
|
## 开发
|
||
|
|
|
||
|
|
```bash
|
||
|
|
# 安装依赖
|
||
|
|
npm install
|
||
|
|
|
||
|
|
# 启动开发服务器
|
||
|
|
npm run dev
|
||
|
|
|
||
|
|
# 构建生产版本
|
||
|
|
npm run build
|
||
|
|
```
|
||
|
|
|
||
|
|
## 设计系统
|
||
|
|
|
||
|
|
### 颜色
|
||
|
|
|
||
|
|
- 主色: Cyan `#00f0ff`
|
||
|
|
- 辅助: Purple `#8b5cf6`
|
||
|
|
- 成功: Green `#00ff9d`
|
||
|
|
- 警告: Amber `#ff9500`
|
||
|
|
- 错误: Pink `#ff006e`
|
||
|
|
|
||
|
|
### 字体
|
||
|
|
|
||
|
|
- **Orbitron** - 标题/显示字体
|
||
|
|
- **Noto Sans SC** - 中文正文字体
|
||
|
|
- **JetBrains Mono** - 代码/数据字体
|
||
|
|
- **Rajdhani** - 辅助字体
|
||
|
|
|
||
|
|
### 组件
|
||
|
|
|
||
|
|
- Header - 顶部导航栏
|
||
|
|
- TaskInput - 任务输入组件
|
||
|
|
- AgentStatusCard - 智能体状态卡片
|
||
|
|
- DiscussionCard - 讨论区卡片
|
||
|
|
- StatisticsCard - 统计数据卡片
|
||
|
|
- WorkflowCard - 工作流卡片
|
||
|
|
- MeetingProgressCard - 会议进度卡片
|
||
|
|
- ResourceMonitorCard - 资源监控卡片
|
||
|
|
- ConsensusCard - 共识状态卡片
|
||
|
|
- BarrierSyncCard - 屏障同步卡片
|
||
|
|
- RecentMeetingsCard - 最近会议卡片
|
||
|
|
- ActionBar - 操作栏
|
||
|
|
|
||
|
|
## 布局
|
||
|
|
|
||
|
|
采用 Bento Grid 响应式布局：
|
||
|
|
- 桌面端 (1400px+): 6 列
|
||
|
|
- 平板端 (768px-1400px): 4 列
|
||
|
|
- 移动端 (<768px): 1 列
|