Correction of change password component and its back-office processing.

This commit is contained in:
2019-01-30 22:27:26 +01:00
parent b403e53a23
commit b502d8830c
4 changed files with 47 additions and 19 deletions

View File

@@ -2,6 +2,7 @@ package org.codiki.account;
import java.io.IOException; import java.io.IOException;
import java.security.Principal; import java.security.Principal;
import java.util.Optional;
import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpServletResponse;
@@ -10,6 +11,7 @@ import org.codiki.core.entities.dto.PasswordWrapperDTO;
import org.codiki.core.entities.dto.UserDTO; import org.codiki.core.entities.dto.UserDTO;
import org.codiki.core.entities.dto.View; import org.codiki.core.entities.dto.View;
import org.codiki.core.entities.persistence.User; import org.codiki.core.entities.persistence.User;
import org.codiki.core.services.UserService;
import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.authentication.BadCredentialsException; import org.springframework.security.authentication.BadCredentialsException;
import org.springframework.security.core.Authentication; import org.springframework.security.core.Authentication;
@@ -29,6 +31,8 @@ import com.fasterxml.jackson.annotation.JsonView;
public class AccountController { public class AccountController {
@Autowired @Autowired
private AccountService accountService; private AccountService accountService;
@Autowired
private UserService userService;
@JsonView(View.UserDTO.class) @JsonView(View.UserDTO.class)
@PostMapping("/login") @PostMapping("/login")
@@ -63,13 +67,12 @@ public class AccountController {
final HttpServletRequest pRequest, final HttpServletRequest pRequest,
final HttpServletResponse pResponse, final HttpServletResponse pResponse,
final Principal pPrincipal) throws IOException { final Principal pPrincipal) throws IOException {
// final Optional<User> connectedUser = tokenService.getAuthenticatedUserByToken(pRequest); final Optional<User> connectedUser = userService.getUserByPrincipal(pPrincipal);
// if(connectedUser.isPresent()) { if(connectedUser.isPresent()) {
// accountService.changePassword(connectedUser.get(), pPasswordWrapper, pResponse); accountService.changePassword(connectedUser.get(), pPasswordWrapper, pResponse);
// } else { } else {
// pResponse.sendError(HttpServletResponse.SC_UNAUTHORIZED); pResponse.sendError(HttpServletResponse.SC_UNAUTHORIZED);
// } }
} }
@PostMapping("/signin") @PostMapping("/signin")

View File

@@ -3,7 +3,7 @@
<h4 class="card-title">Mot de passe</h4> <h4 class="card-title">Mot de passe</h4>
<form (ngSubmit)="onSubmit()" #changePasswordForm="ngForm"> <form (ngSubmit)="onSubmit()" #changePasswordForm="ngForm">
<div class="md-form"> <div class="md-form">
<input mdbActive <input mdbInputDirective
id="oldPassword" id="oldPassword"
name="oldPassword" name="oldPassword"
type="password" type="password"
@@ -11,12 +11,12 @@
[(ngModel)]="model.oldPassword" [(ngModel)]="model.oldPassword"
#oldPassword="ngModel" #oldPassword="ngModel"
data-error="Veuillez saisir votre mot de passe actuel" data-error="Veuillez saisir votre mot de passe actuel"
data-sucess="" [validateSuccess]="false"
required /> required />
<label for="oldPassword">Mot de passe actuel</label> <label for="oldPassword">Mot de passe actuel</label>
</div> </div>
<div class="md-form"> <div class="md-form">
<input mdbActive <input mdbInputDirective
id="newPassword" id="newPassword"
name="newPassword" name="newPassword"
type="password" type="password"
@@ -24,12 +24,12 @@
[(ngModel)]="model.newPassword" [(ngModel)]="model.newPassword"
#newPassword="ngModel" #newPassword="ngModel"
data-error="Veuillez saisir votre nouveau mot de passe" data-error="Veuillez saisir votre nouveau mot de passe"
data-sucess="" [validateSuccess]="false"
required /> required />
<label for="newPassword">Nouveau mot de passe</label> <label for="newPassword">Nouveau mot de passe</label>
</div> </div>
<div class="md-form"> <div class="md-form">
<input mdbActive <input mdbInputDirective
id="confirmPassword" id="confirmPassword"
name="confirmPassword" name="confirmPassword"
type="password" type="password"
@@ -37,11 +37,11 @@
[(ngModel)]="model.confirmPassword" [(ngModel)]="model.confirmPassword"
#confirmPassword="ngModel" #confirmPassword="ngModel"
data-error="Veuillez confirmer votre nouveau mot de passe" data-error="Veuillez confirmer votre nouveau mot de passe"
data-sucess="" [validateSuccess]="false"
required /> required />
<label for="confirmPassword">Confirmation de votre mot de passe</label> <label for="confirmPassword">Confirmation de votre mot de passe</label>
</div> </div>
<div class="card red lighten-2 text-center z-depth-2" *ngIf="error"> <div id="errorMsg" class="card red lighten-2 text-center z-depth-2">
<div class="card-body"> <div class="card-body">
<p class="white-text mb-0">{{error}}</p> <p class="white-text mb-0">{{error}}</p>
</div> </div>
@@ -58,4 +58,3 @@
</form> </form>
</div> </div>
</div> </div>

View File

@@ -1,6 +1,7 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { PasswordWrapper } from '../../core/entities'; import { PasswordWrapper } from '../../core/entities';
import { ChangePasswordService } from './change-password.service'; import { ChangePasswordService } from './change-password.service';
import { RouteReuseStrategy, Router } from '@angular/router';
@Component({ @Component({
selector: 'app-change-password', selector: 'app-change-password',
@@ -13,24 +14,47 @@ import { ChangePasswordService } from './change-password.service';
.submitFormArea { .submitFormArea {
line-height: 50px; line-height: 50px;
} }
#errorMsg {
max-height: 0;
overflow: hidden;
transition: max-height 0.5s ease-out;
margin: 0;
}
`] `]
}) })
export class ChangePasswordComponent { export class ChangePasswordComponent {
model: PasswordWrapper = new PasswordWrapper('', '', ''); model: PasswordWrapper = new PasswordWrapper('', '', '');
error: string; error: string;
constructor( constructor(
private router: Router,
private changePasswordService: ChangePasswordService private changePasswordService: ChangePasswordService
) {} ) {}
onSubmit(): void { onSubmit(): void {
if (this.model.newPassword !== this.model.confirmPassword) { if (this.model.newPassword !== this.model.confirmPassword) {
this.error = 'Les mots de passe saisis ne correspondent pas.'; this.setMessage('Les mots de passe saisis ne correspondent pas.');
} else { } else {
this.changePasswordService.changePassword(this.model).subscribe(null, error => { this.changePasswordService.changePassword(this.model).subscribe(() => {
this.error = 'Le mot de passe saisi ne correspond pas au votre.'; this.router.navigate(['/accountSettings']);
}, error => {
this.setMessage('Le mot de passe saisi ne correspond pas au votre.');
}); });
} }
} }
setMessage(message: string): void {
this.error = message;
const resultMsgDiv = document.getElementById('errorMsg');
resultMsgDiv.style.maxHeight = '64px';
setTimeout(() => {
resultMsgDiv.style.maxHeight = '0px';
setTimeout(() => {
this.error = undefined;
}, 550);
}, 3000);
}
} }

