Compare commits
No commits in common. "main" and "feature/modifier-plante" have entirely different histories.
main
...
feature/mo
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…
Reference in New Issue
Block a user