probe host

This commit is contained in:
insanity 2018-04-25 18:04:47 +09:00
parent ae3dc7a3ad
commit b1e66d2a29
27 changed files with 609 additions and 36 deletions

View File

@ -67,8 +67,8 @@ import { TooltipModule } from 'primeng/primeng';
import { TreeModule } from 'primeng/primeng';
import { TreeTableModule } from 'primeng/primeng';
import { CardModule } from 'primeng/card';
import {DataViewModule} from 'primeng/dataview';
import { DataViewModule } from 'primeng/dataview';
import { SidebarModule } from 'primeng/sidebar';
const PRIME_NG_MODULES: any[] = [
AccordionModule,
@ -140,6 +140,7 @@ const PRIME_NG_MODULES: any[] = [
TreeTableModule,
CardModule,
DataViewModule,
SidebarModule
];
@NgModule({

View File

@ -1,5 +1,7 @@
import { MapComponent } from './map/map.component';
import { ProbeSummaryComponent } from './probe-summary/probe-summary.component';
export const COMPONENTS = [
MapComponent,
ProbeSummaryComponent
];

View File

@ -25,7 +25,7 @@
</div>
</div>
<div class="ui-g-12 ui-g-nopad">
<p-tree [value]="infraTree" selectionMode="single" [(selection)]="selectedTree">
<p-tree [value]="infraTree" selectionMode="single" [(selection)]="selectedTree" (onNodeSelect)="onNodeSelect($event)">
<ng-template let-node pTemplate="default">
<div>{{node.label}}</div>
@ -56,6 +56,13 @@
</div>
<p-sidebar [(visible)]="visibleSidebar" position="bottom" [baseZIndex]="10000">
<div *ngIf="selectedNodeType === 'probe'">
<of-probe-summary [probe]="selectedNode" [visible]="visibleSidebar"></of-probe-summary>
</div>
</p-sidebar>

View File

@ -53,11 +53,14 @@ export class MapComponent implements OnInit, AfterContentInit {
targetTreeMap: Map<number, TreeNode> = new Map();
DEFAULT_EXPANDED: Boolean = true;
visibleSidebar = false;
selectedNodeType: string;
selectedNode: Object = null;
constructor(private router: Router,
private listStore: Store<ListStore.State>,
private sensorListStore: Store<SensorListStore.State>
) {}
) { }
ngAfterContentInit() {
@ -71,7 +74,7 @@ export class MapComponent implements OnInit, AfterContentInit {
sortDirection: 'descending'
};
this.listStore.dispatch(new ListStore.ReadAllByDomain({domain: domain, pageParams: pageParams}));
this.listStore.dispatch(new ListStore.ReadAllByDomain({ domain: domain, pageParams: pageParams }));
},
(error) => {
console.log(error);
@ -92,21 +95,21 @@ export class MapComponent implements OnInit, AfterContentInit {
console.log(error.response.message);
});
this.sensors$.subscribe(
(page: Page) => {
if (page !== null) {
const sensorList = page.content;
console.log(sensorList);
this.addTreeForSensor(sensorList);
}
},
(error: RPCClientError) => {
console.log(error.response.message);
this.sensors$.subscribe(
(page: Page) => {
if (page !== null) {
const sensorList = page.content;
console.log(sensorList);
this.addTreeForSensor(sensorList);
}
);
},
(error: RPCClientError) => {
console.log(error.response.message);
}
);
}
ngOnInit() {}
ngOnInit() { }
searchObj(treeList: any[], target: Target, searchList: any[]) {
@ -201,7 +204,7 @@ export class MapComponent implements OnInit, AfterContentInit {
generateInfraTree(probeMap: Map<number, InfraHost[]>, hostMap: Map<number, InfraService[]>): TreeNode {
const infraTree = {
const infraTree = {
label: 'Infra',
type: 'infra',
expandedIcon: 'fa-folder-open',
@ -218,7 +221,7 @@ export class MapComponent implements OnInit, AfterContentInit {
expandedIcon: 'fa-folder-open',
collapsedIcon: 'fa-folder',
expanded: this.DEFAULT_EXPANDED.valueOf(),
obj: ifhl,
obj: key,
children: [],
};
@ -243,7 +246,7 @@ export class MapComponent implements OnInit, AfterContentInit {
for (let i = 0 ; i < ifsl.length; ++i) {
for (let i = 0; i < ifsl.length; ++i) {
const ts = {
label: 'Service - ' + ifsl[i].vendor.name,
type: 'service',
@ -319,7 +322,7 @@ export class MapComponent implements OnInit, AfterContentInit {
sortDirection: 'descending'
};
this.sensorListStore.dispatch(new SensorListStore.ReadAllByInfra({id: String(infra.id), pageParams: pageParams}));
this.sensorListStore.dispatch(new SensorListStore.ReadAllByInfra({ id: String(infra.id), pageParams: pageParams }));
}
@ -329,7 +332,7 @@ export class MapComponent implements OnInit, AfterContentInit {
if (infraService.vendor.name.toUpperCase().indexOf(upperCased) < 0 &&
String(infraService.port).toUpperCase().indexOf(upperCased) < 0 &&
infraService.portType.toUpperCase().indexOf(upperCased)) {
return true;
return true;
}
return false;
}
@ -372,6 +375,19 @@ export class MapComponent implements OnInit, AfterContentInit {
});
}
}
onNodeSelect(event) {
if (event.node.type !== 'probe') {
return;
}
this.selectedNodeType = event.node.type;
const probe = {
id : event.node.obj
};
this.selectedNode = probe;
this.visibleSidebar = true;
}
}
const testInfraList = [

View File

@ -0,0 +1,3 @@
<div *ngIf="probe">
<b>probe host detail</b>
</div>

View File

@ -0,0 +1,53 @@
import { Component, OnInit, AfterContentInit, Input, OnChanges } from '@angular/core';
import { Store, select } from '@ngrx/store';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import * as DetailStore from 'packages/probe/store/probe-host';
import { ProbeHostSelector } from 'packages/probe/store';
import { Probe, ProbeHost } from 'packages/probe/model';
@Component({
selector: 'of-probe-summary',
templateUrl: './probe-summary.component.html',
})
export class ProbeSummaryComponent implements OnInit, AfterContentInit, OnChanges {
@Input() probe: Probe;
@Input() visible: boolean;
probeHost$ = this.detailStore.pipe(select(ProbeHostSelector.select('probeHost')));
probeHost: ProbeHost;
constructor(
private detailStore: Store<DetailStore.State>,
) { }
ngOnInit() {
this.probeHost$.subscribe(
(probeHost: ProbeHost) => {
if (probeHost) {
this.probe = probeHost;
}
},
(error: RPCClientError) => {
console.log(error.response.message);
}
);
}
ngAfterContentInit() {
this.detailStore.dispatch(
new DetailStore.ReadByProbe(this.probe)
);
}
ngOnChanges() {
if (!this.visible) {
this.probe = null;
this.probeHost = null;
}
}
}

View File

@ -0,0 +1,25 @@
<h1>Probes</h1>
<p-table [value]="probes" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
<ng-template pTemplate="header">
<tr>
<th>Probe Name</th>
<th style="width:10em">IP</th>
<th style="width:8em">OS</th>
<th style="width:10em">CIDR</th>
<th pResizableColumn>Targets</th>
<th style="width:8em">Authroized at</th>
<th style="width:9em">Authroized by</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-probe>
<tr [pSelectableRow]="probe">
<td>{{probe.displayName}}</td>
<td>?</td>
<td>?</td>
<td>{{probe.cidr}}</td>
<td>??</td>
<td>{{probe.authorizeDate | date: 'dd.MM.yyyy'}}</td>
<td>{{probe.authorizeMember.name}}</td>
</tr>
</ng-template>
</p-table>

View File

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

View File

@ -0,0 +1,54 @@
import { Component, OnInit, AfterViewInit, AfterContentInit, ViewChild } from '@angular/core';
import { Router } from '@angular/router';
import { Store, select } from '@ngrx/store';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { Domain } from 'packages/domain/model';
import { AuthSelector } from 'packages/member/store';
import { Probe } from '../../model';
import * as ListStore from '../../store/list';
import { ListSelector } from '../../store';
@Component({
selector: 'of-probe-list',
templateUrl: './list.component.html',
})
export class ListComponent implements OnInit, AfterContentInit {
probes$ = this.store.pipe(select(ListSelector.select('probes')));
probes: Probe[];
constructor(
private router: Router,
private store: Store<ListStore.State>
) {
}
ngOnInit() {
this.probes$.subscribe(
(probes: Probe[]) => {
this.probes = probes;
},
(error: RPCClientError) => {
console.log(error.response.message);
}
);
}
ngAfterContentInit() {
this.store.select(AuthSelector.select('domain')).subscribe(
(domain: Domain) => {
this.store.dispatch(new ListStore.ReadAllByDomain(domain));
},
(error) => {
console.log(error);
}
);
}
onRowSelect(event) {
this.router.navigate(['probe', event.data.id, 'info']);
}
}

View File

@ -1,5 +1,5 @@
<h1>Probes</h1>
<p-table [value]="probes" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
<p-table [value]="probeHosts" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
<ng-template pTemplate="header">
<tr>
<th>Probe Name</th>
@ -11,15 +11,16 @@
<th style="width:9em">Authroized by</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-probe>
<ng-template pTemplate="body" let-probeHost>
<tr [pSelectableRow]="probe">
<td>{{probe.displayName}}</td>
<td>{{probeHost.probe.displayName}}</td>
<!-- <td>{{probeHost.host.os.vendor.name}}</td> -->
<td>?</td>
<td>?</td>
<td>{{probe.cidr}}</td>
<td>{{probeHost.probe.cidr}}</td>
<td>??</td>
<td>{{probe.authorizeDate | date: 'dd.MM.yyyy'}}</td>
<td>{{probe.authorizeMember.name}}</td>
<td>{{probeHost.probe.authorizeDate | date: 'dd.MM.yyyy'}}</td>
<td>{{probeHost.probe.authorizeMember.name}}</td>
</tr>
</ng-template>
</p-table>

View File

@ -7,17 +7,17 @@ import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { Domain } from 'packages/domain/model';
import { AuthSelector } from 'packages/member/store';
import { Probe } from '../../model';
import * as ListStore from '../../store/list';
import { ListSelector } from '../../store';
import { Probe, ProbeHost } from '../../model';
import * as ListStore from '../../store/probe-host-list';
import { ProbeHostListSelector } from '../../store';
@Component({
selector: 'of-probe-list',
templateUrl: './list.component.html',
})
export class ListComponent implements OnInit, AfterContentInit {
probes$ = this.store.pipe(select(ListSelector.select('probes')));
probes: Probe[];
probeHosts$ = this.store.pipe(select(ProbeHostListSelector.select('probeHosts')));
probeHosts: ProbeHost[];
constructor(
private router: Router,
@ -26,9 +26,10 @@ export class ListComponent implements OnInit, AfterContentInit {
}
ngOnInit() {
this.probes$.subscribe(
(probes: Probe[]) => {
this.probes = probes;
this.probeHosts$.subscribe(
(probeHosts: ProbeHost[]) => {
console.log(probeHosts);
this.probeHosts = probeHosts;
},
(error: RPCClientError) => {
console.log(error.response.message);

View File

@ -1,5 +1,7 @@
import { ProbeService } from './probe.service';
import { ProbeHostService } from './probe-host.service';
export const SERVICES = [
ProbeService,
ProbeHostService,
];

View File

@ -0,0 +1,26 @@
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import { RPCService } from '@loafer/ng-rpc/service';
import { Probe, ProbeHost } from '../model';
import { Domain } from 'packages/domain/model';
@Injectable()
export class ProbeHostService {
public constructor(
private rpcService: RPCService,
) {
}
public readByProbe(probe: Probe): Observable<Probe> {
return this.rpcService.call<ProbeHost>('ProbeHostService.readByProbe', probe);
}
public readAllByDomain(domain: Domain): Observable<ProbeHost[]> {
return this.rpcService.call<ProbeHost[]>('ProbeHostService.readAllByDomain', domain);
}
}

View File

@ -26,4 +26,5 @@ export class ProbeService {
public read(id: string): Observable<Probe> {
return this.rpcService.call<Probe>('ProbeService.read', id);
}
}

View File

@ -10,20 +10,28 @@ import { MODULE } from '../probe.constant';
import * as ProbeListStore from './list';
import * as ProbeDetailStore from './detail';
import * as ProbeHostStore from './probe-host';
import * as ProbeHostListStore from './probe-host-list';
export interface State {
list: ProbeListStore.State;
detail: ProbeDetailStore.State;
probeHost: ProbeHostStore.State;
probeHosts: ProbeHostListStore.State;
}
export const REDUCERS = {
list: ProbeListStore.reducer,
detail: ProbeDetailStore.reducer,
probeHost: ProbeHostStore.reducer,
probeHosts: ProbeHostListStore.reducer
};
export const EFFECTS = [
ProbeListStore.Effects,
ProbeDetailStore.Effects,
ProbeHostStore.Effects,
ProbeHostListStore.Effects
];
export const selectProbeState = createFeatureSelector<State>(MODULE.name);
@ -36,3 +44,11 @@ export const DetailSelector = new StateSelector<ProbeDetailStore.State>(createSe
selectProbeState,
(state: State) => state.detail
));
export const ProbeHostSelector = new StateSelector<ProbeHostStore.State>(createSelector(
selectProbeState,
(state: State) => state.probeHost
));
export const ProbeHostListSelector = new StateSelector<ProbeHostListStore.State>(createSelector(
selectProbeState,
(state: State) => state.probeHosts
));

View File

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

View File

@ -0,0 +1,38 @@
import { Action } from '@ngrx/store';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { Domain } from 'packages/domain/model';
import { ProbeHost } from '../../model';
export enum ActionType {
ReadAllByDomain = '[probeHost.list] ReadAllByDomain',
ReadAllByDomainSuccess = '[probeHost.list] ReadAllByDomainSuccess',
ReadAllByDomainFailure = '[probeHost.list] ReadAllByDomainFailure',
}
export class ReadAllByDomain implements Action {
readonly type = ActionType.ReadAllByDomain;
constructor(public payload: Domain) {}
}
export class ReadAllByDomainSuccess implements Action {
readonly type = ActionType.ReadAllByDomainSuccess;
constructor(public payload: ProbeHost[]) {}
}
export class ReadAllByDomainFailure implements Action {
readonly type = ActionType.ReadAllByDomainFailure;
constructor(public payload: RPCClientError) {}
}
export type Actions =
| ReadAllByDomain
| ReadAllByDomainSuccess
| ReadAllByDomainFailure
;

View File

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

View File

@ -0,0 +1,51 @@
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 { RPCClientError } from '@loafer/ng-rpc/protocol';
import { Domain } from 'packages/domain/model';
import { Probe } from '../../model';
import {
ReadAllByDomain,
ReadAllByDomainFailure,
ReadAllByDomainSuccess,
ActionType
} from './list.action';
import { ProbeHostService } from '../../service/probe-host.service';
@Injectable()
export class Effects {
constructor(
private actions$: Actions,
private probeHostService: ProbeHostService,
private router: Router
) { }
@Effect()
readAllByDomain$: Observable<Action> = this.actions$
.ofType(ActionType.ReadAllByDomain)
.map((action: ReadAllByDomain) => action.payload)
.switchMap(payload => this.probeHostService.readAllByDomain(payload))
.map(probeHosts => {
return new ReadAllByDomainSuccess(probeHosts);
})
.catch((error: RPCClientError) => {
return of(new ReadAllByDomainFailure(error));
});
}

View File

@ -0,0 +1,48 @@
import {
ReadAllByDomain,
ReadAllByDomainFailure,
ReadAllByDomainSuccess,
ActionType,
Actions,
} from './list.action';
import {
State,
initialState,
} from './list.state';
import { Probe } from '../../model';
export function reducer(state = initialState, action: Actions): State {
switch (action.type) {
case ActionType.ReadAllByDomain: {
return {
...state,
error: null,
isPending: true,
};
}
case ActionType.ReadAllByDomainSuccess: {
return {
...state,
error: null,
isPending: false,
probeHosts: action.payload,
};
}
case ActionType.ReadAllByDomainFailure: {
return {
...state,
error: action.payload,
isPending: false,
probeHosts: null,
};
}
default: {
return state;
}
}
}

View File

@ -0,0 +1,15 @@
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { ProbeHost } from '../../model';
export interface State {
error: RPCClientError | null;
isPending: boolean;
probeHosts: ProbeHost[] | null;
}
export const initialState: State = {
error: null,
isPending: false,
probeHosts: null,
};

View File

@ -0,0 +1,4 @@
export * from './probe-host.action';
export * from './probe-host.effect';
export * from './probe-host.reducer';
export * from './probe-host.state';

View File

@ -0,0 +1,37 @@
import { Action } from '@ngrx/store';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { ProbeHost, Probe } from '../../model';
export enum ActionType {
ReadByProbe = '[probeHost.detail] Read',
ReadByProbeSuccess = '[probeHost.detail] ReadSuccess',
ReadByProbeFailure = '[probeHost.detail] ReadFailure',
}
export class ReadByProbe implements Action {
readonly type = ActionType.ReadByProbe;
constructor(public payload: Probe) {}
}
export class ReadByProbeSuccess implements Action {
readonly type = ActionType.ReadByProbeSuccess;
constructor(public payload: ProbeHost) {}
}
export class ReadByProbeFailure implements Action {
readonly type = ActionType.ReadByProbeFailure;
constructor(public payload: RPCClientError) {}
}
export type Actions =
| ReadByProbe
| ReadByProbeSuccess
| ReadByProbeFailure
;

View File

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

View File

@ -0,0 +1,49 @@
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 { RPCClientError } from '@loafer/ng-rpc/protocol';
import { Probe } from '../../model';
import { ProbeHostService } from '../../service/probe-host.service';
import {
ReadByProbe,
ReadByProbeSuccess,
ReadByProbeFailure,
ActionType
} from './probe-host.action';
@Injectable()
export class Effects {
constructor(
private actions$: Actions,
private probeHostService: ProbeHostService,
private router: Router
) { }
@Effect()
read$: Observable<Action> = this.actions$
.ofType(ActionType.ReadByProbe)
.map((action: ReadByProbe) => action.payload)
.switchMap(payload => this.probeHostService.readByProbe(payload))
.map(probe => {
return new ReadByProbeSuccess(probe);
})
.catch((error: RPCClientError) => {
return of(new ReadByProbeFailure(error));
});
}

View File

@ -0,0 +1,49 @@
import {
ReadByProbe,
ReadByProbeFailure,
ReadByProbeSuccess,
ActionType,
Actions,
} from './probe-host.action';
import {
State,
initialState,
} from './probe-host.state';
import { Probe } from '../../model';
export function reducer(state = initialState, action: Actions): State {
switch (action.type) {
case ActionType.ReadByProbe: {
return {
...state,
error: null,
isPending: true,
};
}
case ActionType.ReadByProbeSuccess: {
return {
...state,
error: null,
isPending: false,
probeHost: action.payload,
};
}
case ActionType.ReadByProbeFailure: {
return {
...state,
error: action.payload,
isPending: false,
probeHost: null,
};
}
default: {
return state;
}
}
}

View File

@ -0,0 +1,15 @@
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { ProbeHost } from '../../model';
export interface State {
error: RPCClientError | null;
isPending: boolean;
probeHost: ProbeHost | null;
}
export const initialState: State = {
error: null,
isPending: false,
probeHost: null,
};