From 0fcda0b58d0559f05d2857d9d5b79bebc4556643 Mon Sep 17 00:00:00 2001 From: insanity Date: Fri, 9 Mar 2018 16:25:33 +0900 Subject: [PATCH] commons - confirm dialog --- .../confirm-dialog.component.html | 6 ++ .../confirm-dialog.component.scss} | 0 .../confirm-dialog.component.spec.ts} | 12 ++-- .../confirm-dialog.component.ts | 15 +++++ .../component/detail/detail.component.ts | 23 ++++++-- .../remove-warning-dialog.component.html | 5 -- .../remove-warning-dialog.component.ts | 21 ------- src/packages/probe/component/index.ts | 4 +- .../probe/component/list/list.component.ts | 58 +++++++++---------- src/packages/probe/probe.module.ts | 6 +- 10 files changed, 78 insertions(+), 72 deletions(-) create mode 100644 src/app/commons/component/confirm-dialog/confirm-dialog.component.html rename src/{packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.scss => app/commons/component/confirm-dialog/confirm-dialog.component.scss} (100%) rename src/{packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.spec.ts => app/commons/component/confirm-dialog/confirm-dialog.component.spec.ts} (52%) create mode 100644 src/app/commons/component/confirm-dialog/confirm-dialog.component.ts delete mode 100644 src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.html delete mode 100644 src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.ts diff --git a/src/app/commons/component/confirm-dialog/confirm-dialog.component.html b/src/app/commons/component/confirm-dialog/confirm-dialog.component.html new file mode 100644 index 0000000..00f73b4 --- /dev/null +++ b/src/app/commons/component/confirm-dialog/confirm-dialog.component.html @@ -0,0 +1,6 @@ +

{{data.title}}

