Files
ccdi/docs/plans/frontend/2026-03-24-project-upload-credit-entry-jump-frontend-implementation.md

5.9 KiB
Raw Blame History

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 源码,至少断言以下关键点:

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:

node ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js

Expected:

  • PASS证明当前按钮仍绑定旧的弹窗入口。

  • Step 3: 改写测试为目标行为

将断言改为目标行为:

[
  "@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:

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: 修改模板点击事件

把“征信导入”按钮点击事件:

@click="handleOpenCreditUpload"

改为:

@click="handleGoCreditInfoPage"
  • Step 2: 删除本地征信导入弹窗模板

移除 title="征信导入"el-dialog 以及其中的 el-upload、底部按钮,确保该按钮点击后不再出现本地弹窗。

  • Step 3: 删除无用状态与方法并新增跳转方法

删除以下无用状态与方法:

showCreditUploadDialog: false,
creditFileList: [],
creditUploading: false,
handleOpenCreditUpload() {}
handleCreditFileChange() {}
handleConfirmCreditUpload() {}
pollCreditImportStatus() {}

新增最小跳转实现:

handleGoCreditInfoPage() {
  if (this.isProjectTagging) {
    return;
  }
  this.$router.push("/maintain/creditInfo");
}
  • Step 4: 处理无用 import

uploadFilegetImportStatus 仅服务于旧征信弹窗逻辑,则从 UploadData.vue 顶部 import 中删除,避免残留死代码。

  • Step 5: 运行契约测试确认通过

Run:

node ruoyi-ui/tests/unit/project-upload-credit-entry-jump.test.js

Expected:

  • PASS

  • Step 6: 手工检视跳转链路

至少检查:

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: 新增实施记录文档

记录以下内容:

# 上传数据页征信导入入口跳转前端实施记录

## 本次改动
- 将项目详情上传数据页“征信导入”按钮改为直接跳转征信维护页面
- 删除当前页征信导入弹窗入口逻辑

## 影响文件
- 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:

  • 仅暂存本次前端计划执行产生的相关文件;若有无关文件已暂存,先移出暂存区。