zc/autoAiWorkSys
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
eca314e6866fd979f116a96ac622d0b73146d6d3
autoAiWorkSys/_doc/聊天列表功能说明.md
张成 5d7444cd65 1
2025-11-24 13:23:42 +08:00

7.8 KiB
Raw Blame History

聊天列表功能说明

功能概述

聊天列表模块实现了管理后台的实时聊天功能,包括:

  • 会话列表展示
  • 实时消息收发
  • 消息历史记录
  • 轮询机制接收新消息

功能特性

1. 会话列表

  • 按会话分组: 自动按照 conversationId 或 jobId + sn_code 组合进行分组
  • 最新消息展示: 显示每个会话的最新一条消息
  • 未读消息标记: 显示未读消息数量(开发中)
  • 平台过滤: 支持按 Boss直聘/猎聘 平台筛选
  • 搜索功能: 支持按公司名称/职位名称搜索

2. 聊天窗口

  • 消息列表: 按时间顺序展示所有聊天消息
  • 消息方向: 区分发送和接收的消息,不同样式展示
  • AI标记: 显示AI生成的消息标记
  • 面试邀约: 特殊样式展示面试邀约消息
  • 实时刷新: 自动轮询获取新消息(默认5秒)

3. 消息发送

  • 快速回复: 输入框支持快速发送消息
  • Enter发送: 支持回车键发送消息
  • 发送状态: 显示消息发送中的加载状态
  • AI生成: 预留AI消息生成功能接口(开发中)

4. 定时刷新机制

  • 自动刷新: 使用 setInterval 定时刷新消息
  • 可配置间隔: 默认10秒,可自定义刷新间隔
  • 资源释放: 页面销毁时自动清除定时器
  • 简单高效: 使用Ajax轮询,无需WebSocket

文件结构

admin/src/
├── views/chat/
│   ├── chat_list.vue          # 聊天列表页面(新增)
│   └── chat_records.vue        # 聊天记录管理页面(原有)
├── api/operation/
│   └── chat_records_server.js  # 聊天API服务
└── router/
    └── component-map.js        # 路由组件映射

api/
├── controller_admin/
│   └── chat_records.js         # 聊天记录后端控制器(已扩展)
└── model/
    └── chat_records.js         # 聊天记录数据模型

API 接口

前端API服务 (chat_records_server.js)

方法 说明 参数
page(param) 分页查询聊天记录 seachOption, pageOption
getByJobId(params) 获取指定职位的聊天记录 jobId, sn_code
sendMessage(data) 发送聊天消息 sn_code, jobId, content, chatType, platform
getUnreadCount(params) 获取未读消息数量 sn_code
markAsRead(data) 标记消息为已读 chatId
getStatistics() 获取聊天统计数据 -

后端API接口

接口 方法 说明
/admin_api/chat/list POST 获取聊天记录列表
/admin_api/chat/by-job GET 获取指定职位的聊天记录
/admin_api/chat/send POST 发送聊天消息
/admin_api/chat/unread-count GET 获取未读消息数量
/admin_api/chat/mark-read POST 标记消息为已读
/admin_api/chat/statistics GET 获取聊天统计数据
/admin_api/chat/detail GET 获取聊天记录详情
/admin_api/chat/delete POST 删除聊天记录

使用说明

1. 访问聊天列表页面

在后台菜单中添加聊天列表页面的路由配置:

{
  name: '聊天列表',
  path: '/chat/chat_list',
  component: 'chat/chat_list'
}

2. 查看会话列表

  • 左侧显示所有会话列表
  • 每个会话显示公司名称、职位名称、最新消息和时间
  • 点击会话可在右侧查看完整的聊天记录

3. 发送消息

  1. 在左侧选择一个会话
  2. 在右侧聊天窗口底部的输入框中输入消息
  3. 点击"发送"按钮或按回车键发送
  4. 消息发送成功后会自动刷新聊天记录

4. 筛选和搜索

  • 平台筛选: 在顶部选择 Boss直聘 或 猎聘 进行筛选
  • 关键词搜索: 在搜索框输入公司名称或职位名称进行搜索
  • 筛选和搜索会实时更新会话列表

数据模型

聊天记录模型 (chat_records)

主要字段:

