FarmMaps/FarmMapsLib
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

AW-1881
Some checks failed
FarmMaps.Develop/FarmMapsLib/pipeline/head There was a failure building this commit
Details

Browse Source
This commit is contained in:
Peter Bastiani 2021-03-01 12:32:14 +01:00
parent 7c125f1771
commit 0bb5406773
3 changed files with 42 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
projects/common/src/fm/components/avatar/avatar.component.css
View File

@ -0,0 +1,13 @@
.avatar-container {
position: relative;
}
.avatar-text {
position: absolute;
top: 25px;
left: 10px;
bottom: 20px;
right: 20px;
color: white;
padding-left: 20px;
padding-right: 20px;
}

16
projects/common/src/fm/components/avatar/avatar.component.html
View File

@ -1,9 +1,7 @@
<span [title]="getName()"> <div class="avatar-container" [title]="name" (click)="onClick($event)">
<ngx-avatar <ngx-avatar
[size]="size" [src]="src"
[round]="round" [name]="name"
[name]="getName()" [size]="size">
[src]="getAvatar()" </ngx-avatar>
(clickOnAvatar)="onClick()"> </div>
</ngx-avatar>
</span>

36
projects/common/src/fm/components/avatar/avatar.component.ts
View File

@ -1,4 +1,4 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; import { Component, EventEmitter, Input, OnInit, Output, SimpleChanges } from '@angular/core';
import { IUser } from '../../models/user'; import { IUser } from '../../models/user';
import { AppConfig } from '../../shared/app.config'; import { AppConfig } from '../../shared/app.config';
@ -7,36 +7,42 @@ import { AppConfig } from '../../shared/app.config';
templateUrl: './avatar.component.html', templateUrl: './avatar.component.html',
styleUrls: ['./avatar.component.css'] styleUrls: ['./avatar.component.css']
}) })
export class AvatarComponent implements OnInit { export class TestAvatarComponent implements OnInit {
@Input() user: IUser; @Input() user: IUser;
@Input() bgColor: string; @Input() bgColor: string;
@Input() fgColor: string; @Input() fgColor: string;
@Input() size: number; @Input() size: number = 75;
@Input() round: boolean = true; @Input() round: boolean = true;
@Output() click = new EventEmitter(); @Output() click = new EventEmitter();
src : string = null;
name : string = null;
constructor(private appConfig: AppConfig) { constructor(private appConfig: AppConfig) {
} }
ngOnInit(): void { ngOnInit(): void {
} }
getAvatar():string { ngOnChanges(changes: SimpleChanges): void {
if (!this.user) return null; if (changes['user']) {
const apiEndpoint = this.appConfig.getConfig("apiEndPoint"); const user: IUser = changes['user'].currentValue;
return `${apiEndpoint}/api/v1/users/${this.user.code}/avatar`; this.refresh(user);
}
} }
getName():string { onClick(event: MouseEvent) {
if (!this.user) return null; event.stopPropagation();
if (this.user.firstName && this.user.lastName)
return this.user.firstName + ' ' + this.user.lastName;
return this.user.name;
}
onClick() {
this.click.emit(); this.click.emit();
} }
refresh(user: IUser) {
if (!user) return null;
const apiEndpoint = this.appConfig.getConfig("apiEndPoint");
this.src = `${apiEndpoint}/api/v1/users/${user.code}/avatar`;
this.name = user.firstName && user.lastName ?
user.firstName + ' ' + user.lastName : user.name;
}
} }