wkc/ccdi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
6385778e4c6b1dca8b96f8cc1fd246d505b4e20f
ccdi/docs/plans/frontend/2026-03-30-project-detail-risk-people-export-frontend-implementation.md

6.4 KiB
Raw Blame History

Project Detail Risk People Export 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.

Repo note: 本仓库 AGENTS.md 明确禁止开启 subagent，执行本计划时请在当前会话使用 superpowers:executing-plans。

Goal: 为项目详情“结果总览 -> 风险总览”人员列表的“导出”按钮接通真实下载动作，让前端按当前项目导出全部风险人员，同时不影响现有分页和“查看项目”行为。

Architecture: 前端继续使用 PreliminaryCheck.vue -> RiskPeopleSection.vue 现有结构，不新增导出弹窗、导出状态管理或 API 封装层。实现采用仓库现成的 this.download(...) 模式，直接在 RiskPeopleSection.vue 中根据 projectId 触发 /ccdi/project/overview/risk-people/export 下载，保持改动集中在结果总览人员组件和静态结构回归测试中。

Tech Stack: Vue 2, Element UI, SCSS, 若依前端 download 插件, Node assert 结构测试

Task 1: 锁定风险人员导出按钮的前端契约

Files:

  • Modify: ruoyi-ui/tests/unit/preliminary-check-risk-people-binding.test.js

  • Create: ruoyi-ui/tests/unit/preliminary-check-risk-people-export.test.js

  • Step 1: 先写失败测试，锁定导出方法、下载路径和文件名

[
  "handleRiskPeopleExport",
  "this.download(",
  "ccdi/project/overview/risk-people/export",
  "projectId: this.projectId",
  "风险人员总览_",
].forEach((token) => assert(source.includes(token), token));

assert(source.includes("@click=\"handleRiskPeopleExport\""), "导出按钮必须绑定导出事件");
  • Step 2: 运行前端结构测试，确认当前按钮还只是静态文案

Run:

node ruoyi-ui/tests/unit/preliminary-check-risk-people-binding.test.js
node ruoyi-ui/tests/unit/preliminary-check-risk-people-export.test.js

Expected:

  • FAIL，提示缺少 handleRiskPeopleExport

  • FAIL，提示“导出”按钮尚未绑定 @click

  • Step 3: 提交当前失败测试基线到工作区，不提交 Git

工作区保持红灯，继续下一任务实现，不要在此步提前提交。

Task 2: 在 RiskPeopleSection.vue 中接通最短路径导出

Files:

  • Modify: ruoyi-ui/src/views/ccdiProject/components/detail/RiskPeopleSection.vue

  • Modify: ruoyi-ui/tests/unit/preliminary-check-risk-people-binding.test.js

  • Modify: ruoyi-ui/tests/unit/preliminary-check-risk-people-export.test.js

  • Step 1: 写最小实现，只在组件内接通下载

<el-button size="mini" type="text" @click="handleRiskPeopleExport">导出</el-button>

handleRiskPeopleExport() {
  if (!this.projectId) {
    return;
  }
  this.download(
    "ccdi/project/overview/risk-people/export",
    {
      projectId: this.projectId,
    },
    `风险人员总览_${this.projectId}_${new Date().getTime()}.xlsx`
  );
},
  • Step 2: 保持现有分页与查看项目逻辑不变

重点确认实现时不要改动：

  • loadRiskPeoplePage

  • handlePageChange

  • handleViewProject

  • sectionData -> localRows 的 watch 逻辑

  • Step 3: 跑前端结构回归测试

Run:

node ruoyi-ui/tests/unit/preliminary-check-risk-people-binding.test.js
node ruoyi-ui/tests/unit/preliminary-check-risk-people-export.test.js
node ruoyi-ui/tests/unit/preliminary-check-risk-people-pagination.test.js
node ruoyi-ui/tests/unit/preliminary-check-project-analysis-entry.test.js

Expected:

  • PASS

  • 导出按钮已接通

  • 分页与“查看项目”相关断言不受影响

  • Step 4: 提交本任务

git add ruoyi-ui/src/views/ccdiProject/components/detail/RiskPeopleSection.vue \
  ruoyi-ui/tests/unit/preliminary-check-risk-people-binding.test.js \
  ruoyi-ui/tests/unit/preliminary-check-risk-people-export.test.js \
  ruoyi-ui/tests/unit/preliminary-check-risk-people-pagination.test.js \
  ruoyi-ui/tests/unit/preliminary-check-project-analysis-entry.test.js
git commit -m "接通风险总览人员列表前端导出"

Task 3: 补齐前端验证记录与实施留痕

Files:

  • Create: docs/reports/implementation/2026-03-30-project-detail-risk-people-export-frontend-record.md

  • Create: docs/tests/records/2026-03-30-project-detail-risk-people-export-frontend-verification.md

  • Verify: docs/design/2026-03-30-project-detail-risk-people-export-design.md

  • Step 1: 跑本次前端最小回归集

Run:

node ruoyi-ui/tests/unit/preliminary-check-risk-people-binding.test.js
node ruoyi-ui/tests/unit/preliminary-check-risk-people-export.test.js
node ruoyi-ui/tests/unit/preliminary-check-risk-people-pagination.test.js
node ruoyi-ui/tests/unit/preliminary-check-project-analysis-entry.test.js

Expected:

  • PASS

  • Step 2: 记录测试结果

在 docs/tests/records/2026-03-30-project-detail-risk-people-export-frontend-verification.md 记录：

  • 执行命令

  • 通过情况

  • 按钮下载路径

  • 分页与查看项目未受影响的结论

  • Step 3: 记录实施内容

在 docs/reports/implementation/2026-03-30-project-detail-risk-people-export-frontend-record.md 记录：

  • 为什么直接使用 this.download(...)

  • 为什么不额外新增 projectOverview.js 导出封装

  • 本次只修改 RiskPeopleSection.vue

  • 文件名和下载参数口径

  • Step 4: 提交本任务

git add docs/reports/implementation/2026-03-30-project-detail-risk-people-export-frontend-record.md \
  docs/tests/records/2026-03-30-project-detail-risk-people-export-frontend-verification.md
git commit -m "补充风险总览人员导出前端记录"

最终验证

  • 运行前端回归：
node ruoyi-ui/tests/unit/preliminary-check-risk-people-binding.test.js
node ruoyi-ui/tests/unit/preliminary-check-risk-people-export.test.js
node ruoyi-ui/tests/unit/preliminary-check-risk-people-pagination.test.js
node ruoyi-ui/tests/unit/preliminary-check-project-analysis-entry.test.js

  • 确认以下结果：

    • RiskPeopleSection.vue 的“导出”按钮已接通真实下载动作
    • 下载参数仅包含 projectId
    • 当前分页不会影响导出范围
    • “查看项目”和分页逻辑仍正常

  • 准备执行时，只暂存本次任务相关前端文件后再提交

Reference in New Issue View Git Blame Copy Permalink