项目概览
- UniApp + Vue3 + TypeScript 构建的企业级移动即时通讯客户端,内置 ColorUI 自定义导航、z-paging 等组件,H5/APP/小程序多端共用同一套代码。
- 首屏聚合聊天、通讯录、工作台、我的四大模块,基于 Pinia 管理全局状态;聊天列表支持固定置顶、未读合计和双击跳转首条未读。
- WebSocket 与 REST 双通道协同,登录后自动拉取系统配置、好友/群组待审批、免打扰列表,并在连接断开时自动重连。
- 所有页面遵循 2 空格、单引号的代码风格,TypeScript 类型补全覆盖聊天、群组、云盘、邮件、会议等业务对象。
- 静态资源通过 static/ 统一维护,运行时配置集中在 config/,避免分支重复配置;打包产物输出 unpackage/ 便于多端发布。
即时通讯能力
- 会话列表展示头像、最后一条内容与时间,免打扰会话显示禁音标识,向左滑动即可删除,支持 double-click 快速定位第一条未读消息。
- 聊天详情采用 z-paging 聊天模式倒序加载历史消息,好友会话内显示“已读/未读”回执,支持滚动时间分割、事件气泡和群成员数量统计。
- 输入面板集成文字、表情、语音、图片、文件、视频发送,H5/小程序/APP 分支各自调用 chooseFile、wx.chooseMessageFile、原生 file-picker;支持 @成员/@所有人、引用消息、语音录制。
- 消息体兼容文本、图片、文件、语音、视频、转发、事件等类型,tooltip 长按菜单提供转发、引用、多选、收藏、复制、撤回、下载、打开等操作。
- ChatNotificationManager 依据用户设置智能区分前台/后台提醒,结合免打扰列表控制提示音与震动,并可调用 uniPush 推送;MessageCacheManager 按会话控制缓存上限避免内存爆炸。
协同与工作台插件
- 工作台通过 VimPlugin.homeViewPlugins() 动态收集插件,按 sort 排序生成九宫格入口,可下拉刷新 badge;插件初始化失败会记录错误并不阻塞其它入口。
- 云盘插件提供个人/团队双入口,浏览器页面支持面包屑导航、列表/宫格切换、搜索与类型过滤、批量选择删除、容量占比显示,并可将文件夹分享成聊天消息。
- 视频会议插件在聊天工具栏露出“视频会议”,创建页支持会议命名、日期时间选择、时长模板、群/好友参与人选择并自动填充当前用户,成功后推送会议消息。
- 音视频通话插件注入“语音通话”“视频通话”按钮,APP 端开启 WebRTC,对方来电时若已在通话会发送忙线回应,结果消息以 video-result 气泡展示。
- 接龙插件只在群聊出现,支持多人顺序填写、只读项查看、展开折叠长列表,并通过消息类型 solitaire 在聊天内渲染成卡片。
- 邮件插件挂载在工作台左侧,入口显示未读数,支持收件箱/发件箱/草稿箱分栏、写信页面快捷跳转,消息监听器实时刷新未读统计。
用户与组织管理
- 登录页集成图形验证码、账号密码输入与服务器地址弹窗,支持 Base64 验证码刷取;注册页校验密码一致性并复用同一验证码接口。
- 好友模块按拼音首字母索引展示,同步展示待审批数量;新增好友弹窗可搜索账号、选择验证语并提交申请,好友验证页支持同意/拒绝并触发通知刷新。
- 群组模块可查看按首字母分组的群列表,查看待审核人数,提供创建群、邀请成员、群公告、成员转移、快捷建群等功能。
- 组织模块采用树形组件展示部门结构,支持按姓名/手机号跳转搜索结果;公共用户列表复用于群/会议等场景的人员选择。
- 我的页面展示头像、昵称,包含个人资料编辑、密码修改、收藏夹、聊天设置、系统信息、退出登录等入口;聊天设置支持是否允许加好友、好友审核、私聊、语音提示、手机号/邮箱展示。
- 收藏夹模块按照消息类型展示收藏内容,支持音视频预览、文件下载链接、文本编辑与滑动删除,多端兼容 DOM 视频组件。
系统与技术亮点
- WsRequest 单例封装心跳、断线重连、ACK 批量确认、未发送队列以及消息策略分发,自动刷新好友/群组待办并触发插件监听。
- MessageBuilder 统一生成消息公共字段并序列化,配合 SendCode 枚举保障发送协议一致,在 WebSocket 未就绪时记录待发送日志。
- Pinia 配合自定义 piniaPersistStorage 将聊天摘要、系统配置、权限等落地缓存;MessageCacheManager 控制全局消息数量并提供预加载接口。
- 插件体系基于 import.meta.glob("./*/index.ts", { eager: true }) 自动收集 chat/home/message/listener 四类插件,并在 VimPlugin 中统一排序与渲染。
- 多端适配通过 #ifdef H5、#ifdef APP-PLUS、#ifdef MP 分支处理文件选择、媒体播放、震动等差异;音视频能力结合 SysConfig 中的 STUN/TURN/LiveKit 配置可随环境切换。
- 系统配置存储 WebRTC 信令、上传限制、模块展示开关等参数,登录后拉取并缓存,结合权限列表控制插件显隐和工作台展示内容。