2026-07-15-oa-task-list-columns-design.md 6.4 KB

OA 办理中心列表:整单进度字段展示

项 内容
状态 已定稿;实现已落地(见 docs/superpowers/plans/2026-07-15-oa-task-list-columns.md)
日期 2026-07-15
范围 待处理 / 已处理 / 我发起的 / 抄送我的 四列表;后端 list_tasks 摘要 enrichment;前端四页独立实现
权威对齐 钉钉办理侧:列表可见申请人、申请时间、流程名、当前节点与审批人、流程状态
关联 前端布局仍服从 docs/web-admin-ui-spec-fresh-mint.md;打回终态与「复制并重新发起」语义见 2026-07-15-oa-return-copy-new-instance-design.md

1. 背景

当前四列表由 RuntimeList.vue 共用,列过少:

  • 非「我发起」:节点名、任务状态、时间
  • 「我发起」:标题、实例状态、时间

缺少申请人、流程名称、整单当前节点/审批人与流程状态,不便扫一眼判断进度。另:共用组件不利于后续按列表差异化演进。


2. 目标与非目标

目标

  • 四列表均展示整单此刻进度摘要(进行中:当前节点 + 正在等谁批;已结束:终态)。
  • 展示申请人、申请时间、流程名称、流程状态。
  • 前端 SHALL 四页各自独立实现,不得再共用 RuntimeList(或等价通用列表组件)作为唯一实现。
  • 后端仍可共用 enrichment,一次返回多字段,各页按需取用。

非目标

  • 本期不做筛选、分页改版、批量操作。
  • 不在列表展示完整审批进度时间轴(仍进详情)。
  • 不强制本期四页列配置必须永久一致(仅本期起点一致,后续可分叉)。

3. 进度语义(SHALL)

四个列表统一按实例维度投影「当前进度」,而非「本行任务处理时快照」:

实例状态 当前节点 当前审批人
running 当前仍为 pending 且 task_type=approval 的节点名;多节点用顿号 、 拼接(按节点出现去重) 上述 pending 审批任务处理人昵称,顿号拼接;无昵称则回落 userId
completed / rejected / returned / cancelled 终态文案(见下) -

终态文案(当前节点列,建议)

status 文案
completed 已完成
rejected 已拒绝
returned 已打回
cancelled 已撤销

流程状态列:展示实例 status(Tag),与上表映射一致;进行中为 running →「进行中」。

SHALL NOT:在「已处理」列表用「本人当时处理的节点/人」替代整单此刻进度。


4. 列表字段(本期统一起点)

列 字段(建议) 说明
流程名称 appName 审批应用名;空则回落实例 title
申请人 initiatorUserName 发起人昵称
申请时间 applyTime 实例创建时间 YYYY-MM-DD HH:mm:ss
当前节点 currentNodeName §3
当前审批人 currentApproverNames §3;已结束为 -
流程状态 instanceStatus 实例状态 Tag
操作 — 查看;「我发起的」在终态另保留「复制并重新发起」

原行内任务级 status / nodeName / 任务 createTime 不作为本期主列;接口可继续返回供调试或后续分叉使用。


5. 后端(list_tasks enrichment)

5.1 行为

对 pending / done / cc / mine:

  1. 仍按现有规则查出任务行或「我发起」实例行。
  2. 批量加载关联 OaInstance、OaApp、SysUser、以及这些实例上 status=pending + task_type=approval 的 OaTask。
  3. 为每一行写入统一摘要字段(任务行同时带 instanceId)。

5.2 响应增量字段(SHALL)

每行至少包含:

appName
initiatorUserId
initiatorUserName
applyTime
instanceStatus
currentNodeName
currentApproverNames

约定:

  • applyTime = 实例 create_time(非任务创建时间)。
  • instanceStatus = 实例 status。
  • mine 行仍以实例为主键 id;其余以任务为主键,跳转详情用 instanceId。
  • 批量查询,禁止按行 N+1 查用户/实例/pending 任务。

5.3 兼容

保留既有任务/实例字段(如 nodeName、status、title、createTime),避免破坏未改前端;新列以前缀语义清晰的 instanceStatus / applyTime 区分任务级 status / createTime。


6. 前端(四页独立)

6.1 页面

菜单 路径 说明
待处理 views/oa-approval/pending/index.vue 自包含表格 + fetchOaTasks('pending')
已处理 views/oa-approval/done/index.vue 同上 done
我发起的 views/oa-approval/mine/index.vue 同上 mine;终态「复制并重新发起」
抄送我的 views/oa-approval/cc/index.vue 同上 cc

SHALL:删除(或彻底不再引用)_placeholder/RuntimeList.vue 作为办理中心实现。
SHALL NOT:再抽一层「通用 Runtime 列表」组件承载四页业务(可抽纯工具函数如状态文案映射,但表格与列定义须在各页内)。

6.2 UI 约定

  • 对齐 Fresh Mint 列表模板(panel-top 标题竖条、list-table + stripe、操作列 fixed="right" min-width ≥ 260)。
  • 流程状态用 <el-tag> 语义色(进行中 warning、完成 success、拒绝/打回/撤销 danger)。
  • 空值展示 -。
  • keepAlive 下 onActivated 重新拉取。

6.3 后续分叉

允许各页增删列、加筛选;后端字段可多用少改,前端按页演进。


7. 验收

  • 四列表均可见:流程名称、申请人、申请时间、当前节点、当前审批人、流程状态。
  • 进行中单据:当前节点/审批人与详情进度中 pending 审批人一致。
  • 已结束单据:当前节点为终态文案,当前审批人为 -,流程状态为对应终态。
  • 「已处理」进度列展示整单此刻而非本人任务快照。
  • 四页无共用 RuntimeList;「我发起」终态仍可复制并重新发起。
  • list_tasks 无 N+1 批量加载。

8. 实现备注

  • 测试:为 list_tasks enrichment 增加单测(running 含 current*;终态 currentNodeName/审批人)。
  • 图谱:改 backend / web-admin 后执行 ./scripts/update-graph.sh 对应侧。