2.7 KiB
2.7 KiB
会话管理和用户管理页面优化
1. 问题描述
当前系统的会话管理和用户管理页面存在以下问题：
-
会话记录页面：
- 发送方式以纯文本形式显示，不够直观
- 手机号直接显示完整号码，存在隐私泄露风险
- 时间格式包含"T"字符，不符合用户阅读习惯
- 使用传统分页方式，用户体验不佳
-
用户管理页面：
- 存在不必要的分页控件，增加用户操作复杂度
- 时间格式包含"T"字符，不符合用户阅读习惯
- 手机号直接显示完整号码，存在隐私泄露风险
2. 解决方案
-
优化发送方式显示：将发送方式重构为tag标签形式，文字类型显示success样式，语音类型显示默认样式
-
实现手机号脱敏功能：
- 默认隐藏中间4-8位数字为"*"符号
- 支持点击交互，点击显示完整号码，再次点击恢复脱敏状态
-
优化时间格式：将所有时间数据中的"T"字符替换为空格，提高可读性
-
重构表格组件为Descriptions描述列表：
- 将表格替换为Descriptions描述列表，一行表格数据放入一个Descriptions描述列表
- 实现"无限滚动"分页加载机制，每次加载20条，滚动到最底时加载下20条
- 会话内容单独一行显示在最下方
- 其他内容排成3列显示
- 当查询结果不足20条时判断为已加载全部数据
-
优化用户管理页面：
- 移除分页控件及相关分页逻辑
- 不分页加载所有用户数据
- 应用时间格式转换，将时间数据中的"T"字符替换为空格
3. 预期效果
-
会话记录页面：
- 发送方式以tag标签形式显示
- 手机号自动脱敏，支持点击显示/隐藏完整号码
- 时间格式统一为"YYYY-MM-DD HH:mm:ss"
- 表格替换为Descriptions描述列表，一行数据一个描述列表
- 会话内容单独一行显示在最下方，其他内容排成3列
- 实现无限滚动加载，每次加载20条，提升用户体验
-
用户管理页面：
- 移除分页控件，不分页加载所有用户数据
- 时间格式统一为"YYYY-MM-DD HH:mm:ss"
- 手机号自动脱敏，支持点击显示/隐藏完整号码
-
整体效果：
- 提高系统的用户体验和视觉效果
- 增强数据安全性，保护用户隐私
- 优化页面性能，提高数据加载效率
- 简化用户操作，减少不必要的交互步骤
4. 影响范围
- 会话管理页面（ConversationList.vue）
- 用户管理页面（UserList.vue）
- 新增工具函数文件（formatters.js）
- 相关API调用（AdminController的QueryConversations方法）