92 lines
3.6 KiB
HTML
92 lines
3.6 KiB
HTML
<div class="ui-g-12">
|
|
|
|
<div class="ui-g detail-img">
|
|
<!-- <svg width="200" height="200" viewBox="20 40 140 100">
|
|
<image x="-40" y="-20" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/logo/logo_tomcat.svg" />
|
|
</svg> -->
|
|
<div class="svg-div">
|
|
<!-- <svg width="140" height="140" viewBox="15 35 140 100">
|
|
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" attr.xlink:href="../../assets/image/icon/icon_{{service.serviceType | lowercase}}.svg" />
|
|
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" attr.xlink:href="../../assets/image/logo/logo_{{service.key | lowercase}}.svg" />
|
|
</svg> -->
|
|
<svg width="140" height="140" viewBox="20 10 140 140">
|
|
<image x="-10" y="-5" width="200" height="200" preserveAspectRatio="xMidYMid slice" attr.xlink:href="../../assets/image/icon/icon_{{service.serviceType | lowercase}}.svg" />
|
|
<image x="-10" y="-5" width="200" height="200" preserveAspectRatio="xMidYMid slice" attr.xlink:href="../../assets/image/logo/logo_{{service.key | lowercase}}.svg" />
|
|
</svg>
|
|
</div>
|
|
<h3>
|
|
{{service.name}} {{service.port.host.address}}
|
|
</h3>
|
|
</div>
|
|
|
|
|
|
<p-tabView class="detail-content">
|
|
<p-tabPanel header="General">
|
|
|
|
<ul class="key-value">
|
|
<li *ngIf="service.key">
|
|
Name
|
|
<span class="meta-value">{{service.key}}</span>
|
|
</li>
|
|
<li *ngIf="service.port">
|
|
Port
|
|
<span class="meta-value">{{service.port.metaPortType.name}} {{service.port.portNumber}}</span>
|
|
</li>
|
|
<li *ngIf="service.description">
|
|
Description
|
|
<span class="meta-value">{{service.description}}</span>
|
|
</li>
|
|
<li *ngIf="service.metaCryptoType && service.metaCryptoType.key !== 'NONE'">
|
|
Crypto Type
|
|
<span class="meta-value">{{service.metaCryptoType.name}}</span>
|
|
</li>
|
|
</ul>
|
|
|
|
</p-tabPanel>
|
|
|
|
<p-tabPanel header="Metadata" *ngIf="service.meta">
|
|
<ul class="detail-content-meta-title">
|
|
<li *ngFor="let key of service.meta | objectKeys">
|
|
{{key | stringPrettify}}
|
|
|
|
<ul class="key-value">
|
|
<li *ngFor="let skey of service.meta[key] | objectKeys">
|
|
{{skey | stringPrettify}}
|
|
<span class="meta-value">{{service.meta[key][skey]}}</span>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</p-tabPanel>
|
|
|
|
<p-tabPanel header="Health">
|
|
|
|
<div class="ui-g-10 ui-g-offset-2">Count :
|
|
<input type="number" pInputText [(ngModel)]="count" min="1" max="50">
|
|
</div>
|
|
<div class="ui-g-10 ui-g-offset-2">Interval :
|
|
<input type="number" pInputText [(ngModel)]="interval" min="1" max="10">
|
|
</div>
|
|
<div class="ui-g-10 ui-g-offset-2">Deadline :
|
|
<input type="number" pInputText [(ngModel)]="deadline" min="1" max="10">
|
|
</div>
|
|
|
|
<button type="button" pButton label="Ping" (click)="doPing()" class="ui-button-secondary ui-pingbn-position"></button>
|
|
<p-progressSpinner *ngIf="pingWaiting"></p-progressSpinner>
|
|
<div *ngIf="!pingWaiting && 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>
|
|
Response time {{key}} : {{pingResult.responses[key].time}}ms
|
|
</ng-template>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</p-tabPanel>
|
|
|
|
</p-tabView>
|
|
|
|
</div> |