70 lines
2.4 KiB
Markdown
70 lines
2.4 KiB
Markdown
|
|
# 结果总览涉疑交易明细与流水明细查询对齐设计
|
|||
|
|
|
|||
|
|
## 背景
|
|||
|
|
|
|||
|
|
- 结果总览页的“风险明细 > 涉疑交易明细”已接通真实接口,但当前列表列结构、详情弹窗内容和分页交互均与“流水明细查询”页面不一致。
|
|||
|
|
- 用户要求以“流水明细查询”页为基准对齐交互与视觉,仅保留涉疑交易特有的“关联员工”字段,其余定制列移除。
|
|||
|
|
|
|||
|
|
## 目标
|
|||
|
|
|
|||
|
|
- 列表对齐“流水明细查询”页面的主表结构与样式。
|
|||
|
|
- 详情弹窗对齐“流水明细查询”页面的字段布局、原始文件区域与命中异常标签区域。
|
|||
|
|
- 分页固定每页 5 条,筛选切换后回到第一页。
|
|||
|
|
- 保留“关联员工”列,作为涉疑交易明细相对流水明细查询的唯一额外业务列。
|
|||
|
|
|
|||
|
|
## 方案
|
|||
|
|
|
|||
|
|
### 列表
|
|||
|
|
|
|||
|
|
- `RiskDetailSection.vue` 保留“涉疑交易明细”区块与筛选下拉。
|
|||
|
|
- 表格列改为:
|
|||
|
|
- 交易时间
|
|||
|
|
- 本方账户
|
|||
|
|
- 对方账户
|
|||
|
|
- 关联员工
|
|||
|
|
- 摘要 / 交易类型
|
|||
|
|
- 异常标签
|
|||
|
|
- 交易金额
|
|||
|
|
- 详情
|
|||
|
|
- 保持与 `DetailQuery.vue` 相同的多行单元格结构、金额颜色和异常标签样式。
|
|||
|
|
|
|||
|
|
### 分页
|
|||
|
|
|
|||
|
|
- 组件内部新增独立分页状态:
|
|||
|
|
- `suspiciousPageNum`
|
|||
|
|
- `suspiciousPageSize` 固定为 `5`
|
|||
|
|
- `suspiciousTotal`
|
|||
|
|
- 初次加载、筛选切换和翻页都通过 `getOverviewSuspiciousTransactions` 重新请求。
|
|||
|
|
- 分页组件沿用仓库现有 `Pagination`,但限制 `pageSizes` 为 `[5]`,并移除 `sizes` 布局项。
|
|||
|
|
|
|||
|
|
### 详情弹窗
|
|||
|
|
|
|||
|
|
- 详情弹窗结构对齐 `DetailQuery.vue`:
|
|||
|
|
- 基础字段宫格
|
|||
|
|
- 原始文件信息
|
|||
|
|
- 命中异常标签
|
|||
|
|
- 详情数据继续复用 `getBankStatementDetail(bankStatementId)`,避免新增后端接口。
|
|||
|
|
|
|||
|
|
### 异常标签
|
|||
|
|
|
|||
|
|
- 结果总览涉疑交易列表接口当前不直接返回 `hitTags`。
|
|||
|
|
- 前端在列表加载完成后,按当前页流水 `bankStatementId` 逐条调用详情接口补齐 `hitTags`,仅处理当前页 5 条数据,保证逻辑闭环且不扩大后端改造范围。
|
|||
|
|
|
|||
|
|
## 影响范围
|
|||
|
|
|
|||
|
|
- 前端:
|
|||
|
|
- `ruoyi-ui/src/views/ccdiProject/components/detail/RiskDetailSection.vue`
|
|||
|
|
- `ruoyi-ui/tests/unit/`
|
|||
|
|
- 文档:
|
|||
|
|
- 当前设计文档
|
|||
|
|
- 本轮实施记录
|
|||
|
|
|
|||
|
|
## 验证
|
|||
|
|
|
|||
|
|
- 单测验证列表列名、分页配置、详情弹窗字段与异常标签区域。
|
|||
|
|
- 浏览器联调验证:
|
|||
|
|
- 初始加载为 5 条
|
|||
|
|
- 筛选切换可翻页
|
|||
|
|
- 详情弹窗样式与字段对齐
|
|||
|
|
- 导出仍可用
|