fix: 替换通知图标为统一的Icon组件样式

- 移除自定义SVG图标,使用Icon组件的bell图标
- 确保通知图标与系统设置、成就、签到等图标风格统一
- 修复类型检查错误
This commit is contained in:
Your Name 2026-01-02 20:11:27 +08:00
parent 8e0ecdb3ce
commit 9c27f8c9f4

View File

@ -2,19 +2,7 @@
<a-dropdown :trigger="['click']" placement="bottomRight">
<div class="notification-bell" @click="handleClick">
<a-badge :count="unreadCount" :overflow-count="99">
<svg
class="bell-icon"
viewBox="0 0 24 24"
aria-hidden="true"
focusable="false"
>
<path
d="M12 2.25a4.5 4.5 0 0 0-4.5 4.5V9c0 .414-.168.81-.467 1.098L5.21 11.82a1.125 1.125 0 0 0 .79 1.93h12a1.125 1.125 0 0 0 .79-1.93l-1.823-1.722A1.5 1.5 0 0 1 16.5 9V6.75a4.5 4.5 0 0 0-4.5-4.5Zm0 18.375a3.375 3.375 0 0 0 3.182-2.25H8.818A3.375 3.375 0 0 0 12 20.625Z"
fill="currentColor"
stroke="currentColor"
stroke-width="0"
/>
</svg>
<Icon name="bell" size="md" />
</a-badge>
</div>
@ -137,7 +125,7 @@ const handleClick = () => {
// 点击通知项
const handleNotificationClick = async (notification: Notification) => {
// 标记为已读
if (notification.isRead === 0) {
if (notification.isRead === 0 && currentUserId.value) {
try {
await markAsRead(notification.id, currentUserId.value)
loadUnreadCount()
@ -160,6 +148,10 @@ const handleViewAll = () => {
// 全部已读
const handleMarkAllRead = async () => {
if (!currentUserId.value) {
return
}
try {
const count = await markAllAsRead(currentUserId.value)
message.success(`已标记 ${count} 条消息为已读`)
@ -278,15 +270,6 @@ onUnmounted(() => {
background: $bg-card;
color: $text-primary;
}
.bell-icon {
width: 18px;
height: 18px;
display: inline-block;
fill: currentColor;
stroke: currentColor;
stroke-width: 0;
}
}
.notification-dropdown {