From d2782be60597893688d4e82f4ca24ae95b5ac2ab Mon Sep 17 00:00:00 2001 From: insanity Date: Thu, 8 Feb 2018 18:26:52 +0900 Subject: [PATCH] . --- .../dashboard-card.component.html | 34 +++++++------ .../dashboard-card.component.scss | 2 +- .../add-dashboard-dialog.component.html | 12 +++++ .../add-dashboard-dialog.component.scss | 0 .../add-dashboard-dialog.component.spec.ts | 25 ++++++++++ .../add-dashboard-dialog.component.ts | 34 +++++++++++++ .../overview/overview-page.component.html | 34 +++++++++++-- .../overview/overview-page.component.scss | 50 +++++++++++++++++++ .../pages/overview/overview-page.component.ts | 43 +++++++++++++++- .../pages/overview/overview-page.module.ts | 7 ++- 10 files changed, 220 insertions(+), 21 deletions(-) create mode 100644 src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.html create mode 100644 src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.scss create mode 100644 src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.spec.ts create mode 100644 src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.ts diff --git a/src/app/commons/component/dashboard-card/dashboard-card.component.html b/src/app/commons/component/dashboard-card/dashboard-card.component.html index f37ea37..8981c68 100644 --- a/src/app/commons/component/dashboard-card/dashboard-card.component.html +++ b/src/app/commons/component/dashboard-card/dashboard-card.component.html @@ -1,15 +1,21 @@ -
-
- {{dashData?.icon}} -
-
- -
- - -
-

- {{dashData?.title}} -

-
+
+
+
+ {{dashData?.icon}} +
+
+ +
+ +
+

+ {{dashData?.title}} +

