created components with forms for project

src/app/components/create-author/create-author.html

@@ -0,0 +1 @@
+<p>create-author works!</p>

src/app/components/create-author/create-author.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-create-author',
+  imports: [],
+  templateUrl: './create-author.html',
+  styleUrl: './create-author.css',
+})
+export class CreateAuthor {
+
+}

src/app/components/create-book/create-book.ts

@@ -1,10 +1,11 @@
 import { Component } from '@angular/core';
 import {NzFormModule} from "ng-zorro-antd/form";
-import {FormControl, FormGroup, Validators} from "@angular/forms";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzFlexDirective} from "ng-zorro-antd/flex";
 
 @Component({
   selector: 'app-create-book',
-    imports: [NzFormModule],
+    imports: [NzFormModule, NzFlexDirective, ReactiveFormsModule],
   templateUrl: './create-book.html',
   styleUrl: './create-book.css',
 })

src/app/components/create-loan/create-loan.html

@@ -0,0 +1 @@
+<p>create-loan works!</p>

src/app/components/create-loan/create-loan.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-create-loan',
+  imports: [],
+  templateUrl: './create-loan.html',
+  styleUrl: './create-loan.css',
+})
+export class CreateLoan {
+
+}

src/app/components/create-user/create-user.html

@@ -0,0 +1 @@
+<p>create-user works!</p>

src/app/components/create-user/create-user.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-create-user',
+  imports: [],
+  templateUrl: './create-user.html',
+  styleUrl: './create-user.css',
+})
+export class CreateUser {
+
+}

src/app/components/update-author/update-author.html

@@ -0,0 +1 @@
+<p>update-author works!</p>

src/app/components/update-author/update-author.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-update-author',
+  imports: [],
+  templateUrl: './update-author.html',
+  styleUrl: './update-author.css',
+})
+export class UpdateAuthor {
+
+}

src/app/components/update-book/update-book.html

@@ -0,0 +1,37 @@
+<form nz-form nzLayout="horizontal" [formGroup]="updateBookForm" (ngSubmit)="submitForm()">
+    <nz-form-item>
+        <nz-form-label nzSpan="4" nzRequired>
+            Titre
+        </nz-form-label>
+
+        <nz-form-control nzSpan="20" nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Titre du livre" formControlName="title">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="4" nzRequired>
+            Date de publication
+        </nz-form-label>
+
+        <nz-form-control nzSpan="20" nzErrorTip="Ce champ est requis">
+            <input nz-input type="number" placeholder="2005" formControlName="releaseYear">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="4" nzRequired>
+            Auteur
+        </nz-form-label>
+
+        <nz-form-control nzSpan="20" nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Auteur" formControlName="author">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-flex nzJustify="end">
+        <button nz-button nzType="primary" (click)="submitForm()">
+            Modifier
+        </button>
+    </nz-flex>
+</form>

src/app/components/update-book/update-book.ts

@@ -0,0 +1,29 @@
+import { Component } from '@angular/core';
+import {NzFormModule} from "ng-zorro-antd/form";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzFlexDirective} from "ng-zorro-antd/flex";
+
+@Component({
+  selector: 'app-update-book',
+  imports: [NzFormModule, NzFlexDirective, ReactiveFormsModule],
+  templateUrl: './update-book.html',
+  styleUrl: './update-book.css',
+})
+export class UpdateBook {
+    updateBookForm = new FormGroup({
+        title: new FormControl<string>(null, [Validators.required]),
+        releaseYear: new FormControl<string>(null, [Validators.required]),
+        author: new FormControl<string>(null, [Validators.required])
+    })
+
+    submitForm() {
+        // Pour annuler si le formulaire est invalide
+        if (this.updateBookForm.invalid) return;
+
+        // Pour obtenir la valeur du formulaire
+        console.log(this.updateBookForm.getRawValue())
+
+        // Pour vider le formulaire
+        this.updateBookForm.reset()
+    }
+}

src/app/components/update-loan/update-loan.html

@@ -0,0 +1 @@
+<p>update-loan works!</p>

src/app/components/update-loan/update-loan.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-update-loan',
+  imports: [],
+  templateUrl: './update-loan.html',
+  styleUrl: './update-loan.css',
+})
+export class UpdateLoan {
+
+}

src/app/components/update-user/update-user.html

@@ -0,0 +1 @@
+<p>update-user works!</p>

src/app/components/update-user/update-user.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-update-user',
+  imports: [],
+  templateUrl: './update-user.html',
+  styleUrl: './update-user.css',
+})
+export class UpdateUser {
+
+}

src/app/pages/welcome/welcome.ts

@@ -3,9 +3,7 @@ import {CreateBook} from "../../components/create-book/create-book";
 
 @Component({
   selector: 'app-welcome',
-    imports: [
-        CreateBook
-    ],
+    imports: [],
   templateUrl: './welcome.html',
   styleUrl: './welcome.css'
 })