Merge branch 'master' of https://git.loafle.net/overflow_scanner/app

src/app/pages/home/home-page.component.ts

@@ -14,7 +14,6 @@ import { TypeUtil } from '@overflow/core-js';
 import { RPCError } from '@overflow/rpc-js';
 import { toMetaIPType, MetaIPTypeEnum, toMetaCryptoType, MetaCryptoTypeEnum, toMetaPortType, MetaPortTypeEnum } from '@overflow/model/meta';
 import { DiscoveryModeType } from '@overflow/model/discovery/discovery';
-import { PingResult } from '@overflow/model/ping';
 
 import { ProbeService, requesterID } from '../../../commons/service/probe.service';
 import { DiscoveryConfigService } from '../../../commons/service/discovery-config.service';

src/commons/commons.module.ts

@@ -2,15 +2,21 @@ import { NgModule, APP_INITIALIZER } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 import { CommonsUIModule } from '@overflow/commons/ui/commons-ui.module';
-
+import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
+import { PERFECT_SCROLLBAR_CONFIG } from 'ngx-perfect-scrollbar';
+import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar';
 
 import { COMPONENTS } from './component';
 
+const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
+  suppressScrollX: true
+};
+
 @NgModule({
   imports: [
     CommonModule,
-
     CommonsUIModule,
+    PerfectScrollbarModule
   ],
   exports: [
     ...COMPONENTS,
@@ -19,6 +25,10 @@ import { COMPONENTS } from './component';
     ...COMPONENTS,
   ],
   providers: [
+    {
+      provide: PERFECT_SCROLLBAR_CONFIG,
+      useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG
+    }
   ]
 })
 export class CommonsModule { }

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

@@ -79,7 +79,26 @@
     </p-tabPanel>
 
     <p-tabPanel header="Health">
+
+      <div class="ui-g-10 ui-g-offset-2">Retries :
+        <input type="number" pInputText style="width:100px;" [(ngModel)]="retries" min="1" max="10">
+      </div>
+      <!-- <div class="ui-g-10 ui-g-offset-2">Interval :
+              <input type="text" pInputText placeholder="3" style="width:100px;" [(ngModel)]="interval" (ngModelChange)="validateIP($event, 0)"
+                (keypress)="ipPressed($event)">
+            </div>
+            <div class="ui-g-10 ui-g-offset-2">Deadline :
+              <input type="text" pInputText placeholder="3" style="width:100px;" [(ngModel)]="deadline" (ngModelChange)="validateIP($event, 0)"
+                (keypress)="ipPressed($event)">
+            </div> -->
+
       <button type="button" pButton label="Ping" (click)="doPing()" class="ui-button-secondary ui-pingbn-position"></button>
+      <br />
+      <textarea style="width: 100%; height: 200px" pInputTextarea autoResize="autoResize" [(ngModel)]="healthResponse"></textarea>
+
+      <div *ngIf="pingWaiting">
+        Checking....
+      </div>
       <div *ngIf="pingResult">
         <ul>
           <li *ngFor="let key of pingResult.responses | objectKeys">
@@ -100,11 +119,9 @@
           <div *ngIf="pingResult.summary.minTime">Min: {{pingResult.summary.minTime}} ms</div>
           <div *ngIf="pingResult.summary.maxTime">Min: {{pingResult.summary.maxTime}} ms</div>
         </div>
+
       </div>
     </p-tabPanel>
-
-
   </p-tabView>
-</div>
 
-<p-growl [(value)]="pingResult" [life]="9000"></p-growl>
+</div>

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

@@ -2,9 +2,8 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 import { Host } from '@overflow/model/discovery';
 import { ProbeService } from '../service/probe.service';
 import { map, catchError, take } from 'rxjs/operators';
-import { PingResult, PingResponse } from '@overflow/model/ping';
+import { PingResult } from '@overflow/model/ping';
 import { of } from 'rxjs';
