${item.username || '用户'}
${getActionText(item.action)}
${item.detail ? `
${item.detail}
` : ''}
${formatTime(item.ts)}
`).join('');
if (container) container.innerHTML = fullHtml;
if (modalContainer) modalContainer.innerHTML = fullHtml;
// 为每个通知项添加点击事件
if (container) {
container.querySelectorAll('.notification-item').forEach(item => {
item.addEventListener('click', async () => {
const id = item.dataset.id;
if (item.classList.contains('unread')) {
try {
await API.markNotificationRead(id);
item.classList.remove('unread');
// 同步 modal 中对应项
const modalItem = document.querySelector(`#notification-modal-list .notification-item[data-id="${id}"]`);
if (modalItem) modalItem.classList.remove('unread');
await updateUnreadCount();
} catch (e) {
console.error('标记已读失败:', e);
}
}
});
});
}
if (modalContainer) {
modalContainer.querySelectorAll('.notification-item').forEach(item => {
item.addEventListener('click', async () => {
const id = item.dataset.id;
if (item.classList.contains('unread')) {
try {
await API.markNotificationRead(id);
item.classList.remove('unread');
const sidebarItem = document.querySelector(`#notification-list .notification-item[data-id="${id}"]`);
if (sidebarItem) sidebarItem.classList.remove('unread');
await updateUnreadCount();
} catch (e) {
console.error('标记已读失败:', e);
}
}
});
});
}
} catch (e) {
console.error('加载通知失败:', e);
}
}
function openModal() {
const modal = document.getElementById('notification-modal');
if (!modal) return;
isModalOpen = true;
modal.style.display = 'block';
}
function closeModal() {
const modal = document.getElementById('notification-modal');
if (!modal) return;
isModalOpen = false;
modal.style.display = 'none';
}
// 初始化通知系统
async function initNotifications() {
// 防止重复初始化
if (isInitialized) {
console.log('[Notifications] 已经初始化，跳过');
return;
}
try {
// 检查用户角色
const user = await API.me();
if (user.role !== 'superadmin' && user.role !== 'admin') {
console.log('[Notifications] 非管理员，不显示通知');
return; // 超级管理员和管理员才显示通知铃铛
}
// 绑定铃铛按钮点击事件
const bellBtn = document.getElementById('notification-bell-btn');
if (!bellBtn) {
console.error('[Notifications] 找不到铃铛按钮元素');
return;
}
// 移除旧的事件监听器
const newBellBtn = bellBtn.cloneNode(true);
bellBtn.parentNode.replaceChild(newBellBtn, bellBtn);
newBellBtn.addEventListener('click', (e) => {
e.preventDefault();
e.stopPropagation();
openModal();
});
console.log('[Notifications] 铃铛按钮已绑定');
// 弹窗关闭
const closeBtn = document.getElementById('notification-modal-close');
if (closeBtn) {
const newClose = closeBtn.cloneNode(true);
closeBtn.parentNode.replaceChild(newClose, closeBtn);
newClose.addEventListener('click', closeModal);
}
const backdrop = document.querySelector('#notification-modal .notification-modal-backdrop');
if (backdrop) {
backdrop.addEventListener('click', closeModal);
}
document.addEventListener('keydown', (e) => {
if (isModalOpen && e.key === 'Escape') closeModal();
});
// 绑定弹窗中的全部标记为已读按钮
const modalMarkAllBtn = document.getElementById('modal-mark-all-read');
if (modalMarkAllBtn) {
const newModalMarkAllBtn = modalMarkAllBtn.cloneNode(true);
modalMarkAllBtn.parentNode.replaceChild(newModalMarkAllBtn, modalMarkAllBtn);
newModalMarkAllBtn.addEventListener('click', async (e) => {
e.preventDefault();
try {
await API.markAllNotificationsRead();
await loadNotifications();
await updateUnreadCount();
API.toast('已全部标记为已读');
} catch (e) {
console.error('标记全部已读失败:', e);
}
});
}
// 绑定弹窗中的删除已读消息按钮
const modalDeleteBtn = document.getElementById('modal-delete-read');
if (modalDeleteBtn) {
const newModalDeleteBtn = modalDeleteBtn.cloneNode(true);
modalDeleteBtn.parentNode.replaceChild(newModalDeleteBtn, modalDeleteBtn);
newModalDeleteBtn.addEventListener('click', async (e) => {
e.preventDefault();
if (!confirm('确定要删除所有已读消息吗？')) {
return;
}
try {
const result = await API.deleteReadNotifications();
await loadNotifications();
await updateUnreadCount();
API.toast(`已删除 ${result.count || 0} 条已读消息`);
} catch (e) {
console.error('删除已读消息失败:', e);
}
});
}
// 初次加载列表
await loadNotifications();
// 初始加载未读数量
await updateUnreadCount();
// 每5秒更新一次未读数量（实时检查新消息）
if (notificationInterval) {
clearInterval(notificationInterval);
}
notificationInterval = setInterval(updateUnreadCount, 5000);
isInitialized = true;
console.log('[Notifications] 初始化完成，实时轮询已启动（5秒间隔）');
} catch (e) {
console.error('初始化通知系统失败:', e);
}
}
// 清理定时器
function cleanupNotifications() {
if (notificationInterval) {
clearInterval(notificationInterval);
notificationInterval = null;
}
isInitialized = false;
console.log('[Notifications] 已清理');
}
// 导出到全局
window.NotificationSystem = {
init: initNotifications,
cleanup: cleanupNotifications,
refresh: updateUnreadCount
};
})();