inframap - sensorlist

src/app/pages/infra/infra-page.component.html

@@ -1,3 +1 @@
-
-<button mat-raised-button color="primary" (click)="authProbe()">Probe 인증</button>
 <of-infra-map></of-infra-map>

src/app/pages/infra/infra-page.component.ts

@@ -14,7 +14,4 @@ export class InfraPageComponent implements OnInit {
 
   ngOnInit() {
   }
-
-  authProbe() {
-  }
 }

src/packages/infra/component/map/map.component.html

@@ -22,6 +22,9 @@
       <mat-toolbar-row>
         <span matTooltip="showHostInfo(infra)">IP : {{infra.host.ip}}</span>
         <span class="pull-right"></span>
+        <span style="margin-right: 20px">
+            <of-sensor-name-tag [target]="infra.target"></of-sensor-name-tag>
+        </span>
         <button mat-raised-button color="primary" fxLayoutAlign="end" (click)="addSensor(infra)">Add Sensor</button>
       </mat-toolbar-row>
     </mat-toolbar>
@@ -42,7 +45,7 @@
         </mat-grid-tile>
         <mat-grid-tile [colspan]="3" style="background-color: lightgreen">
           <div class="grid-left-align">
-            <span *ngFor="let sensor of infra.target.sensors">{{sensor.name}}</span>
+              <of-sensor-name-tag [target]="service.target"></of-sensor-name-tag>
           </div>
         </mat-grid-tile>
       </mat-grid-list>

src/packages/infra/component/map/map.component.ts

