开源地址https://gitee.com/tuzhi-open/tuzhi-mobile-open凸知Tuzhi是一套完整的知识付费解决方案支持私有化部署覆盖课程售卖、直播授课、圈子社区、考试测评、分销营销、实物商品等完整业务场景提供管理后台、移动端H5 / 微信小程序、PC 学员端等多端入口帮助个人 IP、教培机构与品牌商家搭建自有卖课平台。凸知移动端是一款基于 uni-appVue 2 TDesign 开发的知识付费移动端前端支持H5 / 微信小程序多端编译不支持 App 打包。覆盖课程点播、直播、专栏、圈子社区、订单支付前端交互、优惠券、余额红包、考试答题等完整学习场景。系统演示端演示地址账号密码后台https://tuzhi.mutouweb.com/admin.phpadmin123456移动端用户https://tuzhi.mutouweb.com13222222222123456PC 端用户https://tuzhi.mutouweb.com/pc/#/13222222222123456一、功能特性终端覆盖电脑端 / 微信公众号H5/ 微信小程序多端学习课程内容图文 / 视频 / 音频 / 专栏售卖支持试看试听、课件资料与内容保护互动教学练习 / 考试测评 / 题库 / 试卷库 / 证书 / 表单 / 圈子社区直播能力直播授课 / 伪直播 / 回放 / 直播带货 / 送礼物 / 发红包营销增长分销推广 / 优惠券 / 每日签到 / 积分商城 / 付费会员卡 / 组合商品 / 卡密兑换实物商品商品管理 / 多规格 SKU / 限购设置 / 售后退换交易支付购物车 / 订单管理 / 余额支付 / 微信支付 / 支付宝支付用户数据用户管理 / 订阅记录 / 学习分析 / 交易分析 / 订单管理系统安全页面 DIY 装修 / 云存储 / 短信与消息推送 / 管理员权限 / 版权保护跑马灯 / 防录屏界面预览二、系统架构凸知是一套完整的知识付费系统由四个部分组成部分技术栈说明源码开放后端服务ThinkPHP 5.0 FastAdmin MySQL接口服务承载支付、直播、分销等全部业务逻辑购买授权移动端本仓库uni-appVue 2 TDesignH5 / 微信小程序学员端不支持 App 打包开源管理后台Vue 3 Arco Design管理员 / 讲师运营后台购买授权PC 学员端Vue 3 Arco Design电脑端学员学习页面购买授权凸知终端技术结构整体调用链路移动端 / PC 学员端 / 管理后台 → 后端接口服务{code, msg, data}协议→ MySQL 数据库。本仓库仅开源移动端前端源码如需后端服务或管理后台等其余端的源码需购买商业授权获取详见「十一、使用许可」与授权价格。三、技术栈分类技术说明跨端框架uni-appVue 2.xvue-cli 工程一套代码编译 H5 / 微信小程序等多端不支持 App 打包开发语言JavaScriptVue 2 语法 Sass页面按xxx.vue js.vue css.css三文件拆分样式用 CSS 规则UI 组件库TDesigntdesign/uniapp全局主题样式小程序端内置构建适配补丁scripts/uView本地components/uview-ui列表 / 弹窗 / 表单等通用组件自研components/tz/音频 / 视频 / 媒体编辑 / 上传 / 文件预览等 45 业务组件qiun-data-charts图表可视化状态管理Vuex 3全局登录态 / 用户信息等国际化vue-i18n 8内置 zh-CN / US 多语言网络请求flyio 自封装$api$api(module.action)点分路由统一鉴权 / 错误处理 / 401 跳转音视频播放阿里云播放器 AliplayerH5本地化资源、hls.js / flv.js直播与点播支持倍速 / 弹幕 / 水印等组件微信能力jweixin-module微信登录 / 分享 JS-SDK 封装构建工具vue/cli 5 webpack由dcloudio/vue-cli-plugin-uni驱动多端编译测试Jest多端单元测试npm run test:*四、快速开始环境要求Node.js 14建议 16/18、npm# ① 安装依赖npminstall# ② H5 开发默认不启用 Mock对接真实后端如需 Mock 见「Mock 数据」npmrun dev:h5浏览器访问http://localhost:8080即可看到完整页面效果。微信小程序编译# ③ 小程序开发模式监听编译产物在 dist/dev/mp-weixinnpmrun dev:mp-weixin# ④ 小程序生产构建内置 TDesign 适配补丁产物在 dist/build/mp-weixinnpmrun build:mp-weixin用微信开发者工具「导入项目」选择对应产物目录开发选dist/dev/mp-weixin生产选dist/build/mp-weixin并在src/manifest.json中替换为自己的 appid。对接真实后端修改src/siteinfo.js中的siteroot为你的后端地址在src/common/request/api_list.js中核对接口地址与{code, msg, data}协议微信小程序构建需在src/manifest.json中替换为自己的 appid。五、构建目标命令H5npm run build:h5微信小程序npm run build:mp-weixin小程序构建内置 TDesign 适配补丁scripts/构建成功后产物在dist/build/下。⚠️ 注意当前版本不支持 App 打包仅支持 H5 与微信小程序两个平台。六、Mock 数据H5 开发模式NODE_ENVdevelopment默认关闭全部走真实后端接口开启方式将src/static/config.js的enableMock改为true显式设置优先级最高或通过uni.setStorageSync(enableMock, true)/ 环境变量MOCK_ENABLE切换覆盖 200 接口fixture 位于src/mock/data/按module/action路由镜像未覆盖的接口自动透传真实网络并输出提示Mock 数据由仓库内 mock-crawler 工具采集真实后端响应生成发布前已做敏感字段脱敏token/openid/手机号等。七、目录结构src/ ├── pages/ 页面index 主包 public/app/user/order/course 五个分包约 100 页面 │ ├── index/ 首页主包唯一页面tabBar 入口 │ ├── launch/ 启动页加载与参数透传跳转未在 pages.json 注册 │ ├── public/ 公共分包登录 / 注册 / 找回密码 / 协议 / 搜索 / 消息 / 结果页等 │ ├── app/ 业务功能分包活动 / 圈子 / 考试 / 优惠券 / 积分 / 签到 / 证书 / 分销 / 直播带货等 │ ├── user/ 用户分包个人中心 / 资产 / 余额 / 地址 / 收藏 / 学习记录 / 订阅 / 红包等 │ ├── order/ 订单分包订单列表 / 详情 / 提交 / 评价 / 售后 / 物流等 │ ├── course/ 课程分包课程详情 / 分类 / 专栏 / 小组 / 直播等 │ └── template/ 页面模板新建页面的三文件拆分参考未在 pages.json 注册 ├── components/ 组件tz/ 自研组件库、uview-ui、qiun-data-charts、视频播放器等 ├── common/ 公共层 │ ├── request/ 接口封装$api 点分路由、统一鉴权/错误处理 │ ├── utils/ 工具路由映射、支付、直播、OSS 签名等 │ ├── order/ 订单状态处理 │ └── wechat/ 微信登录/分享 SDK 封装 ├── mock/ Mock 数据H5 开发模式默认关闭开启方式见「六、Mock 数据」 ├── static/ 静态资源 ├── pages.json 页面路由与分包配置 └── manifest.json 应用配置appid 等八、开发约定页面采用xxx.vue js.vue css.css三文件拆分script src./js.vueimport ./css.css逻辑与样式分离接口调用统一走this.$api(module.action, data)登录态、401 跳转、错误提示由拦截器统一处理业务组件优先复用components/tz/自研组件库提交信息遵循 Conventional Commitsfeat:/fix:/chore:。九、相关链接名称链接使用文档https://wood-soft.feishu.cn/wiki/KKLkwOPBHiButJkTluTcoXKenjh功能列表https://wood-soft.feishu.cn/wiki/YGFYw0k8PiJDWxketgHcBNKNnxe授权价格https://www.tuzhi.ltd/index/pricing/version.html功能演示https://www.tuzhi.ltd/index/demo/index.html