From 1b5b7f0e3eb52f6c6191e43e449c600727fd4c99 Mon Sep 17 00:00:00 2001 From: Sana EL HIRI Date: Tue, 22 Mar 2022 10:55:06 +0100 Subject: [PATCH 1/2] modifs --- .../formulaire/formulaire.component.html | 2 +- .../formulaire/formulaire.component.ts | 17 ++-- .../page-ajouter/page-ajouter.component.html | 2 +- .../page-modifier.component.html | 2 +- .../page-modifier/page-modifier.component.ts | 93 +++++++++---------- 5 files changed, 53 insertions(+), 63 deletions(-) diff --git a/src/app/modules/admin/components/formulaire/formulaire.component.html b/src/app/modules/admin/components/formulaire/formulaire.component.html index 5d65f00..c30ea4f 100644 --- a/src/app/modules/admin/components/formulaire/formulaire.component.html +++ b/src/app/modules/admin/components/formulaire/formulaire.component.html @@ -1,5 +1,5 @@
-
+
Ajouter une plante - + diff --git a/src/app/modules/admin/pages/page-modifier/page-modifier.component.html b/src/app/modules/admin/pages/page-modifier/page-modifier.component.html index de5769d..a7a2fe3 100644 --- a/src/app/modules/admin/pages/page-modifier/page-modifier.component.html +++ b/src/app/modules/admin/pages/page-modifier/page-modifier.component.html @@ -1,2 +1,2 @@

Modifier la plante

