feat: add quantity field to product CRUD; implement image upload and condition handling in product dialog
This commit is contained in:
@@ -1,11 +1,37 @@
|
||||
<h2 mat-dialog-title>{{ mode === 'create' ? 'Nouveau produit' : 'Modifier le produit' }}</h2>
|
||||
|
||||
<div mat-dialog-content class="grid" [formGroup]="form">
|
||||
<mat-form-field class="col-6">
|
||||
|
||||
<!-- Input pour l'upload des images -->
|
||||
<div class="col-12">
|
||||
<label for="fileInput">Images du produit</label>
|
||||
<input type="file" multiple (change)="onFiles($event)">
|
||||
</div>
|
||||
|
||||
<!-- Affichage des vignettes des images existantes en mode édition -->
|
||||
@if (mode==='edit' && existingImageUrls.length) {
|
||||
<div class="col-12">
|
||||
<div class="thumbs">
|
||||
@for (url of existingImageUrls; track url) {
|
||||
<img [src]="url" alt="Produit">
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- Input pour le nom du produit -->
|
||||
<mat-form-field class="col-12">
|
||||
<mat-label>Nom du produit</mat-label>
|
||||
<input matInput formControlName="name" autocomplete="off">
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Textarea pour la description -->
|
||||
<mat-form-field class="col-12">
|
||||
<mat-label>Description</mat-label>
|
||||
<textarea matInput rows="4" formControlName="description"></textarea>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Sélecteur pour la catégorie -->
|
||||
<mat-form-field class="col-6">
|
||||
<mat-label>Catégorie</mat-label>
|
||||
<mat-select formControlName="categoryId">
|
||||
@@ -16,6 +42,17 @@
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Sélecteur pour l'état du produit -->
|
||||
<mat-form-field class="col-6">
|
||||
<mat-label>État</mat-label>
|
||||
<mat-select formControlName="conditionLabel">
|
||||
@for (opt of conditionOptions; track opt) {
|
||||
<mat-option [value]="opt">{{ opt }}</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Sélecteur pour la marque -->
|
||||
<mat-form-field class="col-6">
|
||||
<mat-label>Marque</mat-label>
|
||||
<mat-select formControlName="manufacturerId">
|
||||
@@ -26,8 +63,9 @@
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Sélecteur pour la plateforme (Fournisseur) -->
|
||||
<mat-form-field class="col-6">
|
||||
<mat-label>Fournisseur</mat-label>
|
||||
<mat-label>Plateforme</mat-label>
|
||||
<mat-select formControlName="supplierId">
|
||||
<mat-option [value]="null" disabled>Choisir…</mat-option>
|
||||
@for (s of suppliers; track s.id) {
|
||||
@@ -36,34 +74,19 @@
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="col-12">
|
||||
<mat-label>Description</mat-label>
|
||||
<textarea matInput rows="4" formControlName="description"></textarea>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Checkboxes pour Complet/Notice -->
|
||||
<div class="col-12 flags">
|
||||
<mat-checkbox formControlName="complete">Complet</mat-checkbox>
|
||||
<mat-checkbox formControlName="hasManual">Notice</mat-checkbox>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<label for="fileInput">Images du produit</label>
|
||||
<input type="file" multiple (change)="onFiles($event)">
|
||||
</div>
|
||||
|
||||
<div class="col-12" *ngIf="mode==='edit' && existingImageUrls.length">
|
||||
<div class="thumbs">
|
||||
@for (url of existingImageUrls; track url) {
|
||||
<img [src]="url" alt="Produit">
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Inputs pour le prix -->
|
||||
<mat-form-field class="col-4">
|
||||
<mat-label>Prix TTC (€)</mat-label>
|
||||
<input matInput type="number" step="0.01" min="0" formControlName="priceTtc">
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Input pour la quantité -->
|
||||
<mat-form-field class="col-4">
|
||||
<mat-label>Quantité</mat-label>
|
||||
<input matInput type="number" step="1" min="0" formControlName="quantity">
|
||||
|
||||
Reference in New Issue
Block a user