修复前端视觉质量问题。项目在 /home/enzo/projects/hive-manage-v3/frontend/。 ## 问题清单 ### 1. 全局:浅色背景 当前 Dashboard 显示白色/浅灰背景,应该是暗色主题。原因:`data-theme` 属性未正确初始化,导致 CSS 变量默认值被 Tailwind 覆盖。 修复:确保 `` 元素初始化时设置 `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` 并提交。