diff --git a/src/app/commons/component/layout/tabbar/app.tabbar.component.html b/src/app/commons/component/layout/tabbar/app.tabbar.component.html index e207c83..cd724c1 100644 --- a/src/app/commons/component/layout/tabbar/app.tabbar.component.html +++ b/src/app/commons/component/layout/tabbar/app.tabbar.component.html @@ -1,4 +1,5 @@ - + + \ No newline at end of file diff --git a/src/app/pages/probe/probe-page-routing.module.ts b/src/app/pages/probe/probe-page-routing.module.ts index fd231a3..8b21c97 100644 --- a/src/app/pages/probe/probe-page-routing.module.ts +++ b/src/app/pages/probe/probe-page-routing.module.ts @@ -1,7 +1,7 @@ import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import { ProbePageComponent } from './probe-page.component'; -// import { DetailComponent as ProbeDetailComponent } from 'packages/probe/component/detail/detail.component'; +import { DetailComponent as ProbeDetailComponent } from 'packages/probe/component/detail/detail.component'; // import { ListComponent as TargetListComponent } from 'packages/target/component/list/list.component'; const routes: Routes = [ @@ -9,7 +9,7 @@ const routes: Routes = [ path: '', component: ProbePageComponent, children: [ - // { path: ':id', component: ProbeDetailComponent }, + { path: ':id', component: ProbeDetailComponent }, // { path: ':id/targets', loadChildren: 'app/pages/targets/targets-page.module#TargetsPageModule'}, // { path: ':id/history', component: null }, ] diff --git a/src/app/pages/probe/probe-page.component.html b/src/app/pages/probe/probe-page.component.html index 6d83440..a21e96a 100644 --- a/src/app/pages/probe/probe-page.component.html +++ b/src/app/pages/probe/probe-page.component.html @@ -1,7 +1,3 @@
- -
- -
\ No newline at end of file diff --git a/src/app/pages/probe/probe-page.component.ts b/src/app/pages/probe/probe-page.component.ts index 6548a62..2ce47b2 100644 --- a/src/app/pages/probe/probe-page.component.ts +++ b/src/app/pages/probe/probe-page.component.ts @@ -13,13 +13,12 @@ export class ProbePageComponent implements OnInit { } ngOnInit() { - // const id = this.router.url.split('probe/')[1].split('/')[0]; - const id = '1'; + const id = this.router.url.split('probe/')[1].split('/')[0]; this.tabs = [ - { label: 'Info', path: '/probe/' + id, icon: 'fa-check' }, + { label: 'Probe Info', path: '/probe/' + id, icon: 'fa-check' }, { label: 'Targets', path: '/probe/' + id + '/targets', icon: 'fa-check' }, - { label: 'History', path: '/probe/' + id + '/history', icon: 'fa-check' }, + { label: 'History', path: '/probe/' + id + '/history', icon: 'fa-check', disabled: true }, ]; } diff --git a/src/app/pages/probe/probe-page.module.ts b/src/app/pages/probe/probe-page.module.ts index cf0f9ef..1ab87c5 100644 --- a/src/app/pages/probe/probe-page.module.ts +++ b/src/app/pages/probe/probe-page.module.ts @@ -6,13 +6,14 @@ import { ProbePageComponent } from './probe-page.component'; import { ProbePageRoutingModule } from './probe-page-routing.module'; import { TabbarComponent } from 'app/commons/component/layout/tabbar/app.tabbar.component'; import { PrimeNGModules } from 'packages/commons/prime-ng/prime-ng.module'; +import { ProbeModule } from 'packages/probe/probe.module'; @NgModule({ imports: [ CommonModule, ProbePageRoutingModule, - PrimeNGModules - // ProbeModule, + PrimeNGModules, + ProbeModule, ], declarations: [ ProbePageComponent, diff --git a/src/packages/probe/component/detail/detail.component.html b/src/packages/probe/component/detail/detail.component.html index 7188fe0..f1033b1 100644 --- a/src/packages/probe/component/detail/detail.component.html +++ b/src/packages/probe/component/detail/detail.component.html @@ -1,4 +1,6 @@ -
+
probe detail info
+ + \ No newline at end of file diff --git a/src/packages/probe/component/detail/detail.component.ts b/src/packages/probe/component/detail/detail.component.ts index 1f76816..c2ec8b3 100644 --- a/src/packages/probe/component/detail/detail.component.ts +++ b/src/packages/probe/component/detail/detail.component.ts @@ -1,156 +1,155 @@ -// import { Component, OnInit, Inject, AfterContentInit } from '@angular/core'; -// import { ActivatedRoute, Router } from '@angular/router'; -// import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; -// import { Store, select } from '@ngrx/store'; +import { Component, OnInit, Inject, AfterContentInit } from '@angular/core'; +import { ActivatedRoute, Router } from '@angular/router'; +import { Store, select } from '@ngrx/store'; -// import { RPCClientError } from '@loafer/ng-rpc/protocol'; +import { RPCClientError } from '@loafer/ng-rpc/protocol'; -// import * as DetailStore from '../../store/detail'; -// import { DetailSelector } from '../../store'; -// import { Probe } from '../../model'; +import * as DetailStore from '../../store/detail'; +import { DetailSelector } from '../../store'; +import { Probe } from '../../model'; // import { SettingComponent as DiscoverySettingComponent } from 'packages/discovery/component/setting/setting.component'; -// import * as CIDR from 'ip-cidr'; +import * as CIDR from 'ip-cidr'; -// @Component({ -// selector: 'of-probe-detail', -// templateUrl: './detail.component.html', -// styleUrls: ['./detail.component.scss'] -// }) -// export class DetailComponent implements OnInit, AfterContentInit { +@Component({ + selector: 'of-probe-detail', + templateUrl: './detail.component.html', + styleUrls: ['./detail.component.scss'] +}) +export class DetailComponent implements OnInit, AfterContentInit { -// probe$ = this.detailStore.pipe(select(DetailSelector.select('probe'))); -// probe: Probe = null; -// networkInfo = null; -// deviceInfo = null; -// probeInfo = null; + probe$ = this.detailStore.pipe(select(DetailSelector.select('probe'))); + probe: Probe = null; + networkInfo = null; + deviceInfo = null; + probeInfo = null; -// constructor( -// private route: ActivatedRoute, -// private router: Router, -// public dialog: MatDialog, -// private detailStore: Store -// ) { } + constructor( + private route: ActivatedRoute, + private router: Router, + // public dialog: MatDialog, + private detailStore: Store + ) { } -// ngOnInit() { -// this.probe$.subscribe( -// (probe: Probe) => { -// if (probe != null) { -// this.probe = probe; -// console.log(probe); -// this.arrangeInfo(); -// } -// }, -// (error: RPCClientError) => { -// console.log(error.response.message); -// } -// ); -// } + ngOnInit() { + this.probe$.subscribe( + (probe: Probe) => { + if (probe != null) { + this.probe = probe; + console.log(probe); + this.arrangeInfo(); + } + }, + (error: RPCClientError) => { + console.log(error.response.message); + } + ); + } -// ngAfterContentInit() { -// const probeId = this.route.snapshot.paramMap.get('id'); -// this.detailStore.dispatch( -// new DetailStore.Read( -// { id: probeId } -// ) -// ); -// } + ngAfterContentInit() { + const probeId = this.route.snapshot.paramMap.get('id'); + this.detailStore.dispatch( + new DetailStore.Read( + { id: probeId } + ) + ); + } -// arrangeInfo() { + arrangeInfo() { -// const cidr = new CIDR(this.probe.cidr); -// if (!cidr.isValid()) { -// } -// const startIP = cidr.addressStart.address; -// const endIP = cidr.addressEnd.address; + const cidr = new CIDR(this.probe.cidr); + if (!cidr.isValid()) { + } + const startIP = cidr.addressStart.address; + const endIP = cidr.addressEnd.address; -// this.networkInfo = [ -// { -// key: 'Probe IP Range', -// value: startIP + '~' + endIP, -// }, -// { -// key: 'Installed IP', -// value: '???', -// }, -// { -// key: 'NIC', -// value: '???' -// }, -// { -// key: 'Targets', -// value: 'count 반정규화 필요 ' -// }, -// ]; -// this.deviceInfo = [ -// { -// key: 'OS', -// value: 'Linux' -// }, -// { -// key: 'CPU', -// value: 'intel7...' -// }, -// { -// key: 'Memory', -// value: '16GB' -// }, -// { -// key: '...', -// value: '...' -// }, -// ]; -// this.probeInfo = [ -// { -// key: 'Authorized at', -// value: String(new Date(this.probe.authorizeDate)) -// }, -// { -// key: 'Authorized by', -// value: 'insanity' -// }, -// { -// key: 'Installed at', -// value: String(new Date(this.probe.createDate)) -// }, -// { -// key: 'Probe Key', -// value: this.probe.probeKey, -// }, -// ]; -// } + this.networkInfo = [ + { + key: 'Probe IP Range', + value: startIP + '~' + endIP, + }, + { + key: 'Installed IP', + value: '???', + }, + { + key: 'NIC', + value: '???' + }, + { + key: 'Targets', + value: 'count 반정규화 필요 ' + }, + ]; + this.deviceInfo = [ + { + key: 'OS', + value: 'Linux' + }, + { + key: 'CPU', + value: 'intel7...' + }, + { + key: 'Memory', + value: '16GB' + }, + { + key: '...', + value: '...' + }, + ]; + this.probeInfo = [ + { + key: 'Authorized at', + value: String(new Date(this.probe.authorizeDate)) + }, + { + key: 'Authorized by', + value: 'insanity' + }, + { + key: 'Installed at', + value: String(new Date(this.probe.createDate)) + }, + { + key: 'Probe Key', + value: this.probe.probeKey, + }, + ]; + } -// discovery() { -// const dialogRef = this.dialog.open(DiscoverySettingComponent, { -// width: '80%', -// }); + discovery() { + // const dialogRef = this.dialog.open(DiscoverySettingComponent, { + // width: '80%', + // }); -// dialogRef.afterClosed().subscribe(result => { -// console.log('The dialog was closed'); + // dialogRef.afterClosed().subscribe(result => { + // console.log('The dialog was closed'); -// }); -// } + // }); + } -// handleStartStop() { -// // this.isUpState = !this.isUpState; -// } + handleStartStop() { + // this.isUpState = !this.isUpState; + } -// handleRemove() { -// const dialogRef = this.dialog.open(ConfirmDialogComponent, { -// width: '250px', -// data: { -// title: 'Remove', -// message: 'Are you sure?' -// } -// }); + handleRemove() { + // const dialogRef = this.dialog.open(ConfirmDialogComponent, { + // width: '250px', + // data: { + // title: 'Remove', + // message: 'Are you sure?' + // } + // }); -// dialogRef.afterClosed().subscribe(confirmed => { -// if (confirmed) { -// console.log('confirmed'); -// } -// // 삭제 후 list로 back -// }); -// } -// } + // dialogRef.afterClosed().subscribe(confirmed => { + // if (confirmed) { + // console.log('confirmed'); + // } + // // 삭제 후 list로 back + // }); + } +} diff --git a/src/packages/probe/component/index.ts b/src/packages/probe/component/index.ts index c204af7..4efee54 100644 --- a/src/packages/probe/component/index.ts +++ b/src/packages/probe/component/index.ts @@ -1,9 +1,9 @@ -// import { DetailComponent } from './detail/detail.component'; -// import { ListComponent } from './list/list.component'; -// import { DownloadComponent } from './download/download.component'; +import { DetailComponent } from './detail/detail.component'; +import { ListComponent } from './list/list.component'; +import { DownloadComponent } from './download/download.component'; -// export const COMPONENTS = [ -// ListComponent, -// DetailComponent, -// DownloadComponent, -// ]; +export const COMPONENTS = [ + ListComponent, + DetailComponent, + DownloadComponent, +]; diff --git a/src/packages/probe/component/list/list.component.html b/src/packages/probe/component/list/list.component.html index 1840b9b..4989ba1 100644 --- a/src/packages/probe/component/list/list.component.html +++ b/src/packages/probe/component/list/list.component.html @@ -1,4 +1,5 @@ -
+
probe list
+ \ No newline at end of file diff --git a/src/packages/probe/component/list/list.component.ts b/src/packages/probe/component/list/list.component.ts index 6cb812c..1e831f0 100644 --- a/src/packages/probe/component/list/list.component.ts +++ b/src/packages/probe/component/list/list.component.ts @@ -1,93 +1,92 @@ -// import { Component, OnInit, AfterViewInit, AfterContentInit, ViewChild } from '@angular/core'; -// import { MatTableDataSource, MatSort } from '@angular/material'; -// import { Router } from '@angular/router'; +import { Component, OnInit, AfterViewInit, AfterContentInit, ViewChild } from '@angular/core'; +import { Router } from '@angular/router'; -// import { Store, select } from '@ngrx/store'; +import { Store, select } from '@ngrx/store'; -// import { RPCClientError } from '@loafer/ng-rpc/protocol'; -// import { Domain } from 'packages/domain/model'; -// import { AuthSelector } from 'packages/member/store'; +import { RPCClientError } from '@loafer/ng-rpc/protocol'; +import { Domain } from 'packages/domain/model'; +import { AuthSelector } from 'packages/member/store'; -// import { Probe } from '../../model'; -// import * as ListStore from '../../store/list'; -// import { ListSelector } from '../../store'; +import { Probe } from '../../model'; +import * as ListStore from '../../store/list'; +import { ListSelector } from '../../store'; -// @Component({ -// selector: 'of-probe-list', -// templateUrl: './list.component.html', -// styleUrls: ['./list.component.scss'] -// }) -// export class ListComponent implements OnInit, AfterContentInit { -// probes$ = this.store.pipe(select(ListSelector.select('probes'))); -// // pageSize = '25'; -// // length = '100'; +@Component({ + selector: 'of-probe-list', + templateUrl: './list.component.html', + styleUrls: ['./list.component.scss'] +}) +export class ListComponent implements OnInit, AfterContentInit { + probes$ = this.store.pipe(select(ListSelector.select('probes'))); + // pageSize = '25'; + // length = '100'; -// displayedColumns = ['name', 'ip', 'os', 'cidr', 'targetCnt', 'date', 'authBy']; + displayedColumns = ['name', 'ip', 'os', 'cidr', 'targetCnt', 'date', 'authBy']; // dataSource: MatTableDataSource; // @ViewChild(MatSort) sort: MatSort; -// constructor( -// private router: Router, -// private store: Store -// ) { -// } + constructor( + private router: Router, + private store: Store + ) { + } -// ngAfterContentInit() { + ngAfterContentInit() { -// this.store.select(AuthSelector.select('domain')).subscribe( -// (domain: Domain) => { -// this.store.dispatch(new ListStore.ReadAllByDomain(domain)); -// }, -// (error) => { -// console.log(error); -// } -// ); + this.store.select(AuthSelector.select('domain')).subscribe( + (domain: Domain) => { + this.store.dispatch(new ListStore.ReadAllByDomain(domain)); + }, + (error) => { + console.log(error); + } + ); -// this.probes$.subscribe( -// (probes: Probe[]) => { -// console.log(probes); -// this.dataSource = new MatTableDataSource(probes); -// this.dataSource.sort = this.sort; -// }, -// (error: RPCClientError) => { -// console.log(error.response.message); -// } -// ); + this.probes$.subscribe( + (probes: Probe[]) => { + console.log(probes); + // this.dataSource = new MatTableDataSource(probes); + // this.dataSource.sort = this.sort; + }, + (error: RPCClientError) => { + console.log(error.response.message); + } + ); -// // // temporary data -// // const data: Probe[] = new Array(); -// // for (let i = 0; i < 100; i++) { -// // const p: Probe = { -// // id: i, -// // displayName: String('displayName' + i), -// // host: { -// // ip: i, -// // os: { -// // meta: 'blahblahblah' -// // }, -// // }, -// // cidr: String('cidr' + i), -// // targets: [ -// // { -// // id: i, -// // }, -// // ], -// // authorizeDate: new Date(), -// // authorizeMember: { -// // 'name': String('insanity') -// // }, -// // }; -// // data.push(p); -// // } + // // temporary data + // const data: Probe[] = new Array(); + // for (let i = 0; i < 100; i++) { + // const p: Probe = { + // id: i, + // displayName: String('displayName' + i), + // host: { + // ip: i, + // os: { + // meta: 'blahblahblah' + // }, + // }, + // cidr: String('cidr' + i), + // targets: [ + // { + // id: i, + // }, + // ], + // authorizeDate: new Date(), + // authorizeMember: { + // 'name': String('insanity') + // }, + // }; + // data.push(p); + // } -// // this.dataSource = new MatTableDataSource(data); -// // this.dataSource.sort = this.sort; -// } + // this.dataSource = new MatTableDataSource(data); + // this.dataSource.sort = this.sort; + } -// ngOnInit() { -// } + ngOnInit() { + } -// handleRowClick(obj: Probe) { -// this.router.navigate(['probe', obj.id]); -// } -// } + handleRowClick(obj: Probe) { + this.router.navigate(['probe', obj.id]); + } +} diff --git a/src/packages/probe/probe.module.ts b/src/packages/probe/probe.module.ts index 6048643..7bcae30 100644 --- a/src/packages/probe/probe.module.ts +++ b/src/packages/probe/probe.module.ts @@ -1,40 +1,27 @@ -// import { NgModule } from '@angular/core'; -// import { CommonModule } from '@angular/common'; +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; -// import { MaterialModule } from 'packages/commons/material/material.module'; - -// import { InfoTableModule } from 'packages/commons/component/info-table/info-table.module'; -// import { ConfirmDialogModule } from 'packages/commons/component/confirm-dialog/confirm-dialog.module'; -// import { ConfirmDialogComponent } from 'packages/commons/component/confirm-dialog/confirm-dialog.component'; - -// import { COMPONENTS } from './component'; -// import { ProbeStoreModule } from './probe-store.module'; -// import { SERVICES } from './service'; +import { COMPONENTS } from './component'; +import { ProbeStoreModule } from './probe-store.module'; +import { SERVICES } from './service'; // import { SettingComponent as DiscoverySettingComponent } from 'packages/discovery/component/setting/setting.component'; // import { DiscoveryModule } from '../discovery/discovery.module'; -// @NgModule({ -// imports: [ -// CommonModule, -// MaterialModule, -// InfoTableModule, -// ConfirmDialogModule, -// ProbeStoreModule, -// DiscoveryModule -// ], -// declarations: [ -// COMPONENTS, -// ], -// exports: [ -// COMPONENTS, -// ], -// providers: [ -// SERVICES, -// ], -// entryComponents: [ -// ConfirmDialogComponent, -// DiscoverySettingComponent -// ] -// }) -// export class ProbeModule { } +@NgModule({ + imports: [ + CommonModule, + ProbeStoreModule, + // DiscoveryModule + ], + declarations: [ + COMPONENTS, + ], + exports: [ + COMPONENTS, + ], + providers: [ + SERVICES, + ] +}) +export class ProbeModule { }