wkc/ccdi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
6b0c83024e9e54318e19d8c76bfe5127c9ba35ab
ccdi/docs/plans/frontend/2026-03-24-credit-info-direct-storage-frontend-implementation.md

8.2 KiB
Raw Blame History

Credit Info Direct Storage 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: 保留现有 ruoyi-ui/src/views/ccdiCreditInfo/index.vue 独立页面和 @/api/ccdiCreditInfo API 封装，不新增路由和页面。核心改造点是精简查询参数和列表列定义，使页面只围绕姓名、身份证号和征信摘要展示运转，同时同步修正前端静态契约测试与删除确认文案。

Tech Stack: Vue 2, Element UI, Axios request 封装, Node.js 源码契约测试, npm

文件结构与职责

修改文件

  • ruoyi-ui/src/views/ccdiCreditInfo/index.vue 移除“柜员号”“是否已维护”，收敛查询区、列表列和删除提示文案。
  • ruoyi-ui/tests/unit/credit-info-page-layout.test.js 锁定新页面结构：只有姓名、身份证号查询，不再出现柜员号列。
  • ruoyi-ui/tests/unit/credit-info-maintained-filter.test.js 从“默认 maintained=1”契约改为“页面已彻底移除 maintained 口径”契约。
  • ruoyi-ui/tests/unit/credit-info-detail-ui.test.js 删除提示文案从“员工当前已维护征信”改为“征信对象当前已维护征信”。
  • docs/reports/implementation/2026-03-24-credit-info-direct-storage-frontend-record.md 前端实施记录。

参考文件

  • docs/design/2026-03-24-credit-info-direct-storage-design.md
  • ruoyi-ui/src/api/ccdiCreditInfo.js
  • docs/reports/implementation/2026-03-23-credit-info-maintenance-frontend-implementation.md

Task 1: 先把前端静态契约切到新口径

Files:

  • Modify: ruoyi-ui/tests/unit/credit-info-page-layout.test.js

  • Modify: ruoyi-ui/tests/unit/credit-info-maintained-filter.test.js

  • Modify: ruoyi-ui/tests/unit/credit-info-detail-ui.test.js

  • Step 1: 改写页面结构契约

在 credit-info-page-layout.test.js 中保留这些必备 token：

[
  "征信维护",
  "姓名",
  "身份证号",
  "批量上传征信HTML",
  "最近征信查询日期",
  "负债笔数",
  "负债总额",
  "民事案件笔数",
  "强制执行笔数",
  "行政处罚笔数",
  "详情",
  "删除"
].forEach((token) => {
  assert(source.includes(token), `征信维护页面缺少关键结构: ${token}`);
});

并增加排除断言：

assert(!source.includes('label="柜员号"'), "征信维护页面不应再展示柜员号查询项");
assert(!source.includes('prop="staffId"'), "征信维护列表不应再展示柜员号列");
  • Step 2: 改写 maintained 契约

把 credit-info-maintained-filter.test.js 改成下面这组断言：

assert(!source.includes("maintained:"), "征信维护页面不应再维护 maintained 查询参数");
assert(!source.includes('label="是否已维护"'), "征信维护页面不应再展示是否已维护筛选项");
assert(!source.includes('value="1"'), "征信维护页面不应再内置已维护默认筛选");
  • Step 3: 改写详情/删除契约

把 credit-info-detail-ui.test.js 的删除确认文案断言改为：

"确认删除该征信对象当前已维护的征信信息吗？"
  • Step 4: 运行静态契约确认失败

Run:

node ruoyi-ui/tests/unit/credit-info-page-layout.test.js
node ruoyi-ui/tests/unit/credit-info-maintained-filter.test.js
node ruoyi-ui/tests/unit/credit-info-detail-ui.test.js

Expected:

  • FAIL，原因应集中在页面仍包含 staffId、maintained 和旧删除文案。

  • Step 5: 提交前端测试契约

git add ruoyi-ui/tests/unit/credit-info-page-layout.test.js \
        ruoyi-ui/tests/unit/credit-info-maintained-filter.test.js \
        ruoyi-ui/tests/unit/credit-info-detail-ui.test.js
git commit -m "新增征信维护前端直接入库测试契约"

Task 2: 精简征信维护页面查询区与列表区

Files:

  • Modify: ruoyi-ui/src/views/ccdiCreditInfo/index.vue

  • Step 1: 删除查询区旧字段

