ça devrait le faire

This commit is contained in:
cecilesimplon93 2022-02-24 15:21:36 +01:00
commit 530cd73b3f
9 changed files with 168 additions and 135 deletions

View file

@ -1,7 +1,5 @@
import { NgModule } from '@angular/core';
import { NgModule, LOCALE_ID } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { PageAccueilComponent } from './pages/page-accueil/page-accueil.component';
@ -40,8 +38,9 @@ import { FooterComponent } from './components/footer/footer.component';
import { PageDeleteAccountComponent } from './pages/page-delete-account/page-delete-account.component';
import { PageUpdateAccountComponent } from './pages/page-update-account/page-update-account.component';
import { DayPilot, DayPilotModule } from "@daypilot/daypilot-lite-angular";
import { HumeurComponent } from './components/humeur/humeur.component';
import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
registerLocaleData(localeFr)
@NgModule({
declarations: [
@ -68,7 +67,7 @@ import { HumeurComponent } from './components/humeur/humeur.component';
CardMemberComponent,
ToDoListComponent,
TacheComponent,
HumeurComponent,
CardMenuComponent,
FicheContactComponent,
PaginationComponent,
@ -79,6 +78,7 @@ import { HumeurComponent } from './components/humeur/humeur.component';
FooterComponent,
PageDeleteAccountComponent,
PageUpdateAccountComponent,
],
imports: [
BrowserModule,
@ -87,10 +87,10 @@ import { HumeurComponent } from './components/humeur/humeur.component';
HttpClientModule,
FormsModule,
AutofocusFixModule.forRoot(),
DayPilotModule
DayPilotModule,
],
providers: [
{provide: LOCALE_ID, useValue: "fr-FR" }
],
bootstrap: [AppComponent],

View file

@ -1,71 +1,3 @@
<div *ngFor="let menu of listMenus">
<div class="menu card mb-4" style="width: 14rem">
<p>{{ menu.dateMenu | date: "EEEE, d":"fr" }}</p>
<p>{{ menu.repas }}</p>
<p>{{ menu.libelle }}</p>
<ng-template #content let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">
Mettre à jour 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]="upMenuForm">
<div class="form-group">
<label for="dateMenu"> Date </label>
<div class="input-group">
<input
id="dateMenu"
class="form-control"
formControlName="dateMenuFc"
value="{{ menu.dateMenu }}"
placeholder=""
name="date"
/>
<input
id="libelle"
class="form-control"
formControlName="libelleFc"
value="{{ menu.libelle }}"
placeholder=""
name="libelle"
/>
<input
id="repas"
class="form-control"
formControlName="repasFc"
value="{{ menu.repas }}"
placeholder=""
name="repas"
/>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-outline-dark"
(click)="modal.close(updateMenu(menu.id))"
>
Mettre à jour
</button>
</div>
</ng-template>
<i class="bi bi-pencil-square" (click)="open(content)"></i>
<i class="bi bi-trash3" (click)="deleteMenu(menu.id)"></i>
</div>
</div>
<ng-template #content let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">Ajouter un menu</h4>
@ -81,28 +13,30 @@
<div class="modal-body">
<form [formGroup]="menuForm">
<div class="form-group">
<label for="dateMenu"> Date </label>
<div class="input-group">
<input
type="date"
id="dateMenu"
class="form-control"
formControlName="dateMenuFc"
placeholder="aaaa-mm-jj"
placeholder="Date"
name="date"
/>
<input
id="libelle"
id="repasMidi"
class="form-control"
formControlName="libelleFc"
placeholder="repas"
name="libelle"
formControlName="repasMidiFc"
placeholder="Repas du midi"
name="repasMidi"
/>
<input
id="repas"
id="repasSoir"
class="form-control"
formControlName="repasFc"
placeholder="soir ou midi"
name="repas"
formControlName="repasSoirFc"
placeholder="Repas du soir"
name="repasSoir"
/>
</div>
</div>
@ -119,6 +53,83 @@
</div>
</ng-template>
<button type="button" class="btn btn-outline-dark" (click)="open(content)">
<button type="button" class="btn btn-outline-warning" (click)="open(content)">
Ajouter un menu
</button>
<div class="container mt-5 menu">
<div class="row d-flex justify-content-center">
<div class="col-md-auto" *ngFor="let menu of listMenus">
<div class="card p-3 py-4 align-items" style="width: 14rem">
<p class="jour">{{ menu.dateMenu | date: "EEEE":"fr" }}</p>
<div class="tag">
<p class="repas">Midi</p>
<p>{{ menu.repasMidi }}</p>
</div>
<div class="tag">
<p class="repas">Soir</p>
<p>{{ menu.repasSoir }}</p>
</div>
<ng-template #content let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">
Mettre à jour 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]="upMenuForm">
<div class="form-group">
<div class="input-group">
<input
type="date"
id="dateMenu"
class="form-control"
formControlName="dateMenuFc"
value="{{ menu.dateMenu }}"
placeholder="Date"
name="date"
/>
<input
id="repasMidi"
class="form-control"
formControlName="repasMidiFc"
value="{{ menu.repasMidi }}"
placeholder="Repas du midi"
name="repasMidi"
/>
<input
id="repasSoir"
class="form-control"
formControlName="repasSoirFc"
value="{{ menu.repasSoir }}"
placeholder="Repas du soir"
name="repasSoir"
/>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-outline-dark"
(click)="modal.close(updateMenu(menu.id))"
>
Mettre à jour
</button>
</div>
</ng-template>
<i class="bi bi-pencil-square" (click)="open(content)"></i>
<i class="bi bi-trash3" (click)="deleteMenu(menu.id)"></i>
</div>
</div>
</div>
</div>

