跨端应用
DaxPay 提供三个基于 uni-app 的跨端客户端:管理端、商户端与收银台。三端共用 unibest 4、Vue 3.4、pnpm 与 uni CLI 工作流,但支持的平台不同。
源码不在公开源码清单内,需通过授权渠道获取。源码获取方式见项目构建 - 获取源码。
平台矩阵
| 客户端 | H5 | 微信小程序 | 支付宝小程序 | 抖音小程序 | App |
|---|---|---|---|---|---|
管理端 dax-pay-app-admin | ✅ 端口 9000 | ✅ | ✅ | ✅ | ✅ Android / iOS |
商户端 dax-pay-app-merchant | ✅ 端口 9100 | ✅ | ✅ | ✅ | ✅ Android / iOS |
收银台 dax-pay-cashier | ❌ | ✅ | ✅ | ✅ | ❌ |
技术栈
| 项目 | 技术 |
|---|---|
| 基础框架 | unibest 4.4.1 · uni-app · Vue 3.4 · Vite · pnpm |
| UI 组件 | @wot-ui/ui v2,组件前缀为 wd-* |
| 样式与图标 | UnoCSS · Carbon Icons |
| 国际化 | vue-i18n |
| 管理端与商户端扩展 | z-paging · ucharts |
收银台是面向付款用户的精简小程序,不包含管理端和商户端的 H5、App、z-paging 与图表能力。
产物与工具
uni-app 非 H5 平台的输出是编译目录,不是可以直接部署的静态网站。开发命令需要保持运行,再使用对应工具打开输出目录。
| 目标平台 | 开发产物 | 构建产物 | 使用工具 |
|---|---|---|---|
| H5 | 开发服务器 | dist/build/h5/ | 浏览器或静态服务器 |
| 微信小程序 | dist/dev/mp-weixin/ | dist/build/mp-weixin/ | 微信开发者工具 |
| 支付宝小程序 | dist/dev/mp-alipay/ | dist/build/mp-alipay/ | 支付宝小程序开发者工具 |
| 抖音小程序 | dist/dev/mp-toutiao/ | dist/build/mp-toutiao/ | 抖音开发者工具 |
| App | dist/dev/app/ | dist/build/app/ | HBuilderX |
环境配置
每个 uni-app 仓库使用根目录下的 env/ 目录:
# env/.env
VITE_SERVER_BASEURL = 'http://127.0.0.1:9999'真机或手机开发者工具调试时,后端地址必须使用手机可访问的局域网 IP 或公网域名,不能使用 127.0.0.1。
管理端和商户端的 H5 端口分别是 9000 和 9100。小程序和 App 编译没有独立的本地开发服务器端口。
AppID 配置
管理端和商户端的 VITE_UNI_APPID 用于 App 构建,VITE_WX_APPID 用于微信小程序。配置来源是 env/.env,src/manifest.json 由构建插件生成,不要把它作为长期配置源直接修改。
小程序端运行
安装依赖
管理端和商户端:
cd dax-pay-app-admin # 或 dax-pay-app-merchant
pnpm install收银台:
cd dax-pay-cashier
pnpm install微信小程序
管理端和商户端:
pnpm run dev:mp收银台也可以使用同名命令,pnpm run dev 是其微信小程序默认别名:
pnpm run dev:mp命令启动后保持终端运行,使用微信开发者工具导入对应仓库的:
dist/dev/mp-weixin/支付宝与抖音小程序
pnpm run dev:mp-alipay
pnpm run dev:mp-toutiao分别导入:
dist/dev/mp-alipay/
dist/dev/mp-toutiao/H5
仅管理端和商户端支持 uni-app H5:
pnpm run dev:h5管理端访问 http://127.0.0.1:9000,商户端访问 http://127.0.0.1:9100。pnpm run dev 也可以启动 H5,但收银台的 pnpm run dev 默认启动微信小程序,因此文档中优先使用明确的 dev:h5 命令。
App 端运行
仅管理端和商户端支持 App:
cd dax-pay-app-admin # 或 dax-pay-app-merchant
pnpm install
pnpm run dev:app开发产物位于:
dist/dev/app/使用 HBuilderX 导入该目录,运行到 Android 模拟器、Android 真机或 iOS 基座。项目也提供按平台命令:
pnpm run dev:app-android
pnpm run dev:app-iosApp 开发不使用微信、支付宝或抖音开发者工具。Android 端需要开启 USB 调试或准备 Android 模拟器,iOS 真机和模拟器需要 macOS、Xcode 及对应的 HBuilderX 环境。
Android 热更新
如果 Android 端导入 dist/dev/app/ 后不能热更新,按 unibest App 专题将完整 uni-app 项目导入 HBuilderX 再运行。iOS 端可按标准流程导入 dist/dev/app/。
小程序端构建
管理端和商户端的构建命令一致:
cd dax-pay-app-admin # 或 dax-pay-app-merchant
pnpm install
pnpm run build:h5
pnpm run build:mp-weixin
pnpm run build:mp-alipay
pnpm run build:mp-toutiao构建后分别使用对应平台开发者工具导入 dist/build/<平台>/,再进行预览、体验或上传。
微信小程序可以在配置上传密钥后执行:
pnpm run upload:mp收银台的构建命令:
cd dax-pay-cashier
pnpm install
pnpm run build:mp-weixin
pnpm run build:mp-alipay
pnpm run build:mp-toutiao收银台也支持使用 pnpm run build 构建微信小程序。构建产物位于 dist/build/<平台>/。
App 端构建
仅管理端和商户端支持 App 构建:
cd dax-pay-app-admin # 或 dax-pay-app-merchant
pnpm run build:appApp 构建产物位于:
dist/build/app/使用 HBuilderX 导入 dist/build/app/,通过“发行 → 原生 App 云打包”或本地原生打包生成 Android / iOS 安装包。pnpm run build:app 只负责生成 App 项目文件,不会自动生成安装包。
如果项目使用本地原生插件,构建前确认仓库根目录的 nativeplugins/ 与 env/.env 中的 VITE_COPY_NATIVE_RES_ENABLE=true 已配置,并按 App 原生插件要求制作自定义运行基座。
应用说明
管理端 dax-pay-app-admin
面向平台运营方,对应 Web 运营端,用于管理商户、门店、用户、应用和支付配置。页面包含工作台、应用、我的等主入口,并按业务域拆分商户、支付、系统等子包。
商户端 dax-pay-app-merchant
面向商户自助管理,用于查看交易、管理商户资料、应用、门店、通道路由和支付配置。数据按商户范围隔离,页面包含工作台、应用、我的等主入口。
收银台 dax-pay-cashier
面向最终付款用户,用于承接支付链接并完成扫码、H5、钱包等收银流程。收银台无 H5 和 App 目标,也没有管理类客户端的 tabBar 与业务子包。