update

src/assets/styles/layout.scss

@@ -193,6 +193,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
+        text-align: center;
         color: #ffffff;
         background-color: #888888;
         border-radius: 9999px;
@@ -233,6 +234,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
+        text-align: center;
         color: #ffffff;
         background-color: #007aff;
         border-radius: 9999px;

src/locales/en.json

@@ -46,6 +46,7 @@
   "Update All Profiles": "Update All Profiles",
   "View Runtime Config": "View Runtime Config",
   "Reactivate Profiles": "Reactivate Profiles",
+  "Profiles Null": "Please import the Profiles below first",
   "Paste": "Paste",
   "Profile URL": "Profile URL",
   "Import": "Import",
@@ -181,6 +182,7 @@
   "Source": "Source",
   "Destination IP": "Destination IP",
   "Close Connection": "Close Connection",
+  "Quick Connection": "Quick Connection",
   "Rules": "Rules",
   "Rule Provider": "Rule Provider",
   "Quick": "Quick",

src/locales/fa.json

@@ -46,6 +46,7 @@
   "Update All Profiles": "به‌روزرسانی همه پروفایل‌ها",
   "View Runtime Config": "مشاهده پیکربندی زمان اجرا",
   "Reactivate Profiles": "فعال‌سازی مجدد پروفایل‌ها",
+  "Profiles Null": "لطفاً ابتدا آدرس اشتراک زیر را وارد کنید",
   "Paste": "چسباندن",
   "Profile URL": "آدرس پروفایل",
   "Import": "وارد کردن",
@@ -179,6 +180,7 @@
   "Source": "منبع",
   "Destination IP": "آدرس IP مقصد",
   "Close Connection": "بستن اتصال",
+  "Quick Connection": "نشانه ها چیست؟",
   "Rules": "قوانین",
   "Rule Provider": "تأمین‌کننده قانون",
   "Quick": "سريع",

src/locales/ru.json

@@ -46,6 +46,7 @@
   "Update All Profiles": "Обновить все профили",
   "View Runtime Config": "Просмотреть используемый конфиг",
   "Reactivate Profiles": "Реактивировать профили",
+  "Profiles Null": "Сначала импортируйте адрес подписки, указанный ниже",
   "Paste": "Вставить",
   "Profile URL": "URL профиля",
   "Import": "Импорт",
@@ -178,6 +179,7 @@
   "Time": "Время подключения",
   "Source": "Исходный адрес",
   "Destination IP": "IP-адрес назначения",
+  "Quick Connection": "быстрое соединение",
   "Close Connection": "Закрыть соединение",
   "Rules": "Правила",
   "Rule Provider": "Провайдер правило",

src/locales/zh.json

@@ -46,6 +46,7 @@
   "Update All Profiles": "更新所有订阅",
   "View Runtime Config": "查看运行时订阅",
   "Reactivate Profiles": "重新激活订阅",
+  "Profiles Null": "请先在下方导入订阅地址",
   "Paste": "粘贴",
   "Profile URL": "订阅文件链接",
   "Import": "导入",
@@ -180,6 +181,7 @@
   "Time": "连接时间",
   "Source": "源地址",
   "Destination IP": "目标地址",
+  "Quick Connection": "一键连接",
   "Close Connection": "关闭连接",
   "Rules": "规则",
   "Rule Provider": "规则集合",

src/pages/_layout.tsx