从查询表单移除以下片段：

<el-form-item label="柜员号">
  <el-input v-model="queryParams.staffId" ... />
</el-form-item>

<el-form-item label="是否已维护">
  <el-select v-model="queryParams.maintained" ...>
    <el-option label="已维护" value="1" />
  </el-select>
</el-form-item>

查询区只保留：

<el-form-item label="姓名">
  <el-input v-model="queryParams.name" placeholder="请输入姓名" />
</el-form-item>
<el-form-item label="身份证号">
  <el-input v-model="queryParams.idCard" placeholder="请输入身份证号" />
</el-form-item>
  • Step 2: 精简 queryParams 与重置逻辑

把 data() 与 resetQuery() 收敛为：

queryParams: {
  pageNum: 1,
  pageSize: 10,
  name: undefined,
  idCard: undefined,
}

确保以下字段彻底消失：

staffId
maintained
  • Step 3: 删除列表中的柜员号列

移除：

<el-table-column label="柜员号" prop="staffId" align="center" />

保留列表列顺序为：

姓名 -> 身份证号 -> 最近征信查询日期 -> 负债笔数 -> 负债总额 -> 民事案件笔数 -> 强制执行笔数 -> 行政处罚笔数 -> 操作
  • Step 4: 调整删除确认文案

将删除提示文案改成：

"确认删除该征信对象当前已维护的征信信息吗？"
  • Step 5: 运行静态契约确认通过

Run:

node ruoyi-ui/tests/unit/credit-info-page-layout.test.js
node ruoyi-ui/tests/unit/credit-info-maintained-filter.test.js
node ruoyi-ui/tests/unit/credit-info-detail-ui.test.js

Expected:

  • PASS，页面已完全移除员工口径字段。

  • Step 6: 提交页面改造

git add ruoyi-ui/src/views/ccdiCreditInfo/index.vue \
        ruoyi-ui/tests/unit/credit-info-page-layout.test.js \
        ruoyi-ui/tests/unit/credit-info-maintained-filter.test.js \
        ruoyi-ui/tests/unit/credit-info-detail-ui.test.js
git commit -m "调整征信维护前端页面展示口径"

Task 3: 校验 API 调用与页面数据流未回退

Files:

  • Review: ruoyi-ui/src/api/ccdiCreditInfo.js

  • Review: ruoyi-ui/tests/unit/credit-info-api-contract.test.js

  • Review: ruoyi-ui/tests/unit/credit-info-upload-ui.test.js

  • Step 1: 确认 API 文件无需改路径

检查 ccdiCreditInfo.js 保持以下函数与路径不变：

uploadCreditHtml(files)
listCreditInfo(query)
getCreditInfoDetail(personId)
deleteCreditInfo(personId)

以及：

'/ccdi/creditInfo/upload'
'/ccdi/creditInfo/list'
'/ccdi/creditInfo/'
  • Step 2: 运行 API 与上传 UI 契约

Run:

node ruoyi-ui/tests/unit/credit-info-api-contract.test.js
node ruoyi-ui/tests/unit/credit-info-upload-ui.test.js

Expected:

  • PASS，说明本次仅调整查询口径，不影响接口路径和上传交互。

  • Step 3: 运行前端构建

Run:

cd ruoyi-ui
npm run build:prod

Expected:

  • PASS，构建通过
  • 允许出现项目既有体积告警，但不应出现新增编译错误

Task 4: 补齐前端实施记录

Files:

  • Create: docs/reports/implementation/2026-03-24-credit-info-direct-storage-frontend-record.md

  • Step 1: 编写前端实施记录

在实施记录中至少包含：

  • 实施目标：页面切到征信对象维度

  • 实际修改文件

  • 查询区与列表区移除字段说明

  • 删除提示文案调整

  • 验证命令与结果

  • 若测试期间启动 dev server，结束后已关闭进程

  • Step 2: 检查暂存区仅包含本次前端改动

Run:

git status --short
git diff --staged --name-only

Expected:

  • 仅出现前端页面、测试和实施记录相关文件。

  • Step 3: 提交前端记录

git add docs/reports/implementation/2026-03-24-credit-info-direct-storage-frontend-record.md
git commit -m "补充征信维护前端直接入库实施记录"
Reference in New Issue View Git Blame Copy Permalink