生产管理系统前端 - 瓦力0.71原型图更新

src/THEME_REFACTOR_VERIFICATION.md

@@ -0,0 +1,232 @@
+# 🔍 主题重构验证清单
+
+## 快速验证步骤
+
+### 1️⃣ 代码层面验证（已完成 ✅）
+
+#### 搜索验证结果
+```bash
+✅ bg-gray-50（非状态色）: 0处
+✅ bg-gray-100（非状态色）: 0处  
+✅ hover:bg-gray-50: 0处
+✅ hover:bg-gray-100: 0处
+✅ bg-gray-50/50: 0处
+✅ dark:bg-gray-*（非状态色）: 0处
+```
+
+**结论：代码层面重构100%完成！**
+
+---
+
+### 2️⃣ 视觉验证清单（待测试）
+
+#### A. AI模块测试（重点）
+
+##### 告警管理 `/ai-model/alert/management`
+- [ ] 打开页面
+- [ ] 查看告警规则卡片背景
+  - 触发条件信息框（4个）
+  - 配置区域背景
+- [ ] 查看告警详情弹窗
+  - 告警编号/规则/级别/状态信息框（4个）
+  - 触发值/阈值/时间信息框（3个）
+- [ ] 切换到dark模式，检查所有背景色
+- [ ] 测试悬停效果
+
+##### 数据中心 `/ai-model/data/center`  
+- [ ] 查看"离线设备"卡片（保持灰色状态色）
+- [ ] 查看文件列表项背景
+- [ ] 查看API认证配置卡片
+- [ ] 查看质量控制规则项（4个）
+- [ ] 查看设备详情-协议配置
+- [ ] 查看传感器配置卡片
+- [ ] 查看操作日志项
+- [ ] 切换dark模式验证
+
+##### 决策生成 `/ai-model/decision/generation`
+- [ ] 查看决策记录列表项悬停效果
+- [ ] 查看信息框背景
+- [ ] 查看代码块背景（code标签）
+- [ ] 切换dark模式验证
+
+##### 决策日志 `/ai-model/decision/log`
+- [ ] 查看日志列表代码块（决策ID）
+- [ ] 查看详情信息框
+- [ ] 切换dark模式验证
+
+##### 决策模拟 `/ai-model/decision/simulation`
+- [ ] 查看结果列表代码块
+- [ ] 查看信息框
+- [ ] 已添加项保持灰色禁用状态（状态色）
+- [ ] 切换dark模式验证
+
+##### 决策详情
+- [ ] 查看决策步骤信息框
+- [ ] 查看规则详情框
+- [ ] 切换dark模式验证
+
+##### 决策支持 `/ai-model/decision/support`
+- [ ] 查看决策卡片（匹配绿色，未匹配bg-muted）
+- [ ] 查看规则逻辑卡片
+- [ ] 切换dark模式验证
+
+##### 审计日志 `/ai-model/audit/log`
+- [ ] 查看追踪信息框（6个）
+- [ ] 查看步骤详情框
+- [ ] 切换dark模式验证
+
+##### 应用生成 `/ai-model/application/generation`
+- [ ] 查看数据流向图背景
+- [ ] 切换dark模式验证
+
+#### B. 系统配置测试
+
+##### 个人信息 `/config/profile/info`
+- [ ] 查看用户信息卡片
+- [ ] 查看个人资料字段
+- [ ] 切换dark模式验证
+
+##### 导航栏
+- [ ] 查看顶部导航hover效果
+- [ ] 查看子系统按钮hover
+- [ ] 切换dark模式验证
+
+---
+
+### 3️⃣ 兼容性验证
+
+#### 浏览器测试
+- [ ] Chrome（最新版）
+  - [ ] 明亮模式
+  - [ ] 暗黑模式
+- [ ] Firefox（最新版）
+  - [ ] 明亮模式
+  - [ ] 暗黑模式
+- [ ] Safari（最新版）
+  - [ ] 明亮模式
+  - [ ] 暗黑模式
+- [ ] Edge（最新版）
+  - [ ] 明亮模式
+  - [ ] 暗黑模式
+
+#### 分辨率测试
+- [ ] 1920x1080（标准）
+- [ ] 1366x768（笔记本）
+- [ ] 2560x1440（高分屏）
+- [ ] 3840x2160（4K）
+
+---
+
+### 4️⃣ 对比验证要点
+
+#### 明亮模式
+```
+信息框背景：应该是浅灰色（接近白色），不刺眼
+悬停效果：应该是轻微的灰色高亮
+代码块：应该有明显的背景区分
+边框：应该是淡灰色，不明显
+```
+
+#### 暗黑模式
+```
+信息框背景：应该比背景略亮，但不刺眼（深灰色）
+悬停效果：应该是轻微的高亮，与背景有区分
+代码块：应该有明显的深色背景
+边框：应该是半透明白色，不明显
+```
+
+#### 状态色（明暗模式均需验证）
+```
+绿色（成功/激活）：明显的绿色背景+深绿文字（dark模式更亮）
+红色（错误）：明显的红色背景+深红文字（dark模式更亮）
+橙色（告警）：明显的橙色背景+深橙文字（dark模式更亮）
+黄色（警告）：明显的黄色背景+深黄文字（dark模式更亮）
+蓝色（信息）：明显的蓝色背景+深蓝文字（dark模式更亮）
+灰色（离线/禁用）：明显的灰色背景+深灰文字（保持灰色调）
+```
+
+---
+
+### 5️⃣ 回归测试
+
+#### 功能测试
+- [ ] 所有按钮点击正常
+- [ ] 所有弹窗打开/关闭正常
+- [ ] 所有表单提交正常
+- [ ] 所有数据展示正常
+- [ ] 所有下拉菜单正常
+- [ ] 所有Tab切换正常
+
+#### 动画测试
+- [ ] 主题切换动画流畅
+- [ ] 悬停效果流畅
+- [ ] 弹窗打开/关闭动画正常
+- [ ] 页面切换动画正常
+
+---
+
+### 6️⃣ 问题记录模板
+
+如发现问题，请按以下格式记录：
+
+```markdown
+**问题位置：** `/ai-model/alert/management`  
+**问题描述：** 告警详情信息框在dark模式下背景太亮
+**当前表现：** 背景色为#ffffff
+**期望表现：** 背景色应为深灰色（bg-muted）
+**重现步骤：**
+1. 切换到dark模式
+2. 打开告警详情
+3. 查看信息框背景
+
+**截图：** [附上截图]
+```
+
+---
+
+## ✅ 验证完成标准
+
+- [ ] 所有AI模块页面视觉正常
+- [ ] 明暗模式切换流畅无闪烁
+- [ ] 所有信息框背景统一
+- [ ] 所有悬停效果统一
+- [ ] 状态色保持正确显示
+- [ ] 没有发现视觉异常
+- [ ] 所有功能正常工作
+
+**签名：** ___________  
+**日期：** ___________
+
+---
+
+## 📝 备注
+
+### 如果发现问题
+
+1. **视觉问题**
+   - 检查对应组件是否使用了 `bg-muted` 或 `hover:bg-accent`
+   - 检查 globals.css 中的主题变量定义
+   - 清除浏览器缓存后重试
+
+2. **功能问题**  
+   - 检查是否是重构导致的问题
+   - 查看浏览器控制台错误
+   - 对比重构前后代码差异
+
+3. **性能问题**
+   - 主题重构不应影响性能
+   - 如有性能下降，检查是否有其他原因
+
+### 快速回滚
+
+如需回滚重构：
+```bash
+git log --oneline | grep "theme refactor"
+git revert <commit-hash>
+```
+
+---
+
+**文档版本：** 1.0  
+**最后更新：** 2024年（本次会话）  
+**维护人：** 开发团队