(Mail-ngrx) unread, selected class added for mail list item

This commit is contained in:
mustafahlvc 2017-12-14 11:10:35 +03:00
parent abede386c8
commit 377092d9ec
6 changed files with 26 additions and 2 deletions

View File

@ -33,6 +33,17 @@ export class FuseMailNgrxDetailsComponent implements OnInit, OnDestroy, OnChange
ngOnChanges()
{
this.updateModel(this.mailInput);
this.markAsRead();
}
markAsRead()
{
if ( this.mail && !this.mail.read )
{
this.mail.markRead();
this.updateMail();
}
}
toggleStar(event)

View File

@ -6,6 +6,7 @@
padding: 16px 24px;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
cursor: pointer;
background: #FAFAFA;
&.unread {
background: #FFFFFF;

View File

@ -15,6 +15,7 @@ export class FuseMailNgrxListItemComponent implements OnInit, OnDestroy
{
@Input() mail: Mail;
@HostBinding('class.selected') selected: boolean;
@HostBinding('class.unread') unread: boolean;
labels$: Observable<any>;
selectedMailIds$: Observable<any>;
@ -33,6 +34,7 @@ export class FuseMailNgrxListItemComponent implements OnInit, OnDestroy
{
// Set the initial values
this.mail = new Mail(this.mail);
this.unread = !this.mail.read;
this.selectedMailIds$.subscribe((selectedMailIds) => {
this.selected = selectedMailIds.length > 0 && selectedMailIds.find(id => id === this.mail.id) !== undefined;

View File

@ -12,7 +12,7 @@ import { MailNgrxService } from '../mail.service';
export class FuseMailNgrxListComponent implements OnInit, OnDestroy
{
@Input() mails: Mail[];
currentMail: Mail;
@Input() currentMail: Mail[];
constructor(
private route: ActivatedRoute,

View File

@ -98,7 +98,7 @@
<!-- CONTENT -->
<div class="content" fxLayoutAlign="row">
<fuse-mail-list fusePerfectScrollbar fxFlex [mails]="mails$ | async"></fuse-mail-list>
<fuse-mail-list fusePerfectScrollbar fxFlex [mails]="mails$ | async" [currentMail]="currentMail$ | async"></fuse-mail-list>
<fuse-mail-details [mail]="currentMail$ | async" fusePerfectScrollbar fxFlex></fuse-mail-details>

View File

@ -53,4 +53,14 @@ export class Mail
{
this.important = !this.important;
}
markRead()
{
this.read = true;
}
markUnRead()
{
this.read = false;
}
}