diff --git a/src/app/fuse-fake-db/fuse-fake-db.service.ts b/src/app/fuse-fake-db/fuse-fake-db.service.ts index 21a91262..b0de5812 100644 --- a/src/app/fuse-fake-db/fuse-fake-db.service.ts +++ b/src/app/fuse-fake-db/fuse-fake-db.service.ts @@ -29,7 +29,7 @@ export class FuseFakeDbService implements InMemoryDbService 'profile-timeline' : ProfileFakeDb.timeline, 'profile-photos-videos': ProfileFakeDb.photosVideos, 'profile-about' : ProfileFakeDb.about, - 'contacts' : ContactsFakeDb.contacts, + 'contacts-contacts' : ContactsFakeDb.contacts, 'invoice' : InvoiceFakeDb.invoice, 'file-manager' : FileManagerFakeDb.files, 'search-classic' : SearchFakeDb.classic, diff --git a/src/app/main/content/apps/contacts/contact-list/contact-list.component.html b/src/app/main/content/apps/contacts/contact-list/contact-list.component.html index c6706e10..76e65027 100644 --- a/src/app/main/content/apps/contacts/contact-list/contact-list.component.html +++ b/src/app/main/content/apps/contacts/contact-list/contact-list.component.html @@ -1,51 +1,75 @@ - - + + - - + + Check + + + + + + Name + + Name - {{row.name}} + +

{{contact.name}} {{contact.lastName}}

+ - - - Type - {{row.type}} + + + Email + + + - - - Owner - {{row.owner}} + + + Phone + +

+ {{contact.phone}} +

+ - - - Size - {{row.size === '' ? '-': row.size}} + + + Job title + +

+ {{contact.jobTitle}} +

+ - - - Modified - {{row.modified}} + + + Company + +

+ {{contact.company}} +

