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 2020/09/09 10:06:41 UTC

[cloudstack-primate] branch master updated: deployvm: Showing additoinal fields in infocard (#664)

This is an automated email from the ASF dual-hosted git repository.

rohit pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/cloudstack-primate.git


The following commit(s) were added to refs/heads/master by this push:
     new 6931963  deployvm: Showing additoinal fields in infocard (#664)
6931963 is described below

commit 6931963ebeb6bbb82085c343e48dc4990a89d9e6
Author: davidjumani <dj...@gmail.com>
AuthorDate: Wed Sep 9 15:36:31 2020 +0530

    deployvm: Showing additoinal fields in infocard (#664)
    
    * deployvm: Showing additoinal fields in infocard
    
    * Cosmetic changes
---
 src/components/view/InfoCard.vue | 23 +++++++++++----
 src/views/compute/DeployVM.vue   | 60 ++++++++++++++++++++++++++++++----------
 2 files changed, 63 insertions(+), 20 deletions(-)

diff --git a/src/components/view/InfoCard.vue b/src/components/view/InfoCard.vue
index 794f4e6..7174166 100644
--- a/src/components/view/InfoCard.vue
+++ b/src/components/view/InfoCard.vue
@@ -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">
diff --git a/src/views/compute/DeployVM.vue b/src/views/compute/DeployVM.vue
index e8dc32c..3bcffba 100644
--- a/src/views/compute/DeployVM.vue
+++ b/src/views/compute/DeployVM.vue
@@ -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)