+
+
+
\ No newline at end of file diff --git a/src/app/commons/component/dashboard-card/dashboard-card.component.scss b/src/app/commons/component/dashboard-card/dashboard-card.component.scss index 6fc8e0b..83d8496 100644 --- a/src/app/commons/component/dashboard-card/dashboard-card.component.scss +++ b/src/app/commons/component/dashboard-card/dashboard-card.component.scss @@ -13,7 +13,7 @@ @mixin dashcard($theme) { .dashcard { - margin: 10px 5px; + margin: 0px 5px 0px 5px; height: 100px; background-color:white; } diff --git a/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.html b/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.html new file mode 100644 index 0000000..98de073 --- /dev/null +++ b/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.html @@ -0,0 +1,12 @@ + + + +

No dashboards found.

+
+ +
+ + + + + \ No newline at end of file diff --git a/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.scss b/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.spec.ts b/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.spec.ts new file mode 100644 index 0000000..efa8641 --- /dev/null +++ b/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AddDashboardDialogComponent } from './add-dashboard-dialog.component'; + +describe('AddDashboardDialogComponent', () => { + let component: AddDashboardDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ AddDashboardDialogComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(AddDashboardDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.ts b/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.ts new file mode 100644 index 0000000..a76138d --- /dev/null +++ b/src/app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component.ts @@ -0,0 +1,34 @@ +import { Component, OnInit, Input } from '@angular/core'; + +@Component({ + selector: 'of-add-dashboard-dialog', + templateUrl: './add-dashboard-dialog.component.html', + styleUrls: ['./add-dashboard-dialog.component.scss'] +}) +export class AddDashboardDialogComponent implements OnInit { + + dashboards = [ + { + id: '0', + name: 'Dashboard1', + }, + { + id: '1', + name: 'Dashboard2', + }, + { + id: '2', + name: 'Dashboard3', + }, + { + id: '3', + name: 'Dashboard4', + }, + ]; + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/pages/overview/overview-page.component.html b/src/app/pages/overview/overview-page.component.html index a341432..2c70bee 100644 --- a/src/app/pages/overview/overview-page.component.html +++ b/src/app/pages/overview/overview-page.component.html @@ -1,5 +1,33 @@ -
-
- +
+ +
+ +
+ +
+ +
+ +
+
+ +
+
+

Activities

+
+ +
+ + + ... +

{{message.content}}

+

{{message.date}} {{message.from}}

+ + +
+
+
+
+
\ No newline at end of file diff --git a/src/app/pages/overview/overview-page.component.scss b/src/app/pages/overview/overview-page.component.scss index e69de29..46d3587 100644 --- a/src/app/pages/overview/overview-page.component.scss +++ b/src/app/pages/overview/overview-page.component.scss @@ -0,0 +1,50 @@ +.full { + width: 100%; +} +.activity-list-container { + background-color: white; + padding: 10px; + + .activity-list { + height: 400px; + overflow: auto; + div { + margin: 0; + } + h3 { + margin: 0; + } + p { + margin: 0; + } + .avatar { + width: 40px; + height: 40px; + border-radius: 50%; + } + } + + .activity-list-header { + background-color: #eee; + padding: 10px; + div { + margin: auto; + } + + } +} +.activity-add { + padding: 10px; + background: white; + .avatar { + width: 120px; + height: 120px; + border-radius: 50%; + } + h3 { + margin: auto; + } + } + + + \ No newline at end of file diff --git a/src/app/pages/overview/overview-page.component.ts b/src/app/pages/overview/overview-page.component.ts index 7aaac1c..450a93a 100644 --- a/src/app/pages/overview/overview-page.component.ts +++ b/src/app/pages/overview/overview-page.component.ts @@ -1,4 +1,6 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Inject } from '@angular/core'; +import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material'; +import { AddDashboardDialogComponent } from 'app/pages/overview/add-dashboard-dialog/add-dashboard-dialog.component'; @Component({ selector: 'of-page-overview', @@ -14,9 +16,46 @@ export class OverviewPageComponent implements OnInit { // { colorDark: '#66BB6A', colorLight: '#81C784', number: 1221, title: 'BANKING', icon: 'account_balance' } ]; - constructor() { } + public messages = [ + { + from: '존버왕김단타', + content: 'pac코인 여태 안 탄 혹우 있냐', + date: '2017-01-01' + }, + { + from: '코인왕박손절', + content: '큉텀이 낳냐 아다가 낳냐', + date: '2017-01-01' + }, + { + from: '존버왕김단타', + content: 'pac코인 여태 안 탄 혹우 있냐', + date: '2017-01-01' + }, + { + from: '코인왕박손절', + content: '큉텀이 낳냐 아다가 낳냐', + date: '2017-01-01' + }, + ]; + + constructor(public dialog: MatDialog) { } ngOnInit() { } + handleActivityClick(message: any) { + alert(message.content); + } + + openDialog() { + const dialogRef = this.dialog.open(AddDashboardDialogComponent, { + width: '350px', + data: { } + }); + + dialogRef.afterClosed().subscribe(result => { + console.log('The dialog was closed'); + }); + } } diff --git a/src/app/pages/overview/overview-page.module.ts b/src/app/pages/overview/overview-page.module.ts index 670fa6b..5107da3 100644 --- a/src/app/pages/overview/overview-page.module.ts +++ b/src/app/pages/overview/overview-page.module.ts @@ -5,6 +5,7 @@ import { OverviewPageComponent } from 'app/pages/overview/overview-page.componen import { DashboardCardComponent } from 'app/commons/component/dashboard-card/dashboard-card.component'; import { DashboardCardModule } from 'app/commons/component/dashboard-card/dashboard-card.module'; import { MaterialModule } from 'app/commons/ui/material/material.module'; +import { AddDashboardDialogComponent } from './add-dashboard-dialog/add-dashboard-dialog.component'; @NgModule({ imports: [ @@ -14,7 +15,11 @@ import { MaterialModule } from 'app/commons/ui/material/material.module'; MaterialModule ], declarations: [ - OverviewPageComponent + OverviewPageComponent, + AddDashboardDialogComponent + ], + entryComponents: [ + AddDashboardDialogComponent ] }) export class OverviewPageModule { }