This commit is contained in:
snoop 2018-03-19 20:05:31 +09:00
commit e0caf64828
29 changed files with 388 additions and 107 deletions

View File

@ -2,10 +2,14 @@ import { Component, OnInit, AfterContentInit } from '@angular/core';
import { MatCheckboxChange } from '@angular/material'; import { MatCheckboxChange } from '@angular/material';
import { Store, select } from '@ngrx/store'; import { Store, select } from '@ngrx/store';
import { RPCError } from 'packages/core/rpc/error'; import { RPCError } from 'packages/core/rpc/error';
import * as DiscoverySettingStore from '../../store/setting'; import {
import { DiscoveryStartInfo } from '../../model'; DiscoveryStartInfo,
DiscoveryZone
} from '../../model';
import * as CIDR from 'ip-cidr'; import * as CIDR from 'ip-cidr';
import * as DiscoveryStore from '../../store/setting'; import * as DiscoveredStore from '../../store/setting';
import * as DiscoverStore from '../../store/notification';
import { SettingSelector } from '../../store'; import { SettingSelector } from '../../store';
@Component({ @Component({
@ -15,7 +19,7 @@ import { SettingSelector } from '../../store';
}) })
export class SettingComponent implements OnInit, AfterContentInit { export class SettingComponent implements OnInit, AfterContentInit {
settingSucceed$ = this.store.pipe(select(SettingSelector.select('isStart'))); settingSucceed$ = this.discoverdstore.pipe(select(SettingSelector.select('isStart')));
started = false; started = false;
cidr; cidr;
@ -38,7 +42,8 @@ export class SettingComponent implements OnInit, AfterContentInit {
hosts = nodes; hosts = nodes;
constructor( constructor(
private store: Store<DiscoverySettingStore.State>, private discoverdstore: Store<DiscoveredStore.State>,
private discoverstore: Store<DiscoverStore.State>,
) { ) {
} }
@ -102,7 +107,16 @@ export class SettingComponent implements OnInit, AfterContentInit {
startPort: this.startPort, startPort: this.startPort,
endPort: this.endPort endPort: this.endPort
}; };
this.store.dispatch(new DiscoverySettingStore.Setting(startInfo));
const discoveryZone: DiscoveryZone = {
discoveryHost: {
firstScanRange: this.startIP,
lastScanRange: this.endIP,
}
};
// this.store.dispatch(new DiscoverySettingStore.Setting(startInfo));
this.discoverstore.dispatch(new DiscoverStore.DiscoverZone({probeID: '52abd6fd57e511e7ac52080027658d13', discoveryZone: discoveryZone}));
this.started = true; this.started = true;
} }

View File

@ -1,10 +1,10 @@
import { DiscoveryPort } from './DiscoveryPort'; import { DiscoveryPort } from './DiscoveryPort';
export interface DiscoveryHost { export interface DiscoveryHost {
firstScanRange: string; firstScanRange?: string;
lastScanRange: string; lastScanRange?: string;
excludeHosts: string[]; excludeHosts?: string[];
includeHosts: string[]; includeHosts?: string[];
discoveryPort?: DiscoveryPort; discoveryPort?: DiscoveryPort;
} }

View File

