5.2 KiB
5.2 KiB
我的消息页面接口参数说明
📋 页面功能概述
页面路径:pages/me/my-message-page.vue
主要功能:
- 显示用户的消息列表
- 支持按类型筛选(全部/私信)
- 展示消息的标题、正文内容和时间
🔌 接口需求
接口1:获取消息列表
基本信息
- 接口路径:建议
GET /api/user/GetMessageList或POST /api/user/GetMessageList - 调用时机:
- 页面初始化时
- 切换标签(全部/私信)时
- 下拉刷新时
- 是否需要登录:是(需要Token)
请求参数
| 参数名 | 类型 | 必填 | 说明 | 示例 |
|---|---|---|---|---|
| pageIndex | number | 否 | 页码,从1开始 | 1 |
| pageSize | number | 否 | 每页数量 | 20 |
| messageType | number | 否 | 消息类型:0=全部,1=私信 | 0 |
请求参数说明:
messageType:根据页面标签currentIndex传递currentIndex = 0(全部)→messageType = 0或不传currentIndex = 1(私信)→messageType = 1
返回数据结构
interface Response {
code: number; // 0=成功
msg: string; // 消息
data: MessageItem[]; // 消息列表
}
interface MessageItem {
id: number; // 消息ID(必填)
title: string; // 消息标题(必填)
content: string; // 消息正文内容(必填)
createTime: string; // 创建时间,格式:YYYY-MM-DD HH:mm 或时间戳(必填)
messageType: number; // 消息类型:0=系统消息,1=私信(可选)
isRead: boolean; // 是否已读(可选)
}
返回示例
{
"code": 0,
"msg": "ok",
"data": [
{
"id": 1,
"title": "系统通知",
"content": "您的预约已成功,请按时到达。",
"createTime": "2025-01-01 11:12",
"messageType": 0,
"isRead": false
},
{
"id": 2,
"title": "私信消息",
"content": "您好,我想咨询一下房间预约的相关问题。",
"createTime": "2025-01-01 10:30",
"messageType": 1,
"isRead": true
}
]
}
📝 页面数据映射
当前页面显示字段
根据 my-message-page.vue 模板代码分析:
| 页面显示位置 | 对应字段 | 数据类型 | 说明 |
|---|---|---|---|
| 第23行:标题 | title |
string | 消息标题 |
| 第25-27行:正文 | content |
string | 消息正文内容 |
| 第29-31行:时间 | createTime |
string | 消息创建时间 |
标签筛选逻辑
| 标签索引 | 标签名称 | 对应参数值 | 说明 |
|---|---|---|---|
| 0 | 全部 | messageType = 0 或不传 |
显示所有消息 |
| 1 | 私信 | messageType = 1 |
只显示私信类型消息 |
🔄 接口调用建议
1. 接口定义位置
建议在 common/server/interface/user.js 中添加:
/**
* 获取消息列表
* @param {number} pageIndex 页码
* @param {number} pageSize 每页数量
* @param {number} messageType 消息类型:0=全部,1=私信
* @returns {Promise<MessageItem[]>}
*/
export const getMessageList = async (pageIndex = 1, pageSize = 20, messageType = 0) => {
const res = await request.getOrCache(
"user/GetMessageList",
{ pageIndex, pageSize, messageType },
1 // 缓存1秒
);
if (res.code == 0) {
return res.data;
}
return [];
}
2. 页面调用示例
import { getMessageList } from '@/common/server/interface/user.js'
// 在 methods 中添加
async loadMessageList() {
try {
const type = this.currentIndex === 0 ? 0 : 1;
const data = await getMessageList(1, 20, type);
this.messageList = data || [];
} catch (error) {
console.error('获取消息列表失败:', error);
uni.showToast({
title: '获取消息失败',
icon: 'none'
});
}
}
// 在 clickTab 方法中调用
clickTab(index) {
this.currentIndex = index;
this.loadMessageList(); // 切换标签时重新加载
}
✅ 必填字段总结
接口返回必须包含的字段:
- id (number) - 消息ID,用于唯一标识
- title (string) - 消息标题,显示在第23行
- content (string) - 消息正文,显示在第25-27行
- createTime (string) - 创建时间,显示在第29-31行
可选但建议包含的字段:
- messageType (number) - 用于前端筛选和分类
- isRead (boolean) - 用于显示未读标识(如果后续需要)
📌 注意事项
- 时间格式:建议后端返回格式化的时间字符串(如:
2025-01-01 11:12),或返回时间戳由前端格式化 - 分页支持:如果消息数量较多,建议支持分页加载
- 空数据处理:当没有消息时,返回空数组
[] - 错误处理:接口失败时返回
code != 0,前端需要处理错误情况
🔍 后续扩展建议
如果后续需要添加以下功能,可以考虑增加字段:
- 未读消息数:在标签上显示未读数量
- 消息详情:点击消息跳转到详情页,需要
id字段 - 删除消息:需要
id字段 - 标记已读:需要
id和isRead字段