字段 类型 说明
id INTEGER 主键ID
sn_code STRING 设备SN码
platform STRING 平台(boss/liepin)
jobId STRING 职位ID
companyName STRING 公司名称
jobTitle STRING 职位名称
hrName STRING HR姓名
content TEXT 消息内容
direction STRING 消息方向(sent/received)
chatType STRING 聊天类型(greeting/reply/interview)
sendStatus STRING 发送状态(pending/sent/failed)
sendTime DATE 发送时间
receiveTime DATE 接收时间
hasReply BOOLEAN 是否有回复
conversationId STRING 会话ID
isAiGenerated BOOLEAN 是否AI生成
isInterviewInvitation BOOLEAN 是否面试邀约

技术实现

1. 会话分组逻辑

// 按 conversationId 或 jobId+sn_code 分组
const convId = record.conversationId || `${record.jobId}_${record.sn_code}`

2. 定时刷新机制

// 启动定时刷新
startAutoRefresh() {
    this.refreshTimer = setInterval(() => {
        // 如果有选中的会话,刷新消息
        if (this.activeConversation) {
            this.loadChatMessages()
        }
        // 刷新会话列表
        this.loadConversations()
    }, this.refreshInterval) // 默认10秒
}

// 停止定时刷新
stopAutoRefresh() {
    if (this.refreshTimer) {
        clearInterval(this.refreshTimer)
        this.refreshTimer = null
    }
}

3. 消息发送流程

  1. 前端调用 chatRecordsServer.sendMessage()
  2. 后端创建聊天记录,状态为 pending
  3. 后端通过MQTT发送消息到设备(待实现)
  4. 更新聊天记录状态为 sent
  5. 前端刷新消息列表

待开发功能

1. 优化刷新机制(可选)

当前使用简单的定时刷新,如果需要更高的实时性,可以考虑:

  • WebSocket实时推送(需要服务端支持)
  • 长轮询(Long Polling)
  • Server-Sent Events (SSE)
  • 智能刷新间隔(根据活跃度动态调整)

2. AI消息生成

集成AI服务生成智能回复:

  • 根据聊天上下文生成合适的回复
  • 支持不同的回复风格
  • 提高回复效率

3. 富文本消息

支持更丰富的消息类型:

  • 图片消息
  • 文件消息
  • 表情包
  • Markdown格式

4. 消息状态管理

完善消息状态:

  • 已读/未读状态
  • 消息撤回
  • 消息编辑
  • 消息引用回复

5. 会话管理

增强会话管理功能:

  • 会话置顶
  • 会话静音
  • 会话归档
  • 会话标签

注意事项

1. MQTT集成

当前消息发送功能需要集成MQTT客户端才能真正发送到设备。在 chat_records.js 控制器中有TODO标记:

// TODO: 这里需要通过MQTT发送消息到设备
// 目前先简单返回成功,实际需要集成MQTT客户端

2. 数据同步

  • 刷新间隔不宜过短,避免服务器压力(建议10秒以上)
  • 可根据实际需求调整刷新间隔
  • 考虑添加手动刷新按钮,让用户主动刷新

3. 性能优化

  • 会话列表分页加载
  • 消息列表虚拟滚动
  • 图片懒加载
  • 消息缓存机制

4. 安全性

  • 消息内容过滤和验证
  • 防止XSS攻击
  • 消息发送频率限制
  • 敏感信息加密

测试建议

1. 功能测试

  • 测试会话列表加载
  • 测试消息发送和接收
  • 测试筛选和搜索功能
  • 测试定时刷新机制

2. 边界测试

  • 测试空会话列表
  • 测试空消息列表
  • 测试网络异常情况
  • 测试大量消息加载

3. 性能测试

  • 测试大量会话的加载速度
  • 测试长时间运行的内存占用
  • 测试频繁切换会话的响应速度

更新日志

v1.0.0 (2025-01-XX)

  • ✅ 创建聊天列表页面
  • ✅ 实现会话分组和展示
  • ✅ 实现消息发送功能
  • ✅ 实现定时刷新接收新消息(Ajax轮询)
  • ✅ 添加后端API接口
  • ✅ 支持平台筛选和搜索

计划中

  • ⏳ AI消息生成
  • ⏳ 富文本消息支持
  • ⏳ 完善消息状态管理
  • ⏳ 增强会话管理功能
  • ⏳ 优化刷新机制(WebSocket/长轮询等)
Reference in New Issue View Git Blame Copy Permalink