fix dependency issues

This commit is contained in:
Ahao
2025-05-24 19:58:37 +08:00
parent 7466139320
commit fa1f9875d9
2 changed files with 56 additions and 209 deletions

View File

@@ -51,7 +51,6 @@
- 添加了Zashboard的一键跳转URL - 添加了Zashboard的一键跳转URL
- 使用操作系统默认的窗口管理器 - 使用操作系统默认的窗口管理器
- 切换、升级、重启内核的状态管理 - 切换、升级、重启内核的状态管理
- 增加了一键随机API端口和密钥/单独刷新按钮(待优化)
- 更精细化控制自动日志清理新增1天选项。 - 更精细化控制自动日志清理新增1天选项。
#### 优化了: #### 优化了:
@@ -78,7 +77,6 @@
- 异步化配置:优化端口查找和配置保存逻辑 - 异步化配置:优化端口查找和配置保存逻辑
- 重构事件通知机制到独立线程,避免前端卡死 - 重构事件通知机制到独立线程,避免前端卡死
- 优化端口设置,每个端口可随机设置端口号 - 优化端口设置,每个端口可随机设置端口号
- 优化了随机端口和密钥机制,防止随机时卡死!
- 优化了保存机制,使用平滑函数,防止客户端卡死! - 优化了保存机制,使用平滑函数,防止客户端卡死!
- 优化端口设置退出和保存机制! - 优化端口设置退出和保存机制!
- 强制为 Mihomo 配置补全并覆盖 external-controller-cors 字段,默认不允许跨域和仅本地请求,提升 cors 安全性,升级配置时自动覆盖。 - 强制为 Mihomo 配置补全并覆盖 external-controller-cors 字段,默认不允许跨域和仅本地请求,提升 cors 安全性,升级配置时自动覆盖。

View File

