Update notificationCenter.thunks.js

src/store/notificationCenter/notificationCenter.thunks.js

@@ -9,7 +9,7 @@ export const fetchNotifications = createAsyncThunk(
     async (_, { rejectWithValue }) => {
         try {
             const response = await get('/notifications/');
-            return response;
+            return processNotification(response);
         } catch (error) {
             const errorMessage = error.response?.data?.message || 'Failed to fetch notifications';
             return rejectWithValue(errorMessage);
@@ -27,7 +27,7 @@ export const markNotificationRead = createAsyncThunk(
             const response = await post(`/notifications/${notificationId}/mark-as-read/`);
             return { id: notificationId, ...response };
         } catch (error) {
-			const errorMessage = error.response?.data?.message || 'Failed to mark notification as read';
+            const errorMessage = error.response?.data?.message || 'Failed to mark notification as read';
             return rejectWithValue(errorMessage);
         }
     }
@@ -48,3 +48,88 @@ export const markAllNotificationsRead = createAsyncThunk(
         }
     }
 );
+
+/**
+ * 处理通知数据，转换为应用内通知格式
+ * @param {Object|Array} data 通知数据或通知数组
+ * @returns {Object|Array} 处理后的通知数据
+ */
+export const processNotification = (data) => {
+    // 处理数组类型的通知数据
+    if (Array.isArray(data)) {
+        return data.map((item) => processNotificationItem(item));
+    }
+
+    // 处理WebSocket格式的通知数据 (带有data字段的对象)
+    if (data && data.data) {
+        return processNotificationItem(data.data);
+    }
+
+    // 处理单个通知对象
+    return processNotificationItem(data);
+};
+
+/**
+ * 处理单个通知项
+ * @param {Object} notification 单个通知数据
+ * @returns {Object} 处理后的通知数据
+ */
+const processNotificationItem = (notification) => {
+    // 确保我们有一个有效的通知对象
+    if (!notification) return null;
+
+    // 提取通知数据，兼容不同的API格式
+    const notificationData = notification.data || notification;
+
+    // 设置图标
+    let icon = 'bi-info-circle';
+    const type = notificationData.category || notificationData.type;
+    if (type === 'system') {
+        icon = 'bi-info-circle';
+    } else if (type === 'permission' || type === 'permission_request') {
+        icon = 'bi-shield';
+    }
+
+    // 计算时间显示
+    const createdAt = new Date(notificationData.created_at);
+    const now = new Date();
+
+    // 检查是否是今天
+    const isToday =
+        createdAt.getDate() === now.getDate() &&
+        createdAt.getMonth() === now.getMonth() &&
+        createdAt.getFullYear() === now.getFullYear();
+
+    // 如果是今天，只显示时间；否则显示年月日和时间
+    let timeDisplay;
+    if (isToday) {
+        timeDisplay = createdAt.toLocaleTimeString('zh-CN', {
+            hour: '2-digit',
+            minute: '2-digit',
+        });
+    } else {
+        timeDisplay = createdAt.toLocaleString('zh-CN', {
+            year: 'numeric',
+            month: '2-digit',
+            day: '2-digit',
+            hour: '2-digit',
+            minute: '2-digit',
+        });
+    }
+
+    return {
+        id: notificationData.id,
+        type: type,
+        icon,
+        title: notificationData.title,
+        content: notificationData.content,
+        time: timeDisplay,
+        hasDetail: true,
+        isRead: notificationData.is_read,
+        created_at: notificationData.created_at,
+        sender: notificationData.sender,
+        receiver: notificationData.receiver,
+        related_resource: notificationData.related_resource,
+        metadata: notificationData.metadata || {},
+    };
+};