Merge branch 'master' of https://git.loafle.net/overflow/overflow-webapp
This commit is contained in:
commit
e0caf64828
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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);
|
||||||
|
|
|
@ -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';
|
||||||
|
|
|
@ -8,15 +8,47 @@ import {
|
||||||
Host,
|
Host,
|
||||||
Port,
|
Port,
|
||||||
Service,
|
Service,
|
||||||
|
DiscoveryZone,
|
||||||
|
DiscoveryHost,
|
||||||
|
DiscoveryPort,
|
||||||
|
DiscoveryService as MDiscoveryService,
|
||||||
} from '../../model';
|
} 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
|
||||||
|
|
|
@ -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);
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
|
@ -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));
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -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: { }
|
||||||
});
|
});
|
||||||
|
|
|
@ -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 { }
|
||||||
|
|
|
@ -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
|
||||||
];
|
];
|
||||||
|
|
|
@ -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>
|
|
@ -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();
|
||||||
|
});
|
||||||
|
});
|
|
@ -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() {
|
||||||
|
}
|
||||||
|
}
|
|
@ -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>
|
|
@ -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();
|
||||||
|
});
|
||||||
|
});
|
|
@ -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() {
|
||||||
|
}
|
||||||
|
}
|
|
@ -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>
|
|
@ -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();
|
||||||
|
});
|
||||||
|
});
|
|
@ -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() {
|
||||||
|
}
|
||||||
|
}
|
|
@ -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>
|
|
||||||
|
|
||||||
<!-- -->
|
|
|
@ -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() {
|
||||||
|
|
|
@ -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>
|
|
@ -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();
|
||||||
|
});
|
||||||
|
});
|
|
@ -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() {
|
||||||
|
}
|
||||||
|
}
|
|
@ -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,
|
||||||
|
|
Loading…
Reference in New Issue
Block a user