移动审批轻页
移动审批轻页是面向手机浏览器的独立 SPA,覆盖「查看待办 → 审批 → 发起申请」的高频移动场景。它与管理后台共享登录态,无需重复登录。
入口
| 入口 | 说明 |
|---|---|
/approval.html | 独立 SPA 入口(Vite 多入口构建,与后台 index.html 并存) |
| 后台头像菜单 → 移动审批 | 从管理后台快捷打开轻页 |
/approval.html#/login | 未登录时的登录页;登录态与后台共享 |
路由使用 HashRouter(多入口零 rewrite):
| 路由 | 页面 |
|---|---|
#/ | 任务列表(TabBar 主页) |
#/detail/:instanceId、#/detail/:instanceId/:taskId | 审批 / 实例详情 |
#/launch | 发起申请(流程选择) |
#/launch/:definitionId | 发起表单填写 |
#/login | 登录 |
底部标签栏
主页采用主流 App 底部 TabBar(图标 + 文字 + 角标),中间为凸起「发起」按钮:
| 标签 | 内容 |
|---|---|
| 待办 | 待我处理的审批任务,显示待办数角标 |
| 已办 | 我已处理的任务,卡片展示我的处理结果 |
| 我的申请 | 我发起的实例 |
| 抄送我 | 抄送任务,未读标记,支持一键全部已读 |
待办处理
| 能力 | 说明 |
|---|---|
| 搜索 | 按标题搜索列表 |
| 下拉刷新 | 手势刷新列表 |
| 极速同意 | 列表卡片直接同意,无需进入详情 |
| 批量同意 | 勾选 / 全选多条待办批量通过;需要签名等不可批量的任务自动置灰 |
| 连续审批 | 详情提交后自动进入下一条待办,无需返回列表 |
审批详情
详情页包含发起人头像块、审批进度提示和底部操作抽屉:
| 能力 | 说明 |
|---|---|
| 表单展示 | 按当前节点字段权限过滤 hidden 字段;edit 字段可直接修改并随「同意」提交(仅表单库表单);自定义业务表单 / 业务系统主导流程以只读模式渲染业务查看组件 |
| 同意 / 驳回 / 转办 | 底部操作抽屉承载动作、意见与附件 |
| 手写签名 | 节点要求签名时,同意前必须签名 |
| 快捷短语 | 快速填入常用审批意见 |
| 沟通评论 | 查看和发送实例评论 |
| 发起人操作 | 发起人可撤回运行中的申请、对待办催办 |
发起申请
- 流程选择页支持搜索和「最近使用」快捷入口。
- 表单填写复用与桌面端同源的表单渲染规则(显隐、条件必填)。
- 发起时的「自选审批人」与审批中的「转办」均内置移动端人员选择器(搜索 + 头像多选底部抽屉)。
- 绑定自定义业务表单(
custom)的流程在移动端不支持发起(引导回桌面端);审批与详情可只读查看业务表单内容。
体验细节
- 页面切换带过渡动画,移动优先样式。
- 登录态与后台共享;token 失效时跳转
#/login。 - 桌面端完整能力(委派、加签、减签、退回、协办等)见审批、任务与协作。