ping in progress
This commit is contained in:
		
							parent
							
								
									cd7ed362e2
								
							
						
					
					
						commit
						c965c72365
					
				| @ -76,36 +76,10 @@ | ||||
| 
 | ||||
| <p-sidebar [(visible)]="displaySidebar" styleClass="ui-sidebar-md" position="right" (onHide)="onHideDetail()"> | ||||
|   <div *ngIf="selectedNode !== null"> | ||||
|     <app-node-detail [node]="selectedNode" (otherHostSelect)="otherHostSelected($event)" (ping)="displayPing($event)"></app-node-detail> | ||||
|     <app-node-detail [node]="selectedNode" (otherHostSelect)="otherHostSelected($event)"></app-node-detail> | ||||
|   </div> | ||||
| </p-sidebar> | ||||
| 
 | ||||
| <p-dialog header="Ping" [(visible)]="pingDisplay" [modal]="true" [responsive]="true" [width]="350" [minWidth]="200" | ||||
|   [minY]="70" [maximizable]="true" [baseZIndex]="10000"> | ||||
|   <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> | ||||
|           TTL={{pingResult.responses[key].ttl}} : {{pingResult.responses[key].time}}ms | ||||
|         </ng-template> | ||||
|       </li> | ||||
|     </ul> | ||||
|   </div> | ||||
|   <div *ngIf="pingResult"> | ||||
|     <span>Sent: {{pingResult.summary.sendCount || '-'}}</span><br /> | ||||
|     <span>Received: {{pingResult.summary.receiveCount || '-'}}</span><br /> | ||||
|     <span>Loss: {{pingResult.summary.lossPercent || '-'}} %</span><br /> | ||||
|     <span>Avg: {{pingResult.summary.avgTime || '-'}} ms</span><br /> | ||||
|     <span>Min: {{pingResult.summary.minTime || '-'}} ms</span><br /> | ||||
|     <span>Min: {{pingResult.summary.maxTime || '-'}} ms</span> | ||||
|   </div> | ||||
|   <p-footer> | ||||
|     <button type="button" pButton icon="pi pi-check" (click)="pingDisplay=false" label="Close"></button> | ||||
|   </p-footer> | ||||
| </p-dialog> | ||||
| 
 | ||||
| <!-- <div class="ui-fluid"> | ||||
|     <div class="ui-g"> | ||||
|  | ||||
| @ -54,8 +54,6 @@ export class HomePageComponent implements OnInit, OnDestroy { | ||||
|   ports: Map<string, Map<number, Port>>; | ||||
| 
 | ||||
|   resultMsg: string[]; | ||||
|   pingDisplay = false; | ||||
|   pingResult: PingResult; | ||||
| 
 | ||||
|   @HostListener('window:resize', ['$event']) | ||||
|   onResize(event) { | ||||
| @ -934,14 +932,4 @@ export class HomePageComponent implements OnInit, OnDestroy { | ||||
|     ); | ||||
|   } | ||||
| 
 | ||||
| 
 | ||||
|   displayPing(pingResult: PingResult) { | ||||
|     console.log(pingResult); | ||||
| 
 | ||||
|     if (pingResult) { | ||||
|       this.pingDisplay = true; | ||||
|       this.pingResult = pingResult; | ||||
|     } | ||||
| 
 | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -19,7 +19,6 @@ | ||||
|   </div> | ||||
| 
 | ||||
|   <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"> | ||||
| @ -78,5 +77,34 @@ | ||||
|         </li> | ||||
|       </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="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> | ||||
|               TTL={{pingResult.responses[key].ttl}} : {{pingResult.responses[key].time}}ms | ||||
|             </ng-template> | ||||
|           </li> | ||||
|         </ul> | ||||
| 
 | ||||
|         <div> | ||||
|           <div *ngIf="pingResult.summary.sendCount">Sent: {{pingResult.summary.sendCount}}</div> | ||||
|           <div *ngIf="pingResult.summary.receiveCount">Received: {{pingResult.summary.receiveCount}}</div> | ||||
|           <div *ngIf="pingResult.summary.lossPercent">Loss: {{pingResult.summary.lossPercent}} %</div> | ||||
|           <div *ngIf="pingResult.summary.avgTime">Avg: {{pingResult.summary.avgTime}} ms</div> | ||||
|           <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> | ||||
| </div> | ||||
| 
 | ||||
| <p-growl [(value)]="pingResult" [life]="9000"></p-growl> | ||||
| @ -2,8 +2,9 @@ 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 } from '@overflow/model/ping'; | ||||
| import { PingResult, PingResponse } from '@overflow/model/ping'; | ||||
| import { of } from 'rxjs'; | ||||
| import { Message } from 'primeng/primeng'; | ||||
| 
 | ||||
| 
 | ||||
| @Component({ | ||||
| @ -14,7 +15,7 @@ import { of } from 'rxjs'; | ||||
| export class HostDetailComponent { | ||||
| 
 | ||||
|   @Input() host: Host; | ||||
|   @Output() ping = new EventEmitter<PingResult>(); | ||||
|   pingResult: PingResult; | ||||
| 
 | ||||
|   constructor( | ||||
|     private probeService: ProbeService | ||||
| @ -32,7 +33,9 @@ export class HostDetailComponent { | ||||
|       .call<PingResult>('PingService.PingHost', this.host, option) | ||||
|       .pipe( | ||||
|         map((pingResult: PingResult) => { | ||||
|           this.ping.emit(pingResult); | ||||
|           if (pingResult) { | ||||
|             this.pingResult = pingResult; | ||||
|           } | ||||
|         }), | ||||
|         catchError(error => { | ||||
|           console.log(error); | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user