Merge pull request #14 from AlineRinquin/blandine

Blandine

.vscode/settings.json

@@ -1,5 +1,2 @@
 {
-    "workbench.colorCustomizations": {
-        "titleBar.activeBackground": "#4950a1"
-    }
 }

src/app/app.module.ts

@@ -37,6 +37,7 @@ import { PageAjoutContactComponent } from './pages/page-ajout-contact/page-ajout
 import { PageModifierContactComponent } from './pages/page-modifier-contact/page-modifier-contact.component';
 import { PageCreationTeamComponent } from './pages/page-creation-team/page-creation-team.component';
 
+
 @NgModule({
   declarations: [
     AppComponent,
@@ -71,6 +72,7 @@ import { PageCreationTeamComponent } from './pages/page-creation-team/page-creat
     PageAjoutContactComponent,
     PageModifierContactComponent,
     PageCreationTeamComponent,
+
   ],
   imports: [
     BrowserModule,

src/app/models/membre.ts

@@ -4,6 +4,7 @@ export interface Membre {
   email: string;
   password: string;
   dateNaissance: Date;
+  couleur: string;
   passwordConfirm: string;
   roleList: string[];
 }

src/app/pages/page-add-member/page-add-member.component.html

@@ -5,6 +5,11 @@
       <form  (ngSubmit)="onSubmit()" [formGroup]="addMemberForm">
           <h1>J'inscris un nouveau membre</h1>
           <div class="form-floating">
+            <input type="color" class="form-control" id="floatingInputcouleur" placeholder="" name="couleur"
+                    formControlName="couleurFc">
+                  <label for="floatingInputcouleur">Choisissez une couleur !</label>
+                  </div>
+          <!-- <div class="form-floating">
             <input type="text"
                     class="form-control"
                     id="floatingInputlastName"
@@ -14,7 +19,7 @@
                     [ngClass]="{'is-valid' : addMemberForm.controls['lastNameFc'].touched && addMemberForm.controls['lastNameFc'].valid,
                                 'is-invalid':  addMemberForm.controls['lastNameFc'].touched && !addMemberForm.controls['lastNameFc'].valid}">
             <label for="floatingInputlastName">Avatar</label>
-        </div>
+        </div> -->
           <div class="form-floating">
               <input type="text"
                       class="form-control"
@@ -48,19 +53,6 @@
                                   'is-invalid':  addMemberForm.controls['dateNaissanceFc'].touched && !addMemberForm.controls['dateNaissanceFc'].valid}">
               <label for="floatingInputfirstName">Date de naissance</label>
           </div>
-          <div class="form-floating">
-              <select type="text"
-                      class="form-control"
-                      id="floatingInputprofil"
-                      name="profil"
-                      formControlName="profilFc"
-                      [ngClass]="{'is-valid' : addMemberForm.controls['profilFc'].touched && addMemberForm.controls['profilFc'].valid,
-                                  'is-invalid':  addMemberForm.controls['profilFc'].touched && !addMemberForm.controls['profilFc'].valid}">
-                              <option>Adulte</option>
-                              <option>Enfant</option>
-              </select>
-              <label for="floatingInputfirstName">Profil</label>
-          </div>
              <div class="form-floating">
               <input type="email"
                       class="form-control"

src/app/pages/page-add-member/page-add-member.component.ts

