added profil section and fix error in stock-table.html

2025-11-13 23:37:49 +01:00
parent ef5aaf67bd
commit 9c8a41286a
9 changed files with 138 additions and 38 deletions
@@ -0,0 +1,38 @@
+<form nz-form nzLayout="horizontal" [formGroup]="profilForm" (ngSubmit)="submitForm()">
+    <nz-form-item nz-flex>
+        <nz-form-label nzSpan="9" nzRequired>
+            Prénom
+        </nz-form-label>
+
+        <nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Alain" formControlName="newName">
+        </nz-form-control>
+    </nz-form-item>
+    <nz-form-item nz-flex>
+        <nz-form-label nzSpan="9" nzRequired>
+            Email
+        </nz-form-label>
+
+        <nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="alain.terieur@pyrofetes.fr" formControlName="newEmail">
+        </nz-form-control>
+    </nz-form-item>
+    <nz-form-item nz-flex>
+        <nz-form-label nzSpan="9" nzRequired>
+            Fonction
+        </nz-form-label>
+
+        <nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="visiteur" formControlName="newFonction">
+        </nz-form-control>
+    </nz-form-item>
+    <nz-form-item nz-flex>
+        <nz-form-label nzSpan="9" nzRequired>
+            Mot de passe
+        </nz-form-label>
+
+        <nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
+            <input nz-input type="password" placeholder="Nouveau mot de passe" formControlName="newPassword">
+        </nz-form-control>
+    </nz-form-item>
+</form>
@@ -0,0 +1,42 @@
+import { Component } from '@angular/core';
+import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzColDirective} from "ng-zorro-antd/grid";
+import {NzFlexDirective} from "ng-zorro-antd/flex";
+import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
+import {NzInputDirective} from "ng-zorro-antd/input";
+
+@Component({
+  selector: 'app-profil-form',
+    imports: [
+        FormsModule,
+        NzColDirective,
+        NzFlexDirective,
+        NzFormControlComponent,
+        NzFormDirective,
+        NzFormItemComponent,
+        NzFormLabelComponent,
+        NzInputDirective,
+        ReactiveFormsModule
+    ],
+  templateUrl: './profil-form.html',
+  styleUrl: './profil-form.css',
+})
+export class ProfilForm {
+    profilForm: FormGroup = new FormGroup({
+        newName: new FormControl<string>(null, [Validators.required]),
+        newEmail: new FormControl<string>(null, [Validators.required]),
+        newFonction: new FormControl<string>(null, [Validators.required]),
+        newPassword: new FormControl<string>(null, [Validators.required])
+    })
+
+    submitForm() {
+        // Pour annuler si le formulaire est invalide
+        if (this.profilForm.invalid) return;
+
+        // Pour obtenir la valeur du formulaire
+        console.log(this.profilForm.getRawValue())
+
+        // Pour vider le formulaire
+        this.profilForm.reset()
+    }
+}