feat: enhance system info card with combo mode display

This commit is contained in:
wonfen 2025-04-01 01:44:59 +08:00
parent 3fa130695c
commit 30ea408019
3 changed files with 42 additions and 9 deletions

View File

@ -120,15 +120,17 @@ export const SystemInfoCard = () => {
Notice.info(t("Installing Service..."), 1000); Notice.info(t("Installing Service..."), 1000);
await installService(); await installService();
Notice.success(t("Service Installed Successfully"), 2000); Notice.success(t("Service Installed Successfully"), 2000);
await mutateRunningMode();
await mutateRunningMode();
} catch (err: any) { } catch (err: any) {
Notice.error(err.message || err.toString(), 3000); Notice.error(err.message || err.toString(), 3000);
} }
}); });
// 点击运行模式处理 // 点击运行模式处理,Sidecar或纯管理员模式允许安装服务
const handleRunningModeClick = useCallback(() => { const handleRunningModeClick = useCallback(() => {
if (isSidecarMode || isAdminMode) { if (isSidecarMode || (isAdminMode && isSidecarMode)) {
onInstallService(); onInstallService();
} }
}, [isSidecarMode, isAdminMode, onInstallService]); }, [isSidecarMode, isAdminMode, onInstallService]);
@ -157,13 +159,14 @@ export const SystemInfoCard = () => {
// 运行模式样式 // 运行模式样式
const runningModeStyle = useMemo( const runningModeStyle = useMemo(
() => ({ () => ({
cursor: (isSidecarMode || isAdminMode) ? "pointer" : "default", // Sidecar或纯管理员模式允许安装服务
textDecoration: (isSidecarMode || isAdminMode) ? "underline" : "none", cursor: (isSidecarMode || (isAdminMode && isSidecarMode)) ? "pointer" : "default",
textDecoration: (isSidecarMode || (isAdminMode && isSidecarMode)) ? "underline" : "none",
display: "flex", display: "flex",
alignItems: "center", alignItems: "center",
gap: 0.5, gap: 0.5,
"&:hover": { "&:hover": {
opacity: (isSidecarMode || isAdminMode) ? 0.7 : 1, opacity: (isSidecarMode || (isAdminMode && isSidecarMode)) ? 0.7 : 1,
}, },
}), }),
[isSidecarMode, isAdminMode], [isSidecarMode, isAdminMode],
@ -172,6 +175,21 @@ export const SystemInfoCard = () => {
// 获取模式图标和文本 // 获取模式图标和文本
const getModeIcon = () => { const getModeIcon = () => {
if (isAdminMode) { if (isAdminMode) {
// 判断是否为组合模式(管理员+服务)
if (!isSidecarMode) {
return (
<>
<AdminPanelSettingsOutlined
sx={{ color: "primary.main", fontSize: 16 }}
titleAccess={t("Administrator Mode")}
/>
<DnsOutlined
sx={{ color: "success.main", fontSize: 16, ml: 0.5 }}
titleAccess={t("Service Mode")}
/>
</>
);
}
return ( return (
<AdminPanelSettingsOutlined <AdminPanelSettingsOutlined
sx={{ color: "primary.main", fontSize: 16 }} sx={{ color: "primary.main", fontSize: 16 }}
@ -195,6 +213,21 @@ export const SystemInfoCard = () => {
} }
}; };
// 获取模式文本
const getModeText = () => {
if (isAdminMode) {
// 判断是否同时处于服务模式
if (!isSidecarMode) {
return t("Administrator + Service Mode");
}
return t("Administrator Mode");
} else if (isSidecarMode) {
return t("Sidecar Mode");
} else {
return t("Service Mode");
}
};
// 只有当verge存在时才渲染内容 // 只有当verge存在时才渲染内容
if (!verge) return null; if (!verge) return null;
@ -252,9 +285,7 @@ export const SystemInfoCard = () => {
sx={runningModeStyle} sx={runningModeStyle}
> >
{getModeIcon()} {getModeIcon()}
{isAdminMode {getModeText()}
? t("Administrator Mode")
: isSidecarMode ? t("Sidecar Mode") : t("Service Mode")}
</Typography> </Typography>
</Stack> </Stack>
<Divider /> <Divider />

View File

@ -555,6 +555,7 @@
"Running Mode": "Running Mode", "Running Mode": "Running Mode",
"Sidecar Mode": "User Mode", "Sidecar Mode": "User Mode",
"Administrator Mode": "Administrator Mode", "Administrator Mode": "Administrator Mode",
"Administrator + Service Mode": "Admin + Service Mode",
"Last Check Update": "Last Check Update", "Last Check Update": "Last Check Update",
"Click to import subscription": "Click to import subscription", "Click to import subscription": "Click to import subscription",
"Update subscription successfully": "Update subscription successfully", "Update subscription successfully": "Update subscription successfully",

View File

@ -555,6 +555,7 @@
"Running Mode": "运行模式", "Running Mode": "运行模式",
"Sidecar Mode": "用户模式", "Sidecar Mode": "用户模式",
"Administrator Mode": "管理员模式", "Administrator Mode": "管理员模式",
"Administrator + Service Mode": "管理员 + 服务模式",
"Last Check Update": "最后检查更新", "Last Check Update": "最后检查更新",
"Click to import subscription": "点击导入订阅", "Click to import subscription": "点击导入订阅",
"Update subscription successfully": "订阅更新成功", "Update subscription successfully": "订阅更新成功",