ProfileComponent uses Tiles now

This commit is contained in:
Patrick Haßel 2024-11-06 14:57:14 +01:00
parent a1e3a4353d
commit c7b88d415a

View File

@ -1,61 +1,37 @@
<ng-container *ngIf="userService.user !== null"> <ng-container *ngIf="userService.user !== null">
<h1>Profil</h1> <div class="tileContainer">
<table>
<tr> <div class="tile">
<th> <div class="tileInner">
Name: <div class="tileTitle">
</th> Benutzername
<td> </div>
<div class="tileContent">
<app-text [initial]="userService.user.name" [editable]="true" (onChange)="userService.changeName($event)" [validator]="nameValidator"></app-text> <app-text [initial]="userService.user.name" [editable]="true" (onChange)="userService.changeName($event)" [validator]="nameValidator"></app-text>
</td> <div class="hint">
</tr>
<tr>
<td class="hint" colspan="2">
Mindestens {{ USER_NAME_MIN_LENGTH }} Zeichen. Keine Leerzeichen. Buchstaben oder Zahlen müssen enthalten sein. Mindestens {{ USER_NAME_MIN_LENGTH }} Zeichen. Keine Leerzeichen. Buchstaben oder Zahlen müssen enthalten sein.
</td> </div>
</tr> </div>
</div>
</div>
<tr> <div class="tile">
<th colspan="2">&nbsp;</th> <div class="tileInner">
</tr> <div class="tileTitle">
Passwort
<tr> <span *ngIf="!userService.user.password" class="passwordNotSet">(nicht gesetzt))</span>
<th> <span *ngIf="userService.user.password" class="passwordSet">(gesetzt)</span>
Passwort: </div>
</th> <div class="tileContent">
<td>
<div *ngIf="!userService.user.password" class="passwordNotSet">Nicht gesetzt</div>
<div *ngIf="userService.user.password" class="passwordSet">Gesetzt</div>
</td>
</tr>
<tr>
<th>
Neues Passwort:
</th>
<td>
<input #p0 type="text" [(ngModel)]="password0" [class.passwordInvalid]="p0Invalid()" [class.passwordValid]="p0Valid()" (keydown.enter)="p0Enter()"> <input #p0 type="text" [(ngModel)]="password0" [class.passwordInvalid]="p0Invalid()" [class.passwordValid]="p0Valid()" (keydown.enter)="p0Enter()">
</td>
</tr>
<tr>
<th>
Wiederholung:
</th>
<td>
<input #p1 type="text" [(ngModel)]="password1" [class.passwordInvalid]="p1Invalid()" [class.passwordValid]="p1Valid()" (keydown.enter)="p1Enter()"> <input #p1 type="text" [(ngModel)]="password1" [class.passwordInvalid]="p1Invalid()" [class.passwordValid]="p1Valid()" (keydown.enter)="p1Enter()">
</td> <div class="hint">
</tr>
<tr>
<td class="hint" colspan="2">
Mindestens {{ USER_PASSWORD_MIN_LENGTH }} Zeichen. Nicht nur Zahlen. Nicht nur Buchstaben. Mindestens {{ USER_PASSWORD_MIN_LENGTH }} Zeichen. Nicht nur Zahlen. Nicht nur Buchstaben.
</td> </div>
</tr> </div>
</div>
</div>
<tr> </div>
<th colspan="2">&nbsp;</th>
</tr>
</table>
<app-group-list [groups]="groups"></app-group-list>
</ng-container> </ng-container>