Compare commits
No commits in common. 'master' and 'formRecipe' have entirely different histories.
master
...
formRecipe
@ -1,53 +1,2 @@
|
|||||||
<!DOCTYPE html>
|
<app-accueil></app-accueil>
|
||||||
<html lang="fr">
|
<!-- <app-recipe-form></app-recipe-form> -->
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>Daidokoro</title>
|
|
||||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Karma">
|
|
||||||
<style>
|
|
||||||
body, h1, h2, h3, h4, h5, h6 {
|
|
||||||
font-family: "Karma", sans-serif;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
.navbar {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
background-color: #333;
|
|
||||||
padding: 1em;
|
|
||||||
}
|
|
||||||
.navbar a {
|
|
||||||
color: white;
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 0.5em 1em;
|
|
||||||
}
|
|
||||||
.navbar a:hover {
|
|
||||||
background-color: #ddd;
|
|
||||||
color: black;
|
|
||||||
}
|
|
||||||
.recipe-container h2 {
|
|
||||||
font-size: 3em;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="navbar">
|
|
||||||
<div *ngIf="isLogged()">
|
|
||||||
<a href="/" (click)="onClickLogout($event)">Logout</a>
|
|
||||||
</div>
|
|
||||||
<div *ngIf="!isLogged()">
|
|
||||||
<a href="" (click)="onClickLogin($event)">Login</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div *ngFor="let link of links">
|
|
||||||
<a routerLink="{{link.$link}}" routerLinkActive="active" ariaCurrentWhenActive="page">{{link.$name}}</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<router-outlet></router-outlet>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
import { TestBed } from '@angular/core/testing';
|
import { TestBed } from '@angular/core/testing';
|
||||||
import { AppComponent } from '../../app/app.component';
|
import { AppComponent } from './app.component';
|
||||||
|
|
||||||
describe('AppComponent', () => {
|
describe('AppComponent', () => {
|
||||||
beforeEach(async () => {
|
beforeEach(async () => {
|
||||||
@ -1,36 +1,15 @@
|
|||||||
import {Component, NgModule} from '@angular/core';
|
import { Component } from '@angular/core';
|
||||||
import {Router, RouterLink, RouterLinkActive, RouterOutlet} from '@angular/router';
|
import { RouterOutlet } from '@angular/router';
|
||||||
import {RecipeFormComponent} from "./component/recipe-form/recipe-form.component";
|
import {RecipeFormComponent} from "./component/recipe-form/recipe-form.component";
|
||||||
import {AccueilComponent} from "./component/accueil/accueil.component";
|
import {AccueilComponent} from "./component/accueil/accueil.component";
|
||||||
import {NgForOf, NgIf} from "@angular/common";
|
|
||||||
import {RecipeListComponent} from "./component/recipe-list/recipe-list.component";
|
|
||||||
import {LoginService} from "./service/login.service";
|
|
||||||
import {Link} from "./model/link.model";
|
|
||||||
import {LinkService} from "./service/link.service";
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-root',
|
selector: 'app-root',
|
||||||
standalone: true,
|
standalone: true,
|
||||||
imports: [RouterOutlet, AccueilComponent, RecipeFormComponent, NgForOf, NgIf, RecipeListComponent, RouterLink, RouterLinkActive],
|
imports: [RouterOutlet, AccueilComponent,RecipeFormComponent],
|
||||||
templateUrl: './app.component.html',
|
templateUrl: './app.component.html',
|
||||||
|
styleUrl: './app.component.css'
|
||||||
})
|
})
|
||||||
export class AppComponent {
|
export class AppComponent {
|
||||||
links : Link[] = this.linkService.getLinks()
|
title = 'daidokoro';
|
||||||
|
|
||||||
constructor(private loginService: LoginService,private linkService: LinkService) {
|
|
||||||
}
|
|
||||||
|
|
||||||
onClickLogin(event: Event): void {
|
|
||||||
event.preventDefault();
|
|
||||||
this.loginService.login();
|
|
||||||
}
|
|
||||||
|
|
||||||
onClickLogout(event: Event): void {
|
|
||||||
event.preventDefault();
|
|
||||||
this.loginService.logout();
|
|
||||||
}
|
|
||||||
|
|
||||||
isLogged(): boolean {
|
|
||||||
return this.loginService.isLogged();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,13 +1,8 @@
|
|||||||
import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
|
import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
|
||||||
import {provideRouter, withComponentInputBinding} from '@angular/router';
|
import { provideRouter } from '@angular/router';
|
||||||
|
|
||||||
import { routes } from './app.routes';
|
import { routes } from './app.routes';
|
||||||
import { provideHttpClient } from "@angular/common/http";
|
|
||||||
|
|
||||||
export const appConfig: ApplicationConfig = {
|
export const appConfig: ApplicationConfig = {
|
||||||
providers: [
|
providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes)]
|
||||||
provideZoneChangeDetection({ eventCoalescing: true }),
|
|
||||||
provideRouter(routes,withComponentInputBinding()),
|
|
||||||
provideHttpClient()
|
|
||||||
]
|
|
||||||
};
|
};
|
||||||
|
|||||||
@ -1,13 +1,3 @@
|
|||||||
import { Routes } from '@angular/router';
|
import { Routes } from '@angular/router';
|
||||||
import {AuthGuard} from "./guard.guard";
|
|
||||||
import {IngredientsComponent} from "./component/ingredients/ingredients.component";
|
|
||||||
import {AccueilComponent} from "./component/accueil/accueil.component";
|
|
||||||
import {RecipeDetailComponent} from "./component/recipe-detail/recipe-detail.component";
|
|
||||||
import {CommandComponent} from "./component/command/command.component";
|
|
||||||
|
|
||||||
export const routes: Routes = [
|
export const routes: Routes = [];
|
||||||
{path: 'ingredients', component:IngredientsComponent,canActivate: [AuthGuard]},
|
|
||||||
{path: 'recipe/:id', component: RecipeDetailComponent},
|
|
||||||
{path: '', component:AccueilComponent},
|
|
||||||
{path: 'command', component: CommandComponent}
|
|
||||||
];
|
|
||||||
|
|||||||
@ -1,51 +0,0 @@
|
|||||||
<style>
|
|
||||||
.command-list {
|
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
background-color: #f0f0f0;
|
|
||||||
margin: 0;
|
|
||||||
padding: 20px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-item {
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 10px;
|
|
||||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
margin: 10px 0;
|
|
||||||
padding: 10px 20px;
|
|
||||||
width: 80%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-item h3 {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-item button {
|
|
||||||
background-color: #ff5252;
|
|
||||||
color: #fff;
|
|
||||||
border: none;
|
|
||||||
border-radius: 5px;
|
|
||||||
padding: 5px 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-item button:hover {
|
|
||||||
background-color: #ff0000;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<div class="command-list">
|
|
||||||
<h2>Ma Commande</h2>
|
|
||||||
<div *ngFor="let recipe of recipes" class="recipe-item">
|
|
||||||
<img src="{{recipe.$image}}" width="10%" alt="ImageRecipe"
|
|
||||||
onerror="this.onerror=null;this.src='https://placehold.co/100x100/black/white?text=Not+Found';">
|
|
||||||
<h3>{{ recipe.$name }}</h3>
|
|
||||||
<button (click)="removeRecipe(recipe)">Retirer</button>
|
|
||||||
</div>
|
|
||||||
<p *ngIf="recipes.length === 0">Aucune recette dans la commande.</p>
|
|
||||||
</div>
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { CommandComponent } from './command.component';
|
|
||||||
|
|
||||||
describe('CommandComponent', () => {
|
|
||||||
let component: CommandComponent;
|
|
||||||
let fixture: ComponentFixture<CommandComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [CommandComponent]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(CommandComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,25 +0,0 @@
|
|||||||
import { Component } from '@angular/core';
|
|
||||||
import { CommandService } from '../../service/command.service';
|
|
||||||
import { Recipe } from '../../model/recipe.model';
|
|
||||||
import {NgFor, NgIf} from '@angular/common';
|
|
||||||
import { RouterLink } from '@angular/router';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-command',
|
|
||||||
standalone: true,
|
|
||||||
imports: [NgFor, RouterLink, NgIf],
|
|
||||||
templateUrl: './command.component.html'
|
|
||||||
})
|
|
||||||
export class CommandComponent {
|
|
||||||
recipes: Recipe[] = [];
|
|
||||||
errorMessage: string | null = null;
|
|
||||||
|
|
||||||
constructor(private commandService: CommandService) {
|
|
||||||
this.recipes = this.commandService.getRecipes();
|
|
||||||
}
|
|
||||||
|
|
||||||
removeRecipe(recipe: Recipe) {
|
|
||||||
this.commandService.removeRecipe(recipe);
|
|
||||||
this.recipes = this.commandService.getRecipes();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,118 +0,0 @@
|
|||||||
<style>
|
|
||||||
.ingredients {
|
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
background-color: #bab6b6;
|
|
||||||
margin: 0;
|
|
||||||
padding: 20px;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-card {
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 10px;
|
|
||||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
overflow: hidden;
|
|
||||||
transition: transform 0.2s;
|
|
||||||
width: 200px;
|
|
||||||
margin: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-card:hover {
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-content {
|
|
||||||
padding: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-title {
|
|
||||||
font-size: 1em;
|
|
||||||
margin: 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-actions {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-actions button {
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.general-form-add {
|
|
||||||
margin-top: 2%;
|
|
||||||
background-color: #bab6b6;
|
|
||||||
float: left;
|
|
||||||
width: 49%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.general-form-edit {
|
|
||||||
margin-top: 2%;
|
|
||||||
background-color: #bab6b6;
|
|
||||||
float: right;
|
|
||||||
width: 49%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
margin-right: 2%;
|
|
||||||
margin-left: 2%
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group label {
|
|
||||||
display: block;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group input, .form-group textarea {
|
|
||||||
width: 100%;
|
|
||||||
padding: 8px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-form{
|
|
||||||
margin-left: 2%;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<div class="ingredients">
|
|
||||||
<div class="ingredient-card" *ngFor="let ingredient of ingredients">
|
|
||||||
<div class="ingredient-content">
|
|
||||||
<h2 class="ingredient-title">{{ ingredient.name }}</h2>
|
|
||||||
<p>{{ ingredient.description }}</p>
|
|
||||||
<div class="ingredient-actions">
|
|
||||||
<button (click)="edit(ingredient)">Modifier</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="general-form-add">
|
|
||||||
<h2>Ajouter un ingrédient</h2>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="newName">Nom:</label>
|
|
||||||
<input id="newName" [(ngModel)]="newIngredient.name" required>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="newDescription">Description:</label>
|
|
||||||
<textarea id="newDescription" [(ngModel)]="newIngredient.description" required></textarea>
|
|
||||||
</div>
|
|
||||||
<button class="button-form" (click)="addIngredient()">Ajouter</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div *ngIf="editIngredient" class="general-form-edit">
|
|
||||||
<h2>Modifier l'ingrédient</h2>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="editName">Nom:</label>
|
|
||||||
<input id="editName" [(ngModel)]="editIngredient.name">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="editDescription">Description:</label>
|
|
||||||
<textarea id="editDescription" [(ngModel)]="editIngredient.description"></textarea>
|
|
||||||
</div>
|
|
||||||
<button class="button-form" (click)="updateIngredient()">Enregistrer</button>
|
|
||||||
<button class="button-form" (click)="cancelEdit()">Annuler</button>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { IngredientsComponent } from './ingredients.component';
|
|
||||||
|
|
||||||
describe('IngredientsComponent', () => {
|
|
||||||
let component: IngredientsComponent;
|
|
||||||
let fixture: ComponentFixture<IngredientsComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [IngredientsComponent]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(IngredientsComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,62 +0,0 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
import { IngredientService } from "../../service/ingredient.service";
|
|
||||||
import { Ingredient } from "../../model/ingredient.model";
|
|
||||||
import { NgFor, NgIf } from "@angular/common";
|
|
||||||
import { FormsModule } from "@angular/forms";
|
|
||||||
import { HttpClient } from "@angular/common/http";
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-ingredients',
|
|
||||||
standalone: true,
|
|
||||||
imports: [
|
|
||||||
NgFor,
|
|
||||||
NgIf,
|
|
||||||
FormsModule
|
|
||||||
],
|
|
||||||
providers: [IngredientService, HttpClient],
|
|
||||||
templateUrl: './ingredients.component.html',
|
|
||||||
styleUrl: './ingredients.component.css'
|
|
||||||
})
|
|
||||||
export class IngredientsComponent implements OnInit {
|
|
||||||
|
|
||||||
ingredients: Ingredient[] = [];
|
|
||||||
newIngredient: Ingredient = { id: '0', name: '', description: '' };
|
|
||||||
editIngredient: Ingredient | null = null;
|
|
||||||
|
|
||||||
constructor(private ingredientService: IngredientService) {}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.loadIngredients();
|
|
||||||
}
|
|
||||||
|
|
||||||
loadIngredients() {
|
|
||||||
this.ingredientService.getAll().subscribe(ingredients => {
|
|
||||||
this.ingredients = ingredients;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
addIngredient() {
|
|
||||||
this.ingredientService.add(this.newIngredient).subscribe(ingredient => {
|
|
||||||
this.ingredients.push(ingredient);
|
|
||||||
this.newIngredient = { id: '0', name: '', description: '' };
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
edit(ingredient: Ingredient) {
|
|
||||||
this.editIngredient = { ...ingredient };
|
|
||||||
}
|
|
||||||
|
|
||||||
updateIngredient() {
|
|
||||||
if (this.editIngredient) {
|
|
||||||
this.ingredientService.update(this.editIngredient).subscribe(updatedIngredient => {
|
|
||||||
const index = this.ingredients.findIndex(i => i.id === updatedIngredient.id);
|
|
||||||
this.ingredients[index] = updatedIngredient;
|
|
||||||
this.editIngredient = null;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
cancelEdit() {
|
|
||||||
this.editIngredient = null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,85 +0,0 @@
|
|||||||
<style>
|
|
||||||
.recipe-details {
|
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
background-color: #bab6b6;
|
|
||||||
margin: 0;
|
|
||||||
padding: 20px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-card {
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 10px;
|
|
||||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
overflow: hidden;
|
|
||||||
transition: transform 0.2s;
|
|
||||||
width: 80%;
|
|
||||||
margin: 20px;
|
|
||||||
padding: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-card:hover {
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-image {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 300px;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-content {
|
|
||||||
padding: 15px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-title {
|
|
||||||
font-size: 2em;
|
|
||||||
margin: 0 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-date {
|
|
||||||
color: #777;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-description {
|
|
||||||
font-size: 1.2em;
|
|
||||||
margin: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-list {
|
|
||||||
list-style-type: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ingredient-item {
|
|
||||||
background-color: #f9f9f9;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-radius: 5px;
|
|
||||||
padding: 10px;
|
|
||||||
margin: 5px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="recipe-details">
|
|
||||||
<div class="recipe-card">
|
|
||||||
<h1 class="recipe-title">{{ recipe?.$name }}</h1>
|
|
||||||
<p class="recipe-date">{{ recipe?.$createdAt }}</p>
|
|
||||||
<img [src]="recipe?.$image" alt="{{ recipe?.$name }}" class="recipe-image"
|
|
||||||
onerror="this.onerror=null;this.src='https://placehold.co/300x300/black/white?text=Not+Found';">
|
|
||||||
<div class="recipe-content">
|
|
||||||
<h3 class="recipe-description">{{ recipe?.$description }}</h3>
|
|
||||||
<h4>Ingrédients</h4>
|
|
||||||
<ul class="ingredient-list">
|
|
||||||
<li class="ingredient-item" *ngFor="let ingredient of ingredients">
|
|
||||||
{{ ingredient.ingredient.name }} : {{ ingredient.quantity }} {{ ingredient.unit }}
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { RecipeDetailComponent } from './recipe-detail.component';
|
|
||||||
|
|
||||||
describe('RecipeDetailComponent', () => {
|
|
||||||
let component: RecipeDetailComponent;
|
|
||||||
let fixture: ComponentFixture<RecipeDetailComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [RecipeDetailComponent]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(RecipeDetailComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,31 +0,0 @@
|
|||||||
import {Component, Input} from '@angular/core';
|
|
||||||
import {Recipe} from "../../model/recipe.model";
|
|
||||||
import {RecipeService} from "../../service/recipe.service";
|
|
||||||
import {RouterLink, RouterLinkActive, RouterOutlet} from "@angular/router";
|
|
||||||
import {NgFor} from "@angular/common";
|
|
||||||
import {QuantifiedIngredientGetter} from "../../model/quantified-ingredient-getter.model";
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-recipe-detail',
|
|
||||||
standalone: true,
|
|
||||||
imports: [RouterOutlet,RouterLink, RouterLinkActive,NgFor],
|
|
||||||
templateUrl: './recipe-detail.component.html',
|
|
||||||
styleUrl: './recipe-detail.component.css'
|
|
||||||
})
|
|
||||||
export class RecipeDetailComponent {
|
|
||||||
|
|
||||||
recipe : Recipe|null = null;
|
|
||||||
ingredients : QuantifiedIngredientGetter[] = [];
|
|
||||||
|
|
||||||
constructor(private recipeService : RecipeService) {
|
|
||||||
}
|
|
||||||
|
|
||||||
@Input()
|
|
||||||
set id(id: number) {
|
|
||||||
this.recipe = this.recipeService.getRecipe(id)!;
|
|
||||||
this.ingredients = this.recipe.$ingredients;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
@ -1,138 +1,14 @@
|
|||||||
<style>
|
<form [formGroup]="recipeForm" (ngSubmit)="onSubmit()">
|
||||||
body {
|
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
background-color: #bab6b6;
|
|
||||||
margin: 0;
|
|
||||||
padding: 20px;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.form-container {
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 10px;
|
|
||||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
padding: 20px;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.form-container h2 {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
.form-group {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
.form-group label {
|
|
||||||
display: block;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
.form-group input,
|
|
||||||
.form-group select,
|
|
||||||
.form-group button {
|
|
||||||
width: 97%;
|
|
||||||
padding: 10px;
|
|
||||||
margin-top: 5px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
.form-group button {
|
|
||||||
background-color: black;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.form-group button:hover {
|
|
||||||
background-color: #525259;
|
|
||||||
}
|
|
||||||
.form-group .remove-button {
|
|
||||||
background-color: red;
|
|
||||||
}
|
|
||||||
.form-group .remove-button:hover {
|
|
||||||
background-color: darkred;
|
|
||||||
}
|
|
||||||
.add-ingredient-button {
|
|
||||||
background-color: #4CAF50;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.add-ingredient-button:hover {
|
|
||||||
background-color: #45a049;
|
|
||||||
}
|
|
||||||
.submit-button {
|
|
||||||
background-color: black;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.submit-button:hover {
|
|
||||||
background-color: #525259;
|
|
||||||
}
|
|
||||||
.error-message {
|
|
||||||
color: red;
|
|
||||||
font-size: 0.9em;
|
|
||||||
margin-top: 5px;
|
|
||||||
}
|
|
||||||
.form-group.invalid input,
|
|
||||||
.form-group.invalid select {
|
|
||||||
border-color: red;
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
<body>
|
|
||||||
<div class="form-container">
|
|
||||||
<h2>Ajouter une Recette</h2>
|
|
||||||
<form [formGroup]="recipeForm" (ngSubmit)="onSubmit()">
|
|
||||||
<div class="form-group" [class.invalid]="recipeForm.get('id')?.invalid && recipeForm.get('id')?.touched">
|
|
||||||
<label for="id">ID: </label>
|
<label for="id">ID: </label>
|
||||||
<input id="id" type="number" formControlName="id" required>
|
<input id="id" type="number" formControlName="id">
|
||||||
<div class="error-message" *ngIf="recipeForm.get('id')?.invalid && recipeForm.get('id')?.touched">
|
|
||||||
L'ID est requis.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group" [class.invalid]="recipeForm.get('name')?.invalid && recipeForm.get('name')?.touched">
|
|
||||||
<label for="name">Name: </label>
|
|
||||||
<input id="name" type="text" formControlName="name" required>
|
|
||||||
<div class="error-message" *ngIf="recipeForm.get('name')?.invalid && recipeForm.get('name')?.touched">
|
|
||||||
Le nom est requis.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group" [class.invalid]="recipeForm.get('description')?.invalid && recipeForm.get('description')?.touched">
|
|
||||||
<label for="description">Description: </label>
|
|
||||||
<input id="description" type="text" formControlName="description" required>
|
|
||||||
<div class="error-message" *ngIf="recipeForm.get('description')?.invalid && recipeForm.get('description')?.touched">
|
|
||||||
La description est requise.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<label for="image">Image: </label>
|
|
||||||
<input id="image" type="file" (change)="onFileChange($event)">
|
|
||||||
|
|
||||||
<br>
|
|
||||||
<div *ngIf="imageBase64">
|
|
||||||
<img [src]="imageBase64" alt="Selected Image" style="max-width: 200px; max-height: 200px;">
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
|
|
||||||
<div formArrayName="ingredients">
|
|
||||||
<div *ngFor="let ingredient of ingredients.controls; let i=index" [formGroupName]="i" class="form-group">
|
|
||||||
<label for="ingredient-quantity">Quantity:</label>
|
|
||||||
<input id="ingredient-quantity" type="number" formControlName="quantity" required>
|
|
||||||
|
|
||||||
<label for="ingredient-unit">Unit:</label>
|
|
||||||
<select id="ingredient-unit" formControlName="unit" required>
|
|
||||||
<option *ngFor="let unit of unity" [value]="unit">{{ unit }}</option>
|
|
||||||
</select>
|
|
||||||
|
|
||||||
<label for="ingredient-name">Ingredient:</label>
|
<label for="name">name: </label>
|
||||||
<select id="ingredient-name" formControlName="ingredient" required>
|
<input id="name" type="text" formControlName="name">
|
||||||
<option *ngFor="let ingredient of ingredientsList" [value]="ingredient.name">{{ ingredient.name }}</option>
|
|
||||||
</select>
|
|
||||||
|
|
||||||
<button type="button" class="remove-button" (click)="removeIngredient(i)">Remove</button>
|
<label for="description">description: </label>
|
||||||
</div>
|
<input id="description" type="text" formControlName="description">
|
||||||
</div>
|
|
||||||
|
|
||||||
<button type="button" class="add-ingredient-button" (click)="addIngredient()">Add Ingredient</button>
|
|
||||||
|
|
||||||
<p>Complete the form to enable the button.</p>
|
<p>Complete the form to enable the button.</p>
|
||||||
<button type="submit" class="submit-button">Submit</button>
|
<button type="submit" [disabled]="!recipeForm.valid">Submit</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
|
|||||||
@ -1,99 +1,37 @@
|
|||||||
import { Component, EventEmitter, Output } from '@angular/core';
|
import {Component, EventEmitter, Output} from '@angular/core';
|
||||||
import { Recipe } from "../../model/recipe.model";
|
import {Recipe} from "../../model/recipe.model";
|
||||||
import { FormControl, FormGroup, ReactiveFormsModule, FormArray, FormBuilder, Validators } from "@angular/forms";
|
import {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms";
|
||||||
import { Ingredient } from '../../model/ingredient.model';
|
|
||||||
import { Unity } from '../../model/unity';
|
|
||||||
import { IngredientService } from '../../service/ingredient.service';
|
|
||||||
import {NgFor, NgIf} from "@angular/common";
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-recipe-form',
|
selector: 'app-recipe-form',
|
||||||
standalone: true,
|
standalone: true,
|
||||||
imports: [ReactiveFormsModule, NgFor, NgIf],
|
imports: [ReactiveFormsModule],
|
||||||
templateUrl: './recipe-form.component.html'
|
templateUrl: './recipe-form.component.html',
|
||||||
|
styleUrl: './recipe-form.component.css'
|
||||||
})
|
})
|
||||||
export class RecipeFormComponent {
|
export class RecipeFormComponent {
|
||||||
@Output() formSubmitted = new EventEmitter<Recipe>();
|
@Output() formSubmitted = new EventEmitter<Recipe>();
|
||||||
ingredientsList: Ingredient[] = [];
|
|
||||||
unity = Object.values(Unity);
|
|
||||||
imageBase64: string | null = null;
|
|
||||||
|
|
||||||
constructor(private formBuilder: FormBuilder, private ingredientService: IngredientService) { }
|
recipeForm = new FormGroup({
|
||||||
|
id: new FormControl('', { nonNullable: true }),
|
||||||
|
name: new FormControl('', { nonNullable: true }),
|
||||||
|
description: new FormControl('', { nonNullable: true }),
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.ingredientService.getAll().subscribe(ingredients => {
|
|
||||||
this.ingredientsList = ingredients;
|
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
recipeForm: FormGroup = this.formBuilder.group({
|
|
||||||
id: new FormControl('', { nonNullable: true, validators: [Validators.required] }),
|
|
||||||
name: new FormControl('', { nonNullable: true, validators: [Validators.required] }),
|
|
||||||
description: new FormControl('', { nonNullable: true, validators: [Validators.required] }),
|
|
||||||
ingredients: this.formBuilder.array([this.newIngredient()]),
|
|
||||||
image: new FormControl('', {nonNullable: false})
|
|
||||||
});
|
|
||||||
|
|
||||||
get ingredients(): FormArray {
|
|
||||||
return this.recipeForm.get('ingredients') as FormArray;
|
|
||||||
}
|
|
||||||
|
|
||||||
newIngredient(): FormGroup {
|
|
||||||
return this.formBuilder.group({
|
|
||||||
quantity: new FormControl(0, { nonNullable: true, validators: [Validators.required] }),
|
|
||||||
unit: new FormControl('', { nonNullable: true, validators: [Validators.required] }),
|
|
||||||
ingredient: new FormControl('', { nonNullable: true, validators: [Validators.required] })
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
addIngredient() {
|
|
||||||
this.ingredients.push(this.newIngredient());
|
|
||||||
}
|
|
||||||
|
|
||||||
removeIngredient(index: number) {
|
|
||||||
if (this.ingredients.length > 1) {
|
|
||||||
|
|
||||||
this.ingredients.removeAt(index);
|
|
||||||
} else {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onFileChange(event: Event) {
|
|
||||||
const input = event.target as HTMLInputElement;
|
|
||||||
if (input.files && input.files[0]) {
|
|
||||||
const file = input.files[0];
|
|
||||||
const reader = new FileReader();
|
|
||||||
reader.onload = () => {
|
|
||||||
this.imageBase64 = reader.result as string;
|
|
||||||
this.recipeForm.patchValue({image: this.imageBase64});
|
|
||||||
};
|
|
||||||
reader.readAsDataURL(file);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onSubmit() {
|
onSubmit() {
|
||||||
if (this.recipeForm.valid) {
|
if(this.recipeForm.valid){
|
||||||
const recipe: Recipe = {
|
const recipe: Recipe = {
|
||||||
$id: parseInt(this.recipeForm.value.id!),
|
$id: parseInt(this.recipeForm.value.id!),
|
||||||
$name: this.recipeForm.value.name!,
|
$name: this.recipeForm.value.name!,
|
||||||
$description: this.recipeForm.value.description!,
|
$description: this.recipeForm.value.description!,
|
||||||
$createdAt: new Date(),
|
$createdAt: new Date(),
|
||||||
$ingredients: this.recipeForm.value.ingredients!.map((ingredient: any) => ({
|
$ingredients: []
|
||||||
quantity: ingredient.quantity,
|
|
||||||
unit: ingredient.unit,
|
|
||||||
ingredient: this.ingredientsList.find(ing => ing.name === ingredient.ingredient)
|
|
||||||
})),
|
|
||||||
$image: this.recipeForm.value.image
|
|
||||||
};
|
};
|
||||||
this.formSubmitted.emit(recipe);
|
this.formSubmitted.emit(recipe);
|
||||||
this.recipeForm.reset()
|
this.recipeForm.reset()
|
||||||
this.ingredients.clear()
|
|
||||||
this.imageBase64 = null;
|
|
||||||
this.addIngredient()
|
|
||||||
}else{
|
|
||||||
alert("Veuillez remplir tous les champs")
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,78 +1,24 @@
|
|||||||
import {Component, Input, OnInit} from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { RecipeService } from '../../service/recipe.service';
|
import { RecipeService } from '../../service/recipe.service';
|
||||||
import { Recipe } from '../../model/recipe.model';
|
import { Recipe } from '../../model/recipe.model';
|
||||||
import {NgClass, NgIf, NgOptimizedImage} from "@angular/common";
|
import {NgOptimizedImage} from "@angular/common";
|
||||||
import {NgFor} from "@angular/common";
|
import {NgFor} from "@angular/common";
|
||||||
import {Router, RouterLinkActive} from "@angular/router";
|
|
||||||
import {CommandService} from "../../service/command.service";
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-recipe-list',
|
selector: 'app-recipe-list',
|
||||||
templateUrl: './recipe-list.component.html',
|
templateUrl: './recipe-list.component.html',
|
||||||
imports: [
|
imports: [
|
||||||
NgOptimizedImage,
|
NgOptimizedImage,
|
||||||
NgFor,
|
NgFor
|
||||||
NgClass,
|
|
||||||
RouterLinkActive,
|
|
||||||
NgIf
|
|
||||||
],
|
],
|
||||||
standalone: true
|
standalone: true
|
||||||
})
|
})
|
||||||
export class RecipeListComponent implements OnInit {
|
export class RecipeListComponent implements OnInit {
|
||||||
recipes: Recipe[] = [];
|
recipes: Recipe[] = [];
|
||||||
errorMessageDisplay: boolean = false;
|
|
||||||
errorMessage: string | null = null;
|
|
||||||
|
|
||||||
@Input() isFormVisible!: boolean;
|
constructor(private recipeService: RecipeService) {}
|
||||||
|
|
||||||
currentPage: number = 0;
|
|
||||||
pageSize: number = 4;
|
|
||||||
totalPages: any = 0;
|
|
||||||
|
|
||||||
constructor(private recipeService: RecipeService,private router : Router, private commandService: CommandService) {}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.recipes = this.recipeService.getRecipes();
|
this.recipes = this.recipeService.getRecipes();
|
||||||
this.totalPages = Math.ceil(this.recipes.length / this.pageSize);
|
|
||||||
}
|
|
||||||
|
|
||||||
get paginatedRecipes(): any[] {
|
|
||||||
const startIndex = this.currentPage * this.pageSize;
|
|
||||||
return this.recipes.slice(startIndex, startIndex + this.pageSize);
|
|
||||||
}
|
|
||||||
|
|
||||||
changePage(index: number): void {
|
|
||||||
this.currentPage = index;
|
|
||||||
}
|
|
||||||
|
|
||||||
previousPage(): void {
|
|
||||||
if (this.currentPage > 0) {
|
|
||||||
this.currentPage--;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
nextPage(): void {
|
|
||||||
if (this.currentPage < this.totalPages - 1) {
|
|
||||||
this.currentPage++;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
detailsRecipe(id : number){
|
|
||||||
this.router.navigateByUrl('/recipe/'+id);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
addToCommand(recipe: Recipe) {
|
|
||||||
try {
|
|
||||||
this.commandService.addRecipe(recipe);
|
|
||||||
this.errorMessageDisplay = false;
|
|
||||||
} catch (e) {
|
|
||||||
if (e instanceof DOMException && e.name === 'QuotaExceededError') {
|
|
||||||
this.errorMessageDisplay = true;
|
|
||||||
this.errorMessage = 'Local Storage saturé, impossible d\'ajouter la recette dans le local storage des commandes.';
|
|
||||||
} else {
|
|
||||||
throw e;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,8 +1,6 @@
|
|||||||
import {Link} from "../model/link.model";
|
import {Link} from "../model/link.model";
|
||||||
|
|
||||||
export var LINKS :Link[] = [
|
export var LINKS :Link[] = [
|
||||||
{$name:"Accueil",$link:""},
|
{$name:"Lien1",$link:"Lien1"},
|
||||||
{$name:"Ingredients",$link:"/ingredients"},
|
{$name:"Lien2",$link:'Lien2'}
|
||||||
{$name:"Commande",$link:"/command"}
|
]
|
||||||
|
|
||||||
]
|
|
||||||
|
|||||||
@ -1,15 +0,0 @@
|
|||||||
import {CanActivateFn, Router} from '@angular/router';
|
|
||||||
import {LoginService} from "./service/login.service";
|
|
||||||
import {inject} from "@angular/core";
|
|
||||||
|
|
||||||
|
|
||||||
export const AuthGuard: CanActivateFn = (route, state) => {
|
|
||||||
const auth = inject(LoginService)
|
|
||||||
const router = inject(Router);
|
|
||||||
|
|
||||||
if(!auth.isLogged()){
|
|
||||||
router.navigateByUrl('/');
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
};
|
|
||||||
@ -1,6 +1,5 @@
|
|||||||
|
|
||||||
export interface Ingredient {
|
export interface Ingredient {
|
||||||
id : string,
|
$id : number,
|
||||||
name : string,
|
$name : string
|
||||||
description : string,
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,23 +0,0 @@
|
|||||||
import { Unity } from "./unity";
|
|
||||||
import { Ingredient } from "./ingredient.model";
|
|
||||||
import { QuantifiedIngredient } from "./quantified-ingredient.model";
|
|
||||||
|
|
||||||
export class QuantifiedIngredientGetter implements QuantifiedIngredient {
|
|
||||||
constructor(
|
|
||||||
public $quantity: number,
|
|
||||||
public $unit: Unity,
|
|
||||||
public $ingredient: Ingredient
|
|
||||||
) {}
|
|
||||||
|
|
||||||
get quantity(): number {
|
|
||||||
return this.$quantity;
|
|
||||||
}
|
|
||||||
|
|
||||||
get unit(): Unity {
|
|
||||||
return this.$unit;
|
|
||||||
}
|
|
||||||
|
|
||||||
get ingredient(): Ingredient {
|
|
||||||
return this.$ingredient;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,8 +1,8 @@
|
|||||||
import { Unity } from "./unity";
|
import {Unity} from "./unity";
|
||||||
import { Ingredient } from "./ingredient.model";
|
import {Ingredient} from "./ingredient.model";
|
||||||
|
|
||||||
export interface QuantifiedIngredient {
|
export interface QuantifiedIngredient {
|
||||||
$quantity: number;
|
$quantity : number,
|
||||||
$unit: Unity;
|
$unit : Unity,
|
||||||
$ingredient: Ingredient;
|
$ingredient : Ingredient
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,10 +1,9 @@
|
|||||||
import {QuantifiedIngredientGetter} from "./quantified-ingredient-getter.model";
|
import {QuantifiedIngredient} from "./quantified-ingredient.model";
|
||||||
|
|
||||||
export interface Recipe {
|
export interface Recipe {
|
||||||
$id : number,
|
$id : number,
|
||||||
$name : string,
|
$name : string,
|
||||||
$description: string,
|
$description: string,
|
||||||
$createdAt : Date,
|
$createdAt : Date,
|
||||||
$ingredients: QuantifiedIngredientGetter[],
|
$ingredients: QuantifiedIngredient[]
|
||||||
$image?: string
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,25 +0,0 @@
|
|||||||
import { Injectable } from '@angular/core';
|
|
||||||
import { Recipe } from "../model/recipe.model";
|
|
||||||
|
|
||||||
@Injectable({
|
|
||||||
providedIn: 'root'
|
|
||||||
})
|
|
||||||
export class CommandService {
|
|
||||||
private recipes: Recipe[] = JSON.parse(localStorage.getItem('command') || '[]');
|
|
||||||
|
|
||||||
addRecipe(recipe: Recipe) {
|
|
||||||
this.recipes.push(recipe);
|
|
||||||
localStorage.setItem('command', JSON.stringify(this.recipes));
|
|
||||||
}
|
|
||||||
|
|
||||||
getRecipes(): Recipe[] {
|
|
||||||
return this.recipes;
|
|
||||||
}
|
|
||||||
|
|
||||||
removeRecipe(recipe: Recipe) {
|
|
||||||
const index = this.recipes.indexOf(recipe);
|
|
||||||
if (index > -1) {
|
|
||||||
this.recipes.splice(index, 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,26 +1,16 @@
|
|||||||
import { Injectable } from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import { Ingredient } from "../model/ingredient.model";
|
import {Ingredient} from "../model/ingredient.model";
|
||||||
import { Observable } from "rxjs";
|
import {$INGREDIENTS} from "../data/ingredient.stub";
|
||||||
import { HttpClient } from "@angular/common/http";
|
|
||||||
|
|
||||||
@Injectable({
|
@Injectable({
|
||||||
providedIn: 'root'
|
providedIn: 'root'
|
||||||
})
|
})
|
||||||
export class IngredientService {
|
export class IngredientService {
|
||||||
|
|
||||||
private apiUrl = 'https://664ba07f35bbda10987d9f99.mockapi.io/api/ingredients';
|
constructor() { }
|
||||||
|
|
||||||
constructor(private http: HttpClient) { }
|
|
||||||
|
|
||||||
getAll(): Observable<Ingredient[]> {
|
|
||||||
return this.http.get<Ingredient[]>(this.apiUrl);
|
|
||||||
}
|
|
||||||
|
|
||||||
add(ingredient: Ingredient): Observable<Ingredient> {
|
|
||||||
return this.http.post<Ingredient>(this.apiUrl, ingredient);
|
|
||||||
}
|
|
||||||
|
|
||||||
update(ingredient: Ingredient): Observable<Ingredient> {
|
getAll() : Ingredient[] {
|
||||||
return this.http.put<Ingredient>(`${this.apiUrl}/${ingredient.id}`, ingredient);
|
return $INGREDIENTS;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,20 +0,0 @@
|
|||||||
import { Injectable } from '@angular/core';
|
|
||||||
|
|
||||||
@Injectable({
|
|
||||||
providedIn: 'root'
|
|
||||||
})
|
|
||||||
export class LoginService {
|
|
||||||
|
|
||||||
login(): void {
|
|
||||||
localStorage.setItem('login', 'true');
|
|
||||||
}
|
|
||||||
|
|
||||||
logout(): void {
|
|
||||||
localStorage.setItem('login', 'false');
|
|
||||||
}
|
|
||||||
|
|
||||||
isLogged(): boolean {
|
|
||||||
const login = localStorage.getItem('login');
|
|
||||||
return login === 'true';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,17 +0,0 @@
|
|||||||
import { TestBed } from '@angular/core/testing';
|
|
||||||
import { CanActivateFn } from '@angular/router';
|
|
||||||
|
|
||||||
import { AuthGuard } from '../../app/guard.guard';
|
|
||||||
|
|
||||||
describe('guardGuard', () => {
|
|
||||||
const executeGuard: CanActivateFn = (...guardParameters) =>
|
|
||||||
TestBed.runInInjectionContext(() => AuthGuard(...guardParameters));
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
TestBed.configureTestingModule({});
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be created', () => {
|
|
||||||
expect(executeGuard).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,16 +0,0 @@
|
|||||||
import { TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { LoginService } from '../../app/service/login.service';
|
|
||||||
|
|
||||||
describe('LoginService', () => {
|
|
||||||
let service: LoginService;
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
TestBed.configureTestingModule({});
|
|
||||||
service = TestBed.inject(LoginService);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be created', () => {
|
|
||||||
expect(service).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Loading…
Reference in new issue