90 lines
3.3 KiB
HTML
90 lines
3.3 KiB
HTML
<div *ngIf="user | async as userProfile; else loading" class="row user-profile">
|
|
<mat-card class="col-12 profile-card">
|
|
<mat-card-content>
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="row profile-card-center-row">
|
|
<div class="col-auto"><img mat-card-avatar [src]="userProfile.additionalinfo.avatarUrl"></div>
|
|
</div>
|
|
<div class="row profile-card-center-row">
|
|
<mat-card-title class="col-auto">{{userProfile.name}}</mat-card-title>
|
|
</div>
|
|
<div class="row profile-card-center-row">
|
|
<mat-card-subtitle class="col-auto">{{userProfile.email}}</mat-card-subtitle>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
<mat-card class="col-12 profile-card">
|
|
<mat-card-content>
|
|
<div>
|
|
<div>
|
|
<h4>{{'USER-PROFILE.ASSOCIATED-DMPS' | translate}}</h4>
|
|
</div>
|
|
<div>
|
|
<mat-list>
|
|
<mat-list-item class="clickable" (click)="navigateToDmp(dmp)" *ngFor="let dmp of userProfile.associatedDmps">
|
|
<div>
|
|
{{dmp.label}}
|
|
</div>
|
|
<div>
|
|
<mat-chip-list>
|
|
<mat-chip>{{getUserRole(dmp)}}</mat-chip>
|
|
</mat-chip-list>
|
|
</div>
|
|
</mat-list-item>
|
|
</mat-list>
|
|
<button mat-button (click)="showAllDmps()"> {{'USER-PROFILE.DMPS.SHOW-ALL' | translate}}</button>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
<mat-card class="col-12 profile-card">
|
|
<mat-card-header>
|
|
<mat-card-title>
|
|
<div class="row">
|
|
<h4 class="col-auto">{{ 'USER-PROFILE.SETTINGS.TITLE' | translate}}</h4>
|
|
<button class="col-auto" *ngIf="!editMode" mat-icon-button (click)="unlock()">
|
|
<mat-icon class="mat-24">edit</mat-icon>
|
|
</button>
|
|
<button class="col-auto" *ngIf="editMode" mat-icon-button (click)="lock()">
|
|
<mat-icon class="mat-24">lock</mat-icon>
|
|
</button>
|
|
</div>
|
|
</mat-card-title>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div class="container">
|
|
<div class="row" [formGroup]="formGroup">
|
|
<mat-form-field class="col-md-4">
|
|
<input type="text" placeholder="{{'USER-PROFILE.SETTINGS.TIMEZONE' | translate}}" [formControl]="this.formGroup.get('timezone')" matInput [matAutocomplete]="timezone" required>
|
|
<mat-autocomplete #timezone="matAutocomplete">
|
|
<mat-option *ngFor="let timezone of timezones | async" [value]="timezone">
|
|
{{ timezone | timezoneInfoDisplay }}
|
|
</mat-option>
|
|
</mat-autocomplete>
|
|
</mat-form-field>
|
|
<mat-form-field class="col-md-4">
|
|
<input type="text" placeholder="{{'USER-PROFILE.SETTINGS.CULTURE' | translate}}" [formControl]="this.formGroup.get('culture')" matInput [matAutocomplete]="culture" required>
|
|
<mat-autocomplete #culture="matAutocomplete" [displayWith]="displayFn">
|
|
<mat-option *ngFor="let culture of cultures | async" [value]="culture">
|
|
{{ culture.displayName }} - {{ culture.nativeName }}
|
|
</mat-option>
|
|
</mat-autocomplete>
|
|
</mat-form-field>
|
|
<mat-form-field class="col-md-4">
|
|
<mat-select placeholder="{{'USER-PROFILE.SETTINGS.LANGUAGE' | translate}}" [formControl]="this.formGroup.get('language')" required>
|
|
<mat-option *ngFor="let language of languages" [value]="language">
|
|
{{ language.label }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
</div>
|
|
<ng-template #loading>
|
|
</ng-template>
|