优化通知页面,新增消息状态判断,仅在未读状态下显示“标记已读”按钮,提升用户交互体验。

This commit is contained in:
zyh
2025-04-10 11:15:07 +00:00
parent a16e7a4165
commit 387c8f71f9

View File

@@ -3,6 +3,7 @@ import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import { BellIcon } from '@heroicons/react/24/outline';
import { MessageStatus } from '../share/types.ts';
// 添加通知页面组件
@@ -79,13 +80,15 @@ export const NotificationsPage = () => {
<div className="flex justify-between items-start">
<h3 className="font-medium">{message.title}</h3>
<div className="flex space-x-2">
<button
type="button"
onClick={() => handleMarkAsRead(message.id)}
className="text-xs text-blue-600 hover:text-blue-800"
>
</button>
{message.user_status === MessageStatus.UNREAD && (
<button
type="button"
onClick={() => handleMarkAsRead(message.id)}
className="text-xs text-blue-600 hover:text-blue-800"
>
</button>
)}
<button
type="button"
onClick={() => handleDelete(message.id)}