From 344b385d33010d9fcfc53e8759e9f6419bbbfba3 Mon Sep 17 00:00:00 2001
From: viarotel <viarotel@qq.com>
Date: Fri, 8 Nov 2024 14:15:49 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E2=99=BB=EF=B8=8F=20Support=20interrup?=
 =?UTF-8?q?tion=20during=20waiting=20for=20wireless=20connection?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Device/components/WirelessGroup/index.vue | 38 ++++++++++++++-----
 1 file changed, 28 insertions(+), 10 deletions(-)

diff --git a/src/components/Device/components/WirelessGroup/index.vue b/src/components/Device/components/WirelessGroup/index.vue
index 2d0b201..1f7b4bf 100644
--- a/src/components/Device/components/WirelessGroup/index.vue
+++ b/src/components/Device/components/WirelessGroup/index.vue
@@ -56,15 +56,27 @@
     >
     </el-input>
 
-    <el-button
-      type="primary"
-      :icon="loading ? '' : 'Connection'"
-      :loading="loading"
-      class="flex-none"
-      @click="handleConnect()"
-    >
-      {{ $t('device.wireless.connect.name') }}
-    </el-button>
+    <el-button-group>
+      <el-button
+        type="primary"
+        :icon="loading ? '' : 'Connection'"
+        :loading="loading"
+        class="flex-none"
+        @click="handleConnect()"
+      >
+        {{ $t('device.wireless.connect.name') }}
+      </el-button>
+
+      <el-button
+        v-if="loading"
+        type="default"
+        plain
+        class="flex-none"
+        @click="handleUnConnect()"
+      >
+        {{ $t('common.cancel') }}
+      </el-button>
+    </el-button-group>
 
     <PairDialog ref="pairDialog" @success="onPairSuccess" />
   </div>
@@ -209,6 +221,10 @@ export default {
       this.$message.warning(this.$t('device.wireless.connect.batch.error'))
     },
 
+    handleUnConnect() {
+      this.loading = false
+    },
+
     async handleConnect(params = this.formData) {
       if (!params.host) {
         this.$message.warning(
@@ -227,7 +243,9 @@ export default {
         this.handleSave(params)
       }
       catch (error) {
-        this.handleError(error?.message || error?.cause?.message || error)
+        if (this.loading) {
+          this.handleError(error?.message || error?.cause?.message || error)
+        }
       }
 
       this.loading = false