54 lines
2.6 KiB
Markdown
54 lines
2.6 KiB
Markdown
# 项目分析弹窗圆角显示方案调整实施记录
|
||
|
||
## 变更日期
|
||
|
||
- 2026-05-06
|
||
|
||
## 保存路径确认
|
||
|
||
- 本次实施记录保存到 `docs/reports/implementation/`,符合项目实施记录目录规范。
|
||
|
||
## 变更范围
|
||
|
||
- 前端:`ruoyi-ui/src/views/ccdiProject/components/detail/ProjectAnalysisDialog.vue`
|
||
- 前端:`ruoyi-ui/src/views/ccdiProject/components/detail/ProjectAnalysisSidebar.vue`
|
||
- 前端:`ruoyi-ui/src/views/ccdiProject/components/detail/ProjectAnalysisAbnormalTab.vue`
|
||
- 单测:`ruoyi-ui/tests/unit/project-analysis-dialog-layout.test.js`
|
||
- 单测:`ruoyi-ui/tests/unit/project-analysis-dialog-sidebar.test.js`
|
||
- 单测:`ruoyi-ui/tests/unit/project-analysis-dialog-abnormal-tab.test.js`
|
||
|
||
## 实施内容
|
||
|
||
### 1. 弹窗外壳统一
|
||
|
||
- 将项目分析弹窗重新收口为单一弹窗壳显示方案。
|
||
- 外层 `el-dialog` 统一使用 `8px` 圆角,标题栏与内容区使用同一浅灰工作台背景。
|
||
- 移除内部 `24px` 大圆角壳层,避免外层默认圆角、内部大圆角和直角内容区混杂。
|
||
|
||
### 2. 左侧人物档案面板统一
|
||
|
||
- 将左侧人物档案和命中模型摘要合并到同一个 `6px` 面板内。
|
||
- 人物档案与命中模型摘要之间通过分隔线区分层次,不再使用两个独立大圆角白卡。
|
||
- 风险等级和异常标签统一使用 `6px` 状态标识样式。
|
||
|
||
### 3. 右侧内容区统一
|
||
|
||
- 右侧主承载区统一为 `6px` 面板,tabs 顶部与内容区共享同一边界。
|
||
- 异常明细卡片、流水表格、对象摘要卡片和异常原因快照统一使用 `6px` 圆角。
|
||
- 不修改接口、字段、分页、证据库按钮或异常明细业务逻辑。
|
||
|
||
## 验证情况
|
||
|
||
- 已通过 Node 版本切换验证:`nvm use`,实际使用 `v14.21.3`。
|
||
- 已执行并通过:
|
||
- `node tests/unit/project-analysis-dialog-layout.test.js`
|
||
- `node tests/unit/project-analysis-dialog-sidebar.test.js`
|
||
- `node tests/unit/project-analysis-dialog-abnormal-tab.test.js`
|
||
- `node tests/unit/project-analysis-dialog-empty-field.test.js`
|
||
- 已执行 `git diff --check`,相关改动无空白错误。
|
||
- 已使用 `browser-use` 打开真实页面 `http://localhost:1025/ccdiProject/detail/90338?tab=overview`,在结果总览页点击“查看详情”打开“项目分析”弹窗验证:
|
||
- 页面标题与业务项目数据正常显示。
|
||
- 弹窗打开后详情接口加载完成,人员工号、异常明细表格与异常对象摘要正常渲染。
|
||
- 左侧面板不再出现大圆角白卡和直角灰底混用。
|
||
- 当前浏览器视口下弹窗无框架错误覆盖,控制台无相关 error/warn。
|