@@ -12,6 +12,7 @@ import { SettingComponent } from '../../../sensor/component/setting/setting.comp
 import { Target } from 'packages/target/model';
 
 interface HostData {
+  id: string;
   target?: Target;
   host: InfraHost;
   services: InfraService[];
@@ -51,7 +52,9 @@ export class MapComponent implements OnInit, AfterContentInit {
     // Test
     const list = new Array();
     for (let i = 0; i < 10; i++) {
+      const rand = Math.floor(Math.random() * 4) + 1;
       const host: InfraHost = {
+        id: 1,
         target: {
           id: 1
         },
@@ -62,8 +65,9 @@ export class MapComponent implements OnInit, AfterContentInit {
       };
       list.push(host);
 
-      for (let j = 0; j < 3; j++) {
+      for (let j = 0; j < rand; j++) {
         const service: InfraService = {
+          id: 2,
           target: {
             id: 1
           },
@@ -73,10 +77,10 @@ export class MapComponent implements OnInit, AfterContentInit {
           host: {
             ip: i,
           },
-          portType: 'TCP',
+          portType: i % 2 ? 'TCP' : 'UDP',
           port: i,
           vendor: {
-            name: String('vendor' + i)
+            name: String('vendor' + i + '-' + j)
           }
         };
         list.push(service);
@@ -100,6 +104,7 @@ export class MapComponent implements OnInit, AfterContentInit {
           continue;
         }
         const data: HostData = {
+          id: String(infra.id),
           target: infra.target,
           host: infra,
           services: new Array(),
@@ -107,7 +112,7 @@ export class MapComponent implements OnInit, AfterContentInit {
         this.hostDataList.push(data);
       } else if (infraType === 'OS_SERVICE') {
         const infraService: InfraService = infra;
-        if (filterStr && infraService.vendor.name.indexOf(filterStr) < 0) {
+        if (filterStr && this.checkFilterString(infraService, filterStr)) {
           continue;
         }
         const existHost = this.getExistHost(infraService.host);
@@ -115,6 +120,7 @@ export class MapComponent implements OnInit, AfterContentInit {
           existHost.services.push(infraService);
         } else {
           const host: HostData = {
+            id: String(infra.id),
             target: infra.target,
             host: infraService.host,
             services: new Array()
@@ -127,6 +133,16 @@ export class MapComponent implements OnInit, AfterContentInit {
     this.loading = false;
   }
 
+  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) {
@@ -165,7 +181,10 @@ export class MapComponent implements OnInit, AfterContentInit {
     });
 
     dialogRef.afterClosed().subscribe(result => {
-      console.log('The dialog was closed');
+      if (result) {
+        console.log('infra 갱신');
+        this.getInfraList();
+      }
     });
   }
 

src/packages/sensor/component/index.ts

@@ -8,6 +8,7 @@ import { CrawlerSelectorComponent } from './setting/crawler-selector/crawler-sel
 import { CrawlerAuthComponent } from './setting/crawler-auth/crawler-auth.component';
 import { SensorItemSelectorComponent } from './setting/sensor-item-selector/sensor-item-selector.component';
 import { SettingETCComponent } from './setting/setting-etc/setting-etc.component';
+import { NameTagComponent } from './name-tag/name-tag.component';
 
 export const COMPONENTS = [
   SettingComponent,
@@ -19,5 +20,6 @@ export const COMPONENTS = [
   CrawlerSelectorComponent,
   CrawlerAuthComponent,
   SensorItemSelectorComponent,
-  SettingETCComponent
+  SettingETCComponent,
+  NameTagComponent,
 ];

src/packages/sensor/component/name-tag/name-tag.component.html

@@ -0,0 +1,5 @@
+<mat-chip-list>
+  <mat-chip *ngFor="let sensor of sensors">
+    {{sensor.description}}
+  </mat-chip>
+</mat-chip-list>

src/packages/sensor/component/name-tag/name-tag.component.ts

@@ -0,0 +1,59 @@
+import { Component, OnInit, AfterViewInit, ViewChild, Input } from '@angular/core';
+import { MatTableDataSource, MatSort, MatDialog } from '@angular/material';
+import { AfterContentInit } from '@angular/core/src/metadata/lifecycle_hooks';
+import { Router } from '@angular/router';
+import { Sensor } from '../../model';
+
+import { Store, select } from '@ngrx/store';
+
+import * as SensorStore from '../../store';
+
+import { RPCClientError } from '@loafer/ng-rpc/protocol';
+import * as ListStore from '../../store/list';
+import { sensorListSelector } from '../../store';
+import { Page, PageParams } from 'app/commons/model';
+import { Target } from 'packages/target/model';
+
+@Component({
+  selector: 'of-sensor-name-tag',
+  templateUrl: './name-tag.component.html',
+  styleUrls: ['./name-tag.component.scss']
+})
+export class NameTagComponent implements OnInit, AfterContentInit {
+
+  sensorList$ = this.store.pipe(select(sensorListSelector.select('page')));
+  sensors: Sensor[];
+  @Input() target: Target;
+
+  constructor(private router: Router,
+    private store: Store<ListStore.State>,
+    private dialog: MatDialog,
+  ) { }
+
+  ngOnInit() {
+    this.sensorList$.subscribe(
+      (page: Page) => {
+        if (page != null) {
+          this.sensors = page.content;
+        }
+      },
+      (error: RPCClientError) => {
+        console.log(error.response.message);
+      }
+    );
+  }
+
+  ngAfterContentInit() {
+    this.getSensors(0);
+  }
+
+  getSensors(pageIndex: number) {
+    const pageParams: PageParams = {
+      pageNo: pageIndex + '',
+      countPerPage: '9999',
+      sortCol: 'id',
+      sortDirection: 'descending'
+    };
+    this.store.dispatch(new ListStore.ReadAllByTarget({ target: this.target, pageParams }));
+  }
+}

src/packages/sensor/component/setting/setting.component.html

@@ -32,6 +32,6 @@
     <button mat-raised-button *ngIf="step === 2" (click)="onPrev()">Prev</button>
 
     <button mat-raised-button color="primary" (click)="onNext()" *ngIf="step === 1" [disabled]="!nextable">Next</button>
-    <button mat-raised-button color="primary" (click)="onDone()" *ngIf="step === 2">Done</button>
+    <button mat-raised-button color="primary" [mat-dialog-close]="true" *ngIf="step === 2">Done</button>
   </div>
 </div>

src/packages/sensor/service/sensor.service.ts

@@ -9,6 +9,7 @@ import { PageParams, Page } from 'app/commons/model';
 import { SensorItem } from 'packages/sensor-item/model/SensorItem';
 import { Sensor } from '../model';
 import { Domain } from 'packages/domain/model';
+import { Target } from 'packages/target/model';
 
 
 @Injectable()
@@ -24,7 +25,15 @@ export class SensorService {
     return this.rpcService.call('SensorService.readAllByDomain', domain, pageParams);
   }
 
-  public regist(sensor: Sensor, sensorItems: SensorItem[]): Observable<Sensor> {
-    return null;
+  public registSensorConfig(sensor: Sensor, sensorItems: SensorItem[]): Observable<Sensor> {
+    return this.rpcService.call('SensorService.registSensorConfig', sensor, sensorItems, null);
+  }
+
+  public readAllByInfra(infraId: string, pageParams: PageParams): Observable<Page> {
+    return this.rpcService.call('SensorService.readAllByInfra', infraId, pageParams);
+  }
+
+  public readAllByTarget(target: Target, pageParams: PageParams): Observable<Page> {
+    return this.rpcService.call('SensorService.readAllByTarget', target, pageParams);
   }
 }

src/packages/sensor/store/index.ts

@@ -8,27 +8,27 @@ import { StateSelector } from 'packages/core/ngrx/store';
 
 import { MODULE } from '../sensor.constant';
 
-import * as ReadAllByDomainStore from './list';
+import * as ListStore from './list';
 import * as RegistStore from './regist';
 
 export interface State {
-  list: ReadAllByDomainStore.State;
+  list: ListStore.State;
   sensor: RegistStore.State;
 }
 
 export const REDUCERS = {
-  list: ReadAllByDomainStore.reducer,
+  list: ListStore.reducer,
   sensor: RegistStore.reducer,
 };
 
 export const EFFECTS = [
-  ReadAllByDomainStore.Effects,
+  ListStore.Effects,
   RegistStore.Effects,
 ];
 
 export const sensorState = createFeatureSelector<State>(MODULE.name);
 
-export const sensorListSelector = new StateSelector<ReadAllByDomainStore.State>(createSelector(
+export const sensorListSelector = new StateSelector<ListStore.State>(createSelector(
   sensorState,
   (state: State) => state.list
 ));

src/packages/sensor/store/list/list.action.ts

@@ -4,11 +4,20 @@ import { RPCClientError } from '@loafer/ng-rpc/protocol';
 
 import { Domain } from 'packages/domain/model';
 import { PageParams, Page } from 'app/commons/model';
+import { Target } from 'packages/target/model';
 
 export enum ActionType {
   ReadAllByDomain = '[Sensor.ReadAllByDomain] ReadAllByDomain',
   ReadAllByDomainSuccess = '[Sensor.ReadAllByDomainSuccess] ReadAllByDomainSuccess',
   ReadAllByDomainFailure = '[Sensor.ReadAllByDomainFailure] ReadAllByDomainFailure',
+
+  ReadAllByInfra = '[Sensor.ReadAllByInfra] ReadAllByInfra',
+  ReadAllByInfraSuccess = '[Sensor.ReadAllByInfraSuccess] ReadAllByInfraSuccess',
+  ReadAllByInfraFailure = '[Sensor.ReadAllByInfraFailure] ReadAllByInfraFailure',
+
+  ReadAllByTarget = '[Sensor.ReadAllByTarget] ReadAllByTarget',
+  ReadAllByTargetSuccess = '[Sensor.ReadAllByTargetSuccess] ReadAllByTargetSuccess',
+  ReadAllByTargetFailure = '[Sensor.ReadAllByTargetFailure] ReadAllByTargetFailure',
 }
 
 export class ReadAllByDomain implements Action {
@@ -29,8 +38,49 @@ export class ReadAllByDomainFailure implements Action {
   constructor(public payload: RPCClientError) {}
 }
 
+export class ReadAllByInfra implements Action {
+  readonly type = ActionType.ReadAllByInfra;
+
+  constructor(public payload: { id: string, pageParams: PageParams}) {}
+}
+
+export class ReadAllByInfraSuccess implements Action {
+  readonly type = ActionType.ReadAllByInfraSuccess;
+
+  constructor(public payload: Page) {}
+}
+
+export class ReadAllByInfraFailure implements Action {
+  readonly type = ActionType.ReadAllByInfraFailure;
+
+  constructor(public payload: RPCClientError) {}
+}
+//
+export class ReadAllByTarget implements Action {
+  readonly type = ActionType.ReadAllByTarget;
+
+  constructor(public payload: { target: Target, pageParams: PageParams}) {}
+}
+
+export class ReadAllByTargetSuccess implements Action {
+  readonly type = ActionType.ReadAllByTargetSuccess;
+
+  constructor(public payload: Page) {}
+}
+
+export class ReadAllByTargetFailure implements Action {
+  readonly type = ActionType.ReadAllByTargetFailure;
+
+  constructor(public payload: RPCClientError) {}
+}
 export type Actions =
   | ReadAllByDomain
   | ReadAllByDomainSuccess
   | ReadAllByDomainFailure
+  | ReadAllByInfra
+  | ReadAllByInfraSuccess
+  | ReadAllByInfraFailure
+  | ReadAllByTarget
+  | ReadAllByTargetSuccess
+  | ReadAllByTargetFailure
 ;

src/packages/sensor/store/list/list.effect.spec.ts

@@ -1,15 +0,0 @@
-import { TestBed, inject } from '@angular/core/testing';
-
-import { Effects } from './list.effect';
-
-describe('ReadAllByDomain.Effects', () => {
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      providers: [Effects]
-    });
-  });
-
-  it('should be created', inject([Effects], (effects: Effects) => {
-    expect(effects).toBeTruthy();
-  }));
-});

src/packages/sensor/store/list/list.effect.ts

@@ -22,6 +22,12 @@ import {
   ReadAllByDomain,
   ReadAllByDomainSuccess,
   ReadAllByDomainFailure,
+  ReadAllByInfra,
+  ReadAllByInfraSuccess,
+  ReadAllByInfraFailure,
+  ReadAllByTarget,
+  ReadAllByTargetSuccess,
+  ReadAllByTargetFailure,
   ActionType,
 } from './list.action';
 
@@ -46,4 +52,27 @@ export class Effects {
       return of(new ReadAllByDomainFailure(error));
     });
 
+  @Effect()
+  readAllByInfra$: Observable<Action> = this.actions$
+    .ofType(ActionType.ReadAllByInfra)
+    .map((action: ReadAllByInfra) => action.payload)
+    .switchMap(payload => this.service.readAllByInfra(payload.id, payload.pageParams))
+    .map(list => {
+      return new ReadAllByInfraSuccess(list);
+    })
+    .catch((error: RPCClientError) => {
+      return of(new ReadAllByInfraFailure(error));
+    });
+
+  @Effect()
+  readAllByTarget$: Observable<Action> = this.actions$
+    .ofType(ActionType.ReadAllByTarget)
+    .map((action: ReadAllByTarget) => action.payload)
+    .switchMap(payload => this.service.readAllByTarget(payload.target, payload.pageParams))
+    .map(list => {
+      return new ReadAllByTargetSuccess(list);
+    })
+    .catch((error: RPCClientError) => {
+      return of(new ReadAllByTargetFailure(error));
+    });
 }

src/packages/sensor/store/list/list.reducer.ts

@@ -38,6 +38,57 @@ import {
         };
       }
 
+      case ActionType.ReadAllByInfra: {
+        return {
+          ...state,
+          error: null,
+          pending: true,
+        };
+      }
+
+      case ActionType.ReadAllByInfraSuccess: {
+        return {
+          ...state,
+          error: null,
+          pending: false,
+          page: action.payload
+        };
+      }
+
+      case ActionType.ReadAllByInfraFailure: {
+        return {
+          ...state,
+          error: action.payload,
+          pending: false,
+          page: null,
+        };
+      }
+
+      case ActionType.ReadAllByTarget: {
+        return {
+          ...state,
+          error: null,
+          pending: true,
+        };
+      }
+
+      case ActionType.ReadAllByTargetSuccess: {
+        return {
+          ...state,
+          error: null,
+          pending: false,
+          page: action.payload
+        };
+      }
+
+      case ActionType.ReadAllByTargetFailure: {
+        return {
+          ...state,
+          error: action.payload,
+          pending: false,
+          page: null,
+        };
+      }
       default: {
         return state;
       }

src/packages/sensor/store/regist/regist.effect.ts

@@ -38,7 +38,7 @@ export class Effects {
   regist$: Observable<Action> = this.actions$
     .ofType(ActionType.Regist)
     .map((action: Regist) => action.payload)
-    .switchMap(payload => this.service.regist(payload.sensor, payload.sensorItems))
+    .switchMap(payload => this.service.registSensorConfig(payload.sensor, payload.sensorItems))
     .map(list => {
       return new RegistSuccess(list);
     })