客户端
一套后端,三个客户端:Web 管理台负责配置与审批,安卓移动端随身,iOS 端跟进中。
对照
| web-console | workbench-antd | workbench-ios | |
|---|---|---|---|
| 形态 | React + Vite | antd-mobile 5 + Capacitor 6 | React Native (Expo) |
| 定位 | 管理台 | 移动工作台(定版) | iOS 工作台 |
| 写操作 | 全部 | 审批批准/驳回、申请提交 | 同安卓 |
| 产物 | 静态托管 | Android APK | iOS 应用 |
Web 管理台
左侧菜单按权限点显隐,与后端 require 的权限点一一对应。
覆盖用户与建号、租户字典、团队与组织、角色权限矩阵、审批中心、集成配置(钉钉 / 企业微信的
AppKey 与 Secret 统一在该页维护,保存即热生效)。
移动端 workbench-antd
固定页签:系统管理 / 通讯录 / 审批 / 我的;四个可选模块 TMS / WMS / OMS / CRM。
- 页签显隐 = 本机开关 ∧ 权限点,四组开关彼此独立(关掉 CRM 不该把 TMS 一起带走), 且只存在本机,退出登录不清除。
- 无权限的模块不占页签位置,「我的」里对应行显示「无权限」并可提交权限申请, 走与花名申请同一套两级审批,通过后页签自动出现。
- 审批中心是一张表、一套端点、两条审批链(申请人团队负责人 → 模块系统管理员, ADMIN 可整单批),待办数一个接口算清。
壳层上的几个关键决定
- 触感:
@capacitor/haptics按语义封装(Light / Select / Success / Error …), 提示与触感触绑在同一个入口,避免「有提示没震动」漏配;不支持时静默降级。 - 状态栏:WebView 全屏化 + 状态栏透明,页头渐变一路铺进系统栏,页头吸顶。
状态栏高度由原生上报——Chrome 在 Android 上
env(safe-area-inset-top)只反映屏幕挖孔、不含状态栏,直接用会让标题被时间/电量压住。 - 错误可恢复:错误态带「重新加载」按钮;后端重启不必杀掉 App 重开。
- 跨域:走 CapacitorHttp,网关无需为移动端单开 CORS。
构建
cd workbench-antd && ./build.sh # 单测 + tsc + vite + cap sync + gradle
iOS 端
React Native (Expo) 实现,功能与安卓端对齐,构建见仓库里的 README.ios.md。
只读边界:业务数据的新建/删除、阶段推进、用户与权限管理只在 Web 端提供; 移动端只提交审批动作与权限申请,本地只写自己的配置(服务地址、模块开关)。