From 19701bd246179038026381d1944b984ee4150049 Mon Sep 17 00:00:00 2001 From: Ultrame <1019265060@qq.com> Date: Fri, 12 Sep 2025 16:12:11 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B6=88=E6=81=AF=E5=88=97=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/other_pages/message/index.tsx | 224 ++++++++++++------------------ src/services/noticeService.ts | 63 +++++++++ 2 files changed, 151 insertions(+), 136 deletions(-) create mode 100644 src/services/noticeService.ts diff --git a/src/other_pages/message/index.tsx b/src/other_pages/message/index.tsx index 0c8b745..b48b9dc 100644 --- a/src/other_pages/message/index.tsx +++ b/src/other_pages/message/index.tsx @@ -1,184 +1,136 @@ -import { useState } from 'react' -import { View, Text, ScrollView, Image } from '@tarojs/components' -import { Avatar } from '@nutui/nutui-react-taro' -import GuideBar from '@/components/GuideBar' -import { withAuth } from '@/components' -import './index.scss' +import { useState, useEffect } from "react"; +import { View, Text, ScrollView, Image } from "@tarojs/components"; +import { Avatar } from "@nutui/nutui-react-taro"; +import GuideBar from "@/components/GuideBar"; +import { withAuth } from "@/components"; +import noticeService from "@/services/noticeService"; +import Taro, { useRouter } from "@tarojs/taro"; +import "./index.scss"; // 消息类型定义 interface MessageItem { - id: string - type: 'system' | 'user' | 'like' | 'comment' | 'follow' - title: string - content: string - time: string - avatar?: string - isRead: boolean - hasAction?: boolean - actionText?: string + id: string; + type: "system" | "user" | "like" | "comment" | "follow"; + title: string; + content: string; + time: string; + avatar?: string; + isRead: boolean; + hasAction?: boolean; + actionText?: string; } const Message = () => { - const [activeTab] = useState<'all' | 'like' | 'comment' | 'follow'>('all') + const [activeTab] = useState<"all" | "like" | "comment" | "follow">("all"); + const [messageList, setMessageList] = useState([]); - // 模拟消息数据 - const messageList: MessageItem[] = [ - { - id: '1', - type: 'system', - title: '球局报名确认', - content: '恭喜，你成功报名"世纪公园混双 · 8月20日"球局！请提前15分钟到达，球场门口等你。', - time: '今天 09:12', - isRead: false, - hasAction: true, - actionText: '查看详情' - }, - { - id: '2', - type: 'system', - title: '新球友加入提醒', - content: 'Fiona 已加入"徐汇双打 · 今晚7点"的群聊，快去和她打个招呼吧～', - time: '昨天 09:12', - isRead: false, - hasAction: true, - actionText: '打个招呼' - }, - { - id: '3', - type: 'system', - title: '场地变更通知', - content: '请注意，"张江中午快打"已改至世纪园区 3 号场集合。', - time: '2025-08-17 18:30', - isRead: true - }, - { - id: '4', - type: 'system', - title: '系统维护提醒', - content: '系统将于 2025-08-20 凌晨 00:00–02:00 暂停服务，届时活动发布、消息中心等功能可能无法使用，敬请谅解。', - time: '2025-08-17 18:30', - isRead: true - }, - { - id: '5', - type: 'system', - title: '活动将近提醒', - content: '你的"宝山初学者约球"将在 2 小时后开始。快准备好球拍、毛巾和运动鞋，我们赛场见！', - time: '2025-08-17 18:30', - isRead: true - }, - { - id: '6', - type: 'user', - title: '王晨', - content: '你好，昨天约的球场还在吗', - time: '09:34', - avatar: 'https://img.yzcdn.cn/vant/cat.jpeg', - isRead: false - }, - { - id: '7', - type: 'user', - title: '阿斌', - content: '七点到世纪公园东门集合可以吗？', - time: '昨天 22:10', - avatar: 'https://img.yzcdn.cn/vant/cat.jpeg', - isRead: false - }, - { - id: '8', - type: 'user', - title: 'Lili', - content: '我刚问了，还有一个小时的空场！', - time: '昨天 18:47', - avatar: 'https://img.yzcdn.cn/vant/cat.jpeg', - isRead: true - } - ] + useEffect(() => { + const getNoticeList = async () => { + try { + const res = await noticeService.getNotificationList({}); + if (res.code === 0) { + setMessageList(res.data.list); + } + } catch (e) { + Taro.showToast({ + title: "获取列表失败，请重试", + icon: "none", + duration: 2000, + }); + } finally { + } + }; + getNoticeList(); + }, []); // 过滤消息 - const filteredMessages = messageList.filter(message => { - if (activeTab === 'all') return true - return message.type === activeTab - }) + const filteredMessages = messageList.filter((message) => { + if (activeTab === "all") return true; + return message.type === activeTab; + }); // 渲染消息项 const renderMessageItem = (message: MessageItem) => { - if (message.type === 'system') { + if (message.type === "system") { return ( - - - {message.title} - {message.time} + + + {message.title} + {message.time} - - {message.content} + + {message.content} {message.hasAction && ( - - - - {message.actionText} - + + + + {message.actionText} + )} - ) + ); } return ( - - - + + + - - - {message.title} - {message.time} + + + {message.title} + {message.time} - - {message.content} - {!message.isRead && } + + {message.content} + {!message.isRead && } - ) - } + ); + }; return ( - + {/* 导航栏 */} - - - - - 消息 + + + + + 消息 - {/* 消息列表 */} - + {filteredMessages.length > 0 ? ( - + {filteredMessages.map(renderMessageItem)} ) : ( - - - + + + - 暂无消息 + 暂无消息 )} {/* 底部导航 */} - + - ) -} + ); +}; -export default withAuth(Message) \ No newline at end of file +export default withAuth(Message); diff --git a/src/services/noticeService.ts b/src/services/noticeService.ts new file mode 100644 index 0000000..eb67009 --- /dev/null +++ b/src/services/noticeService.ts @@ -0,0 +1,63 @@ +import httpService from "./httpService"; +import type { ApiResponse } from "./httpService"; + +export enum ReadStatus { + UNREAD = 0, + READ = 1 +} + +export interface NoticeListParams { + notification_type?: string; + is_read?: ReadStatus; +} + +export interface NoticeListResponse { + list: any[]; + total: number; + unread_count: number; +} + +export interface Notice { + description: string; +} + +export interface MarkReadParams { + notification_ids: number[]; + mark_all: boolean; +} + +export interface DeleteParams { + notification_ids: number[]; + delete_all: boolean; +} + +export interface UnreadMountResponse { + total_unread: number; + unread_by_type: {} +} + + +class NoticeService { + // 获取用户消息通知列表 + async getNotificationList({ notification_type, is_read }: NoticeListParams): Promise> { + return httpService.post("/notifications/list", { notification_type, is_read }, { showLoading: true }); + } + // 获取消息通知详情 + async getNotificationDetail(notification_id: number): Promise> { + return httpService.post("/notifications/detail", { notification_id }, { showLoading: true }); + } + // 标记消息为已读 + async markNotificationRead({ notification_ids, mark_all }: MarkReadParams): Promise> { + return httpService.post("/notifications/mark_read", { notification_ids, mark_all }, { showLoading: true }); + } + // 删除消息通知 + async delNotification({ notification_ids, delete_all }: DeleteParams): Promise> { + return httpService.post("/notifications/delete", { notification_ids, delete_all }, { showLoading: true }); + } + // 获取未读消息数量 + async getNotificationUnreadCount(): Promise> { + return httpService.post("/notifications/unread_count", {}, { showLoading: true }); + } +} + +export default new NoticeService();