UI: List host OOBM details when enabled and configured (apache#10472)

* UI: List host OOBM details when enabled and configured

* Add username details

* address comment

Author: Pearl1594

ui/public/locales/en.json

@@ -2419,6 +2419,11 @@
 "label.zonewizard.traffictype.storage": "Storage: Traffic between primary and secondary storage servers, such as Instance Templates and Snapshots.",
 "label.buckets": "Buckets",
 "label.objectstorageid": "Object Storage Pool",
+"label.oobm.address": "Out-of-band management address",
+"label.oobm.driver": "Out-of-band management driver",
+"label.oobm.port": "Out-of-band management port",
+"label.oobm.powerstate": "Out-of-band management power state",
+"label.oobm.username": "Out-of-band management username",
 "label.bucket.update": "Update Bucket",
 "label.bucket.delete": "Delete Bucket",
 "label.quotagb": "Quota in GB",

ui/src/views/infra/HostInfo.vue

@@ -80,14 +80,48 @@
           </div>
         </div>
       </a-list-item>
-      <a-list-item v-if="host.outofbandmanagement">
-        <div>
-          <strong>{{ $t('label.powerstate') }}</strong>
+      <span v-if="host?.outofbandmanagement?.enabled">
+        <a-list-item>
           <div>
-            {{ host.outofbandmanagement.powerstate }}
+            <strong>{{ $t('label.oobm.username') }}</strong>
+            <div>
+              {{ host.outofbandmanagement.username }}
+            </div>
           </div>
-        </div>
-      </a-list-item>
+        </a-list-item>
+        <a-list-item>
+          <div>
+            <strong>{{ $t('label.oobm.powerstate') }}</strong>
+            <div>
+              {{ host.outofbandmanagement.powerstate }}
+            </div>
+          </div>
+        </a-list-item>
+        <a-list-item>
+          <div>
+            <strong>{{ $t('label.oobm.driver') }}</strong>
+            <div>
+              {{ host.outofbandmanagement.driver }}
+            </div>
+          </div>
+        </a-list-item>
+        <a-list-item>
+          <div>
+            <strong>{{ $t('label.oobm.address') }}</strong>
+            <div>
+              {{ host.outofbandmanagement.address }}
+            </div>
+          </div>
+        </a-list-item>
+        <a-list-item>
+          <div>
+            <strong>{{ $t('label.oobm.port') }}</strong>
+            <div>
+              {{ host.outofbandmanagement.port }}
+            </div>
+          </div>
+        </a-list-item>
+      </span>
       <a-list-item v-if="host.hostha">
         <div>
           <strong>{{ $t('label.haenable') }}</strong>