-import { Message } from 'primeng/primeng';
 
 
 @Component({
@@ -15,16 +14,26 @@ import { Message } from 'primeng/primeng';
 export class HostDetailComponent {
 
   @Input() host: Host;
+
+  healthResponse: string;
+
+  pingWaiting: boolean;
   pingResult: PingResult;
+  retries: number;
 
   constructor(
-    private probeService: ProbeService
+    private probeService: ProbeService,
   ) {
+    this.pingWaiting = false;
+    this.retries = 5;
   }
 
   doPing() {
+    this.pingWaiting = true;
+    this.pingWaiting = true;
+
     const option = {
-      Retry: 3,
+      Retry: this.retries,
       Interval: 1,
       Deadline: 1,
     };
@@ -33,13 +42,16 @@ export class HostDetailComponent {
       .call<PingResult>('PingService.PingHost', this.host, option)
       .pipe(
         map((pingResult: PingResult) => {
+          this.healthResponse = 'aslkdfjas\nasdflskjdf';
           if (pingResult) {
             this.pingResult = pingResult;
           }
+          this.pingWaiting = false;
         }),
         catchError(error => {
           console.log(error);
           alert('An error has occurred.');
+          this.pingWaiting = false;
           return of();
         }),
         take(1)

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

@@ -1,5 +1,8 @@
 <div class="ui-g">
+
   <div class="ui-g-12">
+
+
     <ng-container [ngSwitch]="node.group">
 
       <ng-container *ngSwitchCase="'zone'">
@@ -18,5 +21,6 @@
       </ng-container>
 
     </ng-container>
+
   </div>
 </div>

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

@@ -21,7 +21,6 @@
 
 
   <p-tabView class="detail-content">
-    <button type="button" pButton label="Ping" (click)="doPing()" class="ui-button-secondary ui-pingbn-position"></button>
     <p-tabPanel header="General">
 
       <ul class="key-value">
@@ -60,6 +59,25 @@
       </ul>
     </p-tabPanel>
 
+    <p-tabPanel header="Health">
+      <button type="button" pButton label="Ping" (click)="doPing()" class="ui-button-secondary ui-pingbn-position"></button>
+      <div *ngIf="pingWaiting">
+        Checking....
+      </div>
+      <div *ngIf="pingResult">
+        <ul>
+          <li *ngFor="let key of pingResult.responses | objectKeys">
+            <span *ngIf="pingResult.responses[key].error else value">
+              {{pingResult.responses[key].error}}
+            </span>
+            <ng-template #value>
+              {{pingResult.responses[key].time}}ms
+            </ng-template>
+          </li>
+        </ul>
+      </div>
+    </p-tabPanel>
+
   </p-tabView>
 
 </div>

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

@@ -13,15 +13,19 @@ import { of } from 'rxjs';
 export class ServiceDetailComponent {
 
   @Input() service: Service;
-  @Output() ping = new EventEmitter<PingResult>();
+  pingWaiting: boolean;
+  pingResult: PingResult;
 
   constructor(
     private probeService: ProbeService
   ) {
-
+    this.pingWaiting = false;
   }
 
   doPing() {
+    this.pingWaiting = true;
+
+
     const option = {
       Retry: 3,
       Interval: 1,
@@ -32,11 +36,15 @@ export class ServiceDetailComponent {
       .call<PingResult>('PingService.PingService', this.service, option)
       .pipe(
         map((pingResult: PingResult) => {
-          this.ping.emit(pingResult);
+          if (pingResult) {
+            this.pingResult = pingResult;
+          }
+          this.pingWaiting = false;
         }),
         catchError(error => {
           console.log(error);
           alert('An error has occurred.');
+          this.pingWaiting = false;
           return of();
         }),
         take(1)

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

@@ -15,47 +15,128 @@
   </div>
 
   <p-tabView class="detail-content">
+
     <p-tabPanel header="General">
-
-      <ul class="key-value">
-        <li *ngIf="zone.iface">
-          Interface
-          <span class="meta-value">{{zone.iface}}</span>
-        </li>
-
-        <li *ngIf="zone.mac">
-          Mac Address
-          <span class="meta-value">{{zone.mac}}</span>
-        </li>
-
-        <li *ngIf="zone.metaIPType">
-          IP Version
-          <span class="meta-value">{{zone.metaIPType.key}}</span>
-        </li>
-
-        <li *ngIf="zone.network">
-          Network
-          <span class="meta-value">{{zone.network}}</span>
-        </li>
-
-        <li *ngIf="zone.network">
-          IP Range
-          <span class="meta-value">{{ipRange}}</span>
-        </li>
-
-      </ul>
+      <perfect-scrollbar>
+        <ul class="key-value">
+          <li *ngIf="zone.iface">
+            Interface
+            <span class="meta-value">{{zone.iface}}</span>
+          </li>
+          <li *ngIf="zone.mac">
+            Mac Address
+            <span class="meta-value">{{zone.mac}}</span>
+          </li>
+          <li *ngIf="zone.metaIPType">
+            IP Version
+            <span class="meta-value">{{zone.metaIPType.key}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            Network
+            <span class="meta-value">{{zone.network}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            IP Range
+            <span class="meta-value">{{ipRange}}</span>
+          </li>
+          <!--  -->
+          <li *ngIf="zone.iface">
+            Interface
+            <span class="meta-value">{{zone.iface}}</span>
+          </li>
+          <li *ngIf="zone.mac">
+            Mac Address
+            <span class="meta-value">{{zone.mac}}</span>
+          </li>
+          <li *ngIf="zone.metaIPType">
+            IP Version
+            <span class="meta-value">{{zone.metaIPType.key}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            Network
+            <span class="meta-value">{{zone.network}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            IP Range
+            <span class="meta-value">{{ipRange}}</span>
+          </li>
+          <li *ngIf="zone.iface">
+            Interface
+            <span class="meta-value">{{zone.iface}}</span>
+          </li>
+          <li *ngIf="zone.mac">
+            Mac Address
+            <span class="meta-value">{{zone.mac}}</span>
+          </li>
+          <li *ngIf="zone.metaIPType">
+            IP Version
+            <span class="meta-value">{{zone.metaIPType.key}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            Network
+            <span class="meta-value">{{zone.network}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            IP Range
+            <span class="meta-value">{{ipRange}}</span>
+          </li>
+          <li *ngIf="zone.iface">
+            Interface
+            <span class="meta-value">{{zone.iface}}</span>
+          </li>
+          <li *ngIf="zone.mac">
+            Mac Address
+            <span class="meta-value">{{zone.mac}}</span>
+          </li>
+          <li *ngIf="zone.metaIPType">
+            IP Version
+            <span class="meta-value">{{zone.metaIPType.key}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            Network
+            <span class="meta-value">{{zone.network}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            IP Range
+            <span class="meta-value">{{ipRange}}</span>
+          </li>
+          <li *ngIf="zone.iface">
+            Interface
+            <span class="meta-value">{{zone.iface}}</span>
+          </li>
+          <li *ngIf="zone.mac">
+            Mac Address
+            <span class="meta-value">{{zone.mac}}</span>
+          </li>
+          <li *ngIf="zone.metaIPType">
+            IP Version
+            <span class="meta-value">{{zone.metaIPType.key}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            Network
+            <span class="meta-value">{{zone.network}}</span>
+          </li>
+          <li *ngIf="zone.network">
+            IP Range
+            <span class="meta-value">{{ipRange}}</span>
+          </li>
+        </ul>
+      </perfect-scrollbar>
     </p-tabPanel>
 
     <p-tabPanel header="Hosts">
-      <ul class="key-value">
-        <li *ngFor="let host of zone.hostList | ipSort: 'address'">
-          <a href="javascript:void(0)" (click)="hostSelected(host)" style="text-decoration:none">
-            <span class="meta-value">{{host.address}}</span> <span *ngIf="host.name" class="meta-value">
-              ({{host.name}})</span>
-          </a>
-        </li>
-      </ul>
+      <perfect-scrollbar>
+        <ul class="key-value">
+          <li *ngFor="let host of zone.hostList | ipSort: 'address'">
+            <a href="javascript:void(0)" (click)="hostSelected(host)" style="text-decoration:none">
+              <span class="meta-value">{{host.address}}</span> <span *ngIf="host.name" class="meta-value">
+                ({{host.name}})</span>
+            </a>
+          </li>
+        </ul>
+      </perfect-scrollbar>
     </p-tabPanel>
+
   </p-tabView>
 
 </div>