@@ -27,7 +27,7 @@ export class PageAddMemberComponent implements OnInit {
         firstNameFc: new FormControl('', [Validators.required]),
         lastNameFc: new FormControl('', [Validators.required]),
         dateNaissanceFc: new FormControl('', [Validators.required]),
-        profilFc: new FormControl('', [Validators.required]),
+        couleurFc: new FormControl('', [Validators.required]),
         emailFc: new FormControl('', [
           Validators.email,
           Validators.required,
@@ -56,16 +56,16 @@ export class PageAddMemberComponent implements OnInit {
     const emailValue = this.addMemberForm.value['emailFc'];
     const passwordValue = this.addMemberForm.value['passwordFc'];
     const dateNaissanceValue = this.addMemberForm.value['dateNaissanceFc'];
-    const teamNameValue = this.addMemberForm.value['teamNameFc'];
+    const couleurValue = this.addMemberForm.value['couleurFc'];
-    const profilValue = this.addMemberForm.value['profilFc'];
     const passwordConfirmValue = this.addMemberForm.value['passwordConfirmFc'];
-    const teamValue = [''];
+
 
     const membre: Membre = {
       nom: firstNameValue,
       prenom: lastNameValue,
       email: emailValue,
       password: passwordValue,
+      couleur: couleurValue,
       dateNaissance: dateNaissanceValue,
       passwordConfirm: passwordConfirmValue,
       roleList: ["ROLE_PARENT"]

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

@@ -1,7 +1,8 @@
 <app-header></app-header>
-<div class="signin-form text-center">
+<div class="reset-form text-center">
-  <main class="form-signin">
+  <main class="form-reset">
     <form (ngSubmit)="onSubmit(resetForm)" #resetForm="ngForm">
+      <h3>Entrez ici votre email et votre nouveau mot de passe</h3>
       <div class="form-floating">
         <input type="email" class="form-control" id="floatingEmail" placeholder="" name="email" ngModel required
           [ngClass]="{'is-valid': resetForm.form.touched && resetForm.form.value['email'] != '' ,
@@ -14,9 +15,7 @@
                                     'is-invalid': resetForm.form.touched && resetForm.form.value['password'] == ''}">
         <label for="floatingPassword">Mot de passe</label>
       </div>
-
+    <button class="w-100 btn btn-outline-success" type="submit" [disabled]="resetForm.invalid">Enregistrer</button>
-      <button class="w-100 btn btn-lg btn-success" type="submit" [disabled]="resetForm.invalid">Se connecter</button>
-
 
     </form>
 

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

@@ -0,0 +1,42 @@
+.reset-form {
+  height: 100vh;
+  padding-top: 40px;
+  background-color: #ffff;
+}
+
+.form-reset {
+  width: 100%;
+  max-width: 330px;
+  padding: 15px;
+  margin: auto;
+  border: solid 1px;
+  border-radius: 10px;
+  background-color: #fcddec;
+  border-color: #ef5da8;
+}
+
+.form-reset .checkbox {
+  font-weight: 400;
+}
+
+.form-reset .form-floating:focus-within {
+  z-index: 2;
+}
+
+.form-reset input[type="email"] {
+  margin-bottom: -1px;
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.form-reset input[type="password"] {
+  margin-bottom: 10px;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.btn-outline-success {
+  background-color: #ffff;
+  color: #ef5da8 !important;
+  border-color: #ef5da8 !important;
+}

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

@@ -1,4 +1,7 @@
 import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { AuthService } from 'src/app/services/auth.service';
+
 
 @Component({
   selector: 'app-page-reset-password',
@@ -6,10 +9,8 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./page-reset-password.component.scss']
 })
 export class PageResetPasswordComponent implements OnInit {
-  authService: any;
-  router: any;
 
-  constructor() { }
+  constructor(private authService: AuthService, private router: Router,) { }
 
   ngOnInit(): void { }
 
@@ -19,7 +20,8 @@ export class PageResetPasswordComponent implements OnInit {
     const email = submittedForm.form.value['email'];
     console.log(email);
     this.authService.resetPassword(email, password).subscribe((resp: any) => {
-        this.router.navigate(['tableau-de-bord']);
+      window.alert("Votre mot de passe est bien ré-initialisé !")
+      this.router.navigate(['accueil']);
 
     });
   }

src/app/pages/page-signup/page-signup.component.html

@@ -1,8 +1,13 @@
 <app-header></app-header>
 <div class="signup-form text-center">
+    <h1>Inscrivez-vous !</h1>
   <main class="form-signup">
     <form (ngSubmit)="onSubmit()" [formGroup]="signupForm">
-      <h1>Inscrivez-vous !</h1>
+          <div class="form-floating">
+            <input type="color" class="form-control" id="floatingInputcouleur" placeholder="" name="couleur"
+              formControlName="couleurFc">
+
+          </div>
       <div class="form-floating">
         <input
           type="text"
@@ -20,7 +25,7 @@
               !signupForm.controls['lastNameFc'].valid
           }"
         />
-        <label for="floatingInputlastName">Nom</label>
+        <label for="floatingInputlastName">VOTRE NOM</label>
       </div>
       <div class="form-floating">
         <input
@@ -39,7 +44,7 @@
               !signupForm.controls['firstNameFc'].valid
           }"
         />
-        <label for="floatingInputfirstName">Prénom</label>
+        <label for="floatingInputfirstName">VOTRE PRENOM</label>
       </div>
       <div class="form-floating">
         <input
@@ -58,13 +63,13 @@
               !signupForm.controls['dateNaissanceFc'].valid
           }"
         />
-        <label for="floatingInputfirstName">Date de naissance</label>
+        <label for="floatingInputdateNaissance">VOTRE DATE DE NAISSANCE</label>
       </div>
       <div class="form-floating">
         <input
           type="email"
           class="form-control"
-          id="floatingInput"
+          id="floatingInputemail"
           placeholder=""
           name="email"
           formControlName="emailFc"
@@ -77,7 +82,7 @@
               !signupForm.controls['emailFc'].valid
           }"
         />
-        <label for="floatingInput">Adresse email</label>
+        <label for="floatingInputemail">VOTRE EMAIL</label>
       </div>
       <div class="form-floating">
         <input
@@ -96,11 +101,11 @@
               !signupForm.controls['passwordFc'].valid
           }"
         />
-        <label for="floatingPassword">Mot de passe</label>
+        <label for="floatingPassword">MOT DE PASSE</label>
       </div>
       <div class="form-floating">
         <input
-          type="passwordConfirm"
+          type="password"
           class="form-control"
           id="floatingpasswordConfirm"
           placeholder=""
@@ -115,15 +120,15 @@
               !signupForm.controls['passwordConfirmFc'].valid
           }"
         />
-        <label for="floatingPassword">Confirmer mot de passe</label>
+        <label for="floatingPasswordConfirm">CONFIRMEZ VOTRE MOT DE PASSE</label>
       </div>
 
       <button
-        class="w-100 btn btn-lg btn-success"
+        class="w-100 btn btn-lg btn-outline-success"
         type="submit"
         [disabled]="signupForm.invalid"
       >
-        Je m'inscris !
+        CREER MON COMPTE
       </button>
     </form>
   </main>

src/app/pages/page-signup/page-signup.component.scss

@@ -8,7 +8,13 @@
   width: 100%;
   max-width: 330px;
   padding: 15px;
-  margin: auto;
+  margin-top: 50px;
+  margin-left: auto;
+  margin-right: auto;
+  border: solid 1px;
+  border-radius: 10px;
+  background-color: #fcddec;
+  border-color: #ef5da8;
 }
 
 .form-signup .checkbox {
@@ -20,7 +26,37 @@
 }
 
 .form-signup input[type="email"] {
-  margin-bottom: -1px;
+  margin-bottom: 10px;
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.form-signup input[type="color"] {
+  border: none;
+  margin-bottom: 10px;
+  margin-top: -70px;
+  margin-left: 100px;
+  border-radius: 50%;
+  width: 100px;
+  height: 100px;
+}
+
+.form-signup input[type="color"]::-webkit-color-swatch {
+  border: none;
+  margin-top: -15px;
+  border-radius: 80%;
+  width: 80px;
+  height: 80px;
+}
+
+.form-signup input[type="text"] {
+  margin-bottom: 10px;
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.form-signup input[type="date"] {
+  margin-bottom: 10px;
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
 }
@@ -30,3 +66,10 @@
   border-top-left-radius: 0;
   border-top-right-radius: 0;
 }
+
+.btn-outline-success {
+  margin-top: 10px;
+  background-color: #ffff;
+  color: #ef5da8 !important;
+  border-color: #ef5da8 !important;
+}

src/app/pages/page-signup/page-signup.component.ts

@@ -32,6 +32,7 @@ export class PageSignupComponent implements OnInit {
         lastNameFc: new FormControl('', [Validators.required]),
         dateNaissanceFc: new FormControl('', [Validators.required]),
         roleFc: new FormControl(''),
+        couleurFc: new FormControl('', Validators.required),
         emailFc: new FormControl('', [
           Validators.email,
           Validators.required,
@@ -61,6 +62,7 @@ export class PageSignupComponent implements OnInit {
     const passwordValue = this.signupForm.value['passwordFc'];
     const dateNaissanceValue = this.signupForm.value['dateNaissanceFc'];
     const passwordConfirmValue = this.signupForm.value['passwordConfirmFc'];
+    const couleurValue = this.signupForm.value['couleurFc'];
     const roleValue = ['ROLE_PARENT'];
 
     const membre: Membre = {
@@ -68,6 +70,7 @@ export class PageSignupComponent implements OnInit {
       prenom: prenomValue,
       email: emailValue,
       password: passwordValue,
+      couleur: couleurValue,
       dateNaissance: dateNaissanceValue,
       passwordConfirm: passwordConfirmValue,
       roleList: roleValue,

src/app/services/auth.service.ts

@@ -53,13 +53,13 @@ export class AuthService {
     const body = {
       email: email,
     };
-    return this.http.post(`${this.apiUrl}/membres/forgot-password`, body);
+    return this.http.get(`${this.apiUrl}/membres/forgot-password`);
   }
 
     resetPassword(email: string, password: string): Observable<any> {
     const body = password;
      console.log(password);
-   return this.http.post(`${this.apiUrl}/membres/reset-password/${email}`, body);
+   return this.http.put(`${this.apiUrl}/membres/reset-password/${email}`, body);
   }
 
   creationTeam(team: Team): Observable<any> {