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);
await installService();
Notice.success(t("Service Installed Successfully"), 2000);
await mutateRunningMode();
} catch (err: any) {
Notice.error(err.message || err.toString(), 3000);
}
});
// 点击运行模式处理
// 点击运行模式处理,Sidecar或纯管理员模式允许安装服务
const handleRunningModeClick = useCallback(() => {
if (isSidecarMode || isAdminMode) {
if (isSidecarMode || (isAdminMode && isSidecarMode)) {
onInstallService();
}
}, [isSidecarMode, isAdminMode, onInstallService]);
@ -157,13 +159,14 @@ export const SystemInfoCard = () => {
// 运行模式样式
const runningModeStyle = useMemo(
() => ({
cursor: (isSidecarMode || isAdminMode) ? "pointer" : "default",
textDecoration: (isSidecarMode || isAdminMode) ? "underline" : "none",
// Sidecar或纯管理员模式允许安装服务
cursor: (isSidecarMode || (isAdminMode && isSidecarMode)) ? "pointer" : "default",
textDecoration: (isSidecarMode || (isAdminMode && isSidecarMode)) ? "underline" : "none",
display: "flex",
alignItems: "center",
gap: 0.5,
"&:hover": {
opacity: (isSidecarMode || isAdminMode) ? 0.7 : 1,
opacity: (isSidecarMode || (isAdminMode && isSidecarMode)) ? 0.7 : 1,
},
}),
[isSidecarMode, isAdminMode],
@ -172,6 +175,21 @@ export const SystemInfoCard = () => {
// 获取模式图标和文本
const getModeIcon = () => {
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 (
<AdminPanelSettingsOutlined
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存在时才渲染内容
if (!verge) return null;
@ -252,9 +285,7 @@ export const SystemInfoCard = () => {
sx={runningModeStyle}
>
{getModeIcon()}
{isAdminMode
? t("Administrator Mode")
: isSidecarMode ? t("Sidecar Mode") : t("Service Mode")}
{getModeText()}
</Typography>
</Stack>
<Divider />

View File

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

View File

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