移动端开发文档
简介
zhontai-ui-admin-app 是基于 Vue 3 + Vitesse UniApp + UniApp + Vite + wot-ui + alova + Pinia + UnoCSS 开发的后台管理系统移动端应用。
本项目采用现代化的前端技术栈，支持多端发布（H5、小程序、App等），提供完整的后台管理功能。
购买 App 源码，可直接下载源码。如果您已购买 App 源码，
关注服务号
微信搜索服务号 「中台小雪」，关注后点击底部菜单【H5演示】或【小程序】即可直接体验。
扫码体验
微信小程序
浏览器H5
技术栈
| 技术 | 版本 | 说明 |
|---|---|---|
| Vue | ^3.4.38 | 渐进式 JavaScript 框架 |
| Vite | ^5.2.8 | 下一代前端构建工具 |
| UniApp | 3.0.0-4080520251106001 | 跨平台开发框架 |
| wot-ui | ^2.2.0 | 移动端 UI 组件库 |
| alova | 3.3.4 | 轻量级请求策略库 |
| Pinia | ^2.3.1 | Vue 状态管理库 |
| UnoCSS | 66.0.0 | 原子化 CSS 引擎 |
| TypeScript | ~5.5.4 | JavaScript 超集 |
| vue-i18n | 9.1.9 | 国际化方案 |
特性
- 📱 多端兼容: 支持 H5、微信小程序、支付宝小程序、App 等多端运行
- 🎨 组件丰富: 基于 wot-ui 提供丰富的移动端组件
- 🔐 权限完善: 完整的登录鉴权和路由守卫机制
- 🌍 国际化: 支持多语言切换
- 📦 自动导入: API 和组件自动导入，提升开发效率
- 🎯 类型安全: 完整的 TypeScript 类型定义
- 🚀 构建优化: 基于 Vite 和 bundle-optimizer 的构建优化
主要功能介绍
- 动态菜单工作台（递归树构建 + 折叠面板九宫格）
- 消息中心（分页查询 + 多维筛选 + 未读标识 + 消息详情 + 未读消息数）
- 个人中心体系（我的主页 / 个人设置 / 个人资料 / 密码修改）
- 套餐管理完整 CRUD（分页列表 + 筛选 + 表单校验）
- 多项目 Swagger 接口自动生成（AdminApis / DevApis / DemoApis）
- 动态链式 API 调用（
AdminApis.auth.login()） - 无感刷新 Token（智能阈值判断 + 防死循环 + 失败降级）
- 递归查询组件实现（消息分类）
- 双模式导航栏封装（主界面 Navbar / 弹出界面 PopupNavbar）
- 暗黑模式完整支持
- 国际化 (i18n) 中英文切换
- 按钮级权限控制（
useAuth权限控制 Hook） - 动态路由生成 + 路由守卫