@@ -147,8 +147,8 @@ const Layout = () => {
                 <SvgIcon
                   component={isDark ? iconDark : iconLight}
                   style={{
-                    height: "36px",
-                    width: "36px",
+                    height: "32px",
+                    width: "32px",
                     marginTop: "-3px",
                     marginRight: "5px",
                     marginLeft: "-3px",

src/pages/_routers.tsx

@@ -23,17 +23,18 @@ import ForkRightRoundedIcon from "@mui/icons-material/ForkRightRounded";
 import SubjectRoundedIcon from "@mui/icons-material/SubjectRounded";
 import WifiTetheringRoundedIcon from "@mui/icons-material/WifiTetheringRounded";
 import SettingsRoundedIcon from "@mui/icons-material/SettingsRounded";
+import ElectricBoltIcon from "@mui/icons-material/ElectricBolt";
 
 export const routers = [
   {
     label: "Label-Quick",
-    path: "/quick",
-    icon: [<WifiRoundedIcon />, <ProxiesSvg />],
+    path: "/",
+    icon: [<ElectricBoltIcon />, <ProxiesSvg />],
     element: <QuickPage />,
   },
   {
     label: "Label-Proxies",
-    path: "/",
+    path: "/proxies",
     icon: [<WifiRoundedIcon />, <ProxiesSvg />],
     element: <ProxiesPage />,
   },

src/pages/quick.tsx

@@ -1,13 +1,25 @@
-import { useState, useMemo, useRef } from "react";
+import { useState, useMemo, useRef, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { Virtuoso } from "react-virtuoso";
-import { getRules, getClashConfig, closeAllConnections } from "@/services/api";
+import {
+  getRules,
+  getClashConfig,
+  closeAllConnections,
+  updateConfigs,
+} from "@/services/api";
 import { BaseEmpty, BasePage, Notice } from "@/components/base";
 import RuleItem from "@/components/rule/rule-item";
 import { ProviderButton } from "@/components/rule/provider-button";
 import { useCustomTheme } from "@/components/layout/use-custom-theme";
 import { BaseSearchBox } from "@/components/base/base-search-box";
-import { Box, Button, Grid, IconButton, Stack, Divider } from "@mui/material";
+import {
+  Box,
+  Button,
+  Grid,
+  IconButton,
+  Stack,
+  ButtonGroup,
+} from "@mui/material";
 import { BaseStyledTextField } from "@/components/base/base-styled-text-field";
 import { readText } from "@tauri-apps/api/clipboard";
 import {
@@ -42,6 +54,7 @@ import {
   installService,
   uninstallService,
   checkService,
+  patchClashConfig,
 } from "@/services/cmds";
 import {
   DndContext,
@@ -158,6 +171,8 @@ const QuickPage = () => {
     return profileItems;
   }, [profiles]);
 
+  const isEmpty = profileItems.length === 0;
+
   const currentActivatings = () => {
     return [...new Set([profiles.current ?? ""])].filter(Boolean);
   };
@@ -233,9 +248,10 @@ const QuickPage = () => {
   );
 
   const isWindows = getSystem() === "windows";
-  const isActive = status === "active";
-  const isInstalled = status === "installed";
-  const isUninstall = status === "uninstall" || status === "unknown";
+  const isActive = serviceStatus === "active";
+  const isInstalled = serviceStatus === "installed";
+  const isUninstall =
+    serviceStatus === "uninstall" || serviceStatus === "unknown";
   const [serviceLoading, setServiceLoading] = useState(false);
   const [openInstall, setOpenInstall] = useState(false);
   const [openUninstall, setOpenUninstall] = useState(false);
@@ -317,31 +333,63 @@ const QuickPage = () => {
     }
   });
 
-  const {
-    enable_tun_mode,
-    enable_auto_launch,
-    enable_silent_start,
-    enable_system_proxy,
-    enable_service_mode,
-  } = verge ?? {};
-
-  const link = () => {
-    onInstallOrEnableService();
-    onChangeData({ enable_tun_mode: true });
-    patchVerge({ enable_tun_mode: true });
-    onChangeData({ enable_system_proxy: true });
-    patchVerge({ enable_system_proxy: true });
+  const [result, setResult] = useState(false);
+
+  useEffect(() => {
+    if (data) {
+      const { enable_tun_mode, enable_system_proxy, enable_service_mode } =
+        verge ?? {};
+
+      // 当 enable_tun_mode, enable_system_proxy, enable_service_mode 同为 true 时，result 为 true
+      // 否则，result 为 false
+      // setResult(enable_tun_mode && enable_system_proxy && enable_service_mode);
+      setResult(
+        !!(enable_tun_mode && enable_system_proxy && enable_service_mode)
+      );
+    }
+  }, [data]);
+
+  const link = async () => {
+    if (!isEmpty) {
+      onInstallOrEnableService();
+      await patchVerge({ enable_service_mode: true });
+      onChangeData({ enable_service_mode: true });
+      onChangeData({ enable_tun_mode: true });
+      patchVerge({ enable_tun_mode: true });
+      onChangeData({ enable_system_proxy: true });
+      patchVerge({ enable_system_proxy: true });
+      setResult(true);
+    } else {
+      Notice.error(t("Profiles Null"));
+    }
   };
 
   const cancelink = async () => {
-    await patchVerge({ enable_service_mode: !isActive });
-    onChangeData({ enable_service_mode: !isActive });
+    await patchVerge({ enable_service_mode: false });
+    onChangeData({ enable_service_mode: false });
     onChangeData({ enable_tun_mode: false });
     patchVerge({ enable_tun_mode: false });
     onChangeData({ enable_system_proxy: false });
     patchVerge({ enable_system_proxy: false });
+    setResult(false);
   };
 
+  const modeList = ["rule", "global", "direct"];
+  const onChangeMode = useLockFn(async (mode: string) => {
+    // 断开连接
+    if (mode !== curMode && verge?.auto_close_connection) {
+      closeAllConnections();
+    }
+    await updateConfigs({ mode });
+    await patchClashConfig({ mode });
+    mutateClash();
+  });
+  useEffect(() => {
+    if (curMode && !modeList.includes(curMode)) {
+      onChangeMode("rule");
+    }
+  }, [curMode]);
+
   return (
     <BasePage
       title={t("Quick")}
@@ -349,15 +397,28 @@ const QuickPage = () => {
       header={
         <Box display="flex" alignItems="center" gap={1}>
           <ProviderButton />
+
+          <ButtonGroup size="small">
+            {modeList.map((mode) => (
+              <Button
+                key={mode}
+                variant={mode === curMode ? "contained" : "outlined"}
+                onClick={() => onChangeMode(mode)}
+                sx={{ textTransform: "capitalize" }}
+              >
+                {t(mode)}
+              </Button>
+            ))}
+          </ButtonGroup>
         </Box>
       }
     >
       <div className="quickCon">
-        {enable_system_proxy && enable_tun_mode && enable_service_mode ? (
+        {result ? (
           <div className="aquickCon1">
             <div className="aquickCon2">
               <div className="aquick" onClick={cancelink}>
-                取消连接
+                {t("Close Connection")}
               </div>
             </div>
           </div>
@@ -365,7 +426,7 @@ const QuickPage = () => {
           <div className="quickCon1">
             <div className="quickCon2">
               <div className="quick" onClick={link}>
-                一键连接
+                {t("Quick Connection")}
               </div>
             </div>
           </div>
@@ -422,14 +483,6 @@ const QuickPage = () => {
         >
           {t("Import")}
         </LoadingButton>
-        <Button
-          variant="contained"
-          size="small"
-          sx={{ borderRadius: "6px" }}
-          onClick={() => viewerRef.current?.create()}
-        >
-          {t("New")}
-        </Button>
       </Stack>
       <Box
         sx={{