@ -26,6 +26,7 @@ export const REDUCERS = {
export const EFFECTS = [ export const EFFECTS = [
SettingStore.Effects, SettingStore.Effects,
NotificationStore.Effects,
]; ];
export const selectDiscoveryState = createFeatureSelector<State>(MODULE.name); export const selectDiscoveryState = createFeatureSelector<State>(MODULE.name);

View File

@ -1,3 +1,4 @@
export * from './notification.action'; export * from './notification.action';
export * from './notification.reducer'; export * from './notification.reducer';
export * from './notification.state'; export * from './notification.state';
export * from './notification.effect';

View File

@ -8,15 +8,47 @@ import {
Host, Host,
Port, Port,
Service, Service,
} from '../../model'; DiscoveryZone,
DiscoveryHost,
DiscoveryPort,
DiscoveryService as MDiscoveryService,
} from '../../model';
export enum ActionType { export enum ActionType {
DiscoverZone = '[@@NOTIFICATION] DiscoveryService.discoverZone',
DiscoverHost = '[@@NOTIFICATION] DiscoveryService.discoverHost',
DiscoverPort = '[@@NOTIFICATION] DiscoveryService.discoverPort',
DiscoverService = '[@@NOTIFICATION] DiscoveryService.discoverService',
DiscoveredZone = '[@@NOTIFICATION] DiscoveryService.discoveredZone', DiscoveredZone = '[@@NOTIFICATION] DiscoveryService.discoveredZone',
DiscoveredHost = '[@@NOTIFICATION] DiscoveryService.discoveredHost', DiscoveredHost = '[@@NOTIFICATION] DiscoveryService.discoveredHost',
DiscoveredPort = '[@@NOTIFICATION] DiscoveryService.discoveredPort', DiscoveredPort = '[@@NOTIFICATION] DiscoveryService.discoveredPort',
DiscoveredService = '[@@NOTIFICATION] DiscoveryService.discoveredService', DiscoveredService = '[@@NOTIFICATION] DiscoveryService.discoveredService',
} }
export class DiscoverZone implements Action {
readonly type = ActionType.DiscoverZone;
constructor(public payload: {probeID: string, discoveryZone: DiscoveryZone}) {}
}
export class DiscoverHost implements Action {
readonly type = ActionType.DiscoverHost;
constructor(public payload: {probeID: string, zone: Zone, discoveryHost: DiscoveryHost}) {}
}
export class DiscoverPort implements Action {
readonly type = ActionType.DiscoverPort;
constructor(public payload: {probeID: string, host: Host, discoveryPort: DiscoveryPort}) {}
}
export class DiscoverService implements Action {
readonly type = ActionType.DiscoverService;
constructor(public payload: {probeID: string, port: Port, discoveryService: MDiscoveryService}) {}
}
export class DiscoveredZone implements Action { export class DiscoveredZone implements Action {
readonly type = ActionType.DiscoveredZone; readonly type = ActionType.DiscoveredZone;
@ -41,6 +73,10 @@ export class DiscoveredService implements Action {
} }
export type Actions = export type Actions =
| DiscoverZone
| DiscoverHost
| DiscoverPort
| DiscoverService
| DiscoveredZone | DiscoveredZone
| DiscoveredHost | DiscoveredHost
| DiscoveredPort | DiscoveredPort

View File

@ -0,0 +1,44 @@
import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { Effect, Actions, ofType } from '@ngrx/effects';
import { Action } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/exhaustMap';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/take';
import { RPCError } from 'packages/core/rpc/error';
import {
DiscoverZone,
DiscoverHost,
DiscoverPort,
DiscoverService,
ActionType
} from './notification.action';
import {DiscoveryService} from '../../service/discovery.service';
@Injectable()
export class Effects {
constructor(private actions$: Actions,
private discoveryService: DiscoveryService,
private router: Router) {
}
@Effect({ dispatch: false })
discoveryZone$ = this.actions$
.ofType(ActionType.DiscoverZone)
.map((action: DiscoverZone) => action.payload)
.do(payload => {
this.discoveryService.discoverZone(payload.probeID, payload.discoveryZone);
});
}

View File

@ -47,4 +47,5 @@ export class Effects {
console.log(error.response.message); console.log(error.response.message);
return of(new SettingFailure(error)); return of(new SettingFailure(error));
}); });
} }

View File

