zkxw/docs/superpowers/plans/2026-07-07-qc-inbound-sibling-navigate.md

同协议样本点击跳转与按需插入卡片 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: 后端新增 GET /qc-work-orders/by-sample 精确查工单并 enrich；前端 useInboundSiblingNavigation 管理插入卡与滚动；QcWorkOrderSampleGroup 发 sibling-navigate 事件；QcWorkOrderCardList 渲染插入卡。

Tech Stack: FastAPI + SQLAlchemy · Vue 3 + Element Plus · 现有 QcWorkOrderSampleGroup 卡片体系

Spec: docs/superpowers/specs/2026-07-07-qc-inbound-sibling-navigate-design.md

---

Task 1: 后端 by-sample 查询

Files:

• Modify: backend/app/crud/qc_work_order.py

• Modify: backend/app/api/qc.py

• [ ] 在 qc_work_order.py 新增 list_work_orders_by_sample（tenant + 数据权限 + 列表 enrich）

• [ ] 在 qc.py 注册 GET /qc-work-orders/by-sample（置于 /{work_order_id} 之前），权限 require_any_menu_code("biz:qcWorkOrder:list", "biz:myQcTask:list")

Task 2: 前端 API 与 link 模型

Files:

• Modify: web-admin/src/api/qc-work-order.ts

• Modify: web-admin/src/utils/qc-work-order-inbound-sample-cards.ts

• [ ] 新增 fetchQcWorkOrdersBySample

• [ ] QcInboundProtocolSiblingLink 增加 sampleCode；buildProtocolSiblingLinksFromSamples / buildLinksFromVisibleGroups 写入

Task 3: useInboundSiblingNavigation composable

Files:

• Create: web-admin/src/views/quality-inspection/qc-work-order/composables/useInboundSiblingNavigation.ts

• [ ] 实现 navigateToSibling / clearInsertedCards / insertedCardsAfter

• [ ] manage 模式拉 inspection batches；mine 模式按 sampleCode keyword 过滤我的任务

Task 4: 集成 Tab 页与 CardList

Files:

• Modify: web-admin/src/views/quality-inspection/qc-work-order/composables/useQcWorkOrderTabPage.ts
• Modify: web-admin/src/views/quality-inspection/qc-work-order/QcWorkOrderCardList.vue

• Modify: web-admin/src/views/quality-inspection/qc-work-order/tabs/QcWorkOrderTabPanel.vue

• [ ] loadData 开头 clearInsertedCards

• [ ] CardList 入库分支渲染插入卡 + 合并 preset tasks/batches

Task 5: SampleGroup 可点击芯片

Files:

• Modify: web-admin/src/views/quality-inspection/qc-work-order/QcWorkOrderSampleGroup.vue

• [ ] 芯片改 button、emit sibling-navigate、isInsertedSibling 标识、loading 禁用

Task 6: 验证

• pnpm lint（改动文件）
• ./scripts/update-graph.sh frontend