View file

@ -1,3 +1,36 @@
.menu {
margin-left: 500px;
.card {
min-height: 22rem;
margin-left: 75px;
margin-bottom: 30px;
border: 1px solid #f7c02b;
border-radius: 8px;
position: relative;
overflow: hidden;
box-shadow: 5px 5px 5px gray;
}
.tag {
margin-top: 20px;
background-color: #fad980;
margin-left: -8px;
width: 13rem;
border: 1px solid #fad980;
border-radius: 8px;
}
.bi {
margin-top: 10px;
}
.btn {
margin-top: 10px;
color: black;
box-shadow: 5px 5px 5px gray;
}
.jour {
font-weight: bolder;
font-size: 25px;
}
.repas {
font-weight: bold;
}

View file

@ -35,16 +35,6 @@ public upMenuForm : FormGroup;
this.listMenus=[];
this.menuForm = new FormGroup({});
this.upMenuForm = this.initForm();
}
//Méthode qui initialise les champs du formulaire avec les infos de la BDD
private initForm(menu?: Menu): FormGroup {
return this.fb.group({
dateMenu: [menu ? menu.dateMenu : ''],
libelle: [menu ? menu.libelle : ''],
repas: [menu ? menu.repas : ''],
});
}
//delete d'un menu
@ -58,15 +48,17 @@ this.menusService.deleteMenu(id_menu)?.subscribe((resp) => {
//updateMenu
updateMenu(id_menu : number): void {
const dateValue = this.menuForm.value['dateMenuFc'];
const libelleValue = this.menuForm.value['libelleFc'];
const repasValue = this.menuForm.value['repasFc'];
const repasMidiValue = this.menuForm.value['repasMidiFc'];
const repasSoirValue = this.menuForm.value['repasSoirFc'];
const menu: Menu = {
dateMenu: dateValue,
libelle: libelleValue,
repas: repasValue,
id: id_menu
repasMidi: repasMidiValue,
repasSoir: repasSoirValue,
id: 0
};
console.log(id_menu);
@ -77,22 +69,33 @@ updateMenu(id_menu : number): void {
});
}
//Méthode qui initialise les champs du formulaire avec les infos de la BDD
private initForm(menu?: Menu): FormGroup {
return this.fb.group({
dateMenu: [menu ? menu.dateMenu : ''],
libelle: [menu ? menu.repasMidi : ''],
repas: [menu ? menu.repasSoir : ''],
});
}
//ajout d'un menu
saveMenu(): void {
const dateValue = this.menuForm.value['dateMenuFc'];
const libelleValue = this.menuForm.value['libelleFc'];
const repasValue = this.menuForm.value['repasFc'];
const repasMidiValue = this.menuForm.value['repasMidiFc'];
const repasSoirValue = this.menuForm.value['repasSoirFc'];
const menu: Menu = {
dateMenu: dateValue,
libelle: libelleValue,
repas: repasValue,
repasMidi: repasMidiValue,
repasSoir: repasSoirValue,
id: 0
};
if (menu.dateMenu !=='' && menu.libelle !== '') {
if (menu.dateMenu !=='') {
console.log(menu.dateMenu);
this.menusService.addMenu(menu)?.subscribe((resp) => {
@ -110,8 +113,10 @@ saveMenu(): void {
this.menusService.getMenu()?.subscribe((listMenus: any[])=>{
console.log(listMenus);
this.listMenus=listMenus;
});
this.menuForm = this.fb.group(
{
dateMenuFc: new FormControl('',[Validators.required]),

View file

@ -2,8 +2,8 @@ import { Membre } from './membre';
import { Team } from './team';
export interface Menu {
libelle: string;
dateMenu: string;
repas: string;
repasMidi: string;
repasSoir: string;
id: number;
}

View file

@ -1,29 +1,12 @@
<app-header></app-header>
<div class="row">
<div class="col-md-auto">
<app-side-bar></app-side-bar>
<app-side-bar class="sidebarMenu"></app-side-bar>
</div>
<div class=" col compte text-center">
<h1>Menu de la semaine</h1>
<main class="contenu-compte">
<div class="col menu text-center">
<h2>Menu de la semaine</h2>
<main class="contenu-menu">
<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>
</div>

View file

@ -24,7 +24,7 @@ tokenKey = environment.tokenKey;
const token = this.getToken();
if(token) {
const decodedToken = jwt_decode<any>(token);
const userId = decodedToken.sub;
const userId = decodedToken.userId;
return userId;
} else {
return null;

View file

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