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

**日期：** 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` 流程预览加载：`加载中…`

## 验收

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