@@ -1,118 +1,45 @@
import { BaseDialog, DialogRef } from "@/components/base"; import { BaseDialog, DialogRef } from "@/components/base";
import { useClashInfo } from "@/hooks/use-clash"; import { useClashInfo } from "@/hooks/use-clash";
import { useVerge } from "@/hooks/use-verge"; import { patchClashConfig } from "@/services/cmds";
import { patchClashConfig, restartCore } from "@/services/cmds";
import { showNotice } from "@/services/noticeService"; import { showNotice } from "@/services/noticeService";
import { import { ContentCopy } from "@mui/icons-material";
ContentCopy,
RefreshRounded,
} from "@mui/icons-material";
import { import {
Alert, Alert,
Box, Box,
CircularProgress, CircularProgress,
FormControlLabel,
IconButton, IconButton,
List, List,
ListItem, ListItem,
ListItemText, ListItemText,
Snackbar, Snackbar,
Switch,
TextField, TextField,
Tooltip Tooltip
} from "@mui/material"; } from "@mui/material";
import { useLocalStorageState, useLockFn } from "ahooks"; import { useLockFn } from "ahooks";
import { forwardRef, useEffect, useImperativeHandle, useState } from "react"; import { forwardRef, useEffect, useImperativeHandle, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
// 随机端口和密码生成
const generateRandomPort = (): number => {
return Math.floor(Math.random() * (65535 - 1024 + 1)) + 1024;
};
const generateRandomPassword = (length: number = 32): string => {
const charset = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
let password = "";
for (let i = 0; i < length; i++) {
const randomIndex = Math.floor(Math.random() * charset.length);
password += charset.charAt(randomIndex);
}
return password;
};
export const ControllerViewer = forwardRef<DialogRef>((props, ref) => { export const ControllerViewer = forwardRef<DialogRef>((props, ref) => {
const { t } = useTranslation(); const { t } = useTranslation();
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
// 防止数值null
const [autoGenerateState, setAutoGenerate] = useLocalStorageState<boolean>(
'autoGenerateConfig',
{ defaultValue: false as boolean }
);
const autoGenerate = autoGenerateState!;
const [copySuccess, setCopySuccess] = useState<null | string>(null); const [copySuccess, setCopySuccess] = useState<null | string>(null);
const [isSaving, setIsSaving] = useState(false); const [isSaving, setIsSaving] = useState(false);
const { clashInfo, patchInfo } = useClashInfo(); const { clashInfo, patchInfo } = useClashInfo();
const [controller, setController] = useState(clashInfo?.server || ""); const [controller, setController] = useState(clashInfo?.server || "");
const [secret, setSecret] = useState(clashInfo?.secret || ""); const [secret, setSecret] = useState(clashInfo?.secret || "");
// 对话框打开时初始化配置
// 生成随机配置并重启内核
const generateAndRestart = useLockFn(async () => {
try {
setIsRestarting(true);
const port = generateRandomPort();
const password = generateRandomPassword();
const host = controller.split(':')[0] || '127.0.0.1';
const newController = `${host}:${port}`;
setController(newController);
setSecret(password);
// 更新配置
await patchInfo({ "external-controller": newController, secret: password });
// 直接重启内核
await restartCoreDirectly();
// 静默执行,不显示通知
} catch (err: any) {
showNotice('error', err.message || t("Failed to generate configuration or restart core"), 4000);
} finally {
setIsRestarting(false);
}
});
// 仅在对话框打开时生成配置
useImperativeHandle(ref, () => ({ useImperativeHandle(ref, () => ({
open: async () => { open: async () => {
setOpen(true); setOpen(true);
setController(clashInfo?.server || "");
if (autoGenerate) { setSecret(clashInfo?.secret || "");
await generateAndRestart();
} else {
setController(clashInfo?.server || "");
setSecret(clashInfo?.secret || "");
}
}, },
close: () => setOpen(false), close: () => setOpen(false),
})); }));
// 当自动生成开关状态变化时触发 // 保存配置
useEffect(() => {
if (autoGenerate && open) {
generateAndRestart();
}
}, [autoGenerate, open]);
// 保存函数(优化)
const onSave = useLockFn(async () => { const onSave = useLockFn(async () => {
if (!controller.trim()) { if (!controller.trim()) {
showNotice('info', t("Controller address cannot be empty"), 3000); showNotice('info', t("Controller address cannot be empty"), 3000);
@@ -121,15 +48,8 @@ export const ControllerViewer = forwardRef<DialogRef>((props, ref) => {
try { try {
setIsSaving(true); setIsSaving(true);
await patchInfo({ "external-controller": controller, secret });
await patchInfo({ showNotice('success', t("Configuration saved successfully"), 2000);
"external-controller": controller,
secret,
});
await restartCore();
showNotice('success', t("Configuration saved and core restarted successfully"), 2000);
setOpen(false); setOpen(false);
} catch (err: any) { } catch (err: any) {
showNotice('error', err.message || t("Failed to save configuration"), 4000); showNotice('error', err.message || t("Failed to save configuration"), 4000);
@@ -138,27 +58,6 @@ export const ControllerViewer = forwardRef<DialogRef>((props, ref) => {
} }
}); });
// 生成随机端口
const handleGeneratePort = useLockFn(async () => {
if (!autoGenerate) {
const port = generateRandomPort();
const host = controller.split(':')[0] || '127.0.0.1';
setController(`${host}:${port}`);
showNotice('success', t("Random port generated"), 1000);
}
return Promise.resolve();
});
// 生成随机 Secret
const handleGenerateSecret = useLockFn(async () => {
if (!autoGenerate) {
const password = generateRandomPassword();
setSecret(password);
showNotice('success', t("Random secret generated"), 1000);
}
return Promise.resolve();
});
// 复制到剪贴板 // 复制到剪贴板
const handleCopyToClipboard = useLockFn(async (text: string, type: string) => { const handleCopyToClipboard = useLockFn(async (text: string, type: string) => {
try { try {
@@ -175,16 +74,14 @@ export const ControllerViewer = forwardRef<DialogRef>((props, ref) => {
open={open} open={open}
title={t("External Controller")} title={t("External Controller")}
contentSx={{ width: 400 }} contentSx={{ width: 400 }}
okBtn={ okBtn={isSaving ? (
isSaving ? ( <Box display="flex" alignItems="center" gap={1}>
<Box display="flex" alignItems="center" gap={1}> <CircularProgress size={16} color="inherit" />
<CircularProgress size={16} color="inherit" /> {t("Saving...")}
{t("Saving...")} </Box>
</Box> ) : (
) : ( t("Save")
t("Save") )}
)
}
cancelBtn={t("Cancel")} cancelBtn={t("Cancel")}
onClose={() => setOpen(false)} onClose={() => setOpen(false)}
onCancel={() => setOpen(false)} onCancel={() => setOpen(false)}
@@ -192,106 +89,61 @@ export const ControllerViewer = forwardRef<DialogRef>((props, ref) => {
> >
<List> <List>
<ListItem sx={{ padding: "5px 2px", display: "flex", justifyContent: "space-between" }}> <ListItem sx={{ padding: "5px 2px", display: "flex", justifyContent: "space-between" }}>
<Box display="flex" alignItems="center" gap={1}> <ListItemText primary={t("External Controller")} />
<ListItemText primary={t("External Controller")} />
<Tooltip title={t("Generate Random Port")}>
<IconButton
size="small"
onClick={handleGeneratePort}
color="primary"
disabled={autoGenerate || isSaving }
>
<RefreshRounded fontSize="small" />
</IconButton>
</Tooltip>
</Box>
<Box display="flex" alignItems="center" gap={1}> <Box display="flex" alignItems="center" gap={1}>
<TextField <TextField
autoComplete="new-password"
size="small" size="small"
sx={{ width: 175, opacity: autoGenerate ? 0.7 : 1 }} sx={{
width: 175,
opacity: 0.7,
pointerEvents: 'none'
}}
value={controller} value={controller}
placeholder="Required" placeholder="Required"
onChange={(e) => setController(e.target.value)} onChange={() => {}}
disabled={autoGenerate || isSaving } disabled={true}
inputProps={{ readOnly: true }}
/> />
{autoGenerate && ( <Tooltip title={t("Copy to clipboard")}>
<Tooltip title={t("Copy to clipboard")}>
<IconButton
size="small"
onClick={() => handleCopyToClipboard(controller, "controller")}
color="primary"
disabled={isSaving }
>
<ContentCopy fontSize="small" />
</IconButton>
</Tooltip>
)}
</Box>
</ListItem>
<ListItem sx={{ padding: "5px 2px", display: "flex", justifyContent: "space-between" }}>
<Box display="flex" alignItems="center" gap={1}>
<ListItemText primary={t("Core Secret")} />
<Tooltip title={t("Generate Random Secret")}>
<IconButton <IconButton
size="small" size="small"
onClick={handleGenerateSecret} onClick={() => handleCopyToClipboard(controller, "controller")}
color="primary" color="primary"
disabled={autoGenerate || isSaving } disabled={isSaving}
> >
<RefreshRounded fontSize="small" /> <ContentCopy fontSize="small" />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
</Box> </Box>
<Box display="flex" alignItems="center" gap={1}>
<TextField
autoComplete="new-password"
size="small"
sx={{ width: 175, opacity: autoGenerate ? 0.7 : 1 }}
value={secret}
placeholder={t("Recommended")}
onChange={(e) =>
setSecret(e.target.value?.replace(/[^\x00-\x7F]/g, ""))
}
disabled={autoGenerate || isSaving }
/>
{autoGenerate && (
<Tooltip title={t("Copy to clipboard")}>
<IconButton
size="small"
onClick={() => handleCopyToClipboard(secret, "secret")}
color="primary"
disabled={isSaving }
>
<ContentCopy fontSize="small" />
</IconButton>
</Tooltip>
)}
</Box>
</ListItem> </ListItem>
<ListItem sx={{ padding: "5px 2px", display: "flex", justifyContent: "space-between" }}> <ListItem sx={{ padding: "5px 2px", display: "flex", justifyContent: "space-between" }}>
<ListItemText <ListItemText primary={t("Core Secret")} />
primary={t("Auto Random Config")} <Box display="flex" alignItems="center" gap={1}>
secondary={ <TextField
autoGenerate size="small"
? t("Generate new config and restart core when entering settings") sx={{
: t("Manual configuration") width: 175,
} opacity: 0.7,
/> pointerEvents: 'none'
<FormControlLabel }}
control={ value={secret}
<Switch placeholder={t("Recommended")}
checked={autoGenerate} onChange={() => {}}
onChange={() => setAutoGenerate(!autoGenerate)} disabled={true}
inputProps={{ readOnly: true }}
/>
<Tooltip title={t("Copy to clipboard")}>
<IconButton
size="small"
onClick={() => handleCopyToClipboard(secret, "secret")}
color="primary" color="primary"
disabled={isSaving } disabled={isSaving}
/> >
} <ContentCopy fontSize="small" />
label={autoGenerate ? t("On") : t("Off")} </IconButton>
labelPlacement="start" </Tooltip>
/> </Box>
</ListItem> </ListItem>
</List> </List>
@@ -300,10 +152,7 @@ export const ControllerViewer = forwardRef<DialogRef>((props, ref) => {
autoHideDuration={2000} autoHideDuration={2000}
anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }} anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}
> >
<Alert <Alert severity="success">
severity="success"
sx={{ width: '100%' }}
>
{copySuccess === "controller" {copySuccess === "controller"
? t("Controller address copied to clipboard") ? t("Controller address copied to clipboard")
: t("Secret copied to clipboard") : t("Secret copied to clipboard")