feature(account): add register functionality

pull/1573/head
TheDiaval 6 years ago
parent 33550ada98
commit aef116395f

@ -3,22 +3,28 @@
<abp-tenant-box></abp-tenant-box>
<div class="abp-account-container">
<h2>Register</h2>
<h2>{{ 'AbpAccount::Register' | abpLocalization }}</h2>
<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate>
<div class="form-group">
<label for="input-user-name">User name</label><span> * </span
<label for="input-user-name">{{ 'AbpAccount::UserName' | abpLocalization }}</label
><span> * </span
><input autofocus type="text" id="input-user-name" class="form-control" formControlName="username" />
</div>
<div class="form-group">
<label for="input-email-address">Email address</label><span> * </span
><input type="email" id="input-email-address" class="form-control" formControlName="email" />
<label for="input-email-address">{{ 'AbpAccount::EmailAddress' | abpLocalization }}</label
><span> * </span><input type="email" id="input-email-address" class="form-control" formControlName="email" />
</div>
<div class="form-group">
<label for="input-password">Password</label><span> * </span
><input type="password" id="input-password" class="form-control" formControlName="password" />
<label for="input-password">{{ 'AbpAccount::Password' | abpLocalization }}</label
><span> * </span><input type="password" id="input-password" class="form-control" formControlName="password" />
</div>
<button type="submit" class="btn btn-primary">Register</button>
<button [disabled]="inProgress" type="submit" name="Action" value="Register" class="btn btn-primary">
{{ 'AbpAccount::Register' | abpLocalization }}
</button>
</form>
<div style="padding-top: 20px">
<a routerLink="/account/login">{{ 'AbpAccount::Login' | abpLocalization }}</a>
</div>
</div>
</div>
</div>

@ -1,8 +1,12 @@
import { ToasterService } from '@abp/ng.theme.shared';
import { Component } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { validatePassword } from '@ngx-validate/core';
import { OAuthService } from 'angular-oauth2-oidc';
import { throwError } from 'rxjs';
import { catchError, finalize, take } from 'rxjs/operators';
import snq from 'snq';
import { RegisterRequest } from '../../models';
import { AccountService } from '../../services/account.service';
const { maxLength, minLength, required, email } = Validators;
@ -13,7 +17,9 @@ const { maxLength, minLength, required, email } = Validators;
export class RegisterComponent {
form: FormGroup;
constructor(private fb: FormBuilder, private oauthService: OAuthService, private router: Router) {
inProgress: boolean;
constructor(private fb: FormBuilder, private accountService: AccountService, private toasterService: ToasterService) {
this.form = this.fb.group({
username: ['', [required, maxLength(255)]],
password: [
@ -26,5 +32,26 @@ export class RegisterComponent {
onSubmit() {
if (this.form.invalid) return;
this.inProgress = true;
const newUser = {
userName: this.form.get('username').value,
password: this.form.get('password').value,
emailAddress: this.form.get('email').value,
appName: 'angular',
} as RegisterRequest;
this.accountService
.register(newUser)
.pipe(
take(1),
catchError(err => {
this.toasterService.error(snq(() => err.error.error_description, 'An error occured.'), 'Error');
return throwError(err);
}),
finalize(() => (this.inProgress = false)),
)
.subscribe();
}
}

@ -0,0 +1,29 @@
export interface RegisterRequest {
userName: string;
emailAddress: string;
password: string;
appName?: string;
}
export interface RegisterResponse {
tenantId: string;
userName: string;
name: string;
surname: string;
email: string;
emailConfirmed: boolean;
phoneNumber: string;
phoneNumberConfirmed: boolean;
twoFactorEnabled: boolean;
lockoutEnabled: boolean;
lockoutEnd: string;
concurrencyStamp: string;
isDeleted: boolean;
deleterId: string;
deletionTime: string;
lastModificationTime: string;
lastModifierId: string;
creationTime: string;
creatorId: string;
id: string;
}
Loading…
Cancel
Save