【Codex】我的工作考试统计数据可视化

考试统计把题库中心、考试安排、历史试卷、成绩数据、答题记录和知识点掌握放到一张看板里，用来检查考试中心的数据完整度。题目、试卷、成绩和答题记录的口径稳定，后续分析才有基础。

本文按照 Demo 的固定结构，基于 SiteStatsViewSet 的考试分区接口和 TestingCenterStats/index.vue 页面，整理考试统计如何交给 Codex 生成项目代码。

文章目录

• 设计与需求
• • 后端设计
  • 前端设计
• 扩展功能
• • 数据统计
  • 数据联动
  • 统计缓存与菜单入口
• Codex开发标准
• • [SOP 标准](#SOP 标准)
  • [PDD 标准](#PDD 标准)
• 总结

设计与需求

考试统计复用 SiteStatsViewSet.build_application_section_data("testing")。后端在 _testing_center_stats 中生成六类考试中心卡片，在 _testing_center_detail 中补充题库、考试安排、历史试卷的深度明细。
验收阶段
展示阶段
设计阶段
输入阶段
业务数据
统计口径
菜单入口
后端聚合
接口返回
前端看板
指标卡
矩阵树图
明细表格
数据一致
布局稳定
权限可见

这张图表达的是统计类模块从业务数据到页面展示的转换关系。Codex 处理这类需求时，不能只生成一个空页面或普通 CRUD，需要把统计口径、接口返回结构、前端矩阵展示和菜单权限一起纳入设计。

需求层描述	设计层转换	Codex 代码生成方向
考试中心需要统一巡检	将题库、考试安排、历史试卷、成绩、答题、掌握度统一成统计分区	生成考试统计 Hero、记录总数和平均达成率
题库需要看题型和难度	按 TextBookCategory、题库类型、学科、题型、难度、核心素养聚合	生成多层 Tab、题目类型树图和学科明细
考试安排需要看配置完整度	统计考试类别、年级、学科、试题配置和分数配置	生成考试类别结构、配置率和明细指标
历史试卷需要看处理链路	统计扫描、解析、导入、同步和题量总分	生成来源分布、状态链路和成功率
成绩与答题需要看分析底座	统计成绩记录、覆盖学生、答题状态、耗时、得分率和知识点掌握	生成考试中心扩展卡片和概览指标

考试统计的真实统计对象覆盖考试中心完整链路，其中题库、考试安排、历史试卷拥有更详细的页面区域。

统计对象	代码口径	页面呈现
题库中心	QuestionBank 按教材分类、题库类型、学科、题型、难度、核心素养聚合	多层 Tab、题目类型矩阵树图、难度统计、核心素养分布
考试安排	ExaminationArrangement 统计导入状态、试题配置、分数配置和考试类别	考试类别结构、导入配置率、试题/分数配置指标
历史试卷	HistoricalExamPaper 统计解析、导入、同步、题量和总分	来源/学科分布、处理状态链路、成功率指标
成绩数据	ExaminationStudentScore 统计成绩记录、覆盖学生、考试编码、学科和平均成绩	顶部卡片中的成绩数据模块
答题记录	QuestionAnswerRecord 统计正确、错误、部分正确、耗时和得分率	顶部卡片中的答题记录模块
知识点掌握	StudentKnowledgeMastery 统计学生、学科、知识点、掌握分和样本量	顶部卡片中的知识点掌握模块

可以直接使用下面的Prompt进行模块功能的设计

请基于 ManageBak-ExamEdu 项目设计并实现【考试统计】统计模块。

模块前端入口为：server_vue3/src/views/system/MyWork/TestingCenterStats/index.vue
后端接口入口为：server_backend/modules/MyWork/views_app/SiteStats.py
接口地址为：/api/MyWork/SiteStats/testing_stats/
菜单路径为：/system/MyWork/TestingCenterStats

请先读取上述前端页面、后端 ViewSet、路由注册、统计缓存工具、共享样式文件和菜单同步脚本，再设计模块。不要只按模块名称联想功能，必须以真实源码中的统计口径为准。

模块需要覆盖这些统计对象：题库中心、考试安排、历史试卷、成绩数据、答题记录、知识点掌握。

请输出完整模块设计方案，包括业务定位、后端聚合口径、接口返回结构、前端页面结构、指标卡设计、矩阵树图与明细表格关系、菜单权限、缓存策略、验收标准。设计确认后，再按照当前项目技术栈生成或补齐项目代码。

后端设计

后端入口是 server_backend/modules/MyWork/views_app/SiteStats.py。考试统计通过 SiteStatsViewSet.testing_stats 暴露分区接口，具体聚合由 _testing_center_stats、_testing_center_detail 和 _question_bank_category_tabs 等函数完成。

后端设计项	真实代码依据	Codex 生成方向
ViewSet 入口	SiteStatsViewSet，文件 server_backend/modules/MyWork/views_app/SiteStats.py	保持统计接口集中在 ViewSet action 内，避免把聚合逻辑散落到前端
接口方法	testing_stats` action 调用 `build_application_section_data("testing")	生成 GET 统计接口，返回可直接驱动页面的结构化数据
数据模型	QuestionBank、ExaminationArrangement、HistoricalExamPaper、ExaminationStudentScore、QuestionAnswerRecord、StudentKnowledgeMastery	按真实模型字段聚合，不在接口里编造不存在的维度
统计构建	``_testing_center_stats 生成卡片，_testing_center_detail 生成题库、考试安排和历史试卷 detail	把 summary、cards、detail 或 dimensions 拆清楚，便于前端复用
缓存策略	get_or_build_stats_payload("mywork.site.testing_stats", "考试统计", ...)	使用统计缓存减少重复聚合开销，并保留刷新入口
路由注册	server_backend/modules/MyWork/urls.py	通过 DRF router 暴露 /api/.../ 接口，不新增孤立 URL
菜单入口	server_backend/dvadmin/system/management/commands/sync_mywork_statistics_menu.py 中的 /system/MyWork/TestingCenterStats	让统计页面进入"我的工作/数据统计"入口并同步角色权限

考试统计后端要区分概览卡片和深度明细。成绩、答题、知识点掌握进入 cards；题库中心、考试安排、历史试卷进入 detail，用于前端多层 Tab、类别结构和处理链路展示。

可以直接使用下面的Prompt进行后端代码的设计

请为【考试统计】补齐后端统计接口。

读取并遵循：
1. `server_backend/modules/MyWork/views_app/SiteStats.py`
2. `server_backend/modules/MyWork/urls.py`
3. `server_backend/modules/MyWork/utils.py`
4. `server_backend/dvadmin/system/management/commands/sync_mywork_statistics_menu.py`

后端接口地址：/api/MyWork/SiteStats/testing_stats/
缓存 Key：mywork.site.testing_stats
涉及模型：QuestionBank、ExaminationArrangement、HistoricalExamPaper、ExaminationStudentScore、QuestionAnswerRecord、StudentKnowledgeMastery

实现要求：
- 统计口径必须来自真实模型字段，不能凭页面名称补字段。
- 返回结构需要覆盖页面顶部 summary、模块 cards、明细 detail 或 dimensions。
- 百分比统一按 `value / total` 计算，total 为 0 时返回 0。
- 空值要归入"未填写、未设置、未分类"等明确标签。
- 接口只承担统计聚合，不把前端展示样式写进后端。
- 保持 `get_or_build_stats_payload` 缓存调用，支持统一刷新统计渲染缓存。
- 路由继续使用已有 DRF router 注册方式，避免新增重复路径。

完成后给出字段口径、返回结构示例、缓存 Key 和接口验收点。

前端设计

前端入口是 server_vue3/src/views/system/MyWork/TestingCenterStats/index.vue，通过 /api/MyWork/SiteStats/testing_stats/ 获取数据。页面顶部展示模块数、记录数、平均达成率，下方按考试中心对象组织 matrix-card。

前端设计项	真实代码依据	Codex 生成方向
页面入口	server_vue3/src/views/system/MyWork/TestingCenterStats/index.vue	保持统计页单文件入口，必要时只抽取真正复用的展示组件
接口调用	request({ url: '/api/MyWork/SiteStats/testing_stats/', method: 'get' })	页面加载时拉取统计数据，失败时保留空态和 loading 状态
共享样式	server_vue3/src/theme/stats-dashboard.scss	使用 stats-dashboard-standard、stats-module-header、stats-kpi-strip 统一看板骨架
顶部 Hero	页面标题、说明和三枚核心指标	让用户进入页面后立即看到模块规模、记录量和完成率
模块 Frame	Header、描述、指标卡、Body	每个统计对象独立成块，避免图表和表格混在一层
明细展示	多层 Tab、题目类型矩阵树图、维度分布卡片、考试类别结构、处理链路指标	同一批接口数据同时支撑概览图和可核对表格
交互状态	activeQuestionCategory、activeQuestionType、activeQuestionSubject、activeQuestionDimension、questionCategoryTabs、examArrangementDetail、historicalPaperDetail	Tab、矩阵、表格高度和空态要跟随接口数据稳定变化

页面状态包括 activeQuestionCategory、activeQuestionType、activeQuestionSubject、activeQuestionDimension。题库区域的多层 Tab 让用户从教材分类进入题库类型，再进入学科和题目类型/难度/核心素养维度。

可以直接使用下面的Prompt进行前端代码的设计

请为【考试统计】实现或补齐前端统计看板。

读取并遵循：
1. `server_vue3/src/views/system/MyWork/TestingCenterStats/index.vue`
2. `server_vue3/src/theme/stats-dashboard.scss`
3. `docs/sop/server/04.统计看板表格化改造SOP.md`
4. 后端接口 `/api/MyWork/SiteStats/testing_stats/` 的真实返回结构

页面要求：
- 使用 `stats-dashboard-standard` 作为统计页根容器。
- 顶部 Hero 展示标题、说明和三项核心指标。
- 每个统计对象使用 `stats-module-header` 组织标题、描述和 KPI。
- 图形展示只做概览，必须提供可核对的明细表格或矩阵。
- Tab、矩阵树图、明细表格要消费同一份数据，避免前后口径不一致。
- loading、空数据、接口异常、移动端布局都要有稳定状态。
- 不改后端字段名称，不在前端伪造不存在的统计维度。

完成后给出页面区域、接口字段映射、交互状态和构建验证结果。

扩展功能

【考试统计】不是普通管理页，它的扩展能力集中在数据统计、统计维度联动、缓存刷新和菜单权限。源码没有 LLM、OCR、导入导出或审批流入口，因此文档只描述真实存在的统计能力。

扩展功能	主要用途	落地重点
数据统计	把多个业务表聚合成 summary、cards、detail 或 dimensions	后端统一计算数量、完成率、启用率和字段覆盖率
数据联动	让 Tab、矩阵树图、指标卡、表格共用一套接口数据	前端 computed 状态只做格式化，不改变业务口径
统计缓存与菜单入口	降低统计接口重复聚合成本，并让页面进入数据统计菜单	使用 get_or_build_stats_payload 与菜单同步脚本维护入口

数据统计

考试统计的数据统计能力覆盖考试中心主链路。后端把题库答案完备率、考试导入配置率、历史试卷导入成功率、成绩覆盖、答题判题率和知识点掌握样本整理为统一统计分区。
结果阶段
处理阶段
输入阶段
业务模型
字段口径
空值规则
数量聚合
占比计算
结构组装
概览指标
分布数据
明细矩阵
口径校验

可以直接使用下面的Prompt进行数据统计功能设计

请为【考试统计】设计数据统计能力。

统计对象：题库中心、考试安排、历史试卷、成绩数据、答题记录、知识点掌握
后端入口：server_backend/modules/MyWork/views_app/SiteStats.py
接口地址：/api/MyWork/SiteStats/testing_stats/

要求：
- 明确每个统计对象对应的模型、过滤条件、计数字段和完成率字段。
- 统一输出 summary、cards、detail 或 dimensions，不让前端重新推导业务口径。
- 所有 rate 字段返回 0 到 1 的小数，前端再格式化为百分比。
- 分布数据要同时能驱动矩阵树图、图例和明细表格。
- 空值必须归并为可读标签，例如未填写、未设置、未分类、待初始化。
- 给出接口返回示例和异常数据处理规则。

数据联动

考试统计的联动最复杂，主要集中在题库中心。教材分类、题库类型、学科和统计维度四层状态共同决定当前展示的数据，左侧矩阵树图、右侧学科明细和维度分布必须保持同一统计口径。
结果阶段
处理阶段
输入阶段
接口数据
当前 Tab
统计维度
computed 转换
图表数据
表格行列
指标同步
图表同步
表格同步
一致校验

可以直接使用下面的Prompt进行数据联动设计

请为【考试统计】补齐前端数据联动。

前端入口：server_vue3/src/views/system/MyWork/TestingCenterStats/index.vue
联动状态：activeQuestionCategory、activeQuestionType、activeQuestionSubject、activeQuestionDimension、questionCategoryTabs、examArrangementDetail、historicalPaperDetail
展示组件：多层 Tab、题目类型矩阵树图、维度分布卡片、考试类别结构、处理链路指标

要求：
- Tab 当前值、指标卡、矩阵树图和明细表格必须来自同一份接口数据。
- computed 只做排序、分组、百分比格式化和空值兜底，不改变后端统计结论。
- 切换 Tab 后标题、描述、指标、图表、表格同步更新。
- 接口为空时展示 el-empty，不出现 NaN、undefined 或布局塌陷。
- 表格高度、滚动区域和移动端布局保持稳定。

统计缓存与菜单入口

考试统计使用缓存 Key mywork.site.testing_stats，并和 mywork.application_stats.testing 一起进入统一刷新计划。菜单脚本写入 /system/MyWork/TestingCenterStats，组件指向 system/MyWork/TestingCenterStats/index。

入口类型	真实文件	说明
接口缓存	server_backend/modules/MyWork/utils.py	get_or_build_stats_payload 读取或构建统计结果
刷新计划	server_backend/modules/MyWork/utils.py	_refresh_plans 覆盖配置、用户、教学、考试、内容统计
菜单同步	server_backend/dvadmin/system/management/commands/sync_mywork_statistics_menu.py	维护 /system/MyWork/TestingCenterStats、组件 system/MyWork/TestingCenterStats/index 和角色权限
共享样式	server_vue3/src/theme/stats-dashboard.scss	统一 Hero、Header Frame、KPI、滚动容器样式

可以直接使用下面的Prompt进行统计缓存与菜单入口设计

请为【考试统计】检查统计缓存和菜单入口。

缓存 Key：mywork.site.testing_stats
菜单路径：/system/MyWork/TestingCenterStats
组件路径：system/MyWork/TestingCenterStats/index
前端页面：server_vue3/src/views/system/MyWork/TestingCenterStats/index.vue

要求：
- 统计接口必须接入 `get_or_build_stats_payload`。
- 统一刷新计划需要包含该模块缓存 Key。
- 菜单同步脚本需要写入正确的 web_path、component、component_name、icon、image、sort 和 cache 配置。
- 菜单权限要同步到已有角色权限表，避免页面有路由但角色不可见。
- 交付时列出缓存 Key、菜单路径和接口地址。

Codex开发标准

使用 Codex 开发统计看板时，输入不能只写"做一个统计页面"。更稳的方式是把统计口径、接口字段、页面结构、共享样式、缓存策略和验收清单一次性交给 Codex，让代码生成围绕真实工程边界展开。
验收交付
Codex开发
模块设计
输入约束
源码路径
接口口径
SOP规范
后端聚合
前端布局
缓存菜单
生成代码
补齐状态
统一样式
构建通过
口径一致
页面稳定

SOP 标准

SOP 项	执行标准	对【考试统计】的要求
文档规范	参考 _Demo/_教程撰写.md 的固定结构	标题、开头、TOC、设计、后端、前端、扩展、Codex 标准、总结齐全
统计页规范	参考 docs/sop/server/04.统计看板表格化改造SOP.md	页面使用 Header Frame、指标卡、矩阵树图、明细表格
源码真实性	只写真实代码存在的接口、模型和页面状态	不写 LLM、OCR、导入导出、审批流等不存在能力
样式复用	共享样式统一进入 stats-dashboard.scss	单页只处理必要差异，不复制一套统计页框架
接口稳定	后端给前端结构化统计结果	前端不重新计算复杂业务口径

可以直接使用下面的Prompt进行SOP撰写

请按照 `_Demo/_教程撰写.md` 和 `docs/sop/server/04.统计看板表格化改造SOP.md`，为【考试统计】整理开发 SOP。

SOP 需要覆盖：源码读取顺序、后端统计口径、前端页面结构、共享样式使用、缓存 Key、菜单同步、构建验证、页面验收清单。

文档只写真实存在的文件、接口和模型。涉及流程时使用 Mermaid，涉及口径映射和验收标准时使用 Markdown 表格。

PDD 标准

验收项	验收标准	失败风险
接口可用	/api/MyWork/SiteStats/testing_stats/ 返回 summary、模块数据和明细数据	页面无数据或字段 undefined
统计口径	后端统计与模型字段一致，rate 计算稳定	图表、表格、指标卡口径不一致
页面结构	Hero、模块 Header、KPI、图表、表格层次清晰	统计页像普通列表或内容拥挤
数据联动	Tab 切换后图表和表格同步	用户看到不同区域数据互相冲突
缓存入口	缓存 Key 能被统一刷新计划覆盖	数据更新后页面仍长期显示旧统计
菜单权限	/system/MyWork/TestingCenterStats 可见且组件路径正确	卡片能看到但进入页面失败
构建验证	前端构建通过，无类型和模板错误	代码合入后影响管理后台构建

可以直接使用下面的Prompt进行PDD 验收

请为【考试统计】输出 PDD 验收清单。

需要检查：
1. 后端接口 `/api/MyWork/SiteStats/testing_stats/` 的返回结构和字段口径。
2. 前端页面 `server_vue3/src/views/system/MyWork/TestingCenterStats/index.vue` 的 Hero、Header Frame、指标卡、矩阵树图、表格、Tab、空态和 loading。
3. 共享样式 `stats-dashboard.scss` 是否被正确使用。
4. 缓存 Key `mywork.site.testing_stats` 是否进入统一刷新计划。
5. 菜单路径 `/system/MyWork/TestingCenterStats` 和组件 `system/MyWork/TestingCenterStats/index` 是否能通过菜单同步脚本落库。
6. `npm run build` 是否通过。

输出结果用表格列出验收项、检查方法、通过标准和风险说明。

总结

考试统计文档的核心是考试数据完整度。后端通过 SiteStats 考试分区聚合题库、考试安排、历史试卷、成绩、答题和掌握度，前端用多层 Tab 和矩阵展示考试中心的数据链路。

Codex 处理这类统计页时，真正要生成的不只是一个 Vue 页面，而是一条从业务模型、统计接口、缓存刷新、菜单权限到前端可视化的完整链路。只要输入中把真实源码路径、接口地址和统计口径交代清楚，生成出来的代码就更容易接入 ManageBak-ExamEdu 的现有工程结构。