diff --git a/src/app/components/book-card/book-card.html b/src/app/components/book-card/book-card.html index bd93846..9846b3b 100644 --- a/src/app/components/book-card/book-card.html +++ b/src/app/components/book-card/book-card.html @@ -3,8 +3,14 @@ [nzBordered]="false" nzTitle="{{ bookInfo().title }}" [nzExtra]="extraTemplate"> +

{{ bookInfo().isbn }}

{{ bookInfo().author }}

{{ bookInfo().releaseYear }}

+
+ + + + diff --git a/src/app/components/book-card/book-card.ts b/src/app/components/book-card/book-card.ts index a54bdca..22c6f02 100644 --- a/src/app/components/book-card/book-card.ts +++ b/src/app/components/book-card/book-card.ts @@ -1,17 +1,27 @@ import {Component, input} from '@angular/core'; // Importation de la fonction input() et des components import {BookInfo} from '../../interfaces/book.interfaces'; import {NzCardComponent} from "ng-zorro-antd/card"; -import {NzFlexDirective} from "ng-zorro-antd/flex"; // Interface +import {CreateBook} from "../create-book/create-book"; +import {Modal} from "../modal/modal"; +import {icons} from "../../icons-provider"; +import {NzButtonComponent} from "ng-zorro-antd/button"; @Component({ selector: 'app-book-card', imports: [ NzCardComponent, - NzFlexDirective + CreateBook, + Modal, + NzButtonComponent, ], templateUrl: './book-card.html', styleUrl: './book-card.css', }) export class BookCard { bookInfo = input.required(); + + + delete() { + return + } } diff --git a/src/app/components/create-book/create-book.html b/src/app/components/create-book/create-book.html index e69ce5c..5768039 100644 --- a/src/app/components/create-book/create-book.html +++ b/src/app/components/create-book/create-book.html @@ -1,37 +1,41 @@
- + Titre - + - - Date de publication + + ISBN - - + + - + Auteur - + - - - + + + Date de publication + + + + + +
\ No newline at end of file diff --git a/src/app/components/create-book/create-book.ts b/src/app/components/create-book/create-book.ts index c66796e..518ee77 100644 --- a/src/app/components/create-book/create-book.ts +++ b/src/app/components/create-book/create-book.ts @@ -1,17 +1,17 @@ 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-create-book', - imports: [NzFormModule, NzFlexDirective, ReactiveFormsModule], + imports: [NzFormModule, ReactiveFormsModule], templateUrl: './create-book.html', styleUrls: ['./create-book.css'], }) export class CreateBook { createBookForm = new FormGroup({ title: new FormControl(null, [Validators.required]), + isbn: new FormControl(null, [Validators.required]), releaseYear: new FormControl(null, [Validators.required]), author: new FormControl(null, [Validators.required]) }) diff --git a/src/app/components/create-modal/create-modal.css b/src/app/components/modal/modal.css similarity index 100% rename from src/app/components/create-modal/create-modal.css rename to src/app/components/modal/modal.css diff --git a/src/app/components/create-modal/create-modal.html b/src/app/components/modal/modal.html similarity index 55% rename from src/app/components/create-modal/create-modal.html rename to src/app/components/modal/modal.html index bdf8c99..dae501f 100644 --- a/src/app/components/create-modal/create-modal.html +++ b/src/app/components/modal/modal.html @@ -1,13 +1,17 @@ + + + + - - \ No newline at end of file + diff --git a/src/app/components/create-modal/create-modal.ts b/src/app/components/modal/modal.ts similarity index 72% rename from src/app/components/create-modal/create-modal.ts rename to src/app/components/modal/modal.ts index 852eeae..663ddc3 100644 --- a/src/app/components/create-modal/create-modal.ts +++ b/src/app/components/modal/modal.ts @@ -1,16 +1,16 @@ -import {Component, input, Type} from '@angular/core'; +import {Component, input} from '@angular/core'; import { NzButtonModule } from 'ng-zorro-antd/button'; import { NzModalModule } from 'ng-zorro-antd/modal'; import {NgComponentOutlet} from "@angular/common"; @Component({ - selector: 'app-create-modal', + selector: 'app-modal', imports: [NzButtonModule, NzModalModule, NgComponentOutlet], - templateUrl: 'create-modal.html', - styleUrls: ['./create-modal.css'], + templateUrl: 'modal.html', + styleUrls: ['./modal.css'], }) -export class CreateModal { - content = input.required>(); +export class Modal { + name = input.required(); isVisible = false; isOkLoading = false; diff --git a/src/app/components/update-book/update-book.html b/src/app/components/update-book/update-book.html index fd0d142..e69de29 100644 --- a/src/app/components/update-book/update-book.html +++ b/src/app/components/update-book/update-book.html @@ -1,37 +0,0 @@ -
- - - Titre - - - - - - - - - - Date de publication - - - - - - - - - - Auteur - - - - - - - - - - -
\ No newline at end of file diff --git a/src/app/components/update-book/update-book.ts b/src/app/components/update-book/update-book.ts index a4167d8..4712991 100644 --- a/src/app/components/update-book/update-book.ts +++ b/src/app/components/update-book/update-book.ts @@ -6,24 +6,25 @@ import {NzFlexDirective} from "ng-zorro-antd/flex"; @Component({ selector: 'app-update-book', imports: [NzFormModule, NzFlexDirective, ReactiveFormsModule], - templateUrl: './update-book.html', + templateUrl: '../create-book/create-book.html', styleUrl: './update-book.css', }) export class UpdateBook { - updateBookForm = new FormGroup({ + createBookForm = new FormGroup({ title: new FormControl(null, [Validators.required]), + isbn: new FormControl(null, [Validators.required]), releaseYear: new FormControl(null, [Validators.required]), author: new FormControl(null, [Validators.required]) }) submitForm() { // Pour annuler si le formulaire est invalide - if (this.updateBookForm.invalid) return; + if (this.createBookForm.invalid) return; // Pour obtenir la valeur du formulaire - console.log(this.updateBookForm.getRawValue()) + console.log(this.createBookForm.getRawValue()) // Pour vider le formulaire - this.updateBookForm.reset() + this.createBookForm.reset() } } diff --git a/src/app/interfaces/book.interfaces.ts b/src/app/interfaces/book.interfaces.ts index e2bc1f7..bcf6555 100644 --- a/src/app/interfaces/book.interfaces.ts +++ b/src/app/interfaces/book.interfaces.ts @@ -1,5 +1,6 @@ export interface BookInfo { title: string; + isbn: string; releaseYear: number; author: string; } \ No newline at end of file diff --git a/src/app/pages/book/book.html b/src/app/pages/book/book.html index d847891..9dfdeca 100644 --- a/src/app/pages/book/book.html +++ b/src/app/pages/book/book.html @@ -1,4 +1,6 @@ - + + +
@for (book of books; track $index) { diff --git a/src/app/pages/book/book.ts b/src/app/pages/book/book.ts index 20360e0..b79d09d 100644 --- a/src/app/pages/book/book.ts +++ b/src/app/pages/book/book.ts @@ -1,29 +1,27 @@ import { Component } from '@angular/core'; import {BookInfo} from "../../interfaces/book.interfaces"; import {BookCard} from "../../components/book-card/book-card"; -import {NzModalComponent} from "ng-zorro-antd/modal"; -import {CreateModal} from "../../components/create-modal/create-modal"; +import {Modal} from "../../components/modal/modal"; import {CreateBook} from "../../components/create-book/create-book"; @Component({ selector: 'app-book', imports: [ BookCard, - NzModalComponent, - CreateModal + Modal, + CreateBook ], templateUrl: './book.html', styleUrls: ['./book.css'], }) export class Book { - CreateBookComponent = CreateBook; - books: BookInfo[] = [ - { title: '1984', author: 'George Orwell', releaseYear: 1949 }, - { title: 'Le Seigneur des Anneaux', author: 'J.R.R. Tolkien', releaseYear: 1954 }, - { title: 'Dune', author: 'Frank Herbert', releaseYear: 1965 }, - { title: 'Fahrenheit 451', author: 'Ray Bradbury', releaseYear: 1953 }, - { title: 'Les Misérables', author: 'Victor Hugo', releaseYear: 1862 }, - { title: 'Harry Potter à l’école des sorciers', author: 'J.K. Rowling', releaseYear: 1997 }, + { title: '1984', isbn: '978-0451524935', author: 'George Orwell', releaseYear: 1949 }, + { title: 'Le Seigneur des Anneaux', isbn: '978-0544003415', author: 'J.R.R. Tolkien', releaseYear: 1954 }, + { title: 'Dune', isbn: '978-0441013593', author: 'Frank Herbert', releaseYear: 1965 }, + { title: 'Fahrenheit 451', isbn: '978-1451673319', author: 'Ray Bradbury', releaseYear: 1953 }, + { title: 'Les Misérables', isbn: '978-2070409185', author: 'Victor Hugo', releaseYear: 1862 }, + { title: 'Harry Potter à l’école des sorciers', isbn: '978-2070643028', author: 'J.K. Rowling', releaseYear: 1997 }, ]; + }