modif token service + addMenu en modal

package.json

@@ -18,6 +18,7 @@
     "@angular/platform-browser": "~13.0.0",
     "@angular/platform-browser-dynamic": "~13.0.0",
     "@angular/router": "~13.0.0",
+    "@ng-bootstrap/ng-bootstrap": "^12.0.0",
     "bootstrap": "^5.1.3",
     "bootstrap-icons": "^1.8.1",
     "jwt-decode": "^3.1.2",

src/app/components/card-menu/card-menu.component.html

@@ -2,4 +2,45 @@
 <div *ngFor="let menu of listMenus">
   <p>{{ menu.dateMenu }} {{ menu.libelle }}</p>
 </div>
+
+<ng-template #content let-modal>
+  <div class="modal-header">
+    <h4 class="modal-title" id="modal-basic-title">
+      Ajouter un menu
+    </h4>
+    <button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')">
+
+      <span aria-hidden="true">
+        ×
+      </span>
+    </button>
+  </div>
+  <div class="modal-body">
+    <form [formGroup]="menuForm">
+      <div class="form-group">
+        <label for="dateMenu">
+          Date
+        </label>
+        <div class="input-group">
+          <input id="dateMenu" class="form-control" formControlName="dateMenuFc" placeholder="yyyy-mm-dd" name="date"
+          >
+<input id="libelle" class="form-control" formControlName="libelleFc" placeholder="" name="libelle"
+>
+        </div>
+      </div>
+    </form>
+  </div>
+  <div class="modal-footer">
+    <button type="button" class="btn btn-outline-dark" (click)="modal.close(saveMenu())">
+      Save
+    </button>
+  </div>
+</ng-template>
+
+<button class="btn btn-lg btn-outline-primary" (click)="open(content)">
+ Ajouter un menu
+</button>
+
+
+
 </div>

src/app/components/card-menu/card-menu.component.ts

@@ -2,6 +2,13 @@ import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Menu } from 'src/app/models/menu';
 import { MenusService } from 'src/app/services/menus.service';
+import {NgbModal, ModalDismissReasons} from '@ng-bootstrap/ng-bootstrap';
+import {
+  FormBuilder,
+  FormControl,
+  FormGroup,
+  Validators,
+} from '@angular/forms';
 
 
 
