Merge branch 'master' of https://git.loafle.net/overflow/member_webapp
This commit is contained in:
commit
5330179781
|
@ -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 {
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
|
|
|
@ -28,7 +28,6 @@ export class ListComponent implements OnInit, AfterContentInit {
|
|||
ngOnInit() {
|
||||
this.probes$.subscribe(
|
||||
(probes: Probe[]) => {
|
||||
console.log(probes);
|
||||
this.probes = probes;
|
||||
},
|
||||
(error: RPCClientError) => {
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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,
|
||||
|
|
Loading…
Reference in New Issue
Block a user