+ - - + + - + Buttons diff --git a/src/app/main/content/apps/contacts/contact-list/contact-list.component.ts b/src/app/main/content/apps/contacts/contact-list/contact-list.component.ts index db557820..c988fdd8 100644 --- a/src/app/main/content/apps/contacts/contact-list/contact-list.component.ts +++ b/src/app/main/content/apps/contacts/contact-list/contact-list.component.ts @@ -1,5 +1,4 @@ import { Component, OnInit } from '@angular/core'; -import { Http } from '@angular/http'; import { ContactsService } from '../contacts.service'; import { DataSource } from '@angular/cdk'; import { Observable } from 'rxjs/Observable'; @@ -11,17 +10,17 @@ import { Observable } from 'rxjs/Observable'; }) export class ContactListComponent implements OnInit { - files: any; + contacts: any; dataSource: FilesDataSource | null; - displayedColumns = ['icon', 'name', 'type', 'owner', 'size', 'modified', 'detail-button']; + displayedColumns = ['checkbox', 'avatar', 'name', 'email', 'phone', 'jobTitle', 'buttons']; selected: any; constructor(private fileManagerService: ContactsService) { - this.fileManagerService.onFilesChanged.subscribe(files => { - this.files = files; + this.fileManagerService.onContactsChanged.subscribe(files => { + this.contacts = files; }); - this.fileManagerService.onFileSelected.subscribe(selected => { + this.fileManagerService.onContactSelected.subscribe(selected => { this.selected = selected; }); } @@ -33,13 +32,13 @@ export class ContactListComponent implements OnInit onSelect(selected) { - this.fileManagerService.onFileSelected.next(selected); + this.fileManagerService.onContactSelected.next(selected); } } export class FilesDataSource extends DataSource { - constructor(private fileManagerService: ContactsService) + constructor(private contactsService: ContactsService) { super(); } @@ -47,7 +46,7 @@ export class FilesDataSource extends DataSource /** Connect function called by the table to retrieve one stream containing the data to render. */ connect(): Observable { - return this.fileManagerService.onFilesChanged; + return this.contactsService.onContactsChanged; } disconnect() diff --git a/src/app/main/content/apps/contacts/contacts.component.html b/src/app/main/content/apps/contacts/contacts.component.html index a0dceb29..b7053db6 100644 --- a/src/app/main/content/apps/contacts/contacts.component.html +++ b/src/app/main/content/apps/contacts/contacts.component.html @@ -1,24 +1,94 @@ -
+
+ + +
+ + +
+ + + + + +
+ + + +
+ + + + +
+ + +
+ - - + + +
+ +
+ +
+ + +
+ + + +
+ + +
+ + + + +
+ + + -
+ <!– HEADER –> +
- -
+ <!– TOOLBAR –> +
-
+
-
+
- + <!– / TOOLBAR –> - -
-
+ <!– BREADCRUMB –> +
+
{{path}} chevron_right
- + <!– / BREADCRUMB –> - + <!– ADD FILE BUTTON –>
- + <!– / ADD FILE BUTTON –>
- + <!– / HEADER –> - + <!– CONTENT –>
- + <!– / CONTENT –>
- + <!– / CENTER –>
+--> diff --git a/src/app/main/content/apps/contacts/contacts.component.scss b/src/app/main/content/apps/contacts/contacts.component.scss index 8cf748cf..ea264e31 100644 --- a/src/app/main/content/apps/contacts/contacts.component.scss +++ b/src/app/main/content/apps/contacts/contacts.component.scss @@ -1,66 +1,2 @@ @import "src/app/core/scss/fuse"; -#file-manager { - - md-sidenav-container { - - .sidenav { - width: 320px !important; - min-width: 320px !important; - max-width: 320px !important; - - &.left-sidenav { - } - - &.right-sidenav { - @include media-breakpoint('gt-md') { - z-index: 0; - } - } - } - - .mat-sidenav-content { - z-index: 1; - - .center { - - .header { - position: relative; - height: 200px; - min-height: 200px; - max-height: 200px; - - .add-file-button { - position: absolute; - bottom: -28px; - left: 16px; - } - } - } - } - } - - .type-icon { - - &.folder { - &:before { - content: 'folder'; - color: #FFB300; - } - } - - &.document { - &:before { - content: 'insert_drive_file'; - color: #1565C0; - } - } - - &.spreadsheet { - &:before { - content: 'insert_chart'; - color: #4CAF50; - } - } - } -} diff --git a/src/app/main/content/apps/contacts/contacts.component.ts b/src/app/main/content/apps/contacts/contacts.component.ts index 79c1386f..68e364b4 100644 --- a/src/app/main/content/apps/contacts/contacts.component.ts +++ b/src/app/main/content/apps/contacts/contacts.component.ts @@ -11,18 +11,16 @@ export class ContactsComponent implements OnInit { selected: any; - pathArr: string[]; - constructor(private fileManagerService: ContactsService) + constructor(private contactsService: ContactsService) { } ngOnInit() { - this.fileManagerService.onFileSelected.subscribe(selected => { + this.contactsService.onContactSelected.subscribe(selected => { this.selected = selected; - this.pathArr = selected.location.split('>'); }); } diff --git a/src/app/main/content/apps/contacts/contacts.service.ts b/src/app/main/content/apps/contacts/contacts.service.ts index 4308f6fc..6a84b3e4 100644 --- a/src/app/main/content/apps/contacts/contacts.service.ts +++ b/src/app/main/content/apps/contacts/contacts.service.ts @@ -7,15 +7,15 @@ import { BehaviorSubject } from 'rxjs/BehaviorSubject'; @Injectable() export class ContactsService implements Resolve { - onFilesChanged: BehaviorSubject = new BehaviorSubject({}); - onFileSelected: BehaviorSubject = new BehaviorSubject({}); + onContactsChanged: BehaviorSubject = new BehaviorSubject({}); + onContactSelected: BehaviorSubject = new BehaviorSubject({}); constructor(private http: Http) { } /** - * The File Manager App Main Resolver + * The Contacts App Main Resolver * @param {ActivatedRouteSnapshot} route * @param {RouterStateSnapshot} state * @returns {Observable | Promise | any} @@ -26,7 +26,7 @@ export class ContactsService implements Resolve return new Promise((resolve, reject) => { Promise.all([ - this.getFiles() + this.getContacts() ]).then( ([files]) => { resolve(); @@ -36,13 +36,13 @@ export class ContactsService implements Resolve }); } - getFiles(): Promise + getContacts(): Promise { return new Promise((resolve, reject) => { - this.http.get('api/file-manager') + this.http.get('api/contacts-contacts') .subscribe(response => { - this.onFilesChanged.next(response.json().data); - this.onFileSelected.next(response.json().data[0]); + this.onContactsChanged.next(response.json().data); + this.onContactSelected.next(response.json().data[0]); resolve(response.json().data); }, reject); }); diff --git a/src/app/main/main.component.scss b/src/app/main/main.component.scss index 9dd7ce3b..303de571 100644 --- a/src/app/main/main.component.scss +++ b/src/app/main/main.component.scss @@ -4,7 +4,7 @@ fuse-main { width: 100%; height: 100%; - .mat-sidenav-container { + > .mat-sidenav-container { display: flex; flex: 1; @@ -31,9 +31,9 @@ fuse-main { fuse-content { display: flex; + flex: 1; flex-direction: row; width: 100%; - height: 100%; overflow-x: hidden; overflow-y: auto;