fix: Fixed the issue that the region was displayed incorrectly when updating the cloud platform account

src/views/assets/Cloud/Account/components/AccountPanel.vue

@@ -19,10 +19,10 @@
     </el-row>
     <el-divider />
     <el-row :gutter="20" style="height: 80%;">
-      <el-col :span="5" class="image">
+      <el-col :span="6" class="image">
         <el-image :src="cloudImage" fit="contain" />
       </el-col>
-      <el-col :span="19">
+      <el-col :span="18">
         <InfoPanel :content="iTask.regions.length" :title="$tc('TotalSyncRegion')" />
         <InfoPanel :content="iTask.instance_count || 0" :title="$tc('TotalSyncAsset')" />
         <InfoPanel :content="iTask.strategy.length" :title="$tc('TotalSyncStrategy')" />
@@ -31,6 +31,7 @@
       </el-col>
     </el-row>
     <Dialog
+      v-if="updateVisible"
       :destroy-on-close="true"
       :show-buttons="false"
       :title="$tc('CloudAccountUpdate')"
@@ -41,6 +42,7 @@
         :object="object"
         :provider="object.provider.value"
         :visible.sync="updateVisible"
+        origin="update"
         @submitSuccess="onSubmitSuccess"
       />
     </Dialog>
@@ -112,6 +114,22 @@ export default {
       return ACCOUNT_PROVIDER_ATTRS_MAP[`${this.object.provider.value}`].image
     }
   },
+  watch: {
+    onlineSyncVisible: {
+      handler(newValue) {
+        if (newValue === false) {
+          this.$emit('refresh')
+        }
+      }
+    },
+    updateVisible: {
+      handler(newValue) {
+        if (newValue === false) {
+          this.$emit('refresh')
+        }
+      }
+    }
+  },
   methods: {
     toSafeLocalDateStr,
     handleDelete() {

src/views/assets/Cloud/Account/components/AuthPanel.vue

@@ -29,6 +29,10 @@ export default {
     object: {
       type: Object,
       default: () => {}
+    },
+    origin: {
+      type: String,
+      default: ''
     }
   },
   data() {
@@ -106,12 +110,12 @@ export default {
             el: {
               provider: this.provider,
               regions: this.object.task?.regions || [],
-              getAuthInfo: async() => {
+              getAuthInfo: () => {
                 if (this.object?.id) {
                   return this.object.id
                 }
                 const form = this.$refs.form.$refs.form.dataForm
-                await form.submitForm('form', true)
+                form.$refs.form.validate()
                 return form.getFormValue()['attrs']
               }
             }
@@ -161,8 +165,6 @@ export default {
       }
     }
   },
-  mounted() {
-  },
   methods: {
     submitForm(form, btn, submitType) {
       form.validate((valid) => {
@@ -171,6 +173,13 @@ export default {
         }
       })
       this.$refs.form.$refs.form.dataForm.submitForm('form', false)
+
+      if (this.origin === 'update') {
+        setTimeout(() => {
+          this.$emit('refresh')
+          this.$emit('update:visible', false)
+        }, 500)
+      }
       this.submitType = submitType
     },
     handleSubmitSuccess(res) {

src/views/assets/Cloud/Account/components/RegionPanel.vue

@@ -8,6 +8,7 @@
       {{ content }}
     </el-link>
     <Dialog
+      :destroy-on-close="true"
       :title="$tc('Region')"
       :visible.sync="regionVisible"
       :show-cancel="false"
@@ -78,11 +79,18 @@ export default {
     }
   },
   watch: {
-    checkedRegion() {
-      this.updateCheckedStatus()
+    regions: {
+      immediate: true,
+      handler(newVal) {
+        this.checkedRegion = newVal
+        this.refreshContent()
+      }
     }
   },
   mounted() {
+    if (this.regions) {
+      this.checkedRegion = this.regions
+    }
     this.refreshContent()
   },
   methods: {
@@ -95,7 +103,6 @@ export default {
       let method = 'get'
       let data = {}
       let url = `/api/v1/xpack/cloud/regions/?account_id=${authInfo}`
-
       if (typeof authInfo === 'object') {
         const attrs = JSON.parse(JSON.stringify(authInfo))
 
@@ -103,15 +110,13 @@ export default {
         url = `/api/v1/xpack/cloud/regions/?provider=${this.provider}`
         data = { 'attrs': encryptAttrsField(attrs) }
       }
+
       this.content = this.$t('Loading')
 
       this.$axios[method](url, data).then(resp => {
         this.allRegions = resp?.regions
-        console.log(Object.getOwnPropertyNames(data.attrs).length)
-        if (this.allRegions.length && Object.getOwnPropertyNames(data.attrs).length > 0) {
-          this.regionVisible = true
-          this.updateCheckedStatus()
-        }
+        this.regionVisible = true
+        this.updateCheckedStatus()
       }).catch(error => {
         this.$message.error(this.$tc('CloudRegionTip' + ' ' + error))
       }).finally(() => {