# 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: - 仅暂存本次前端计划执行产生的相关文件;若有无关文件已暂存,先移出暂存区。