From 732353f5bdb5d05633bbbd4761c5354cb25534af Mon Sep 17 00:00:00 2001 From: smuddyx Date: Fri, 24 Apr 2020 15:37:27 +0200 Subject: [PATCH] reset password --- .../modules/user/login/login.component.html | 1 + src/app/modules/user/login/login.component.ts | 6 ++-- .../modules/user/logout/logout.component.ts | 6 ++-- .../password-send.component.html | 4 +++ .../password-send.component.less | 0 .../password-send.component.spec.ts | 25 +++++++++++++ .../password-send/password-send.component.ts | 16 +++++++++ .../user/password/password.component.html | 15 ++++++++ .../user/password/password.component.less | 8 +++++ .../user/password/password.component.spec.ts | 25 +++++++++++++ .../user/password/password.component.ts | 36 +++++++++++++++++++ src/app/modules/user/user-routing.module.ts | 10 ++++++ src/app/modules/user/user.module.ts | 4 ++- src/app/services/user.service.ts | 12 +++++++ 14 files changed, 161 insertions(+), 7 deletions(-) create mode 100644 src/app/modules/user/password-send/password-send.component.html create mode 100644 src/app/modules/user/password-send/password-send.component.less create mode 100644 src/app/modules/user/password-send/password-send.component.spec.ts create mode 100644 src/app/modules/user/password-send/password-send.component.ts create mode 100644 src/app/modules/user/password/password.component.html create mode 100644 src/app/modules/user/password/password.component.less create mode 100644 src/app/modules/user/password/password.component.spec.ts create mode 100644 src/app/modules/user/password/password.component.ts diff --git a/src/app/modules/user/login/login.component.html b/src/app/modules/user/login/login.component.html index 530c650..0eb43a0 100644 --- a/src/app/modules/user/login/login.component.html +++ b/src/app/modules/user/login/login.component.html @@ -11,6 +11,7 @@ +

{{errorMessage|authMessage}}

