This commit is contained in:
snoop 2018-04-16 20:23:47 +09:00
commit 5330179781
10 changed files with 150 additions and 51 deletions

View File

@ -6,9 +6,9 @@ import 'rxjs/add/operator/map';
import { RPCService } from '@loafer/ng-rpc/service';
import { Infra } from '../model';
import { Page, PageParams } from '../../../app/commons/model';
import { Domain } from '../../domain/model';
import { Probe } from '../../probe/model';
import { Page, PageParams } from 'app/commons/model';
import { Domain } from 'packages/domain/model';
import { Probe } from 'packages/probe/model';
@Injectable()
export class InfraService {

View File

@ -7,8 +7,7 @@ import {
import { MODULE } from '../infra.constant';
import * as ListStore from './list';
import { StateSelector } from '../../core/ngrx/store';
import { StateSelector } from 'packages/core/ngrx/store';
export interface State {
list: ListStore.State;

View File

@ -32,6 +32,32 @@ export function reducer(state = initialState, action: Actions): State {
};
}
case ActionType.ReadAllByProbe: {
return {
...state,
error: null,
isPending: true,
};
}
case ActionType.ReadAllByProbeSuccess: {
return {
...state,
error: null,
isPending: false,
page: action.payload
};
}
case ActionType.ReadAllByProbeFailure: {
return {
...state,
error: action.payload,
isPending: false,
page: null
};
}
default: {
return state;
}

View File

@ -1,12 +1,7 @@
import {
createSelector,
MemoizedSelector,
} from '@ngrx/store';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { Infra } from '../../model';
import { Page } from '../../../../app/commons/model';
import { Page } from 'app/commons/model';
export interface State {
error: RPCClientError | null;
@ -20,11 +15,3 @@ export const initialState: State = {
page: null,
};
export class StateSelector {
public constructor(private _selector: MemoizedSelector<any, any>) {
}
public getInfraList = createSelector(this._selector, (state: State) => state.page);
public getError = createSelector(this._selector, (state: State) => state.error);
public isPending = createSelector(this._selector, (state: State) => state.isPending);
}

View File

@ -28,7 +28,6 @@ export class ListComponent implements OnInit, AfterContentInit {
ngOnInit() {
this.probes$.subscribe(
(probes: Probe[]) => {
console.log(probes);
this.probes = probes;
},
(error: RPCClientError) => {

View File

@ -13,7 +13,3 @@ export const initialState: State = {
isPending: false,
probes: null,
};
export const getProbes = (state: State) => state.probes;
export const getError = (state: State) => state.error;
export const isPending = (state: State) => state.isPending;

View File

@ -1,9 +1,9 @@
<div *ngIf="!preTarget">
<div *ngIf="preTarget === null">
<p-orderList [value]="targets" [listStyle]="{'height':'200px'}" [responsive]="true" filterBy="displayName" (onSelectionChange)="onSelectionChange($event)">
<ng-template let-target pTemplate="item">
<div class="ui-helper-clearfix">
<img src="assets/demo/images/car/BMW.gif" style="display:inline-block;margin:2px 0 2px 2px" />
<div style="font-size:14px;float:right;margin:15px 5px 0 0">{{target.displayName}}</div>
<div style="font-size:14px;float:right;margin:15px 5px 0 0">{{ target.displayName }}</div>
</div>
</ng-template>
</p-orderList>

View File

@ -1,5 +1,5 @@
<h1>Targets</h1>
<p-table [value]="targets" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
<p-table [value]="infras" selectionMode="single" (onRowSelect)="onRowSelect($event)" [resizableColumns]="true">
<ng-template pTemplate="header">
<tr>
<th>No.</th>
@ -11,7 +11,7 @@
<th></th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-probe let-rowIndex="rowIndex">
<ng-template pTemplate="body" let-infra let-rowIndex="rowIndex">
<tr [pSelectableRow]="infra">
<td>{{rowIndex}}</td>
<td>??</td>
@ -20,8 +20,12 @@
<td>??</td>
<td>{{infra.createDate | date: 'dd.MM.yyyy'}}</td>
<td>
<button type="button" label="Add Sensor" icon="ui-icon-add" pButton (click)="onAddSensorWithTarget()"></button>
<button type="button" label="Add Sensor" icon="ui-icon-add" pButton (click)="onAddSensor(infra.target)"></button>
</td>
</tr>
</ng-template>
</p-table>
</p-table>
<p-dialog [modal]="true" [width]="800" [(visible)]="sensorSettingDisplay" [showHeader]="false" [closeOnEscape]="false">
<of-sensor-setting [visible]="sensorSettingDisplay" [preTarget]="target" (close)="onSensorSettingClose()"></of-sensor-setting>
</p-dialog>

View File

@ -3,50 +3,136 @@ import { Router, ActivatedRoute } from '@angular/router';
import { Infra } from 'packages/infra/model';
import { Store, select } from '@ngrx/store';
import { ListSelector } from 'packages/infra/store';
import * as ListStore from 'packages/infra/store/list';
import { Page } from 'app/commons/model';
import * as InfraListStore from 'packages/infra/store/list';
import { Page, PageParams } from 'app/commons/model';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { Probe } from 'packages/probe/model';
import * as ProbeDetailStore from 'packages/probe/store/detail';
import { DetailSelector as ProbeDetailSelector } from 'packages/probe/store';
import { Target } from '../../model';
@Component({
selector: 'of-target-list',
templateUrl: './list.component.html',
})
export class ListComponent implements OnInit, AfterContentInit {
infras$ = this.store.pipe(select(ListSelector.select('page')));
probe$ = this.probeDetailStore.pipe(select(ProbeDetailSelector.select('probe')));
infras$ = this.infraListStore.pipe(select(ListSelector.select('page')));
infras: Infra[];
probe: Probe;
target: Target = null;
sensorSettingDisplay = false;
constructor(
private route: ActivatedRoute,
private router: Router,
private store: Store<ListStore.State>
private infraListStore: Store<InfraListStore.State>,
private probeDetailStore: Store<ProbeDetailStore.State>,
) {
console.log('PROBE ID: ' + this.route.snapshot.paramMap.get('id'));
this.getProbe();
}
ngOnInit() {
this.infras$.subscribe(
(page: Page) => {
if (page) {
this.infras = page.content;
}
},
(error: RPCClientError) => {
console.log(error.response.message);
}
);
// this.probe$.subscribe(
// (probe: Probe) => {
// if (probe) {
// console.log(probe);
// this.probe = probe;
// this.getInfras(probe);
// }
// },
// (error: RPCClientError) => {
// console.log(error.response.message);
// }
// );
// this.infras$.subscribe(
// (page: Page) => {
// if (!page) {
// return;
// }
// this.infras = page.content;
// },
// (error: RPCClientError) => {
// console.log(error);
// }
// );
}
ngAfterContentInit() {
// if (this.probe) {
// this.store.dispatch(new ListStore.ReadAllByProbe(this.probe));
// }
const probeId = this.route.snapshot.paramMap.get('id');
this.getProbe(probeId);
// Temporary
const infra1 = {
id: 1,
infraType: {
id: 1
},
target: {
id: 1,
displayName: 'FakeTarget1',
},
};
const infra2 = {
id: 2,
infraType: {
id: 3
},
target: {
id: 2,
displayName: 'FakeTarget2',
},
};
const infra3 = {
id: 3,
infraType: {
id: 2
},
target: {
id: 3,
displayName: 'FakeTarget3',
},
};
this.infras = [];
this.infras.push(infra1);
this.infras.push(infra2);
this.infras.push(infra3);
}
getProbe() {
getProbe(probeId: string) {
this.probeDetailStore.dispatch(
new ProbeDetailStore.Read(
{ id: probeId }
)
);
}
getInfras(probe) {
const pageParams: PageParams = {
pageNo: '0',
countPerPage: '10',
sortCol: 'id',
sortDirection: 'descending'
};
this.infraListStore.dispatch(
new InfraListStore.ReadAllByProbe(
{ probe, pageParams }
)
);
}
onRowSelect(event) {
console.log(event.data);
}
onAddSensor(target: Target) {
this.target = target;
this.sensorSettingDisplay = true;
}
onSensorSettingClose() {
this.sensorSettingDisplay = false;
}
}

View File

@ -4,11 +4,13 @@ import { CommonModule } from '@angular/common';
import { COMPONENTS } from './component';
import { SERVICES } from './service';
import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
import { SensorModule } from '../sensor/sensor.module';
@NgModule({
imports: [
CommonModule,
PrimeNGModules
PrimeNGModules,
SensorModule
],
declarations: [
COMPONENTS,