refactor: restructure DNS setting logic

src/components/setting/setting-clash.tsx

@@ -1,4 +1,4 @@
-import { useRef } from "react";
+import { useRef, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { TextField, Select, MenuItem, Typography } from "@mui/material";
 import {
@@ -22,6 +22,9 @@ import { updateGeoData } from "@/services/api";
 import { TooltipIcon } from "@/components/base/base-tooltip-icon";
 import { NetworkInterfaceViewer } from "./mods/network-interface-viewer";
 import { DnsViewer } from "./mods/dns-viewer";
+import { invoke } from "@tauri-apps/api/core";
+import { useLockFn } from "ahooks";
+import { useListen } from "@/hooks/use-listen";
 
 const isWIN = getSystem() === "windows";
 
@@ -45,6 +48,10 @@ const SettingClash = ({ onError }: Props) => {
 
   const { enable_random_port = false, verge_mixed_port } = verge ?? {};
 
+  // 独立跟踪DNS设置开关状态
+  const [dnsSettingsEnabled, setDnsSettingsEnabled] = useState(false);
+  const { addListener } = useListen();
+
   const webRef = useRef<DialogRef>(null);
   const portRef = useRef<DialogRef>(null);
   const ctrlRef = useRef<DialogRef>(null);
@@ -52,6 +59,12 @@ const SettingClash = ({ onError }: Props) => {
   const networkRef = useRef<DialogRef>(null);
   const dnsRef = useRef<DialogRef>(null);
 
+  // 初始化时从verge配置中加载DNS设置开关状态
+  useEffect(() => {
+    const dnsSettingsState = verge?.enable_dns_settings ?? false;
+    setDnsSettingsEnabled(dnsSettingsState);
+  }, [verge]);
+
   const onSwitchFormat = (_e: any, value: boolean) => value;
   const onChangeData = (patch: Partial<IConfigData>) => {
     mutateClash((old) => ({ ...(old! || {}), ...patch }), false);
@@ -68,6 +81,25 @@ const SettingClash = ({ onError }: Props) => {
     }
   };
 
+  // 实现DNS设置开关处理函数
+  const handleDnsToggle = useLockFn(async (enable: boolean) => {
+    try {
+      setDnsSettingsEnabled(enable);
+      await patchVerge({ enable_dns_settings: enable });
+      await invoke("apply_dns_config", { apply: enable });
+      setTimeout(() => {
+        mutateClash();
+      }, 500); // 延迟500ms确保后端完成处理
+    } catch (err: any) {
+      Notice.error(err.message || err.toString());
+      setDnsSettingsEnabled(!enable);
+      await patchVerge({ enable_dns_settings: !enable }).catch(() => {
+        // 忽略恢复状态时的错误
+      });
+      throw err;
+    }
+  });
+
   return (
     <SettingList title={t("Clash Setting")}>
       <WebUIViewer ref={webRef} />
@@ -111,16 +143,12 @@ const SettingClash = ({ onError }: Props) => {
           />
         }
       >
-        <GuardState
-          value={dns?.enable ?? false}
-          valueProps="checked"
-          onCatch={onError}
-          onFormat={onSwitchFormat}
-          onChange={(e) => onChangeData({ dns: { ...dns, enable: e } })}
-          onGuard={(e) => patchClash({ dns: { enable: e } })}
-        >
-          <Switch edge="end" />
-        </GuardState>
+        {/* 使用独立状态，不再依赖dns?.enable */}
+        <Switch
+          edge="end"
+          checked={dnsSettingsEnabled}
+          onChange={(_, checked) => handleDnsToggle(checked)}
+        />
       </SettingItem>
 
       <SettingItem label={t("IPv6")}>