102 lines
3.3 KiB
HTML
102 lines
3.3 KiB
HTML
<h2 mat-dialog-title>{{ mode === 'create' ? 'Nouveau produit' : 'Modifier le produit' }}</h2>
|
|
|
|
<div mat-dialog-content class="grid" [formGroup]="form">
|
|
|
|
<!-- 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">
|
|
<mat-option [value]="null" disabled>Choisir…</mat-option>
|
|
@for (c of categories; track c.id) {
|
|
<mat-option [value]="c.id">{{ c.name }}</mat-option>
|
|
}
|
|
</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">
|
|
<mat-option [value]="null" disabled>Choisir…</mat-option>
|
|
@for (m of manufacturers; track m.id) {
|
|
<mat-option [value]="m.id">{{ m.name }}</mat-option>
|
|
}
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<!-- Sélecteur pour la plateforme (Fournisseur) -->
|
|
<mat-form-field class="col-6">
|
|
<mat-label>Plateforme</mat-label>
|
|
<mat-select formControlName="supplierId">
|
|
<mat-option [value]="null" disabled>Choisir…</mat-option>
|
|
@for (s of suppliers; track s.id) {
|
|
<mat-option [value]="s.id">{{ s.name }}</mat-option>
|
|
}
|
|
</mat-select>
|
|
</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>
|
|
|
|
<!-- 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">
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<div mat-dialog-actions>
|
|
<button mat-button (click)="close()">Annuler</button>
|
|
<button mat-raised-button color="primary" (click)="save()" [disabled]="form.invalid">
|
|
{{ mode === 'create' ? 'Créer' : 'Enregistrer' }}
|
|
</button>
|
|
</div>
|