发起审批页 · 加载态美化（三点弹跳）

日期： 2026-08-11
状态： 已确认
Demo： docs/oa-start-loading-demo.html（方案 B）

目标

改善 mobile-h5「发起审批」页（/#/pages/oa/start/index）打开时的加载表现：由纯文字「加载中…」改为更轻、更克制的三点弹跳动效。

方案

位置：列表区域居中（搜索栏、分组 Tab、提示文案在加载时仍可见）。
动效：三个品牌绿圆点（#16a34a）依次上下弹跳；下方文案 加载审批模板…。
实现：仅改 mobile-h5/pages/oa/start/index.vue 的 loading 分支模板与 scoped CSS；不引入新组件、不依赖 Vant Loading。
空态：仍用现有 .state 居中文案「暂无可发起的审批模板」，不改动。

非目标

不做骨架屏、全页遮罩、旋转环方案。
不改选择器弹层、按钮 :loading 等交互态。
不改加载逻辑（仍为原有 loading / detailLoading 开关与接口请求）。

范围补充（mobile-oa-h5）

同一套三点弹跳复用到填写审批 H5：

新增 mobile-oa-h5/src/oa/components/OaPulseLoading.vue
OaStart.vue 模板加载：加载审批模板…
OaFlowPreview.vue 流程预览加载：加载中…

验收

打开发起审批页（mobile-h5），列表区出现三点弹跳 +「加载审批模板…」。
打开填写审批（mobile-oa-h5），整页加载与流程预览加载均为同一套三点弹跳。
加载完成后动效消失，正常展示内容或空态。
色值与品牌绿 #16a34a 一致。