Skip to content

Commit

Permalink
UI - Deploy VM with params from the template, iso, network pages (#5653)
Browse files Browse the repository at this point in the history
* deploy VM with params from the template, iso, network pages

* remove default-checked not necessary
  • Loading branch information
Hoang Nguyen committed Jan 13, 2022
1 parent d78a815 commit 001f421
Show file tree
Hide file tree
Showing 3 changed files with 148 additions and 38 deletions.
18 changes: 17 additions & 1 deletion ui/src/views/AutogenView.vue
Expand Up @@ -976,7 +976,23 @@ export default {
this.form = this.$form.createForm(this)
this.formModel = {}
if (action.component && action.api && !action.popup) {
this.$router.push({ name: action.api })
const query = {}
if (this.$route.path.startsWith('/vm')) {
switch (true) {
case ('templateid' in this.$route.query):
query.templateid = this.$route.query.templateid
break
case ('isoid' in this.$route.query):
query.isoid = this.$route.query.isoid
break
case ('networkid' in this.$route.query):
query.networkid = this.$route.query.networkid
break
default:
break
}
}
this.$router.push({ name: action.api, query })
return
}
this.currentAction = action
Expand Down
164 changes: 131 additions & 33 deletions ui/src/views/compute/DeployVM.vue
Expand Up @@ -64,6 +64,7 @@
<a-select
v-else
v-decorator="['zoneid', {
initialValue: selectedZone,
rules: [{ required: true, message: `${$t('message.error.select')}` }]
}]"
showSearch
Expand Down Expand Up @@ -767,8 +768,8 @@ export default {
disksize: null
},
options: {
templates: [],
isos: [],
templates: {},
isos: {},
hypervisors: [],
serviceOfferings: [],
diskOfferings: [],
Expand Down Expand Up @@ -834,16 +835,6 @@ export default {
defaultnetworkid: '',
networkConfig: [],
dataNetworkCreated: [],
tabList: [
{
key: 'templateid',
tab: this.$t('label.templates')
},
{
key: 'isoid',
tab: this.$t('label.isos')
}
],
tabKey: 'templateid',
dataPreFill: {},
showDetails: false,
Expand Down Expand Up @@ -1054,9 +1045,40 @@ export default {
templateConfigurationExists () {
return this.vm.templateid && this.templateConfigurations && this.templateConfigurations.length > 0
},
templateId () {
return this.$route.query.templateid || null
},
isoId () {
return this.$route.query.isoid || null
},
networkId () {
return this.$route.query.networkid || null
},
tabList () {
let tabList = []
if (this.templateId) {
tabList = [{
key: 'templateid',
tab: this.$t('label.templates')
}]
} else if (this.isoId) {
tabList = [{
key: 'isoid',
tab: this.$t('label.isos')
}]
} else {
tabList = [{
key: 'templateid',
tab: this.$t('label.templates')
},
{
key: 'isoid',
tab: this.$t('label.isos')
}]
}
return tabList
},
showSecurityGroupSection () {
return (this.networks.length > 0 && this.zone.securitygroupsenabled) || (this.zone && this.zone.networktype === 'Basic')
},
Expand Down Expand Up @@ -1275,12 +1297,57 @@ export default {
},
fillValue (field) {
this.form.getFieldDecorator([field], { initialValue: this.dataPreFill[field] })
this.form.setFieldsValue({ [field]: this.dataPreFill[field] })
},
fetchZoneByQuery () {
return new Promise(resolve => {
let zones = []
let apiName = ''
const params = {}
if (this.templateId) {
apiName = 'listTemplates'
params.listall = true
params.templatefilter = 'all'
params.id = this.templateId
} else if (this.isoId) {
params.listall = true
params.isofilter = 'all'
params.id = this.isoId
apiName = 'listIsos'
} else if (this.networkId) {
params.listall = true
params.id = this.networkId
apiName = 'listNetworks'
}
api(apiName, params).then(json => {
let objectName
const responseName = [apiName.toLowerCase(), 'response'].join('')
for (const key in json[responseName]) {
if (key === 'count') {
continue
}
objectName = key
break
}
const data = json?.[responseName]?.[objectName] || []
zones = data.map(item => item.zoneid)
return resolve(zones)
}).catch(() => {
return resolve(zones)
})
})
},
fetchData () {
this.fetchZones()
async fetchData () {
const zones = await this.fetchZoneByQuery()
if (zones && zones.length === 1) {
this.selectedZone = zones[0]
this.dataPreFill.zoneid = zones[0]
}
if (this.dataPreFill.zoneid) {
this.fetchDataByZone(this.dataPreFill.zoneid)
} else {
this.fetchZones(null, zones)
_.each(this.params, (param, name) => {
if (param.isLoad) {
this.fetchOptions(param, name)
Expand All @@ -1304,16 +1371,8 @@ export default {
},
async fetchDataByZone (zoneId) {
this.fillValue('zoneid')
this.options.zones = await this.fetchZones()
this.zoneId = zoneId
this.zoneSelected = true
this.tabKey = 'templateid'
await _.each(this.params, (param, name) => {
if (!('isLoad' in param) || param.isLoad) {
this.fetchOptions(param, name, ['zones'])
}
})
await this.fetchAllTemplates()
this.options.zones = await this.fetchZones(zoneId)
this.onSelectZoneId(zoneId)
},
fetchBootTypes () {
this.options.bootTypes = [
Expand Down Expand Up @@ -1352,7 +1411,25 @@ export default {
this.fetchOptions(param, 'networks')
},
resetData () {
this.vm = {}
this.vm = {
name: null,
zoneid: null,
zonename: null,
hypervisor: null,
templateid: null,
templatename: null,
keyboard: null,
keypair: null,
group: null,
affinitygroupids: [],
affinitygroup: [],
serviceofferingid: null,
serviceofferingname: null,
ostypeid: null,
ostypename: null,
rootdisksize: null,
disksize: null
}
this.zoneSelected = false
this.form.resetFields()
this.fetchData()
Expand Down Expand Up @@ -1734,12 +1811,25 @@ export default {
})
})
},
fetchZones () {
fetchZones (zoneId, listZoneAllow) {
this.zones = []
return new Promise((resolve) => {
this.loading.zones = true
const param = this.params.zones
api(param.list, { listall: true, showicon: true }).then(json => {
this.zones = json.listzonesresponse.zone || []
const args = { listall: true, showicon: true }
if (zoneId) args.id = zoneId
api(param.list, args).then(json => {
const zoneResponse = json.listzonesresponse.zone || []
if (listZoneAllow && listZoneAllow.length > 0) {
zoneResponse.map(zone => {
if (listZoneAllow.includes(zone.id)) {
this.zones.push(zone)
}
})
} else {
this.zones = zoneResponse
}
resolve(this.zones)
}).catch(function (error) {
console.log(error.stack)
Expand Down Expand Up @@ -1821,6 +1911,7 @@ export default {
args.templatefilter = templateFilter
args.details = 'all'
args.showicon = 'true'
args.id = this.templateId
return new Promise((resolve, reject) => {
api('listTemplates', args).then((response) => {
Expand All @@ -1841,6 +1932,7 @@ export default {
args.isoFilter = isoFilter
args.bootable = true
args.showicon = 'true'
args.id = this.isoId
return new Promise((resolve, reject) => {
api('listIsos', args).then((response) => {
Expand Down Expand Up @@ -1894,10 +1986,9 @@ export default {
})
},
filterOption (input, option) {
console.log(option)
// return (
// option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0
// )
return (
option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0
)
},
onSelectZoneId (value) {
this.dataPreFill = {}
Expand All @@ -1916,6 +2007,9 @@ export default {
isoid: undefined
})
this.tabKey = 'templateid'
if (this.isoId) {
this.tabKey = 'isoid'
}
_.each(this.params, (param, name) => {
if (this.networkId && name === 'networks') {
param.options = {
Expand All @@ -1926,7 +2020,11 @@ export default {
this.fetchOptions(param, name, ['zones'])
}
})
this.fetchAllTemplates()
if (this.tabKey === 'templateid') {
this.fetchAllTemplates()
} else {
this.fetchAllIsos()
}
},
onSelectPodId (value) {
this.podId = value
Expand Down
4 changes: 0 additions & 4 deletions ui/src/views/compute/wizard/TemplateIsoSelection.vue
Expand Up @@ -64,10 +64,6 @@ export default {
type: String,
default: ''
},
selected: {
type: String,
default: ''
},
loading: {
type: Boolean,
default: false
Expand Down

0 comments on commit 001f421

Please sign in to comment.