更新记录

1.0.2（2026-11-10） 下载此版本

初步完善版本

平台兼容性

uni-app(3.8.7)

TroveApp

一个柔和、小众、美观的资源分享社区 —— 基于 UniApp + Vue3 的跨端客户端（H5 / APP / 微信小程序）。

TroveApp 采用 Vue3 组合式 API + Pinia + SCSS 设计令牌的现代化实现，支持明暗双主题与多平台运行。

技术栈

功能模块

内容

• 瀑布流首页（轮播 / 分类 / 标签 / 推荐流）
• 文章详情（评论、点赞、打赏、富文本渲染 mp-html）、评论发表、全文搜索
• 内容发布（编辑器、图集、草稿自动保存 800ms 防抖 + onUnload 兜底）
• 草稿箱、我的文章、我的收藏

聊天（WebSocket 实时）

• 单聊 / 群聊（消息本地回显、群未读红点 readTime 水位、禁言提示）
• 群管理：分类、创建、成员管理、入群审批、群设置
• 聊天记录（history）

消息通知

• 站内信（inbox）+ 消息宫格入口（五项一排）
• 通知偏好设置（5×3 矩阵：类别 × 渠道，三层禁用级联、乐观更新回滚）

用户

• 登录 / 注册 / 找回密码、微信扫码登录（weixinQrLogin）、扫码授权登录（scan）
• 账号切换（切号前 userStatusWithToken 探测 + uid 双校验）
• 邮箱 / 手机号换绑、第三方账号绑定、实名认证（身份证，POST 提交）
• 个人主页 / 封面背景、粉丝关注列表、举报（6 类对象）

会员与支付

• 钱包、钻石充值（6 档套餐）、VIP 开通、订单列表、余额提现
• iOS 内购（utils/iap.js + Apple Pay 页面，PayMask 防遮挡）

成长体系

• 每日签到、成就系统（AchievementPopup 弹窗）、任务中心
• 荣誉墙 / 荣誉历史、经验等级头衔（8 档，config.js 中 rankList）

其他

• 视频播放（pages/video/play.nvue）
• 扫码：站内链接识别、扫码登录协议、邀请码协议（JSON 按 type 分发）
• 应用内热更新（components/AppUpdate.vue、utils/update.js）

目录结构

TroveApp/
├── api/                 # 接口层（14 个模块，按后端 Controller 对应拆分）
│   ├── users.js         # 用户/登录/扫码/实名/举报
│   ├── contents.js      # 内容/评论/点赞
│   ├── chat.js          # 聊天 30+ 接口
│   ├── inbox.js         # 站内信 + 通知偏好
│   ├── pay.js / draft.js / achievement.js / task.js / clock.js / honor.js ...
├── pages/
│   ├── tabbar/index.vue # Tab 壳页（自定义 tabBar，支持 ?type= 初始 tab）
│   ├── tabPage/         # 四个 Tab 内嵌组件（home/category/inbox/profile，非路由页）
│   ├── article/ chat/ user/ pay/ publish/ identify/ inbox/ video/ ...
├── components/          # 业务组件（ArticleCard、CommentItem、LoginModal、AppUpdate...）
├── store/               # Pinia（user / app）
├── styles/              # variables.scss 设计令牌 + pages.scss 公共样式
├── utils/               # request / websocket / theme / config / iap / update
├── static/              # 跨端静态资源（统一放根目录）
└── manifest.json

快速开始

配置后端地址

编辑 utils/config.js：

var API_URL = 'https://your-domain.com/';   // 后端 API 地址
var appKey  = 'xxxxxxxx';                   // 管理后台创建的应用 Key
var WS_URL  = 'wss://your-domain.com/';     // WebSocket 地址

appKey 在管理后台创建应用后获得，App 首次启动通过 system/getAppInfo 拉取应用级配置（appName、注册方式、等级开关等）。

架构约定（开发必读）

1. Tab 架构：pages/tabbar/index.vue 是自定义壳页，pages/tabPage/*.vue 是 v-show 内嵌组件，不是路由页——禁止对它们 navigateTo / switchTab；切 tab 用壳页内部机制或 uni.$emit。
2. 登录态存储键：token（独立键）+ userInfo（大写 I）。读取登录态必须双键兼容，缺失任一即视为未登录。
3. 请求封装：request.js 自动注入 token；需要「指定 token 校验」的场景（切号、绑定）传 skipToken: true；响应 code == -1 触发强制登出。
4. 样式：公共样式收口 styles/pages.scss（按页面分节 .xx- 前缀），设计令牌统一改 variables.scss；$radius-round 是 999rpx（勿用 50%，宽元素会变椭圆）。
5. 主题：页面根节点绑定 themeCls，颜色一律走 SCSS 变量 / CSS 变量，不硬编码。
6. 接口对齐：api 层写完必须对照后端 @RequestParam 逐个核对参数名（Spring 参数名不匹配会静默落 defaultValue）；敏感字段（密码、token、身份证）一律 POST。
7. 图标：使用 iconfont（icon-xxx），新增图标前先确认字体库中存在。
8. 审计脚本：根目录 _audit_navbar.py 检查「自绘导航页 vs pages.json navigationStyle:custom」配置一致性（双层头部问题专项）；改动后建议跑一遍。