修复部分bug，公告功能支持HTML

src/component/Common/AnnouncementDialog.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from "react";
+import { styled } from "@mui/material/styles";
 import {
   Dialog,
   DialogContent,
@@ -16,9 +17,59 @@ import SessionManager from "../../session";
 
 interface AnnouncementDialogProps {
   forceOpen?: boolean;
+  onClose?: () => void;
 }
 
-const AnnouncementDialog = ({ forceOpen = false }: AnnouncementDialogProps) => {
+// 为公告内容创建一个带样式的容器组件
+const AnnouncementContent = styled("div")`
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin-top: 16px;
+    margin-bottom: 8px;
+  }
+  p {
+    margin-bottom: 12px;
+    line-height: 1.6;
+  }
+  ul,
+  ol {
+    margin-left: 24px;
+    margin-bottom: 12px;
+  }
+  li {
+    margin-bottom: 4px;
+  }
+  a {
+    color: #1976d2;
+    text-decoration: none;
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+  img {
+    max-width: 100%;
+    height: auto;
+  }
+  table {
+    width: 100%;
+    border-collapse: collapse;
+    margin-bottom: 16px;
+  }
+  th,
+  td {
+    border: 1px solid #e0e0e0;
+    padding: 8px;
+  }
+  th {
+    background-color: #f5f5f5;
+  }
+`;
+
+const AnnouncementDialog = ({ forceOpen = false, onClose }: AnnouncementDialogProps) => {
   const { t } = useTranslation("common");
   const dispatch = useAppDispatch();
   const announcement = useAppSelector((state) => state.siteConfig.basic.config.announcement || "");
@@ -81,6 +132,10 @@ const AnnouncementDialog = ({ forceOpen = false }: AnnouncementDialogProps) => {
       SessionManager.set("announcement_dismissed", "true");
     }
     setOpen(false);
+    // 通知父组件弹窗已关闭
+    if (onClose) {
+      onClose();
+    }
   };
 
   return (
@@ -89,8 +144,8 @@ const AnnouncementDialog = ({ forceOpen = false }: AnnouncementDialogProps) => {
         {t("announcement", "公告")}
       </DialogTitle>
       <DialogContent sx={{ padding: 2, maxHeight: "80vh" }}>
-        <Paper elevation={0} sx={{ p: 2, whiteSpace: "pre-line" }}>
+        <Paper elevation={0} sx={{ p: 2 }}>
-          <Typography variant="body1">{announcement}</Typography>
+          <AnnouncementContent dangerouslySetInnerHTML={{ __html: announcement }} />
         </Paper>
         <FormControlLabel
           control={<Checkbox checked={dontShowAgain} onChange={(e) => setDontShowAgain(e.target.checked)} />}

src/component/Frame/NavBar/PageNavigation.tsx

@@ -319,7 +319,7 @@ const PageNavigation = () => {
         />
       )}
       {/* 公告对话框 */}
-      <AnnouncementDialog forceOpen={showAnnouncement} />
+      <AnnouncementDialog forceOpen={showAnnouncement} onClose={() => setShowAnnouncement(false)} />
     </>
   );
 };