补充结果总览异常标签模型归属与联动着色

docs/plans/frontend/2026-03-23-results-overview-hit-tag-model-color-frontend-implementation.md

@@ -0,0 +1,132 @@
+# Results Overview Hit Tag Model Color Frontend Implementation Plan
+
+> **For agentic workers:** REQUIRED: Use superpowers:subagent-driven-development (if subagents available) or superpowers:executing-plans to implement this plan. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** 在项目总览页中将已选模型对应的异常标签显示为红色，未选中的标签保持无色，并让核心异常点与异常标签列遵循同一颜色规则。
+
+**Architecture:** 继续沿用结果总览现有组件拆分，不新增页面层级。前端只基于后端返回的 `modelCode/modelName` 和当前 `selectedModelCodes` 计算标签视觉状态；当没有选中模型时，标签默认无色，避免误导。风险人员总览、命中模型涉及人员、流水详情共用同一颜色映射工具方法。
+
+**Tech Stack:** Vue 2, Element UI, Node.js
+
+---
+
+### Task 1: 先锁定前端颜色规则测试
+
+**Files:**
+- Modify: `ruoyi-ui/tests/unit/preliminary-check-risk-people-hit-tags.test.js`
+- Modify: `ruoyi-ui/tests/unit/preliminary-check-model-table-columns.test.js`
+- Modify: `ruoyi-ui/tests/unit/detail-query-hit-tags-list.test.js`
+
+- [ ] **Step 1: Write the failing test**
+
+补充静态断言，锁定以下预期：
+
+- 标签渲染逻辑读取 `tag.modelCode`
+- 命中模型涉及人员标签根据选中模型切换 `danger` / `info`
+- 流水详情和列表异常标签共用同一颜色判断方法
+
+- [ ] **Step 2: Run test to verify it fails**
+
+Run:
+
+```bash
+cd ruoyi-ui
+node tests/unit/preliminary-check-risk-people-hit-tags.test.js
+node tests/unit/preliminary-check-model-table-columns.test.js
+node tests/unit/detail-query-hit-tags-list.test.js
+```
+
+Expected:
+
+- `FAIL`
+- 原因是当前前端仍按 `riskLevel` 映射颜色
+
+- [ ] **Step 3: Commit the test expectation update**
+
+```bash
+git add ruoyi-ui/tests/unit/preliminary-check-risk-people-hit-tags.test.js ruoyi-ui/tests/unit/preliminary-check-model-table-columns.test.js ruoyi-ui/tests/unit/detail-query-hit-tags-list.test.js
+git commit -m "锁定结果总览标签模型颜色规则"
+```
+
+### Task 2: 实现标签模型颜色映射
+
+**Files:**
+- Modify: `ruoyi-ui/src/views/ccdiProject/components/detail/RiskPeopleSection.vue`
+- Modify: `ruoyi-ui/src/views/ccdiProject/components/detail/RiskModelSection.vue`
+- Modify: `ruoyi-ui/src/views/ccdiProject/components/detail/DetailQuery.vue`
+- Modify: `ruoyi-ui/src/views/ccdiProject/components/detail/preliminaryCheck.mock.js`
+
+- [ ] **Step 1: Normalize incoming tag model fields**
+
+在风险人员总览、命中模型人员、流水详情中统一兼容：
+
+- `tag.modelCode`
+- `tag.modelName`
+
+mock 数据同步补齐模型字段，避免本地演示与真实接口脱节。
+
+- [ ] **Step 2: Implement color rule**
+
+颜色规则固定为：
+
+- 当前标签 `modelCode` 在已选模型集合中时，标签 `type="danger"`
+- 当前标签不在已选模型集合中时，标签 `type="info"`
+- 风险人员总览没有模型筛选器时，默认按“未选中”展示为无色
+
+不要继续使用 `riskLevel` 做颜色分流。
+
+- [ ] **Step 3: Run focused frontend tests**
+
+Run:
+
+```bash
+cd ruoyi-ui
+node tests/unit/preliminary-check-risk-people-hit-tags.test.js
+node tests/unit/preliminary-check-model-table-columns.test.js
+node tests/unit/detail-query-hit-tags-list.test.js
+node tests/unit/preliminary-check-summary-and-people.test.js
+```
+
+Expected:
+
+- `PASS`
+
+- [ ] **Step 4: Commit**
+
+```bash
+git add ruoyi-ui/src/views/ccdiProject/components/detail/RiskPeopleSection.vue ruoyi-ui/src/views/ccdiProject/components/detail/RiskModelSection.vue ruoyi-ui/src/views/ccdiProject/components/detail/DetailQuery.vue ruoyi-ui/src/views/ccdiProject/components/detail/preliminaryCheck.mock.js
+git commit -m "调整结果总览标签模型颜色展示"
+```
+
+### Task 3: 做结果总览前端回归检查
+
+**Files:**
+- Verify: `ruoyi-ui/tests/unit/preliminary-check-model-linkage-flow.test.js`
+- Verify: `ruoyi-ui/tests/unit/preliminary-check-summary-and-people.test.js`
+- Verify: `ruoyi-ui/tests/unit/project-overview-api.test.js`
+
+- [ ] **Step 1: Run final regression checks**
+
+Run:
+
+```bash
+cd ruoyi-ui
+node tests/unit/preliminary-check-model-linkage-flow.test.js
+node tests/unit/preliminary-check-summary-and-people.test.js
+node tests/unit/preliminary-check-risk-people-hit-tags.test.js
+node tests/unit/preliminary-check-model-table-columns.test.js
+node tests/unit/detail-query-hit-tags-list.test.js
+node tests/unit/project-overview-api.test.js
+```
+
+Expected:
+
+- `PASS`
+- 证明标签联动、页面静态结构和 API 调用都保持稳定
+
+- [ ] **Step 2: Commit**
+
+```bash
+git add ruoyi-ui/tests/unit/preliminary-check-model-linkage-flow.test.js ruoyi-ui/tests/unit/preliminary-check-summary-and-people.test.js ruoyi-ui/tests/unit/project-overview-api.test.js
+git commit -m "回归验证结果总览标签颜色前端改动"
+```