ui: Display root disk size in Compute offering details (#4862)

Co-authored-by: Pearl Dsilva <pearl.dsilva@shapeblue.com>

Author: Pearl1594

ui/public/locales/en.json

@@ -1810,6 +1810,7 @@
 "label.rolename": "Role",
 "label.roles": "Roles",
 "label.roletype": "Role Type",
+"label.rootdisksize": "Root disk size (GB)",
 "label.root.certificate": "Root certificate",
 "label.root.disk.offering": "Root Disk Offering",
 "label.root.disk.size": "Root disk size (GB)",

ui/src/components/view/DetailsTab.vue

@@ -33,6 +33,11 @@
             <router-link :to="{ path: '/volume/' + volume.uuid }">{{ volume.type }} - {{ volume.path }}</router-link> ({{ parseFloat(volume.size / (1024.0 * 1024.0 * 1024.0)).toFixed(1) }} GB)
           </div>
         </div>
+        <div v-else-if="$route.meta.name === 'computeoffering' && item === 'rootdisksize'">
+          <div>
+            {{ parseFloat( resource.rootdisksize / (1024.0 * 1024.0 * 1024.0)).toFixed(1) }} GB
+          </div>
+        </div>
         <div v-else-if="['name', 'type'].includes(item)">
           <span v-if="['USER.LOGIN', 'USER.LOGOUT', 'ROUTER.HEALTH.CHECKS', 'FIREWALL.CLOSE', 'ALERT.SERVICE.DOMAINROUTER'].includes(resource[item])">{{ $t(resource[item].toLowerCase()) }}</span>
           <span v-else>{{ resource[item] }}</span>

ui/src/config/section/offering.js

@@ -36,6 +36,10 @@ export default {
           store.getters.apis.createServiceOffering.params.filter(x => x.name === 'storagepolicy').length > 0) {
           fields.splice(6, 0, 'vspherestoragepolicy')
         }
+        if (store.getters.apis.createServiceOffering &&
+          store.getters.apis.createServiceOffering.params.filter(x => x.name === 'rootdisksize').length > 0) {
+          fields.splice(12, 0, 'rootdisksize')
+        }
         return fields
       },
       related: [{