first of many

This commit is contained in:
2025-11-20 15:10:43 +01:00
parent 0d9238d1a1
commit e269848f82
8 changed files with 466 additions and 5 deletions
@@ -0,0 +1,152 @@
<form nz-form nzLayout="horizontal" [formGroup]="QuotationForm" (ngSubmit)="submitForm()">
<nz-form-item nz-flex>
<nz-form-label nzSpan="9" nzRequired>
Quantité
</nz-form-label>
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
<input nz-input type="number" placeholder="Quantité" formControlName="quantity">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
ID Devis
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="ID Devis" formControlName="quotationId">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Message du devis
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input placeholder="Message du devis" formControlName="quotationMessage">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Conditions de vente
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input placeholder="Conditions de vente" formControlName="quotationConditionsSale">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
ID Produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="ID Produit" formControlName="productId">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Référence produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="Référence produit" formControlName="productReferences">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Nom du produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input placeholder="Nom du produit" formControlName="productName">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Durée produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="Durée produit" formControlName="productDuration">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Calibre produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="Calibre produit" formControlName="productCaliber">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Numéro d'approbation
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="Numéro d'approbation" formControlName="productApprovalNumber">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Poids produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="Poids produit" formControlName="productWeight">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
NEC Produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="NEC Produit" formControlName="productNec">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Image produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input placeholder="Image produit" formControlName="productImage">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Lien produit
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input placeholder="Lien produit" formControlName="productLink">
</nz-form-control>
</nz-form-item>
<nz-form-item nz-flex>
<nz-form-label nzSpan="9">
Quantité minimale
</nz-form-label>
<nz-form-control nzSpan="12">
<input nz-input type="number" placeholder="Quantité minimale" formControlName="productMinimalQuantity">
</nz-form-control>
</nz-form-item>
</form>
@@ -0,0 +1,54 @@
import { Component } from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {NzColDirective} from "ng-zorro-antd/grid";
import {NzFlexDirective} from "ng-zorro-antd/flex";
import {NzDatePickerComponent} from "ng-zorro-antd/date-picker";
@Component({
selector: 'app-quotation-form',
imports: [
NzFormItemComponent,
NzFormLabelComponent,
NzFormControlComponent,
NzInputDirective,
NzColDirective,
NzFlexDirective,
NzFormDirective,
ReactiveFormsModule,
NzDatePickerComponent
],
templateUrl: './quotation-form.html',
styleUrl: './quotation-form.css',
})
export class QuotationForm {
QuotationForm: FormGroup = new FormGroup({
quantity: new FormControl<number>(null, [Validators.required]),
quotationId: new FormControl<number>(null),
quotationMessage: new FormControl<string>(null),
quotationConditionsSale: new FormControl<string>(null),
productId: new FormControl<number>(null),
productReferences: new FormControl<number>(null),
productName: new FormControl<string>(null),
productDuration: new FormControl<number>(null),
productCaliber: new FormControl<number>(null),
productApprovalNumber: new FormControl<number>(null),
productWeight: new FormControl<number>(null),
productNec: new FormControl<number>(null),
productImage: new FormControl<string>(null),
productLink: new FormControl<string>(null),
productMinimalQuantity: new FormControl<number>(null)
})
submitForm() {
// Pour annuler si le formulaire est invalide
if (this.QuotationForm.invalid) return;
// Pour obtenir la valeur du formulaire
console.log(this.QuotationForm.getRawValue())
// Pour vider le formulaire
this.QuotationForm.reset()
}
}