diff --git a/public/icons/OrionTV.png b/public/icons/OrionTV.png new file mode 100644 index 0000000..2bfd5ab Binary files /dev/null and b/public/icons/OrionTV.png differ diff --git a/public/icons/Selene.png b/public/icons/Selene.png new file mode 100644 index 0000000..0d13318 Binary files /dev/null and b/public/icons/Selene.png differ diff --git a/src/components/UserMenu.tsx b/src/components/UserMenu.tsx index 765a741..296b36b 100644 --- a/src/components/UserMenu.tsx +++ b/src/components/UserMenu.tsx @@ -22,6 +22,7 @@ import { Monitor, MoveDown, MoveUp, + Package, Rss, Settings, Shield, @@ -65,6 +66,7 @@ export const UserMenu: React.FC = () => { const [isFavoritesPanelOpen, setIsFavoritesPanelOpen] = useState(false); const [isEmailSettingsOpen, setIsEmailSettingsOpen] = useState(false); const [isDeviceManagementOpen, setIsDeviceManagementOpen] = useState(false); + const [isEcoAppsOpen, setIsEcoAppsOpen] = useState(false); const [authInfo, setAuthInfo] = useState(null); const [storageType, setStorageType] = useState('localstorage'); const [mounted, setMounted] = useState(false); @@ -78,7 +80,7 @@ export const UserMenu: React.FC = () => { // Body 滚动锁定 - 使用 overflow 方式避免布局问题 useEffect(() => { - if (isSettingsOpen || isChangePasswordOpen || isSubscribeOpen || isOfflineDownloadPanelOpen || isEmailSettingsOpen || isDeviceManagementOpen) { + if (isSettingsOpen || isChangePasswordOpen || isSubscribeOpen || isOfflineDownloadPanelOpen || isEmailSettingsOpen || isDeviceManagementOpen || isEcoAppsOpen) { const body = document.body; const html = document.documentElement; @@ -97,7 +99,7 @@ export const UserMenu: React.FC = () => { html.style.overflow = originalHtmlOverflow; }; } - }, [isSettingsOpen, isChangePasswordOpen, isSubscribeOpen, isOfflineDownloadPanelOpen, isEmailSettingsOpen, isDeviceManagementOpen]); + }, [isSettingsOpen, isChangePasswordOpen, isSubscribeOpen, isOfflineDownloadPanelOpen, isEmailSettingsOpen, isDeviceManagementOpen, isEcoAppsOpen]); // 设置相关状态 const [defaultAggregateSearch, setDefaultAggregateSearch] = useState(true); @@ -1285,6 +1287,18 @@ export const UserMenu: React.FC = () => { )} + {/* 生态应用按钮 */} + + {/* 分割线 */}
@@ -2859,6 +2873,194 @@ export const UserMenu: React.FC = () => { ); + // 生态应用面板内容 + const ecoAppsPanel = ( + <> + {/* 背景遮罩 */} +
setIsEcoAppsOpen(false)} + onTouchMove={(e) => { + e.preventDefault(); + }} + onWheel={(e) => { + e.preventDefault(); + }} + style={{ + touchAction: 'none', + }} + /> + + {/* 生态应用面板 */} +
+
{ + e.stopPropagation(); + }} + style={{ + touchAction: 'auto', + }} + > + {/* 标题栏 */} +
+

+ 生态应用 +

+ +
+ + {/* 应用列表 */} +
+
+ {/* MoonTVPlus-PC 客户端 */} +
+
+
+ MoonTVPlus-PC +
+ +
+
+
+

+ MoonTVPlus-PC客户端 +

+

+ 专为Windows开发的客户端,完美支持私人影库mkv视频 +

+ + + 下载 + + +
+
+
+ + {/* Selene 跨平台客户端 */} +
+
+
+ Selene + + 二开 + +
+
+

+ Selene 跨平台客户端 +

+

+ 多平台客户端 +

+
+ + + 安卓下载 + + + +
+
+
+
+ + {/* OrionTV TV专用客户端 */} +
+
+
+ OrionTV + + 二开 + +
+
+

+ OrionTV TV专用客户端 +

+

+ tv专用 +

+ + + 下载 + + +
+
+
+
+
+ + {/* 底部说明 */} +
+

+ 选择适合您设备的客户端下载使用 +

+
+
+
+ + ); + return ( <>
@@ -2942,6 +3144,11 @@ export const UserMenu: React.FC = () => { mounted && createPortal(deviceManagementPanel, document.body)} + {/* 使用 Portal 将生态应用面板渲染到 document.body */} + {isEcoAppsOpen && + mounted && + createPortal(ecoAppsPanel, document.body)} + {/* 确认对话框 */} {confirmDialog.isOpen && mounted &&