59 lines
2.3 KiB
Markdown
59 lines
2.3 KiB
Markdown
修复前端视觉质量问题。项目在 /home/enzo/projects/hive-manage-v3/frontend/。
|
||
|
||
## 问题清单
|
||
|
||
### 1. 全局:浅色背景
|
||
当前 Dashboard 显示白色/浅灰背景,应该是暗色主题。原因:`data-theme` 属性未正确初始化,导致 CSS 变量默认值被 Tailwind 覆盖。
|
||
修复:确保 `<html>` 元素初始化时设置 `data-theme="dark"`,且所有页面使用 CSS 变量而非硬编码颜色。
|
||
|
||
### 2. 侧边栏:导航项 typo
|
||
"Cron1" 应为 "Cron 管理"。
|
||
|
||
### 3. Dashboard 卡片:视觉粗糙
|
||
- 在线/离线 Gateway 卡片应该有颜色区分(绿色数值/红色数值),当前只有文字
|
||
- "vs 昨天" 的变化指示应该有 ↑/↓ 箭头
|
||
- Cron 失败 > 3 的卡片应标红
|
||
- 整体卡片间距和 padding 应符合设计规范(gap:14px, padding:16px)
|
||
|
||
### 4. 蜂群健康分布
|
||
柱状图样式简陋,应有:
|
||
- 四色柱子(A绿 B蓝 C黄 D红)
|
||
- 点击柱子跳转 /health 页面
|
||
- D 级 Profile 名称在下方列出
|
||
- "共 58 个 Profile" 标题
|
||
|
||
### 5. Gateway 异常趋势
|
||
- Timeline 组件时间轴应无 "R/F/H/OK" 文字,改用彩色圆点
|
||
- 每个点 Hover 显示 tooltip(时间和事件详情)
|
||
- 图例正确:●正常 ●心跳超时 ●飞书断连 ●重启
|
||
|
||
### 6. Kanban 概览
|
||
- 当前显示静态数据,应调用 GET /api/v1/dashboard/kanban-summary API
|
||
- 看板名 + RUNNING/READY 状态显示
|
||
|
||
### 7. Cron 最近执行
|
||
- 调用 GET /api/v1/dashboard/cron-recent API
|
||
- 状态正确显示:✅ 成功 / ❌ 失败 / ⏸ 暂停
|
||
- 时间显示精确到分钟
|
||
|
||
### 8. 侧边栏整体样式
|
||
- 背景色:var(--bg-nav) 暗色
|
||
- Section 标题:11px uppercase letter-spacing
|
||
- NavItem 激活态:honey-glow 背景 + honey 文字色
|
||
- 各导航项名称应与 PRD/原型一致
|
||
|
||
### 9. Header
|
||
- "在线 0 运行中 0 离线 0" 应为实时数据(从 usePolling 或 context 获取)
|
||
- 搜索框 placeholder "搜索 Profile / 任务 / Cron / 事件..."
|
||
- 主题切换按钮(🌙/☀️)正常工作
|
||
|
||
### 10. useTheme hook
|
||
确保:
|
||
- 初始默认 dark(根元素设置 data-theme="dark")
|
||
- localStorage 持久化
|
||
- 切换即时生效
|
||
|
||
---
|
||
|
||
先读取当前所有相关文件,然后逐个修复上述问题。每修复 2-3 个问题就运行 `npx tsc --noEmit` 确认编译通过。最后 `npm run build` 并提交。
|