# 项目详情风险明细异常账户人员信息前端实施记录

**日期**: 2026-03-31  
**范围**: 项目详情 - 结果总览 - 风险明细 - 异常账户人员信息前端

## 1. 本次实施内容

- 在 `ruoyi-ui/src/api/ccdi/projectOverview.js` 新增 `getOverviewAbnormalAccountPeople`，对接 `GET /ccdi/project/overview/abnormal-account-people`
- 在 `ruoyi-ui/src/views/ccdiProject/components/detail/RiskDetailSection.vue` 为异常账户区块补充独立状态：
  - `abnormalAccountLoading`
  - `abnormalAccountPageNum`
  - `abnormalAccountPageSize`
  - `abnormalAccountTotal`
  - `abnormalAccountList`
- 在 `RiskDetailSection.vue` 新增 `loadAbnormalAccountPeople` 与 `handleAbnormalAccountPageChange`，使异常账户区块具备独立分页刷新能力
- 将异常账户人员信息区块从占位表格替换为真实 6 列：
  - `账号`
  - `开户人`
  - `银行`
  - `异常类型`
  - `异常发生时间`
  - `状态`
- 移除旧占位列 `操作 / 查看详情`
- 为异常账户区块补充独立空态文案 `当前项目暂无异常账户人员信息`
- 在 `ruoyi-ui/src/views/ccdiProject/components/detail/preliminaryCheck.mock.js` 中对齐异常账户 mock 字段：
  - `accountNo`
  - `accountName`
  - `bankName`
  - `abnormalType`
  - `abnormalTime`
  - `status`
- 新增并更新静态单测，覆盖异常账户区块的列结构、空态文案、独立分页状态与旧占位断言移除

## 2. 影响范围

- `ruoyi-ui/src/api/ccdi/projectOverview.js`
- `ruoyi-ui/src/views/ccdiProject/components/detail/RiskDetailSection.vue`
- `ruoyi-ui/src/views/ccdiProject/components/detail/preliminaryCheck.mock.js`
- `ruoyi-ui/tests/unit/risk-detail-abnormal-account-layout.test.js`
- `ruoyi-ui/tests/unit/risk-detail-abnormal-account-pagination.test.js`
- `ruoyi-ui/tests/unit/preliminary-check-model-and-detail.test.js`

## 3. 验证结果

执行静态单测：

```bash
cd ruoyi-ui
node tests/unit/risk-detail-abnormal-account-layout.test.js
node tests/unit/risk-detail-abnormal-account-pagination.test.js
node tests/unit/preliminary-check-model-and-detail.test.js
node tests/unit/risk-detail-employee-credit-negative-layout.test.js
```

执行结果：

- 全部通过

执行生产构建：

```bash
cd ruoyi-ui
npm run build:prod
```

执行结果：

- 构建成功
- 仅存在仓库原有的体积告警，没有新增编译错误

## 4. 手工联调说明

- 本轮未启动 `npm run dev` 做浏览器手工联调
- 因未启动前端开发服务，本轮不存在额外前端进程需要关闭
- 真实接口翻页、区块级失败提示与统一导出联动，待结合后端接口联调时继续确认