Merge pull request #102 from AlineRinquin/forgot-reset-password

refacto message alert envoi de mail + tiitre form reset password

src/app/pages/page-forgot-password/page-forgot-password.component.html

@@ -12,11 +12,16 @@
       <!-- <button class="w-100 btn btn-lg btn-success"  type="submit" [disabled]="forgotForm.invalid" routerLink="../reinitialisation-password"
         routerLinkActive="active-custom">Ré-initialiser mon mot de passe</button> -->
 
-        <button
+        <button 
         class="w-100 btn btn-lg btn-outline-success"
         type="submit"
         [disabled]="forgotForm.invalid">
         Ré-initialiser mon mot de passe
+        <div class="text-center" *ngIf="isLoading">
+          <div class="spinner-border" role="status">
+            <span class="sr-only">Loading...</span>
+          </div>
+        </div>
       </button>
     </form>
     <br/> <br/>
@@ -25,11 +30,6 @@
         {{alert.content}}
       </div>
     </div>
-<!--
-    <div *ngIf="errorForm">
-      <p class="text-danger">Il manque des informations dans le formulaire...</p>
-    </div> -->
   </main>
 </div>
 
-

src/app/pages/page-forgot-password/page-forgot-password.component.ts

@@ -15,10 +15,12 @@ export class PageForgotPasswordComponent implements OnInit {
 
   alert : any;
   isShow : boolean;
+  isLoading : boolean;
 
   constructor(private authService: AuthService, private router: Router, private mailService: MailService,) {
     this.alert = "";
     this.isShow = false;
+    this.isLoading = false;
   }
 
   ngOnInit(): void {}
@@ -36,26 +38,36 @@ export class PageForgotPasswordComponent implements OnInit {
         passwordConfirm: ""
       };
 
-    console.log(membre);
+    //console.log(membre);
 
 
     this.authService.forgotPassword(membre).subscribe(
       {
         next: result => {
-          this.alert={"type":"success", "content":"Un mail à été envoyé !"};
-          this.isShow = true;
           const mail: Mail = {
             recipient: submittedForm.form.value.email,
             subject: "Votre mot de passe Organizee",
-            //message: 'Votre mot de passe'
             message: `
             Bonjour!\n
             Vous avez fait une demande de ré-initialisation de mot de passe. \n
             Cliquez sur le lien pour définir un nouveau mot de passe: \n
             Lien  : http://192.168.1.16:4200/reinitialisation-password/${result}`
           };
-          this.mailService.envoiMailText(mail)?.subscribe((respMail) =>{
-            console.log("Mail envoyé");
+          this.isLoading = true;
+          this.mailService.envoiMailText(mail).subscribe(
+            {
+              next: respMail => {
+                //console.log("Mail envoyé");
+                this.alert={"type":"success", "content":"Le mail à été envoyé !"};
+                this.isShow = true;  
+                this.isLoading = false;            
+              },
+              error: err => {
+                this.alert={"type":"danger", "content":"Echec lors de l'envoi de mail"};
+                this.isShow = true;
+                this.isLoading = false;            
+              },
+              complete: () => console.log('DONE!')
           })
         },
         error: err => {

src/app/pages/page-reset-password/page-reset-password.component.html

@@ -2,7 +2,7 @@
 <div class="reset-form text-center">
   <main class="form-reset">
     <form (ngSubmit)="onSubmit()" [formGroup]="resetForm">
-      <h3>Entrez ici votre email et votre nouveau mot de passe</h3>
+      <h3>Entrez ici votre nouveau mot de passe</h3>
       <div class="form-floating">
         <input
           type="password"

src/app/services/mail.service.ts

@@ -18,7 +18,7 @@ export class MailService {
     this.tokenKey = environment.tokenKey;
   }
 
-  envoiMailText(mail: Mail): Observable<any> | void{
+  envoiMailText(mail: Mail): Observable<any>{
     return this.http.post(`${this.apiUrl}/sendmail/text`, mail, {
       responseType: "text"
     });