---
url: https://qiwuadmin.com/features/mobile.md
description: 栖梧的员工移动端基于 uni-app，同时支持微信小程序和安卓、iOS App：登录、工作台、审批与动态表单、消息、实时推送、App 更新和后台需要的配置。
---

# 移动端

栖梧带有一个给员工用的手机端，下面简称**移动端**。员工可以在手机上登录、查看待办、处理审批、看消息和公告。

移动端用 **uni-app** 开发。uni-app 是一个用 Vue 写页面的框架，同一套代码可以编译成微信小程序和手机 App。所以移动端只有一套代码，同时支持**微信小程序**、**安卓 App** 和 **iOS App**。它连接的服务端和电脑端是同一个：账号、权限、流程和消息都是同一份数据。

移动端只面向员工。面向会员或客户的手机端不在模板里。

移动端是**可选**的：代码都在仓库根目录的 `mobile/` 里，用不到时可以整个删掉，见[只要电脑端](#只要电脑端)。

::: info 现在的状态
已经实现：登录、工作台、审批（包括动态表单）、消息、我的、中英文、浅色和深色主题、实时推送、新待办微信提醒、App 更新检查，以及代码生成器生成的移动端页面。

自动测试包括：单元测试、45 个在 H5 页面上运行的端到端测试，以及小程序的构建和包体积检查。

还在进行的：在真机上逐项核对、用真实的 AppID 和模板发送微信订阅消息、上架应用商店、发布小程序。在 Windows 上打包 App 和上传小程序也还没有验证。正式上线前，请按[移动端开发 · 发布清单](/core/mobile#发布清单)逐项核对。
:::

## 支持的平台

| 平台 | 用途 | 和其他平台不同的地方 |
| --- | --- | --- |
| 微信小程序 | 正式发布 | 可以用微信登录；可以开启"新待办微信提醒"；外观只能跟随系统；附件从微信聊天记录里选 |
| 安卓 App、iOS App | 正式发布 | 每次启动检查一次更新；可以在"我的"页切换外观；附件只能选图片（拍照或从相册选） |
| H5 | 只用于开发调试和自动测试，不作为正式发布的目标 | 不检查更新；附件用浏览器的文件选择框 |

**H5** 指在浏览器里打开的网页版。开发时可以先在电脑浏览器里调试，再到微信开发者工具和手机上看效果，见[移动端开发 · 在浏览器里调试（H5）](/core/mobile#在浏览器里调试-h5)。

## 登录

![移动端登录页](/screenshots/zh-mobile-login.webp)

打开移动端先进入登录页。这台手机上已经登录过、登录还没过期时，直接进入工作台。

* **两种方式**：**密码登录**和**短信登录**，规则和电脑端相同，见[登录与账号 · 登录方式](/features/login#登录方式)；
* **验证码**：和电脑端一样，按参数 `captcha.mode` 弹出滑块或图形验证码，关闭时不弹，见[登录与账号 · 验证码](/features/login#验证码)。点"获取验证码"发短信之前，也按这个参数先做验证；发出后按钮显示"N 秒后重发"的倒计时；
* **记住用户名**：只在这台手机上记住用户名，从不保存密码；
* **保持登录**：移动端的登录总是"保持登录"，从登录起最长 7 天，到期后要重新登录。在 **系统监控 → 在线用户** 里，这类登录的客户端显示为"手机"；
* **必须先改密码**：账号还在用初始密码或者密码已经过期时，登录后只能停在**修改密码**页。页面上会说明原因，也可以**退出登录**。改完密码才能进入工作台；
* **没有注册和找回密码**：需要时到电脑端操作；
* **页脚**：左边切换语言，右边是版本号、**隐私政策**和**用户协议**。

::: warning 发布前换掉隐私政策和用户协议
登录页的**隐私政策**和**用户协议**目前打开的是"关于"页。正式发布前，要换成你自己网站上的隐私政策和用户协议页面。应用商店和小程序审核都会检查。
:::

### 在微信小程序里登录

这一项只在微信小程序里有，**默认关闭**：

1. 打开小程序时，如果还没有登录，先在后台自动用微信登录，用户不用操作；
2. 这个微信已经绑定了员工账号时，直接进入工作台；
3. 还没有绑定时，进入**绑定微信**页。用账号密码或短信验证码登录一次（按钮是**绑定并登录**），就完成了绑定，以后打开就能直接进入。

退出登录后，这次打开期间不会再自动用微信登录，要等下次打开小程序。启用步骤和绑定规则见[登录与账号 · 微信小程序登录](/features/login#微信小程序登录)。

## 底部的四个页签

登录后，屏幕底部有四个页签：**工作台**、**审批**、**消息**、**我的**。

"审批"和"消息"上有角标，分别显示待办数和未读消息数，超过 99 时显示"99+"。工作台上的数字和这两个角标是同一份数据。每次切换页签、从别的页面返回、应用回到前台时，都会重新读取一次。

## 工作台

![移动端工作台](/screenshots/zh-mobile-home.webp)

* **顶部**：问候"你好，显示名"，下面是"部门 · 角色"；
* **三个数字**：**待办**、**审批中**（我发起的、还没结束的流程）、**未读消息**。点前两个进入"审批"页签，点未读消息进入"消息"页签；
* **常用功能**：**发起审批**、**请假**、**公告**。**请假**只对有请假"新增"权限（`biz.leave.create`）的人显示；
* **待我审批**：最新的 3 条待办，点一条进入审批详情，点 **全部** 进入"审批"页签。没有待办时显示"待办都处理完了"。

常用功能里的入口可以按项目需要增加，见[移动端开发 · 加一个入口](/core/mobile#加一个入口)。

## 审批

![移动端审批列表](/screenshots/zh-mobile-approval.webp)

手机上的审批和电脑端用的是同一套流程：在电脑端设计、发布的流程，员工可以在手机上发起、处理和查看。审批动作的含义见[工作流 · 审批动作](/features/workflow#审批动作)。

### 审批列表

"审批"页签顶部可以切换四个列表：**待办**、**已办**、**我发起的**、**抄送我的**。

* 只列出和自己有关的记录；
* 下拉刷新，滑到底部自动加载下一页；
* 除了这四个列表，没有其他筛选条件；
* 待办为空时显示"待办都处理完了"和 **查看已办** 按钮。

### 审批详情

点一条记录进入**审批详情**：

![移动端审批详情](/screenshots/zh-mobile-approval-detail.webp)

* **顶部**：流程名、流程状态、"某某 发起于 某时间"。轮到你处理时，还显示"待你处理 · 节点名"；
* **表单**：申请的内容。动态表单直接显示在这里，见[手机上的动态表单](#手机上的动态表单)；
* **审批记录**：每一步谁在什么时候做了什么。

手机上不显示流程进度（没有进度树，也没有流程图）。能打开详情的人和电脑端一样：发起人、办理人、抄送人，以及有权限的管理员，其他人打不开。打开一条未读的抄送时，这条抄送会自动标为已读。

### 审批操作

轮到你审批时，底部直接显示 **通过** 和 **驳回**，其他操作在 **更多** 里：

* **退回**、**转办**、**委派**、**加签**（分**前加签**和**后加签**）、**抄送**、**评论**；
* 按情况还会出现：**减签**、**撤回**、**催办**、**重新提交**、**撤销**；
* 别人委派给你的任务、或者加签给你的任务，只能通过、抄送和评论。

几条规则：

* **退回**时，从已经经过的节点里选一个，最后一个选项是发起人；
* 节点设置了必须填写意见时，通过和驳回都要填意见。意见最多 1000 字；
* **催办**每小时只能一次，太频繁时提示"每小时只能催办一次，请稍后再试"；
* 提交期间按钮显示加载状态，不能重复点击。

### 发起审批

在 **工作台 → 发起审批** 里，列出你可以发起的流程，按"流程分类"字典分组。

* **用动态表单的流程**：有表单的，进入表单页填写后发起；没有表单的，在底部弹出的面板里发起。流程里有"发起人自选"的节点时，要给每个这样的节点至少选一个人（审批人或抄送人）；
* **用业务表单的流程**：要有专门的手机页面才能在手机上发起和查看。模板只为**请假**做了手机页面。其他业务表单的流程，发起时提示"该流程请在电脑端发起"，详情里的表单显示"请在电脑端查看"，但仍然可以通过、驳回。

动态表单和业务表单的区别见[工作流 · 两种表单](/features/workflow#两种表单)。为别的业务表单做手机页面，见[移动端开发 · 让流程在手机上发起和查看](/core/mobile#让流程在手机上发起和查看)。

### 请假

**工作台 → 请假** 打开请假单。要填写请假类型、开始时间、结束时间、请假天数（可以填半天）和请假事由，检查规则和电脑端相同。点 **提交审批** 保存并发起流程。

被退回给你时，在审批详情里点 **重新提交**：有请假"修改"权限（`biz.leave.modify`）的人会打开请假单，改完再提交；没有这个权限的人不改内容，直接重新提交。也可以点 **撤销**，结束这次申请。

### 手机上的动态表单

![手机上的动态表单](/screenshots/zh-mobile-form.webp)

动态表单（在表单设计器里设计、绑定到流程的表单）也能在手机上填写和查看：

* 表单设计器里能用的组件，手机上都能显示，包括业务组件（人员选择、部门选择、字典选择、附件、地区选择）和计算组件（天数（自动计算）、明细表），见[表单设计器 · 可以用的组件](/features/formkit#可以用的组件)；
* 字段按你所在节点的权限显示：隐藏的看不到，"可编辑"的可以改，其余只读。通过和重新提交时只提交"可编辑"的字段；
* 自动计算的值（天数、明细合计）只用来显示，以服务端重新计算的结果为准；
* 少数组件在手机上没法填写，这些字段只读，并提示"请在电脑端填写"。整张表单显示不出来时，提示"该表单无法在手机上显示，请在电脑端发起"。

哪些组件只读、哪些校验规则手机上不检查，见[工作流 · 手机上的动态表单](/features/workflow#手机上的动态表单)。

### 附件

* 一个一个地上传到服务端。大小上限按表单里这个字段的设置，没有设置时跟随参数 `storage.max_size_mb`。上传之前，先在手机上检查个数和大小；
* 选文件的方式因平台而不同：微信小程序从微信聊天记录里选，App 只能选图片（拍照或从相册选），H5 用浏览器的文件选择框；
* 已经上传的附件只显示文件名和大小，在手机上不能打开或下载，要到电脑端查看。

### 选人和选部门

转办、委派、加签、抄送和发起时选人，都从底部弹出一个选人面板：列出所有启用的用户，可以按姓名搜索，多选时确定按钮显示已选人数。选部门也是底部弹出的面板，任何一级部门都可以选。

## 消息

![移动端消息页](/screenshots/zh-mobile-messages.webp)

"消息"页签：

* **顶部**：显示有几条未读，比如"3 条未读"；
* **公告**：最上面一个入口，显示最新一条公告的标题和未读角标。点进去是公告列表，和电脑端顶栏的铃铛一样，只列最新的 5 条；
* **站内信**：下面是发给我的站内信，每条前面的图标区分"业务"和"系统"两类。可以下拉刷新、滑到底部加载更多，也可以 **全部已读**；
* 点一条站内信进入**消息详情**，同时标为已读。站内信是纯文本，保留换行；公告详情显示保存时已经清洗过的富文本。

公告在电脑端的 **系统管理 → 消息中心 → 通知公告** 里发布，站内信由系统的各项功能发出，见[消息中心](/features/messaging)。

## 我的

"我的"页签：

![移动端的"我的"页](/screenshots/zh-mobile-mine.webp)

* **顶部**：头像、显示名、用户名，以及部门和角色。点它进入**个人资料**；
* **个人资料**：可以修改显示名、邮箱、性别，用户名、手机号、部门、角色、岗位只能看。手机号要在电脑端修改。点**头像**可以拍照或从相册选一张，服务端会把它裁成 256×256；
* **修改密码**：填写旧密码、新密码和确认新密码，规则按服务端的密码策略。改完后，你在其他设备和浏览器上的登录立即失效，当前这台手机保持登录；微信小程序的绑定也会解除，下次打开小程序要重新绑定；
* **新待办微信提醒**：只在微信小程序里，并且满足条件时显示，见[新待办微信提醒](#新待办微信提醒)；
* **语言**、**外观**（只有 App 和 H5 有），见[主题与语言](#主题与语言)；
* **关于**：显示标志、应用名、版本号、简介和许可证（MIT）；
* **退出登录**：确认"确定退出当前账号吗？"后退出；
* 最下面一行显示"栖梧 · 版本 x.y.z"。

## 实时推送

移动端在前台时，和服务端保持一条实时连接，规则和电脑端相同：

* 有新的审批待办或新的站内信时，角标和工作台上的数字立即更新；
* 被管理员强制下线时，回到登录页，提示"你已被管理员强制下线，请重新登录"；
* 应用回到前台、打开底部任一页签时连接，并补读一次待办数和未读数；切到后台、登录、退出登录时断开；
* 连不上时（比如小程序没有配置 socket 合法域名），底部页签显示期间每 60 秒查询一次，角标最迟 60 秒内更新。

::: warning 没有系统级的离线推送
应用切到后台就断开连接，所以 App 关闭或在后台时，手机通知栏不会收到提醒。这时还能收到的新待办提醒有：邮件（预置了新待办的邮件模板，需要配置好邮件账号、员工填了邮箱）、短信（要自己加新待办的短信模板），以及微信小程序的[新待办微信提醒](#新待办微信提醒)，见[消息中心 · 哪些事件会发消息](/features/messaging#哪些事件会发消息)。
:::

连接的细节见[实时推送 · 移动端](/features/realtime#移动端)。

## 新待办微信提醒

在微信小程序里，有新的审批待办时，可以用微信的**一次性订阅消息**提醒审批人：提醒出现在微信的"服务通知"里，点开进入这条审批的详情。这项功能**默认关闭**。

* 员工要自己同意：在小程序 **我的** 页点 **新待办微信提醒**，在微信的弹窗里允许。允许后提示"已开启，下一条新待办将通过微信提醒你"，否则提示"未开启微信提醒"；
* **点一次只对应以后的一条提醒**，想继续收就再点；
* 这一项只在微信小程序里显示，并且要满足：已经绑定微信、管理员打开了开关、配置了订阅模板。

启用步骤和模板配置见[消息中心 · 微信订阅消息](/features/messaging#微信订阅消息)。

## App 更新

只有安卓和 iOS 的 App 在每次启动时检查一次有没有新版本。H5 不检查；微信小程序由微信自己更新。

* 有新版本时弹出"发现新版本 1.2.0"这样的提示，正文是更新说明，按钮是 **立即更新** 和 **稍后**。强制更新时没有 **稍后**；
* **资源热更新包**（只更新页面和脚本）：在 App 里下载，显示"正在下载更新…"，装好后自动重启；
* **整包**（完整的安装包）：安卓用浏览器打开下载地址（安装包或应用市场的链接），iOS 打开 App Store；
* 强制更新时，下载或安装失败、关掉提示、从浏览器或商店返回后，提示会再次弹出；
* 检查失败（比如没有网络）时什么都不提示，App 照常使用。

新版本在 **系统管理 → App 版本** 里登记，见[系统管理 · App 版本](/features/system#app-版本)。

## 主题与语言

![深色主题下的工作台](/screenshots/zh-mobile-dark.webp)

**主题**：默认跟随手机系统的浅色或深色。App 和 H5 可以在 **我的 → 外观** 里选择**跟随系统**、**浅色**或**深色**，立即生效，只保存在这台手机上。微信小程序只能跟随系统，没有"外观"这一项。

**语言**：支持简体中文和 English。

* 第一次打开时：手机系统语言是英文就用 English，否则用简体中文。以后按你上次的选择；
* 切换后，界面文字、组件里的文字和系统弹窗（比如确认框、选择器）一起切换；
* 在 **我的 → 语言** 里切换，还会保存到你的账号，服务端发给你的消息和通知也随之改变；在登录页切换只改这台手机。

更多说明见[国际化](/features/i18n)。

## 在后台需要配置什么

移动端的大部分功能开箱即用。下面这些要管理员在电脑端的后台配置，或者需要特定的权限：

| 想要的效果 | 在哪里配置 | 说明 |
| --- | --- | --- |
| 短信登录 | **系统管理 → 消息中心 → 短信渠道**、**短信模板** | 和电脑端共用，见[登录与账号 · 短信登录](/features/login#短信登录) |
| 选择验证码类型 | **系统管理 → 参数设置**：`captcha.mode` | 和电脑端共用 |
| 微信小程序登录 | 服务端的 `WX_MP_APPID`、`WX_MP_SECRET`，加上 **系统管理 → 参数设置**：`auth.wx_mp.enabled` | 只有超级管理员能改这个开关，见[登录与账号 · 微信小程序登录](/features/login#微信小程序登录) |
| 新待办微信提醒 | **系统管理 → 参数设置**：`notify.wx_subscribe.enabled`、`notify.wx_subscribe.templates` | 先要能用微信小程序登录，见[消息中心 · 微信订阅消息](/features/messaging#微信订阅消息) |
| App 更新提示 | **系统管理 → App 版本**，加上 **系统管理 → 参数设置**：`app.update.enabled`、`app.update.review_version` | 见[系统管理 · App 版本](/features/system#app-版本) |
| 手机上能发起哪些流程 | **流程审批 → 流程管理 → 模型管理** | 已发布、你可以发起的流程都会列出来，见[工作流](/features/workflow) |
| 工作台上的"请假" | **系统管理 → 角色管理**：请假的"新增"权限（`biz.leave.create`） | 没有这个权限的人看不到这个入口 |
| 公告 | **系统管理 → 消息中心 → 通知公告** | 见[消息中心](/features/messaging) |
| 附件大小上限 | **系统管理 → 参数设置**：`storage.max_size_mb` | 和电脑端共用。移动端每次启动读取一次，改了之后重新打开才生效 |
| 强制某个手机下线 | **系统监控 → 在线用户** | 客户端显示为"手机"的那一行 |
| 为自己的业务模块生成手机页面 | **系统工具 → 代码生成** 的"生成信息"页签：**移动端页面** | 见[代码生成器 · 移动端页面](/features/codegen#移动端页面) |

::: tip 后台之外还要准备的
小程序和 App 要连上服务端，还需要：已备案的 HTTPS 域名、在微信公众平台登记服务器域名、构建时写好服务端的地址。这些是开发和发布时的工作，见[移动端开发 · 发布清单](/core/mobile#发布清单)。

另外，代码生成器的 9 个示例页已经登记在移动端里，没有入口，但会随小程序和 App 一起上线，第一次发布前要去掉，见[代码生成器 · 移动端页面](/features/codegen#移动端页面)。
:::

## 只要电脑端

不需要移动端时，删掉整个 `mobile/` 目录就够了。根目录的脚本和检查里还有几处提到它，目录不存在时会自动跳过，想清理干净可以一并删掉。根目录的依赖锁定文件不用改，因为移动端本来就不在里面。删掉之后，代码生成器也不再生成移动端页面。具体步骤见[移动端开发 · 只要电脑端：删除移动端](/core/mobile#只要电脑端-删除移动端)。

## 开发指南

* [移动端开发](/core/mobile)：在本机运行和调试、构建、发布清单、删除移动端
* [在代码中推送实时消息 · 移动端](/core/realtime#移动端-uni-app)：服务端怎么推送，移动端怎么接收
* 相关功能：[登录与账号](/features/login)、[工作流](/features/workflow)、[消息中心](/features/messaging)、[实时推送](/features/realtime)、[代码生成器](/features/codegen)、[系统管理](/features/system)