feat: add notification audit log tab to settings

back/api/system.ts

@@ -374,6 +374,19 @@ export default (app: Router) => {
     },
   );
 
+  route.get(
+    '/notify-log',
+    async (req: Request, res: Response, next: NextFunction) => {
+      try {
+        const systemService = Container.get(SystemService);
+        const data = await systemService.getNotifyLog();
+        res.send({ code: 200, data });
+      } catch (e) {
+        return next(e);
+      }
+    },
+  );
+
   route.delete(
     '/log',
     async (req: Request, res: Response, next: NextFunction) => {

back/data/system.ts

@@ -28,6 +28,12 @@ export enum AuthDataType {
   'removeLogFrequency' = 'removeLogFrequency',
   'systemConfig' = 'systemConfig',
   'authConfig' = 'authConfig',
+  'notifyLog' = 'notifyLog',
+}
+
+export enum NotifyStatus {
+  'success',
+  'fail',
 }
 
 export interface SystemConfigInfo {
@@ -49,6 +55,14 @@ export interface LoginLogInfo {
   status?: LoginStatus;
 }
 
+export interface NotifyLogInfo {
+  timestamp?: number;
+  title?: string;
+  content?: string;
+  status?: NotifyStatus;
+  notifyType?: string;
+}
+
 export interface TokenInfo {
   value: string;
   timestamp: number;
@@ -81,6 +95,7 @@ export interface AuthInfo {
 export type SystemModelInfo = SystemConfigInfo &
   Partial<NotificationInfo> &
   LoginLogInfo &
+  Partial<NotifyLogInfo> &
   Partial<AuthInfo>;
 
 export interface SystemInstance

back/services/system.ts

@@ -30,6 +30,8 @@ import {
   SystemInstance,
   SystemModel,
   SystemModelInfo,
+  NotifyStatus,
+  NotifyLogInfo,
 } from '../data/system';
 import taskLimit from '../shared/pLimit';
 import NotificationService from './notify';
@@ -389,18 +391,53 @@ export default class SystemService {
     if (notificationInfo && typeString) {
       notificationInfo.type = typeString;
     }
+
+    let notifyType: string | undefined;
+    if (notificationInfo?.type) {
+      notifyType = typeString || (notificationInfo.type as string);
+    } else {
+      try {
+        const notifConfig = await this.getDb({ type: AuthDataType.notification });
+        notifyType = notifConfig.info?.type as string | undefined;
+      } catch (e) {}
+    }
+
     const isSuccess = await this.notificationService.notify(
       title,
       content,
       notificationInfo,
     );
+
+    await SystemModel.create({
+      type: AuthDataType.notifyLog,
+      info: {
+        timestamp: Date.now(),
+        title,
+        content,
+        status: isSuccess ? NotifyStatus.success : NotifyStatus.fail,
+        notifyType,
+      },
+    });
+
     if (isSuccess) {
       return { code: 200, message: '通知发送成功' };
     } else {
       return { code: 400, message: '通知发送失败，请检查系统设置/通知配置' };
     }
   }
 
+  public async getNotifyLog(): Promise<Array<NotifyLogInfo>> {
+    const docs = await SystemModel.findAll({
+      where: { type: AuthDataType.notifyLog },
+      order: [['id', 'DESC']],
+    });
+    if (docs.length > 200) {
+      const ids = docs.slice(200).map((x) => x.id!);
+      await SystemModel.destroy({ where: { id: ids } });
+    }
+    return docs.slice(0, 200).map((x) => ({ ...x.info, id: x.id }));
+  }
+
   public async run({ command, logPath }: { command: string; logPath?: string }, callback: TaskCallbacks) {
     if (!command.startsWith(TASK_COMMAND)) {
       command = `${TASK_COMMAND} ${command}`;

src/pages/setting/index.tsx

@@ -26,6 +26,7 @@ import {
 } from '@ant-design/icons';
 import SecuritySettings from './security';
 import LoginLog from './loginLog';
+import NotifyLog from './notifyLog';
 import NotificationSetting from './notification';
 import Other from './other';
 import About from './about';
@@ -125,6 +126,7 @@ const Setting = () => {
   const [editedApp, setEditedApp] = useState<any>();
   const [tabActiveKey, setTabActiveKey] = useState('security');
   const [loginLogData, setLoginLogData] = useState<any[]>([]);
+  const [notifyLogData, setNotifyLogData] = useState<any[]>([]);
   const [notificationInfo, setNotificationInfo] = useState<any>();
   const containergRef = useRef<HTMLDivElement>(null);
   const [height, setHeight] = useState<number>(0);
@@ -253,6 +255,8 @@ const Setting = () => {
       getApps();
     } else if (activeKey === 'login') {
       getLoginLog();
+    } else if (activeKey === 'notifylog') {
+      getNotifyLog();
     } else if (activeKey === 'notification') {
       getNotification();
     }
@@ -271,6 +275,19 @@ const Setting = () => {
       });
   };
 
+  const getNotifyLog = () => {
+    request
+      .get(`${config.apiPrefix}system/notify-log`)
+      .then(({ code, data }) => {
+        if (code === 200) {
+          setNotifyLogData(data);
+        }
+      })
+      .catch((error: any) => {
+        console.log(error);
+      });
+  };
+
   useEffect(() => {
     if (isDemoEnv) {
       getApps();
@@ -344,6 +361,11 @@ const Setting = () => {
               label: intl.get('登录日志'),
               children: <LoginLog height={height} data={loginLogData} />,
             },
+            {
+              key: 'notifylog',
+              label: intl.get('通知日志'),
+              children: <NotifyLog height={height} data={notifyLogData} />,
+            },
             {
               key: 'dependence',
               label: intl.get('依赖设置'),

src/pages/setting/notifyLog.tsx

@@ -0,0 +1,103 @@
+import intl from 'react-intl-universal';
+import React from 'react';
+import { Table, Tag } from 'antd';
+import dayjs from 'dayjs';
+
+interface NotifyLogItem {
+  id?: number;
+  timestamp?: number;
+  title?: string;
+  content?: string;
+  status?: number;
+  notifyType?: string;
+}
+
+const NotifyStatusLabel: Record<number, string> = {
+  0: '成功',
+  1: '失败',
+};
+
+const NotifyStatusColor: Record<number, string> = {
+  0: 'success',
+  1: 'error',
+};
+
+const columns = [
+  {
+    title: intl.get('序号'),
+    width: 50,
+    render: (text: string, record: any, index: number) => {
+      return index + 1;
+    },
+  },
+  {
+    title: intl.get('发送时间'),
+    dataIndex: 'timestamp',
+    key: 'timestamp',
+    width: 160,
+    render: (text: string, record: any) => {
+      return dayjs(record.timestamp).format('YYYY-MM-DD HH:mm:ss');
+    },
+  },
+  {
+    title: intl.get('标题'),
+    dataIndex: 'title',
+    key: 'title',
+    width: 200,
+  },
+  {
+    title: intl.get('内容'),
+    dataIndex: 'content',
+    key: 'content',
+    render: (text: string) => {
+      if (!text) return '';
+      return text.length > 100 ? text.slice(0, 100) + '...' : text;
+    },
+  },
+  {
+    title: intl.get('推送渠道'),
+    dataIndex: 'notifyType',
+    key: 'notifyType',
+    width: 120,
+  },
+  {
+    title: intl.get('发送状态'),
+    dataIndex: 'status',
+    key: 'status',
+    width: 90,
+    render: (text: string, record: NotifyLogItem) => {
+      const statusKey = record.status ?? 1;
+      return (
+        <Tag
+          color={NotifyStatusColor[statusKey]}
+          style={{ marginRight: 0 }}
+        >
+          {intl.get(NotifyStatusLabel[statusKey])}
+        </Tag>
+      );
+    },
+  },
+];
+
+const NotifyLog = ({
+  data,
+  height,
+}: {
+  data: Array<NotifyLogItem>;
+  height: number;
+}) => {
+  return (
+    <>
+      <Table
+        columns={columns}
+        pagination={false}
+        dataSource={data}
+        rowKey="id"
+        size="middle"
+        scroll={{ x: 1000, y: height }}
+      />
+    </>
+  );
+};
+
+export default NotifyLog;