# 若依轻量级聊天系统 **Repository Path**: jokeli2007/ruoyi-chat ## Basic Information - **Project Name**: 若依轻量级聊天系统 - **Description**: 基于若依Ruoyi轻量级聊天系统,包含了若依的前端app,vue,后台三个工程,完美的修正了两套系统表结构不一致,登录方式不一致的问题,集成了注册、登录、加好友、发朋友圈等功能,欢迎共同学习共同进步 - **Primary Language**: Java - **License**: GPL-2.0 - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 0 - **Created**: 2025-12-08 - **Last Updated**: 2026-03-24 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 聊天系统实现说明 ## 后端已创建文件 ### 好友管理模块 1. Domain层 - `ChatFriend.java` - 好友关系实体 - `ChatFriendRequest.java` - 好友申请实体 2. Mapper层 - `ChatFriendMapper.java` - 好友关系Mapper接口 - `ChatFriendRequestMapper.java` - 好友申请Mapper接口 - `ChatFriendMapper.xml` - MyBatis映射文件 - `ChatFriendRequestMapper.xml` - MyBatis映射文件 3. Service层 - `IChatFriendService.java` - 好友服务接口 - `ChatFriendServiceImpl.java` - 好友服务实现 - `IChatFriendRequestService.java` - 好友申请服务接口 - `ChatFriendRequestServiceImpl.java` - 好友申请服务实现 4. Controller层 - `ChatFriendController.java` - 好友管理控制器 ### 数据库 - `chat_system.sql` - 完整的数据库表结构 ## 后端待创建的核心类(需要补充) ### 聊天消息模块 - ChatMessage.java (Domain) - ChatConversation.java (Domain) - ChatMessageMapper.java + XML - ChatConversationMapper.java + XML - IChatMessageService + Impl - IChatConversationService + Impl - ChatMessageController.java ### 朋友圈模块 - ChatMoment.java (Domain) - ChatMomentLike.java (Domain) - ChatMomentComment.java (Domain) - 对应的Mapper、Service、Controller ## 前端实现计划 ### uni-app页面结构 1. 聊天页面 - pages/chat/list - 会话列表 - pages/chat/detail - 聊天详情 2. 通讯录页面 - pages/contacts/index - 通讯录首页 - pages/contacts/add - 添加好友 - pages/contacts/request - 好友申请列表 3. 朋友圈页面 - pages/moment/list - 朋友圈列表 - pages/moment/publish - 发布朋友圈 4. 个人中心 - pages/mine/index - 我的页面(已存在,需更新) ## API接口 所有后端API需在前端创建对应的api文件: - api/chat/friend.js - api/chat/message.js - api/chat/moment.js # 系统消息功能使用说明 ## 功能概述 系统消息功能允许管理员在后台管理系统中向用户发送系统通知消息。支持以下三种发送方式: 1. **群发消息** - 向所有用户发送消息 2. **部门消息** - 向指定部门的所有用户发送消息 3. **个人消息** - 向指定的一个或多个用户发送消息 用户在客户端(RuoYi-App-master)会话列表中看到"系统消息"会话,点击进入后可查看所有系统消息。 ## 部署步骤 ### 1. 数据库更新 执行SQL脚本 `RuoYi-Vue-master/sql/system_message.sql`,该脚本会: - 为 `chat_message` 表添加系统消息支持字段 - 添加系统消息相关菜单权限 ```bash # 在MySQL中执行 source /path/to/RuoYi-Vue-master/sql/system_message.sql ``` ### 2. 后端部署 后端已创建以下文件(无需手动操作,代码已生成): **实体类和DTO:** - `ChatMessage.java` - 已更新,添加系统消息字段 - `SystemMessageDTO.java` - 系统消息传输对象 **Mapper层:** - `ChatMessageMapper.xml` - 已更新SQL映射 **Service层:** - `ISystemMessageService.java` - 系统消息服务接口 - `SystemMessageServiceImpl.java` - 系统消息服务实现 **Controller层:** - `SystemMessageController.java` - 系统消息控制器 重新编译并启动后端服务: ```bash cd RuoYi-Vue-master mvn clean install # 启动应用 ``` ### 3. 前端部署 前端已更新以下文件(无需手动操作,代码已生成): **API接口:** - `api/chat/system.js` - 系统消息API **页面修改:** - `pages/chat/list.vue` - 会话列表,支持显示系统消息 - `pages/chat/detail.vue` - 聊天详情页,支持显示系统消息 ## API接口说明 ### 1. 发送系统消息(通用接口) ``` POST /chat/system/send 权限: chat:system:send ``` **请求参数 (SystemMessageDTO):** ```json { "content": "这是一条系统消息", "sendScope": "1", // 1-全部 2-部门 3-个人 "targetDeptId": null, // 当sendScope=2时必填 "targetUserIds": [], // 当sendScope=3时必填 "msgType": "1" // 1-文本(默认) } ``` ### 2. 群发消息(发给所有人) ``` POST /chat/system/sendToAll 权限: chat:system:send ``` **请求参数:** ```json { "content": "群发消息内容" } ``` ### 3. 按部门发送 ``` POST /chat/system/sendToDept 权限: chat:system:send ``` **请求参数:** ```json { "content": "部门消息内容", "targetDeptId": 100 // 部门ID } ``` ### 4. 发送给指定用户 ``` POST /chat/system/sendToUser 权限: chat:system:send ``` **请求参数:** ```json { "content": "个人消息内容", "targetUserIds": [1, 2, 3] // 用户ID数组 } ``` ## 使用示例 ### 后台管理系统使用 1. 登录后台管理系统 2. 进入"聊天系统" > "系统消息"菜单(需要先分配权限) 3. 选择发送方式: - 群发:向所有用户发送 - 部门发送:选择目标部门 - 个人发送:选择目标用户 4. 输入消息内容,点击发送 ### 客户端查看系统消息 1. 打开RuoYi-App-master客户端 2. 进入"聊天"标签页 3. 会话列表中会显示"系统消息"(如果有新消息) 4. 点击进入查看系统消息详情 5. 系统消息以居中灰色背景显示,与普通消息区分 6. 系统消息不支持回复 ## 技术实现说明 ### 数据库设计 在 `chat_message` 表中添加了以下字段: - `is_system` - 是否系统消息(0普通 1系统) - `send_scope` - 发送范围(1全部 2部门 3个人) - `target_dept_id` - 目标部门ID(部门消息使用) - `from_user_id` - 允许为NULL(系统消息无发送人) ### 会话标识 系统消息在会话列表中使用特殊的 `targetId = 0` 来标识,这样: - 所有用户的系统消息都汇聚在同一个会话中 - 前端通过 `targetId === 0` 判断是否为系统消息 - 会话列表显示名称为"系统消息" ### 消息发送逻辑 1. 后台管理员调用发送接口 2. 根据 `sendScope` 获取目标用户列表: - sendScope=1: 查询所有正常状态用户 - sendScope=2: 查询指定部门的用户 - sendScope=3: 使用指定的用户ID列表 3. 为每个目标用户创建一条消息记录 4. 创建或更新用户的系统消息会话(targetId=0) 5. 返回成功发送的消息数量 ### 前端显示逻辑 **会话列表:** - 检测 `targetId === 0`,显示"系统消息" - 使用默认头像 - 显示最后一条系统消息内容 **聊天详情页:** - 检测 `isSystem === '1'` 或 `fromUserId === 0` - 系统消息居中显示,灰色背景 - 隐藏输入框,显示"系统消息不支持回复"提示 - 普通消息正常左右显示 ## 权限配置 确保管理员角色拥有以下权限: - `chat:system:list` - 系统消息查询 - `chat:system:send` - 系统消息发送 - `chat:system:query` - 系统消息详情 - `chat:system:remove` - 系统消息删除 在"系统管理" > "角色管理"中为相应角色分配权限。 ## 注意事项 1. **性能考虑**: 群发消息会为每个用户创建一条记录,用户量大时需要考虑性能优化 2. **存储空间**: 系统消息会占用数据库存储空间,建议定期清理历史消息 3. **权限控制**: 确保只有授权管理员能够发送系统消息 4. **消息内容**: 建议控制消息内容长度,避免过长影响显示 5. **发送前确认**: 群发和部门消息影响范围大,建议增加二次确认机制 ## 扩展功能建议 1. **消息模板**: 预设常用消息模板 2. **定时发送**: 支持定时发送系统消息 3. **富文本消息**: 支持图片、链接等富文本内容 4. **消息撤回**: 允许管理员撤回已发送的系统消息 5. **发送历史**: 记录系统消息发送历史和统计 6. **消息分类**: 支持通知、公告等不同类型的系统消息 # 用户注册功能实现说明 ## 📋 实现内容 ### 1. 后端修改 #### 1.1 开启注册功能配置 **文件**: `RuoYi-Vue-master/sql/enable_register.sql` ```sql UPDATE sys_config SET config_value = 'true' WHERE config_key = 'sys.account.registerUser'; ``` **执行方式**: - 在数据库管理工具中执行此 SQL 语句 - 或者通过后台管理系统的参数配置页面,将 `sys.account.registerUser` 的值改为 `true` #### 1.2 扩展注册数据模型 **文件**: `RuoYi-Vue-master/ruoyi-common/src/main/java/com/ruoyi/common/core/domain/model/RegisterBody.java` 添加了以下字段: - `email` - 邮箱地址 - `phonenumber` - 手机号码 #### 1.3 增强注册服务 **文件**: `RuoYi-Vue-master/ruoyi-framework/src/main/java/com/ruoyi/framework/web/service/SysRegisterService.java` 新增验证逻辑: - ✅ 邮箱格式验证(正则表达式) - ✅ 邮箱唯一性验证(检查数据库) - ✅ 手机号格式验证(正则表达式:1[3-9]开头的11位数字) - ✅ 手机号唯一性验证(检查数据库) - ✅ 用户名唯一性验证(原有功能) ### 2. 前端修改 #### 2.1 移动端注册页面 **文件**: `RuoYi-App-master/pages/register.vue` 新增表单字段: - 📧 邮箱输入框(可选) - 📱 手机号输入框(可选) 前端验证: - ✅ 用户名长度验证(2-20个字符) - ✅ 邮箱格式验证 - ✅ 手机号格式验证(1[3-9]开头的11位数字) - ✅ 密码长度验证(5-20个字符) - ✅ 密码非法字符验证 - ✅ 两次密码一致性验证 - ✅ 验证码验证 #### 2.2 登录页面 **文件**: `RuoYi-App-master/pages/login.vue` 新增功能: - 添加"立即注册"链接 - 点击跳转到注册页面 #### 2.3 API 接口 **文件**: `RuoYi-App-master/api/login.js` 新增方法: ```javascript export function register(data) { return request({ 'url': '/register', headers: { isToken: false }, 'method': 'post', 'data': data }) } ``` #### 2.4 路由配置 **文件**: `RuoYi-App-master/pages.json` 新增路由: ```json { "path": "pages/register", "style": { "navigationBarTitleText": "注册账号" } } ``` #### 2.5 权限白名单配置 **文件**: `RuoYi-App-master/permission.js` 将注册页面添加到白名单: ```javascript const whiteList = [ '/pages/login', '/pages/register', '/pages/common/webview/index' ] ``` **重要:** 如果不添加到白名单,未登录用户跳转到注册页会被拦截并重定向到登录页。 ## 🔒 数据验证规则 ### 用户名 - ✅ 必填 - ✅ 长度:2-20个字符 - ✅ 唯一性:不能与已有用户名重复 ### 密码 - ✅ 必填 - ✅ 长度:5-20个字符 - ✅ 不能包含非法字符:`< > " ' \ |` ### 邮箱 - ✅ **必填** - ✅ 格式:符合标准邮箱格式 - ✅ 正则:`^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$` - ✅ 唯一性:不能与已有邮箱重复 ### 手机号 - ✅ **必填** - ✅ 格式:11位数字,1[3-9]开头 - ✅ 正则:`^1[3-9]\d{9}$` - ✅ 唯一性:不能与已有手机号重复 ### 验证码 - ✅ 必填(如果系统开启了验证码功能) - ✅ 4位数字 ### 默认设置 - ✅ 部门ID:自动设置为 **106(财务部门)** - ✅ 昵称:默认使用用户名 ## 🚀 使用流程 1. **用户访问登录页** 2. **点击"立即注册"链接** 3. **填写注册信息**: - 用户名(必填) - 邮箱(**必填**) - 手机号(**必填**) - 密码(必填) - 确认密码(必填) - 验证码(必填) 4. **前端验证**: - 检查所有字段格式 - 确保密码一致性 5. **提交到后端** 6. **后端验证**: - 检查注册功能是否开启 - 验证验证码 - 检查用户名/邮箱/手机号唯一性 - 验证所有字段格式 7. **创建用户**: - 密码加密存储 - **自动分配到106部门(财务部门)** - 记录注册日志 8. **注册成功**: - 显示成功提示 - 自动跳转到登录页 ## ⚙️ 配置说明 ### 开启/关闭注册功能 **方式一:通过 SQL** ```sql -- 开启 UPDATE sys_config SET config_value = 'true' WHERE config_key = 'sys.account.registerUser'; -- 关闭 UPDATE sys_config SET config_value = 'false' WHERE config_key = 'sys.account.registerUser'; ``` **方式二:通过后台管理系统** 1. 登录后台管理系统 2. 进入"系统管理" > "参数设置" 3. 找到"账号自助-是否开启用户注册功能" 4. 修改参数键值为 `true` 或 `false` 5. 保存并刷新缓存 ## 📝 注意事项 1. **必须先执行 SQL 开启注册功能**,否则会提示“当前系统没有开启注册功能!” 2. **所有字段均为必填**:用户名、邮箱、手机号、密码、确认密码、验证码 3. **后端会进行二次验证**,前端验证主要是提升用户体验 4. **密码会自动加密**存储到数据库 5. **注册成功后会自动记录登录日志** 6. **新注册用户自动分配到106部门(财务部门)** ## 🎨 UI 特性 - ✨ 优雅的渐变背景动画 - 💎 卡片式表单设计 - 🎯 输入框聚焦高亮效果 - 📱 响应式布局 - 🌈 与登录页面设计风格一致 ## 🔄 后续优化建议 1. 添加短信验证码功能 2. 添加邮箱验证功能 3. 支持第三方登录(微信、QQ等) 4. 添加用户协议确认复选框 5. 优化错误提示信息展示