@@ -11,16 +18,49 @@ import { MenusService } from 'src/app/services/menus.service';
   styleUrls: ['./card-menu.component.scss']
 })
 export class CardMenuComponent implements OnInit {
+closeResult = '';
 public listMenus:any[];
+public menuId : any;
+public menuForm : FormGroup;
 
   constructor(
     private menusService: MenusService,
     private router: Router,
-    private route: ActivatedRoute
+    private route: ActivatedRoute,
+    private modalService: NgbModal,
+    private fb: FormBuilder
   ) {
     this.listMenus=[];
+    this.menuId=0;
+    this.menuForm = new FormGroup({});
    }
 
+
+
+//ajout d'un menu
+saveMenu(): void {
+
+    const dateValue = this.menuForm.value['dateMenuFc'];
+    const libelleValue = this.menuForm.value['libelleFc'];
+
+    const menu: Menu = {
+      dateMenu: dateValue,
+      libelle: libelleValue,
+    };
+
+    // if (menu.dateMenu != undefined && menu.libelle != '') {
+
+    console.log(dateValue);
+      this.menusService.addMenu(menu)?.subscribe((resp) => {
+        this.router.navigate(['menu']);
+      });
+    // } else {
+    //   this.router.navigate(['menu']);
+    // }
+}
+
+
+
   ngOnInit(): void {
 //affichage des menus d'une team
 this.menusService.getMenu()?.subscribe((listMenus: any[])=>{
@@ -28,6 +68,42 @@ this.menusService.getMenu()?.subscribe((listMenus: any[])=>{
   this.listMenus=listMenus;
 });
 
+  this.menuForm = this.fb.group(
+  {
+    dateMenuFc: new FormControl('',[Validators.required]),
+    libelleFc: new FormControl('',[Validators.required]),
+  }
+);
   }
 
+open(content: any) {
+    this.modalService.open(content,
+{ariaLabelledBy: 'menu'}).result.then((result)=> {
+      this.closeResult = `Closed with: ${result}`;
+    }, (reason) => {
+      this.closeResult =
+`Dismissed ${this.getDismissReason(reason)}`;
+    });
+  }
+
+  private getDismissReason(reason: any): string {
+    if (reason === ModalDismissReasons.ESC) {
+      return 'by pressing ESC';
+    } else if (reason === ModalDismissReasons.BACKDROP_CLICK) {
+      return 'by clicking on a backdrop';
+    } else {
+      return `with: ${reason}`;
+    }
+  }
 }
+
+
+
+//modif d'un menu
+// this.menuId=this.route.snapshot.paramMap.get('id');
+// this.menusService.getMenuById(this.menuId)
+// .subscribe((this.listMenus:any)=>)
+
+//delete d'un menu
+
+

src/app/models/menu.ts

@@ -4,6 +4,4 @@ import { Team } from './team';
 export interface Menu {
   libelle: string;
   dateMenu: Date;
-  membre: Membre;
-  team: Team;
 }

src/app/pages/page-menu-semaine/page-menu-semaine.component.html

@@ -1,3 +1,29 @@
 <app-header></app-header>
-<app-side-bar></app-side-bar>
+<div class="row">
-<app-card-menu></app-card-menu>
+  <div class="col-md-auto">
+    <app-side-bar></app-side-bar>
+  </div>
+  <div class=" col compte text-center">
+    <h1>Menu de la semaine</h1>
+    <main class="contenu-compte">
+      <app-card-menu></app-card-menu>
+      <div class="d-flex justify-content-center">
+
+      </div>
+      <div class="d-flex justify-content-center">
+
+      </div>
+      <div class="d-flex justify-content-center">
+
+      </div>
+      <div class="d-flex justify-content-center">
+
+      </div>
+      <div class="d-flex justify-content-center">
+
+      </div>
+      <div class="d-flex justify-content-center">
+
+      </div>
+    </main>
+  </div>

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

@@ -1,12 +1,12 @@
 <app-header></app-header>
 <div class="signup-form text-center">
     <h1>Inscrivez-vous !</h1>
+    <label for="floatingInputcouleur">Choisissez une couleur</label>
   <main class="form-signup">
     <form (ngSubmit)="onSubmit()" [formGroup]="signupForm">
           <div class="form-floating">
             <input type="color" class="form-control" id="floatingInputcouleur" placeholder="" name="couleur"
               formControlName="couleurFc">
-
           </div>
       <div class="form-floating">
         <input

src/app/services/menus.service.ts

@@ -33,10 +33,15 @@ apiUrl: string;
     return this.http.get(`${this.apiUrl}/menus/` + id);
   }
 
-  addMenu(menu: Menu): Observable<any> {
+  addMenu(menu: Menu): Observable<any> | void {
     console.log(menu);
+    const teamId = this.tokenService.getCurrentTeamId();
+    if (teamId){
+    return this.http.post(`${this.apiUrl}/menus/add/${teamId}`, menu);
+    }else {
+      this.router.navigate(['accueil']);
+    }
 
-    return this.http.post(`${this.apiUrl}/menus/add`, menu);
   }
 
   deleteMenu(id: any): Observable<any> {

src/app/services/token.service.ts

@@ -2,6 +2,7 @@ import { Injectable } from '@angular/core';
 import { environment } from 'src/environments/environment';
 import jwt_decode from 'jwt-decode';
 
+
 @Injectable({
   providedIn: 'root'
 })
@@ -42,4 +43,17 @@ return null;
   }
 
   }
+
+public getRole(): string | null {
+const token = this.getToken();
+if(token){
+  const decodedToken = jwt_decode<any>(token);
+  const role= decodedToken.auth[0].authority;
+  return role;
+}else{
+  return null;
+}
+
+  }
+
 }