82 lines
2.6 KiB
Markdown
82 lines
2.6 KiB
Markdown
# 个人模型详情缺失展示字段补齐前端实施计划
|
||
|
||
> **For agentic workers:** REQUIRED: Use superpowers:executing-plans to implement this plan in this repository. Do not use subagents. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||
|
||
**Goal:** 在个人详情页补齐 `展示指标` sheet 中缺失的 6 个字段展示。
|
||
|
||
**Architecture:** 前端沿用现有个人详情页结构，在流程详情的“业务信息”中补 `loanTerm`，在模型输出“测算结果”中补 5 个新增利率字段，不新增页面分组和交互。
|
||
|
||
**Tech Stack:** Vue 2、Element UI、Node.js
|
||
|
||
---
|
||
|
||
### Task 1: 通过前端断言测试锁定缺失展示
|
||
|
||
**Files:**
|
||
- Create: `ruoyi-ui/tests/retail-display-fields.test.js`
|
||
- Modify: `ruoyi-ui/package.json`
|
||
|
||
- [ ] **Step 1: 编写源码断言脚本**
|
||
|
||
断言以下展示已存在：
|
||
|
||
- `PersonalWorkflowDetail.vue` 包含 `借款期限` 和 `detailData.loanTerm`
|
||
- `ModelOutputDisplay.vue` 包含以下字段展示：
|
||
- `loanRateHistory`
|
||
- `minRateProduct`
|
||
- `smoothRange`
|
||
- `finalCalculateRate`
|
||
- `referenceRate`
|
||
|
||
- [ ] **Step 2: 运行脚本并确认先失败**
|
||
|
||
Run: `npm --prefix ruoyi-ui run test:retail-display-fields`
|
||
Expected: FAIL，提示缺失展示实现。
|
||
|
||
### Task 2: 补齐个人详情页字段展示
|
||
|
||
**Files:**
|
||
- Modify: `ruoyi-ui/src/views/loanPricing/workflow/components/PersonalWorkflowDetail.vue`
|
||
- Modify: `ruoyi-ui/src/views/loanPricing/workflow/components/ModelOutputDisplay.vue`
|
||
- Reference: `ruoyi-loan-pricing/src/main/resources/data/retail_output.json`
|
||
|
||
- [ ] **Step 1: 在业务信息中补齐借款期限**
|
||
|
||
在 `PersonalWorkflowDetail.vue` 的“业务信息”区域新增：
|
||
|
||
```vue
|
||
<el-descriptions-item label="借款期限">{{ detailData.loanTerm || '-' }}</el-descriptions-item>
|
||
```
|
||
|
||
- [ ] **Step 2: 在个人测算结果中补齐 5 个字段**
|
||
|
||
在 `ModelOutputDisplay.vue` 的个人“测算结果”中新增：
|
||
|
||
- 历史利率
|
||
- 产品最低利率下限
|
||
- 平滑幅度
|
||
- 最终测算利率
|
||
- 参考利率
|
||
|
||
- [ ] **Step 3: 重新运行前端断言脚本**
|
||
|
||
Run: `npm --prefix ruoyi-ui run test:retail-display-fields`
|
||
Expected: PASS
|
||
|
||
- [ ] **Step 4: 执行前端构建验证**
|
||
|
||
Run: `npm --prefix ruoyi-ui run build:prod`
|
||
Expected: 构建成功，输出包含 `Build complete.`
|
||
|
||
- [ ] **Step 5: 启动前后端并打开个人流程详情页验证**
|
||
|
||
使用浏览器打开新的个人流程详情页，确认：
|
||
|
||
- 流程详情“业务信息”出现 `借款期限`
|
||
- 模型输出“测算结果”出现并可查看以下字段
|
||
- 历史利率
|
||
- 产品最低利率下限
|
||
- 平滑幅度
|
||
- 最终测算利率
|
||
- 参考利率
|