diff --git a/src/app/modules/user/login/login.component.ts b/src/app/modules/user/login/login.component.ts index a4dc39b..837f6cb 100644 --- a/src/app/modules/user/login/login.component.ts +++ b/src/app/modules/user/login/login.component.ts @@ -1,7 +1,7 @@ import {Component, OnInit} from '@angular/core'; import {FormControl, FormGroup, Validators} from '@angular/forms'; -import {AngularFireAuth} from '@angular/fire/auth'; import {Router} from '@angular/router'; +import {UserService} from '../../../services/user.service'; @Component({ selector: 'app-login', @@ -12,7 +12,7 @@ export class LoginComponent implements OnInit { public form: FormGroup; public errorMessage: string; - constructor(public afAuth: AngularFireAuth, private router: Router) { + constructor(private userService: UserService, private router: Router) { } ngOnInit() { @@ -26,7 +26,7 @@ export class LoginComponent implements OnInit { this.form.updateValueAndValidity(); if (this.form.valid) { try { - await this.afAuth.auth.signInWithEmailAndPassword(this.form.value.user, this.form.value.pass); + await this.userService.login(this.form.value.user, this.form.value.pass); await this.router.navigateByUrl('/'); } catch (ex) { this.errorMessage = ex.code; diff --git a/src/app/modules/user/logout/logout.component.ts b/src/app/modules/user/logout/logout.component.ts index 0acb371..b9d4e11 100644 --- a/src/app/modules/user/logout/logout.component.ts +++ b/src/app/modules/user/logout/logout.component.ts @@ -1,6 +1,6 @@ import {AfterViewInit, Component} from '@angular/core'; -import {AngularFireAuth} from '@angular/fire/auth'; import {Router} from '@angular/router'; +import {UserService} from '../../../services/user.service'; @Component({ selector: 'app-logout', @@ -8,11 +8,11 @@ import {Router} from '@angular/router'; styleUrls: ['./logout.component.less'] }) export class LogoutComponent implements AfterViewInit { - constructor(public afAuth: AngularFireAuth, private router: Router) { + constructor(private userService: UserService, private router: Router) { } public async ngAfterViewInit() { - await this.afAuth.auth.signOut(); + await this.userService.logout(); await this.router.navigateByUrl('/'); } } diff --git a/src/app/modules/user/password-send/password-send.component.html b/src/app/modules/user/password-send/password-send.component.html new file mode 100644 index 0000000..3a80618 --- /dev/null +++ b/src/app/modules/user/password-send/password-send.component.html @@ -0,0 +1,4 @@ + + Eine E-Mail mit dem neuen Passwort wurde gesendet. + Darin ist der link enthalten, über den das neue Passwort eingegeben werden kann. + diff --git a/src/app/modules/user/password-send/password-send.component.less b/src/app/modules/user/password-send/password-send.component.less new file mode 100644 index 0000000..e69de29 diff --git a/src/app/modules/user/password-send/password-send.component.spec.ts b/src/app/modules/user/password-send/password-send.component.spec.ts new file mode 100644 index 0000000..ff31244 --- /dev/null +++ b/src/app/modules/user/password-send/password-send.component.spec.ts @@ -0,0 +1,25 @@ +import {async, ComponentFixture, TestBed} from '@angular/core/testing'; + +import {PasswordSendComponent} from './password-send.component'; + +describe('PasswordSendComponent', () => { + let component: PasswordSendComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [PasswordSendComponent] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PasswordSendComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/modules/user/password-send/password-send.component.ts b/src/app/modules/user/password-send/password-send.component.ts new file mode 100644 index 0000000..8742a6c --- /dev/null +++ b/src/app/modules/user/password-send/password-send.component.ts @@ -0,0 +1,16 @@ +import {Component, OnInit} from '@angular/core'; + +@Component({ + selector: 'app-password-send', + templateUrl: './password-send.component.html', + styleUrls: ['./password-send.component.less'] +}) +export class PasswordSendComponent implements OnInit { + + constructor() { + } + + ngOnInit(): void { + } + +} diff --git a/src/app/modules/user/password/password.component.html b/src/app/modules/user/password/password.component.html new file mode 100644 index 0000000..c6cc203 --- /dev/null +++ b/src/app/modules/user/password/password.component.html @@ -0,0 +1,15 @@ + +
+ + E-Mail Addresse + + + + + +

{{errorMessage|authMessage}}

+
+ +
+ +
diff --git a/src/app/modules/user/password/password.component.less b/src/app/modules/user/password/password.component.less new file mode 100644 index 0000000..54bc57f --- /dev/null +++ b/src/app/modules/user/password/password.component.less @@ -0,0 +1,8 @@ +.form { + display: grid; +} + +p.error { + margin: 8px 10px; + color: darkred; +} diff --git a/src/app/modules/user/password/password.component.spec.ts b/src/app/modules/user/password/password.component.spec.ts new file mode 100644 index 0000000..a1a29fb --- /dev/null +++ b/src/app/modules/user/password/password.component.spec.ts @@ -0,0 +1,25 @@ +import {async, ComponentFixture, TestBed} from '@angular/core/testing'; + +import {PasswordComponent} from './password.component'; + +describe('PasswordComponent', () => { + let component: PasswordComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [PasswordComponent] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PasswordComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/modules/user/password/password.component.ts b/src/app/modules/user/password/password.component.ts new file mode 100644 index 0000000..26bd106 --- /dev/null +++ b/src/app/modules/user/password/password.component.ts @@ -0,0 +1,36 @@ +import {Component, OnInit} from '@angular/core'; +import {FormControl, FormGroup, Validators} from '@angular/forms'; +import {Router} from '@angular/router'; +import {UserService} from '../../../services/user.service'; + +@Component({ + selector: 'app-password', + templateUrl: './password.component.html', + styleUrls: ['./password.component.less'] +}) +export class PasswordComponent implements OnInit { + public form: FormGroup; + public errorMessage: string; + + constructor(public userService: UserService, private router: Router) { + } + + public ngOnInit(): void { + this.form = new FormGroup({ + user: new FormControl(null, [Validators.required, Validators.email]) + }); + } + + public async onResetPassword() { + this.form.updateValueAndValidity(); + if (this.form.valid) { + try { + await this.userService.changePassword(this.form.value.user); + await this.router.navigateByUrl('/user/password-send'); + } catch (ex) { + this.errorMessage = ex.code; + } + } + } + +} diff --git a/src/app/modules/user/user-routing.module.ts b/src/app/modules/user/user-routing.module.ts index a291237..f68d4aa 100644 --- a/src/app/modules/user/user-routing.module.ts +++ b/src/app/modules/user/user-routing.module.ts @@ -4,6 +4,8 @@ import {LoginComponent} from './login/login.component'; import {InfoComponent} from './info/info.component'; import {LogoutComponent} from './logout/logout.component'; import {AngularFireAuthGuard, redirectUnauthorizedTo} from '@angular/fire/auth-guard'; +import {PasswordComponent} from './password/password.component'; +import {PasswordSendComponent} from './password-send/password-send.component'; const routes: Routes = [ @@ -20,6 +22,14 @@ const routes: Routes = [ path: 'logout', component: LogoutComponent }, + { + path: 'password', + component: PasswordComponent + }, + { + path: 'password-send', + component: PasswordSendComponent + }, { path: 'info', component: InfoComponent, diff --git a/src/app/modules/user/user.module.ts b/src/app/modules/user/user.module.ts index bb7169a..8575289 100644 --- a/src/app/modules/user/user.module.ts +++ b/src/app/modules/user/user.module.ts @@ -13,10 +13,12 @@ import {InfoComponent} from './info/info.component'; import {LogoutComponent} from './logout/logout.component'; import {RolePipe} from './info/role.pipe'; import {MatSelectModule} from '@angular/material/select'; +import {PasswordComponent} from './password/password.component'; +import {PasswordSendComponent} from './password-send/password-send.component'; @NgModule({ - declarations: [LoginComponent, AuthMessagePipe, InfoComponent, LogoutComponent, RolePipe], + declarations: [LoginComponent, AuthMessagePipe, InfoComponent, LogoutComponent, RolePipe, PasswordComponent, PasswordSendComponent], imports: [ CommonModule, UserRoutingModule, diff --git a/src/app/services/user.service.ts b/src/app/services/user.service.ts index a3108dc..3ff3a9a 100644 --- a/src/app/services/user.service.ts +++ b/src/app/services/user.service.ts @@ -29,4 +29,16 @@ export class UserService { public async update$(uid: string, data: Partial): Promise { await this.db.doc('users/' + uid).update(data); } + + public async login(user: string, password: string): Promise { + await this.afAuth.auth.signInWithEmailAndPassword(user, password); + } + + public async logout(): Promise { + await this.afAuth.auth.signOut(); + } + + public async changePassword(email: string): Promise { + await this.afAuth.auth.sendPasswordResetEmail(email); + } }