deployvm: Showing additoinal fields in infocard (#664)

* deployvm: Showing additoinal fields in infocard

* Cosmetic changes

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
This commit is contained in:
davidjumani 2020-09-09 15:36:31 +05:30 committed by Rohit Yadav
parent c697322bad
commit 4a8babb185
2 changed files with 63 additions and 20 deletions

View File

@ -32,7 +32,7 @@
<div v-if="['USER.LOGIN', 'USER.LOGOUT', 'ROUTER.HEALTH.CHECKS', 'FIREWALL.CLOSE', 'ALERT.SERVICE.DOMAINROUTER'].includes(resource.name)">{{ $t(resource.name.toLowerCase()) }}</div>
<div v-else>
<h4 class="name">
{{ resource.displayname || resource.displaytext || resource.name || resource.hostname || resource.username || resource.ipaddress || resource.virtualmachinename || resource.templatetype }}
{{ resource.displayname || resource.displaytext || resource.name || resource.username || resource.ipaddress || resource.virtualmachinename || resource.templatetype }}
</h4>
<console style="margin-left: 10px" :resource="resource" size="default" v-if="resource.id" />
</div>
@ -121,12 +121,12 @@
<span style="margin-left: 8px">{{ resource.ostypename }}</span>
</div>
</div>
<div class="resource-detail-item" v-if="(resource.cpunumber && resource.cpuspeed) || resource.cputotal">
<div class="resource-detail-item" v-if="('cpunumber' in resource && 'cpuspeed' in resource) || resource.cputotal">
<div class="resource-detail-item__label">{{ $t('label.cpu') }}</div>
<div class="resource-detail-item__details">
<a-icon type="appstore" />
<span v-if="resource.cpunumber && resource.cpuspeed">{{ resource.cpunumber }} CPU x {{ parseFloat(resource.cpuspeed / 1000.0).toFixed(2) }} Ghz</span>
<span v-else-if="resource.cputotal">{{ resource.cputotal }}</span>
<span v-if="resource.cputotal">{{ resource.cputotal }}</span>
<span v-else>{{ resource.cpunumber }} CPU x {{ parseFloat(resource.cpuspeed / 1000.0).toFixed(2) }} Ghz</span>
</div>
<div>
<span v-if="resource.cpuused">
@ -149,7 +149,7 @@
</span>
</div>
</div>
<div class="resource-detail-item" v-if="resource.memory">
<div class="resource-detail-item" v-if="'memory' in resource">
<div class="resource-detail-item__label">{{ $t('label.memory') }}</div>
<div class="resource-detail-item__details">
<a-icon type="bulb" />{{ resource.memory + ' ' + $t('label.mb.memory') }}
@ -280,6 +280,19 @@
</div>
</div>
</div>
<div class="resource-detail-item" v-if="resource.networks && resource.networks.length > 0">
<div class="resource-detail-item__label">{{ $t('label.networks') }}</div>
<div class="resource-detail-item__details resource-detail-item__details--start">
<div>
<div
v-for="network in resource.networks"
:key="network.id"
style="margin-top: 5px;">
<a-icon type="api" />{{ network.name }}
</div>
</div>
</div>
</div>
<div class="resource-detail-item" v-if="resource.ipaddress">
<div class="resource-detail-item__label">{{ $t('label.ip') }}</div>
<div class="resource-detail-item__details">

View File

@ -570,19 +570,7 @@
</a-col>
<a-col :md="24" :lg="7" v-if="!isMobile()">
<a-affix :offsetTop="75">
<info-card class="vm-info-card" :resource="vm" :title="this.$t('label.yourinstance')">
<!-- ToDo: Refactor this, maybe move everything to the info-card component -->
<div slot="details" v-if="diskSize" style="margin-bottom: 12px;">
<a-icon type="hdd"></a-icon>
<span style="margin-left: 10px">{{ diskSize }}</span>
</div>
<div slot="details" v-if="networks">
<div v-for="network in networks" :key="network.id" style="margin-bottom: 12px;">
<a-icon type="api"></a-icon>
<span style="margin-left: 10px">{{ network.name }}</span>
</div>
</div>
</info-card>
<info-card class="vm-info-card" :resource="vm" :title="vm.name ? this.$t('label.yourinstance') + ' : ' + vm.name : this.$t('label.yourinstance')" />
</a-affix>
</a-col>
</a-row>
@ -983,6 +971,32 @@ export default {
this.vm.zonename = this.zone.name
}
const pod = _.find(this.options.pods, (option) => option.id === instanceConfig.podid)
if (pod) {
this.vm.podid = pod.id
this.vm.podname = pod.name
}
const cluster = _.find(this.options.clusters, (option) => option.id === instanceConfig.clusterid)
if (cluster) {
this.vm.clusterid = cluster.id
this.vm.clustername = cluster.name
}
const host = _.find(this.options.hosts, (option) => option.id === instanceConfig.hostid)
if (host) {
this.vm.hostid = host.id
this.vm.hostname = host.name
}
if (this.diskSize) {
this.vm.disksizetotalgb = this.diskSize
}
if (this.networks) {
this.vm.networks = this.networks
}
if (this.template) {
this.vm.templateid = this.template.id
this.vm.templatename = this.template.displaytext
@ -1003,6 +1017,15 @@ export default {
if (this.serviceOffering) {
this.vm.serviceofferingid = this.serviceOffering.id
this.vm.serviceofferingname = this.serviceOffering.displaytext
if (this.serviceOffering.cpunumber) {
this.vm.cpunumber = this.serviceOffering.cpunumber
}
if (this.serviceOffering.cpuspeed) {
this.vm.cpuspeed = this.serviceOffering.cpuspeed
}
if (this.serviceOffering.memory) {
this.vm.memory = this.serviceOffering.memory
}
}
if (this.diskOffering) {
@ -1216,6 +1239,11 @@ export default {
isoid: value,
templateid: null
})
} else if (['cpuspeed', 'cpunumber', 'memory'].includes(name)) {
this.vm[name] = value
this.form.setFieldsValue({
[name]: value
})
} else {
this.form.setFieldsValue({
[name]: value
@ -1419,8 +1447,10 @@ export default {
}
// step 7: select ssh key pair
deployVmData.keypair = values.keypair
deployVmData.name = values.name
deployVmData.displayname = values.name
if (values.name) {
deployVmData.name = values.name
deployVmData.displayname = values.name
}
// step 8: enter setup
if ('properties' in values) {
const keys = Object.keys(values.properties)