2018-05-03 12:23:53 +00:00
|
|
|
<p-dialog [showHeader]="false" [closeOnEscape]="false" [modal]="true" header="Discovery" [width]="800" [(visible)]="display" [dismissableMask]="true">
|
|
|
|
<of-discovery-setting (close)="closeDialog()"></of-discovery-setting>
|
|
|
|
</p-dialog>
|
|
|
|
|
2018-04-12 09:06:29 +00:00
|
|
|
<div class="ui-g">
|
|
|
|
<h1>Map</h1>
|
|
|
|
<div class="ui-g-12 ui-g-nopad">
|
|
|
|
<div class="ui-g">
|
2018-04-18 14:14:41 +00:00
|
|
|
<div class="ui-g-12 ui-md-5 ui-g-nopad ui-bottom-space-10">
|
2018-04-17 11:43:37 +00:00
|
|
|
<button pButton type="button" class="ui-button-large ui-button-width-fit" icon="ui-icon-play-arrow" label="Discovery" (click)="showDialog()"></button>
|
2018-04-12 09:06:29 +00:00
|
|
|
</div>
|
2018-04-18 14:14:41 +00:00
|
|
|
<div class="ui-g-12 ui-md-7 ui-g-nopad">
|
2018-04-19 05:52:55 +00:00
|
|
|
<div style="float: right;">
|
|
|
|
<button pButton type="button" class="ui-button-secondary ui-button-width-fit" label="Expand all" style="margin-top: 16px;"
|
|
|
|
(click)="expandAll()"></button>
|
|
|
|
<button pButton type="button" class="ui-button-secondary ui-button-width-fit" label="Collapse all" style="margin-top: 16px;"
|
|
|
|
(click)="collapseAll()"></button>
|
|
|
|
</div>
|
|
|
|
<div style="float: right; margin: 30px 15px 0 0;">
|
|
|
|
<i class="fa ui-icon-stop ui-status-icon ui-status-success"></i>Up
|
2018-04-20 07:24:19 +00:00
|
|
|
<i class="fa ui-icon-stop ui-status-icon ui-status-fatal"></i>Down
|
2018-04-19 05:52:55 +00:00
|
|
|
<i class="fa ui-icon-stop ui-status-icon ui-status-warn"></i>Warn
|
|
|
|
<i class="fa ui-icon-stop ui-status-icon ui-status-error"></i>Error
|
|
|
|
</div>
|
2018-04-12 09:06:29 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="ui-g-12 ui-g-nopad">
|
2018-04-26 12:33:37 +00:00
|
|
|
<p-tree [value]="infraTree" selectionMode="single" [(selection)]="selectedTree" (onNodeSelect)="onNodeSelect($event)" [contextMenu]="cm"
|
|
|
|
[pTooltip]="desiredTooltip">
|
2018-04-19 05:52:55 +00:00
|
|
|
|
|
|
|
<ng-template let-node pTemplate="default">
|
|
|
|
<div>{{node.label}}</div>
|
|
|
|
</ng-template>
|
|
|
|
|
|
|
|
<ng-template let-node pTemplate="infra">
|
2018-04-26 12:33:37 +00:00
|
|
|
<div (contextmenu)="nodeMenu($event, node)">
|
|
|
|
<div>{{node.label}}</div>
|
|
|
|
</div>
|
2018-04-19 05:52:55 +00:00
|
|
|
</ng-template>
|
|
|
|
|
|
|
|
<ng-template let-node pTemplate="probe">
|
2018-04-26 12:33:37 +00:00
|
|
|
<div (contextmenu)="nodeMenu($event, node)">
|
|
|
|
<div>{{node.label}}</div>
|
|
|
|
</div>
|
2018-04-19 05:52:55 +00:00
|
|
|
</ng-template>
|
|
|
|
|
|
|
|
<ng-template let-node pTemplate="host">
|
2018-04-26 12:33:37 +00:00
|
|
|
<div (contextmenu)="nodeMenu($event, node)">
|
|
|
|
<div>{{node.label}}</div>
|
|
|
|
<!-- <div>{{node.obj.infraType.name}}</div> -->
|
|
|
|
</div>
|
2018-04-19 05:52:55 +00:00
|
|
|
</ng-template>
|
|
|
|
|
|
|
|
<ng-template let-node pTemplate="service">
|
2018-04-26 12:33:37 +00:00
|
|
|
<div (contextmenu)="nodeMenu($event, node)">
|
|
|
|
<div>{{node.label}}</div>
|
|
|
|
</div>
|
2018-04-19 05:52:55 +00:00
|
|
|
</ng-template>
|
|
|
|
|
|
|
|
<ng-template let-node pTemplate="sensor">
|
2018-04-25 11:23:30 +00:00
|
|
|
<div (contextmenu)="nodeMenu($event, node)">
|
2018-04-26 12:33:37 +00:00
|
|
|
<div>
|
|
|
|
<i class="fa ui-icon-stop ui-status-icon ui-status-success"></i>{{node.label}}
|
|
|
|
</div>
|
|
|
|
<div>
|
2018-04-30 12:04:58 +00:00
|
|
|
{{node.obj.itemCount}} SensorItems
|
2018-04-26 12:33:37 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
2018-04-19 05:52:55 +00:00
|
|
|
</ng-template>
|
|
|
|
|
|
|
|
</p-tree>
|
2018-04-12 09:06:29 +00:00
|
|
|
</div>
|
2018-04-11 13:05:09 +00:00
|
|
|
</div>
|
|
|
|
|
2018-04-25 11:23:30 +00:00
|
|
|
<p-contextMenu #cmProbe [model]="contextMenuProbe"></p-contextMenu>
|
|
|
|
<p-contextMenu #cmHost [model]="contextMenuHost"></p-contextMenu>
|
2018-04-25 12:34:51 +00:00
|
|
|
<p-contextMenu #cmService [model]="contextMenuService"></p-contextMenu>
|
|
|
|
<p-contextMenu #cmSensor [model]="contextMenuSensor"></p-contextMenu>
|
2018-04-25 11:23:30 +00:00
|
|
|
|
2018-04-26 11:23:57 +00:00
|
|
|
<p-dialog [modal]="true" [width]="800" [(visible)]="sensorSettingDisplay" [showHeader]="true" [closeOnEscape]="false">
|
2018-04-26 12:18:25 +00:00
|
|
|
<of-sensor-setting [visible]="sensorSettingDisplay" [preTarget]="target" (close)="onSensorSettingClose()"></of-sensor-setting>
|
2018-04-26 11:23:57 +00:00
|
|
|
</p-dialog>
|
|
|
|
|
2018-04-25 11:23:30 +00:00
|
|
|
|
2018-04-30 12:04:58 +00:00
|
|
|
<p-dialog header="Rename Probe" [(visible)]="renameProbeVisible" [modal]="true" [responsive]="true" [width]="350" [minWidth]="200"
|
|
|
|
[minY]="70">
|
|
|
|
<span class="md-inputfield">
|
2018-04-30 12:19:41 +00:00
|
|
|
<input #probeAlias type="text" pInputText placeholder="Enter new alias.">
|
2018-04-30 12:04:58 +00:00
|
|
|
</span>
|
|
|
|
<p-footer>
|
|
|
|
<button type="button" pButton icon="fa-check" (click)="onSaveProbeName(probeAlias.value)" label="Save"></button>
|
|
|
|
<button type="button" pButton icon="fa-close" (click)="renameProbeVisible=false" label="Cancel"></button>
|
|
|
|
</p-footer>
|
|
|
|
</p-dialog>
|
|
|
|
|
|
|
|
|
2018-04-25 09:04:47 +00:00
|
|
|
|
|
|
|
|
2018-04-11 12:26:51 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2018-04-10 12:37:09 +00:00
|
|
|
<!-- <div fxLayoutAlign="end" [style.margin]="'10px 10px'">
|
2018-04-06 11:02:18 +00:00
|
|
|
<form class="form">
|
|
|
|
<mat-form-field class="full-width">
|
|
|
|
<input matInput placeholder="Search" [(ngModel)]="searchWord" (ngModelChange)="handleSearch($event)" [ngModelOptions]="{standalone: true}">
|
|
|
|
<mat-icon matSuffix>search</mat-icon>
|
|
|
|
</mat-form-field>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<div fxLayoutAlign="end" [style.margin]="'10px 10px'">
|
|
|
|
** probe가 설치된 host와 그 probe가 가장 상위에 나와야 함 **
|
|
|
|
<div class="box up"></div>Up
|
|
|
|
<div class="box down"></div>Down
|
|
|
|
<div class="box warn"></div>Warn
|
|
|
|
<div class="box error"></div>Error
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div *ngIf="loading" fxLayoutAlign="center">
|
|
|
|
<mat-spinner></mat-spinner>
|
|
|
|
</div>
|
|
|
|
<div *ngIf="!loading" class="search-result" infinite-scroll [infiniteScrollDistance]="2" [infiniteScrollThrottle]="50" (scrolled)="onScroll()" [scrollWindow]="false">
|
|
|
|
<div class="infra-list mat-elevation-z4 " *ngFor="let infra of hostDataList">
|
|
|
|
<mat-toolbar>
|
|
|
|
<mat-toolbar-row>
|
|
|
|
<span matTooltip="showHostInfo(infra)">IP : {{infra.host.ip}}</span>
|
|
|
|
<span class="pull-right"></span>
|
|
|
|
<span style="margin-right: 20px">
|
|
|
|
</span>
|
|
|
|
<button mat-raised-button color="primary" fxLayoutAlign="end" (click)="addSensor(infra)">Add Sensor</button>
|
|
|
|
</mat-toolbar-row>
|
|
|
|
</mat-toolbar>
|
|
|
|
|
|
|
|
<mat-card-content *ngFor="let service of infra.services">
|
|
|
|
<mat-grid-list cols="6" rowHeight="9:1">
|
|
|
|
<mat-grid-tile [rowspan]="2" style="background-color: lightcoral">
|
|
|
|
{{service.vendor.name}}
|
|
|
|
</mat-grid-tile>
|
|
|
|
<mat-grid-tile [colspan]="3" style="background-color: lightblue">
|
|
|
|
<div class="grid-left-align">
|
|
|
|
Port : {{service.port}} | {{service.portType}} {{service.tlsType ? '| TLS' : ''}}
|
|
|
|
</div>
|
|
|
|
</mat-grid-tile>
|
|
|
|
<mat-grid-tile [rowspan]="2" style="background-color: lightgray">
|
|
|
|
<span class="pull-right"></span>
|
|
|
|
<button mat-button fxLayoutAlign="end" (click)="addSensor(infra)">Add Sensor</button>
|
|
|
|
</mat-grid-tile>
|
|
|
|
<mat-grid-tile [colspan]="3" style="background-color: lightgreen">
|
|
|
|
<div class="grid-left-align">
|
|
|
|
</div>
|
|
|
|
</mat-grid-tile>
|
|
|
|
</mat-grid-list>
|
|
|
|
</mat-card-content>
|
|
|
|
</div>
|
2018-04-10 12:37:09 +00:00
|
|
|
</div> -->
|