Merge branch 'dev' into aline

src/app/app.module.ts

@@ -43,6 +43,7 @@ import localeFr from '@angular/common/locales/fr';
 import { CardAvatarComponent } from './components/card-avatar/card-avatar.component';
 import { HumeurComponent } from './components/humeur/humeur.component';
 import { DeconnexionComponent } from './components/deconnexion/deconnexion.component';
+import { AlertComponent } from './components/alert/alert.component';
 registerLocaleData(localeFr)
 
 @NgModule({
@@ -82,8 +83,8 @@ registerLocaleData(localeFr)
     PageUpdateAccountComponent,
     CardAvatarComponent,
     DeconnexionComponent,
-    HumeurComponent
+    HumeurComponent,
-
+    AlertComponent
   ],
   imports: [
     BrowserModule,

src/app/components/alert/alert.component.html

@@ -0,0 +1,4 @@
+<div class="alert alert-{{alert.type}} alert-dismissible fade show" role="alert" style="position:absolute;z-index:9999;top:10px;right:50%;transform: translateX(50%);width:600px; text-align:center;">
+    {{alert.content}}
+    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close" (click)="onClickCloseAlert()"></button>
+  </div>

src/app/components/alert/alert.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AlertComponent } from './alert.component';
+
+describe('AlertComponent', () => {
+  let component: AlertComponent;
+  let fixture: ComponentFixture<AlertComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ AlertComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AlertComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/alert/alert.component.ts

@@ -0,0 +1,20 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+
+@Component({
+  selector: 'app-alert',
+  templateUrl: './alert.component.html',
+  styleUrls: ['./alert.component.scss']
+})
+export class AlertComponent implements OnInit {
+  @Input() alert:any;
+  @Output() eventClose = new EventEmitter<string>();
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+  
+  onClickCloseAlert(){
+    //console.log('fermeture from component');
+    this.eventClose.emit('true');
+  }
+}

src/app/components/calendrier/calendrier.component.html

@@ -1 +1 @@
-<p>calendrier works!</p>
+<daypilot-calendar [config]="config" [events]="events"></daypilot-calendar>

src/app/components/calendrier/calendrier.component.ts

@@ -1,4 +1,7 @@
 import { Component, OnInit } from '@angular/core';
+import { DayPilot } from "@daypilot/daypilot-lite-angular";
+import { EvenementService } from 'src/app/services/evenement.service';
+import { TokenService } from 'src/app/services/token.service';
 
 @Component({
   selector: 'app-calendrier',
@@ -7,9 +10,48 @@ import { Component, OnInit } from '@angular/core';
 })
 export class CalendrierComponent implements OnInit {
 
-  constructor() { }
+  constructor(private evenementService:EvenementService, private tokenService: TokenService) { }
+  
+  get date(): DayPilot.Date {
+    return this.config.startDate as DayPilot.Date;
+  }
+
+  set date(value: DayPilot.Date) {
+    this.config.startDate = value;
+  }
+
+  events: DayPilot.EventData[] = [];
+  
+  config: DayPilot.CalendarConfig = {
+    viewType: "Day",
+    timeRangeSelectedHandling: "Disabled",
+    eventDeleteHandling: "Disabled",
+    eventMoveHandling: "Disabled",
+    eventResizeHandling: "Disabled",
+    eventClickHandling: "Disabled"
+  }
 
   ngOnInit(): void {
+    const teamId = this.tokenService.getCurrentTeamId();
+    this.evenementService.getEvenementsByIdTeam(teamId).subscribe((data: any) => {
+      Object.keys(data).map((key, index) => {
+        data[key] = {
+          barColor:data[key].membre.couleur,
+          backColor: data[key].membre.couleur,
+          id: data[key].id,
+          start: data[key].start,
+          end: data[key].end,
+          text: data[key].text.toUpperCase()+'\r('+data[key].membre.prenom+')',
+          tags : {
+            membre: data[key].membre.id
+          }
+        };
+      });
+      this.events = data;
+      console.log(data);
+      console.log(this.events);
+    });
+
   }
 
 }

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

@@ -50,11 +50,12 @@ public upMenuForm : FormGroup;
 
   //delete d'un menu
   deleteMenu(id_menu : number): void {
-  window.alert("Le menu a bien été supprimé!")
+  // window.alert("Le menu a bien été supprimé!")
 this.menusService.deleteMenu(id_menu)?.subscribe((resp) => {
-  // this.router.navigate(['menu']);
+ // this.router.navigate(['menu']);
+  window.location.reload();
 });
-window.location.reload();
+
 }
 
 //updateMenu
@@ -76,8 +77,8 @@ updateMenu(id_menu : number): void {
 
     this.menusService.updateMenu(menu, id_menu)?.subscribe((resp) => {
       console.log(menu, id_menu);
+      window.location.reload();
       });
-    window.location.reload();
   }
 
 

src/app/components/header/header.component.html

@@ -14,4 +14,5 @@
     </div>
     <a class="navbar-brand" href="#">Organizee</a>
   </div>
+  <app-deconnexion *ngIf="isLogged"></app-deconnexion>
 </nav>

src/app/components/header/header.component.ts

@@ -1,4 +1,5 @@
 import { Component, OnInit } from '@angular/core';
+import { TokenService } from 'src/app/services/token.service';
 
 
 @Component({
@@ -7,12 +8,19 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./header.component.scss']
 })
 export class HeaderComponent implements OnInit {
+isLogged=false;
 
-  constructor(){
 
-              }
+  constructor(public tokenService : TokenService){
+
+  }
 
   ngOnInit(): void {
+
+    if(this.tokenService.getToken()){
+      this.isLogged=true;
+    }
+
   }
 
   }

src/app/components/signin/signin.component.html

@@ -24,8 +24,16 @@
 
     </form>
     <a routerLink="/password-oublie" routerLinkActive="active-custom" class="nav-link">password perdu ?</a>
-    <div *ngIf="errorForm">
+    <!-- <div *ngIf="errorForm">
       <p class="text-danger">Il manque des informations dans le formulaire...</p>
-    </div>
+    </div> -->
+    
+    <app-alert *ngIf="isShow" [alert]="alert" (eventClose)="onClickCloseAlert();"></app-alert>
+    
+    <!-- <div *ngIf="isShow">
+      <div class="alert alert-{{alert.type}}" role="alert">
+        {{alert.content}}
+      </div>
+    </div> -->
   </main>
 </div>

src/app/components/signin/signin.component.ts

@@ -14,9 +14,10 @@ import {
   styleUrls: ['./signin.component.scss'],
 })
 export class SigninComponent implements OnInit {
-  public errorForm: boolean;
+  alert : any;
+  isShow : boolean;
   constructor(private authService: AuthService, private router: Router) {
-    this.errorForm = false;
+    this.isShow = false;
   }
 
   ngOnInit(): void {}
@@ -26,18 +27,26 @@ export class SigninComponent implements OnInit {
     const email = submittedForm.form.value['email'];
     const password = submittedForm.form.value['password'];
     if (email !== '' && password !== '') {
-      this.authService.signin(email, password).subscribe((resp) => {
+      this.authService.signin(email, password).subscribe(
-        console.log('Component Signin: ', resp);
+        {
-        //if(resp == ){
+          next: resp => {
-          this.router.navigate(['tableau-de-bord']);
+            this.router.navigate(['tableau-de-bord']);
-        //}else{
+          },
-         // window.alert("Votre identifiant/mot de passe est erroné");
+          error: err => {
-        //}
+            this.alert={"type":"danger", "content":"Le login ou paswword est invalide"};
-        console.log('Component Signin: ', resp);
+            this.isShow = true;
-      });
+          },
+          complete: () => console.log('DONE!')
+        });
     } else {
       // afficher une erreur à l'utilisateur
-      this.errorForm = true;
+      this.alert={"type":"danger", "content":"Le login ou password est invalide"};
+      this.isShow = true;
     }
   }
+
+  onClickCloseAlert(){
+    console.log('fermeture');
+    this.isShow = ! this.isShow;
+  }
 }

src/app/components/to-do-list/to-do-list.component.html

@@ -1,67 +1,70 @@
-<input
+<div class="container">
-  type="text"
+  <input
-  class="todo-title"
+    type="text"
-  placeholder="Titre"
+    class="todo-title btn btn-outline-success"
-  value="{{ todo.nom }}"
+    placeholder="Titre"
-  [(ngModel)]="todo.nom"
+    value="{{ todo.nom }}"
-  (keyup.enter)="updateTodo(todo)"
+    [(ngModel)]="todo.nom"
-/>
+    (keyup.enter)="updateTodo(todo)"
+  />
 
-<i class="bi bi-trash3" (click)="deleteTodo(todo.id)"></i>
+  <i class="bi bi-trash3" (click)="deleteTodo(todo.id)"></i>
-
+  <div class="row justify-align">
-<input
-  type="text"
-  class="todo-input"
-  placeholder="+ Nouvelle Tâche"
-  [(ngModel)]="todoTitle"
-  (keyup.enter)="addTache(todo.id)"
-/>
-
-<div class="element" *ngFor="let tache of todo.taches">
-  <div class="element-gauche">
     <input
-      type="checkbox"
+      type="text"
-      [(ngModel)]="tache.etat"
+      class="todo-input shadow justify-center"
-      (change)="doneEdit(tache)"
+      placeholder="+ Nouvelle Tâche"
-      checked="checked"
+      [(ngModel)]="todoTitle"
+      (keyup.enter)="addTache(todo.id)"
     />
-    <div
-      *ngIf="!tache.editing; else editingTodo"
-      class="nomTache"
-      [ngClass]="{ completed: tache.etat }"
-      (dblclick)="modifier(tache)"
-    >
-      {{ tache.texte }}
-    </div>
-    <ng-template #editingTodo>
-      <input
-        type="text"
-        class="modifier-element"
-        [(ngModel)]="tache.texte"
-        (blur)="doneEdit(tache)"
-        (keyup.enter)="doneEdit(tache)"
-        (keyup.esc)="cancelEdit(tache)"
-        autofocus
-      />
-    </ng-template>
   </div>
-  <div class="deleteTache" (click)="deleteTache(tache.id)">&times;</div>
+  <div
-</div>
+    class="element btn btn-outline-success shadow"
-
+    *ngFor="let tache of todo.taches"
-<div class="extra-container">
+  >
-  <div>
+    <div class="element-gauche">
-    <label
+      <input
-      ><input
+        type="checkbox"
+        [(ngModel)]="tache.etat"
+        (change)="doneEdit(tache)"
+        checked="checked"
+      />
+      <div
+        *ngIf="!tache.editing; else editingTodo"
+        class="nomTache"
+        [ngClass]="{ completed: tache.etat }"
+        (dblclick)="modifier(tache)"
+      >
+        {{ tache.texte }}
+      </div>
+      <ng-template #editingTodo>
+        <input
+          type="text"
+          class="modifier-element"
+          [(ngModel)]="tache.texte"
+          (blur)="doneEdit(tache)"
+          (keyup.enter)="doneEdit(tache)"
+          (keyup.esc)="cancelEdit(tache)"
+          autofocus
+        />
+      </ng-template>
+    </div>
+    <div class="deleteTache" (click)="deleteTache(tache.id)">&times;</div>
+  </div>
+  <div class="selection">
+    <label>
+      <input
+        class="selection"
         type="checkbox"
         (change)="cocherAllTodoList()"
         [(ngModel)]="masterSelected"
       />Selectionner toutes les tâches</label
     >
+    <div class="casesRestantes">{{ toDoRest() }} tâche(s) restante(s)</div>
   </div>
-  <div>{{ toDoRest() }} tâches restantes</div>
 </div>
-<div class="extra-container">
+<!--<div class="extra-container">
-  <!-- <div>
+   <div>
     <button [ngClass]="{ active: filter === 'tous' }" (click)="filter = 'tous'">
       Toutes la To Do List
     </button>
@@ -78,5 +81,5 @@
       Terminées
     </button>
   </div>
- -->
+
-</div>
+</div> -->

src/app/components/to-do-list/to-do-list.component.scss

@@ -1,30 +1,60 @@
+.container {
+  border: 3px #4e9e7b solid;
+  padding: 5%;
+  min-width: 300px;
+  max-width: 30%;
+  margin: 5%;
+  border-radius: 5%;
+  margin-bottom: 20% !important;
+}
+
 .todo-title {
-  width: 25%;
+  width: 75%;
   padding: 10px 18px;
-  font-size: xx-large;
+  font-size: large !important;
-  margin-bottom: 16px;
+  font-weight: bold !important;
+  color: #4e9e7b !important;
+  border-top-color: #4e9e7b !important;
+  border-left-color: #4e9e7b !important;
+  border-radius: 5% !important;
+  margin-top: 0%;
+  margin-bottom: 5%;
+  margin-right: 3% !important;
+  color: black;
+  box-shadow: 5px 5px 5px gray;
   &:focus {
     outline: 0;
+    background-color: lightgray;
   }
 }
 
 .todo-input {
-  width: 20%;
+  width: 75%;
   padding: 10px 18px;
   font-size: 18px;
   margin-bottom: 16px;
+  color: white !important;
+  background-color: #4e9e7b !important;
+  border-radius: 5%;
+  margin-left: 4%;
   &:focus {
     outline: 0;
+    background-color: lightgray;
   }
 }
 
-
 .element {
   margin-bottom: 12px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   animation-duration: 0.3s;
+  color: black;
+  background-color: #4e9e7b;
+}
+
+::placeholder {
+  color: white;
 }
 
 .deleteTache {
@@ -36,56 +66,66 @@
   }
 }
 
-.element-gauche { // later
+.element-gauche {
   display: flex;
   align-items: center;
 }
 
-.nomTache{
+.nomTache {
   padding: 10px;
-  border: 1px solid white;
   margin-left: 12px;
 }
 
 .modifier-element {
   font-size: 24px;
-  color: #2c3e50;
+  color: white;
   margin-left: 12px;
   width: 100%;
   padding: 10px;
   border: 1px solid rgb(204, 204, 204); //override defaults
-  font-family: 'Avenir', Helvetica, Arial, sans-serif;
+  font-family: "Avenir", Helvetica, Arial, sans-serif;
 
   &:focus {
     outline: none;
-    background-color:aquamarine;
+    background-color: grey;
   }
 }
 
+.selection {
+  margin-left: 0%;
+  text-align: left;
+  font-size: medium;
+  font-weight: bold;
+  color: #4e9e7b;
+}
+
 .completed {
   text-decoration: line-through;
-  color: grey;
+  color: white !important;
+}
+.casesRestantes {
+  color: #4cc690;
 }
 
-
+/* button {
-button {
   font-size: 14px;
   background-color: white;
   appearance: none;
 
   &:hover {
-    background: lightgreen;
+    background: grey;
   }
 
   &:focus {
     outline: none;
   }
-}
+} */
 
-.active {
+/* .active {
-  background: lightgreen;
+  background: grey;
-}
+} */
-.completed {
+/* .completed {
   text-decoration: line-through;
   color: grey;
 }
+ */

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

@@ -1,5 +1,4 @@
 <app-header></app-header>
-<app-deconnexion></app-deconnexion>
 <div class="container-fluid">
   <div class="row">
     <app-side-bar></app-side-bar>

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

@@ -1,7 +1,9 @@
 <app-header></app-header>
 <app-side-bar></app-side-bar>
 
-<div
+<app-alert *ngIf="isShow" [alert]="alert" (eventClose)="onClickCloseAlert();"></app-alert>
+
+<!-- <div
   class="alert alert-{{ alert.type }}"
   role="alert"
   style="position: absolute; z-index: 999; top: 50%; left: 40%; width: 500px"
@@ -18,7 +20,7 @@
   >
     <span aria-hidden="true">&times;</span>
   </button>
-</div>
+</div> -->
 
 <div style="display: flex">
   <div style="width: 150px">
@@ -57,7 +59,11 @@
             (click)="navigateNext($event)"
             >Next</a
           >
-          team : {{ teamId }} - user: {{ userId }} - role: {{ role }}
+          
+          <!-- DEBUT : Pour le debugage -->
+          <span *ngIf="debug">team : {{ teamId }} - user: {{ userId }} - role: {{ role }}</span>
+          <!-- FIN : Pour le debugage -->
+
           <span style="float: right"
             ><a
               href="#"

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

@@ -2,7 +2,7 @@ import { Component, OnInit, AfterViewInit, ViewChild } from '@angular/core';
 import { DayPilot, DayPilotCalendarComponent, DayPilotNavigatorComponent } from "@daypilot/daypilot-lite-angular";
 import { EvenementService } from 'src/app/services/evenement.service';
 import { environment } from 'src/environments/environment';
-import jwt_decode from 'jwt-decode';
+import { TokenService } from 'src/app/services/token.service';
 
 @Component({
   selector: 'app-page-agenda',
@@ -10,7 +10,7 @@ import jwt_decode from 'jwt-decode';
   styleUrls: ['./page-agenda.component.scss']
 })
 export class PageAgendaComponent implements AfterViewInit {
-
+  debug: boolean;
   userId : any;
   teamId : any;
   role:any;
@@ -20,9 +20,10 @@ export class PageAgendaComponent implements AfterViewInit {
   @ViewChild("navigator") navigator!: DayPilotNavigatorComponent;
   @ViewChild("calendar") calendar!: DayPilotCalendarComponent;
 
-  constructor(private evenementService:EvenementService) {
+  constructor(private evenementService:EvenementService, private tokenService: TokenService) {
     this.isShow = false;
     this.alert = "";
+    this.debug = environment.debug;
   }
 
   get date(): DayPilot.Date {
@@ -55,15 +56,9 @@ export class PageAgendaComponent implements AfterViewInit {
   }
   
   ngOnInit(): void {
-    const token = localStorage.getItem(environment.tokenKey);
+    this.userId = this.tokenService.getCurrentMembreId();
-    if(token) {
+    this.teamId = this.tokenService.getCurrentTeamId();
-      const decodedToken = jwt_decode<any>(token);
+    this.role = this.tokenService.getRole();
-      this.userId = decodedToken.userId;
-      this.teamId = decodedToken.teamId;
-      this.role = decodedToken.auth[0].authority;
-    }else{
-      //
-    }
   }
 
   // petite triche pour eviter la repetition du nom dans le RDV
@@ -191,22 +186,28 @@ export class PageAgendaComponent implements AfterViewInit {
         text: this.rdvSplit(args.e.text()),
         membre: {id:args.e.data.tags.membre},
         team: {id:this.teamId}
-      }      
+      }
-      this.evenementService.updateEvenements(event).subscribe(
+      if( (args.e.data.tags.membre == this.userId) || (this.role == 'ROLE_PARENT')){ // mettre role parent en variable
-        {
+        this.evenementService.updateEvenements(event).subscribe(
-          next: result => {
+          {
-            this.viewChange();
+            next: result => {
-            this.alert={"type":"success", "content":"L'évènement à bien été modifié"};
+              this.viewChange();
-            this.isShow = true;
+              this.alert={"type":"success", "content":"L'évènement à bien été déplacé"};
-          },
+              this.isShow = true;
-          error: err => {
+            },
-            this.viewChange();
+            error: err => {
-            this.alert={"type":"danger", "content":"Problème lors de la modification de l'évenment"};
+              this.viewChange();
-            this.isShow = true;
+              this.alert={"type":"danger", "content":"Problème lors de la modification de l'évenement"};
-          },
+              this.isShow = true;
-          complete: () => console.log('DONE!')
+            },
-        }
+            complete: () => console.log('DONE!')
-      );
+          }
+        );
+      }else{
+        this.viewChange();
+        this.alert={"type":"danger", "content":"Vous ne pouvez pas déplacé cet évènement !"};
+        this.isShow = true;  
+      }
     }
   }
 

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

@@ -1,9 +1,6 @@
 <app-header></app-header>
 <app-side-bar></app-side-bar>
 
-
-<app-deconnexion></app-deconnexion>
-
 <div class="container">
   <div>
     <h3 class="titre">Bienvenue {{ conectedUser.prenom }}!!</h3>

src/app/pages/page-to-do-list/page-to-do-list.component.html

@@ -8,15 +8,19 @@
     <div class="d-flex align-items-stretch"></div>
     <input
       type="text"
-      class="todo-input"
+      class="btn btn-outline-success"
-      placeholder="+ Nouvelle To-Do-List"
+      placeholder=" Ajouter une To-Do-List"
       [(ngModel)]="todoListTitle"
       (keyup.enter)="addTodoByTeamId()"
     />
 
     <div class="d-flex align-items-stretch">
-      <div class="col" *ngFor="let todos of listTodos">
+      <div class="custom-main container p-3">
-        <app-to-do-list [todo]="todos"> </app-to-do-list>
+        <div class="row">
+          <div class="col" *ngFor="let todos of listTodos">
+            <app-to-do-list [todo]="todos"> </app-to-do-list>
+          </div>
+        </div>
       </div>
     </div>
   </div>

src/app/pages/page-to-do-list/page-to-do-list.component.scss

@@ -0,0 +1,6 @@
+.btn {
+  margin-top: 1%;
+  margin-bottom: 1%;
+  color: black;
+  box-shadow: 5px 5px 5px gray;
+}

src/app/services/menus.service.ts

@@ -45,7 +45,7 @@ apiUrl: string;
   }
 
   deleteMenu(id:number): Observable<any> {
-    return this.http.delete(`${this.apiUrl}/menus/delete/${id}`);
+    return this.http.delete(`${this.apiUrl}/menus/delete/${id}`, {responseType:"text"});
   }
 
 

src/app/services/token.service.ts

@@ -23,7 +23,7 @@ tokenKey = environment.tokenKey;
     public eraseToken(): string | null {
     const token = localStorage.getItem(this.tokenKey);
     if(token) {
-        this.tokenKey = '';
+      localStorage.removeItem(this.tokenKey);
         return token;
       }else {
       return null;

src/environments/environment.ts

@@ -6,6 +6,7 @@ export const environment = {
   production: false,
   apiUrl: 'http://localhost:8088',
   tokenKey: 'TOKEN-ORGANIZEE',
+  debug: true,
 };
 
 /*