test

@overflow/discovery/component/discovery-infra-tree.component.html

@@ -19,21 +19,14 @@
         <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'}}
+                <p-toggleButton [style]="checkHighlight(node.label, 0) ? {'width':'200px'} : {'width':'200px','opacity':'0.2'}" [disabled]="node.data.target"
+                    onLabel="{{node.label}}" offLabel="{{node.label}}" onIcon="fa-check" offIcon="fa-square" (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>
+                <p-toggleButton [style]="checkHighlight(node.label, 0) ? {'width':'200px'} : {'width':'200px','opacity':'0.2'}" 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>
 
@@ -41,21 +34,15 @@
         <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'}}
+                <p-toggleButton [style]="checkHighlight(node.label, 0) ? {'width':'200px'} : {'width':'200px','opacity':'0.2'}" [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>
+                <p-toggleButton [style]="checkHighlight(node.label, 0) ? {'width':'200px'} : {'width':'200px','opacity':'0.2'}" 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>
     </p-tree>

@overflow/discovery/component/discovery-infra-tree.component.ts

@@ -338,12 +338,12 @@ export class DiscoveryInfraTreeComponent implements OnChanges {
     });
   }
 
-  checkHighlight(label: string, type: number) {
+  checkHighlight(name: string, type: number) {
     let highlight = true;
-    if (this.filterWord && (label.toUpperCase().indexOf(this.filterWord.toUpperCase()) < 0)) {
+    if (this.filterWord && (name.toUpperCase().indexOf(this.filterWord.toUpperCase()) < 0)) {
       highlight = false;
     }
-    if (type === 1 && this.filterServices[label] === false) {
+    if (type === 1 && this.filterServices[name] === false) {
       highlight = false;
     }
     return highlight;

@overflow/discovery/component/discovery.component.html

@@ -15,14 +15,13 @@
         <of-discovery-request-summary *ngIf="discoverZone" @discoveryFilterAnim [discoverZone]="discoverZone"></of-discovery-request-summary>
       </p-accordionTab>
       <p-accordionTab header="Filter" [selected]="startDate !== null" [disabled]="startDate === null">
-        <of-discovery-search-filter #filter (search)="filterWord=$event" (serviceSelect)="filterServices=$event"></of-discovery-search-filter>
+        <of-discovery-search-filter (search)="filterWord=$event" (serviceSelect)="filterServices=$event"></of-discovery-search-filter>
       </p-accordionTab>
     </p-accordion>
   </div>
 
   <div class="ui-g-12 ui-md-9">
-    <of-discovery-infra-tree #infraTree *ngIf="selectedProbe" [probeHost]="selectedProbe" [filterWord]="filterWord" [filterServices]="filterServices"></of-discovery-infra-tree>
-    <!-- <of-discovery-result *ngIf="requested else info" [probeHost]="selectedProbe" [filterWord]="filterWord" [filterServices]="filterServices"></of-discovery-result> -->
+    <of-discovery-infra-tree #infraTree *ngIf="selectedProbe else info" [probeHost]="selectedProbe" [filterWord]="filterWord"></of-discovery-infra-tree>
   </div>
 </div>
 

@overflow/discovery/component/discovery.component.ts

@@ -37,7 +37,6 @@ export class DiscoveryComponent implements OnInit, OnDestroy {
   filterServices: Service[];
 
   @ViewChild('infraTree') infraTree: DiscoveryInfraTreeComponent;
-  @ViewChild('filter') filter: SearchFilterComponent;
 
   constructor(
     private discoveryService: DiscoveryService,
@@ -104,7 +103,6 @@ export class DiscoveryComponent implements OnInit, OnDestroy {
           case 'DiscoveryService.discoveredService': {
             const service = discoveryNotify.params as Service;
             this.infraTree.addService(service);
-            this.filter.addService(service);
             break;
           }
           default: {

@overflow/discovery/component/search-filter.component.html

@@ -1,15 +1,12 @@
 <div class="ui-g">
   <input type="text" pInputText placeholder="Search..." [(ngModel)]="filterWord" (keyup)="onSearch($event)">
 
-  <div class="ui-g">
+  <!-- <div class="ui-g">
     <div *ngFor="let service of services">
       <p-toggleButton offLabel="{{service.key}}" onLabel="{{service.key}}" [style]="{'width':'100px'}" (onChange)="onServiceFilter($event, service)"
         [(ngModel)]="filterServices[service.key]"></p-toggleButton>
-
-      <!-- <p-checkbox [(ngModel)]="filterServices" label="{{service.serviceName}}" value="{{service.serviceName}}"></p-checkbox> -->
-
     </div>
-  </div>
+  </div> -->
 
 
 </div>

@overflow/discovery/component/search-filter.component.ts

@@ -16,10 +16,8 @@ export class SearchFilterComponent implements OnInit {
 
   services: Service[] = [];
   filterWord: string;
-  filterServices = new Map<string, boolean>();
 
   @Output() search = new EventEmitter<string>();
-  @Output() serviceSelect = new EventEmitter<Map<string, boolean>>();
 
   constructor(
   ) {
@@ -36,33 +34,18 @@ export class SearchFilterComponent implements OnInit {
   }
 
   addService(service: Service) {
-    if (service.key.indexOf('Not Supported Service') >= 0) {
-      const tempName = service.key.split('Perhaps ')[1].split('[')[0];
-      service.key = '*' + tempName;
-    }
-    let exist = false;
-    this.services.forEach(value => {
-      if (value.key === service.key) {
-        exist = true;
-        return;
-      }
-    });
-    if (!exist) {
-      this.services.push(service);
-      this.filterServices[service.key] = true;
-    }
-    this.serviceSelect.emit(this.filterServices);
-  }
-
-  onServiceFilter(e, service: Service) {
-    // if (e.checked) {
-    //   this.filterServices.push(service);
-    // } else {
-    //   const index = this.filterServices.indexOf(service);
-    //   this.filterServices.splice(index, 1);
+    // let exist = false;
+    // this.services.forEach(value => {
+    //   if (value.key === service.key) {
+    //     exist = true;
+    //     return;
+    //   }
+    // });
+    // if (!exist) {
+    //   this.services.push(service);
+    //   this.filterServices[service.key] = true;
     // }
-
-    this.serviceSelect.emit(this.filterServices);
+    // this.serviceSelect.emit(this.filterServices);
   }
 
 }