# 流程列表测算利率展示前端实施计划

> **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:** 在流程列表页新增“测算利率(%)”列，并与“执行利率(%)”同时展示。

**Architecture:** 前端只消费后端列表接口新增返回的 `calculateRate` 字段，不在页面自行判断客户类型或拼接数据来源。页面层仅新增一列并保持现有查询、查看详情和执行利率展示逻辑不变。

**Tech Stack:** Vue 2、Element UI、RuoYi 前端工程、npm

---

### Task 1: 为流程列表页新增测算利率列

**Files:**
- Modify: `ruoyi-ui/src/views/loanPricing/workflow/index.vue`
- Test: 手工页面验证流程列表页

- [ ] **Step 1: 查看当前流程列表页列顺序**

Run: `sed -n '45,70p' ruoyi-ui/src/views/loanPricing/workflow/index.vue`
Expected: 能看到当前表格列中已有“执行利率(%)”列，且其前面还没有“测算利率(%)”列。

- [ ] **Step 2: 在“执行利率(%)”前新增“测算利率(%)”列**

将列表表格中的利率区域调整为如下结构：

```vue
<el-table-column label="申请金额(元)" align="center" prop="applyAmt" width="120" />
<el-table-column label="测算利率(%)" align="center" prop="calculateRate" width="100" />
<el-table-column label="执行利率(%)" align="center" prop="executeRate" width="100" />
```

- [ ] **Step 3: 重新检查源码确认新增列位置和字段绑定**

Run: `rg -n '测算利率\\(%\\)|执行利率\\(%\\)|prop=\"calculateRate\"|prop=\"executeRate\"' ruoyi-ui/src/views/loanPricing/workflow/index.vue`
Expected: 能看到“测算利率(%)”列存在，且位于“执行利率(%)”之前，并绑定 `calculateRate`。

- [ ] **Step 4: 执行前端构建验证**

Run: `npm --prefix ruoyi-ui run build:prod`
Expected: 构建成功，输出包含 `Build complete.`

- [ ] **Step 5: 补充本次前端实施记录**

新增实施记录文件：`doc/implementation-report-2026-03-28-workflow-calculate-rate-list-frontend.md`

至少写明：

```markdown
- 流程列表页新增“测算利率(%)”列
- 新增列绑定后端返回字段 `calculateRate`
- “执行利率(%)”列保持 `executeRate` 不变
- 已完成前端构建验证
```

- [ ] **Step 6: 如果为验证启动了前端进程，结束对应进程**

Run: `ps -ef | rg 'ruoyi-ui|vue-cli-service'`
Expected: 如果本次任务为验证启动了新的前端进程，验证结束后主动停止；对非本次启动的现有进程不做处理。

- [ ] **Step 7: 提交前端改动**

Run: `git add ruoyi-ui/src/views/loanPricing/workflow/index.vue doc/implementation-report-2026-03-28-workflow-calculate-rate-list-frontend.md && git commit -m "新增流程列表测算利率前端展示"`
Expected: 生成仅包含本次前端改动的中文提交。

### Task 2: 页面联调确认双利率展示

**Files:**
- Modify: `doc/implementation-report-2026-03-28-workflow-calculate-rate-list-frontend.md`

- [ ] **Step 1: 打开流程列表页确认页面可正常加载**

Run: 按项目现有方式启动前端并进入贷款定价流程列表页。
Expected: 页面正常渲染，表格可展示列表数据。

- [ ] **Step 2: 验证“测算利率(%)”和“执行利率(%)”同时展示**

Run: 在页面上核对至少一条记录的两列展示值。
Expected: “测算利率(%)”展示后端返回的 `calculateRate`，“执行利率(%)”继续展示 `executeRate`。

- [ ] **Step 3: 将联调结果写入前端实施记录**

将以下结果写入实施记录：

```markdown
- 已确认流程列表页新增“测算利率(%)”列
- 已确认“测算利率(%)”列位于“执行利率(%)”列之前
- 已确认双利率字段可同时展示
```

- [ ] **Step 4: 停止联调过程中启动的前端进程**

Run: `ps -ef | rg 'ruoyi-ui|vue-cli-service'`
Expected: 若存在本次联调启动的进程，全部停止后再结束任务。