@@ -333,7 +372,9 @@ const Connections: React.FC = () => {
}}
>
{t('connections.detail.status')}
- {t('connections.detail.establishTime')}
+
+ {t('connections.detail.establishTime')}
+
{t('connections.detail.connectionType')}
{t('connections.detail.host')}
{t('connections.detail.sniffHost')}
@@ -343,7 +384,9 @@ const Connections: React.FC = () => {
{t('connections.detail.proxyChain')}
{t('connections.detail.sourceIP')}
{t('connections.detail.sourcePort')}
- {t('connections.detail.destinationPort')}
+
+ {t('connections.detail.destinationPort')}
+
{t('connections.detail.inboundIP')}
{t('connections.detail.inboundPort')}
{t('connections.uploadSpeed')}
@@ -351,7 +394,9 @@ const Connections: React.FC = () => {
{t('connections.uploadAmount')}
{t('connections.downloadAmount')}
{t('connections.detail.dscp')}
- {t('connections.detail.remoteDestination')}
+
+ {t('connections.detail.remoteDestination')}
+
{t('connections.detail.dnsMode')}
diff --git a/src/renderer/src/pages/logs.tsx b/src/renderer/src/pages/logs.tsx
index 7b87c4d..555d10a 100644
--- a/src/renderer/src/pages/logs.tsx
+++ b/src/renderer/src/pages/logs.tsx
@@ -122,12 +122,7 @@ const Logs: React.FC = () => {
ref={virtuosoRef}
data={filteredLogs}
itemContent={(i, log) => (
-
+
)}
/>
diff --git a/src/renderer/src/pages/mihomo.tsx b/src/renderer/src/pages/mihomo.tsx
index 69cd945..f27526a 100644
--- a/src/renderer/src/pages/mihomo.tsx
+++ b/src/renderer/src/pages/mihomo.tsx
@@ -1,4 +1,20 @@
-import { Button, Divider, Input, Select, SelectItem, Switch, Tooltip, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter, useDisclosure, Spinner, Chip } from '@heroui/react'
+import {
+ Button,
+ Divider,
+ Input,
+ Select,
+ SelectItem,
+ Switch,
+ Tooltip,
+ Modal,
+ ModalContent,
+ ModalHeader,
+ ModalBody,
+ ModalFooter,
+ useDisclosure,
+ Spinner,
+ Chip
+} from '@heroui/react'
import BasePage from '@renderer/components/base/base-page'
import { toast } from '@renderer/components/base/toast'
import { showError } from '@renderer/utils/error-display'
@@ -8,7 +24,12 @@ import { useAppConfig } from '@renderer/hooks/use-app-config'
import { useControledMihomoConfig } from '@renderer/hooks/use-controled-mihomo-config'
import { platform } from '@renderer/utils/init'
import { FaNetworkWired } from 'react-icons/fa'
-import { IoMdCloudDownload, IoMdInformationCircleOutline, IoMdRefresh, IoMdShuffle } from 'react-icons/io'
+import {
+ IoMdCloudDownload,
+ IoMdInformationCircleOutline,
+ IoMdRefresh,
+ IoMdShuffle
+} from 'react-icons/io'
import PubSub from 'pubsub-js'
import {
mihomoUpgrade,
@@ -102,22 +123,22 @@ const Mihomo: React.FC = () => {
const [upgrading, setUpgrading] = useState(false)
const [lanOpen, setLanOpen] = useState(false)
const { isOpen, onOpen, onClose } = useDisclosure()
- const [tags, setTags] = useState<{name: string, zipball_url: string, tarball_url: string}[]>([])
+ const [tags, setTags] = useState<{ name: string; zipball_url: string; tarball_url: string }[]>([])
const [loadingTags, setLoadingTags] = useState(false)
const [selectedTag, setSelectedTag] = useState(specificVersion || '')
const [installing, setInstalling] = useState(false)
const [searchTerm, setSearchTerm] = useState('')
const [refreshing, setRefreshing] = useState(false)
-
+
// WebUI管理状态
const [isWebUIModalOpen, setIsWebUIModalOpen] = useState(false)
const [allPanels, setAllPanels] = useState
([])
const [editingPanel, setEditingPanel] = useState(null)
const [newPanelName, setNewPanelName] = useState('')
const [newPanelUrl, setNewPanelUrl] = useState('')
-
+
const urlInputRef = useRef(null)
-
+
// 解析主机和端口
const parseController = () => {
if (externalController) {
@@ -126,12 +147,12 @@ const Mihomo: React.FC = () => {
}
return { host: '127.0.0.1', port: '9090' }
}
-
+
const { host, port } = parseController()
-
+
// 生成随机端口(范围1024-65535)
const generateRandomPort = () => Math.floor(Math.random() * (65535 - 1024 + 1)) + 1024
-
+
// 默认WebUI面板选项
const defaultWebUIPanels: WebUIPanel[] = [
{
@@ -153,7 +174,7 @@ const Mihomo: React.FC = () => {
isDefault: true
}
]
-
+
// 初始化面板列表
useEffect(() => {
const savedPanels = localStorage.getItem('webui-panels')
@@ -163,28 +184,28 @@ const Mihomo: React.FC = () => {
setAllPanels(defaultWebUIPanels)
}
}, [])
-
+
// 保存面板列表到localStorage
useEffect(() => {
if (allPanels.length > 0) {
localStorage.setItem('webui-panels', JSON.stringify(allPanels))
}
}, [allPanels])
-
+
// 在URL输入框光标处插入或替换变量
const insertVariableAtCursor = (variable: string) => {
if (!urlInputRef.current) return
-
+
const input = urlInputRef.current
const start = input.selectionStart || 0
const end = input.selectionEnd || 0
const currentValue = newPanelUrl || ''
-
+
// 如果有选中文本，则替换选中的文本
const newValue = currentValue.substring(0, start) + variable + currentValue.substring(end)
-
+
setNewPanelUrl(newValue)
-
+
// 设置光标位置到插入变量之后
setTimeout(() => {
if (urlInputRef.current) {
@@ -194,16 +215,13 @@ const Mihomo: React.FC = () => {
}
}, 0)
}
-
+
// 打开WebUI面板
const openWebUI = (panel: WebUIPanel) => {
- const url = panel.url
- .replace('%host', host)
- .replace('%port', port)
- .replace('%secret', secret)
+ const url = panel.url.replace('%host', host).replace('%port', port).replace('%secret', secret)
window.open(url, '_blank')
}
-
+
// 添加新面板
const addNewPanel = () => {
if (newPanelName && newPanelUrl) {
@@ -218,14 +236,12 @@ const Mihomo: React.FC = () => {
setEditingPanel(null)
}
}
-
+
// 更新面板
const updatePanel = () => {
if (editingPanel && newPanelName && newPanelUrl) {
- const updatedPanels = allPanels.map(panel =>
- panel.id === editingPanel.id
- ? { ...panel, name: newPanelName, url: newPanelUrl }
- : panel
+ const updatedPanels = allPanels.map((panel) =>
+ panel.id === editingPanel.id ? { ...panel, name: newPanelName, url: newPanelUrl } : panel
)
setAllPanels(updatedPanels)
setEditingPanel(null)
@@ -233,35 +249,35 @@ const Mihomo: React.FC = () => {
setNewPanelUrl('')
}
}
-
+
// 删除面板
const deletePanel = (id: string) => {
- setAllPanels(allPanels.filter(panel => panel.id !== id))
+ setAllPanels(allPanels.filter((panel) => panel.id !== id))
}
-
+
// 开始编辑面板
const startEditing = (panel: WebUIPanel) => {
setEditingPanel(panel)
setNewPanelName(panel.name)
setNewPanelUrl(panel.url)
}
-
+
// 取消编辑
const cancelEditing = () => {
setEditingPanel(null)
setNewPanelName('')
setNewPanelUrl('')
}
-
+
// 恢复默认面板
const restoreDefaultPanels = () => {
setAllPanels(defaultWebUIPanels)
}
-
+
// 用于高亮显示URL中的变量
const HighlightedUrl: React.FC<{ url: string }> = ({ url }) => {
const parts = url.split(/(%host|%port|%secret)/g)
-
+
return (
{parts.map((part, index) => {
@@ -277,14 +293,14 @@ const Mihomo: React.FC = () => {
)
}
-
+
// 可点击的变量标签组件
- const ClickableVariableTag: React.FC<{
- variable: string;
- onClick: (variable: string) => void
+ const ClickableVariableTag: React.FC<{
+ variable: string
+ onClick: (variable: string) => void
}> = ({ variable, onClick }) => {
return (
- onClick(variable)}
>
@@ -292,7 +308,7 @@ const Mihomo: React.FC = () => {
)
}
-
+
const onChangeNeedRestart = async (patch: Partial): Promise => {
await patchControledMihomoConfig(patch)
await restartCore()
@@ -311,7 +327,7 @@ const Mihomo: React.FC = () => {
PubSub.publish('mihomo-core-changed')
}
}
-
+
// 获取GitHub标签列表（带缓存）
const fetchTags = async (forceRefresh = false) => {
setLoadingTags(true)
@@ -326,28 +342,28 @@ const Mihomo: React.FC = () => {
setLoadingTags(false)
}
}
-
+
// 安装特定版本的核心
const installSpecificCore = async () => {
if (!selectedTag) return
-
+
setInstalling(true)
try {
// 下载并安装特定版本的核心
await installSpecificMihomoCore(selectedTag)
-
+
// 更新应用配置
- await patchAppConfig({
+ await patchAppConfig({
core: 'mihomo-specific',
specificVersion: selectedTag
})
-
+
// 重启核心
await restartCore()
-
+
// 关闭模态框
onClose()
-
+
// 通知用户
new Notification(t('mihomo.coreUpgradeSuccess'))
} catch (error) {
@@ -357,7 +373,7 @@ const Mihomo: React.FC = () => {
setInstalling(false)
}
}
-
+
// 刷新标签列表
const refreshTags = async () => {
setRefreshing(true)
@@ -369,7 +385,7 @@ const Mihomo: React.FC = () => {
setRefreshing(false)
}
}
-
+
// 打开模态框时获取标签
const handleOpenModal = async () => {
onOpen()
@@ -377,40 +393,39 @@ const Mihomo: React.FC = () => {
if (tags.length === 0) {
await fetchTags(false) // 使用缓存
}
-
+
// 在后台检查更新
setTimeout(() => {
fetchTags(true) // 强制刷新
}, 100)
}
-
+
// 过滤标签
- const filteredTags = tags.filter(tag =>
+ const filteredTags = tags.filter((tag) =>
tag.name.toLowerCase().includes(searchTerm.toLowerCase())
)
-
+
// 当模态框打开时，确保选中当前版本
useEffect(() => {
if (isOpen && specificVersion) {
setSelectedTag(specificVersion)
}
}, [isOpen, specificVersion])
-
+
return (
<>
{lanOpen && setLanOpen(false)} />}
{/* Smart 内核设置 */}
-
-
+
+
{
>
-
@@ -519,12 +530,14 @@ const Mihomo: React.FC = () => {
className="w-[150px]"
size="sm"
aria-label={t('mihomo.selectCoreVersion')}
- selectedKeys={new Set([
- core
- ])}
+ selectedKeys={new Set([core])}
disallowEmptySelection={true}
onSelectionChange={async (v) => {
- const selectedCore = v.currentKey as 'mihomo' | 'mihomo-alpha' | 'mihomo-smart' | 'mihomo-specific'
+ const selectedCore = v.currentKey as
+ | 'mihomo'
+ | 'mihomo-alpha'
+ | 'mihomo-smart'
+ | 'mihomo-specific'
// 如果切换到特定版本但没有设置specificVersion，则打开选择模态框
if (selectedCore === 'mihomo-specific' && !specificVersion) {
handleOpenModal()
@@ -597,7 +610,6 @@ const Mihomo: React.FC = () => {
/>
-
@@ -635,11 +647,11 @@ const Mihomo: React.FC = () => {
-