- + diff --git a/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts b/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts index 0f439fb..a656787 100644 --- a/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts +++ b/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts @@ -1,6 +1,6 @@ import { Component, OnInit } from '@angular/core'; -import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'; -import { ActivatedRoute, Router } from '@angular/router'; +import { FormBuilder,FormGroup} from '@angular/forms'; +import { ActivatedRoute, ParamMap, Router } from '@angular/router'; import { Plant } from '../../models/plant'; import { AdminService } from '../../services/admin.service'; @@ -10,10 +10,8 @@ import { AdminService } from '../../services/admin.service'; styleUrls: ['./page-modifier.component.scss'] }) export class PageModifierComponent implements OnInit { - plantForm: FormGroup; - updatePlantForm: FormGroup; - plantInfos: any; - plantId: any; + editPlant!: Plant; + plantId!: string; @@ -21,61 +19,54 @@ export class PageModifierComponent implements OnInit { private router: Router, private fb: FormBuilder, private route: ActivatedRoute) { - this.updatePlantForm = new FormGroup({}); - this.plantForm = this.initForm(); } ngOnInit(): void { - /** Pour récuperer l'id de la plante à modifier **/ - this.plantId = this.route.snapshot.paramMap.get('id'); + /** Pour récuperer l'id de la plante à modifier et appel Api**/ + this.route.paramMap.subscribe((params : ParamMap) => { + const id = params.get('id') + if( id != null){ + this.plantId = id; + console.log(this.plantId); - /** Appel Api **/ - this.adminService - .getPlantById(this.plantId) - .subscribe((plantInfos: any) => { - this.plantInfos = plantInfos; - console.log(this.plantInfos); - console.log(this.plantInfos.product_name); - }); - } - - /** Méthode qui initialise les champs du formulaire avec les infos du db Json **/ - private initForm(plant?: Plant): FormGroup { - - return this.fb.group({ - nom:[plant ? plant.name : ''], - price: [plant ? plant.price : ''], - quantity: [plant ? plant.quantity : ''], - category: [plant ? plant.category : ''], - rating: [plant ? plant.rating : ''], - inStock: [plant ? plant.inStock : ['']], + this.adminService + .getPlantById(this.plantId) + .subscribe((plantData: any) => { + this.editPlant = plantData; + console.log(this.editPlant); + console.log(this.editPlant.name); + }); + } }); + } + /** Méthode qui envoie les champs modifiés pour mise à jour **/ - public onSubmit(): void { - const nameValue = this.updatePlantForm.value['nameFc']; - const priceValue = this.updatePlantForm.value['priceFc']; - const ratingValue = this.updatePlantForm.value['ratingFc']; - const quantityValue = this.updatePlantForm.value['quantityFc']; - const categoryValue = this.updatePlantForm.value['categoryFc']; - const inStockValue = this.updatePlantForm.value['inStockFc']; - const urlPicture = "https//picsum.photos/id/18/200/300"; + public update(event: any): void { + console.log(event); + // const nameValue = this.updatePlantForm.value['nameFc']; + // const priceValue = this.updatePlantForm.value['priceFc']; + // const ratingValue = this.updatePlantForm.value['ratingFc']; + // const quantityValue = this.updatePlantForm.value['quantityFc']; + // const categoryValue = this.updatePlantForm.value['categoryFc']; + // const inStockValue = this.updatePlantForm.value['inStockFc']; + // const urlPicture = "https//picsum.photos/id/18/200/300"; - const plant: Plant = { - id: this.plantId, - name: nameValue, - price: priceValue, - quantity: quantityValue, - rating: ratingValue, - category: categoryValue, - inStock: [inStockValue], - urlPicture - }; - this.adminService.updatePlant(plant)?.subscribe((resp) => { - this.router.navigate(['admin']); - }); + // const plant: Plant = { + // id: this.plantId, + // name: nameValue, + // price: priceValue, + // quantity: quantityValue, + // rating: ratingValue, + // category: categoryValue, + // inStock: [inStockValue], + // urlPicture + // }; + // this.adminService.updatePlant(plant)?.subscribe((resp) => { + // this.router.navigate(['admin']); + // }); } } From 7d8e72e4acb521d7fae0179236d042a162c2a183 Mon Sep 17 00:00:00 2001 From: Sana EL HIRI Date: Tue, 22 Mar 2022 11:43:33 +0100 Subject: [PATCH 2/2] modifier ok --- db.json | 171 +++++++++--------- .../formulaire/formulaire.component.ts | 14 +- src/app/modules/admin/models/plant.ts | 2 +- .../page-modifier/page-modifier.component.ts | 60 +++--- .../modules/admin/services/admin.service.ts | 2 +- 5 files changed, 129 insertions(+), 120 deletions(-) diff --git a/db.json b/db.json index 84931a1..7df0858 100644 --- a/db.json +++ b/db.json @@ -1,107 +1,104 @@ { "list_products": [ - { - "id": "801427", - "product_name": "Strelitzia Nicolai : D.21-H.75", - "product_price": "59,99", - "product_instock": "disponible", - "product_discount_code": "", - "product_color": "Blanc", - "product_unitprice_ati": "59.99", - "product_unitprice_tf": "54.5", - "product_discount_tf": "0.00", - "product_discount_ati": "0.00", - "product_qty": 0, - "product_rating": 3, - "product_breadcrumb_label": "plantes fleuries", - "product_url_page": "https://www.truffaut.com/strelitzia-nicolai-d-21-h-75-801427.html", - "product_url_picture": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0801000/801427_001.jpg", - "product_shipping_method": null, - "product_image_source": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0801000/801427_001.jpg", - "product_seller": "market place", - "product_web_only": "non" - }, { "id": "910744", - "product_name": "Spathiphyllum 'Sweet Lauretta' Pot déco foncé D24cm", - "product_price": "84,99", - "product_instock": "disponible", + "product_name": "bibi", + "product_price": "5", + "product_qty": 5, + "product_rating": 5, + "product_breadcrumb_label": "plantes fleuries", + "product_instock": [ + [ + [ + [ + "disponible" + ] + ] + ] + ], + "product_url_picture": "https//picsum.photos/id/18/200/300", "product_discount_code": "", "product_color": "", - "product_unitprice_ati": "84.99", - "product_unitprice_tf": "77.3", - "product_discount_tf": "0.00", - "product_discount_ati": "0.00", - "product_qty": 0, - "product_rating": 3, - "product_breadcrumb_label": "plantes fleuries", - "product_url_page": "https://www.truffaut.com/spathiphyllum-sweet-lauretta-pot-deco-fonce-d24cm-910744.html", - "product_url_picture": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0910000/910744_001.jpg", + "product_unitprice_ati": "", + "product_unitprice_tf": "", + "product_discount_tf": "", + "product_discount_ati": "", + "product_url_page": "", "product_shipping_method": null, - "product_image_source": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0910000/910744_001.jpg", + "product_image_source": "", "product_seller": "market place", "product_web_only": "non" }, { "id": "910743", - "product_name": "Spathiphyllum 'Sweet Lauretta' Pot déco clair D24cm", - "product_price": "84,99", - "product_instock": "disponible", + "product_name": "Baba", + "product_price": "5", + "product_qty": 5, + "product_rating": 5, + "product_breadcrumb_label": "plantes fleuries", + "product_instock": [ + [ + "disponible" + ] + ], + "product_url_picture": "https//picsum.photos/id/18/200/300", "product_discount_code": "", "product_color": "", - "product_unitprice_ati": "84.99", - "product_unitprice_tf": "77.3", - "product_discount_tf": "0.00", - "product_discount_ati": "0.00", - "product_qty": 0, - "product_rating": 3, - "product_breadcrumb_label": "plantes fleuries", - "product_url_page": "https://www.truffaut.com/spathiphyllum-sweet-lauretta-pot-deco-clair-d24cm-910743.html", - "product_url_picture": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0910000/910743_001.jpg", + "product_unitprice_ati": "", + "product_unitprice_tf": "", + "product_discount_tf": "", + "product_discount_ati": "", + "product_url_page": "", "product_shipping_method": null, - "product_image_source": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0910000/910743_001.jpg", + "product_image_source": "", "product_seller": "market place", "product_web_only": "non" }, { "id": "63158", - "product_name": "Spathiphyllum: d.14cm, pot grand modèle", - "product_price": "7,95", - "product_instock": "disponible", + "product_name": "boubou", + "product_price": "5", + "product_qty": 5, + "product_rating": 5, + "product_breadcrumb_label": "cactus et plantes grasses", + "product_instock": [ + "partiellement disponible" + ], + "product_url_picture": "https//picsum.photos/id/18/200/300", "product_discount_code": "", - "product_color": "Blanc", - "product_unitprice_ati": "7.95", - "product_unitprice_tf": "7.2", - "product_discount_tf": "0.00", - "product_discount_ati": "0.00", - "product_qty": 1, - "product_rating": 3, - "product_breadcrumb_label": "plantes fleuries", - "product_url_page": "https://www.truffaut.com/spathiphyllum-d-14cm-pot-grand-modele-63158.html", - "product_url_picture": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0063000/63158_005.jpg", + "product_color": "", + "product_unitprice_ati": "", + "product_unitprice_tf": "", + "product_discount_tf": "", + "product_discount_ati": "", + "product_url_page": "", "product_shipping_method": null, - "product_image_source": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0063000/63158_005.jpg", - "product_seller": "Truffaut", - "product_web_only": "oui" + "product_image_source": "", + "product_seller": "market place", + "product_web_only": "non" }, { "id": "910674", "product_name": "Spathiphyllum 'Sweet Lauretta' pot D24cm", "product_price": "69,99", - "product_instock": "disponible", + "product_qty": 3, + "product_rating": 4, + "product_breadcrumb_label": "plantes fleuries", + "product_instock": [ + [ + "disponible" + ] + ], + "product_url_picture": "https//picsum.photos/id/18/200/300", "product_discount_code": "", "product_color": "", - "product_unitprice_ati": "69.99", - "product_unitprice_tf": "63.6", - "product_discount_tf": "0.00", - "product_discount_ati": "0.00", - "product_qty": 0, - "product_rating": 3, - "product_breadcrumb_label": "plantes fleuries", - "product_url_page": "https://www.truffaut.com/spathiphyllum-sweet-lauretta-pot-d24cm-910674.html", - "product_url_picture": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0910000/910674_001.jpg", + "product_unitprice_ati": "", + "product_unitprice_tf": "", + "product_discount_tf": "", + "product_discount_ati": "", + "product_url_page": "", "product_shipping_method": null, - "product_image_source": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0910000/910674_001.jpg", + "product_image_source": "", "product_seller": "market place", "product_web_only": "non" }, @@ -109,20 +106,22 @@ "id": "801429", "product_name": "Strelitzia Nicolai Cache-pot Anthracite: D.21-H.75", "product_price": "64,99", - "product_instock": "disponible", - "product_discount_code": "", - "product_color": "Blanc", - "product_unitprice_ati": "64.99", - "product_unitprice_tf": "59.1", - "product_discount_tf": "0.00", - "product_discount_ati": "0.00", - "product_qty": 0, - "product_rating": 3, + "product_qty": 5, + "product_rating": 4.5, "product_breadcrumb_label": "plantes fleuries", - "product_url_page": "https://www.truffaut.com/strelitzia-nicolai-cache-pot-gris-d-21-h-75-801429.html", - "product_url_picture": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0801000/801429_001.jpg", + "product_instock": [ + "disponible" + ], + "product_url_picture": "https//picsum.photos/id/18/200/300", + "product_discount_code": "", + "product_color": "", + "product_unitprice_ati": "", + "product_unitprice_tf": "", + "product_discount_tf": "", + "product_discount_ati": "", + "product_url_page": "", "product_shipping_method": null, - "product_image_source": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0801000/801429_001.jpg", + "product_image_source": "", "product_seller": "market place", "product_web_only": "non" }, diff --git a/src/app/modules/admin/components/formulaire/formulaire.component.ts b/src/app/modules/admin/components/formulaire/formulaire.component.ts index fe9f604..57e57fb 100644 --- a/src/app/modules/admin/components/formulaire/formulaire.component.ts +++ b/src/app/modules/admin/components/formulaire/formulaire.component.ts @@ -10,7 +10,7 @@ import { Plant } from '../../models/plant'; export class FormulaireComponent implements OnInit { plantForm!: FormGroup; @Input()buttonLabel!:String; - @Input() plantInfos!: Plant; + @Input() plantInfos!: any; @Output() submitted = new EventEmitter(); constructor(private fb : FormBuilder) { @@ -19,12 +19,12 @@ export class FormulaireComponent implements OnInit { ngOnInit(): void { console.log(this.plantInfos); this.plantForm = this.fb.group({ - nameFc: new FormControl(this.plantInfos.name, [Validators.required]), - priceFc: new FormControl(this.plantInfos.price, [Validators.required]), - quantityFc: new FormControl(this.plantInfos.quantity, [Validators.required]), - inStockFc: new FormControl(this.plantInfos.inStock, [Validators.required]), - categoryFc: new FormControl(this.plantInfos.category, [Validators.required]), - ratingFc: new FormControl(this.plantInfos.rating, [Validators.required]), + nameFc: new FormControl(this.plantInfos.product_name, [Validators.required]), + priceFc: new FormControl(this.plantInfos.product_price, [Validators.required]), + quantityFc: new FormControl(this.plantInfos.product_qty, [Validators.required]), + inStockFc: new FormControl(this.plantInfos.product_instock, [Validators.required]), + categoryFc: new FormControl(this.plantInfos.product_breadcrumb_label, [Validators.required]), + ratingFc: new FormControl(this.plantInfos.product_rating, [Validators.required]), }); } diff --git a/src/app/modules/admin/models/plant.ts b/src/app/modules/admin/models/plant.ts index b6d2bf4..337fc91 100644 --- a/src/app/modules/admin/models/plant.ts +++ b/src/app/modules/admin/models/plant.ts @@ -9,6 +9,6 @@ export class Plant { public category:string[]=['plantes fleuries','orchides','cactus et plantes grasses','bonsas','plantes vertes','palmier dintrieur'], public urlPicture: string = "https//picsum.photos/id/18/200/300", public rating: number = 0, - public id?: number + public id?: string ){} } diff --git a/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts b/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts index a656787..08c26a6 100644 --- a/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts +++ b/src/app/modules/admin/pages/page-modifier/page-modifier.component.ts @@ -27,14 +27,14 @@ export class PageModifierComponent implements OnInit { const id = params.get('id') if( id != null){ this.plantId = id; - console.log(this.plantId); + //console.log(this.plantId); this.adminService .getPlantById(this.plantId) .subscribe((plantData: any) => { this.editPlant = plantData; - console.log(this.editPlant); - console.log(this.editPlant.name); + //console.log(this.editPlant); + //console.log(this.editPlant.name); }); } }); @@ -44,29 +44,39 @@ export class PageModifierComponent implements OnInit { /** Méthode qui envoie les champs modifiés pour mise à jour **/ - public update(event: any): void { - console.log(event); - // const nameValue = this.updatePlantForm.value['nameFc']; - // const priceValue = this.updatePlantForm.value['priceFc']; - // const ratingValue = this.updatePlantForm.value['ratingFc']; - // const quantityValue = this.updatePlantForm.value['quantityFc']; - // const categoryValue = this.updatePlantForm.value['categoryFc']; - // const inStockValue = this.updatePlantForm.value['inStockFc']; - // const urlPicture = "https//picsum.photos/id/18/200/300"; + public update(plant: any): void { + //console.log(plant); + const nameValue = plant.nameFc; + const priceValue = plant.priceFc; + const ratingValue = plant.ratingFc; + const quantityValue = plant.quantityFc; + const categoryValue = plant.categoryFc; + const inStockValue = plant.inStockFc; - // const plant: Plant = { - // id: this.plantId, - // name: nameValue, - // price: priceValue, - // quantity: quantityValue, - // rating: ratingValue, - // category: categoryValue, - // inStock: [inStockValue], - // urlPicture - // }; - // this.adminService.updatePlant(plant)?.subscribe((resp) => { - // this.router.navigate(['admin']); - // }); + const plante: any = { + id: this.plantId, + product_name: nameValue, + product_price: priceValue, + product_qty: quantityValue, + product_rating: ratingValue, + product_breadcrumb_label: categoryValue, + product_instock: [inStockValue], + product_url_picture : "https//picsum.photos/id/18/200/300", + product_discount_code : "", + product_color: "", + product_unitprice_ati: "", + product_unitprice_tf: "", + product_discount_tf: "", + product_discount_ati: "", + product_url_page: "", + product_shipping_method: null, + product_image_source: "", + product_seller: "market place", + product_web_only: "non" + }; + this.adminService.updatePlant(plante)?.subscribe((resp) => { + this.router.navigate(['admin']); + }); } } diff --git a/src/app/modules/admin/services/admin.service.ts b/src/app/modules/admin/services/admin.service.ts index aa94aa9..4ff8008 100644 --- a/src/app/modules/admin/services/admin.service.ts +++ b/src/app/modules/admin/services/admin.service.ts @@ -21,7 +21,7 @@ export class AdminService { //console.log("avant mapping: ", tabObj); // Ici grâce à la méthode .map() on transforme tout les objet json du tableau en instance de notre classe Plant() return tabObj.map((obj: any) => { - return new Plant(obj.product_name, obj.product_price,obj.product_quantity,obj.product_instock,obj.product_breadcrumb_label,obj.product_image_source,obj.product_rating,obj.id); + return new Plant(obj.product_name, obj.product_price,obj.product_qty,obj.product_instock,obj.product_breadcrumb_label,obj.product_image_source,obj.product_rating,obj.id); }) })); //this.collection$ = this.httpClient.get(`${this.apiUrl}/list_products`);