perf: ♻️ Support interruption during waiting for wireless connection

src/components/Device/components/WirelessGroup/index.vue

@@ -56,6 +56,7 @@
     >
     </el-input>
 
+    <el-button-group>
       <el-button
         type="primary"
         :icon="loading ? '' : 'Connection'"
@@ -66,6 +67,17 @@
         {{ $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>
 </template>
@@ -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,8 +243,10 @@ export default {
         this.handleSave(params)
       }
       catch (error) {
+        if (this.loading) {
           this.handleError(error?.message || error?.cause?.message || error)
         }
+      }
 
       this.loading = false
     },