移动端启动

移动端工程 mdp-app 是 MDP 的移动端统一门户（与工作台同一用户体系的小程序端），基于 unibest（uniapp + Vue3 + TypeScript + Vite）构建，当前面向微信小程序（uniapp 脚本同时保留了支付宝/百度/抖音等其他小程序与 App、H5 的编译能力）。

仓库地址：https://gitee.com/henhen6/mdp-app
UI 组件库：wot-ui；请求库：alova；状态管理：Pinia

一、功能清单

模块	功能	是否需要登录
首页	平台介绍	否
工作台	我的应用宫格展示	是
消息中心	站内通知分类查看（待办/公告/预警）、富文本渲染、已读标记	是
我的	个人信息展示、资料编辑（姓名/头像/手机号）、退出登录	是

登录走微信小程序登录：小程序端 wx.login 拿 code，后端（boot-server）用 wx.miniapp.appid/secret 换 openid 完成登录，与 Web 端共享同一套 sa-token 会话体系。

二、环境要求

项	要求	依据
Node	≥ 20	mdp-app README
pnpm	≥ 9（`preinstall` 挂了 `only-allow pnpm`）	mdp-app `package.json`
微信开发者工具	最新稳定版	小程序运行/调试必需
后端	本地启动 boot-server（单体版即可），见单体版启动	接口来源

三、安装与配置

git clone https://gitee.com/henhen6/mdp-app.git
cd mdp-app
pnpm install

配置文件位于 env/.env：

配置项	说明
`VITE_SERVER_BASEURL`	后端地址，本地开发填 boot-server 地址，如 `http://localhost:23455`
`VITE_WX_APPID`	微信小程序 AppID（需与后端 `wx.miniapp.appid` 一致）
`VITE_UNI_APPID`	uni-app 应用标识（DCloud 后台申请）

后端需同步配置（mdp 仓库 md-server/boot-server/src/main/resources/application.yml）：

wx:
  miniapp:
    appid: 小程序AppID        # 占位符，替换为实际值
    secret: 小程序AppSecret   # 占位符，替换为实际值

四、启动与调试

# 微信小程序（开发）
pnpm dev:mp

# 其他模式
pnpm dev:mp:test     # test 环境配置
pnpm dev:mp:prod     # production 环境配置

启动后用微信开发者工具导入 dist/dev/mp-weixin 目录预览调试。

本地联调两个坑

微信开发者工具 → 详情 → 本地设置 → 勾选「不校验合法域名…」，否则小程序会拦截 http://localhost 请求；
修改 pages.config.ts、src/tabbar/config.ts、env/.env 后需要重启 pnpm dev:mp 才生效。

五、打包发布

pnpm build:mp          # 微信小程序，产物在 dist/build/mp-weixin
pnpm upload:mp         # 调用脚本上传微信后台（scripts/upload-weixin.js）

其他平台（按需）：pnpm build:h5、pnpm build:app、pnpm build:mp-alipay 等，完整脚本见仓库 package.json。

六、项目结构

src/
├── api/            # 接口层（login/notice/app/profile）
├── pages/          # 页面（index 首页、workbench 工作台、message 消息、me 我的、auth 登录）
├── store/          # Pinia（token、user）
├── http/           # 请求封装（拦截器、错误处理、401 刷新队列）
├── router/         # 路由拦截（登录黑名单策略）
├── hooks/          # 组合式函数（useRequireLogin 冷启动登录校验）
├── tabbar/         # 自定义 tabbar（首页/工作台/消息/我的）
└── static/         # 静态资源

七、常用命令

pnpm test:run       # 单元测试（vitest）
pnpm type-check     # 类型检查（vue-tsc）
pnpm lint           # 代码规范检查（pnpm lint:fix 自动修复）