diff --git a/src/packages/sensor-item/component/index.ts b/src/packages/sensor-item/component/index.ts
index 2642cab..3b76d4f 100644
--- a/src/packages/sensor-item/component/index.ts
+++ b/src/packages/sensor-item/component/index.ts
@@ -1,5 +1,5 @@
-// import { ListComponent } from './list/list.component';
+import { ListComponent } from './list/list.component';
-// export const COMPONENTS = [
-// ListComponent,
-// ];
+export const COMPONENTS = [
+ ListComponent,
+];
diff --git a/src/packages/sensor-item/component/list/list.component.html b/src/packages/sensor-item/component/list/list.component.html
index bdc6b1f..f9049c2 100644
--- a/src/packages/sensor-item/component/list/list.component.html
+++ b/src/packages/sensor-item/component/list/list.component.html
@@ -1,45 +1,13 @@
-
-
-
-
- Name
- {{element.name}}
-
-
-
- IP
- {{element.ip}}
-
-
-
- OS
- {{element.os}}
-
-
-
- CIDR
- {{element.cidr}}
-
-
-
- Targets
- {{element.targetCnt}}
-
-
-
- Date
- {{element.date}}
-
-
-
- AuthBy
- {{element.authBy}}
-
-
-
-
-
-
-
-
-
\ No newline at end of file
+SensorItem List
+
+
+
+ {{rowIndex + 1}} |
+ {{sensor.Description}} |
+ {{sensor.status.name}} |
+ {{sensor.crawler.name}} |
+ ??? |
+ {{sensor.createDate | date: 'dd.MM.yyyy'}} |
+
+
+
\ No newline at end of file
diff --git a/src/packages/sensor-item/component/list/list.component.scss b/src/packages/sensor-item/component/list/list.component.scss
deleted file mode 100644
index 54b8a22..0000000
--- a/src/packages/sensor-item/component/list/list.component.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-.example-container {
- display: flex;
- flex-direction: column;
- min-width: 300px;
- }
-
- .mat-table {
- overflow: auto;
- max-height: 500px;
- }
-
- .mat-header-cell.mat-sort-header-sorted {
- color: black;
- }
\ No newline at end of file
diff --git a/src/packages/sensor-item/component/list/list.component.ts b/src/packages/sensor-item/component/list/list.component.ts
index c6a2a9e..93241e9 100644
--- a/src/packages/sensor-item/component/list/list.component.ts
+++ b/src/packages/sensor-item/component/list/list.component.ts
@@ -1,63 +1,32 @@
-// import { Component, OnInit, AfterViewInit, ViewChild } from '@angular/core';
-// import { MatTableDataSource, MatSort } from '@angular/material';
-// import { AfterContentInit } from '@angular/core/src/metadata/lifecycle_hooks';
-// import { Router } from '@angular/router';
+import { Component, OnInit, AfterViewInit, AfterContentInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { MetaSensorDisplayItem } from '../../../meta/sensor-display-item/model/MetaSensorDisplayItem';
-// export interface Probe {
-// id: string;
-// name: string;
-// ip: string;
-// os: string;
-// cidr: string;
-// targetCnt: number;
-// date: string;
-// authBy: string;
-// }
+export interface Probe {
+ id: string;
+ name: string;
+ ip: string;
+ os: string;
+ cidr: string;
+ targetCnt: number;
+ date: string;
+ authBy: string;
+}
-// @Component({
-// selector: 'of-sensor-item-list',
-// templateUrl: './list.component.html',
-// styleUrls: ['./list.component.scss']
-// })
-// export class ListComponent implements OnInit, AfterContentInit {
+@Component({
+ selector: 'of-sensor-item-list',
+ templateUrl: './list.component.html',
+})
+export class ListComponent implements OnInit, AfterContentInit {
-// displayedColumns = ['name', 'ip', 'os', 'cidr', 'targetCnt', 'date', 'authBy'];
-// dataSource: MatTableDataSource;
-// @ViewChild(MatSort) sort: MatSort;
+ sensorItems: MetaSensorDisplayItem[];
+ ngAfterContentInit() {
+ }
-// /**
-// * Set the sort after the view init since this component will
-// * be able to query its view for the initialized sort.
-// */
-// ngAfterContentInit() {
-// // temporary data
-// const data: Probe[] = new Array();
-// for (let i = 0; i < 10; i++) {
-// const p: Probe = {
-// id: String('id' + i),
-// name: String('name' + i),
-// ip: String('ip' + i),
-// os: String('os' + i),
-// cidr: String('cidr' + i),
-// targetCnt: i,
-// date: String('date' + i),
-// authBy: String('insanity')
-// };
-// data.push(p);
-// }
+ constructor(private router: Router) { }
-// this.dataSource = new MatTableDataSource(data);
-// this.dataSource.sort = this.sort;
-// }
-
-// constructor(private router: Router) { }
-
-// ngOnInit() {
-// }
-
-// handleRowClick(obj: Probe) {
-// this.router.navigate(['probe', obj.id]);
-// }
-// }
+ ngOnInit() {
+ }
+}
diff --git a/src/packages/sensor-item/sensor-item.module.ts b/src/packages/sensor-item/sensor-item.module.ts
index 35ed9b0..8f83309 100644
--- a/src/packages/sensor-item/sensor-item.module.ts
+++ b/src/packages/sensor-item/sensor-item.module.ts
@@ -1,25 +1,24 @@
-// import { NgModule } from '@angular/core';
-// import { CommonModule } from '@angular/common';
-// import { MaterialModule } from 'packages/commons/material/material.module';
-// import { COMPONENTS } from './component';
-// import { SensorItemStoreModule } from './sensor-item-store.module';
-// import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-display-item.module';
-// import { SERVICES } from './service';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { COMPONENTS } from './component';
+import { SensorItemStoreModule } from './sensor-item-store.module';
+import { SERVICES } from './service';
+import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
-// @NgModule({
-// imports: [
-// CommonModule,
-// MaterialModule,
-// SensorItemStoreModule,
-// ],
-// declarations: [
-// COMPONENTS,
-// ],
-// exports: [
-// COMPONENTS,
-// ],
-// providers: [
-// SERVICES,
-// ],
-// })
-// export class SensorItemModule { }
+@NgModule({
+ imports: [
+ CommonModule,
+ SensorItemStoreModule,
+ PrimeNGModules,
+ ],
+ declarations: [
+ COMPONENTS,
+ ],
+ exports: [
+ COMPONENTS,
+ ],
+ providers: [
+ SERVICES,
+ ],
+})
+export class SensorItemModule { }
diff --git a/src/packages/sensor/component/detail/detail.component.html b/src/packages/sensor/component/detail/detail.component.html
index 7592354..0b00084 100644
--- a/src/packages/sensor/component/detail/detail.component.html
+++ b/src/packages/sensor/component/detail/detail.component.html
@@ -1 +1,72 @@
-Sensor Detail
\ No newline at end of file
+Sensor Alias 출력
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Monitored Items
+
+
+
+
+
\ No newline at end of file
diff --git a/src/packages/sensor/component/detail/detail.component.scss b/src/packages/sensor/component/detail/detail.component.scss
deleted file mode 100644
index e69de29..0000000
diff --git a/src/packages/sensor/component/detail/detail.component.ts b/src/packages/sensor/component/detail/detail.component.ts
index 42ffd10..7e0c491 100644
--- a/src/packages/sensor/component/detail/detail.component.ts
+++ b/src/packages/sensor/component/detail/detail.component.ts
@@ -1,19 +1,65 @@
-import { Component, OnInit, Inject } from '@angular/core';
+import { Component, OnInit, Inject, AfterContentInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
+import { ConfirmationService } from 'primeng/primeng';
+import { Store, select } from '@ngrx/store';
+import { RPCClientError } from '@loafer/ng-rpc/protocol';
+import * as DetailStore from '../../store/detail';
+import { sensorSelector } from '../../store';
+import { Sensor } from '../../model';
@Component({
selector: 'of-sensor-detail',
templateUrl: './detail.component.html',
- styleUrls: ['./detail.component.scss']
+ providers: [ConfirmationService]
})
-export class DetailComponent implements OnInit {
+export class DetailComponent implements OnInit, AfterContentInit {
+
+ sensor$ = this.detailStore.pipe(select(sensorSelector.select('sensor')));
+ sensor: Sensor;
constructor(
private route: ActivatedRoute,
private router: Router,
+ private confirmationService: ConfirmationService,
+ private detailStore: Store,
) { }
ngOnInit() {
+ this.sensor$.subscribe(
+ (sensor: Sensor) => {
+ console.log(sensor);
+ this.sensor = sensor;
+ },
+ (error: RPCClientError) => {
+ console.log(error.response.message);
+ }
+ );
+ }
+
+ ngAfterContentInit() {
+ const sensorId = this.route.snapshot.paramMap.get('id');
+ this.detailStore.dispatch(
+ new DetailStore.Read(
+ { id: sensorId }
+ )
+ );
+ }
+
+ onStartOrStop() { }
+
+ onEdit() { }
+
+ onRemove() {
+ this.confirmationService.confirm({
+ header: 'Are you sure to remove this Sensor?',
+ icon: 'fa fa-trash',
+ message: 'All the related data will be deleted. ',
+ accept: () => {
+ alert('으앙 안돼 지우지마ㅠㅠ');
+ },
+ reject: () => {
+ }
+ });
}
}
diff --git a/src/packages/sensor/component/name-tag/name-tag.component.html b/src/packages/sensor/component/name-tag/name-tag.component.html
deleted file mode 100644
index dbea0e5..0000000
--- a/src/packages/sensor/component/name-tag/name-tag.component.html
+++ /dev/null
@@ -1,5 +0,0 @@
-
-
- {{sensor.description}}
-
-
\ No newline at end of file
diff --git a/src/packages/sensor/component/name-tag/name-tag.component.scss b/src/packages/sensor/component/name-tag/name-tag.component.scss
deleted file mode 100644
index e69de29..0000000
diff --git a/src/packages/sensor/component/name-tag/name-tag.component.spec.ts b/src/packages/sensor/component/name-tag/name-tag.component.spec.ts
deleted file mode 100644
index e69de29..0000000
diff --git a/src/packages/sensor/component/name-tag/name-tag.component.ts b/src/packages/sensor/component/name-tag/name-tag.component.ts
deleted file mode 100644
index aec80eb..0000000
--- a/src/packages/sensor/component/name-tag/name-tag.component.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-// import { Component, OnInit, AfterViewInit, ViewChild, Input } from '@angular/core';
-// import { MatTableDataSource, MatSort, MatDialog } from '@angular/material';
-// import { AfterContentInit } from '@angular/core/src/metadata/lifecycle_hooks';
-// import { Router } from '@angular/router';
-// import { Sensor } from '../../model';
-
-// import { Store, select } from '@ngrx/store';
-
-// import * as SensorStore from '../../store';
-
-// import { RPCClientError } from '@loafer/ng-rpc/protocol';
-// import * as ListStore from '../../store/list';
-// import { sensorListSelector } from '../../store';
-// import { Page, PageParams } from 'app/commons/model';
-// import { Target } from 'packages/target/model';
-
-// @Component({
-// selector: 'of-sensor-name-tag',
-// templateUrl: './name-tag.component.html',
-// styleUrls: ['./name-tag.component.scss']
-// })
-// export class NameTagComponent implements OnInit, AfterContentInit {
-
-// sensorList$ = this.store.pipe(select(sensorListSelector.select('page')));
-// sensors: Sensor[];
-// @Input() target: Target;
-
-// constructor(private router: Router,
-// private store: Store,
-// private dialog: MatDialog,
-// ) { }
-
-// ngOnInit() {
-// this.sensorList$.subscribe(
-// (page: Page) => {
-// if (page != null) {
-// this.sensors = page.content;
-// }
-// },
-// (error: RPCClientError) => {
-// console.log(error.response.message);
-// }
-// );
-// }
-
-// ngAfterContentInit() {
-// this.getSensors(0);
-// }
-
-// getSensors(pageIndex: number) {
-// const pageParams: PageParams = {
-// pageNo: pageIndex + '',
-// countPerPage: '9999',
-// sortCol: 'id',
-// sortDirection: 'descending'
-// };
-// this.store.dispatch(new ListStore.ReadAllByTarget({ target: this.target, pageParams }));
-// }
-// }
diff --git a/src/packages/sensor/sensor.module.ts b/src/packages/sensor/sensor.module.ts
index 493b5ba..3a17a56 100644
--- a/src/packages/sensor/sensor.module.ts
+++ b/src/packages/sensor/sensor.module.ts
@@ -5,9 +5,9 @@ import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
import { COMPONENTS } from './component';
import { SERVICES } from './service';
import { SensorStoreModule } from './sensor-store.module';
+import { SensorItemModule } from '../sensor-item/sensor-item.module';
// import { MetaCrawlerModule } from '../meta/crawler/crawler.module';
// import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-display-item.module';
-// import { SensorItemModule } from '../sensor-item/sensor-item.module';
// import { MetaCrawlerInputItemModule } from '../meta/crawler-input-item/crawler-input.module';
@NgModule({
@@ -16,7 +16,7 @@ import { SensorStoreModule } from './sensor-store.module';
FormsModule,
SensorStoreModule,
PrimeNGModules,
- // SensorItemModule,
+ SensorItemModule
// MetaCrawlerModule,
// MetaSensorDisplayItemModule,
],
diff --git a/src/packages/sensor/service/sensor.service.ts b/src/packages/sensor/service/sensor.service.ts
index 15c41ab..1987b1b 100644
--- a/src/packages/sensor/service/sensor.service.ts
+++ b/src/packages/sensor/service/sensor.service.ts
@@ -36,4 +36,8 @@ export class SensorService {
public readAllByTarget(target: Target, pageParams: PageParams): Observable {
return this.rpcService.call('SensorService.readAllByTarget', target, pageParams);
}
+
+ public read(id: string): Observable {
+ return this.rpcService.call('SensorService.read', id);
+ }
}
diff --git a/src/packages/sensor/store/detail/detail.action.ts b/src/packages/sensor/store/detail/detail.action.ts
new file mode 100644
index 0000000..bf5550c
--- /dev/null
+++ b/src/packages/sensor/store/detail/detail.action.ts
@@ -0,0 +1,37 @@
+import { Action } from '@ngrx/store';
+
+import { RPCClientError } from '@loafer/ng-rpc/protocol';
+
+import { Sensor } from '../../model';
+
+
+export enum ActionType {
+ Read = '[sensor.detail] Read',
+ ReadSuccess = '[sensor.detail] ReadSuccess',
+ ReadFailure = '[sensor.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: Sensor) {}
+}
+
+export class ReadFailure implements Action {
+ readonly type = ActionType.ReadFailure;
+
+ constructor(public payload: RPCClientError) {}
+}
+
+
+export type Actions =
+ | Read
+ | ReadSuccess
+ | ReadFailure
+;
diff --git a/src/packages/sensor/store/detail/detail.effect.spec.ts b/src/packages/sensor/store/detail/detail.effect.spec.ts
new file mode 100644
index 0000000..b1c2217
--- /dev/null
+++ b/src/packages/sensor/store/detail/detail.effect.spec.ts
@@ -0,0 +1,15 @@
+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();
+ }));
+});
diff --git a/src/packages/sensor/store/detail/detail.effect.ts b/src/packages/sensor/store/detail/detail.effect.ts
new file mode 100644
index 0000000..22a3e71
--- /dev/null
+++ b/src/packages/sensor/store/detail/detail.effect.ts
@@ -0,0 +1,49 @@
+import { Injectable } from '@angular/core';
+import { Router } from '@angular/router';
+
+import { Effect, Actions, ofType } from '@ngrx/effects';
+import { Action } from '@ngrx/store';
+
+import { Observable } from 'rxjs/Observable';
+import { of } from 'rxjs/observable/of';
+
+import 'rxjs/add/operator/catch';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/exhaustMap';
+import 'rxjs/add/operator/switchMap';
+import 'rxjs/add/operator/map';
+import 'rxjs/add/operator/take';
+
+import { RPCClientError } from '@loafer/ng-rpc/protocol';
+
+import { Sensor } from '../../model';
+import { SensorService } from '../../service/sensor.service';
+
+import {
+ Read,
+ ReadFailure,
+ ReadSuccess,
+ ActionType
+} from './detail.action';
+
+@Injectable()
+export class Effects {
+
+ constructor(
+ private actions$: Actions,
+ private sensorService: SensorService,
+ private router: Router
+ ) { }
+
+ @Effect()
+ read$: Observable = this.actions$
+ .ofType(ActionType.Read)
+ .map((action: Read) => action.payload)
+ .switchMap(payload => this.sensorService.read(payload.id))
+ .map(sensor => {
+ return new ReadSuccess(sensor);
+ })
+ .catch((error: RPCClientError) => {
+ return of(new ReadFailure(error));
+ });
+}
diff --git a/src/packages/sensor/store/detail/detail.reducer.ts b/src/packages/sensor/store/detail/detail.reducer.ts
new file mode 100644
index 0000000..e2ac411
--- /dev/null
+++ b/src/packages/sensor/store/detail/detail.reducer.ts
@@ -0,0 +1,49 @@
+import {
+ Read,
+ ReadFailure,
+ ReadSuccess,
+ ActionType,
+ Actions,
+} from './detail.action';
+
+import {
+ State,
+ initialState,
+} from './detail.state';
+
+import { Sensor } from '../../model';
+
+
+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,
+ sensor: action.payload,
+ };
+ }
+
+ case ActionType.ReadFailure: {
+ return {
+ ...state,
+ error: action.payload,
+ isPending: false,
+ sensor: null,
+ };
+ }
+
+ default: {
+ return state;
+ }
+ }
+}
diff --git a/src/packages/sensor/store/detail/detail.state.ts b/src/packages/sensor/store/detail/detail.state.ts
new file mode 100644
index 0000000..6d846eb
--- /dev/null
+++ b/src/packages/sensor/store/detail/detail.state.ts
@@ -0,0 +1,15 @@
+import { RPCClientError } from '@loafer/ng-rpc/protocol';
+import { Sensor } from '../../model';
+import { createEntityAdapter, EntityAdapter, EntityState } from '@ngrx/entity';
+
+export interface State extends EntityState {
+ error: RPCClientError | null;
+ isPending: boolean;
+ sensor: Sensor | null;
+}
+export const adapter: EntityAdapter = createEntityAdapter();
+export const initialState: State = adapter.getInitialState({
+ error: null,
+ isPending: false,
+ sensor: null,
+});
diff --git a/src/packages/sensor/store/detail/index.ts b/src/packages/sensor/store/detail/index.ts
new file mode 100644
index 0000000..23ae8ab
--- /dev/null
+++ b/src/packages/sensor/store/detail/index.ts
@@ -0,0 +1,4 @@
+export * from './detail.action';
+export * from './detail.effect';
+export * from './detail.reducer';
+export * from './detail.state';
diff --git a/src/packages/sensor/store/index.ts b/src/packages/sensor/store/index.ts
index 69c4705..b983318 100644
--- a/src/packages/sensor/store/index.ts
+++ b/src/packages/sensor/store/index.ts
@@ -9,21 +9,21 @@ import { StateSelector } from 'packages/core/ngrx/store';
import { MODULE } from '../sensor.constant';
import * as ListStore from './list';
-import * as RegistStore from './regist';
+import * as DetailStore from './detail';
export interface State {
list: ListStore.State;
- sensor: RegistStore.State;
+ sensor: DetailStore.State;
}
export const REDUCERS = {
list: ListStore.reducer,
- sensor: RegistStore.reducer,
+ sensor: DetailStore.reducer,
};
export const EFFECTS = [
ListStore.Effects,
- RegistStore.Effects,
+ DetailStore.Effects,
];
export const sensorState = createFeatureSelector(MODULE.name);
@@ -32,7 +32,7 @@ export const sensorListSelector = new StateSelector(createSelec
sensorState,
(state: State) => state.list
));
-export const sensorSelector = new StateSelector(createSelector(
+export const sensorSelector = new StateSelector(createSelector(
sensorState,
(state: State) => state.sensor
));