@ -8,7 +8,7 @@ import { ListSelector } from '../../store';
import { Page, PageParams } from 'app/commons/model'; import { Page, PageParams } from 'app/commons/model';
import { Domain } from '../../../domain/model'; import { Domain } from '../../../domain/model';
import { MatDialog } from '@angular/material'; import { MatDialog } from '@angular/material';
import { SensorSettingPageComponent } from 'app/pages/sensor-setting/sensor-setting-page.component'; import { SettingComponent } from '../../../sensor/component/setting/setting.component';
@Component({ @Component({
selector: 'of-infra-map', selector: 'of-infra-map',
@ -64,7 +64,7 @@ export class MapComponent implements OnInit, AfterContentInit {
const targetId = infra.target.id; const targetId = infra.target.id;
console.log(targetId); console.log(targetId);
const dialogRef = this.dialog.open(SensorSettingPageComponent, { const dialogRef = this.dialog.open(SettingComponent, {
width: '80%', width: '80%',
data: { } data: { }
}); });

View File

@ -7,15 +7,16 @@ import { InfraStoreModule } from './infra-store.module';
import { COMPONENTS } from './component'; import { COMPONENTS } from './component';
import { SERVICES } from './service'; import { SERVICES } from './service';
import { SensorSettingPageComponent } from 'app/pages/sensor-setting/sensor-setting-page.component';
import { SensorSettingPageModule } from 'app/pages/sensor-setting/sensor-setting-page.module'; import { SensorSettingPageModule } from 'app/pages/sensor-setting/sensor-setting-page.module';
import { SensorModule } from '../sensor/sensor.module';
import { SettingComponent } from '../sensor/component/setting/setting.component';
@NgModule({ @NgModule({
imports: [ imports: [
CommonModule, CommonModule,
MaterialModule, MaterialModule,
InfraStoreModule, InfraStoreModule,
SensorSettingPageModule SensorModule
], ],
declarations: [ declarations: [
COMPONENTS, COMPONENTS,
@ -27,7 +28,7 @@ import { SensorSettingPageModule } from 'app/pages/sensor-setting/sensor-setting
SERVICES SERVICES
], ],
entryComponents: [ entryComponents: [
SensorSettingPageComponent, SettingComponent,
] ]
}) })
export class InfraModule { } export class InfraModule { }

View File

@ -3,6 +3,10 @@ import { SettingResultComponent } from './setting-result/setting-result.componen
import { FilterComponent } from './list/filter/filter.component'; import { FilterComponent } from './list/filter/filter.component';
import { ListComponent } from './list/list.component'; import { ListComponent } from './list/list.component';
import { DetailComponent } from './detail/detail.component'; import { DetailComponent } from './detail/detail.component';
import { TargetSelectorComponent } from './setting/target-selector/target-selector.component';
import { CrawlerSelectorComponent } from './setting/crawler-selector/crawler-selector.component';
import { CrawlerAuthComponent } from './setting/crawler-auth/crawler-auth.component';
import { SensorItemSelectorComponent } from './setting/sensor-item-selector/sensor-item-selector.component';
export const COMPONENTS = [ export const COMPONENTS = [
SettingComponent, SettingComponent,
@ -10,4 +14,8 @@ export const COMPONENTS = [
ListComponent, ListComponent,
FilterComponent, FilterComponent,
DetailComponent, DetailComponent,
TargetSelectorComponent,
CrawlerSelectorComponent,
CrawlerAuthComponent,
SensorItemSelectorComponent
]; ];

View File

@ -0,0 +1,15 @@
<div>
<mat-card>
<mat-card-header>
<mat-card-title>Step 3</mat-card-title>
<mat-card-subtitle>Crawler 인증</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<perfect-scrollbar style="height: 150px">
크롤러 인증해야 됨
</perfect-scrollbar>
</mat-card-content>
</mat-card>
</div>

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { CrawlerAuthComponent } from './crawler-auth.component';
describe('FilterComponent', () => {
let component: CrawlerAuthComponent;
let fixture: ComponentFixture<CrawlerAuthComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CrawlerAuthComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CrawlerAuthComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,16 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'of-crawler-auth',
templateUrl: './crawler-auth.component.html',
styleUrls: ['./crawler-auth.component.scss']
})
export class CrawlerAuthComponent implements OnInit {
constructor(private router: Router) { }
ngOnInit() {
}
}

View File

@ -0,0 +1,15 @@
<div>
<mat-card>
<mat-card-header>
<mat-card-title>Step 2</mat-card-title>
<mat-card-subtitle>Crawler 선택</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<perfect-scrollbar style="height: 150px">
크롤러 골라야됨
</perfect-scrollbar>
</mat-card-content>
</mat-card>
</div>

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { CrawlerSelectorComponent } from './crawler-selector.component';
describe('FilterComponent', () => {
let component: CrawlerSelectorComponent;
let fixture: ComponentFixture<CrawlerSelectorComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CrawlerSelectorComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CrawlerSelectorComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,16 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'of-crawler-selector',
templateUrl: './crawler-selector.component.html',
styleUrls: ['./crawler-selector.component.scss']
})
export class CrawlerSelectorComponent implements OnInit {
constructor(private router: Router) { }
ngOnInit() {
}
}

View File

@ -0,0 +1,17 @@
<div>
<mat-card>
<mat-card-header>
<mat-card-title>Step 4</mat-card-title>
<mat-card-subtitle>Select Sensor Items</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<perfect-scrollbar style="height: 150px">
트리 들어가야됨
</perfect-scrollbar>
</mat-card-content>
</mat-card>
</div>

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { SensorItemSelectorComponent } from './sensor-item-selector.component';
describe('SensorItemSelectorComponent', () => {
let component: SensorItemSelectorComponent;
let fixture: ComponentFixture<SensorItemSelectorComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ SensorItemSelectorComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SensorItemSelectorComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,16 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'of-sensor-item-selector',
templateUrl: './sensor-item-selector.component.html',
styleUrls: ['./sensor-item-selector.component.scss']
})
export class SensorItemSelectorComponent implements OnInit {
constructor(private router: Router) { }
ngOnInit() {
}
}

View File

@ -1,86 +1,19 @@
<div fxLayout="row" fxLayoutWrap fxLayoutAlign="center"> <mat-grid-list cols="2" rowHeight="200px">
<div *ngIf="step == 1">
<!-- -->
<div fxLayout="row" fxLayoutWrap fxLayoutAlign="center">
<div fxLayout="row" fxLayoutWrap fxLayoutAlign="center">
<mat-card class="example-card"> <mat-grid-tile [colspan]="1" [rowspan]="2" style="background-color: lightblue">
<mat-card-header> <of-target-selector></of-target-selector>
<mat-card-title>Step 1</mat-card-title> </mat-grid-tile>
<mat-card-subtitle>Select Target</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
여기에 타겟들 출력
</mat-card-content>
</mat-card>
<mat-card class="example-card"> <mat-grid-tile [colspan]="1" [rowspan]="1" style="background-color: lightcoral">
<mat-card-header> <of-crawler-auth></of-crawler-auth>
<mat-card-title>Step 3</mat-card-title> </mat-grid-tile>
<mat-card-subtitle>Crawler Auth</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<form class="example-form">
<mat-form-field class="example-full-width">
<input matInput placeholder="Account" value="Loafe">
</mat-form-field>
<mat-form-field class="example-full-width"> <mat-grid-tile [colspan]="1" [rowspan]="2" style="background-color: lightgrey">
<input matInput type="password" placeholder="Password" value=""> <of-sensor-item-selector></of-sensor-item-selector>
</mat-form-field> </mat-grid-tile>
<div fxLayout="row" fxLayoutWrap fxLayoutAlign="right">
<button mat-button>Confirm</button>
</div>
</form>
</mat-card-content>
</mat-card>
</div> <mat-grid-tile [colspan]="1" [rowspan]="1" style="background-color: lightpink">
<of-crawler-selector></of-crawler-selector>
</mat-grid-tile>
<div fxLayout="row" fxLayoutWrap fxLayoutAlign="center"> </mat-grid-list>
<mat-card class="example-card">
<mat-card-header>
<mat-card-title>Step 2</mat-card-title>
<mat-card-subtitle>Select Crawler</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<mat-radio-group class="example-radio-group" [(ngModel)]="selectCrawler">
<mat-radio-button class="example-radio-button" *ngFor="let crawler of crawlerList" [value]="crawler">
{{crawler}}
</mat-radio-button>
</mat-radio-group>
<div class="example-selected-value">Your select crawler is: {{selectCrawler}}</div>
</mat-card-content>
</mat-card>
<mat-card class="example-card">
<mat-card-header>
<mat-card-title>Step 4</mat-card-title>
<mat-card-subtitle>Select Sensor Item</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
트리로 센서 아이템 목록 출력
</mat-card-content>
</mat-card>
</div>
</div>
<!-- -->
</div>
<div *ngIf="step == 2">
<of-sensor-setting-result></of-sensor-setting-result>
</div>
<div fxLayout="col" fxLayoutWrap fxLayoutAlign="center">
<button mat-button (click)="onCloseCancel()">Cancel</button>
스텝 순서를 바꿨으니 나중에 바꾸잡
<button mat-button (click)="onNext()">Next</button>
</div>
</div>
<!-- -->

View File

@ -13,21 +13,12 @@ export class SettingComponent implements OnInit, AfterContentInit {
constructor() { } constructor() { }
selectCrawler: String;
crawlerList: Array<String>;
ngOnInit() { ngOnInit() {
} }
ngAfterContentInit() { ngAfterContentInit() {
this.crawlerList = new Array();
this.crawlerList.push('SSH Crawler');
this.crawlerList.push('WMI Crawler');
this.crawlerList.push('MySQL Crawler');
this.crawlerList.push('PostgreSQL Crawler');
} }
onNext() { onNext() {

View File

@ -0,0 +1,21 @@
<div>
<mat-card>
<mat-card-header>
<mat-card-title>Step 1</mat-card-title>
<mat-card-subtitle>Select Target</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<perfect-scrollbar style="height: 150px">
<mat-selection-list>
<mat-list-option *ngFor="let target of targets">
{{target.name}}
</mat-list-option>
</mat-selection-list>
</perfect-scrollbar>
</mat-card-content>
</mat-card>
</div>

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { TargetSelectorComponent } from './target-selector.component';
describe('FilterComponent', () => {
let component: TargetSelectorComponent;
let fixture: ComponentFixture<TargetSelectorComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ TargetSelectorComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(TargetSelectorComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,33 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'of-target-selector',
templateUrl: './target-selector.component.html',
styleUrls: ['./target-selector.component.scss']
})
export class TargetSelectorComponent implements OnInit {
targets = [
{
'name': 'Target1'
},
{
'name': 'Target2'
},
{
'name': 'Target3'
},
{
'name': 'Target4'
},
{
'name': 'Target5'
},
];
constructor(private router: Router) { }
ngOnInit() {
}
}

View File

@ -9,6 +9,7 @@ import { SERVICES } from './service';
import { SensorStoreModule } from './sensor-store.module'; import { SensorStoreModule } from './sensor-store.module';
import { SettingComponent } from './component/setting/setting.component'; import { SettingComponent } from './component/setting/setting.component';
import { TreeModule } from 'angular-tree-component'; import { TreeModule } from 'angular-tree-component';
import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
@NgModule({ @NgModule({
imports: [ imports: [
@ -16,7 +17,8 @@ import { TreeModule } from 'angular-tree-component';
MaterialModule, MaterialModule,
FormsModule, FormsModule,
SensorStoreModule, SensorStoreModule,
TreeModule TreeModule,
PerfectScrollbarModule
], ],
declarations: [ declarations: [
COMPONENTS, COMPONENTS,