View File

@@ -7,6 +7,7 @@ import { HomeComponent } from './home/home.component';
import { DisconnectionComponent } from './disconnection/disconnection.component'; import { DisconnectionComponent } from './disconnection/disconnection.component';
import { MyPostsComponent } from './posts/myPosts/my-posts.component'; import { MyPostsComponent } from './posts/myPosts/my-posts.component';
import { AccountSettingsComponent } from './account-settings/account-settings.component'; import { AccountSettingsComponent } from './account-settings/account-settings.component';
import { ChangePasswordComponent } from './account-settings/change-password/change-password.component';
export const appRoutes: Routes = [ export const appRoutes: Routes = [
@@ -16,5 +17,6 @@ export const appRoutes: Routes = [
{ path: 'disconnection', component: DisconnectionComponent }, { path: 'disconnection', component: DisconnectionComponent },
{ path: 'myPosts', component: MyPostsComponent, canActivate: [AuthGuard] }, { path: 'myPosts', component: MyPostsComponent, canActivate: [AuthGuard] },
{ path: 'accountSettings', component: AccountSettingsComponent, canActivate: [AuthGuard] }, { path: 'accountSettings', component: AccountSettingsComponent, canActivate: [AuthGuard] },
{ path: 'changePassword', component: ChangePasswordComponent, canActivate: [AuthGuard] },
{ path: '**', redirectTo: '/home' } { path: '**', redirectTo: '/home' }
]; ];