77 lines
4.2 KiB
HTML
77 lines
4.2 KiB
HTML
<of-error-message [error]="error$ | async" [closable]="false"></of-error-message>
|
|
<of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
|
|
|
|
<p-panel #content [showHeader]="false" class="block-panel">
|
|
|
|
<p-messages [(value)]="msgs"></p-messages>
|
|
|
|
<p-tree [value]="zoneNode" layout="vertical">
|
|
<!-- ZONE node template -->
|
|
<ng-template let-node pTemplate="ZONE">
|
|
<!-- 이미 저장된 Infra인 Node-->
|
|
<div *ngIf="node.data.date">
|
|
<p-toggleButton [disabled]="node.data.target" onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square"
|
|
[style]="{'width':'200px'}" (onChange)="onTargetSelect($event, node)"></p-toggleButton> {{node.data.date | date: 'yy/MM/dd'}}
|
|
</div>
|
|
</ng-template>
|
|
|
|
<!-- HOST node template -->
|
|
<ng-template let-node pTemplate="HOST">
|
|
<!-- 이미 저장된 Infra인 Node-->
|
|
<div *ngIf="node.data.date">
|
|
<p-toggleButton [disabled]="node.data.target" onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square"
|
|
[style]="{'width':'200px'}" (onChange)="onTargetSelect($event, node)"></p-toggleButton> {{node.data.date | date: 'yy/MM/dd'}}
|
|
</div>
|
|
|
|
<!-- 새로 Discovery된 Host -->
|
|
<div *ngIf="!node.data.date" @discoveryResultAnim>
|
|
<div *ngIf="checkHighlight(node.label, 0) else unhighlightHost">
|
|
<p-toggleButton onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square" [style]="{'width':'200px'}"
|
|
(onChange)="onTargetSelect($event, node)"></p-toggleButton> New!!
|
|
</div>
|
|
|
|
<ng-template #unhighlightHost>
|
|
<p-toggleButton onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square" [style]="{'width':'200px', 'opacity':'0.2'}"
|
|
(onChange)="onTargetSelect($event, node)"></p-toggleButton> New!!
|
|
</ng-template>
|
|
</div>
|
|
</ng-template>
|
|
|
|
<!-- SERVICE node template -->
|
|
<ng-template let-node pTemplate="SERVICE">
|
|
<!-- 이미 저장된 Infra인 Node-->
|
|
<div *ngIf="node.data.date">
|
|
<p-toggleButton [disabled]="node.data.target" onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square"
|
|
[style]="{'width':'200px'}" (onChange)="onTargetSelect($event, node)"></p-toggleButton> {{node.data.date | date: 'yy/MM/dd'}}
|
|
</div>
|
|
|
|
<!-- 새로 Discovery된 Service -->
|
|
<div *ngIf="!node.data.date" @discoveryResultAnim>
|
|
<div *ngIf="checkHighlight(node.label, 0) else unhighlightHost">
|
|
<p-toggleButton onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square" [style]="{'width':'200px'}"
|
|
(onChange)="onTargetSelect($event, node)"></p-toggleButton> New!!
|
|
</div>
|
|
|
|
<ng-template #unhighlightHost>
|
|
<p-toggleButton onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square" [style]="{'width':'200px', 'opacity':'0.2'}"
|
|
(onChange)="onTargetSelect($event, node)"></p-toggleButton> New!!
|
|
</ng-template>
|
|
</div>
|
|
</ng-template>
|
|
</p-tree>
|
|
|
|
<button class="ui-button-width-fit ui-float-right ui-top-space-10" [disabled]="selectedItems.length === 0" type="button"
|
|
label="Save" icon="ui-icon-close" pButton (click)="saveTargets()"></button>
|
|
|
|
</p-panel>
|
|
|
|
|
|
<p-dialog header="Title" [(visible)]="targetSaved" [modal]="true" [responsive]="true" [width]="600" [minWidth]="200" [minY]="70"
|
|
[closeOnEscape]="false">
|
|
<span>Target 지정이 완료되었습니다. 이어서 Sensor를 등록하시면 좋겠다능</span>
|
|
<p-footer>
|
|
<button type="button" pButton label="메인으로"></button>
|
|
<button type="button" pButton label="Target으로"></button>
|
|
<button type="button" pButton label="InfraMap으로"></button>
|
|
</p-footer>
|
|
</p-dialog> |