From 645e637cb7d027d54ad9d6ef5b868e9cb362775d Mon Sep 17 00:00:00 2001
From: Rohit Yadav <rohit.yadav@shapeblue.com>
Date: Fri, 22 Nov 2019 20:50:57 +0530
Subject: [PATCH] update packages and package-lock, fix infocard

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
---
 ui/package-lock.json                         | 12 ++--
 ui/package.json                              |  4 +-
 ui/src/components/view/InfoCard.vue          | 66 +++++++++++++++++---
 ui/src/components/view/ListView.vue          |  2 +-
 ui/src/components/widgets/Console.vue        |  2 +-
 ui/src/views/dashboard/CapacityDashboard.vue |  4 +-
 6 files changed, 68 insertions(+), 22 deletions(-)

diff --git a/ui/package-lock.json b/ui/package-lock.json
index 6e8f81678cc..781e8018ac0 100644
--- a/ui/package-lock.json
+++ b/ui/package-lock.json
@@ -5050,9 +5050,9 @@
       "dev": true
     },
     "ant-design-vue": {
-      "version": "1.4.4",
-      "resolved": "https://registry.npmjs.org/ant-design-vue/-/ant-design-vue-1.4.4.tgz",
-      "integrity": "sha512-ASRR/rn+ONAeNWd96MzCpReZa4177fdwEBHpgPc/L0Bj/1EakJNN54JacKVXCXxnJt0VI2UXByfgUibpnOQwRQ==",
+      "version": "1.4.6",
+      "resolved": "https://registry.npmjs.org/ant-design-vue/-/ant-design-vue-1.4.6.tgz",
+      "integrity": "sha512-01bgC8PM9zh4O5Xf6EHtrk6k3Erup+foVn56tRskQPBf634NhqKxvpKvjQqxeXQNhkCxFYJBO6eWT7gZeHSgUw==",
       "requires": {
         "@ant-design/icons": "^2.1.1",
         "@ant-design/icons-vue": "^2.0.0",
@@ -8040,9 +8040,9 @@
       }
     },
     "core-js": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.4.1.tgz",
