add anc button to navbar

src/component/Common/AnnouncementDialog.tsx

@@ -14,7 +14,11 @@ import { useAppDispatch, useAppSelector } from "../../redux/hooks.ts";
 import { getAnnouncement } from "../../redux/thunks/site.ts";
 import SessionManager from "../../session";
 
-const AnnouncementDialog = () => {
+interface AnnouncementDialogProps {
+  forceOpen?: boolean;
+}
+
+const AnnouncementDialog = ({ forceOpen = false }: AnnouncementDialogProps) => {
   const { t } = useTranslation("common");
   const dispatch = useAppDispatch();
   const announcement = useAppSelector((state) => state.siteConfig.basic.config.announcement || "");
@@ -55,11 +59,22 @@ const AnnouncementDialog = () => {
       const timer = setTimeout(() => setOpen(true), 1000);
       return () => clearTimeout(timer);
     } else {
-      // 确保当不应该显示时关闭弹窗
-      setOpen(false);
+      // 确保当不应该显示且没有强制打开时关闭弹窗
+      if (!forceOpen) {
+        setOpen(false);
+      }
     }
   }, [announcement, announcementEnabled, lastAnnouncement]);
 
+  // 处理外部强制打开
+  useEffect(() => {
+    if (forceOpen && announcement && announcement.trim() !== "") {
+      setOpen(true);
+      // 重置不再显示选项
+      setDontShowAgain(false);
+    }
+  }, [announcement, announcementEnabled, lastAnnouncement, forceOpen]);
+
   const handleClose = () => {
     if (dontShowAgain) {
       // 保存用户选择不再显示
@@ -90,4 +105,6 @@ const AnnouncementDialog = () => {
   );
 };
 
+// 导出一个可以被外部组件控制的版本
+export { AnnouncementDialog };
 export default AnnouncementDialog;

src/component/Frame/NavBar/PageNavigation.tsx

@@ -46,6 +46,7 @@ import WrenchSettings from "../../Icons/WrenchSettings.tsx";
 import { ProChip } from "../../Pages/Setting/SettingForm.tsx";
 import NavIconTransition from "./NavIconTransition.tsx";
 import SideNavItem from "./SideNavItem.tsx";
+import { AnnouncementDialog } from "../../Common/AnnouncementDialog.tsx";
 
 export interface NavigationItem {
   label: string;
@@ -246,8 +247,12 @@ export const AdminPageNavigation = memo(() => {
 });
 
 const PageNavigation = () => {
-  const shopNavEnabled = useAppSelector((state) => state.siteConfig.basic.config.shop_nav_enabled);
+  const { t } = useTranslation("application");
+  // 移除不存在的shop_nav_enabled属性引用
   const appPromotionEnabled = useAppSelector((state) => state.siteConfig.basic.config.app_promotion);
+  const announcementEnabled = useAppSelector((state) => state.siteConfig.basic.config.announcement_enabled || false);
+  const announcement = useAppSelector((state) => state.siteConfig.basic.config.announcement || "");
+  const [showAnnouncement, setShowAnnouncement] = useState(false);
   const user = SessionManager.currentLoginOrNull();
   const isAdmin = useMemo(() => {
     return GroupBS(user?.user).enabled(GroupPermission.is_admin);
@@ -272,6 +277,21 @@ const PageNavigation = () => {
             {connectEnabled && <SideNavItemComponent item={ConnectNavigationItem} />}
             <SideNavItemComponent item={TaskNavigationItem} />
             {remoteDownloadEnabled && <SideNavItemComponent item={RemoteDownloadNavigationItem} />}
+            {/* 公告导航项 - 只有当公告启用且有内容时显示 */}
+            {announcementEnabled && announcement && announcement.trim() !== "" && (
+              <SideNavItem
+                onClick={() => setShowAnnouncement(true)}
+                label={t("navbar.announcement", { defaultValue: "公告" })}
+                icon={
+                  <NavIconTransition
+                    sx={{ px: 0, py: 0, pr: "14px", height: "20px" }}
+                    iconProps={{ fontSize: "small", color: "action" }}
+                    fileIcon={[Warning, WarningOutlined]}
+                    active={false}
+                  />
+                }
+              />
+            )}
           </>
         </Box>
       )}
@@ -279,9 +299,9 @@ const PageNavigation = () => {
         <Box>
           {customNavItems.map((item) => (
             <SideNavItemComponent
-              key={item.name}
+              key={item.title}
               item={{
-                label: item.name,
+                label: item.title,
                 iconifyName: item.icon,
                 path: item.url,
               }}
@@ -298,6 +318,8 @@ const PageNavigation = () => {
           }}
         />
       )}
+      {/* 公告对话框 */}
+      <AnnouncementDialog forceOpen={showAnnouncement} />
     </>
   );
 };