119 lines
4.7 KiB
HTML
119 lines
4.7 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/node/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/node/icon/icon_{{host.hostType | lowercase}}.svg" />
|
|
<image *ngIf="host.hostType === 'HOST'" x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice"
|
|
attr.xlink:href="assets/image/node/logo/logo_{{host.osType | lowercase}}.svg"></image>
|
|
</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/node/icon/icon_{{host.hostType | lowercase}}.svg" />
|
|
<image *ngIf="host.hostType === 'HOST' && host.osType !== 'UNKNOWN'" x="-10" y="-5" width="200" height="200"
|
|
preserveAspectRatio="xMidYMid slice" attr.xlink:href="assets/image/node/logo/logo_{{host.osType | lowercase}}.svg" />
|
|
</svg>
|
|
</div>
|
|
<h3>{{host.name}} <span>{{host.address}}</span></h3>
|
|
</div>
|
|
|
|
<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="host.address">
|
|
IP Address
|
|
<span class="meta-value">{{host.address}}</span>
|
|
</li>
|
|
|
|
<li *ngIf="host.hostType">
|
|
Type
|
|
<span class="meta-value">{{host.hostType}}</span>
|
|
</li>
|
|
<li *ngIf="host.hostVendor">
|
|
Vendor
|
|
<span class="meta-value">{{host.hostVendor}}</span>
|
|
</li>
|
|
<li *ngIf="host.hostModel">
|
|
Model
|
|
<span class="meta-value">{{host.hostModel}}</span>
|
|
</li>
|
|
|
|
<li *ngIf="host.osType">
|
|
OS
|
|
<span class="meta-value">{{host.osType}}</span>
|
|
</li>
|
|
|
|
<li *ngIf="host.mac">
|
|
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}}
|
|
|
|
<ul class="key-value">
|
|
<li *ngFor="let skey of host.meta[key] | objectKeys">
|
|
{{skey | stringPrettify}}
|
|
<span class="meta-value">{{host.meta[key][skey]}}</span>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</perfect-scrollbar>
|
|
</div>
|
|
</p-tabPanel>
|
|
|
|
<p-tabPanel header="Ports" *ngIf="host.portList">
|
|
<div of-auto-height key="2">
|
|
<perfect-scrollbar>
|
|
<ul class="key-value">
|
|
<li *ngFor="let port of host.portList | sort: 'portNumber'">
|
|
<span class="meta-value">{{port.portNumber}} ({{port.metaPortType.key}})</span>
|
|
</li>
|
|
</ul>
|
|
</perfect-scrollbar>
|
|
</div>
|
|
</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>
|
|
<p-spinner size="1" [(ngModel)]="count" [min]="1" [max]="30"></p-spinner>
|
|
</div>
|
|
<div class="ui-ping-row">
|
|
<div class="title">Interval </div>
|
|
<p-spinner size="1" [(ngModel)]="interval" [min]="0" [max]="5"></p-spinner>
|
|
</div>
|
|
<div class="ui-ping-row">
|
|
<div class="title">Deadline </div>
|
|
<p-spinner size="1" [(ngModel)]="deadline" [min]="1" [max]="10"></p-spinner>
|
|
</div>
|
|
</div>
|
|
<button type="button" pButton label="Ping" (click)="doPing()" class="ui-button-secondary ui-pingbn-position"></button>
|
|
|
|
<div class="ui-ping-result-textarea">
|
|
<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>
|
|
|
|
</div> |