diff --git a/src/packages/discovery/component/setting/setting.component.html b/src/packages/discovery/component/setting/setting.component.html index 6033980..110f98f 100644 --- a/src/packages/discovery/component/setting/setting.component.html +++ b/src/packages/discovery/component/setting/setting.component.html @@ -5,7 +5,7 @@ --> - + @@ -17,6 +17,7 @@ +
@@ -26,6 +27,7 @@ +
@@ -33,6 +35,7 @@
+
@@ -42,17 +45,29 @@ +
- + + + + +
+ +
{{car.name}}
+
+
+
- +
@@ -68,7 +83,7 @@
- + @@ -79,8 +94,8 @@
- - + +
diff --git a/src/packages/discovery/component/setting/setting.component.ts b/src/packages/discovery/component/setting/setting.component.ts index 5c9fa5b..aac02ee 100644 --- a/src/packages/discovery/component/setting/setting.component.ts +++ b/src/packages/discovery/component/setting/setting.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, AfterContentInit } from '@angular/core'; +import { Component, OnInit, AfterContentInit, Output, EventEmitter } from '@angular/core'; import { Store, select } from '@ngrx/store'; import { RPCClientError } from '@loafer/ng-rpc/protocol'; import { @@ -24,6 +24,9 @@ import { Probe } from 'packages/probe/model'; import { DetailSelector as ProbeDetailSelector } from 'packages/probe/store'; import { TreeNode } from 'primeng/primeng'; + + + // import { TreeNode } from 'angular-tree-component'; @Component({ @@ -33,6 +36,7 @@ import { TreeNode } from 'primeng/primeng'; }) export class SettingComponent implements OnInit, AfterContentInit { + @Output() close = new EventEmitter(); probe$ = this.probeDetailStore.pipe(select(ProbeDetailSelector.select('probe'))); @@ -71,6 +75,8 @@ export class SettingComponent implements OnInit, AfterContentInit { { name: 'NBSS' }, ]; + targetCars = []; + cities = [ {name: 'New York', code: 'NY'}, {name: 'Rome', code: 'RM'}, @@ -128,7 +134,7 @@ export class SettingComponent implements OnInit, AfterContentInit { // (zones: Map) => { // console.log('ZoneZoneZoneZoneZoneZoneZone'); // // console.log(JSON.stringify(zones)); - // this.convertTreeViewZone(zones); + // this.treeNodes = this.convertTreeViewZone(zones); // this.zones = zones; // }, // (error: RPCClientError) => { @@ -138,6 +144,10 @@ export class SettingComponent implements OnInit, AfterContentInit { } + closeDialog() { + this.close.emit(); + } + isZone(zone: Zone): boolean { for (let i = 0; i < this.treeNodes.length; ++i) { @@ -355,7 +365,7 @@ export class SettingComponent implements OnInit, AfterContentInit { treeNodes.push(jZone); }); - this.treeNodes = treeNodes; + return treeNodes; } convertViewHost(hosts): any[] { diff --git a/src/packages/infra/component/map/map.component.html b/src/packages/infra/component/map/map.component.html index 732c380..45a900a 100644 --- a/src/packages/infra/component/map/map.component.html +++ b/src/packages/infra/component/map/map.component.html @@ -1,7 +1,7 @@

Map

- +
diff --git a/src/packages/infra/component/map/map.component.ts b/src/packages/infra/component/map/map.component.ts index c429fc5..8ab9b76 100644 --- a/src/packages/infra/component/map/map.component.ts +++ b/src/packages/infra/component/map/map.component.ts @@ -7,6 +7,20 @@ import { } from '@angular/core'; import { Router } from '@angular/router'; import { TreeNode } from 'primeng/primeng'; +import { Store, select } from '@ngrx/store'; +import * as ListStore from '../../store/list'; +import { ListSelector } from '../../store'; +import { Page } from 'app/commons/model'; +import { RPCClientError } from '@loafer/ng-rpc/protocol'; +import { Target } from 'packages/target/model'; +import { Infra, InfraHost, InfraOSApplication, InfraService } from '../../model'; + +interface HostData { + id: string; + target?: Target; + host: InfraHost; + services: InfraService[]; +} @Component({ selector: 'of-infra-map', @@ -15,18 +29,205 @@ import { TreeNode } from 'primeng/primeng'; export class MapComponent implements OnInit, AfterContentInit { infraTree: TreeNode[] = testInfraList; + infras$ = this.listStore.pipe(select(ListSelector.select('page'))); + display = false; + loading = false; - constructor(private router: Router) {} + totalList: Infra[]; + hostDataList: HostData[] = new Array(); - ngAfterContentInit() {} + DEFAULT_EXPANDED: Boolean = true; + + constructor(private router: Router, + private listStore: Store, + ) {} + + ngAfterContentInit() { + + this.infras$.subscribe( + (page: Page) => { + if (page !== null) { + this.totalList = page.content; + this.generateInfraHostData(); + } + }, + (error: RPCClientError) => { + console.log(error.response.message); + }); + } ngOnInit() {} + + generateInfraHostData(filterStr?: string) { + + const itl: TreeNode[] = []; + + const root: TreeNode = { + label: 'Infra', + expandedIcon: 'fa-folder-open', + collapsedIcon: 'fa-folder', + expanded: true, + children: [], + }; + + const probeMap: Map = new Map(); + + const hostMap: Map = new Map(); + + this.loading = true; + + const infraTree = { + label: 'Infra', + expandedIcon: 'fa-folder-open', + collapsedIcon: 'fa-folder', + expanded: true, + children: [], + }; + + for (const infra of this.totalList) { + const infraType = infra.infraType.name; + if (infraType === 'HOST') { + const infraHost: InfraHost = infra; + if (filterStr && String(infraHost.ip).indexOf(filterStr) < 0) { + continue; + } + + if (probeMap.has(infraHost.probe.id) === false) { + probeMap.set(infraHost.probe.id, []); + } + + const ihl: InfraHost[] = probeMap.get(infraHost.probe.id); + ihl.push(infraHost); + probeMap.set(infraHost.probe.id, ihl); + // const data: HostData = { + // id: String(infra.id), + // target: infra.target, + // host: infra, + // services: new Array(), + // }; + // this.hostDataList.push(data); + } else if (infraType === 'OS_SERVICE') { + const infraService: InfraService = infra; + if (filterStr && this.checkFilterString(infraService, filterStr)) { + continue; + } + + if (hostMap.has(infraService.host.ip) === false) { + hostMap.set(infraService.host.ip, []); + } + + const isl = hostMap.get(infraService.host.ip); + isl.push(infraService); + + // const existHost = this.getExistHost(infraService.host); + // if (existHost !== null) { + // existHost.services.push(infraService); + // } else { + // const host: HostData = { + // id: String(infra.id), + // target: infra.target, + // host: infraService.host, + // services: new Array() + // }; + // host.services.push(infraService); + // this.hostDataList.push(host); + // } + + + const probeTreeNodes: TreeNode[] = []; + + probeMap.forEach((ifhl: InfraHost[], key: number) => { + + const tp: TreeNode = { + label: 'Probe - ' + key, + expandedIcon: 'fa-folder-open', + collapsedIcon: 'fa-folder', + expanded: this.DEFAULT_EXPANDED.valueOf(), + children: [], + }; + + ifhl.map((ih: InfraHost, idx: number) => { + + const th: TreeNode = { + label: 'Host - ' + ih.ip, + expandedIcon: 'fa-folder-open', + collapsedIcon: 'fa-folder', + expanded: this.DEFAULT_EXPANDED.valueOf(), + children: [], + }; + + if (hostMap.has(ih.ip)) { + + const ifsl = hostMap.get(ih.ip); + + for (let i = 0 ; i < ifsl.length; ++i) { + const ts: TreeNode = { + label: 'Service - ' + ifsl[i].vendor.name, + expandedIcon: 'fa-folder-open', + collapsedIcon: 'fa-folder', + expanded: this.DEFAULT_EXPANDED.valueOf(), + children: [], + }; + + th.children.push(ts); + } + + } + + + tp.children.push(th); + + }); + + probeTreeNodes.push(tp); + }); + + + + infraTree.children.push(probeTreeNodes); + + + } + + + } + this.loading = false; + + + return infraTree; + + } + + checkFilterString(infraService: InfraService, filterStr: string) { + const upperCased = filterStr.toUpperCase().toUpperCase(); + if (infraService.vendor.name.toUpperCase().indexOf(upperCased) < 0 && + String(infraService.port).toUpperCase().indexOf(upperCased) < 0 && + infraService.portType.toUpperCase().indexOf(upperCased)) { + return true; + } + return false; + } + + getExistHost(infraHost: InfraHost): HostData { + let node = null; + for (const data of this.hostDataList) { + if (data.host.ip === infraHost.ip) { + node = data; + } + } + return node; + } + showDialog() { this.display = true; } + closeDialog() { + this.display = false; + } + expandAll() { this.infraTree.forEach(node => { this.expandRecursive(node, true);