You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cloudstack.apache.org by ro...@apache.org on 2021/07/27 09:32:11 UTC
[cloudstack] branch 4.15 updated: ui: fix create shared network
with multi-zone (#5205)
This is an automated email from the ASF dual-hosted git repository.
rohit pushed a commit to branch 4.15
in repository https://gitbox.apache.org/repos/asf/cloudstack.git
The following commit(s) were added to refs/heads/4.15 by this push:
new 8ed5a4f ui: fix create shared network with multi-zone (#5205)
8ed5a4f is described below
commit 8ed5a4fae6de0cc8a59beb795ae737ecc74d1201
Author: Abhishek Kumar <ab...@gmail.com>
AuthorDate: Tue Jul 27 15:01:54 2021 +0530
ui: fix create shared network with multi-zone (#5205)
Fixes create shared network form for multi-zone environments.
Signed-off-by: Abhishek Kumar <ab...@gmail.com>
---
ui/src/views/network/CreateSharedNetworkForm.vue | 70 ++++++++++++++----------
1 file changed, 40 insertions(+), 30 deletions(-)
diff --git a/ui/src/views/network/CreateSharedNetworkForm.vue b/ui/src/views/network/CreateSharedNetworkForm.vue
index d2356db..b45c251 100644
--- a/ui/src/views/network/CreateSharedNetworkForm.vue
+++ b/ui/src/views/network/CreateSharedNetworkForm.vue
@@ -93,7 +93,7 @@
:filterOption="(input, option) => {
return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
}"
- :loading="zoneLoading"
+ :loading="formPhysicalNetworkLoading"
:placeholder="this.$t('label.physicalnetworkid')"
@change="val => { this.handlePhysicalNetworkChange(this.formPhysicalNetworks[val]) }">
<a-select-option v-for="(opt, optIndex) in this.formPhysicalNetworks" :key="optIndex">
@@ -542,57 +542,67 @@ export default {
this.fetchPhysicalNetworkData()
},
fetchPhysicalNetworkData () {
+ this.formSelectedPhysicalNetwork = {}
+ this.formPhysicalNetworks = []
if (this.physicalNetworks != null) {
this.formPhysicalNetworks = this.physicalNetworks
- if (this.arrayHasItems(this.formPhysicalNetworks)) {
- this.form.setFieldsValue({
- physicalnetworkid: 0
- })
- this.handlePhysicalNetworkChange(this.formPhysicalNetworks[0])
- }
+ this.selectFirstPhysicalNetwork()
} else {
if (this.selectedZone === null || this.selectedZone === undefined) {
return
}
- const params = {}
- params.zoneid = this.selectedZone.id
- this.formPhysicalNetworksLoading = true
+ const promises = []
+ const params = {
+ zoneid: this.selectedZone.id
+ }
+ this.formPhysicalNetworkLoading = true
api('listPhysicalNetworks', params).then(json => {
- this.formPhysicalNetworks = []
var networks = json.listphysicalnetworksresponse.physicalnetwork
if (this.arrayHasItems(networks)) {
- for (const i in networks) {
- this.addPhysicalNetworkForGuestTrafficType(networks[i])
+ for (const network of networks) {
+ promises.push(this.addPhysicalNetworkForGuestTrafficType(network))
}
} else {
this.formPhysicalNetworkLoading = false
}
}).finally(() => {
+ if (this.arrayHasItems(promises)) {
+ Promise.all(promises).catch(error => {
+ this.$notifyError(error)
+ }).finally(() => {
+ this.formPhysicalNetworkLoading = false
+ this.selectFirstPhysicalNetwork()
+ })
+ }
+ })
+ }
+ },
+ selectFirstPhysicalNetwork () {
+ if (this.arrayHasItems(this.formPhysicalNetworks)) {
+ this.form.setFieldsValue({
+ physicalnetworkid: 0
})
+ this.handlePhysicalNetworkChange(this.formPhysicalNetworks[0])
}
},
addPhysicalNetworkForGuestTrafficType (physicalNetwork) {
const params = {}
params.physicalnetworkid = physicalNetwork.id
- api('listTrafficTypes', params).then(json => {
- var trafficTypes = json.listtraffictypesresponse.traffictype
- if (this.arrayHasItems(trafficTypes)) {
- for (const i in trafficTypes) {
- if (trafficTypes[i].traffictype === 'Guest') {
- this.formPhysicalNetworks.push(physicalNetwork)
- break
+ return new Promise((resolve, reject) => {
+ api('listTrafficTypes', params).then(json => {
+ var trafficTypes = json.listtraffictypesresponse.traffictype
+ if (this.arrayHasItems(trafficTypes)) {
+ for (const type of trafficTypes) {
+ if (type.traffictype === 'Guest') {
+ this.formPhysicalNetworks.push(physicalNetwork)
+ break
+ }
}
}
- } else {
- this.formPhysicalNetworkLoading = false
- }
- }).finally(() => {
- if (this.formPhysicalNetworks.length > 0 && this.isObjectEmpty(this.formSelectedPhysicalNetwork)) {
- this.form.setFieldsValue({
- physicalnetworkid: 0
- })
- this.handlePhysicalNetworkChange(this.formPhysicalNetworks[0])
- }
+ resolve()
+ }).catch(error => {
+ reject(error)
+ })
})
},
handlePhysicalNetworkChange (physicalNet) {