AW-1881
Some checks failed
FarmMaps.Develop/FarmMapsLib/pipeline/head There was a failure building this commit
Some checks failed
FarmMaps.Develop/FarmMapsLib/pipeline/head There was a failure building this commit
This commit is contained in:
parent
7c125f1771
commit
0bb5406773
@ -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;
|
||||||
|
}
|
@ -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>
|
|
@ -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;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user