From 60fbc354d024eb2c0b5e6a85a104318542044ac9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E5=98=89=E4=BC=9F?= <8473136@qq.com>
Date: Sat, 7 Sep 2024 17:18:59 +0800
Subject: [PATCH] =?UTF-8?q?:sparkles:=20=E6=89=B9=E9=87=8F=E7=AB=AF?=
 =?UTF-8?q?=E5=8F=A3=E5=89=8D=E7=AB=AF=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/proxy/index.vue | 53 ++++++++++++++++++++++++++++++++++++---
 1 file changed, 50 insertions(+), 3 deletions(-)

diff --git a/src/views/proxy/index.vue b/src/views/proxy/index.vue
index 0331499..59bf7d5 100644
--- a/src/views/proxy/index.vue
+++ b/src/views/proxy/index.vue
@@ -41,8 +41,8 @@ const defaultForm = ref<Proxy>({
   name: "",
   type: "http",
   localIp: "",
-  localPort: 8080,
-  remotePort: 8080,
+  localPort: "8080",
+  remotePort: "8080",
   customDomains: [""],
   stcpModel: "visitors",
   serverName: "",
@@ -133,6 +133,40 @@ const editFormRules = reactive<FormRules>({
  */
 const editFormRef = ref<FormInstance>();
 
+const handleGetPortCount = (portString: string) => {
+  let count = 0;
+  const portRanges = portString.split(",");
+
+  portRanges.forEach(range => {
+    if (range.includes("-")) {
+      // 处理范围
+      const [start, end] = range.split("-").map(Number);
+      count += end - start + 1; // 包括起始和结束端口
+    } else {
+      // 处理单个端口
+      count += 1;
+    }
+  });
+
+  return count;
+};
+
+const handleRangePort = () => {
+  if (editForm.value.localPort.indexOf("-") !== -1) {
+    return true;
+  }
+  if (editForm.value.localPort.indexOf(",") !== -1) {
+    return true;
+  }
+  if (editForm.value.remotePort.indexOf("-") !== -1) {
+    return true;
+  }
+  if (editForm.value.remotePort.indexOf(",") !== -1) {
+    return true;
+  }
+  return false;
+};
+
 /**
  * 提交表单
  */
@@ -140,6 +174,18 @@ const handleSubmit = async () => {
   if (!editFormRef.value) return;
   await editFormRef.value.validate(valid => {
     if (valid) {
+      if (handleRangePort()) {
+        const lc = handleGetPortCount(editForm.value.localPort);
+        const rc = handleGetPortCount(editForm.value.remotePort);
+        console.log("范围端口 ", lc, rc);
+        if (lc !== rc) {
+          ElMessage({
+            type: "warning",
+            message: "请确保内网端口和外网端口数量一致"
+          });
+          return;
+        }
+      }
       loading.value.form = 1;
       const data = clone(editForm.value);
       if (data._id) {
@@ -290,7 +336,7 @@ const handleLoadLocalPorts = () => {
 };
 
 const handleSelectLocalPort = useDebounceFn((port: number) => {
-  editForm.value.localPort = port;
+  editForm.value.localPort = port?.toString();
   handleCloseLocalPortDialog();
 });
 
@@ -550,6 +596,7 @@ onUnmounted(() => {
       :title="edit.title"
       class="sm:w-[500px] md:w-[600px] lg:w-[800px]"
       top="5%"
+      @close="editForm = defaultForm"
     >
       <el-form
         v-loading="loading.form"