-      "integrity": "sha512-KX/dnuY/J8FtEwbnrzmAjUYgLqtk+cxM86hfG60LGiW3MmltIc2yAmDgBgEkfm0blZhUrdr1Zd84J2Y14mLxzg=="
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.4.2.tgz",
+      "integrity": "sha512-bUTfqFWtNKWp73oNIfRkqwYZJeNT3lstzZcAkhhiuvDraRSgOH1/+F9ZklbpR4zpdKuo4cpXN8tKP7s61yjX+g=="
     },
     "core-js-compat": {
       "version": "3.4.1",
diff --git a/ui/package.json b/ui/package.json
index e10e713af90..03c00ea6b0d 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -38,9 +38,9 @@
     "@fortawesome/free-regular-svg-icons": "^5.11.2",
     "@fortawesome/free-solid-svg-icons": "^5.11.2",
     "@fortawesome/vue-fontawesome": "^0.1.8",
-    "ant-design-vue": "~1.4.4",
+    "ant-design-vue": "~1.4.6",
     "axios": "^0.19.0",
-    "core-js": "^3.4.1",
+    "core-js": "^3.4.2",
     "enquire.js": "^2.1.6",
     "js-cookie": "^2.2.1",
     "lodash.get": "^4.4.2",
diff --git a/ui/src/components/view/InfoCard.vue b/ui/src/components/view/InfoCard.vue
index abbd4af2183..ad190b0ee94 100644
--- a/ui/src/components/view/InfoCard.vue
+++ b/ui/src/components/view/InfoCard.vue
@@ -80,8 +80,10 @@
         <div class="resource-detail-item" v-if="resource.group">
           <a-icon type="gold" />{{ resource.group }}
         </div>
-        <div class="resource-detail-item" v-if="resource.cpunumber && resource.cpuspeed">
-          <a-icon type="appstore" />{{ resource.cpunumber }} CPU x {{ parseFloat(resource.cpuspeed / 1000.0).toFixed(2) }} Ghz
+        <div class="resource-detail-item" v-if="(resource.cpunumber && resource.cpuspeed) || resource.cputotal">
+          <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.cpuused"
             style="display: flex; padding-left: 25px">
@@ -116,17 +118,39 @@
               :percent="Number(parseFloat(100.0 * (resource.memorykbs - resource.memoryintfreekbs) / resource.memorykbs).toFixed(2))" />
           </span>
         </div>
-        <div class="resource-detail-item" v-else-if="resource.memorytotal">
-          <a-icon type="bulb" />{{ parseFloat(resource.memorytotal / (1024.0 * 1024.0 * 1024.0)).toFixed(2) }} GB Memory
+        <div class="resource-detail-item" v-else-if="resource.memorytotalgb">
+          <a-icon type="bulb" />{{ resource.memorytotalgb }} Memory
           <span
-            v-if="resource.memoryused"
+            v-if="resource.memoryusedgb"
             style="display: flex; padding-left: 25px">
             {{ $t('memoryusedgb') }}
             <a-progress
               style="padding-left: 10px"
               size="small"
               status="active"
-              :percent="Number(parseFloat(100.0 * (resource.memoryused) / resource.memorytotal).toFixed(2))" />
+              :percent="Number(parseFloat(100.0 * parseFloat(resource.memoryusedgb) / parseFloat(resource.memorytotalgb)).toFixed(2))" />
+          </span>
+          <span
+            v-if="resource.memoryallocatedgb"
+            style="display: flex; padding-left: 25px">
+            {{ $t('memoryallocatedgb') }}
+            <a-progress
+              style="padding-left: 10px"
+              size="small"
+              :percent="Number(parseFloat(100.0 * parseFloat(resource.memoryallocatedgb) / parseFloat(resource.memorytotalgb)).toFixed(2))" />
+          </span>
+        </div>
+        <div class="resource-detail-item" v-else-if="resource.memorytotal">
+          <a-icon type="bulb" />{{ resource.memorytotal }} Memory
+          <span
+            v-if="resource.memoryused"
+            style="display: flex; padding-left: 25px">
+            {{ $t('memoryused') }}
+            <a-progress
+              style="padding-left: 10px"
+              size="small"
+              status="active"
+              :percent="parseFloat(resource.memoryused)" />
           </span>
           <span
             v-if="resource.memoryallocated"
@@ -135,11 +159,13 @@
             <a-progress
               style="padding-left: 10px"
               size="small"
-              :percent="Number(parseFloat(100.0 * (resource.memoryallocated) / resource.memorytotal).toFixed(2))" />
+              :percent="parseFloat(resource.memoryallocated)" />
           </span>
         </div>
-        <div class="resource-detail-item" v-if="resource.volumes">
-          <a-icon type="hdd" />{{ (resource.volumes.reduce((total, item) => total += item.size, 0) / (1024 * 1024 * 1024.0)).toFixed(2) }} GB Storage
+        <div class="resource-detail-item" v-if="resource.volumes || resource.sizegb">
+          <a-icon type="hdd" />
+          <span v-if="resource.volumes">{{ (resource.volumes.reduce((total, item) => total += item.size, 0) / (1024 * 1024 * 1024.0)).toFixed(2) }} GB Storage</span>
+          <span v-else-if="resource.sizegb">{{ resource.sizegb }}</span>
           <div style="margin-left: 25px" v-if="resource.diskkbsread && resource.diskkbswrite && resource.diskioread && resource.diskiowrite">
             <a-tag>Read {{ toSize(resource.diskkbsread) }}</a-tag>
             <a-tag>Write {{ toSize(resource.diskkbswrite) }}</a-tag><br/>
@@ -147,6 +173,28 @@
             <a-tag>Write (IO) {{ resource.diskiowrite }}</a-tag>
           </div>
         </div>
+        <div class="resource-detail-item" v-else-if="resource.disksizetotalgb">
+          <a-icon type="database" />{{ resource.disksizetotalgb }}
+          <span
+            v-if="resource.disksizeusedgb"
+            style="display: flex; padding-left: 25px">
+            {{ $t('disksizeusedgb') }}
+            <a-progress
+              style="padding-left: 10px"
+              size="small"
+              status="active"
+              :percent="Number(parseFloat(100.0 * parseFloat(resource.disksizeusedgb) / parseFloat(resource.disksizetotalgb)).toFixed(2))" />
+          </span>
+          <span
+            v-if="resource.disksizeallocatedgb"
+            style="display: flex; padding-left: 25px">
+            {{ $t('disksizeallocatedgb') }}
+            <a-progress
+              style="padding-left: 10px"
+              size="small"
+              :percent="Number(parseFloat(100.0 * parseFloat(resource.disksizeallocatedgb) / parseFloat(resource.disksizetotalgb)).toFixed(2))" />
+          </span>
+        </div>
         <div class="resource-detail-item" v-if="resource.nic || ('networkkbsread' in resource && 'networkkbswrite' in resource)">
           <a-icon type="wifi" />
           <span v-if="'networkkbsread' in resource && 'networkkbswrite' in resource">
diff --git a/ui/src/components/view/ListView.vue b/ui/src/components/view/ListView.vue
index ba12345572a..a4b07a15639 100644
--- a/ui/src/components/view/ListView.vue
+++ b/ui/src/components/view/ListView.vue
@@ -34,7 +34,7 @@
     </template>
 
     <a slot="name" slot-scope="text, record" href="javascript:;" style="display: inline-flex">
-      <console :resource="record" size="small" />&nbsp;&nbsp;
+      <console :resource="record" size="small" />
       <router-link :to="{ path: $route.path + '/' + record.id }" v-if="record.id">{{ text }}</router-link>
       <router-link :to="{ path: $route.path + '/' + record.name }" v-else>{{ text }}</router-link>
     </a>
diff --git a/ui/src/components/widgets/Console.vue b/ui/src/components/widgets/Console.vue
index 1c3c2ef65d2..daed176e533 100644
--- a/ui/src/components/widgets/Console.vue
+++ b/ui/src/components/widgets/Console.vue
@@ -20,7 +20,7 @@
     v-if="['vm', 'systemvm', 'router'].includes($route.meta.name)"
     :href="'/client/console?cmd=access&vm=' + resource.id"
     target="_blank">
-    <a-button shape="circle" type="dashed" :size="size" :disabled="['Stopped', 'Error', 'Destroyed'].includes(resource.state)" >
+    <a-button style="margin-right: 5px" shape="circle" type="dashed" :size="size" :disabled="['Stopped', 'Error', 'Destroyed'].includes(resource.state)" >
       <a-icon type="code" />
     </a-button>
   </a>
diff --git a/ui/src/views/dashboard/CapacityDashboard.vue b/ui/src/views/dashboard/CapacityDashboard.vue
index 6ba80be24af..930fddc5a01 100644
--- a/ui/src/views/dashboard/CapacityDashboard.vue
+++ b/ui/src/views/dashboard/CapacityDashboard.vue
@@ -63,9 +63,7 @@
             </template>
             <a-button type="danger" shape="circle">
               <router-link :to="{ name: 'host', query: {'state': 'Alert'} }">
-                <a-badge dot>
-                  <a-icon class="capacity-dashboard-button-icon" type="desktop" />
-                </a-badge>
+                <a-icon class="capacity-dashboard-button-icon" type="desktop" />
               </router-link>
             </a-button>
           </a-tooltip>