Compare commits
	
		
			No commits in common. "main" and "feature/modifier-plante" have entirely different histories.
		
	
	
		
			main
			...
			feature/mo
		
	
		
					 12 changed files with 72 additions and 128 deletions
				
			
		
							
								
								
									
										25
									
								
								db.json
									
										
									
									
									
								
							
							
						
						
									
										25
									
								
								db.json
									
										
									
									
									
								
							|  | @ -5983,31 +5983,6 @@ | |||
|       "product_image_source": "https://images.truffaut.com/media/catalog/product/cdn:///Articles/jpg/0832000/832900_001.jpg", | ||||
|       "product_seller": "Truffaut", | ||||
|       "product_web_only": "oui" | ||||
|     }, | ||||
|     { | ||||
|       "id": "JbdahUA", | ||||
|       "product_name": "bibi", | ||||
|       "product_price": "8", | ||||
|       "product_qty": 5, | ||||
|       "product_rating": 5, | ||||
|       "product_breadcrumb_label": "plantes fleuries", | ||||
|       "product_instock": [ | ||||
|         [ | ||||
|           "non 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": "", | ||||
|       "product_seller": "market place", | ||||
|       "product_web_only": "non" | ||||
|     } | ||||
|   ], | ||||
|   "users": [ | ||||
|  |  | |||
|  | @ -21,7 +21,6 @@ | |||
|                 <a class="nav-link disabled" *ngIf="likeCounter == 0"> Pas de plante likée</a> | ||||
|                 <a class="nav-link disabled" *ngIf="likeCounter == 1">Plante likée : {{ likeCounter }}</a> | ||||
|                 <a class="nav-link disabled" *ngIf="likeCounter > 1">Plantes likées : {{ likeCounter }}</a> | ||||
|                 <a routerLink="admin" routerLinkActive="active-custom" class="nav-link">Page administrateur</a> | ||||
|             </div> | ||||
|         </div> | ||||
|     </div> | ||||
|  |  | |||
|  | @ -13,8 +13,8 @@ | |||
|   margin-right: auto; | ||||
|   border: solid 1px; | ||||
|   border-radius: 10px; | ||||
|   background-color: #306340; | ||||
|   border-color: #306340; | ||||
|   background-color: #64c982; | ||||
|   border-color: #64c982; | ||||
| } | ||||
| 
 | ||||
| .form-plant .checkbox { | ||||
|  | @ -70,6 +70,6 @@ | |||
| .btn-outline-success { | ||||
|   margin-top: 10px; | ||||
|   background-color: #ffff; | ||||
|   color: #306340 !important; | ||||
|   border-color: #306340 !important; | ||||
|   color: #64c982 !important; | ||||
|   border-color: #64c982 !important; | ||||
| } | ||||
|  |  | |||
|  | @ -1,3 +1,5 @@ | |||
| import { Category } from "./category"; | ||||
| 
 | ||||
| export class Plant { | ||||
|   constructor( | ||||
|     public name: string='', | ||||
|  | @ -7,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: string = '' | ||||
|     public id?: string | ||||
|   ){} | ||||
| } | ||||
|  |  | |||
|  | @ -1,2 +1,2 @@ | |||
| <h1>Ajouter une plante</h1> | ||||
| <app-formulaire [plantInfos]="newplant" (submitted)="addPlant($event)" [buttonLabel]="'Ajouter une plante'"></app-formulaire> | ||||
| <app-formulaire [buttonLabel]="'Ajouter une plante'"></app-formulaire> | ||||
|  |  | |||
|  | @ -1,6 +1,4 @@ | |||
| h1{ | ||||
|   display: flex; | ||||
|   justify-content: center; | ||||
|   color: rgba(0, 0, 0, 0.658); | ||||
|   font-size: 28px; | ||||
|   margin-top: 20px; | ||||
|  |  | |||
|  | @ -19,49 +19,43 @@ import { AdminService } from '../../services/admin.service'; | |||
|   styleUrls: ['./page-ajouter.component.scss'], | ||||
| }) | ||||
| export class PageAjouterComponent implements OnInit { | ||||
|   public newplant = new Plant(); | ||||
|   public plantForm: FormGroup; | ||||
|   public isAdd: boolean = false; | ||||
| 
 | ||||
| 
 | ||||
|   constructor(private fb: FormBuilder, private router: Router, private adminService: AdminService) { | ||||
| 
 | ||||
|     this.plantForm = new FormGroup({}); | ||||
|     this.isAdd = false; | ||||
|   } | ||||
| 
 | ||||
|   ngOnInit(): void { | ||||
| 
 | ||||
|   } | ||||
| 
 | ||||
|   public addPlant(plant: any): void { | ||||
|     const nameValue = plant.nameFc; | ||||
|     const priceValue = plant.priceFc; | ||||
|     const ratingValue = plant.ratingFc; | ||||
|     const quantityValue = plant.quantityFc; | ||||
|     const categoryValue = plant.categoryFc; | ||||
|     const inStockValue = plant.inStockFc; | ||||
|   public onSubmit(): void { | ||||
|     const nameValue = this.plantForm.value['nameFC']; | ||||
|     const priceValue = this.plantForm.value['priceFc']; | ||||
|     const quantityValue = this.plantForm.value['quantityFc']; | ||||
|     const inStockValue = this.plantForm.value['inStockFC']; | ||||
|     const categoryValue = this.plantForm.value['categotyFC']; | ||||
|     const urlPicture: string = 'https//picsum.photos/id/18/200/300'; | ||||
|     const ratingValue = this.plantForm.value['ratingFc']; | ||||
|     const idValue = this.plantForm.value['']; | ||||
| 
 | ||||
|     const plante: any = { | ||||
|       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" | ||||
|     const plant : Plant = { | ||||
|       name: nameValue, | ||||
|       price: priceValue, | ||||
|       quantity: quantityValue, | ||||
|       inStock: [inStockValue], | ||||
|       category: [categoryValue], | ||||
|       urlPicture: 'https//picsum.photos/id/18/200/300', | ||||
|       rating: ratingValue, | ||||
|       id: idValue, | ||||
|     }; | ||||
|     console.log("coco",plant); | ||||
| 
 | ||||
|     this.adminService.addPlant(plante)?.subscribe((resp)=>{ | ||||
|       this.router.navigate(['admin']); | ||||
|     this.adminService.addPlant(plant)?.subscribe((resp)=>{ | ||||
|     }) | ||||
| 
 | ||||
|     this.router.navigate(['admin']); | ||||
|   } | ||||
| } | ||||
|  |  | |||
|  | @ -1,6 +1,4 @@ | |||
| h1{ | ||||
|   display: flex; | ||||
|   justify-content: center; | ||||
|   color: rgba(0, 0, 0, 0.658); | ||||
|   font-size: 28px; | ||||
|   margin-top: 20px; | ||||
|  |  | |||
|  | @ -1,35 +1,30 @@ | |||
| <div id="container"> | ||||
|   <div id="button"> | ||||
|     <button class="w-100 btn btn-lg btn-outline-success" routerLink="../ajouter">Ajouter une plante </button> | ||||
|   </div> | ||||
|   <table class="table" *ngIf="subCollection$ | async as collection"> | ||||
|     <thead class="thead-dark" style="background-color: #306340 ; color:#f3f7f4 ;"> | ||||
|       <tr> | ||||
|         <th scope="col">Id</th> | ||||
|         <th scope="col">Nom</th> | ||||
|         <th scope="col">Prix</th> | ||||
|         <th scope="col">Quantité</th> | ||||
|         <th scope="col">En stock</th> | ||||
|         <th scope="col">Catégorie</th> | ||||
|         <th scope="col">Note</th> | ||||
|         <th scope="col">Modifier</th> | ||||
|         <th scope="col">Supprimer</th> | ||||
| 
 | ||||
|       </tr> | ||||
|     </thead> | ||||
|     <tbody> | ||||
|       <tr *ngFor="let products of collection"> | ||||
|         <td>{{products.id}}</td> | ||||
|         <td>{{products.name}}</td> | ||||
|         <td>{{products.price}}</td> | ||||
|         <td>{{products.quantity}}</td> | ||||
|         <td>{{products.inStock}}</td> | ||||
|         <td>{{products.category}}</td> | ||||
|         <td>{{products.rating}}</td> | ||||
|         <td><a class="bi-pencil-square" style="color: #5472b1;" routerLink="../modifier/{{products.id}}"></a></td> | ||||
|         <td class="bi-trash-fill" style="color: rgb(231, 73, 73); cursor: pointer;" (click)="onClickDelete(products.id)"></td> | ||||
|       </tr> | ||||
|     </tbody> | ||||
|   </table> | ||||
| </div> | ||||
| <table class="table" *ngIf="subCollection$ | async as collection"> | ||||
|   <thead class="thead-dark"> | ||||
|     <tr> | ||||
|       <th scope="col">Id</th> | ||||
|       <th scope="col">Nom</th> | ||||
|       <th scope="col">Prix</th> | ||||
|       <th scope="col">Quantité</th> | ||||
|       <th scope="col">En stock</th> | ||||
|       <th scope="col">Catégorie</th> | ||||
|       <th scope="col">Note</th> | ||||
|       <th scope="col">Modifier</th> | ||||
|       <th scope="col">Supprimer</th> | ||||
| 
 | ||||
|     </tr> | ||||
|   </thead> | ||||
|   <tbody> | ||||
|     <tr *ngFor="let products of collection"> | ||||
|       <th scope="row">{{products.id}}</th> | ||||
|       <td>{{products.name}}</td> | ||||
|       <td>{{products.price}}</td> | ||||
|       <td>{{products.quantity}}</td> | ||||
|       <td>{{products.inStock}}</td> | ||||
|       <td>{{products.category}}</td> | ||||
|       <td>{{products.rating}}</td> | ||||
|       <td><a class="bi-pencil-square" routerLink="../modifier/{{products.id}}"></a></td> | ||||
|       <td class="bi-trash-fill" style="color: red; cursor: pointer;" (click)="onClickDelete(products.id)"></td> | ||||
|     </tr> | ||||
|   </tbody> | ||||
| </table> | ||||
| <button routerLink="../ajouter">Ajouter une plante </button> | ||||
|  |  | |||
|  | @ -1,19 +0,0 @@ | |||
| #container{ | ||||
|   display: flex; | ||||
|   justify-content: center; | ||||
|   margin-top: 5rem; | ||||
| } | ||||
| table{ | ||||
|   width: 75%; | ||||
|   margin-left: 2rem; | ||||
| } | ||||
| button{ | ||||
|   background-color: #306340; | ||||
|   color: #f3f7f4 !important; | ||||
|   border-color: #306340 !important; | ||||
| } | ||||
| #button{ | ||||
|   width: 10%; | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
|  | @ -28,7 +28,8 @@ export class PageTableauComponent implements OnInit { | |||
|     //   })
 | ||||
|   } | ||||
| 
 | ||||
|   onClickDelete(id: string){ | ||||
|   onClickDelete(id: any){ | ||||
|     console.log(id); | ||||
|     this.adminService.onClickDelete(id).subscribe((resp) => { | ||||
|       console.log("Suppression successful : ", resp); | ||||
|     }); | ||||
|  |  | |||
|  | @ -31,15 +31,16 @@ export class AdminService { | |||
|   public refreshCollection(): void { | ||||
|     // On se sert de notre flux de donnée type observable froid
 | ||||
|     this.collection$.subscribe((listPlant: Plant[]) => { | ||||
|       this.plantCollection = [...listPlant]; | ||||
|       // Utiliser un observable chaud (subject) pour nexter nos données recues de notre observable froid
 | ||||
|       this.subCollection$.next(listPlant); | ||||
|     }) | ||||
|   } | ||||
| 
 | ||||
|   addPlant(plant: Plant): Observable<any> | void { | ||||
|     return this.httpClient.post(`${this.apiUrl}/list_products`, plant); | ||||
|     return this.httpClient.post(`${this.apiUrl}`, plant); | ||||
|   } | ||||
|   onClickDelete(id: string): Observable<any> { | ||||
|   onClickDelete(id: number): Observable<any> { | ||||
|     return this.httpClient.delete<any>(`${this.apiUrl}/list_products/${id}`).pipe( | ||||
|       tap(() => this.refreshCollection()) | ||||
|     ); | ||||
|  |  | |||
		Loading…
	
	Add table
		
		Reference in a new issue