✨ 生成代理名称

src/components/IconifyIcon/src/offlineIcon.ts

@@ -35,6 +35,7 @@ import downloadRounded from "@iconify-icons/material-symbols/download-rounded";
 import deviceReset from "@iconify-icons/material-symbols/device-reset";
 import switchAccessOutlineRounded from "@iconify-icons/material-symbols/switch-access-outline-rounded";
 import switchAccessRounded from "@iconify-icons/material-symbols/switch-access-rounded";
+import chargerRounded from "@iconify-icons/material-symbols/charger-rounded";
 
 addIcon("cloud", Cloud);
 addIcon("rocket-launch-rounded", RocketLaunchRounded);
@@ -46,6 +47,7 @@ addIcon("refresh-rounded", refreshRounded);
 addIcon("more-vert", MoreVert);
 addIcon("add", Add);
 addIcon("bring-your-own-ip-rounded", BringYourOwnIpRounded);
+addIcon("charger-rounded", chargerRounded);
 addIcon("delete-rounded", DeleteRounded);
 addIcon("cancel-presentation", CancelPresentation);
 addIcon("gesture-select", GestureSelect);

src/views/proxy/index.vue

@@ -11,7 +11,7 @@ import Breadcrumb from "@/layout/compoenets/Breadcrumb.vue";
 import { ElMessage, FormInstance, FormRules } from "element-plus";
 import { ipcRenderer } from "electron";
 import { clone } from "@/utils/clone";
-import { useClipboard, useDebounceFn } from "@vueuse/core";
+import { formatDate, useClipboard, useDebounceFn } from "@vueuse/core";
 import IconifyIconOffline from "@/components/IconifyIcon/src/iconifyIconOffline";
 import commonIps from "./commonIp.json";
 import router from "@/router";
@@ -529,6 +529,17 @@ const handleIpFetchSuggestions = (queryString: string, cb: any) => {
   cb(auto);
 };
 
+const handleRandomProxyName = () => {
+  const characters =
+    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let result = "";
+  for (let i = 0; i < 5; i++) {
+    const randomIndex = Math.floor(Math.random() * characters.length);
+    result += characters[randomIndex];
+  }
+  editForm.value.name = `df-${editForm.value.type}-${result}`.toUpperCase();
+};
+
 onMounted(() => {
   handleInitHook();
   handleLoadProxys();
@@ -827,13 +838,26 @@ onUnmounted(() => {
               </el-form-item>
             </el-col>
           </template>
-          <el-col :span="isStcpVisitors ? 12 : 24">
+          <el-col :span="24">
             <el-form-item label="代理名称：" prop="name">
               <el-input
                 v-model="editForm.name"
+                class="proxy-name-input"
                 placeholder="代理名称"
                 clearable
               />
+              <el-button
+                class="ml-[10px]"
+                plain
+                type="primary"
+                @click="handleRandomProxyName"
+              >
+                <IconifyIconOffline
+                  class="cursor-pointer mr-2"
+                  icon="charger-rounded"
+                />
+                生成
+              </el-button>
             </el-form-item>
           </el-col>
           <template v-if="!(isStcp || isXtcp) || isStcpVisited">
@@ -1219,7 +1243,11 @@ onUnmounted(() => {
 }
 
 .local-port-input {
-  width: calc(100% - 125px);
+  width: calc(100% - 120px);
+}
+
+.proxy-name-input {
+  width: calc(100% - 92px);
 }
 
 .domain-input-button {