ing

src/commons/component/host-detail.component.html

@@ -20,6 +20,8 @@
 
   <p-tabView class="detail-content" (onChange)="onTabViewChange($event)">
     <p-tabPanel header=" General">
+      <div of-auto-height key="0">
+        <perfect-scrollbar>
 
           <ul class="key-value">
 
@@ -50,11 +52,14 @@
               Mac Address
               <span class="meta-value">{{host.mac}}</span>
             </li>
-
           </ul>
+        </perfect-scrollbar>
+      </div>
     </p-tabPanel>
 
     <p-tabPanel header="Metadata" *ngIf="host.meta">
+      <div of-auto-height key="1">
+        <perfect-scrollbar>
           <ul class="detail-content-meta-title">
             <li *ngFor="let key of host.meta | objectKeys">
               {{key | stringPrettify}}
@@ -67,6 +72,8 @@
               </ul>
             </li>
           </ul>
+        </perfect-scrollbar>
+      </div>
     </p-tabPanel>
 
     <p-tabPanel header="Ports" *ngIf="host.portList">
@@ -82,7 +89,8 @@
     </p-tabPanel>
 
     <p-tabPanel header="Health">
-
+      <div of-auto-height key="3">
+        <perfect-scrollbar>
           <div class="ui-g">
             <div class="ui-ping-row">
               <div class="title">Count </div>
@@ -103,9 +111,8 @@
             <p-progressBar *ngIf="pingWaiting" mode="indeterminate"></p-progressBar>
             <textarea *ngIf="!pingWaiting && pingResult" pInputTextarea autoResize="autoResize" [(ngModel)]="pingResultRaw"></textarea>
           </div>
-
-
-
+        </perfect-scrollbar>
+      </div>
     </p-tabPanel>
   </p-tabView>
 

src/commons/component/service-detail.component.html

@@ -23,6 +23,8 @@
 
   <p-tabView class="detail-content" (onChange)="onTabViewChange($event)">
     <p-tabPanel header="General">
+      <div of-auto-height key="0">
+        <perfect-scrollbar>
 
           <ul class="key-value">
             <li *ngIf="service.key">
@@ -42,6 +44,8 @@
               <span class="meta-value">{{service.metaCryptoType.name}}</span>
             </li>
           </ul>
+        </perfect-scrollbar>
+      </div>
 
     </p-tabPanel>
 
@@ -65,7 +69,8 @@
     </p-tabPanel>
 
     <p-tabPanel header="Health" *ngIf="service.port.metaPortType.key === 'TCP'">
-
+      <div of-auto-height key="2">
+        <perfect-scrollbar>
           <div class="ui-g">
             <div class="ui-ping-row">
               <div class="title">Count </div>
@@ -104,7 +109,8 @@
               </ng-template>
             </p-table>
           </div>
-
+        </perfect-scrollbar>
+      </div>
     </p-tabPanel>
 
   </p-tabView>