_Bastler/we_bstly-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

update registration + profile

Browse Source
This commit is contained in:
Lurkars 2021-03-20 11:12:53 +01:00
parent 78d28af492
commit 396b7786eb
6 changed files with 44 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/app/pages/register/register.component.html
View File

@ -7,7 +7,7 @@
</mat-error>
<mat-form-field>
<input matInput placeholder="{{'username' | i18n}}" formControlName="username"
[(ngModel)]="model.username">
[(ngModel)]="model.username" required>
<mat-error>
{{'username.error' | i18n}}
</mat-error>
@ -15,19 +15,9 @@
<mat-icon>autorenew</mat-icon>
</a>
</mat-form-field>
<mat-form-field>
<input matInput type="email" placeholder="{{'email' | i18n}}" formControlName="email"
[(ngModel)]="model.email">
<mat-error>
{{'email.invalid' | i18n}}
</mat-error>
</mat-form-field>
<mat-slide-toggle formControlName="primaryEmail" [(ngModel)]="model.primaryEmail" *ngIf="model.email">
{{'email.primary' | i18n}}
</mat-slide-toggle>
<mat-form-field>
<input matInput type="password" placeholder="{{'password' | i18n}}" formControlName="password"
[(ngModel)]="model.password">
[(ngModel)]="model.password" required>
<mat-error>
<div *ngFor="let error of form.get('password').errors | keyvalue">
{{'password.error.' + error.key | i18n}}<br>
@ -36,12 +26,26 @@
</mat-form-field>
<mat-form-field>
<input matInput type="password" placeholder="{{'password.confirm' | i18n}}" formControlName="password2"
[(ngModel)]="model.password2">
[(ngModel)]="model.password2" required>
<mat-error>
{{'password.not-match' | i18n}}
</mat-error>
</mat-form-field>
<mat-slide-toggle formControlName="primaryEmail" [(ngModel)]="model.primaryEmail"
(change)="onPrimaryChange()">
{{'email.primary' | i18n}} <mat-icon inline=true
matTooltip="{{'email.primary.hint' | i18n:model.username}}">info</mat-icon>
</mat-slide-toggle>
<mat-form-field *ngIf="model.primaryEmail">
<input matInput type="email" placeholder="{{'email' | i18n}}" formControlName="email"
[(ngModel)]="model.email" required>
<mat-error>
{{'email.invalid' | i18n}}
</mat-error>
</mat-form-field>
<mat-list *ngIf="items && items[0]">
<mat-list-item *ngFor="let item of items">
<mat-icon mat-list-icon>plus_one</mat-icon>

4
src/app/pages/register/register.component.scss
View File

@ -1,3 +1,7 @@
mat-form-field {
display: block;
}
mat-hint {
white-space: normal;
}

16
src/app/pages/register/register.component.ts
View File

@ -46,7 +46,7 @@ export class RegisterComponent implements OnInit {
username: ['', Validators.required],
email: ['', Validators.email],
primaryEmail: [false, Validators.nullValidator],
password: ['', Validators.required],
password: ['', Validators.nullValidator],
password2: ['', Validators.required]
}, {
validator: MatchingValidator('password', 'password2')
@ -57,6 +57,16 @@ export class RegisterComponent implements OnInit {
});
}
onPrimaryChange() {
let mailControl = this.form.get('email');
mailControl.clearAsyncValidators();
mailControl.clearValidators();
if(this.model.primaryEmail) {
mailControl.setValidators([Validators.email, Validators.required]);
}
mailControl.updateValueAndValidity();
}
genUsername() {
const config: Config = {
@ -87,10 +97,8 @@ export class RegisterComponent implements OnInit {
{"name": "publicKey", "type": "BLOB", "visibility": "PROTECTED", "blob": pubKey}
]
if(this.model.email) {
this.model.profileFields.push({"name": "email", "type": "EMAIL", "visibility": "PRIVATE", "value": this.model.email});
}
if(this.model.primaryEmail) {
this.model.profileFields.push({"name": "email", "type": "EMAIL", "visibility": "PRIVATE", "value": this.model.email});
this.model.profileFields.push({"name": "primaryEmail", "type": "BOOL", "visibility": "PRIVATE", "value": this.model.primaryEmail});
}

6
src/app/ui/profilefields/profilefield.dialog.html
View File

@ -34,6 +34,9 @@
<input matInput type="email" [(ngModel)]="profileField.value" formControlName="value"
placeholder="{{'profileField.value' | i18n}}">
</mat-form-field>
<mat-slide-toggle *ngSwitchCase="'BOOL'" [(ngModel)]="profileField.value" formControlName="value">
{{'profileField.value' | i18n}}
</mat-slide-toggle>
<mat-form-field *ngSwitchCase="'NUMBER'">
<input matInput type="number" [(ngModel)]="profileField.value" formControlName="value"
placeholder="{{'profileField.value' | i18n}}">
@ -62,5 +65,6 @@
</mat-dialog-content>
<mat-dialog-actions>
<button mat-button [mat-dialog-close]="false">{{'cancel' | i18n}}</button>
<button [disabled]="form.invalid" mat-raised-button [mat-dialog-close]="profileField" color="accent">{{'save' | i18n}}</button>
<button [disabled]="form.invalid" mat-raised-button [mat-dialog-close]="profileField" color="accent">{{'save' |
i18n}}</button>
</mat-dialog-actions>

4
src/app/ui/profilefields/profilefield.dialog.scss
View File

@ -1,3 +1,7 @@
mat-form-field {
display: block;
}
mat-slide-toggle {
margin-bottom: 24px;
}

2
src/app/ui/profilefields/profilefields.component.html
View File

@ -17,6 +17,8 @@
<span *ngSwitchCase="'NUMBER'">{{profileField.value}}</span>
<button *ngSwitchCase="'BLOB'" mat-raised-button
(click)="openBlob(profileField)">{{'profileField.openBlob' | i18n}}</button>
<mat-slide-toggle *ngSwitchCase="'BOOL'" [(ngModel)]="profileField.value" disabled>
</mat-slide-toggle>
</div>
</td>
</ng-container>