adjust styles

src/main/resolve/init.ts

@@ -2,9 +2,7 @@ import {
   appConfigPath,
   controledMihomoConfigPath,
   dataDir,
-  exePath,
   logDir,
-  mihomoCorePath,
   mihomoTestDir,
   mihomoWorkDir,
   profileConfigPath,
@@ -25,7 +23,6 @@ import { startPacServer } from './server'
 import { triggerSysProxy } from './sysproxy'
 import { getAppConfig } from '../config'
 import { app } from 'electron'
-import { execSync } from 'child_process'
 
 function initDirs(): void {
   if (!fs.existsSync(dataDir)) {
@@ -85,38 +82,11 @@ function initDeeplink(): void {
   }
 }
 
-function initFirewall(): void {
-  const removeCommand = `
-  Remove-NetFirewallRule -DisplayName "mihomo" -ErrorAction SilentlyContinue
-  Remove-NetFirewallRule -DisplayName "mihomo-alpha" -ErrorAction SilentlyContinue
-  Remove-NetFirewallRule -DisplayName "Mihomo Party" -ErrorAction SilentlyContinue
-  `
-  const createCommand = `
-  New-NetFirewallRule -DisplayName "mihomo" -Direction Inbound -Action Allow -Program "${mihomoCorePath('mihomo')}" -Enabled True -Profile Any -ErrorAction SilentlyContinue
-  New-NetFirewallRule -DisplayName "mihomo-alpha" -Direction Inbound -Action Allow -Program "${mihomoCorePath('mihomo-alpha')}" -Enabled True -Profile Any -ErrorAction SilentlyContinue
-  New-NetFirewallRule -DisplayName "Mihomo Party" -Direction Inbound -Action Allow -Program "${exePath()}" -Enabled True -Profile Any -ErrorAction SilentlyContinue
-  `
-
-  if (process.platform === 'win32') {
-    try {
-      execSync(removeCommand, { shell: 'powershell' })
-    } catch {
-      console.log('Remove-NetFirewallRule Failed')
-    }
-    try {
-      execSync(createCommand, { shell: 'powershell' })
-    } catch {
-      console.log('New-NetFirewallRule Failed')
-    }
-  }
-}
-
 export function init(): void {
   initDirs()
   initConfig()
   initFiles()
   initDeeplink()
-  initFirewall()
   startPacServer().then(() => {
     triggerSysProxy(getAppConfig().sysProxy.enable)
   })

src/main/utils/ipc.ts

@@ -1,4 +1,4 @@
-import { app, ipcMain, safeStorage } from 'electron'
+import { app, dialog, ipcMain, safeStorage } from 'electron'
 import {
   mihomoChangeProxy,
   mihomoCloseAllConnections,
@@ -33,6 +33,8 @@ import {
 import { isEncryptionAvailable, startCore } from '../core/manager'
 import { triggerSysProxy } from '../resolve/sysproxy'
 import { checkUpdate } from '../resolve/autoUpdater'
+import { exePath, mihomoCorePath } from './dirs'
+import { execSync } from 'child_process'
 
 export function registerIpcMainHandlers(): void {
   ipcMain.handle('mihomoVersion', mihomoVersion)
@@ -71,5 +73,37 @@ export function registerIpcMainHandlers(): void {
   ipcMain.handle('checkUpdate', () => checkUpdate())
   ipcMain.handle('getVersion', () => app.getVersion())
   ipcMain.handle('platform', () => process.platform)
+  ipcMain.handle('setupFirewall', setupFirewall)
   ipcMain.handle('quitApp', () => app.quit())
 }
+
+async function setupFirewall(): Promise<void> {
+  return new Promise((resolve, reject) => {
+    const removeCommand = `
+  Remove-NetFirewallRule -DisplayName "mihomo" -ErrorAction SilentlyContinue
+  Remove-NetFirewallRule -DisplayName "mihomo-alpha" -ErrorAction SilentlyContinue
+  Remove-NetFirewallRule -DisplayName "Mihomo Party" -ErrorAction SilentlyContinue
+  `
+    const createCommand = `
+  New-NetFirewallRule -DisplayName "mihomo" -Direction Inbound -Action Allow -Program "${mihomoCorePath('mihomo')}" -Enabled True -Profile Any -ErrorAction SilentlyContinue
+  New-NetFirewallRule -DisplayName "mihomo-alpha" -Direction Inbound -Action Allow -Program "${mihomoCorePath('mihomo-alpha')}" -Enabled True -Profile Any -ErrorAction SilentlyContinue
+  New-NetFirewallRule -DisplayName "Mihomo Party" -Direction Inbound -Action Allow -Program "${exePath()}" -Enabled True -Profile Any -ErrorAction SilentlyContinue
+  `
+
+    if (process.platform === 'win32') {
+      try {
+        execSync(removeCommand, { shell: 'powershell' })
+      } catch {
+        console.log('Remove-NetFirewallRule Failed')
+      }
+      try {
+        execSync(createCommand, { shell: 'powershell' })
+      } catch (e) {
+        dialog.showErrorBox('防火墙设置失败', `${e}`)
+        reject(e)
+        console.log('New-NetFirewallRule Failed')
+      }
+    }
+    resolve()
+  })
+}

src/renderer/src/components/base/base-setting-item.tsx

@@ -1,9 +1,8 @@
-import { Button, Divider } from '@nextui-org/react'
-import { FaChevronRight } from 'react-icons/fa'
+import { Divider } from '@nextui-org/react'
+
 import React from 'react'
 
 interface Props {
-  onPress?: () => void
   title: React.ReactNode
   actions?: React.ReactNode
   children?: React.ReactNode
@@ -11,33 +10,20 @@ interface Props {
 }
 
 const SettingItem: React.FC<Props> = (props) => {
-  const { title, actions, children, divider = false, onPress } = props
-  if (onPress) {
-    return (
-      <>
-        <div className="p-0 m-0 h-[32px] w-full flex justify-between">
+  const { title, actions, children, divider = false } = props
+
+  return (
+    <>
+      <div className="h-[32px] w-full flex justify-between">
+        <div className="h-full flex items-center">
           <h4 className="h-full select-none text-md leading-[32px]">{title}</h4>
-          <Button size="sm" onPress={onPress}>
-            <FaChevronRight />
-          </Button>
+          <div>{actions}</div>
         </div>
-        {divider && <Divider className="my-2" />}
-      </>
-    )
-  } else {
-    return (
-      <>
-        <div className="h-[32px] w-full flex justify-between">
-          <div className="h-full flex items-center">
-            <h4 className="h-full select-none text-md leading-[32px]">{title}</h4>
-            <div>{actions}</div>
-          </div>
-          {children}
-        </div>
-        {divider && <Divider className="my-2" />}
-      </>
-    )
-  }
+        {children}
+      </div>
+      {divider && <Divider className="my-2" />}
+    </>
+  )
 }
 
 export default SettingItem

src/renderer/src/pages/settings.tsx

@@ -98,23 +98,30 @@ const Settings: React.FC = () => {
         </SettingItem>
       </SettingCard>
       <SettingCard>
-        <SettingItem
-          title="检查更新"
-          divider
-          onPress={() => {
-            checkUpdate().then((v) => {
-              if (v) {
-                new window.Notification(`v${v}版本已发布`, { body: '点击前往下载' }).onclick =
-                  (): void => {
-                    open(`https://github.com/pompurin404/mihomo-party/releases/tag/v${v}`)
-                  }
-              } else {
-                new window.Notification('当前已是最新版本', { body: '无需更新' })
-              }
-            })
-          }}
-        />
-        <SettingItem title="退出应用" onPress={quitApp} divider />
+        <SettingItem title="检查更新" divider>
+          <Button
+            size="sm"
+            onPress={() => {
+              checkUpdate().then((v) => {
+                if (v) {
+                  new window.Notification(`v${v}版本已发布`, { body: '点击前往下载' }).onclick =
+                    (): void => {
+                      open(`https://github.com/pompurin404/mihomo-party/releases/tag/v${v}`)
+                    }
+                } else {
+                  new window.Notification('当前已是最新版本', { body: '无需更新' })
+                }
+              })
+            }}
+          >
+            检查更新
+          </Button>
+        </SettingItem>
+        <SettingItem title="退出应用" divider>
+          <Button size="sm" onPress={quitApp}>
+            退出应用
+          </Button>
+        </SettingItem>
         <SettingItem title="应用版本">
           <div className="select-none">v{version}</div>
         </SettingItem>

src/renderer/src/pages/tun.tsx

@@ -3,13 +3,14 @@ import BasePage from '@renderer/components/base/base-page'
 import SettingCard from '@renderer/components/base/base-setting-card'
 import SettingItem from '@renderer/components/base/base-setting-item'
 import { useControledMihomoConfig } from '@renderer/hooks/use-controled-mihomo-config'
-import { restartCore } from '@renderer/utils/ipc'
+import { restartCore, setupFirewall } from '@renderer/utils/ipc'
 import { platform } from '@renderer/utils/init'
 import React, { Key, useState } from 'react'
 
 const Tun: React.FC = () => {
   const { controledMihomoConfig, patchControledMihomoConfig } = useControledMihomoConfig()
   const { tun } = controledMihomoConfig || {}
+  const [loading, setLoading] = useState(false)
   const {
     device = 'Mihomo',
     stack = 'mixed',
@@ -134,7 +135,7 @@ const Tun: React.FC = () => {
             }}
           />
         </SettingItem>
-        <SettingItem title="DNS 劫持">
+        <SettingItem title="DNS 劫持" divider>
           <Input
             size="sm"
             className="w-[50%]"
@@ -144,6 +145,19 @@ const Tun: React.FC = () => {
             }}
           />
         </SettingItem>
+        <SettingItem title="重设防火墙">
+          <Button
+            size="sm"
+            color="primary"
+            isLoading={loading}
+            onPress={() => {
+              setLoading(true)
+              setupFirewall().finally(() => setLoading(false))
+            }}
+          >
+            重设防火墙
+          </Button>
+        </SettingItem>
       </SettingCard>
     </BasePage>
   )

src/renderer/src/utils/ipc.ts

@@ -143,6 +143,10 @@ export async function getPlatform(): Promise<NodeJS.Platform> {
   return await window.electron.ipcRenderer.invoke('platform')
 }
 
+export async function setupFirewall(): Promise<void> {
+  return await window.electron.ipcRenderer.invoke('setupFirewall')
+}
+
 export async function quitApp(): Promise<void> {
   return await window.electron.ipcRenderer.invoke('quitApp')
 }