+{{data.message}} + + + + \ No newline at end of file diff --git a/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.scss b/src/app/commons/component/confirm-dialog/confirm-dialog.component.scss similarity index 100% rename from src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.scss rename to src/app/commons/component/confirm-dialog/confirm-dialog.component.scss diff --git a/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.spec.ts b/src/app/commons/component/confirm-dialog/confirm-dialog.component.spec.ts similarity index 52% rename from src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.spec.ts rename to src/app/commons/component/confirm-dialog/confirm-dialog.component.spec.ts index 4a6e131..ccea433 100644 --- a/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.spec.ts +++ b/src/app/commons/component/confirm-dialog/confirm-dialog.component.spec.ts @@ -1,20 +1,20 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; -import { RemoveWarningComponent } from './remove-warning-dialog.component'; +import { ConfirmDialogComponent } from './confirm-dialog.component'; -describe('RemoveWarningComponent', () => { - let component: RemoveWarningComponent; - let fixture: ComponentFixture; +describe('ConfirmDialogComponent', () => { + let component: ConfirmDialogComponent; + let fixture: ComponentFixture; beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ RemoveWarningComponent ] + declarations: [ ConfirmDialogComponent ] }) .compileComponents(); })); beforeEach(() => { - fixture = TestBed.createComponent(RemoveWarningComponent); + fixture = TestBed.createComponent(ConfirmDialogComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/src/app/commons/component/confirm-dialog/confirm-dialog.component.ts b/src/app/commons/component/confirm-dialog/confirm-dialog.component.ts new file mode 100644 index 0000000..7e9c5fc --- /dev/null +++ b/src/app/commons/component/confirm-dialog/confirm-dialog.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit, Inject } from '@angular/core'; +import { MAT_DIALOG_DATA } from '@angular/material'; + +@Component({ + selector: 'of-confirm-dialog', + templateUrl: './confirm-dialog.component.html', + styleUrls: ['./confirm-dialog.component.scss'] +}) +export class ConfirmDialogComponent implements OnInit { + constructor(@Inject(MAT_DIALOG_DATA) public data: any) { } + + ngOnInit() { + } + +} diff --git a/src/packages/probe/component/detail/detail.component.ts b/src/packages/probe/component/detail/detail.component.ts index 6070e20..b700ec8 100644 --- a/src/packages/probe/component/detail/detail.component.ts +++ b/src/packages/probe/component/detail/detail.component.ts @@ -1,7 +1,7 @@ import { Component, OnInit, Inject } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; -import { RemoveWarningComponent } from './remove-warning-dialog/remove-warning-dialog.component'; +import { ConfirmDialogComponent } from 'app/commons/component/confirm-dialog/confirm-dialog.component'; @Component({ selector: 'of-probe-detail', @@ -36,7 +36,8 @@ export class DetailComponent implements OnInit { constructor( private route: ActivatedRoute, private router: Router, - public dialog: MatDialog) { } + public dialog: MatDialog, + ) { } ngOnInit() { this.probeId = this.route.snapshot.paramMap.get('id'); @@ -48,13 +49,23 @@ export class DetailComponent implements OnInit { } handleRemove() { - const dialogRef = this.dialog.open(RemoveWarningComponent, { + const dialogRef = this.dialog.open(ConfirmDialogComponent, { width: '250px', - data: { } + data: { + title: 'Remove', + message: 'Are you sure?' + } }); - dialogRef.afterClosed().subscribe(result => { - console.log(result); + // const dialogRef = this.dialog.open(RemoveWarningComponent, { + // width: '250px', + // data: { } + // }); + + dialogRef.afterClosed().subscribe(confirmed => { + if (confirmed) { + console.log('confirmed'); + } // 삭제 후 list로 back }); } diff --git a/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.html b/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.html deleted file mode 100644 index 3c72353..0000000 --- a/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.html +++ /dev/null @@ -1,5 +0,0 @@ -
레알루다가? 다 지워질건데?
-
- - -
\ No newline at end of file diff --git a/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.ts b/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.ts deleted file mode 100644 index 6f64d9f..0000000 --- a/src/packages/probe/component/detail/remove-warning-dialog/remove-warning-dialog.component.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { Component, OnInit, Input } from '@angular/core'; -import { MatDialogRef } from '@angular/material'; - -@Component({ - selector: 'of-remove-warning-dialog', - templateUrl: './remove-warning-dialog.component.html', - styleUrls: ['./remove-warning-dialog.component.scss'] -}) -export class RemoveWarningComponent implements OnInit { - - constructor( - public dialogRef: MatDialogRef - ) { } - - ngOnInit() { - } - - onClick(res: boolean) { - this.dialogRef.close(res); - } -} diff --git a/src/packages/probe/component/index.ts b/src/packages/probe/component/index.ts index 1342a95..4372035 100644 --- a/src/packages/probe/component/index.ts +++ b/src/packages/probe/component/index.ts @@ -1,11 +1,11 @@ import { DetailComponent } from './detail/detail.component'; import { ListComponent } from './list/list.component'; import { DownloadComponent } from './download/download.component'; -import { RemoveWarningComponent } from './detail/remove-warning-dialog/remove-warning-dialog.component'; +import { ConfirmDialogComponent } from 'app/commons/component/confirm-dialog/confirm-dialog.component'; export const COMPONENTS = [ ListComponent, DetailComponent, DownloadComponent, - RemoveWarningComponent + ConfirmDialogComponent ]; diff --git a/src/packages/probe/component/list/list.component.ts b/src/packages/probe/component/list/list.component.ts index 63e8bc9..d88164b 100644 --- a/src/packages/probe/component/list/list.component.ts +++ b/src/packages/probe/component/list/list.component.ts @@ -37,7 +37,7 @@ export class ListComponent implements OnInit, AfterContentInit { this.dataSource.sort = this.sort; }, (error: ErrorResponse) => { - + console.log(error); } ); @@ -46,38 +46,38 @@ export class ListComponent implements OnInit, AfterContentInit { this.store.dispatch(new ListStore.ReadAllByDomain(domain)); }, (error) => { - + console.log(error); } ); - // // 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() { diff --git a/src/packages/probe/probe.module.ts b/src/packages/probe/probe.module.ts index f819d07..f1cb636 100644 --- a/src/packages/probe/probe.module.ts +++ b/src/packages/probe/probe.module.ts @@ -6,14 +6,14 @@ import { InfoTableModule } from 'app/commons/component/info-table/info-table.mod import { COMPONENTS } from './component'; import { ProbeStoreModule } from './probe-store.module'; import { SERVICES } from './service'; -import { RemoveWarningComponent } from './component/detail/remove-warning-dialog/remove-warning-dialog.component'; +import { ConfirmDialogComponent } from 'app/commons/component/confirm-dialog/confirm-dialog.component'; @NgModule({ imports: [ CommonModule, MaterialModule, InfoTableModule, - ProbeStoreModule + ProbeStoreModule, ], declarations: [ COMPONENTS, @@ -25,7 +25,7 @@ import { RemoveWarningComponent } from './component/detail/remove-warning-dialog SERVICES, ], entryComponents: [ - RemoveWarningComponent, + ConfirmDialogComponent, ] }) export class ProbeModule { }