select category et divers
This commit is contained in:
parent
4d93763aa5
commit
f2279bc977
@ -44,20 +44,22 @@
|
|||||||
/>
|
/>
|
||||||
<label for="floatingInputQuantity">Quantité</label>
|
<label for="floatingInputQuantity">Quantité</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-floating">
|
<div class="form-floating select">
|
||||||
<input
|
<select
|
||||||
type="text"
|
|
||||||
class="form-control"
|
class="form-control"
|
||||||
id="floatingCategory"
|
id="floatingInputCategory"
|
||||||
placeholder=""
|
placeholder=""
|
||||||
name="category"
|
name="category"
|
||||||
formControlName="categoryFc"
|
formControlName="categoryFc"
|
||||||
[ngClass]="{
|
>
|
||||||
'is-valid': plantForm.controls['categoryFc'].valid,
|
<option value="plantes fleuries">Plantes fleuries</option>
|
||||||
'is-invalid': !plantForm.controls['categoryFc'].valid
|
<option value="orchides">Orchidées</option>
|
||||||
}"
|
<option value="cactus et plantes grasses">Cactus et plantes grasses</option>
|
||||||
/>
|
<option value="bonsas">Bonsas</option>
|
||||||
<label for="floatingInputCategory">Catégorie</label>
|
<option value="plantes vertes">Plantes vertes</option>
|
||||||
|
<option value="palmier dintrieur">Palmier d'intérieur</option>
|
||||||
|
</select>
|
||||||
|
<label value="category">Sélectionnez catégorie</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-floating">
|
<div class="form-floating">
|
||||||
<input
|
<input
|
||||||
|
@ -1,5 +1,7 @@
|
|||||||
import { Component, Input, OnInit } from '@angular/core';
|
import { Component, Input, OnInit } from '@angular/core';
|
||||||
import { FormBuilder, FormGroup } from '@angular/forms';
|
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
|
||||||
|
import { Plant } from '../../models/plant';
|
||||||
|
import { AdminService } from '../../services/admin.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-formulaire',
|
selector: 'app-formulaire',
|
||||||
@ -8,12 +10,23 @@ import { FormBuilder, FormGroup } from '@angular/forms';
|
|||||||
})
|
})
|
||||||
export class FormulaireComponent implements OnInit {
|
export class FormulaireComponent implements OnInit {
|
||||||
plantForm!: FormGroup;
|
plantForm!: FormGroup;
|
||||||
|
@Input() plantInfos!: Plant;
|
||||||
|
@Input() isAdd : boolean = true;
|
||||||
@Input()buttonLabel!:String;
|
@Input()buttonLabel!:String;
|
||||||
constructor(private fb : FormBuilder) {
|
constructor(private fb : FormBuilder, private adminService: AdminService) {
|
||||||
this.plantForm = this.fb.group({});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit(): void {}
|
ngOnInit(): void {
|
||||||
|
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]),
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
onSubmit(){}
|
onSubmit(){}
|
||||||
}
|
}
|
||||||
|
@ -6,7 +6,7 @@ export class Plant {
|
|||||||
public price: number =1,
|
public price: number =1,
|
||||||
public quantity: number= 0,
|
public quantity: number= 0,
|
||||||
public inStock: string[]=['disponible','partiellement disponible', 'non disponible'],
|
public inStock: string[]=['disponible','partiellement disponible', 'non disponible'],
|
||||||
public category:Category,
|
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 urlPicture: string = "https//picsum.photos/id/18/200/300",
|
||||||
public rating: number = 0,
|
public rating: number = 0,
|
||||||
public id?: number
|
public id?: number
|
||||||
|
@ -1,2 +1,2 @@
|
|||||||
<h2>Ajouter une plante</h2>
|
<h1>Ajouter une plante</h1>
|
||||||
<app-formulaire [buttonLabel]="'Ajouter une plante'"></app-formulaire>
|
<app-formulaire [buttonLabel]="'Ajouter une plante'" [isAdd]="true"></app-formulaire>
|
||||||
|
@ -0,0 +1,5 @@
|
|||||||
|
h1{
|
||||||
|
color: rgba(0, 0, 0, 0.658);
|
||||||
|
font-size: 28px;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
@ -20,28 +20,24 @@ import { AdminService } from '../../services/admin.service';
|
|||||||
})
|
})
|
||||||
export class PageAjouterComponent implements OnInit {
|
export class PageAjouterComponent implements OnInit {
|
||||||
public plantForm: FormGroup;
|
public plantForm: FormGroup;
|
||||||
|
public isAdd: boolean = false;
|
||||||
|
|
||||||
|
|
||||||
constructor(private fb: FormBuilder, private router: Router, private adminService: AdminService) {
|
constructor(private fb: FormBuilder, private router: Router, private adminService: AdminService) {
|
||||||
this.plantForm = new FormGroup({});
|
this.plantForm = new FormGroup({});
|
||||||
|
this.isAdd = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.plantForm = this.fb.group({
|
|
||||||
nameFC: new FormControl('', [Validators.required]),
|
|
||||||
priceFc: new FormControl('', [Validators.required]),
|
|
||||||
quantityFc: new FormControl('', [Validators.required]),
|
|
||||||
categoryFc: new FormControl('', [Validators.required]),
|
|
||||||
ratingFc: new FormControl('', [Validators.required]),
|
|
||||||
inStockFc: new FormControl('', []),
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public onSubmit(): void {
|
public onSubmit(): void {
|
||||||
const nameValue = this.plantForm.value['nameFC'];
|
const nameValue = this.plantForm.value['nameFC'];
|
||||||
const priceValue = this.plantForm.value['priceFc'];
|
const priceValue = this.plantForm.value['priceFc'];
|
||||||
const quantityValue = this.plantForm.value['quantityFc'];
|
const quantityValue = this.plantForm.value['quantityFc'];
|
||||||
const inStockValue = this.plantForm.value['categoryFc'];
|
const inStockValue = this.plantForm.value['inStockFC'];
|
||||||
const categoryValue = this.plantForm.value[''];
|
const categoryValue = this.plantForm.value['categotyFC'];
|
||||||
const urlPicture: string = 'https//picsum.photos/id/18/200/300';
|
const urlPicture: string = 'https//picsum.photos/id/18/200/300';
|
||||||
const ratingValue = this.plantForm.value['ratingFc'];
|
const ratingValue = this.plantForm.value['ratingFc'];
|
||||||
const idValue = this.plantForm.value[''];
|
const idValue = this.plantForm.value[''];
|
||||||
@ -51,12 +47,12 @@ export class PageAjouterComponent implements OnInit {
|
|||||||
price: priceValue,
|
price: priceValue,
|
||||||
quantity: quantityValue,
|
quantity: quantityValue,
|
||||||
inStock: [inStockValue],
|
inStock: [inStockValue],
|
||||||
category: categoryValue,
|
category: [categoryValue],
|
||||||
urlPicture: 'https//picsum.photos/id/18/200/300',
|
urlPicture: 'https//picsum.photos/id/18/200/300',
|
||||||
rating: ratingValue,
|
rating: ratingValue,
|
||||||
id: idValue,
|
id: idValue,
|
||||||
};
|
};
|
||||||
console.log(plant);
|
console.log("coco",plant);
|
||||||
|
|
||||||
this.adminService.addPlant(plant)?.subscribe((resp)=>{
|
this.adminService.addPlant(plant)?.subscribe((resp)=>{
|
||||||
})
|
})
|
||||||
|
@ -19,12 +19,12 @@
|
|||||||
<td>{{products.name}}</td>
|
<td>{{products.name}}</td>
|
||||||
<td>{{products.price}}</td>
|
<td>{{products.price}}</td>
|
||||||
<td>{{products.quantity}}</td>
|
<td>{{products.quantity}}</td>
|
||||||
<td>{{products.instock}}</td>
|
<td>{{products.inStock}}</td>
|
||||||
<!-- <td>{{products.Catégorie.}}</td> -->
|
<td>{{products.category}}</td>
|
||||||
<td>{{products.rating}}</td>
|
<td>{{products.rating}}</td>
|
||||||
<td><a class="bi-pencil-square" routerLink="../modifier"></a></td>
|
<td><a class="bi-pencil-square" routerLink="../modifier"></a></td>
|
||||||
<td class="bi-trash-fill" style="color: red; cursor: pointer;" (click)="onClickDelete(products.id)"></td>
|
<td class="bi-trash-fill" style="color: red; cursor: pointer;" (click)="onClickDelete(products.id)"></td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
<button>Ajouter une plante</button>
|
<button routerLink="../ajouter">Ajouter une plante </button>
|
||||||
|
Loading…
Reference in New Issue
Block a user