zkxw/docs/superpowers/plans/2026-08-06-oa-approval-instance-draft.md

OA 发起审批草稿箱 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: 独立表 oa_instance_draft 存发起人填写草稿；提交时复用 oa_engine.start_instance，成功后软删草稿。前端在发起弹窗加「暂存草稿」，新建 drafts/index.vue 列表页。

Tech Stack: FastAPI + SQLAlchemy + MySQL；Vue 3 + Element Plus；Fresh Mint UI。

Spec: docs/superpowers/specs/2026-08-06-oa-approval-instance-draft-design.md
UI Demo: docs/demos/oa-approval-draft-box-demo.html

---

File map

文件	职责
docs/sql/oa_instance_draft.sql	建表 + sys_menu 草稿箱
backend/app/models/models.py	OaInstanceDraft
backend/app/crud/oa_instance_draft.py	草稿 CRUD
backend/app/api/oa_approval.py	drafts 路由
backend/tests/test_oa_instance_draft.py	权限/序列化/提交后软删等单测
web-admin/src/api/oaApproval.ts	drafts API
web-admin/src/router/modules/sqxp.ts	路由「草稿箱」
web-admin/src/views/oa-approval/drafts/index.vue	草稿箱页
web-admin/src/views/oa-approval/start/index.vue	暂存按钮 + draftId 回填
待同步到生产的sql脚本	追加本 SQL 引用说明（若团队习惯）

---

Task 1: SQL 建表与菜单

Files:

• Create: docs/sql/oa_instance_draft.sql

• Step 1: 编写 SQL

• Step 2: 本地执行 SQL（若有 DB） — 脚本已写入 docs/sql/oa_instance_draft.sql，需在目标库手动执行

• Step 3: Commit — 待用户要求再提交

---

Task 2: SQLAlchemy 模型

Files:

• Modify: backend/app/models/models.py（紧挨 OaInstance 之前或之后）

• Step 1: 增加 OaInstanceDraft

• Step 2: Commit feat(backend): add OaInstanceDraft model.

---

Task 3: CRUD + API（TDD）

Files:

• Create: backend/app/crud/oa_instance_draft.py

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

• Create: backend/tests/test_oa_instance_draft.py

• Step 1: 写失败/单元测试（_row_to_dict 字段、owner 校验逻辑可用纯函数；提交后 del_flag 行为可用 mock Session）

• Step 2: 实现 CRUD

  • list_drafts, get_draft, create_draft, update_draft, soft_delete, batch_soft_delete
  • list join OaApp 取 appName、version_no；仅 owner_user_id

• Step 3: 挂路由

  • GET/POST /drafts
  • GET/PUT/DELETE /drafts/{id}
  • POST /drafts/batch-delete
  • POST /drafts/{id}/submit → start_instance + soft delete

• Step 4: pytest 通过

• Step 5: Commit feat(backend): OA instance draft CRUD and submit API.

---

Task 4: 前端 API + 路由

Files:

• Modify: web-admin/src/api/oaApproval.ts

• Modify: web-admin/src/router/modules/sqxp.ts（发起审批与待办之间插入 drafts）

• Modify: web-admin/src/types/api.d.ts（若有 OA 类型需补）

• Step 1: API 封装

• Step 2: 路由 meta.title=草稿箱, menuCode=oa:drafts

• Step 3: Commit

---

Task 5: 草稿箱页面

Files:

• Create: web-admin/src/views/oa-approval/drafts/index.vue

• Step 1: 按 Demo +「我发起的」模式做列表（筛选、表格、分页、操作列 min-width≥260、状态 Tag）

• **Step 2: 编辑打开弹窗（可内嵌复用 start 逻辑或跳转 start?draftId=）——采用 start?draftId= 减少重复

• Step 3: 提交/删除/批量删除接线

• Step 4: Commit

---

Task 6: 发起页暂存与回填

Files:

• Modify: web-admin/src/views/oa-approval/start/index.vue

• Step 1: footer 增加「暂存草稿」（取消 / 暂存 / 提交；主色仅提交）

• Step 2: route.query.draftId 加载详情并回填；保存走 PUT

• Step 3: 暂存成功提示并关弹窗

• Step 4: Commit

---

Task 7: 收尾

• Step 1: ./scripts/update-graph.sh all（或 backend+frontend）
• Step 2: 自测清单对照 spec「测试要点」
• Step 3: 确认 App.vue panelTitleBarTextRules 含「草稿箱」（若需要竖条）

---

验收

1. 发起弹窗可暂存，草稿箱可见。
2. 编辑回填 → 再保存 → 提交后出现在「我发起的」，草稿消失。
3. 他人账号看不到该草稿。
4. 暂存不产生待办任务。