219 lines
5.9 KiB
Markdown
219 lines
5.9 KiB
Markdown
# Project Upload Credit Entry Jump Frontend Implementation Plan
|
||
|
||
> **For agentic workers:** REQUIRED: Use superpowers:subagent-driven-development (if subagents available) or superpowers:executing-plans to implement this plan. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||
|
||
**Goal:** 将项目详情“上传数据”页的“征信导入”按钮改为直接跳转到“信息维护-征信维护”页面，不再在当前页打开征信上传弹窗。
|
||
|
||
**Architecture:** 仅调整 `UploadData.vue` 中“征信导入”入口的前端交互，沿用现有动态菜单路由 `/maintain/creditInfo` 作为跳转目标。保持征信维护页面和后端接口完全不变，避免双入口并减少交互分叉。
|
||
|
||
**Tech Stack:** Vue 2, Vue Router, Element UI, Node.js 源码契约测试
|
||
|
||
---
|
||
|
||
## 文件结构与职责
|
||
|
||
**修改文件**
|
||
|
||
- `ruoyi-ui/src/views/ccdiProject/components/detail/UploadData.vue`
|
||
将“征信导入”按钮点击行为从打开弹窗改为路由跳转，并清理不再使用的本地征信上传入口逻辑。
|
||
- `docs/reports/implementation/2026-03-24-project-upload-credit-entry-jump-frontend-record.md`
|
||
记录本次前端实施内容、验证命令与结果。
|
||
|
||
**新增测试文件**
|
||
|
||
- `ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js`
|
||
锁定“征信导入”按钮使用路由跳转且不再依赖本地上传弹窗入口。
|
||
|
||
**参考文件**
|
||
|
||
- `docs/design/2026-03-24-project-upload-credit-entry-jump-design.md`
|
||
- `ruoyi-ui/src/views/ccdiCreditInfo/index.vue`
|
||
- `sql/ccdi_credit_info_menu.sql`
|
||
|
||
## Task 1: 先锁定入口跳转契约
|
||
|
||
**Files:**
|
||
- Create: `ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js`
|
||
- Test: `ruoyi-ui/src/views/ccdiProject/components/detail/UploadData.vue`
|
||
|
||
- [ ] **Step 1: 编写失败契约测试**
|
||
|
||
在 `ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js` 中读取 `UploadData.vue` 源码，至少断言以下关键点：
|
||
|
||
```javascript
|
||
const assert = require("assert");
|
||
const fs = require("fs");
|
||
const path = require("path");
|
||
|
||
const viewPath = path.resolve(
|
||
__dirname,
|
||
"../../src/views/ccdiProject/components/detail/UploadData.vue"
|
||
);
|
||
const source = fs.readFileSync(viewPath, "utf8");
|
||
|
||
assert(source.includes("@click=\"handleOpenCreditUpload\""), "征信导入按钮事件已变化，需先看到旧入口");
|
||
assert(source.includes("showCreditUploadDialog"), "旧征信导入弹窗状态不存在，无法证明改动前行为");
|
||
```
|
||
|
||
- [ ] **Step 2: 运行测试确认当前为旧行为**
|
||
|
||
Run:
|
||
|
||
```bash
|
||
node ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js
|
||
```
|
||
|
||
Expected:
|
||
|
||
- PASS，证明当前按钮仍绑定旧的弹窗入口。
|
||
|
||
- [ ] **Step 3: 改写测试为目标行为**
|
||
|
||
将断言改为目标行为：
|
||
|
||
```javascript
|
||
[
|
||
"@click=\"handleGoCreditInfoPage\"",
|
||
"this.$router.push(\"/maintain/creditInfo\")",
|
||
].forEach((token) => {
|
||
assert(source.includes(token), `缺少征信入口跳转关键代码: ${token}`);
|
||
});
|
||
|
||
[
|
||
"showCreditUploadDialog",
|
||
"handleConfirmCreditUpload",
|
||
"handleCreditFileChange",
|
||
].forEach((token) => {
|
||
assert(!source.includes(token), `旧征信弹窗逻辑未清理: ${token}`);
|
||
});
|
||
```
|
||
|
||
- [ ] **Step 4: 运行测试确认失败**
|
||
|
||
Run:
|
||
|
||
```bash
|
||
node ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js
|
||
```
|
||
|
||
Expected:
|
||
|
||
- FAIL，因为代码尚未切换到跳页实现。
|
||
|
||
## Task 2: 实现按钮跳转并清理旧入口
|
||
|
||
**Files:**
|
||
- Modify: `ruoyi-ui/src/views/ccdiProject/components/detail/UploadData.vue`
|
||
- Test: `ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js`
|
||
|
||
- [ ] **Step 1: 修改模板点击事件**
|
||
|
||
把“征信导入”按钮点击事件：
|
||
|
||
```vue
|
||
@click="handleOpenCreditUpload"
|
||
```
|
||
|
||
改为：
|
||
|
||
```vue
|
||
@click="handleGoCreditInfoPage"
|
||
```
|
||
|
||
- [ ] **Step 2: 删除本地征信导入弹窗模板**
|
||
|
||
移除 `title="征信导入"` 的 `el-dialog` 以及其中的 `el-upload`、底部按钮，确保该按钮点击后不再出现本地弹窗。
|
||
|
||
- [ ] **Step 3: 删除无用状态与方法并新增跳转方法**
|
||
|
||
删除以下无用状态与方法：
|
||
|
||
```javascript
|
||
showCreditUploadDialog: false,
|
||
creditFileList: [],
|
||
creditUploading: false,
|
||
```
|
||
|
||
```javascript
|
||
handleOpenCreditUpload() {}
|
||
handleCreditFileChange() {}
|
||
handleConfirmCreditUpload() {}
|
||
pollCreditImportStatus() {}
|
||
```
|
||
|
||
新增最小跳转实现：
|
||
|
||
```javascript
|
||
handleGoCreditInfoPage() {
|
||
if (this.isProjectTagging) {
|
||
return;
|
||
}
|
||
this.$router.push("/maintain/creditInfo");
|
||
}
|
||
```
|
||
|
||
- [ ] **Step 4: 处理无用 import**
|
||
|
||
若 `uploadFile`、`getImportStatus` 仅服务于旧征信弹窗逻辑，则从 `UploadData.vue` 顶部 import 中删除，避免残留死代码。
|
||
|
||
- [ ] **Step 5: 运行契约测试确认通过**
|
||
|
||
Run:
|
||
|
||
```bash
|
||
node ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js
|
||
```
|
||
|
||
Expected:
|
||
|
||
- PASS
|
||
|
||
- [ ] **Step 6: 手工检视跳转链路**
|
||
|
||
至少检查：
|
||
|
||
```bash
|
||
rg -n "handleGoCreditInfoPage|/maintain/creditInfo|征信导入" ruoyi-ui/src/views/ccdiProject/components/detail/UploadData.vue
|
||
```
|
||
|
||
Expected:
|
||
|
||
- PASS，按钮事件与路由目标清晰可见，不再出现旧弹窗控制逻辑。
|
||
|
||
## Task 3: 补前端实施记录
|
||
|
||
**Files:**
|
||
- Create: `docs/reports/implementation/2026-03-24-project-upload-credit-entry-jump-frontend-record.md`
|
||
|
||
- [ ] **Step 1: 新增实施记录文档**
|
||
|
||
记录以下内容：
|
||
|
||
```markdown
|
||
# 上传数据页征信导入入口跳转前端实施记录
|
||
|
||
## 本次改动
|
||
- 将项目详情上传数据页“征信导入”按钮改为直接跳转征信维护页面
|
||
- 删除当前页征信导入弹窗入口逻辑
|
||
|
||
## 影响文件
|
||
- ruoyi-ui/src/views/ccdiProject/components/detail/UploadData.vue
|
||
- ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js
|
||
|
||
## 验证
|
||
- node ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js
|
||
```
|
||
```
|
||
|
||
- [ ] **Step 2: 复核暂存区仅包含本次前端相关文件**
|
||
|
||
Run:
|
||
|
||
```bash
|
||
git status --short
|
||
```
|
||
|
||
Expected:
|
||
|
||
- 仅暂存本次前端计划执行产生的相关文件；若有无关文件已暂存，先移出暂存区。
|