Merge branch 'master' of https://git.loafle.net/overflow/member_webapp
This commit is contained in:
crusader
commit
25d27f0996
|
|
@ -4,13 +4,9 @@ import {
|
||||||
} from '@angular/core';
|
} from '@angular/core';
|
||||||
import { Store, select, StateObservable } from '@ngrx/store';
|
import { Store, select, StateObservable } from '@ngrx/store';
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
import { RPCClientError } from '@loafer/ng-rpc';
|
||||||
// import * as ListStore from '@overflow/probe/store/list';
|
|
||||||
// import { ListSelector } from '@overflow/probe/store';
|
|
||||||
import { Subscription } from 'rxjs/Subscription';
|
import { Subscription } from 'rxjs/Subscription';
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
import { Probe } from '@overflow/commons-typescript/model/probe';
|
||||||
import { AuthSelector } from '@overflow/member/store';
|
|
||||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
|
||||||
import { Dropdown } from 'primeng/primeng';
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-probe-selector',
|
selector: 'of-probe-selector',
|
||||||
|
|
@ -33,7 +29,7 @@ export class ProbeSelectorComponent implements OnInit, AfterContentInit, OnDestr
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.probesSubscription$ = this.probes$.subscribe(
|
this.probesSubscription$ = this.probes$.subscribe (
|
||||||
(list: Probe[]) => {
|
(list: Probe[]) => {
|
||||||
if (list !== null) {
|
if (list !== null) {
|
||||||
this.probes = list;
|
this.probes = list;
|
||||||
|
|
@ -0,0 +1,12 @@
|
||||||
|
|
||||||
|
<div class="ui-inputgroup">
|
||||||
|
<span style="margin-right: 18px">{{title}} </span>
|
||||||
|
<input id="0" type="text" pInputText placeholder="127" maxlength="3" [(ngModel)]="first" value="{{first}}" (keyup)="onIpInput($event)">
|
||||||
|
<span class="ui-inputgroup-addon">.</span>
|
||||||
|
<input id="1" type="text" pInputText placeholder="0" maxlength="3" [(ngModel)]="second" value="{{second}}" (keyup)="onIpInput($event)">
|
||||||
|
<span class="ui-inputgroup-addon">.</span>
|
||||||
|
<input id="2" type="text" pInputText placeholder="0" maxlength="3" [(ngModel)]="third" value="{{third}}" (keyup)="onIpInput($event)">
|
||||||
|
<span class="ui-inputgroup-addon">.</span>
|
||||||
|
<input id="3" type="text" pInputText placeholder="1" maxlength="3" [(ngModel)]="fourth" value="{{fourth}}" (keyup)="onIpInput($event)">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
@ -0,0 +1,56 @@
|
||||||
|
import {
|
||||||
|
AfterContentInit,
|
||||||
|
Component,
|
||||||
|
EventEmitter,
|
||||||
|
Input,
|
||||||
|
Output,
|
||||||
|
OnInit,
|
||||||
|
} from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'of-ip-input',
|
||||||
|
templateUrl: './ip-input.component.html',
|
||||||
|
})
|
||||||
|
export class IpInputComponent implements OnInit, AfterContentInit {
|
||||||
|
|
||||||
|
first: string;
|
||||||
|
second: string;
|
||||||
|
third: string;
|
||||||
|
fourth: string;
|
||||||
|
|
||||||
|
@Input() hostIp;
|
||||||
|
@Input() title;
|
||||||
|
@Output() inputIp = new EventEmitter();
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
) {
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
if (this.hostIp !== '' && this.hostIp !== null && this.hostIp !== undefined) {
|
||||||
|
const tempIp = this.hostIp.split('.');
|
||||||
|
|
||||||
|
this.first = tempIp[0];
|
||||||
|
this.second = tempIp[1];
|
||||||
|
this.third = tempIp[2];
|
||||||
|
this.fourth = tempIp[3];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ngAfterContentInit() {
|
||||||
|
}
|
||||||
|
|
||||||
|
onIpInput(event) {
|
||||||
|
if (
|
||||||
|
(this.first !== '' && this.first !== undefined) &&
|
||||||
|
(this.second !== '' && this.second !== undefined) &&
|
||||||
|
(this.third !== '' && this.third !== undefined) &&
|
||||||
|
(this.fourth !== '' && this.fourth !== undefined) ) {
|
||||||
|
event.target.data = this.first + '.' + this.second + '.' + this.third + '.' + this.fourth;
|
||||||
|
this.inputIp.emit(event);
|
||||||
|
} else {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
<label>Probe</label>
|
<label>Probe</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-bottom-space-20">
|
<div class="ui-g-12 ui-bottom-space-20">
|
||||||
<of-probe-selector [hidden]="requestStart" [preProbe]="probe" (probeSelected)="onProbeSelect($event)"></of-probe-selector>
|
<of-probe-selector [preProbe]="probe" (probeSelected)="onProbeSelect($event)"></of-probe-selector>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<label>IP Version</label>
|
<label>IP Version</label>
|
||||||
|
|
@ -24,40 +24,13 @@
|
||||||
<input type="hidden" >
|
<input type="hidden" >
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<div class="ui-inputgroup">
|
<of-ip-input [hostIp]="startHostIp" (inputIp)="onInputIP($event, 0)" [title]="'Start'"></of-ip-input>
|
||||||
<span style="margin-right: 18px">Start </span>
|
|
||||||
<input type="text" pInputText placeholder="127" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="1" maxlength="3">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<div class="ui-inputgroup">
|
<of-ip-input [hostIp]="endHostIp" (inputIp)="onInputIP($event, 1)" [title]="'End'"></of-ip-input>
|
||||||
<span style="margin-right: 24px">End </span>
|
|
||||||
<input type="text" pInputText placeholder="127" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="1" maxlength="3">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-bottom-space-20">
|
<div class="ui-g-12 ui-bottom-space-20">
|
||||||
<div class="ui-inputgroup">
|
<of-ip-input [hostIp]="excludeHostIp" (inputIp)="onInputIP($event, 2)" [title]="'Exclude'"></of-ip-input>
|
||||||
<span style="margin-right: 5px">Exclud </span>
|
|
||||||
<input type="text" pInputText placeholder="127" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="1" maxlength="3">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<label>Port type</label>
|
<label>Port type</label>
|
||||||
|
|
@ -70,7 +43,7 @@
|
||||||
<p-radioButton name="group2" value="1" label="UDP" [(ngModel)]="portType" inputId="opt4"></p-radioButton>
|
<p-radioButton name="group2" value="1" label="UDP" [(ngModel)]="portType" inputId="opt4"></p-radioButton>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<label>Port</label>
|
<label>Port</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -85,12 +58,12 @@
|
||||||
<p-inputMask mask="9999" [(ngModel)]="excludePort" placeholder="Exclude" [autoClear]="false"></p-inputMask>
|
<p-inputMask mask="9999" [(ngModel)]="excludePort" placeholder="Exclude" [autoClear]="false"></p-inputMask>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<label>Service</label>
|
<label>Service</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-g-nopad">
|
<div class="ui-g-12 ui-g-nopad">
|
||||||
<of-service-selector [disabled]="!serviceChecked" [(includeServices)]="includeServices"></of-service-selector>
|
<of-service-selector [(includeServices)]="includeServices"></of-service-selector>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12" dir="rtl">
|
<div class="ui-g-12" dir="rtl">
|
||||||
<button type="submit" label="Discovery Start" pButton class="ui-button-width-fit" ></button>
|
<button type="submit" label="Discovery Start" pButton class="ui-button-width-fit" ></button>
|
||||||
|
|
|
||||||
|
|
@ -16,6 +16,8 @@ export class SearchConfigComponent implements OnInit, AfterContentInit {
|
||||||
@Output() discoverySearchStartClick = new EventEmitter();
|
@Output() discoverySearchStartClick = new EventEmitter();
|
||||||
@Output() selectProbe = new EventEmitter();
|
@Output() selectProbe = new EventEmitter();
|
||||||
|
|
||||||
|
includeServices = [];
|
||||||
|
|
||||||
discoveryFormGroup: FormGroup;
|
discoveryFormGroup: FormGroup;
|
||||||
|
|
||||||
ipVesion: number;
|
ipVesion: number;
|
||||||
|
|
@ -28,6 +30,12 @@ export class SearchConfigComponent implements OnInit, AfterContentInit {
|
||||||
endPort: string;
|
endPort: string;
|
||||||
excludePort: string;
|
excludePort: string;
|
||||||
|
|
||||||
|
probe: number;
|
||||||
|
|
||||||
|
startHostIp: string;
|
||||||
|
endHostIp: string;
|
||||||
|
excludeHostIp: string;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private formBuilder: FormBuilder,
|
private formBuilder: FormBuilder,
|
||||||
) {
|
) {
|
||||||
|
|
@ -37,6 +45,7 @@ export class SearchConfigComponent implements OnInit, AfterContentInit {
|
||||||
this.ipVesion = 0;
|
this.ipVesion = 0;
|
||||||
this.portType = 0;
|
this.portType = 0;
|
||||||
this.initForm();
|
this.initForm();
|
||||||
|
// this.hostIp = '192.168.1.10';
|
||||||
}
|
}
|
||||||
|
|
||||||
ngAfterContentInit() {
|
ngAfterContentInit() {
|
||||||
|
|
@ -56,4 +65,9 @@ export class SearchConfigComponent implements OnInit, AfterContentInit {
|
||||||
console.log(probe);
|
console.log(probe);
|
||||||
this.selectProbe.emit(probe);
|
this.selectProbe.emit(probe);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onInputIP(event, idx) {
|
||||||
|
console.log(idx);
|
||||||
|
console.log(event.target.data);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,28 +4,10 @@
|
||||||
<input type="hidden" >
|
<input type="hidden" >
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<div class="ui-inputgroup">
|
<of-ip-input [hostIp]="startHostIp" (inputIp)="onInputIP($event, 0)" [title]="'Start'"></of-ip-input>
|
||||||
<span style="margin-right: 18px">Start </span>
|
|
||||||
<input type="text" pInputText placeholder="127" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="1" maxlength="3">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-bottom-space-20">
|
<div class="ui-g-12 ui-bottom-space-20">
|
||||||
<div class="ui-inputgroup">
|
<of-ip-input [hostIp]="endHostIp" (inputIp)="onInputIP($event, 1)" [title]="'End'"></of-ip-input>
|
||||||
<span style="margin-right: 24px">End </span>
|
|
||||||
<input type="text" pInputText placeholder="127" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="0" maxlength="3">
|
|
||||||
<span class="ui-inputgroup-addon">.</span>
|
|
||||||
<input type="text" pInputText placeholder="1" maxlength="3">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ui-g">
|
<div class="ui-g">
|
||||||
|
|
|
||||||
|
|
@ -9,6 +9,8 @@ import {
|
||||||
})
|
})
|
||||||
export class SearchFilterComponent implements OnInit, AfterContentInit {
|
export class SearchFilterComponent implements OnInit, AfterContentInit {
|
||||||
|
|
||||||
|
startHostIp: string;
|
||||||
|
endHostIp: string;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
) {
|
) {
|
||||||
|
|
@ -19,4 +21,8 @@ export class SearchFilterComponent implements OnInit, AfterContentInit {
|
||||||
|
|
||||||
ngAfterContentInit() {
|
ngAfterContentInit() {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onInputIP(event, idx) {
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,12 @@
|
||||||
import { Component, OnInit, Input, AfterContentInit, Output, EventEmitter, OnDestroy } from '@angular/core';
|
import {
|
||||||
|
Component,
|
||||||
|
OnInit,
|
||||||
|
Input,
|
||||||
|
AfterContentInit,
|
||||||
|
Output,
|
||||||
|
EventEmitter,
|
||||||
|
OnDestroy
|
||||||
|
} from '@angular/core';
|
||||||
import { Store, select, StateObservable } from '@ngrx/store';
|
import { Store, select, StateObservable } from '@ngrx/store';
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
import { RPCClientError } from '@loafer/ng-rpc';
|
||||||
import * as ListStore from '@overflow/meta/crawler/store/list';
|
import * as ListStore from '@overflow/meta/crawler/store/list';
|
||||||
|
|
@ -18,8 +26,6 @@ export class ServiceSelectorComponent implements OnInit, AfterContentInit, OnDes
|
||||||
@Output() crawlerSelected = new EventEmitter<MetaCrawler>();
|
@Output() crawlerSelected = new EventEmitter<MetaCrawler>();
|
||||||
@Input() includeServices;
|
@Input() includeServices;
|
||||||
|
|
||||||
@Input() disabled: boolean;
|
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private listStore: Store<ListStore.State>,
|
private listStore: Store<ListStore.State>,
|
||||||
) {
|
) {
|
||||||
|
|
@ -1,23 +1,17 @@
|
||||||
import { SettingComponent } from './setting/setting.component';
|
import { ProbeSelectorComponent } from './discovery/probe-selector/probe-selector.component';
|
||||||
import { ProbeSelectorComponent } from './setting/probe-selector/probe-selector.component';
|
import { ServiceSelectorComponent } from './discovery/service-selector/service-selector.component';
|
||||||
import { ServiceSelectorComponent } from './setting/filter/service-selector/service-selector.component';
|
|
||||||
import { FilterComponent } from './setting/filter/filter.component';
|
|
||||||
import { ResultComponent } from './setting/result/result.component';
|
|
||||||
import { FilterSummaryComponent } from './setting/filter-summary/filter-summary.component';
|
|
||||||
import { DiscoveryComponent } from './discovery/discovery.component';
|
import { DiscoveryComponent } from './discovery/discovery.component';
|
||||||
import { SearchConfigComponent } from './discovery/search-config/search-config.component';
|
import { SearchConfigComponent } from './discovery/search-config/search-config.component';
|
||||||
import { SearchFilterComponent } from './discovery/search-filter/search-filter.component';
|
import { SearchFilterComponent } from './discovery/search-filter/search-filter.component';
|
||||||
import { SearchResultComponent } from './discovery/search-result/search-result.component';
|
import { SearchResultComponent } from './discovery/search-result/search-result.component';
|
||||||
|
import { IpInputComponent } from './discovery/search-config/ip-input.component';
|
||||||
|
|
||||||
export const COMPONENTS = [
|
export const COMPONENTS = [
|
||||||
SettingComponent,
|
|
||||||
FilterComponent,
|
|
||||||
ServiceSelectorComponent,
|
ServiceSelectorComponent,
|
||||||
ProbeSelectorComponent,
|
ProbeSelectorComponent,
|
||||||
ResultComponent,
|
|
||||||
FilterSummaryComponent,
|
|
||||||
DiscoveryComponent,
|
DiscoveryComponent,
|
||||||
SearchConfigComponent,
|
SearchConfigComponent,
|
||||||
SearchFilterComponent,
|
SearchFilterComponent,
|
||||||
SearchResultComponent
|
SearchResultComponent,
|
||||||
|
IpInputComponent
|
||||||
];
|
];
|
||||||
|
|
|
||||||
|
|
@ -1,11 +0,0 @@
|
||||||
<div *ngIf="data" class="ui-g-12" (click)="onClick()">
|
|
||||||
<of-key-value *ngIf="data.discoverHost" [key]="'Host'" [value]="hostRange"></of-key-value>
|
|
||||||
<of-key-value *ngIf="data.discoverHost.discoverPort" [key]="'Port'" [value]="portRange"></of-key-value>
|
|
||||||
<span *ngIf="includeTCP">
|
|
||||||
TCP
|
|
||||||
</span>
|
|
||||||
<span *ngIf="includeUDP">
|
|
||||||
UDP
|
|
||||||
</span>
|
|
||||||
<of-key-value *ngIf="services !== ''" [key]="'Services'" [value]="services"></of-key-value>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,59 +0,0 @@
|
||||||
import { Component, OnInit, Input, AfterContentInit, Output, EventEmitter, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
|
|
||||||
import { DiscoverZone } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-discovery-filter-summary',
|
|
||||||
templateUrl: './filter-summary.component.html',
|
|
||||||
})
|
|
||||||
export class FilterSummaryComponent implements OnInit, AfterContentInit, OnDestroy, OnChanges {
|
|
||||||
|
|
||||||
@Output() click = new EventEmitter();
|
|
||||||
@Input() data: DiscoverZone;
|
|
||||||
|
|
||||||
private hostRange: string;
|
|
||||||
private portRange: string;
|
|
||||||
private includeTCP: boolean;
|
|
||||||
private includeUDP: boolean;
|
|
||||||
private services: string;
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
) {
|
|
||||||
this.services = '';
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (!this.data) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.hostRange = this.data.discoverHost.firstScanRangev4 + ' ~ ' + this.data.discoverHost.lastScanRangev4;
|
|
||||||
if (this.data.discoverHost.discoverPort) {
|
|
||||||
this.portRange = this.data.discoverHost.discoverPort.firstScanRange + ' ~ ' + this.data.discoverHost.discoverPort.lastScanRange;
|
|
||||||
this.includeTCP = this.data.discoverHost.discoverPort.includeTCP;
|
|
||||||
this.includeUDP = this.data.discoverHost.discoverPort.includeUDP;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (this.data.discoverHost.discoverPort.discoverService) {
|
|
||||||
const services = this.data.discoverHost.discoverPort.discoverService.includeServices;
|
|
||||||
if (services.length > 3) {
|
|
||||||
this.services = String(services.length) + ' services selected.';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
for (const service of services) {
|
|
||||||
this.services += service;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy() {
|
|
||||||
}
|
|
||||||
|
|
||||||
onClick() {
|
|
||||||
this.click.emit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,66 +0,0 @@
|
||||||
<div class="ui-g">
|
|
||||||
<div>
|
|
||||||
<div class="ui-g">
|
|
||||||
<div class="ui-g-12">
|
|
||||||
<p-checkbox value="host" label="Host" [(ngModel)]="hostChecked" binary="true" [disabled]="true"></p-checkbox>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ui-g form-group">
|
|
||||||
<div class="ui-g-12 ui-md-6">
|
|
||||||
<span class="ui-float-label">
|
|
||||||
<input id="float-input" type="text" size="30" pInputText [(ngModel)]="startIP">
|
|
||||||
<label for="float-input">Start Ip</label>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="ui-g-12 ui-md-6">
|
|
||||||
<span class="ui-float-label">
|
|
||||||
<input id="float-input" type="text" size="30" pInputText [(ngModel)]="endIP">
|
|
||||||
<label for="float-input">End Ip</label>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="ui-g">
|
|
||||||
<div class="ui-g-12">
|
|
||||||
<p-checkbox #portCheckbox value="port" label="Port" [(ngModel)]="portChecked" binary="true" (onChange)="onPortCheckChange(serviceCheckbox, $event)"></p-checkbox>
|
|
||||||
</div>
|
|
||||||
<div class="ui-g-12">
|
|
||||||
<div class="ui-g-6">
|
|
||||||
TCP
|
|
||||||
<p-inputSwitch [(ngModel)]="tcpChecked" [disabled]="!portChecked" binary="true"></p-inputSwitch>
|
|
||||||
</div>
|
|
||||||
<div class="ui-g-6">
|
|
||||||
UDP
|
|
||||||
<p-inputSwitch [(ngModel)]="udpChecked" [disabled]="!portChecked" binary="true"></p-inputSwitch>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ui-g form-group">
|
|
||||||
<div class="ui-g-12 ui-md-6">
|
|
||||||
<span class="ui-float-label">
|
|
||||||
<input id="float-input" type="text" size="30" pInputText [(ngModel)]="startPort" [disabled]="!portChecked">
|
|
||||||
<label for="float-input">Start Port</label>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ui-g-12 ui-md-6">
|
|
||||||
<span class="ui-float-label">
|
|
||||||
<input id="float-input" type="text" size="30" pInputText [(ngModel)]="endPort" [disabled]="!portChecked">
|
|
||||||
<label for="float-input">End Port</label>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ui-g-12">
|
|
||||||
<div class="ui-g-12 ui-g-nopad">
|
|
||||||
<p-checkbox #serviceCheckbox value="service" label="Service" [(ngModel)]="serviceChecked" (onChange)="onServiceCheckChange(portCheckbox, $event)" binary="true"></p-checkbox>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<of-service-selector [disabled]="!serviceChecked" [(includeServices)]="includeServices"></of-service-selector>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,116 +0,0 @@
|
||||||
import { Component, OnInit, Input, AfterContentInit, Output, EventEmitter, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
|
|
||||||
import * as CIDR from 'ip-cidr';
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
import { DiscoverZone, DiscoverPort, DiscoverService } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-discovery-filter',
|
|
||||||
templateUrl: './filter.component.html',
|
|
||||||
})
|
|
||||||
export class FilterComponent implements OnInit, AfterContentInit, OnDestroy, OnChanges {
|
|
||||||
|
|
||||||
@Input() probe: Probe;
|
|
||||||
@Input() requestStart: boolean;
|
|
||||||
@Output() discoveryRequested = new EventEmitter<DiscoverZone>();
|
|
||||||
|
|
||||||
private startIP: string;
|
|
||||||
private endIP: string;
|
|
||||||
private startPort: string;
|
|
||||||
private endPort: string;
|
|
||||||
private includeServices = [];
|
|
||||||
|
|
||||||
private hostChecked = true;
|
|
||||||
private portChecked = true;
|
|
||||||
private serviceChecked = true;
|
|
||||||
private tcpChecked = true;
|
|
||||||
private udpChecked = true;
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
) {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy() {
|
|
||||||
}
|
|
||||||
|
|
||||||
hostRange() {
|
|
||||||
if (!this.probe || this.probe === undefined) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const cidr = new CIDR(this.probe.cidr);
|
|
||||||
if (!cidr.isValid()) {
|
|
||||||
alert('Invalid cidr : ' + this.probe.cidr);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.startIP = cidr.addressStart.address;
|
|
||||||
this.endIP = cidr.addressEnd.address;
|
|
||||||
}
|
|
||||||
|
|
||||||
portRange() {
|
|
||||||
this.startPort = '1';
|
|
||||||
this.endPort = '1024';
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (changes['probe']) {
|
|
||||||
this.hostRange();
|
|
||||||
this.portRange();
|
|
||||||
}
|
|
||||||
if (changes['requestStart'] && this.requestStart) {
|
|
||||||
this.onStart();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onPortCheckChange(serviceCheckbox, checked) {
|
|
||||||
if (!checked) {
|
|
||||||
serviceCheckbox.checked = false;
|
|
||||||
this.serviceChecked = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onServiceCheckChange(portCheckbox, checked) {
|
|
||||||
if (checked) {
|
|
||||||
portCheckbox.checked = true;
|
|
||||||
this.portChecked = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onStart() {
|
|
||||||
let discoverPort: DiscoverPort = null;
|
|
||||||
let discoverService: DiscoverService = null;
|
|
||||||
|
|
||||||
if (this.serviceChecked) {
|
|
||||||
const services = new Array();
|
|
||||||
for (const service of this.includeServices) {
|
|
||||||
services.push(service.description); // FIXME to const name
|
|
||||||
}
|
|
||||||
discoverService = {
|
|
||||||
includeServices: services,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
if (this.portChecked) {
|
|
||||||
discoverPort = {
|
|
||||||
firstScanRange: Number(this.startPort),
|
|
||||||
lastScanRange: Number(this.endPort),
|
|
||||||
includeTCP: this.tcpChecked,
|
|
||||||
includeUDP: this.udpChecked,
|
|
||||||
excludePorts: null,
|
|
||||||
discoverService: discoverService
|
|
||||||
};
|
|
||||||
}
|
|
||||||
const discoverZone: DiscoverZone = {
|
|
||||||
discoverHost: {
|
|
||||||
firstScanRangev4: this.startIP,
|
|
||||||
lastScanRangev4: this.endIP,
|
|
||||||
discoverPort: discoverPort
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
this.discoveryRequested.emit(discoverZone);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,190 +0,0 @@
|
||||||
import { Component, OnInit, Input, AfterContentInit, Output, EventEmitter, OnDestroy } from '@angular/core';
|
|
||||||
import { Store, select, StateObservable } from '@ngrx/store';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import { Subscription } from 'rxjs/Subscription';
|
|
||||||
import { TreeNode } from 'primeng/primeng';
|
|
||||||
|
|
||||||
import * as DiscoveredStore from '@overflow/discovery/store/setting';
|
|
||||||
import { SettingSelector, DiscoverSelector } from '@overflow/discovery/store';
|
|
||||||
import * as DiscoverStore from '@overflow/discovery/store/discover';
|
|
||||||
import * as RegistStore from '@overflow/discovery/store/regist';
|
|
||||||
|
|
||||||
import { Zone } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
import { Host } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
import { Port } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
import { Service } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-discovery-result',
|
|
||||||
templateUrl: './result.component.html',
|
|
||||||
})
|
|
||||||
export class ResultComponent implements OnInit, AfterContentInit, OnDestroy {
|
|
||||||
|
|
||||||
treeNodes = [];
|
|
||||||
selectedNodes = [];
|
|
||||||
zones: Map<string, Zone> = null;
|
|
||||||
checkedSet = new Set();
|
|
||||||
|
|
||||||
resultSubscription$: Subscription;
|
|
||||||
result$: any;
|
|
||||||
startedSubscription$: Subscription;
|
|
||||||
started$: any;
|
|
||||||
endedSubscription$: Subscription;
|
|
||||||
ended$: any;
|
|
||||||
|
|
||||||
inProgress = false;
|
|
||||||
|
|
||||||
|
|
||||||
selectedDiscoveryResult: TreeNode[];
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private discoverdStore: Store<DiscoveredStore.State>,
|
|
||||||
private discoverStore: Store<DiscoverStore.State>,
|
|
||||||
private registStore: Store<RegistStore.State>,
|
|
||||||
) {
|
|
||||||
this.result$ = discoverStore.pipe(select(DiscoverSelector.select('zones')));
|
|
||||||
this.started$ = discoverStore.pipe(select(DiscoverSelector.select('isStart')));
|
|
||||||
this.ended$ = discoverStore.pipe(select(DiscoverSelector.select('isEnd')));
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.resultSubscription$ = this.result$.subscribe(
|
|
||||||
(zones: Map<string, Zone>) => {
|
|
||||||
if (zones !== undefined && zones !== null) {
|
|
||||||
console.log(zones);
|
|
||||||
this.treeNodes = this.convertTreeViewZone(zones);
|
|
||||||
this.zones = zones;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
(error: RPCClientError) => {
|
|
||||||
console.log(error.response.message);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
this.startedSubscription$ = this.started$.subscribe(
|
|
||||||
(isStart: boolean) => {
|
|
||||||
if (isStart !== undefined && isStart !== null && isStart) {
|
|
||||||
this.inProgress = true;
|
|
||||||
console.log('##Discovery has started.##');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
(error: RPCClientError) => {
|
|
||||||
console.log(error.response.message);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
this.endedSubscription$ = this.ended$.subscribe(
|
|
||||||
(isEnd: boolean) => {
|
|
||||||
if (isEnd !== undefined && isEnd !== null && isEnd) {
|
|
||||||
console.log('##Discovery has done.##');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
(error: RPCClientError) => {
|
|
||||||
console.log(error.response.message);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy() {
|
|
||||||
if (this.startedSubscription$) {
|
|
||||||
this.startedSubscription$.unsubscribe();
|
|
||||||
}
|
|
||||||
if (this.endedSubscription$) {
|
|
||||||
this.endedSubscription$.unsubscribe();
|
|
||||||
}
|
|
||||||
if (this.resultSubscription$) {
|
|
||||||
this.resultSubscription$.unsubscribe();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
save() {
|
|
||||||
}
|
|
||||||
|
|
||||||
convertTreeViewZone(zones: Map<string, Zone>) {
|
|
||||||
|
|
||||||
if (zones === undefined || zones === null) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const treeNodes: any[] = [];
|
|
||||||
|
|
||||||
zones.forEach((value: Zone, key: string, map) => {
|
|
||||||
const jZone: any = {
|
|
||||||
label: 'Zone - ' + value.iface,
|
|
||||||
// className: 'cn' + value.ip,
|
|
||||||
expandedIcon: 'fa-folder-open',
|
|
||||||
collapsedIcon: 'fa-folder',
|
|
||||||
};
|
|
||||||
jZone.obj = value;
|
|
||||||
jZone.children = this.convertViewHost(value.hosts);
|
|
||||||
treeNodes.push(jZone);
|
|
||||||
});
|
|
||||||
|
|
||||||
return treeNodes;
|
|
||||||
}
|
|
||||||
|
|
||||||
convertViewHost(hosts): any[] {
|
|
||||||
if (hosts === undefined || hosts === null) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
const hostNodes: any[] = [];
|
|
||||||
|
|
||||||
hosts.forEach((host, hostKey) => {
|
|
||||||
|
|
||||||
const jHost: any = {
|
|
||||||
label: 'Host - ' + host.ipv4,
|
|
||||||
// className: 'cn' + host.ip
|
|
||||||
expandedIcon: 'fa-folder-open',
|
|
||||||
collapsedIcon: 'fa-folder',
|
|
||||||
};
|
|
||||||
jHost.obj = host;
|
|
||||||
jHost.children = this.convertViewPort(host.ports);
|
|
||||||
hostNodes.push(jHost);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
return hostNodes;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
convertViewPort(ports): any[] {
|
|
||||||
if (ports === undefined || ports === null || ports.size < 0) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
const portChildren: any[] = [];
|
|
||||||
ports.forEach((port, portKey) => {
|
|
||||||
const jPort: any = {
|
|
||||||
label: 'Port - ' + port.portNumber,
|
|
||||||
// className: 'cn' + port.portNumber,
|
|
||||||
expandedIcon: 'fa-folder-open',
|
|
||||||
collapsedIcon: 'fa-folder',
|
|
||||||
};
|
|
||||||
jPort.obj = port;
|
|
||||||
jPort.children = this.convertViewService(port.services);
|
|
||||||
portChildren.push(jPort);
|
|
||||||
});
|
|
||||||
|
|
||||||
return portChildren;
|
|
||||||
}
|
|
||||||
|
|
||||||
convertViewService(services): any[] {
|
|
||||||
if (services === undefined || services === null || services.size <= 0) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
const serviceChildren: any[] = [];
|
|
||||||
services.forEach((service, serviceKey) => {
|
|
||||||
const jService: any = {
|
|
||||||
label: 'Service - ' + service.serviceName,
|
|
||||||
// className: 'cn' + service.serviceName,
|
|
||||||
};
|
|
||||||
jService.obj = service;
|
|
||||||
|
|
||||||
serviceChildren.push(jService);
|
|
||||||
});
|
|
||||||
|
|
||||||
return serviceChildren;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -1,13 +0,0 @@
|
||||||
<div class="ui-g-12">
|
|
||||||
<div *ngIf="inProgress">
|
|
||||||
<p-progressBar mode="indeterminate"></p-progressBar>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p-blockUI [target]="result" [blocked]="inProgress"></p-blockUI>
|
|
||||||
<p-panel #result [showHeader]="false">
|
|
||||||
<div>
|
|
||||||
result
|
|
||||||
</div>
|
|
||||||
<p-tree [value]="treeNodes" selectionMode="checkbox" [(selection)]="selectedNodes"></p-tree>
|
|
||||||
</p-panel>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,198 +0,0 @@
|
||||||
import { Component, OnInit, Input, AfterContentInit, Output, EventEmitter, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
|
|
||||||
import { Store, select, StateObservable } from '@ngrx/store';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import { Subscription } from 'rxjs/Subscription';
|
|
||||||
import { TreeNode } from 'primeng/primeng';
|
|
||||||
|
|
||||||
import * as DiscoveredStore from '@overflow/discovery/store/setting';
|
|
||||||
import { SettingSelector, DiscoverSelector } from '@overflow/discovery/store';
|
|
||||||
import * as DiscoverStore from '@overflow/discovery/store/discover';
|
|
||||||
import * as RegistStore from '@overflow/discovery/store/regist';
|
|
||||||
|
|
||||||
import { Zone } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
import { Host } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
import { Port } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
import { Service } from '@overflow/commons-typescript/model/discovery';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-discovery-result',
|
|
||||||
templateUrl: './result.component.html',
|
|
||||||
})
|
|
||||||
export class ResultComponent implements OnInit, AfterContentInit, OnDestroy, OnChanges {
|
|
||||||
|
|
||||||
@Input() started: boolean;
|
|
||||||
|
|
||||||
treeNodes = [];
|
|
||||||
selectedNodes = [];
|
|
||||||
zones: Map<string, Zone> = null;
|
|
||||||
checkedSet = new Set();
|
|
||||||
|
|
||||||
resultSubscription$: Subscription;
|
|
||||||
result$: any;
|
|
||||||
startedSubscription$: Subscription;
|
|
||||||
started$: any;
|
|
||||||
endedSubscription$: Subscription;
|
|
||||||
ended$: any;
|
|
||||||
|
|
||||||
inProgress = false;
|
|
||||||
|
|
||||||
|
|
||||||
selectedDiscoveryResult: TreeNode[];
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private discoverdStore: Store<DiscoveredStore.State>,
|
|
||||||
private discoverStore: Store<DiscoverStore.State>,
|
|
||||||
private registStore: Store<RegistStore.State>,
|
|
||||||
) {
|
|
||||||
this.result$ = discoverStore.pipe(select(DiscoverSelector.select('zones')));
|
|
||||||
this.started$ = discoverStore.pipe(select(DiscoverSelector.select('isStart')));
|
|
||||||
this.ended$ = discoverStore.pipe(select(DiscoverSelector.select('isEnd')));
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.inProgress = true;
|
|
||||||
this.resultSubscription$ = this.result$.subscribe(
|
|
||||||
(zones: Map<string, Zone>) => {
|
|
||||||
if (zones !== undefined && zones !== null) {
|
|
||||||
console.log(zones);
|
|
||||||
this.treeNodes = this.convertTreeViewZone(zones);
|
|
||||||
this.zones = zones;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
(error: RPCClientError) => {
|
|
||||||
console.log(error.response.message);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
this.startedSubscription$ = this.started$.subscribe(
|
|
||||||
(isStart: boolean) => {
|
|
||||||
if (isStart !== undefined && isStart !== null && isStart) {
|
|
||||||
console.log('##Discovery has started.##');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
(error: RPCClientError) => {
|
|
||||||
console.log(error.response.message);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
this.endedSubscription$ = this.ended$.subscribe(
|
|
||||||
(isEnd: boolean) => {
|
|
||||||
if (isEnd !== undefined && isEnd !== null && isEnd) {
|
|
||||||
console.log('##Discovery has done.##');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
(error: RPCClientError) => {
|
|
||||||
console.log(error.response.message);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (changes['started'] && !changes['started'].currentValue) {
|
|
||||||
this.inProgress = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy() {
|
|
||||||
if (this.startedSubscription$) {
|
|
||||||
this.startedSubscription$.unsubscribe();
|
|
||||||
}
|
|
||||||
if (this.endedSubscription$) {
|
|
||||||
this.endedSubscription$.unsubscribe();
|
|
||||||
}
|
|
||||||
if (this.resultSubscription$) {
|
|
||||||
this.resultSubscription$.unsubscribe();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
save() {
|
|
||||||
}
|
|
||||||
|
|
||||||
convertTreeViewZone(zones: Map<string, Zone>) {
|
|
||||||
|
|
||||||
if (zones === undefined || zones === null) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const treeNodes: any[] = [];
|
|
||||||
|
|
||||||
zones.forEach((value: Zone, key: string, map) => {
|
|
||||||
const jZone: any = {
|
|
||||||
label: 'Zone - ' + value.iface,
|
|
||||||
// className: 'cn' + value.ip,
|
|
||||||
expandedIcon: 'fa-folder-open',
|
|
||||||
collapsedIcon: 'fa-folder',
|
|
||||||
};
|
|
||||||
jZone.obj = value;
|
|
||||||
jZone.children = this.convertViewHost(value.hosts);
|
|
||||||
treeNodes.push(jZone);
|
|
||||||
});
|
|
||||||
|
|
||||||
return treeNodes;
|
|
||||||
}
|
|
||||||
|
|
||||||
convertViewHost(hosts): any[] {
|
|
||||||
if (hosts === undefined || hosts === null) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
const hostNodes: any[] = [];
|
|
||||||
|
|
||||||
hosts.forEach((host, hostKey) => {
|
|
||||||
|
|
||||||
const jHost: any = {
|
|
||||||
label: 'Host - ' + host.ipv4,
|
|
||||||
// className: 'cn' + host.ip
|
|
||||||
expandedIcon: 'fa-folder-open',
|
|
||||||
collapsedIcon: 'fa-folder',
|
|
||||||
};
|
|
||||||
jHost.obj = host;
|
|
||||||
jHost.children = this.convertViewPort(host.ports);
|
|
||||||
hostNodes.push(jHost);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
return hostNodes;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
convertViewPort(ports): any[] {
|
|
||||||
if (ports === undefined || ports === null || ports.size < 0) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
const portChildren: any[] = [];
|
|
||||||
ports.forEach((port, portKey) => {
|
|
||||||
const jPort: any = {
|
|
||||||
label: 'Port - ' + port.portNumber,
|
|
||||||
// className: 'cn' + port.portNumber,
|
|
||||||
expandedIcon: 'fa-folder-open',
|
|
||||||
collapsedIcon: 'fa-folder',
|
|
||||||
};
|
|
||||||
jPort.obj = port;
|
|
||||||
jPort.children = this.convertViewService(port.services);
|
|
||||||
portChildren.push(jPort);
|
|
||||||
});
|
|
||||||
|
|
||||||
return portChildren;
|
|
||||||
}
|
|
||||||
|
|
||||||
convertViewService(services): any[] {
|
|
||||||
if (services === undefined || services === null || services.size <= 0) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
const serviceChildren: any[] = [];
|
|
||||||
services.forEach((service, serviceKey) => {
|
|
||||||
const jService: any = {
|
|
||||||
label: 'Service - ' + service.serviceName,
|
|
||||||
// className: 'cn' + service.serviceName,
|
|
||||||
};
|
|
||||||
jService.obj = service;
|
|
||||||
|
|
||||||
serviceChildren.push(jService);
|
|
||||||
});
|
|
||||||
|
|
||||||
return serviceChildren;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -1,36 +0,0 @@
|
||||||
<!-- <div [style.height.px]="height">
|
|
||||||
<div dir="rtl">
|
|
||||||
<p-button (onClick)="onCancel()" icon="fa fa-fw fa-close"></p-button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<of-probe-selector [hidden]="requestStart" #probeSelectorComponent [preProbe]="probe" (probeSelected)="onProbeSelect($event)"></of-probe-selector>
|
|
||||||
|
|
||||||
<p-blockUI [target]="df" [blocked]="!selectedProbe && !probe"></p-blockUI>
|
|
||||||
<p-panel #df [showHeader]="false">
|
|
||||||
<div [@discoveryFilter]="!requestStart ? 'full' : 'summary'">
|
|
||||||
<div [hidden]="requestStart">
|
|
||||||
<of-discovery-filter #filterComponent [probe]="selectedProbe" [requestStart]="requestStart" (discoveryRequested)="onDiscoveryStart($event)"></of-discovery-filter>
|
|
||||||
</div>
|
|
||||||
<div [hidden]="!requestStart">
|
|
||||||
<of-discovery-filter-summary [data]="filterData" (click)="onSummaryClick($event)"></of-discovery-filter-summary>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</p-panel>
|
|
||||||
|
|
||||||
<div dir="rtl" *ngIf="!requestStart">
|
|
||||||
<button [disabled]="!selectedProbe && !probe" pButton type="button" label="Start" icon="fa-check" class="ui-button-width-fit"
|
|
||||||
(click)="requestStart = true"></button>
|
|
||||||
<button pButton type="button" label="Cancel" icon="fa-close" class="ui-button-secondary ui-button-width-fit" (click)="onCancel()"></button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div *ngIf="requestStart" [@result]="!requestStart ? 'hidden' : 'show'">
|
|
||||||
<of-discovery-result (close)="onCancel()" [started]="started"></of-discovery-result>
|
|
||||||
<div dir="rtl">
|
|
||||||
<button [disabled]="!selectedProbe && !probe" pButton type="button" label="Save" icon="fa-check" class="ui-button-width-fit"
|
|
||||||
(click)="onSave()"></button>
|
|
||||||
<button pButton type="button" label="Stop" icon="fa-close" class="ui-button-secondary ui-button-width-fit" (click)="onStop()"></button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
|
|
@ -1,156 +0,0 @@
|
||||||
import {
|
|
||||||
Component, OnInit, AfterContentInit, Output, EventEmitter,
|
|
||||||
Input, OnDestroy, OnChanges, SimpleChanges, ViewChild
|
|
||||||
} from '@angular/core';
|
|
||||||
import { Store } from '@ngrx/store';
|
|
||||||
import {
|
|
||||||
DiscoverZone,
|
|
||||||
} from '@overflow/commons-typescript/model/discovery';
|
|
||||||
|
|
||||||
import * as DiscoverStore from '../../store/discover';
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
import { ResultComponent } from './result/result.component';
|
|
||||||
import { ProbeSelectorComponent } from './probe-selector/probe-selector.component';
|
|
||||||
import { FilterComponent } from './filter/filter.component';
|
|
||||||
|
|
||||||
import { trigger, state, transition, style, animate } from '@angular/animations';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'of-discovery-setting',
|
|
||||||
templateUrl: './setting.component.html',
|
|
||||||
animations: [
|
|
||||||
trigger(
|
|
||||||
'discoveryFilter', [
|
|
||||||
state('summary', style({
|
|
||||||
height: '70px',
|
|
||||||
opacity: 0.9,
|
|
||||||
})),
|
|
||||||
state('full', style({
|
|
||||||
height: '500px',
|
|
||||||
opacity: 1,
|
|
||||||
})),
|
|
||||||
transition('* => *', animate('200ms ease-in')),
|
|
||||||
]),
|
|
||||||
trigger(
|
|
||||||
'result', [
|
|
||||||
state('show', style({
|
|
||||||
height: '300px',
|
|
||||||
opacity: 1,
|
|
||||||
})),
|
|
||||||
state('hidden', style({
|
|
||||||
height: '0px',
|
|
||||||
opacity: 0,
|
|
||||||
})),
|
|
||||||
transition('* => *', animate('200ms ease-in')),
|
|
||||||
]
|
|
||||||
)
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class SettingComponent implements OnInit, AfterContentInit, OnDestroy, OnChanges {
|
|
||||||
|
|
||||||
@Input() visible: boolean;
|
|
||||||
@Input() probe: Probe;
|
|
||||||
@Output() close = new EventEmitter();
|
|
||||||
private requestStart = false;
|
|
||||||
private started = false;
|
|
||||||
private filterData: DiscoverZone;
|
|
||||||
|
|
||||||
private selectedProbe: Probe;
|
|
||||||
private height: number;
|
|
||||||
|
|
||||||
@ViewChild('probeSelectorComponent') probeSelectorComponent: ProbeSelectorComponent;
|
|
||||||
@ViewChild('filterComponent') filterComponent: FilterComponent;
|
|
||||||
@ViewChild('resultComponent') resultComponent: ResultComponent;
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private discoverStore: Store<DiscoverStore.State>,
|
|
||||||
) {
|
|
||||||
this.height = window.innerHeight * 0.9;
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.selectedProbe = this.probe;
|
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges(changes: SimpleChanges): void {
|
|
||||||
if (changes['visible']) {
|
|
||||||
const change = changes['visible'];
|
|
||||||
if (!change.previousValue && change.currentValue) {
|
|
||||||
this.initAll();
|
|
||||||
} else if (change.previousValue && !change.currentValue) {
|
|
||||||
this.destroyAll();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy() {
|
|
||||||
this.selectedProbe = null;
|
|
||||||
this.started = false;
|
|
||||||
this.close.emit();
|
|
||||||
this.requestStart = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
initAll() {
|
|
||||||
this.ngOnInit();
|
|
||||||
if (this.probeSelectorComponent) {
|
|
||||||
this.probeSelectorComponent.ngOnInit();
|
|
||||||
}
|
|
||||||
if (this.filterComponent) {
|
|
||||||
this.filterComponent.ngOnInit();
|
|
||||||
}
|
|
||||||
if (this.resultComponent) {
|
|
||||||
this.resultComponent.ngOnInit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
destroyAll() {
|
|
||||||
this.ngOnDestroy();
|
|
||||||
if (this.probeSelectorComponent) {
|
|
||||||
this.probeSelectorComponent.ngOnDestroy();
|
|
||||||
}
|
|
||||||
if (this.filterComponent) {
|
|
||||||
this.filterComponent.ngOnDestroy();
|
|
||||||
}
|
|
||||||
if (this.resultComponent) {
|
|
||||||
this.resultComponent.ngOnDestroy();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onProbeSelect(probe: Probe) {
|
|
||||||
this.selectedProbe = probe;
|
|
||||||
}
|
|
||||||
|
|
||||||
onDiscoveryStart(discoverZone: DiscoverZone) {
|
|
||||||
this.filterData = discoverZone;
|
|
||||||
this.discoverStore.dispatch(new DiscoverStore.DiscoverZone(
|
|
||||||
{ probeID: this.selectedProbe.probeKey, discoverZone: discoverZone }));
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
this.started = true;
|
|
||||||
// this.requestStart = false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
onCancel() {
|
|
||||||
this.destroyAll();
|
|
||||||
}
|
|
||||||
|
|
||||||
onSave() {
|
|
||||||
this.resultComponent.save();
|
|
||||||
}
|
|
||||||
|
|
||||||
onStop() {
|
|
||||||
this.started = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
onSummaryClick() {
|
|
||||||
if (this.started) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.requestStart = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
|
<of-discovery></of-discovery>
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,8 @@
|
||||||
import {
|
import {
|
||||||
AfterContentInit, Component,
|
AfterContentInit, Component, Input,
|
||||||
OnInit
|
OnInit
|
||||||
} from '@angular/core';
|
} from '@angular/core';
|
||||||
import { select, StateObservable } from '@ngrx/store';
|
import { select, StateObservable } from '@ngrx/store';
|
||||||
import { ListSelector } from '../../../probe/store';
|
|
||||||
import { ActivatedRoute } from '@angular/router';
|
import { ActivatedRoute } from '@angular/router';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
|
@ -17,13 +16,14 @@ export class DiscoveryContainerComponent implements OnInit, AfterContentInit {
|
||||||
// discovery start
|
// discovery start
|
||||||
// discovery stop
|
// discovery stop
|
||||||
// get service list
|
// get service list
|
||||||
probes$: StateObservable;
|
@Input() hostID;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private activatedRoute: ActivatedRoute,
|
private activatedRoute: ActivatedRoute,
|
||||||
) {
|
) {
|
||||||
// this.returnURL = this.activatedRoute.snapshot.queryParams['probe'] || null;
|
if (this.hostID > 0 && this.hostID !== undefined ) {
|
||||||
// this.probes$ = listStore.pipe(select(ListSelector.select('probes')));
|
console.log('ddddddddddddddddddddddddddddddddddddddd');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
|
|
|
||||||
|
|
@ -9,8 +9,8 @@ import { DiscoveryLoggerModule } from './discovery-logger.module';
|
||||||
import { COMPONENTS } from './component';
|
import { COMPONENTS } from './component';
|
||||||
import { SERVICES } from './service';
|
import { SERVICES } from './service';
|
||||||
import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
|
import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
|
||||||
import { BrowserModule } from '@angular/platform-browser';
|
|
||||||
import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
|
import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.module';
|
||||||
|
import { CONTAINER_COMPONENTS } from './container';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
|
|
@ -24,10 +24,12 @@ import { KeyValueModule } from '@overflow/commons/component/key-value/key-value.
|
||||||
KeyValueModule
|
KeyValueModule
|
||||||
],
|
],
|
||||||
declarations: [
|
declarations: [
|
||||||
COMPONENTS
|
COMPONENTS,
|
||||||
|
CONTAINER_COMPONENTS
|
||||||
],
|
],
|
||||||
exports: [
|
exports: [
|
||||||
COMPONENTS,
|
COMPONENTS,
|
||||||
|
CONTAINER_COMPONENTS
|
||||||
],
|
],
|
||||||
providers: [
|
providers: [
|
||||||
SERVICES,
|
SERVICES,
|
||||||
|
|
|
||||||
|
|
@ -1,24 +1,31 @@
|
||||||
<h1>Notifications</h1>
|
<h1>Notifications</h1>
|
||||||
<div class="ui-g-12" dir="rtl">
|
<div *ngIf="!notificationPage; else content">
|
||||||
<button type="button" label="Mark all as read" pButton class="ui-button-width-fit" (click)="onMarkAllAsRead()"></button>
|
No data
|
||||||
</div>
|
</div>
|
||||||
|
<ng-template #content>
|
||||||
<p-table [value]="notificationPage.content" selectionMode="single" (onRowSelect)="onRowSelect($event)" >
|
<div class="ui-g-12" dir="rtl">
|
||||||
<ng-template pTemplate="header">
|
<button type="button" label="Mark all as read" pButton class="ui-button-width-fit" (click)="onMarkAllAsRead()"></button>
|
||||||
<tr>
|
</div>
|
||||||
<th style="width:9em">Date</th>
|
<div>왜 이 div가 없으면 위에 버튼이 안눌릴까요 ㅠㅠ 한참 헤맸자농ㅠㅠ </div>
|
||||||
<th style="width:12em">Title</th>
|
<p-table [value]="notificationPage.content" selectionMode="single" (onRowSelect)="onRowSelect($event)" >
|
||||||
<th pResizableColumn>Message</th>
|
<ng-template pTemplate="header">
|
||||||
<th style="width:8em">User</th>
|
<tr>
|
||||||
</tr>
|
<th style="width:9em">Date</th>
|
||||||
</ng-template>
|
<th style="width:12em">Title</th>
|
||||||
<ng-template pTemplate="body" let-notification let-rowIndex="rowIndex" >
|
<th pResizableColumn>Message</th>
|
||||||
<tr [pSelectableRow]="notification" [ngStyle]="notification.confirmDate ? '' : {'background-color': 'lightblue'}">
|
<th style="width:8em">User</th>
|
||||||
<td>{{notification.createDate | date: 'dd/MM/yyyy'}}</td>
|
</tr>
|
||||||
<td>{{notification.title}}</td>
|
</ng-template>
|
||||||
<td>{{notification.message}}</td>
|
<ng-template pTemplate="body" let-notification let-rowIndex="rowIndex" >
|
||||||
<td>{{notification.member.name}}</td>
|
<tr [pSelectableRow]="notification" [ngStyle]="notification.confirmDate ? '' : {'background-color': 'lightblue'}">
|
||||||
</tr>
|
<td>{{notification.createDate | date: 'dd/MM/yyyy'}}</td>
|
||||||
</ng-template>
|
<td>{{notification.title}}</td>
|
||||||
</p-table>
|
<td>{{notification.message}}</td>
|
||||||
<p-paginator [rows]="pageSize" [totalRecords]="totalLength" (onPageChange)="onPaging($event)"></p-paginator>
|
<td>{{notification.member.name}}</td>
|
||||||
|
</tr>
|
||||||
|
</ng-template>
|
||||||
|
</p-table>
|
||||||
|
<p-paginator #paginator [rows]="notificationPage.size" [totalRecords]="notificationPage.totalElements"
|
||||||
|
(onPageChange)="onPaginate($event)" [first]="2"></p-paginator>
|
||||||
|
|
||||||
|
</ng-template>
|
||||||
|
|
|
||||||
|
|
@ -1,105 +1,35 @@
|
||||||
import { Component, Input } from '@angular/core';
|
import { Component, Input, EventEmitter, Output, ViewChild, OnInit, OnChanges, SimpleChanges } from '@angular/core';
|
||||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||||
import { Page } from '@overflow/commons-typescript/model/commons/Page';
|
import { Page } from '@overflow/commons-typescript/model/commons/Page';
|
||||||
|
import { Paginator } from 'primeng/primeng';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-notification-list',
|
selector: 'of-notification-list',
|
||||||
templateUrl: './list.component.html',
|
templateUrl: './list.component.html',
|
||||||
})
|
})
|
||||||
export class NotificationListComponent {
|
export class NotificationListComponent implements OnChanges {
|
||||||
|
|
||||||
@Input() notificationPage: Page<Notification>;
|
@Input() notificationPage: Page<Notification>;
|
||||||
|
@Output() pageChange = new EventEmitter<number>();
|
||||||
|
@Output() markAll = new EventEmitter();
|
||||||
|
@Output() select = new EventEmitter();
|
||||||
|
@ViewChild('paginator') paginator: Paginator;
|
||||||
|
|
||||||
constructor(
|
ngOnChanges(changes: SimpleChanges): void {
|
||||||
) { }
|
if (changes['notificationPage']) {
|
||||||
|
this.paginator.changePage(this.notificationPage.number);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// ngOnInit() {
|
onPaginate(e) {
|
||||||
// // this.notificationSubscription$ = this.notification$.subscribe(
|
this.pageChange.emit(e.page);
|
||||||
// // (page: Page) => {
|
}
|
||||||
// // if (page !== null) {
|
|
||||||
// // this.notifications = page.content;
|
|
||||||
// // this.totalLength = page.totalElements;
|
|
||||||
// // }
|
|
||||||
// // },
|
|
||||||
// // (error: RPCClientError) => {
|
|
||||||
// // console.log(error.response.message);
|
|
||||||
// // }
|
|
||||||
// // );
|
|
||||||
|
|
||||||
// this.readSuccess$.subscribe(
|
onRowSelect(e) {
|
||||||
// (noti: Notification) => {
|
this.select.emit(e.data);
|
||||||
// if (noti) {
|
}
|
||||||
// this.getNotifications(this.currPage);
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
|
|
||||||
// ngAfterContentInit() {
|
onMarkAllAsRead() {
|
||||||
// this.getNotifications(this.currPage);
|
this.markAll.emit();
|
||||||
// }
|
}
|
||||||
|
|
||||||
// ngOnDestroy() {
|
|
||||||
// if (this.notificationSubscription$) {
|
|
||||||
// this.notificationSubscription$.unsubscribe();
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // updateData(noti: Notification) {
|
|
||||||
// // for (let i = 0; i < this.notifications.length; i++) {
|
|
||||||
// // const exist = this.notifications[i];
|
|
||||||
// // if (exist.id === noti.id) {
|
|
||||||
// // this.notifications[i] = noti;
|
|
||||||
// // return;
|
|
||||||
// // }
|
|
||||||
// // }
|
|
||||||
// // }
|
|
||||||
|
|
||||||
// getNotifications(pageIndex: number) {
|
|
||||||
// // this.listStore.select(AuthSelector.select('member')).subscribe(
|
|
||||||
// // (member: Member) => {
|
|
||||||
// // const pageParams: PageParams = {
|
|
||||||
// // pageNo: pageIndex + '',
|
|
||||||
// // countPerPage: this.pageSize,
|
|
||||||
// // sortCol: 'id',
|
|
||||||
// // sortDirection: 'descending'
|
|
||||||
// // };
|
|
||||||
// // this.listStore.dispatch(new ListStore.ReadAllByMember({ member, pageParams }));
|
|
||||||
// // this.currPage = pageIndex;
|
|
||||||
// // },
|
|
||||||
// // (error) => {
|
|
||||||
// // console.log(error);
|
|
||||||
// // }
|
|
||||||
// // );
|
|
||||||
// }
|
|
||||||
|
|
||||||
// onRowSelect(event) {
|
|
||||||
// this.detailStore.dispatch(new DetailStore.MarkAsRead(event.data));
|
|
||||||
// alert('Will redirect to ' + event.data.url);
|
|
||||||
// // this.router.navigate([n.url]);
|
|
||||||
// }
|
|
||||||
|
|
||||||
// onPaging(e) {
|
|
||||||
// this.getNotifications(e.page);
|
|
||||||
// }
|
|
||||||
|
|
||||||
// onMarkAllAsRead() {
|
|
||||||
// // this.listStore.select(AuthSelector.select('member')).subscribe(
|
|
||||||
// // (member: Member) => {
|
|
||||||
// // const pageParams: PageParams = {
|
|
||||||
// // pageNo: this.currPage + '',
|
|
||||||
// // countPerPage: this.pageSize,
|
|
||||||
// // sortCol: 'id',
|
|
||||||
// // sortDirection: 'descending'
|
|
||||||
// // };
|
|
||||||
// // this.listStore.dispatch(new ListStore.MarkAllAsRead({ member, pageParams }));
|
|
||||||
// // },
|
|
||||||
// // (error) => {
|
|
||||||
// // console.log(error);
|
|
||||||
// // }
|
|
||||||
// // );
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1 +1,5 @@
|
||||||
<of-notification-list [notificationPage]="notificationPage$ | async"></of-notification-list>
|
<of-notification-list [notificationPage]="notificationPage$ | async"
|
||||||
|
(pageChange)="onPageChange($event)"
|
||||||
|
(markAll)="markAllasRead($event)"
|
||||||
|
(select)="notificationSelected($event)"
|
||||||
|
></of-notification-list>
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
|
||||||
import { AfterContentInit, OnDestroy } from '@angular/core/src/metadata/lifecycle_hooks';
|
import { AfterContentInit, OnDestroy } from '@angular/core/src/metadata/lifecycle_hooks';
|
||||||
import { Store, select } from '@ngrx/store';
|
import { Store, select } from '@ngrx/store';
|
||||||
import { Observable } from 'rxjs/Observable';
|
import { Observable } from 'rxjs/Observable';
|
||||||
|
|
@ -10,6 +10,7 @@ import { Member } from '@overflow/commons-typescript/model/member';
|
||||||
import { PageParams } from '@overflow/commons-typescript/model/commons/PageParams';
|
import { PageParams } from '@overflow/commons-typescript/model/commons/PageParams';
|
||||||
import { Page } from '@overflow/commons-typescript/model/commons/Page';
|
import { Page } from '@overflow/commons-typescript/model/commons/Page';
|
||||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||||
|
import { ActivatedRoute } from '@angular/router';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-notification-container',
|
selector: 'of-notification-container',
|
||||||
|
|
@ -17,23 +18,37 @@ import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||||
})
|
})
|
||||||
export class NotificationListContainerComponent implements OnInit {
|
export class NotificationListContainerComponent implements OnInit {
|
||||||
notificationPage$: Observable<Page<Notification>>;
|
notificationPage$: Observable<Page<Notification>>;
|
||||||
|
@Output() pageChange = new EventEmitter<number>();
|
||||||
|
pageNo: number;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private store: Store<ListStore.State>,
|
private store: Store<ListStore.State>,
|
||||||
|
private route: ActivatedRoute
|
||||||
) {
|
) {
|
||||||
this.notificationPage$ = store.pipe(select(NotificationSelector.select('page')));
|
this.notificationPage$ = store.pipe(select(NotificationSelector.select('page')));
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
|
this.route.queryParams.subscribe(queryParams => {
|
||||||
|
this.pageNo = queryParams['page'] || 0;
|
||||||
|
this.getNotifications();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
onPageChange(pageNo: number) {
|
||||||
|
this.pageChange.emit(pageNo);
|
||||||
|
}
|
||||||
|
|
||||||
|
getNotifications() {
|
||||||
this.store.select(AuthSelector.select('member')).subscribe(
|
this.store.select(AuthSelector.select('member')).subscribe(
|
||||||
(member: Member) => {
|
(member: Member) => {
|
||||||
const pageParams: PageParams = {
|
const pageParams: PageParams = {
|
||||||
pageNo: 0,
|
pageNo: this.pageNo,
|
||||||
countPerPage: 10,
|
countPerPage: 10,
|
||||||
sortCol: 'id',
|
sortCol: 'id',
|
||||||
sortDirection: 'descending',
|
sortDirection: 'descending',
|
||||||
};
|
};
|
||||||
this.store.dispatch(new ListStore.ReadAllByMember({member, pageParams}));
|
this.store.dispatch(new ListStore.ReadAllByMember({ member, pageParams }));
|
||||||
},
|
},
|
||||||
(error) => {
|
(error) => {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
|
|
@ -41,4 +56,25 @@ export class NotificationListContainerComponent implements OnInit {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
markAllasRead() {
|
||||||
|
this.store.select(AuthSelector.select('member')).subscribe(
|
||||||
|
(member: Member) => {
|
||||||
|
const pageParams: PageParams = {
|
||||||
|
pageNo: this.pageNo,
|
||||||
|
countPerPage: 10,
|
||||||
|
sortCol: 'id',
|
||||||
|
sortDirection: 'descending'
|
||||||
|
};
|
||||||
|
this.store.dispatch(new ListStore.MarkAllAsRead({ member, pageParams }));
|
||||||
|
},
|
||||||
|
(error) => {
|
||||||
|
console.log(error);
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
notificationSelected(notification: Notification) {
|
||||||
|
// this.router.navigate([notification.url]);
|
||||||
|
alert('redirect to ' + notification.url);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,65 +1,84 @@
|
||||||
<div class="ui-g">
|
<div class="ui-g">
|
||||||
<div class="ui-g-6 ui-nopad">
|
<div class="ui-g-6 ui-nopad">
|
||||||
<h1>Info</h1>
|
<h1>Info</h1>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <p-messages [(value)]="msgs"></p-messages> -->
|
||||||
<div class="ui-g-6 nopad" dir="rtl" style="padding-top: 15px">
|
<div class="ui-g-6 nopad" dir="rtl" style="padding-top: 15px">
|
||||||
<button class="ui-button-width-fit" *ngIf="!editMode" pButton type="button" label="Edit" (click)="editMode = true"></button>
|
<button class="ui-button-width-fit" *ngIf="!editMode" pButton type="button" label="Edit" (click)="editMode = true"></button>
|
||||||
<button class="ui-button-width-fit" *ngIf="editMode" pButton type="button" label="Save" (click)="onEditSave()"></button>
|
<button class="ui-button-width-fit" *ngIf="editMode" pButton type="button" label="Save" (click)="onEditSave()"></button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p-dialog [showHeader]="false" [closeOnEscape]="false" [modal]="true" header="Discovery" [width]="800" [(visible)]="display">
|
<!-- Probe info -->
|
||||||
<of-discovery-setting [probe]="probe" [visible]="display" (close)="onDiscoveryClose()"></of-discovery-setting>
|
|
||||||
</p-dialog>
|
|
||||||
<div class="ui-g ui-bottom-space-10">
|
<div class="ui-g ui-bottom-space-10">
|
||||||
<p-panel [showHeader]="false" class="nopad">
|
<p-panel [showHeader]="false" class="nopad">
|
||||||
<div *ngIf="probe">
|
<div *ngIf="probeHost">
|
||||||
|
|
||||||
|
|
||||||
<div class="ui-g form-group">
|
<div class="ui-g form-group">
|
||||||
|
|
||||||
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
<div *ngIf="editMode" class="of-key-value-div">
|
<div *ngIf="editMode" class="of-key-value-div">
|
||||||
<span>Name</span>
|
<span>Name</span>
|
||||||
<span class="ng-star-inserted">
|
<span class="ng-star-inserted">
|
||||||
<input #input type="text" pInputText value="{{probe.displayName}}" (keypress)="onDisplayNameChangeKeypress($event, input.value)">
|
<input #input type="text" pInputText value="{{probeHost.probe.displayName}}" (keyup)="probeHost.probe.displayName = input.value">
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<of-key-value *ngIf="!editMode" [key]="'Name'" [value]="probe.displayName"></of-key-value>
|
<of-key-value *ngIf="!editMode" [key]="'Name'" [value]="probeHost.probe.displayName"></of-key-value>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
<of-key-value [key]="'CIDR'" [value]="probe.cidr"></of-key-value>
|
<of-key-value [key]="'CIDR'" [value]="probeHost.probe.cidr"></of-key-value>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
<div *ngIf="editMode" class="of-key-value-div">
|
<div *ngIf="editMode" class="of-key-value-div">
|
||||||
<span>Description</span>
|
<span>Description</span>
|
||||||
<span class="ng-star-inserted">
|
<span class="ng-star-inserted">
|
||||||
<input *ngIf="editMode" #input type="text" pInputText value="{{probe.description}}" (keypress)="onDisplayNameChangeKeypress($event, input.value)">
|
<input *ngIf="editMode" #input type="text" pInputText value="{{probeHost.probe.description}}" (keyup)="probeHost.probe.description = input.value">
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<of-key-value *ngIf="!editMode" [key]="'Description'" [value]="probe.description"></of-key-value>
|
<of-key-value *ngIf="!editMode" [key]="'Description'" [value]="probeHost.probe.description"></of-key-value>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
<of-key-value [key]="'Key'" [value]="probe.probeKey"></of-key-value>
|
<of-key-value [key]="'Key'" [value]="probeHost.probe.probeKey"></of-key-value>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
<of-key-value [key]="'Authrozied at'" [value]="probe.authorizeDate | date: 'dd/MM/yyyy'"></of-key-value>
|
<of-key-value [key]="'Authrozied at'" [value]="probeHost.probe.authorizeDate | date: 'dd/MM/yyyy'"></of-key-value>
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
<of-key-value [key]="'Authrozied by'" [value]="probe.authorizeMember.name"></of-key-value>
|
<of-key-value [key]="'Authrozied by'" [value]="probeHost.probe.authorizeMember.name"></of-key-value>
|
||||||
</div>
|
|
||||||
<div class="ui-g-12 ui-md-6 ui-key-value ui-nopad">
|
|
||||||
<of-key-value [key]="'IP Range'" [value]="IPRange"></of-key-value>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</p-panel>
|
</p-panel>
|
||||||
|
|
||||||
|
<!-- Host info -->
|
||||||
|
<p-panel [showHeader]="false" class="nopad">
|
||||||
|
<div *ngIf="probeHost">
|
||||||
|
<div class="ui-g form-group">
|
||||||
|
|
||||||
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
|
<of-key-value [key]="'IPv4'" [value]="probeHost.host.ipv4"></of-key-value>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
|
<of-key-value [key]="'IPv6'" [value]="probeHost.host.ipv6"></of-key-value>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
|
<of-key-value [key]="'Mac Address'" [value]="probeHost.host.mac"></of-key-value>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="ui-g-12 ui-md-6 ui-key-value ui-bottom-border-1 ui-nopad">
|
||||||
|
<of-key-value [key]="'OS'" [value]="probeHost.host.os.vendor.name"></of-key-value>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</p-panel>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="ui-g" dir="rtl">
|
<div class="ui-g" dir="rtl">
|
||||||
<button class="ui-button-danger ui-button-width-fit" type="button" label="Remove this Probe" icon="ui-icon-close" pButton
|
<button class="ui-button-danger ui-button-width-fit" type="button" label="Remove this Probe" icon="ui-icon-close" pButton
|
||||||
(click)="onRemoveClick()"></button>
|
(click)="onRemoveClick()"></button>
|
||||||
<button class="ui-button-width-fit" type="button" label="Discovery" icon="ui-icon-search" pButton (click)="onDiscoveryClick()"></button>
|
<button class="ui-button-width-fit" type="button" label="Discovery" icon="ui-icon-search" pButton (click)="onDiscoveryClick()"></button>
|
||||||
</div>
|
</div>
|
||||||
<p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
|
<!-- <p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
|
||||||
<p-growl [(value)]="msgs"></p-growl>
|
<p-growl [(value)]="msgs"></p-growl> -->
|
||||||
|
|
@ -1,129 +1,66 @@
|
||||||
import { Component, OnInit, Inject, AfterContentInit, OnDestroy } from '@angular/core';
|
import { Component, Input, Output, EventEmitter, ViewChild } from '@angular/core';
|
||||||
import { ActivatedRoute, Router } from '@angular/router';
|
import { Probe, ProbeHost } from '@overflow/commons-typescript/model/probe';
|
||||||
import { Store, select } from '@ngrx/store';
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
// import * as DetailStore from '../../store/detail';
|
|
||||||
// import * as ModifyStore from '../../store/modify';
|
|
||||||
// import { DetailSelector, ModifySelector } from '../../store';
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
import { ConfirmationService, Message } from 'primeng/primeng';
|
|
||||||
import * as CIDR from 'ip-cidr';
|
|
||||||
import { Subscription } from 'rxjs/Subscription';
|
|
||||||
import { MessageService } from 'primeng/components/common/messageservice';
|
import { MessageService } from 'primeng/components/common/messageservice';
|
||||||
// import { SettingComponent as DiscoverySettingComponent } from '@overflow/discovery/component/setting/setting.component';
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-probe-detail',
|
selector: 'of-probe-detail',
|
||||||
templateUrl: './detail.component.html',
|
templateUrl: './detail.component.html',
|
||||||
providers: [ConfirmationService, MessageService]
|
providers: [MessageService]
|
||||||
})
|
})
|
||||||
export class ProbeDetailComponent implements OnInit, AfterContentInit, OnDestroy {
|
export class ProbeDetailComponent {
|
||||||
|
|
||||||
probeSubscription$: Subscription;
|
@Input() probeHost: ProbeHost;
|
||||||
// probe$ = this.detailStore.pipe(select(DetailSelector.select('probe')));
|
@Output() modify = new EventEmitter<ProbeHost>();
|
||||||
// modifySuccess$ = this.modifyStore.pipe(select(ModifySelector.select('modifiedProbe')));
|
@Output() discovery = new EventEmitter<number>();
|
||||||
probe: Probe = null;
|
|
||||||
IPRange: string;
|
|
||||||
display = false;
|
|
||||||
msgs: Message[] = [];
|
|
||||||
|
|
||||||
constructor(
|
editMode = false;
|
||||||
private route: ActivatedRoute,
|
|
||||||
// private detailStore: Store<DetailStore.State>,
|
|
||||||
// private modifyStore: Store<ModifyStore.State>,
|
|
||||||
private confirmationService: ConfirmationService,
|
|
||||||
private messageService: MessageService
|
|
||||||
) { }
|
|
||||||
|
|
||||||
ngOnInit() {
|
constructor(private messageService: MessageService) {
|
||||||
// this.probeSubscription$ = this.probe$.subscribe(
|
|
||||||
// (probe: Probe) => {
|
|
||||||
// if (probe) {
|
|
||||||
// this.probe = probe;
|
|
||||||
// this.arrangeInfo();
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnDestroy() {
|
onEditSave() {
|
||||||
if (this.probeSubscription$) {
|
const displayNameValidation = this.checkValidDisplayName();
|
||||||
this.probeSubscription$.unsubscribe();
|
if (displayNameValidation) {
|
||||||
}
|
alert(displayNameValidation);
|
||||||
}
|
|
||||||
|
|
||||||
ngAfterContentInit() {
|
|
||||||
// const probeId = this.route.snapshot.paramMap.get('id');
|
|
||||||
// this.detailStore.dispatch(
|
|
||||||
// new DetailStore.Read(
|
|
||||||
// { id: probeId }
|
|
||||||
// )
|
|
||||||
// );
|
|
||||||
}
|
|
||||||
|
|
||||||
arrangeInfo() {
|
|
||||||
const cidr = new CIDR(this.probe.cidr);
|
|
||||||
if (!cidr.isValid()) {
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.IPRange = cidr.addressStart.address + ' ~ ' + cidr.addressEnd.address;
|
|
||||||
|
const descriptionValidation = this.checkValidDescription();
|
||||||
|
if (descriptionValidation) {
|
||||||
|
alert(descriptionValidation);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.modify.emit(this.probeHost);
|
||||||
|
this.editMode = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
onDiscoveryClick() {
|
onDiscoveryClick() {
|
||||||
this.display = true;
|
this.discovery.emit(this.probeHost.id);
|
||||||
}
|
}
|
||||||
|
|
||||||
onDiscoveryClose() {
|
checkValidDisplayName(): string {
|
||||||
this.display = false;
|
const displayName = this.probeHost.probe.displayName;
|
||||||
}
|
if (displayName.length <= 2 || displayName.length > 20) {
|
||||||
|
return 'displayname length : 3 ~ 20';
|
||||||
onRemoveClick() {
|
|
||||||
this.confirmationService.confirm({
|
|
||||||
header: 'Confirmation',
|
|
||||||
icon: 'fa fa-trash',
|
|
||||||
message: 'Are you sure to remove this Probe?',
|
|
||||||
accept: () => {
|
|
||||||
// this.router.navigate(['probes/list']);
|
|
||||||
},
|
|
||||||
reject: () => {
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
onDisplayNameChange(value: string) {
|
|
||||||
// if (value === this.probe.displayName) {
|
|
||||||
// return;
|
|
||||||
// }
|
|
||||||
// this.probe.displayName = value;
|
|
||||||
// this.modifyStore.dispatch(
|
|
||||||
// new ModifyStore.Modify(this.probe)
|
|
||||||
// );
|
|
||||||
|
|
||||||
// const modifySuccessSubscription$: Subscription = this.modifySuccess$.subscribe(
|
|
||||||
// (probe: Probe) => {
|
|
||||||
// if (probe) {
|
|
||||||
// this.msgs = [];
|
|
||||||
// this.msgs.push({ severity: 'success', summary: 'Succeed', detail: 'Probe name has changed.' });
|
|
||||||
// }
|
|
||||||
// if (modifySuccessSubscription$) {
|
|
||||||
// modifySuccessSubscription$.unsubscribe();
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// (error: RPCClientError) => {
|
|
||||||
// console.log(error.response.message);
|
|
||||||
// }
|
|
||||||
// );
|
|
||||||
}
|
|
||||||
|
|
||||||
onDisplayNameChangeKeypress(event, value) {
|
|
||||||
if (event.key === 'Enter') {
|
|
||||||
this.onDisplayNameChange(value);
|
|
||||||
}
|
}
|
||||||
|
const regex = /[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi;
|
||||||
|
if (displayName.match(regex)) {
|
||||||
|
return 'Cannot use special characters.';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
checkValidDescription(): string {
|
||||||
|
const description = this.probeHost.probe.description;
|
||||||
|
if (description.length > 50) {
|
||||||
|
return 'description length : 0 ~ 50';
|
||||||
|
}
|
||||||
|
const regex = /[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi;
|
||||||
|
if (description.match(regex)) {
|
||||||
|
return 'Cannot use special characters.';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1 +1 @@
|
||||||
<of-probe-detail></of-probe-detail>
|
<of-probe-detail [probeHost]="(probeHosts$ | async)[0]" (modify)="onModify($event)" (discovery)="onDiscovery($event)"></of-probe-detail>
|
||||||
|
|
@ -1,9 +1,39 @@
|
||||||
import { Component } from '@angular/core';
|
import { Component, OnInit, Input, AfterViewInit, Output, EventEmitter } from '@angular/core';
|
||||||
|
import { Observable } from 'rxjs';
|
||||||
|
import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
|
||||||
|
import { Store, select } from '@ngrx/store';
|
||||||
|
import * as ProbeStore from '../store/entity/probe';
|
||||||
|
import { ProbeSelector } from '../store';
|
||||||
|
import { ActivatedRoute } from '@angular/router';
|
||||||
|
import { RPCClientError } from '@loafer/ng-rpc';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-probe-detail-container',
|
selector: 'of-probe-detail-container',
|
||||||
templateUrl: './probe-detail-container.html',
|
templateUrl: './probe-detail-container.html',
|
||||||
})
|
})
|
||||||
export class ProbeDetailContainerComponent {
|
export class ProbeDetailContainerComponent implements OnInit {
|
||||||
|
|
||||||
|
@Input() probeHostID;
|
||||||
|
@Output() discovery = new EventEmitter<number>();
|
||||||
|
probeHosts$: Observable<ProbeHost[]>;
|
||||||
|
error$: Observable<RPCClientError>;
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private store: Store<ProbeStore.State>,
|
||||||
|
private route: ActivatedRoute,
|
||||||
|
) {
|
||||||
|
this.probeHosts$ = store.pipe(select(ProbeSelector.select('probeHosts')));
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.store.dispatch(new ProbeStore.Read(this.probeHostID));
|
||||||
|
}
|
||||||
|
|
||||||
|
onModify(probeHost: ProbeHost) {
|
||||||
|
this.store.dispatch(new ProbeStore.Modify(probeHost.probe));
|
||||||
|
}
|
||||||
|
|
||||||
|
onDiscovery(probeHostID: number) {
|
||||||
|
this.discovery.emit(probeHostID);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
import { Component, EventEmitter, Output, OnInit, AfterContentInit } from '@angular/core';
|
import { Component, EventEmitter, Output, OnInit } from '@angular/core';
|
||||||
import { ProbeHost } from '@overflow/commons-typescript/model/probe';
|
import { ProbeHost } from '@overflow/commons-typescript/model/probe';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { Store, select } from '@ngrx/store';
|
import { Store, select } from '@ngrx/store';
|
||||||
import * as ProbeStore from '../store/probe';
|
import * as ProbeStore from '../store/entity/probe';
|
||||||
import { ProbeSelector } from '../store';
|
import { ProbeSelector } from '../store';
|
||||||
import { AuthSelector } from '@overflow/member/store';
|
import { AuthSelector } from '@overflow/member/store';
|
||||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
import { Domain } from '@overflow/commons-typescript/model/domain';
|
||||||
|
|
@ -11,7 +11,7 @@ import { Domain } from '@overflow/commons-typescript/model/domain';
|
||||||
selector: 'of-probe-list-container',
|
selector: 'of-probe-list-container',
|
||||||
templateUrl: './probe-list-container.html',
|
templateUrl: './probe-list-container.html',
|
||||||
})
|
})
|
||||||
export class ProbeListContainerComponent implements OnInit, AfterContentInit {
|
export class ProbeListContainerComponent implements OnInit {
|
||||||
|
|
||||||
probeHosts$: Observable<ProbeHost[]>;
|
probeHosts$: Observable<ProbeHost[]>;
|
||||||
@Output() select = new EventEmitter();
|
@Output() select = new EventEmitter();
|
||||||
|
|
@ -20,10 +20,6 @@ export class ProbeListContainerComponent implements OnInit, AfterContentInit {
|
||||||
this.probeHosts$ = store.pipe(select(ProbeSelector.select('probeHosts')));
|
this.probeHosts$ = store.pipe(select(ProbeSelector.select('probeHosts')));
|
||||||
}
|
}
|
||||||
|
|
||||||
onSelect(probeHost: ProbeHost) {
|
|
||||||
this.select.emit(probeHost);
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.store.select(AuthSelector.select('domain')).subscribe(
|
this.store.select(AuthSelector.select('domain')).subscribe(
|
||||||
(domain: Domain) => {
|
(domain: Domain) => {
|
||||||
|
|
@ -35,7 +31,8 @@ export class ProbeListContainerComponent implements OnInit, AfterContentInit {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
ngAfterContentInit() {
|
onSelect(probeHost: ProbeHost) {
|
||||||
|
this.select.emit(probeHost);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
2
@overflow/probe/store/container/probe-list/index.ts
Normal file
2
@overflow/probe/store/container/probe-list/index.ts
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
export * from './probe-list.reducer';
|
||||||
|
export * from './probe-list.state';
|
||||||
|
|
@ -0,0 +1,36 @@
|
||||||
|
import { ActionType, Actions } from '../../entity/probe';
|
||||||
|
import {
|
||||||
|
State,
|
||||||
|
initialState,
|
||||||
|
} from './probe-list.state';
|
||||||
|
|
||||||
|
import { Probe } from '@overflow/commons-typescript/model/probe';
|
||||||
|
|
||||||
|
export function reducer(state = initialState, action: Actions): State {
|
||||||
|
switch (action.type) {
|
||||||
|
case ActionType.ReadAllByDomainID: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
pending: true,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.ReadAllByDomainIDSuccess: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
pending: false,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.ReadAllByDomainIDFailure: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
pending: true,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
default: {
|
||||||
|
return state;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
export interface State {
|
||||||
|
pending: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const initialState: State = {
|
||||||
|
pending: false,
|
||||||
|
};
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { Action } from '@ngrx/store';
|
import { Action } from '@ngrx/store';
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
import { RPCClientError } from '@loafer/ng-rpc';
|
||||||
import { ProbeHost } from '@overflow/commons-typescript/model/probe';
|
import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
|
||||||
|
|
||||||
export enum ActionType {
|
export enum ActionType {
|
||||||
ReadAllByDomainID = '[probe.list] ReadAllByDomainID',
|
ReadAllByDomainID = '[probe.list] ReadAllByDomainID',
|
||||||
|
|
@ -10,6 +10,10 @@ export enum ActionType {
|
||||||
Read = '[probe.detail] Read',
|
Read = '[probe.detail] Read',
|
||||||
ReadSuccess = '[probe.detail] ReadSuccess',
|
ReadSuccess = '[probe.detail] ReadSuccess',
|
||||||
ReadFailure = '[probe.detail] ReadFailure',
|
ReadFailure = '[probe.detail] ReadFailure',
|
||||||
|
|
||||||
|
Modify = '[probe.detail] Modify',
|
||||||
|
ModifySuccess = '[probe.detail] ModifySuccess',
|
||||||
|
ModifyFailure = '[probe.detail] ModifyFailure',
|
||||||
}
|
}
|
||||||
|
|
||||||
export class ReadAllByDomainID implements Action {
|
export class ReadAllByDomainID implements Action {
|
||||||
|
|
@ -48,6 +52,24 @@ export class ReadFailure implements Action {
|
||||||
constructor(public payload: RPCClientError) {}
|
constructor(public payload: RPCClientError) {}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export class Modify implements Action {
|
||||||
|
readonly type = ActionType.Modify;
|
||||||
|
|
||||||
|
constructor(public payload: Probe) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ModifySuccess implements Action {
|
||||||
|
readonly type = ActionType.ModifySuccess;
|
||||||
|
|
||||||
|
constructor(public payload: Probe) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ModifyFailure implements Action {
|
||||||
|
readonly type = ActionType.ModifyFailure;
|
||||||
|
|
||||||
|
constructor(public payload: RPCClientError) {}
|
||||||
|
}
|
||||||
|
|
||||||
export type Actions =
|
export type Actions =
|
||||||
| ReadAllByDomainID
|
| ReadAllByDomainID
|
||||||
| ReadAllByDomainIDSuccess
|
| ReadAllByDomainIDSuccess
|
||||||
|
|
@ -55,4 +77,7 @@ export type Actions =
|
||||||
| Read
|
| Read
|
||||||
| ReadSuccess
|
| ReadSuccess
|
||||||
| ReadFailure
|
| ReadFailure
|
||||||
|
| Modify
|
||||||
|
| ModifySuccess
|
||||||
|
| ModifyFailure
|
||||||
;
|
;
|
||||||
|
|
@ -25,9 +25,13 @@ import {
|
||||||
Read,
|
Read,
|
||||||
ReadSuccess,
|
ReadSuccess,
|
||||||
ReadFailure,
|
ReadFailure,
|
||||||
|
Modify,
|
||||||
|
ModifySuccess,
|
||||||
|
ModifyFailure,
|
||||||
ActionType
|
ActionType
|
||||||
} from './probe.action';
|
} from './probe.action';
|
||||||
import { ProbeHostService } from '../../service/probe-host.service';
|
import { ProbeHostService } from '../../../service/probe-host.service';
|
||||||
|
import { ProbeService } from '../../../service/probe.service';
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class Effects {
|
export class Effects {
|
||||||
|
|
@ -35,6 +39,7 @@ export class Effects {
|
||||||
constructor(
|
constructor(
|
||||||
private actions$: Actions,
|
private actions$: Actions,
|
||||||
private probeHostService: ProbeHostService,
|
private probeHostService: ProbeHostService,
|
||||||
|
private probeService: ProbeService,
|
||||||
private router: Router
|
private router: Router
|
||||||
) { }
|
) { }
|
||||||
|
|
||||||
|
|
@ -61,4 +66,16 @@ export class Effects {
|
||||||
.catch((error: RPCClientError) => {
|
.catch((error: RPCClientError) => {
|
||||||
return of(new ReadAllByDomainIDFailure(error));
|
return of(new ReadAllByDomainIDFailure(error));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@Effect()
|
||||||
|
Modify$: Observable<Action> = this.actions$
|
||||||
|
.ofType(ActionType.Modify)
|
||||||
|
.map((action: Modify) => action.payload)
|
||||||
|
.switchMap(payload => this.probeService.modify(payload))
|
||||||
|
.map(probe => {
|
||||||
|
return new ModifySuccess(probe);
|
||||||
|
})
|
||||||
|
.catch((error: RPCClientError) => {
|
||||||
|
return of(new ModifyFailure(error));
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -1,7 +1,4 @@
|
||||||
import {
|
import {
|
||||||
ReadAllByDomainID,
|
|
||||||
ReadAllByDomainIDFailure,
|
|
||||||
ReadAllByDomainIDSuccess,
|
|
||||||
ActionType,
|
ActionType,
|
||||||
Actions,
|
Actions,
|
||||||
} from './probe.action';
|
} from './probe.action';
|
||||||
|
|
@ -61,6 +58,36 @@ export function reducer(state = initialState, action: Actions): State {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
case ActionType.Modify: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.ModifySuccess: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
probeHosts: state.probeHosts.map(
|
||||||
|
(probeHost, i) => probeHost.probe.id === action.payload.id ?
|
||||||
|
{
|
||||||
|
...probeHost,
|
||||||
|
probe : action.payload
|
||||||
|
} : probeHost
|
||||||
|
),
|
||||||
|
error: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
case ActionType.ModifyFailure: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: action.payload,
|
||||||
|
probeHosts: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
default: {
|
default: {
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
|
@ -8,7 +8,7 @@ import { StateSelector } from '@overflow/core/ngrx/store';
|
||||||
|
|
||||||
import { MODULE } from '../probe.constant';
|
import { MODULE } from '../probe.constant';
|
||||||
|
|
||||||
import * as ProbeStore from './probe';
|
import * as ProbeStore from './entity/probe';
|
||||||
|
|
||||||
export interface State {
|
export interface State {
|
||||||
probes: ProbeStore.State;
|
probes: ProbeStore.State;
|
||||||
|
|
|
||||||
|
|
@ -1,37 +0,0 @@
|
||||||
import { Action } from '@ngrx/store';
|
|
||||||
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
export enum ActionType {
|
|
||||||
Read = '[probe.detail] Read',
|
|
||||||
ReadSuccess = '[probe.detail] ReadSuccess',
|
|
||||||
ReadFailure = '[probe.detail] ReadFailure',
|
|
||||||
}
|
|
||||||
|
|
||||||
export class Read implements Action {
|
|
||||||
readonly type = ActionType.Read;
|
|
||||||
|
|
||||||
constructor(public payload: {id: string}) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class ReadSuccess implements Action {
|
|
||||||
readonly type = ActionType.ReadSuccess;
|
|
||||||
|
|
||||||
constructor(public payload: Probe) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class ReadFailure implements Action {
|
|
||||||
readonly type = ActionType.ReadFailure;
|
|
||||||
|
|
||||||
constructor(public payload: RPCClientError) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
export type Actions =
|
|
||||||
| Read
|
|
||||||
| ReadSuccess
|
|
||||||
| ReadFailure
|
|
||||||
;
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { TestBed, inject } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { Effects } from './detail.effect';
|
|
||||||
|
|
||||||
describe('ProbeDetail.Effects', () => {
|
|
||||||
beforeEach(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
providers: [Effects]
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be created', inject([Effects], (effects: Effects) => {
|
|
||||||
expect(effects).toBeTruthy();
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
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';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
import { ProbeService } from '../../service/probe.service';
|
|
||||||
|
|
||||||
import {
|
|
||||||
Read,
|
|
||||||
ReadFailure,
|
|
||||||
ReadSuccess,
|
|
||||||
ActionType
|
|
||||||
} from './detail.action';
|
|
||||||
|
|
||||||
@Injectable()
|
|
||||||
export class Effects {
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private actions$: Actions,
|
|
||||||
private probeService: ProbeService,
|
|
||||||
private router: Router
|
|
||||||
) { }
|
|
||||||
|
|
||||||
@Effect()
|
|
||||||
read$: Observable<Action> = this.actions$
|
|
||||||
.ofType(ActionType.Read)
|
|
||||||
.map((action: Read) => action.payload)
|
|
||||||
.switchMap(payload => this.probeService.read(payload.id))
|
|
||||||
.map(probe => {
|
|
||||||
return new ReadSuccess(probe);
|
|
||||||
})
|
|
||||||
.catch((error: RPCClientError) => {
|
|
||||||
return of(new ReadFailure(error));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
import {
|
|
||||||
Read,
|
|
||||||
ReadFailure,
|
|
||||||
ReadSuccess,
|
|
||||||
ActionType,
|
|
||||||
Actions,
|
|
||||||
} from './detail.action';
|
|
||||||
|
|
||||||
import {
|
|
||||||
State,
|
|
||||||
initialState,
|
|
||||||
} from './detail.state';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
export function reducer(state = initialState, action: Actions): State {
|
|
||||||
switch (action.type) {
|
|
||||||
case ActionType.Read: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: null,
|
|
||||||
isPending: true,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.ReadSuccess: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
probe: action.payload,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.ReadFailure: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: action.payload,
|
|
||||||
isPending: false,
|
|
||||||
probe: null,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
default: {
|
|
||||||
return state;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
import { createEntityAdapter, EntityAdapter, EntityState } from '@ngrx/entity';
|
|
||||||
|
|
||||||
export interface State extends EntityState<Probe> {
|
|
||||||
error: RPCClientError | null;
|
|
||||||
isPending: boolean;
|
|
||||||
probe: Probe | null;
|
|
||||||
}
|
|
||||||
export const adapter: EntityAdapter<Probe> = createEntityAdapter<Probe>();
|
|
||||||
export const initialState: State = adapter.getInitialState({
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
probe: null,
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export * from './detail.action';
|
|
||||||
export * from './detail.effect';
|
|
||||||
export * from './detail.reducer';
|
|
||||||
export * from './detail.state';
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export * from './list.action';
|
|
||||||
export * from './list.effect';
|
|
||||||
export * from './list.reducer';
|
|
||||||
export * from './list.state';
|
|
||||||
|
|
@ -1,38 +0,0 @@
|
||||||
import { Action } from '@ngrx/store';
|
|
||||||
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
export enum ActionType {
|
|
||||||
ReadAllByDomain = '[probe.list] ReadAllByDomain',
|
|
||||||
ReadAllByDomainSuccess = '[probe.list] ReadAllByDomainSuccess',
|
|
||||||
ReadAllByDomainFailure = '[probe.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: Probe[]) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class ReadAllByDomainFailure implements Action {
|
|
||||||
readonly type = ActionType.ReadAllByDomainFailure;
|
|
||||||
|
|
||||||
constructor(public payload: RPCClientError) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
export type Actions =
|
|
||||||
| ReadAllByDomain
|
|
||||||
| ReadAllByDomainSuccess
|
|
||||||
| ReadAllByDomainFailure
|
|
||||||
;
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
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();
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
|
|
@ -1,51 +0,0 @@
|
||||||
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';
|
|
||||||
|
|
||||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
import { ProbeService } from '../../service/probe.service';
|
|
||||||
|
|
||||||
import {
|
|
||||||
ReadAllByDomain,
|
|
||||||
ReadAllByDomainFailure,
|
|
||||||
ReadAllByDomainSuccess,
|
|
||||||
ActionType
|
|
||||||
} from './list.action';
|
|
||||||
|
|
||||||
@Injectable()
|
|
||||||
export class Effects {
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private actions$: Actions,
|
|
||||||
private probeService: ProbeService,
|
|
||||||
private router: Router
|
|
||||||
) { }
|
|
||||||
|
|
||||||
@Effect()
|
|
||||||
readAllByDomain$: Observable<Action> = this.actions$
|
|
||||||
.ofType(ActionType.ReadAllByDomain)
|
|
||||||
.map((action: ReadAllByDomain) => action.payload)
|
|
||||||
.switchMap(payload => this.probeService.readAllByDomain(payload))
|
|
||||||
.map(probes => {
|
|
||||||
return new ReadAllByDomainSuccess(probes);
|
|
||||||
})
|
|
||||||
.catch((error: RPCClientError) => {
|
|
||||||
return of(new ReadAllByDomainFailure(error));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,48 +0,0 @@
|
||||||
import {
|
|
||||||
ReadAllByDomain,
|
|
||||||
ReadAllByDomainFailure,
|
|
||||||
ReadAllByDomainSuccess,
|
|
||||||
ActionType,
|
|
||||||
Actions,
|
|
||||||
} from './list.action';
|
|
||||||
|
|
||||||
import {
|
|
||||||
State,
|
|
||||||
initialState,
|
|
||||||
} from './list.state';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
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,
|
|
||||||
probes: action.payload,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.ReadAllByDomainFailure: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: action.payload,
|
|
||||||
isPending: false,
|
|
||||||
probes: null,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
default: {
|
|
||||||
return state;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
export interface State {
|
|
||||||
error: RPCClientError | null;
|
|
||||||
isPending: boolean;
|
|
||||||
probes: Probe[] | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const initialState: State = {
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
probes: null,
|
|
||||||
};
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export * from './modify.action';
|
|
||||||
export * from './modify.effect';
|
|
||||||
export * from './modify.reducer';
|
|
||||||
export * from './modify.state';
|
|
||||||
|
|
@ -1,45 +0,0 @@
|
||||||
import { Action } from '@ngrx/store';
|
|
||||||
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
export enum ActionType {
|
|
||||||
Modify = '[probe.modify] Modify',
|
|
||||||
ModifyDisplayName = '[probe.modify] ModifyDisplayName',
|
|
||||||
ModifySuccess = '[probe.modify] ModifySuccess',
|
|
||||||
ModifyFailure = '[probe.modify] ModifyFailure',
|
|
||||||
}
|
|
||||||
|
|
||||||
export class Modify implements Action {
|
|
||||||
readonly type = ActionType.Modify;
|
|
||||||
|
|
||||||
constructor(public payload: Probe) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class ModifySuccess implements Action {
|
|
||||||
readonly type = ActionType.ModifySuccess;
|
|
||||||
|
|
||||||
constructor(public payload: Probe) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class ModifyFailure implements Action {
|
|
||||||
readonly type = ActionType.ModifyFailure;
|
|
||||||
|
|
||||||
constructor(public payload: RPCClientError) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class ModifyDisplayName implements Action {
|
|
||||||
readonly type = ActionType.ModifyDisplayName;
|
|
||||||
|
|
||||||
constructor(public payload: {id: string, displayName: string}) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
export type Actions =
|
|
||||||
| Modify
|
|
||||||
| ModifySuccess
|
|
||||||
| ModifyFailure
|
|
||||||
| ModifyDisplayName
|
|
||||||
;
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { TestBed, inject } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { Effects } from './detail.effect';
|
|
||||||
|
|
||||||
describe('ProbeDetail.Effects', () => {
|
|
||||||
beforeEach(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
providers: [Effects]
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be created', inject([Effects], (effects: Effects) => {
|
|
||||||
expect(effects).toBeTruthy();
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
|
|
@ -1,62 +0,0 @@
|
||||||
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';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
import { ProbeService } from '../../service/probe.service';
|
|
||||||
|
|
||||||
import {
|
|
||||||
Modify,
|
|
||||||
ModifyDisplayName,
|
|
||||||
ModifySuccess,
|
|
||||||
ModifyFailure,
|
|
||||||
ActionType
|
|
||||||
} from './modify.action';
|
|
||||||
|
|
||||||
@Injectable()
|
|
||||||
export class Effects {
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private actions$: Actions,
|
|
||||||
private probeService: ProbeService,
|
|
||||||
private router: Router
|
|
||||||
) { }
|
|
||||||
|
|
||||||
@Effect()
|
|
||||||
modify$: Observable<Action> = this.actions$
|
|
||||||
.ofType(ActionType.Modify)
|
|
||||||
.map((action: Modify) => action.payload)
|
|
||||||
.switchMap(payload => this.probeService.modify(payload))
|
|
||||||
.map(probe => {
|
|
||||||
return new ModifySuccess(probe);
|
|
||||||
})
|
|
||||||
.catch((error: RPCClientError) => {
|
|
||||||
return of(new ModifyFailure(error));
|
|
||||||
});
|
|
||||||
|
|
||||||
@Effect()
|
|
||||||
modifyDisplayName$: Observable<Action> = this.actions$
|
|
||||||
.ofType(ActionType.ModifyDisplayName)
|
|
||||||
.map((action: ModifyDisplayName) => action.payload)
|
|
||||||
.switchMap(payload => this.probeService.modifyDisplayName(payload.id, payload.displayName))
|
|
||||||
.map(probe => {
|
|
||||||
return new ModifySuccess(probe);
|
|
||||||
})
|
|
||||||
.catch((error: RPCClientError) => {
|
|
||||||
return of(new ModifyFailure(error));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,54 +0,0 @@
|
||||||
import {
|
|
||||||
ActionType,
|
|
||||||
Actions,
|
|
||||||
} from './modify.action';
|
|
||||||
|
|
||||||
import {
|
|
||||||
State,
|
|
||||||
initialState,
|
|
||||||
} from './modify.state';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
export function reducer(state = initialState, action: Actions): State {
|
|
||||||
switch (action.type) {
|
|
||||||
case ActionType.Modify: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: null,
|
|
||||||
isPending: true,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.ModifySuccess: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
modifiedProbe: action.payload,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.ModifyFailure: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: action.payload,
|
|
||||||
isPending: false,
|
|
||||||
modifiedProbe: null,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.ModifyDisplayName: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: null,
|
|
||||||
isPending: true,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
default: {
|
|
||||||
return state;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
import { createEntityAdapter, EntityAdapter, EntityState } from '@ngrx/entity';
|
|
||||||
|
|
||||||
export interface State extends EntityState<Probe> {
|
|
||||||
error: RPCClientError | null;
|
|
||||||
isPending: boolean;
|
|
||||||
modifiedProbe: Probe | null;
|
|
||||||
}
|
|
||||||
export const adapter: EntityAdapter<Probe> = createEntityAdapter<Probe>();
|
|
||||||
export const initialState: State = adapter.getInitialState({
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
modifiedProbe: null,
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export * from './list.action';
|
|
||||||
export * from './list.effect';
|
|
||||||
export * from './list.reducer';
|
|
||||||
export * from './list.state';
|
|
||||||
|
|
@ -1,38 +0,0 @@
|
||||||
import { Action } from '@ngrx/store';
|
|
||||||
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
|
||||||
import { ProbeHost } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
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
|
|
||||||
;
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
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();
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
|
|
@ -1,51 +0,0 @@
|
||||||
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';
|
|
||||||
|
|
||||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
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));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,48 +0,0 @@
|
||||||
import {
|
|
||||||
ReadAllByDomain,
|
|
||||||
ReadAllByDomainFailure,
|
|
||||||
ReadAllByDomainSuccess,
|
|
||||||
ActionType,
|
|
||||||
Actions,
|
|
||||||
} from './list.action';
|
|
||||||
|
|
||||||
import {
|
|
||||||
State,
|
|
||||||
initialState,
|
|
||||||
} from './list.state';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { ProbeHost } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
export interface State {
|
|
||||||
error: RPCClientError | null;
|
|
||||||
isPending: boolean;
|
|
||||||
probeHosts: ProbeHost[] | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const initialState: State = {
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
probeHosts: null,
|
|
||||||
};
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export * from './probe-host.action';
|
|
||||||
export * from './probe-host.effect';
|
|
||||||
export * from './probe-host.reducer';
|
|
||||||
export * from './probe-host.state';
|
|
||||||
|
|
@ -1,37 +0,0 @@
|
||||||
import { Action } from '@ngrx/store';
|
|
||||||
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
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
|
|
||||||
;
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
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();
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
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';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
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));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
import {
|
|
||||||
ReadByProbe,
|
|
||||||
ReadByProbeFailure,
|
|
||||||
ReadByProbeSuccess,
|
|
||||||
ActionType,
|
|
||||||
Actions,
|
|
||||||
} from './probe-host.action';
|
|
||||||
|
|
||||||
import {
|
|
||||||
State,
|
|
||||||
initialState,
|
|
||||||
} from './probe-host.state';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import { ProbeHost } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
export interface State {
|
|
||||||
error: RPCClientError | null;
|
|
||||||
isPending: boolean;
|
|
||||||
probeHost: ProbeHost | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const initialState: State = {
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
probeHost: null,
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export * from './remove.action';
|
|
||||||
export * from './remove.effect';
|
|
||||||
export * from './remove.reducer';
|
|
||||||
export * from './remove.state';
|
|
||||||
|
|
@ -1,37 +0,0 @@
|
||||||
import { Action } from '@ngrx/store';
|
|
||||||
|
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
export enum ActionType {
|
|
||||||
Remove = '[probe.remove] Remove',
|
|
||||||
RemoveSuccess = '[probe.detail] RemoveSuccess',
|
|
||||||
RemoveFailure = '[probe.detail] RemoveFailure',
|
|
||||||
}
|
|
||||||
|
|
||||||
export class Remove implements Action {
|
|
||||||
readonly type = ActionType.Remove;
|
|
||||||
|
|
||||||
constructor(public payload: {id: string}) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class RemoveSuccess implements Action {
|
|
||||||
readonly type = ActionType.RemoveSuccess;
|
|
||||||
|
|
||||||
constructor(public payload: boolean) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class RemoveFailure implements Action {
|
|
||||||
readonly type = ActionType.RemoveFailure;
|
|
||||||
|
|
||||||
constructor(public payload: RPCClientError) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
export type Actions =
|
|
||||||
| Remove
|
|
||||||
| RemoveSuccess
|
|
||||||
| RemoveFailure
|
|
||||||
;
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { TestBed, inject } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { Effects } from './remove.effect';
|
|
||||||
|
|
||||||
describe('ProbeDetail.Effects', () => {
|
|
||||||
beforeEach(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
providers: [Effects]
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be created', inject([Effects], (effects: Effects) => {
|
|
||||||
expect(effects).toBeTruthy();
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
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';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
import { ProbeService } from '../../service/probe.service';
|
|
||||||
|
|
||||||
import {
|
|
||||||
Remove,
|
|
||||||
RemoveSuccess,
|
|
||||||
RemoveFailure,
|
|
||||||
ActionType
|
|
||||||
} from './remove.action';
|
|
||||||
|
|
||||||
@Injectable()
|
|
||||||
export class Effects {
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private actions$: Actions,
|
|
||||||
private probeService: ProbeService,
|
|
||||||
private router: Router
|
|
||||||
) { }
|
|
||||||
|
|
||||||
@Effect()
|
|
||||||
remove$: Observable<Action> = this.actions$
|
|
||||||
.ofType(ActionType.Remove)
|
|
||||||
.map((action: Remove) => action.payload)
|
|
||||||
.switchMap(payload => this.probeService.remove(payload.id))
|
|
||||||
.map(result => {
|
|
||||||
return new RemoveSuccess(result);
|
|
||||||
})
|
|
||||||
.catch((error: RPCClientError) => {
|
|
||||||
return of(new RemoveFailure(error));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
import {
|
|
||||||
Remove,
|
|
||||||
RemoveFailure,
|
|
||||||
RemoveSuccess,
|
|
||||||
ActionType,
|
|
||||||
Actions,
|
|
||||||
} from './remove.action';
|
|
||||||
|
|
||||||
import {
|
|
||||||
State,
|
|
||||||
initialState,
|
|
||||||
} from './remove.state';
|
|
||||||
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
|
|
||||||
export function reducer(state = initialState, action: Actions): State {
|
|
||||||
switch (action.type) {
|
|
||||||
case ActionType.Remove: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: null,
|
|
||||||
isPending: true,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.RemoveSuccess: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
succeed: action.payload,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
case ActionType.RemoveFailure: {
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
error: action.payload,
|
|
||||||
isPending: false,
|
|
||||||
succeed: false,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
default: {
|
|
||||||
return state;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
import { RPCClientError } from '@loafer/ng-rpc';
|
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
|
||||||
|
|
||||||
export interface State {
|
|
||||||
error: RPCClientError | null;
|
|
||||||
isPending: boolean;
|
|
||||||
succeed: boolean | null;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const initialState: State = {
|
|
||||||
error: null,
|
|
||||||
isPending: false,
|
|
||||||
succeed: null,
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { Component, OnDestroy } from '@angular/core';
|
import { Component, OnDestroy } from '@angular/core';
|
||||||
import { AppComponent } from '../../../../app.component';
|
import { AppComponent } from '../../../../app.component';
|
||||||
import { BreadcrumbService } from '../../../../commons/service/breadcrumb.service';
|
import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
|
||||||
import { Subscription } from 'rxjs/Subscription';
|
import { Subscription } from 'rxjs/Subscription';
|
||||||
import { MenuItem } from 'primeng/primeng';
|
import { MenuItem } from 'primeng/primeng';
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,10 @@ const routes: Routes = [
|
||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
component: DiscoveryPageComponent,
|
component: DiscoveryPageComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: ':probeHostID',
|
||||||
|
component: DiscoveryPageComponent,
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,8 @@
|
||||||
<div class="ui-g">
|
<div class="ui-g">
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<div class="card no-margin">
|
<div class="card no-margin">
|
||||||
<of-discovery></of-discovery>
|
<!--<of-discovery></of-discovery>-->
|
||||||
|
<of-discovery-container (hostID)="hostId"></of-discovery-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,5 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
import { ActivatedRoute } from '@angular/router';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-discovery-page',
|
selector: 'of-discovery-page',
|
||||||
|
|
@ -6,9 +7,16 @@ import { Component, OnInit } from '@angular/core';
|
||||||
})
|
})
|
||||||
export class DiscoveryPageComponent implements OnInit {
|
export class DiscoveryPageComponent implements OnInit {
|
||||||
|
|
||||||
|
hostId: number;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
|
private route: ActivatedRoute
|
||||||
) { }
|
) { }
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
|
this.route.params.subscribe((params: any) => {
|
||||||
|
this.hostId = params['probeHostID'];
|
||||||
|
// console.log('probeHostID : ' + probeHostID);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ const routes: Routes = [
|
||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
component: NotificationPageComponent,
|
component: NotificationPageComponent,
|
||||||
}
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<div class="ui-g">
|
<div class="ui-g">
|
||||||
<div class="ui-g-12">
|
<div class="ui-g-12">
|
||||||
<div class="card no-margin">
|
<div class="card no-margin">
|
||||||
<of-notification-container></of-notification-container>
|
<of-notification-container (pageChange)="onPageChange($event)"></of-notification-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { BreadcrumbService } from '../../commons/service/breadcrumb.service';
|
import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
|
||||||
|
import { Router } from '@angular/router';
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
|
@ -9,7 +10,8 @@ import { BreadcrumbService } from '../../commons/service/breadcrumb.service';
|
||||||
export class NotificationPageComponent implements OnInit {
|
export class NotificationPageComponent implements OnInit {
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private breadcrumbService: BreadcrumbService
|
private breadcrumbService: BreadcrumbService,
|
||||||
|
private router: Router
|
||||||
) {
|
) {
|
||||||
breadcrumbService.setItems([
|
breadcrumbService.setItems([
|
||||||
{ label: 'Notifications', routerLink: ['/notification'] },
|
{ label: 'Notifications', routerLink: ['/notification'] },
|
||||||
|
|
@ -19,4 +21,8 @@ export class NotificationPageComponent implements OnInit {
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onPageChange(pageNo: number) {
|
||||||
|
this.router.navigate(['/notification'], { queryParams: { page: pageNo } });
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -64,7 +64,6 @@ export class PagesComponent implements AfterViewInit, OnDestroy, OnInit {
|
||||||
|
|
||||||
constructor(public renderer: Renderer, public zone: NgZone, private router: Router, private breadcrumbService: BreadcrumbService) {
|
constructor(public renderer: Renderer, public zone: NgZone, private router: Router, private breadcrumbService: BreadcrumbService) {
|
||||||
router.events.subscribe((val) => {
|
router.events.subscribe((val) => {
|
||||||
console.log(val);
|
|
||||||
if (val instanceof NavigationStart) {
|
if (val instanceof NavigationStart) {
|
||||||
breadcrumbService.setItems(null);
|
breadcrumbService.setItems(null);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { Router, ActivatedRoute } from '@angular/router';
|
import { Router, ActivatedRoute } from '@angular/router';
|
||||||
import { BreadcrumbService } from '../../../commons/service/breadcrumb.service';
|
import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-pages-download',
|
selector: 'of-pages-download',
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { BreadcrumbService } from '../../../commons/service/breadcrumb.service';
|
import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-pages-noauth-probe',
|
selector: 'of-pages-noauth-probe',
|
||||||
|
|
|
||||||
|
|
@ -3,5 +3,8 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ng-template #detailView>
|
<ng-template #detailView>
|
||||||
<of-probe-detail-container (targetSelect)="onTargetSelect($event)"></of-probe-detail-container>
|
<of-probe-detail-container [probeHostID]="probeHostID"
|
||||||
|
(targetSelect)="onTargetSelect($event)"
|
||||||
|
(discovery)="onDiscovery($event)"
|
||||||
|
></of-probe-detail-container>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
@ -1,9 +1,9 @@
|
||||||
import { Component, OnDestroy } from '@angular/core';
|
import { Component, OnDestroy } from '@angular/core';
|
||||||
import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
|
import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
|
||||||
import { Subscription } from 'rxjs/Subscription';
|
import { Subscription } from 'rxjs/Subscription';
|
||||||
import { Probe } from '@overflow/commons-typescript/model/probe';
|
import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
|
||||||
import { Target } from '@overflow/commons-typescript/model/target';
|
import { Target } from '@overflow/commons-typescript/model/target';
|
||||||
import { BreadcrumbService } from '../../../commons/service/breadcrumb.service';
|
import { BreadcrumbService } from '@app/commons/service/breadcrumb.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'of-pages-probe',
|
selector: 'of-pages-probe',
|
||||||
|
|
@ -12,6 +12,7 @@ import { BreadcrumbService } from '../../../commons/service/breadcrumb.service';
|
||||||
export class ProbePageComponent {
|
export class ProbePageComponent {
|
||||||
|
|
||||||
private isDetail: boolean;
|
private isDetail: boolean;
|
||||||
|
private probeHostID: string;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private router: Router,
|
private router: Router,
|
||||||
|
|
@ -34,19 +35,24 @@ export class ProbePageComponent {
|
||||||
this.isDetail = false;
|
this.isDetail = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
onDetailContainer(probeId: string) {
|
onDetailContainer(probeHostID: string) {
|
||||||
|
this.probeHostID = probeHostID;
|
||||||
this.breadcrumbService.setItems([
|
this.breadcrumbService.setItems([
|
||||||
{ label: 'Probe', routerLink: ['/probe/list'] },
|
{ label: 'Probe', routerLink: ['/probe/list'] },
|
||||||
{ label: probeId }
|
{ label: this.probeHostID }
|
||||||
]);
|
]);
|
||||||
this.isDetail = true;
|
this.isDetail = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
onProbeSelect(probe: Probe) {
|
onProbeSelect(probeHost: ProbeHost) {
|
||||||
this.router.navigate(['probe', probe.id, 'info']);
|
this.router.navigate(['probe', probeHost.id, 'info']);
|
||||||
}
|
}
|
||||||
|
|
||||||
onTargetSelect(target: Target) {
|
onTargetSelect(target: Target) {
|
||||||
console.log(target);
|
console.log(target);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onDiscovery(probeHostID: number) {
|
||||||
|
this.router.navigate(['discovery', probeHostID]);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user