smileys avec bdd

src/app/components/humeur/humeur.component.html

@@ -2,7 +2,12 @@
 <div>
 
     <h2>Mon humeur :</h2>
-    
+
+  <app-alert
+  *ngIf="isShow"
+  [alert]="alert"
+  (eventClose)="onClickCloseAlert()"
+></app-alert>
     
     
     

src/app/components/humeur/humeur.component.scss

@@ -6,6 +6,7 @@ p>img {
 img {
 	width: 50px;
 	height: 50px;
+	margin: 8px;
 }
 
 .humeur {
@@ -13,6 +14,7 @@ display: inline;
 }
 
 div {
-	background-color: #87AFC7;
+width: 400px;
+background-color: #87AFC7;
 text-align: center;
 }

src/app/components/humeur/humeur.component.ts

@@ -1,4 +1,6 @@
 import { Component, OnInit } from '@angular/core';
+import { MembreService } from 'src/app/services/membre.service';
+import { TokenService } from 'src/app/services/token.service';
 
 @Component({
   selector: 'app-humeur',
@@ -6,10 +8,10 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./humeur.component.scss']
 })
 export class HumeurComponent implements OnInit {
-
-
-  monHumeurLien! : string[];
- monHumeurTitle! : string[] ;
+monHumeurLien! : string[];
+monHumeurTitle! : string[] ;
+isShow: boolean;
+alert: any;
 
 
   tabHumeur= [
@@ -19,18 +21,48 @@ export class HumeurComponent implements OnInit {
       { title : "Je suis en colère", lien : "assets/images/emoticon-insulter.png"},
       { title : "Je suis en joie", lien : "assets/images/emoticon-feter.png"}  ]
 
-  constructor() {    }
+  constructor(private membreService: MembreService, private tokenService: TokenService) { 
+    this.isShow= false;
+    this.alert="";
+    
+     }
 
-  ngOnInit(): void { }
+  ngOnInit(): void { 
+    const userId = this.tokenService.getCurrentMembreId();
+    this.membreService.getMembreId(userId).subscribe({
+      next: result => {
+    this.monHumeurTitle= [this.tabHumeur[result.smiley].title];
+    this.monHumeurLien= [this.tabHumeur[result.smiley].lien];
+     //  console.log("resultat smiley ", result.smiley);
+      }
+    })
+   }
 
 onChoixHumeur(numero: number){
  this.monHumeurTitle= [this.tabHumeur[numero].title];
  this.monHumeurLien= [this.tabHumeur[numero].lien];
 
+ this.membreService.updateHumeur(numero)?.subscribe(
+  {
+    next: result => {
+      this.alert={"type":"success", "content":"L'humeur a bien été modifiée"};
+      this.isShow = true;
+    },
+    error: err => {
+      this.alert={"type":"danger", "content":"Problème lors de la modification de l'humeur"};
+      this.isShow = true;
+    },
+    complete: () => console.log('DONE!')
+  }
+);
+
 console.log("humeur titre est : ", this.monHumeurTitle);
 console.log("humeur lien est : ", this.monHumeurLien);
-console.log("index humeur est : ", numero );
-
-
+console.log("index humeur est : ", numero);
 }
+
+onClickCloseAlert(){
+this.isShow=!this.isShow;
 }
+
+}

src/app/services/membre.service.ts

@@ -57,4 +57,16 @@ export class MembreService {
       this.router.navigate(['accueil']);
     }
 }
+
+updateHumeur(numero : number) : Observable<any> | void {
+  const userId = this.tokenService.getCurrentMembreId();
+  if (userId){
+  return this.http.put(`${this.apiUrl}/membres/update/smiley/${userId}`, numero);
+}else {
+    this.router.navigate(['accueil']);
+  }
 }
+
+}
+
+