质检工单 · 用户费用摘要 Implementation Plan

For agentic workers: REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (- [ ]) syntax for tracking.

Goal: 在入库/出库质检工单列表与查看弹窗中，为采集协议单与基础实验来源展示用户费用当前快照。

Architecture: 后端新增 qc_work_order_fee_summary 服务批量计算 paymentSummary / feeSummary，在列表与详情 enrich 中挂载；前端在样本组/卡片增加摘要条，查看弹窗补充缴费区块。

Tech Stack: Python 3.9 / FastAPI / SQLAlchemy · Vue 3 / Element Plus / TypeScript

Spec: docs/superpowers/specs/2026-06-12-qc-work-order-fee-summary-design.md

Task 1: 后端费用摘要服务

Files:

Create: backend/app/services/qc_work_order_fee_summary.py
Modify: backend/app/crud/qc_work_order.py
[x] 实现 build_protocol_payment_summaries / build_basic_experiment_fee_summaries / enrich_work_order_fee_summaries
[x] 在 list_work_orders 与 get_work_order_detail / get_outbound_qc_detail 调用 enrich

Task 2: 前端 API 类型

Files:

Modify: web-admin/src/api/qc-work-order.ts
[x] 新增 QcProtocolPaymentSummary / QcBasicExperimentFeeSummary 并扩展 QcWorkOrder

Task 3: 列表 UI

Files:

Create: web-admin/src/views/quality-inspection/qc-work-order/QcWorkOrderFeeSummaryBar.vue
Modify: QcWorkOrderSampleGroup.vue、QcWorkOrderSingleCard.vue、index.vue（筛选补基础实验）

Task 4: 查看弹窗

Files:

Modify: index.vue（入库 viewSections）、OutboundQcViewDialog.vue

Task 5: 图谱更新

./scripts/update-graph.sh frontend（若新建组件）