Show security group selection in Basic zone VM deployment and fix SG listing for cross-domain deployments (apache#12775)

Author: Damans227

ui/src/views/compute/DeployVM.vue

@@ -459,6 +459,9 @@
                     :value="securitygroupids"
                     :loading="loading.networks"
                     :preFillContent="dataPreFill"
+                    :domainId="owner.domainid"
+                    :account="owner.account"
+                    :projectId="owner.projectid"
                     @select-security-group-item="($event) => updateSecurityGroups($event)"></security-group-selection>
                 </template>
               </a-step>
@@ -1501,6 +1504,9 @@ export default {
       return tabList
     },
     showSecurityGroupSection () {
+      if (this.zone && this.zone.networktype === 'Basic') {
+        return true
+      }
       if (this.networks.length < 1) {
         return false
       }

ui/src/views/compute/wizard/SecurityGroupSelection.vue

@@ -75,6 +75,18 @@ export default {
     preFillContent: {
       type: Object,
       default: () => {}
+    },
+    domainId: {
+      type: String,
+      default: () => ''
+    },
+    account: {
+      type: String,
+      default: () => ''
+    },
+    projectId: {
+      type: String,
+      default: () => ''
     }
   },
   data () {
@@ -102,6 +114,9 @@ export default {
     }
   },
   computed: {
+    ownerParams () {
+      return `${this.domainId}-${this.account}-${this.projectId}`
+    },
     rowSelection () {
       return {
         type: 'checkbox',
@@ -121,6 +136,11 @@ export default {
         this.selectedRowKeys = newValue
       }
     },
+    ownerParams () {
+      this.selectedRowKeys = []
+      this.$emit('select-security-group-item', null)
+      this.fetchData()
+    },
     loading () {
       if (!this.loading) {
         if (this.preFillContent.securitygroupids) {
@@ -140,9 +160,9 @@ export default {
   methods: {
     fetchData () {
       const params = {
-        projectid: this.$store.getters.project ? this.$store.getters.project.id : null,
-        domainid: this.$store.getters.project && this.$store.getters.project.id ? null : this.$store.getters.userInfo.domainid,
-        account: this.$store.getters.project && this.$store.getters.project.id ? null : this.$store.getters.userInfo.account,
+        projectid: this.projectId || (this.$store.getters.project ? this.$store.getters.project.id : null),
+        domainid: this.projectId || (this.$store.getters.project && this.$store.getters.project.id) ? null : (this.domainId || this.$store.getters.userInfo.domainid),
+        account: this.projectId || (this.$store.getters.project && this.$store.getters.project.id) ? null : (this.account || this.$store.getters.userInfo.account),
         page: this.page,
         pageSize: this.pageSize
       }