|
1
|
import {Component, Input, OnInit} from "@angular/core";
|
|
2
|
|
|
3
|
@Component({
|
|
4
|
selector: 'notification-user',
|
|
5
|
template: `
|
|
6
|
<svg *ngIf="firstLetters" height="44" width="44" [ngClass]="colorClass" [class.outlined]="outline">
|
|
7
|
<circle cx="22" cy="22" r="20" stroke-width="2"></circle>
|
|
8
|
<text x="50%" y="50%" text-anchor="middle" dy=".4em" font-size="16">
|
|
9
|
{{firstLetters}}
|
|
10
|
</text>
|
|
11
|
</svg>
|
|
12
|
`,
|
|
13
|
styleUrls: ['notification-user.component.css']
|
|
14
|
})
|
|
15
|
export class NotificationUserComponent implements OnInit{
|
|
16
|
@Input()
|
|
17
|
public name: string;
|
|
18
|
@Input()
|
|
19
|
public surname: string;
|
|
20
|
@Input()
|
|
21
|
public colorClass = 'portal-color';
|
|
22
|
@Input()
|
|
23
|
public outline: boolean = false;
|
|
24
|
public firstLetters: string;
|
|
25
|
|
|
26
|
ngOnInit() {
|
|
27
|
if(this.name && this.surname) {
|
|
28
|
this.firstLetters = this.name.charAt(0) + this.surname.charAt(0);
|
|
29
|
}
|
|
30
|
}
|
|
31
|
}
|