createnetwork: Show tabs only when supported networks are determined (#901)

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
This commit is contained in:
davidjumani 2020-12-21 16:47:29 +05:30 committed by Rohit Yadav
parent 0e071c2e9c
commit 5ee41a51c9

View File

@ -16,9 +16,9 @@
// under the License. // under the License.
<template> <template>
<div class="form-layout"> <a-spin :spinning="loading" class="form-layout">
<a-tabs defaultActiveKey="1" :animated="false"> <a-tabs defaultActiveKey="1" :animated="false" v-if="!loading">
<a-tab-pane :tab="$t('label.isolated')" key="1" v-if="this.isAdvancedZoneWithoutSGAvailable()"> <a-tab-pane :tab="$t('label.isolated')" key="1" v-if="isAdvancedZoneWithoutSGAvailable">
<CreateIsolatedNetworkForm <CreateIsolatedNetworkForm
:loading="loading" :loading="loading"
:resource="resource" :resource="resource"
@ -43,7 +43,7 @@
@refresh="handleRefresh"/> @refresh="handleRefresh"/>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
</div> </a-spin>
</template> </template>
<script> <script>
@ -67,6 +67,7 @@ export default {
}, },
data () { data () {
return { return {
isAdvancedZoneWithoutSGAvailable: true,
defaultNetworkTypeTabKey: '1', defaultNetworkTypeTabKey: '1',
loading: false, loading: false,
actionZones: [], actionZones: [],
@ -78,40 +79,39 @@ export default {
this.fetchData() this.fetchData()
} }
}, },
mounted () { created () {
this.fetchData() const promises = []
promises.push(this.fetchActionZoneData())
Promise.all(promises).then(() => {
for (const i in this.actionZones) {
const zone = this.actionZones[i]
if (zone.networktype === 'Advanced' && zone.securitygroupsenabled !== true) {
this.isAdvancedZoneWithoutSGAvailable = true
return
}
}
this.isAdvancedZoneWithoutSGAvailable = false
})
}, },
methods: { methods: {
fetchData () {
this.loading = true
this.fetchActionZoneData()
},
isAdmin () { isAdmin () {
return ['Admin'].includes(this.$store.getters.userInfo.roletype) return ['Admin'].includes(this.$store.getters.userInfo.roletype)
}, },
fetchActionZoneData () { fetchActionZoneData () {
this.loading = true
const params = {} const params = {}
if (this.resource && this.resource.zoneid) { if (this.resource && this.resource.zoneid) {
params.id = this.resource.zoneid params.id = this.resource.zoneid
} }
params.listAll = true params.listAll = true
this.actionZonesLoading = true this.actionZonesLoading = true
api('listZones', params).then(json => { return api('listZones', params).then(json => {
this.actionZones = json.listzonesresponse.zone this.actionZones = json.listzonesresponse.zone
}).finally(() => { }).finally(() => {
this.actionZoneLoading = false this.actionZoneLoading = false
this.loading = false this.loading = false
}) })
}, },
isAdvancedZoneWithoutSGAvailable () {
for (const i in this.actionZones) {
const zone = this.actionZones[i]
if (zone.networktype === 'Advanced' && zone.securitygroupsenabled !== true) {
return true
}
}
return false
},
handleRefresh () { handleRefresh () {
this.fetchData() this.fetchData()
}, },