Merge branch 'develop' into feature/thumbnail_upload

This commit is contained in:
Willem Dantuma 2021-03-01 16:57:15 +01:00
commit ae02dd0b53
4 changed files with 48 additions and 13 deletions

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;
}

View File

@ -1 +1,9 @@
<ngx-avatar [size]="size" [round]="round" name="getName()" (clickOnAvatar)="onClick()"></ngx-avatar>
<span class="avatar-container" [title]="name">
<ngx-avatar
[src]="src"
[name]="name"
[size]="size"
[round]='true'
>
</ngx-avatar>
</span>

View File

@ -1,5 +1,6 @@
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 { AppConfig } from '../../shared/app.config';
@Component({
selector: 'fm-avatar',
@ -11,24 +12,37 @@ export class AvatarComponent implements OnInit {
@Input() user: IUser;
@Input() bgColor: string;
@Input() fgColor: string;
@Input() size: number;
@Input() round: boolean;
@Input() size: number = 75;
@Input() round: boolean = true;
@Output() click = new EventEmitter();
constructor() { }
src : string = null;
name : string = null;
constructor(private appConfig: AppConfig) {
}
ngOnInit(): void {
}
getName():string {
if (!this.user) return null;
if (this.user.firstName && this.user.lastName)
return this.user.firstName + ' ' + this.user.lastName;
return this.user.name;
ngOnChanges(changes: SimpleChanges): void {
if (changes['user']) {
const user: IUser = changes['user'].currentValue;
this.refresh(user);
}
}
onClick() {
onClick(event: MouseEvent) {
event.stopPropagation();
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;
}
}

View File

@ -1,6 +1,6 @@
<div>
<div (click)="toggle($event)" class="rounded-circle menu-button hidden" [ngClass]="{'hidden':!user}">
<span *ngIf="user"><span [title]="user.name">{{getLetter()}}</span></span>
<span *ngIf="user"><fm-avatar [user]="user" size="40"></fm-avatar></span>
<div class="menu hidden" [ngClass]="{'hidden':!showMenu}">
<div class="card" *ngIf="user">
<div class="card-body">