From 73ce63d7d0d39a2ff5974972045e9da0f59360a3 Mon Sep 17 00:00:00 2001 From: sanchezvem Date: Tue, 18 Nov 2025 10:47:33 +0100 Subject: [PATCH] connect front to back --- package-lock.json | 29 +- .../components/author-card/author-card.css | 85 ++++++ .../components/author-card/author-card.html | 63 ++-- src/app/components/author-card/author-card.ts | 45 ++- src/app/components/book-card/book-card.css | 110 +++++-- src/app/components/book-card/book-card.html | 48 ++-- src/app/components/book-card/book-card.ts | 43 ++- .../components/create-author/create-author.ts | 1 - src/app/components/loan-table/loan-table.html | 15 +- src/app/components/loan-table/loan-table.ts | 213 ++------------ src/app/components/user-table/user-table.html | 23 +- src/app/components/user-table/user-table.ts | 269 ++---------------- src/app/interfaces/author.interfaces.ts | 4 - src/app/interfaces/book.interfaces.ts | 6 - src/app/interfaces/loan.interfaces.ts | 10 - src/app/interfaces/user.interfaces.ts | 9 - src/app/pages/author/author.html | 4 +- src/app/pages/author/author.ts | 15 +- src/app/pages/book/book.html | 4 +- src/app/pages/book/book.ts | 14 +- src/app/pages/loan/loan.ts | 6 +- 21 files changed, 399 insertions(+), 617 deletions(-) delete mode 100644 src/app/interfaces/author.interfaces.ts delete mode 100644 src/app/interfaces/book.interfaces.ts delete mode 100644 src/app/interfaces/loan.interfaces.ts delete mode 100644 src/app/interfaces/user.interfaces.ts diff --git a/package-lock.json b/package-lock.json index 49fa549..7f681c2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -499,7 +499,6 @@ "resolved": "https://registry.npmjs.org/@angular/common/-/common-20.3.10.tgz", "integrity": "sha512-12fEzvKbEqjqy1fSk9DMYlJz6dF1MJVXuC5BB+oWWJpd+2lfh4xJ62pkvvLGAICI89hfM5n9Cy5kWnXwnqPZsA==", "license": "MIT", - "peer": true, "dependencies": { "tslib": "^2.3.0" }, @@ -516,7 +515,6 @@ "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-20.3.10.tgz", "integrity": "sha512-cW939Lr8GZjPSYfbQKIDNrUaHWmn2M+zBbERThfq5skLuY+xM60bJFv4NqBekfX6YqKLCY62ilUZlnImYIXaqA==", "license": "MIT", - "peer": true, "dependencies": { "tslib": "^2.3.0" }, @@ -530,7 +528,6 @@ "integrity": "sha512-9BemvpFxA26yIVdu8ROffadMkEdlk/AQQ2Jb486w7RPkrvUQ0pbEJukhv9aryJvhbMopT66S5H/j4ipOUMzmzQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@babel/core": "7.28.3", "@jridgewell/sourcemap-codec": "^1.4.14", @@ -563,7 +560,6 @@ "resolved": "https://registry.npmjs.org/@angular/core/-/core-20.3.10.tgz", "integrity": "sha512-g99Qe+NOVo72OLxowVF9NjCckswWYHmvO7MgeiZTDJbTjF9tXH96dMx7AWq76/GUinV10sNzDysVW16NoAbCRQ==", "license": "MIT", - "peer": true, "dependencies": { "tslib": "^2.3.0" }, @@ -589,7 +585,6 @@ "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-20.3.10.tgz", "integrity": "sha512-9yWr51EUauTEINB745AaHwZNTHLpXIm4uxuykxzOg+g2QskEgVfH26uS8G2ogdNuwYpB8wnsXWr34qhM3qgOWw==", "license": "MIT", - "peer": true, "dependencies": { "tslib": "^2.3.0" }, @@ -608,7 +603,6 @@ "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-20.3.10.tgz", "integrity": "sha512-UV8CGoB5P3FmJciI3/I/n3L7C3NVgGh7bIlZ1BaB/qJDtv0Wq0rRAGwmT/Z3gwmrRtfHZWme7/CeQ2CYJmMyUQ==", "license": "MIT", - "peer": true, "dependencies": { "tslib": "^2.3.0" }, @@ -631,7 +625,6 @@ "resolved": "https://registry.npmjs.org/@angular/router/-/router-20.3.10.tgz", "integrity": "sha512-Z03cfH1jgQ7XMDJj4R8qAGqivcvhdG3wYBwaiN1K1ODBgPhbFKNeD4stKqYp7xBNtswmM2O2jMxrL/Djwju4Gg==", "license": "MIT", - "peer": true, "dependencies": { "tslib": "^2.3.0" }, @@ -713,7 +706,6 @@ "integrity": "sha512-yDBHV9kQNcr2/sUr9jghVyz9C3Y5G2zUM2H2lo+9mKv4sFgbA8s8Z9t8D1jiTkGoO/NoIfKMyKWr4s6CN23ZwQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@ampproject/remapping": "^2.2.0", "@babel/code-frame": "^7.27.1", @@ -1681,7 +1673,6 @@ "integrity": "sha512-nqhDw2ZcAUrKNPwhjinJny903bRhI0rQhiDz1LksjeRxqa36i3l75+4iXbOy0rlDpLJGxqtgoPavQjmmyS5UJw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@inquirer/checkbox": "^4.2.1", "@inquirer/confirm": "^5.1.14", @@ -2537,7 +2528,6 @@ "resolved": "https://registry.npmjs.org/@nestjs/common/-/common-11.1.6.tgz", "integrity": "sha512-krKwLLcFmeuKDqngG2N/RuZHCs2ycsKcxWIDgcm7i1lf3sQ0iG03ci+DsP/r3FcT/eJDFsIHnKtNta2LIi7PzQ==", "license": "MIT", - "peer": true, "dependencies": { "file-type": "21.0.0", "iterare": "1.2.1", @@ -4354,7 +4344,6 @@ "resolved": "https://registry.npmjs.org/axios/-/axios-1.12.2.tgz", "integrity": "sha512-vMJzPewAlRyOgxV2dU0Cuz2O8zzzx9VYtbJOaBgXFeLc4IV/Eg50n4LowmehOOR61S8ZMpc2K5Sa7g6A4jfkUw==", "license": "MIT", - "peer": true, "dependencies": { "follow-redirects": "^1.15.6", "form-data": "^4.0.4", @@ -4523,7 +4512,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "baseline-browser-mapping": "^2.8.19", "caniuse-lite": "^1.0.30001751", @@ -5721,7 +5709,6 @@ "integrity": "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "accepts": "^2.0.0", "body-parser": "^2.2.0", @@ -6981,7 +6968,6 @@ "integrity": "sha512-j1n1IuTX1VQjIy3tT7cyGbX7nvQOsFLoIqobZv4ttI5axP923gA44zUj6miiA6R5Aoms4sEGVIIcucXUbRI14g==", "dev": true, "license": "Apache-2.0", - "peer": true, "dependencies": { "copy-anything": "^2.0.1", "parse-node-version": "^1.0.1", @@ -7269,7 +7255,6 @@ "integrity": "sha512-SL0JY3DaxylDuo/MecFeiC+7pedM0zia33zl0vcjgwcq1q1FWWF1To9EIauPbl8GbMCU0R2e0uJ8bZunhYKD2g==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "cli-truncate": "^4.0.0", "colorette": "^2.0.20", @@ -8927,8 +8912,7 @@ "version": "0.2.2", "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz", "integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q==", - "license": "Apache-2.0", - "peer": true + "license": "Apache-2.0" }, "node_modules/require-directory": { "version": "2.1.1", @@ -9077,7 +9061,6 @@ "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz", "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==", "license": "Apache-2.0", - "peer": true, "dependencies": { "tslib": "^2.1.0" } @@ -9114,7 +9097,6 @@ "integrity": "sha512-9GUyuksjw70uNpb1MTYWsH9MQHOHY6kwfnkafC24+7aOMZn9+rVMBxRbLvw756mrBFbIsFg6Xw9IkR2Fnn3k+Q==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "chokidar": "^4.0.0", "immutable": "^5.0.2", @@ -9853,8 +9835,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", - "license": "0BSD", - "peer": true + "license": "0BSD" }, "node_modules/tuf-js": { "version": "3.1.0", @@ -9904,7 +9885,6 @@ "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==", "dev": true, "license": "Apache-2.0", - "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -10066,7 +10046,6 @@ "integrity": "sha512-uzcxnSDVjAopEUjljkWh8EIrg6tlzrjFUfMcR1EVsRDGwf/ccef0qQPRyOrROwhrTDaApueq+ja+KLPlzR/zdg==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "esbuild": "^0.25.0", "fdir": "^6.5.0", @@ -10447,7 +10426,6 @@ "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==", "dev": true, "license": "MIT", - "peer": true, "funding": { "url": "https://github.com/sponsors/colinhacks" } @@ -10466,8 +10444,7 @@ "version": "0.15.1", "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.15.1.tgz", "integrity": "sha512-XE96n56IQpJM7NAoXswY3XRLcWFW83xe0BiAOeMD7K5k5xecOeul3Qcpx6GqEeeHNkW5DWL5zOyTbEfB4eti8w==", - "license": "MIT", - "peer": true + "license": "MIT" } } } diff --git a/src/app/components/author-card/author-card.css b/src/app/components/author-card/author-card.css index e69de29..7ae664f 100644 --- a/src/app/components/author-card/author-card.css +++ b/src/app/components/author-card/author-card.css @@ -0,0 +1,85 @@ +/* Table globale */ +nz-table { + width: 100%; + border-collapse: separate; + border-spacing: 0 8px; /* espace entre les lignes */ + background: #fff; + border-radius: 8px; + overflow: hidden; + box-shadow: 0 2px 6px rgba(0,0,0,0.1); + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} + +/* En-tête */ +nz-table thead tr { + background-color: #f5f5f5; + text-align: left; + font-weight: 600; + color: #333; + border-bottom: 2px solid #e0e0e0; +} + +nz-table thead th { + padding: 12px 16px; +} + +/* Lignes du tableau */ +nz-table tbody tr { + background-color: #fff; + transition: background 0.2s ease; +} + +nz-table tbody tr:nth-child(even) { + background-color: #f9f9f9; +} + +nz-table tbody tr:hover { + background-color: #e6f7ff; /* survol */ +} + +/* Cellules */ +nz-table tbody td { + padding: 12px 16px; + vertical-align: middle; + color: #444; +} + +/* Boutons */ +nz-table button[nz-button] { + margin-right: 8px; +} + +/* Modals dans le tableau */ +nz-table app-modal { + margin-right: 8px; +} + +/* Dates (pour alignement et style) */ +nz-table tbody td p { + margin: 0; + font-size: 14px; + color: #555; +} + +/* Responsive */ +@media (max-width: 768px) { + nz-table thead { + display: none; + } + nz-table tbody tr { + display: block; + margin-bottom: 16px; + box-shadow: 0 1px 3px rgba(0,0,0,0.1); + border-radius: 8px; + padding: 12px; + } + nz-table tbody td { + display: flex; + justify-content: space-between; + padding: 6px 12px; + } + nz-table tbody td::before { + content: attr(data-label); + font-weight: 600; + } +} diff --git a/src/app/components/author-card/author-card.html b/src/app/components/author-card/author-card.html index d074284..f5e677d 100644 --- a/src/app/components/author-card/author-card.html +++ b/src/app/components/author-card/author-card.html @@ -1,16 +1,47 @@ -
-
- - - - - example - -
- - - - -
-
-
+ + + + Prénom + Nom + Livre + Action + + + + @for (author of authors(); track author.id) { + + {{ author.name}} + {{ author.firstName }} + + + + + + Titre + ISBN + Date de publication + + + + @for (book of author.books; track book.id) { + + {{ book.title }} + {{ book.isbn}} + {{ book.releaseYear}} + + } + + + + + + + + + + + + } + + diff --git a/src/app/components/author-card/author-card.ts b/src/app/components/author-card/author-card.ts index d314e9f..f286709 100644 --- a/src/app/components/author-card/author-card.ts +++ b/src/app/components/author-card/author-card.ts @@ -1,24 +1,49 @@ -import {Component, input} from '@angular/core'; -import {AuthorInfo} from "../../interfaces/author.interfaces"; +import {Component, inject, OnInit, signal} from '@angular/core'; import {Modal} from "../modal/modal"; import {NzButtonComponent} from "ng-zorro-antd/button"; -import {NzCardComponent, NzCardMetaComponent} from "ng-zorro-antd/card"; -import {UpdateAuthor} from "../update-author/update-author"; +import {AuthorsService, GetAuthorDto} from "../../services/api"; +import {NzNotificationService} from "ng-zorro-antd/notification"; +import {firstValueFrom} from "rxjs"; +import {NzTableComponent} from "ng-zorro-antd/table"; +import {UpdateLoan} from "../update-loan/update-loan"; @Component({ selector: 'app-author-card', imports: [ Modal, NzButtonComponent, - NzCardComponent, - UpdateAuthor, - NzCardMetaComponent + NzTableComponent, + UpdateLoan ], templateUrl: './author-card.html', - styleUrl: '../book-card/book-card.css', + styleUrl: './author-card.css', }) -export class AuthorCard { - authorInfo = input.required(); +export class AuthorCard implements OnInit { + private authorsService = inject(AuthorsService); + private notificationService = inject(NzNotificationService) + + authors = signal([]); + + authorsLoading = signal(false); + + async ngOnInit() { + await this.fetchauthors(); + } + + async fetchauthors() { + this.authorsLoading.set(true) + + try { + const authors = await firstValueFrom(this.authorsService.getAllAuthorsEndpoint()); + + } catch (e) { + this.notificationService.error( + 'Erreur', + 'Erreur de communication avec l\'API' + ) + } + this.authorsLoading.set(false) + } delete() { return diff --git a/src/app/components/book-card/book-card.css b/src/app/components/book-card/book-card.css index 90f3d78..e1098a2 100644 --- a/src/app/components/book-card/book-card.css +++ b/src/app/components/book-card/book-card.css @@ -1,37 +1,85 @@ -.book-card-container { - background: #f5f5f5; /* fond clair */ - padding: 20px; /* espace autour de la carte */ - border-radius: 12px; /* coins arrondis */ - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* ombre douce */ - transition: transform 0.2s, box-shadow 0.2s; /* animation au survol */ - width: 300px; - margin: 10px auto; /* centre la carte dans le parent */ -} - -.book-card-container:hover { - transform: translateY(-5px); /* petit effet de “lift” au survol */ - box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* ombre plus prononcée */ -} - -.book-card-container nz-card { - border-radius: 12px; /* coins arrondis de la carte NZ */ - background-color: #ffffff; /* fond blanc */ - padding: 16px; /* espace intérieur */ -} - -.book-card-container p { - margin: 5px 0; /* espace vertical entre les paragraphes */ - color: #333; /* texte gris foncé */ +/* Table globale */ +nz-table { + width: 100%; + border-collapse: separate; + border-spacing: 0 8px; /* espace entre les lignes */ + background: #fff; + border-radius: 8px; + overflow: hidden; + box-shadow: 0 2px 6px rgba(0,0,0,0.1); font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } -.book-card-container a { - color: #1890ff; /* bleu Ant Design */ - text-decoration: none; - font-weight: 500; - cursor: pointer; +/* En-tête */ +nz-table thead tr { + background-color: #f5f5f5; + text-align: left; + font-weight: 600; + color: #333; + border-bottom: 2px solid #e0e0e0; } -.book-card-container a:hover { - text-decoration: underline; /* souligne au survol */ +nz-table thead th { + padding: 12px 16px; } + +/* Lignes du tableau */ +nz-table tbody tr { + background-color: #fff; + transition: background 0.2s ease; +} + +nz-table tbody tr:nth-child(even) { + background-color: #f9f9f9; +} + +nz-table tbody tr:hover { + background-color: #e6f7ff; /* survol */ +} + +/* Cellules */ +nz-table tbody td { + padding: 12px 16px; + vertical-align: middle; + color: #444; +} + +/* Boutons */ +nz-table button[nz-button] { + margin-right: 8px; +} + +/* Modals dans le tableau */ +nz-table app-modal { + margin-right: 8px; +} + +/* Dates (pour alignement et style) */ +nz-table tbody td p { + margin: 0; + font-size: 14px; + color: #555; +} + +/* Responsive */ +@media (max-width: 768px) { + nz-table thead { + display: none; + } + nz-table tbody tr { + display: block; + margin-bottom: 16px; + box-shadow: 0 1px 3px rgba(0,0,0,0.1); + border-radius: 8px; + padding: 12px; + } + nz-table tbody td { + display: flex; + justify-content: space-between; + padding: 6px 12px; + } + nz-table tbody td::before { + content: attr(data-label); + font-weight: 600; + } +} \ No newline at end of file diff --git a/src/app/components/book-card/book-card.html b/src/app/components/book-card/book-card.html index 9ea0ef2..2a34337 100644 --- a/src/app/components/book-card/book-card.html +++ b/src/app/components/book-card/book-card.html @@ -1,19 +1,29 @@ -
- -

{{ bookInfo().isbn }}

-

{{ bookInfo().author }}

-

{{ bookInfo().releaseYear }}

-
- - - - -
-
- - - More - + + + + Titre + ISBN + Auteur + Date de publication + Action + + + + @for (book of books(); track book.id) { + + {{ book.title}} + {{ book.isbn }} + {{ book.bookAuthorName }} {{ book.bookAuthorFirstName }} + {{ book.releaseYear}} + + + + + + + + + } + + diff --git a/src/app/components/book-card/book-card.ts b/src/app/components/book-card/book-card.ts index e88125a..b896527 100644 --- a/src/app/components/book-card/book-card.ts +++ b/src/app/components/book-card/book-card.ts @@ -1,24 +1,49 @@ -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 {CreateBook} from "../create-book/create-book"; +import {Component, inject, OnInit, signal} from '@angular/core'; // Importation de la fonction input() et des components import {Modal} from "../modal/modal"; import {NzButtonComponent} from "ng-zorro-antd/button"; -import {UpdateBook} from "../update-book/update-book"; +import {BooksService, GetBookDto} from "../../services/api"; +import {NzNotificationService} from "ng-zorro-antd/notification"; +import {firstValueFrom} from "rxjs"; +import {NzTableComponent} from "ng-zorro-antd/table"; +import {UpdateUser} from "../update-user/update-user"; @Component({ selector: 'app-book-card', imports: [ - NzCardComponent, Modal, NzButtonComponent, - UpdateBook, + NzTableComponent, + UpdateUser, ], templateUrl: './book-card.html', styleUrl: './book-card.css', }) -export class BookCard { - bookInfo = input.required(); +export class BookCard implements OnInit { + private booksService = inject(BooksService); + private notificationService = inject(NzNotificationService) + + books = signal([]); + + booksLoading = signal(false); + + async ngOnInit() { + await this.fetchbooks(); + } + + async fetchbooks() { + this.booksLoading.set(true) + + try { + const books = await firstValueFrom(this.booksService.getAllBooksEndpoint()); + + } catch (e) { + this.notificationService.error( + 'Erreur', + 'Erreur de communication avec l\'API' + ) + } + this.booksLoading.set(false) + } delete() { return diff --git a/src/app/components/create-author/create-author.ts b/src/app/components/create-author/create-author.ts index e8e899c..857b7a2 100644 --- a/src/app/components/create-author/create-author.ts +++ b/src/app/components/create-author/create-author.ts @@ -2,7 +2,6 @@ import {Component, input} from '@angular/core'; import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms"; import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid"; import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form"; -import {AuthorInfo} from "../../interfaces/author.interfaces"; @Component({ selector: 'app-create-author', diff --git a/src/app/components/loan-table/loan-table.html b/src/app/components/loan-table/loan-table.html index 87d76f4..0487a31 100644 --- a/src/app/components/loan-table/loan-table.html +++ b/src/app/components/loan-table/loan-table.html @@ -1,4 +1,5 @@ - + Utilisateur @@ -10,13 +11,13 @@ - @for (data of basicTable.data; track data) { + @for (loan of loans(); track loan.id) { - {{ data.user.name}} {{data.user.firstName }} - {{ data.book.title }} - {{ data.date | date: 'dd/MM/yyyy' }} - {{ data.plannedReturningDate | date: 'dd/MM/yyyy'}} - {{ data.effectiveReturningDate | date: 'dd/MM/yyyy'}} + {{ loan.userName}} {{loan.userFirstName }} + {{ loan.bookTitle }} + {{ loan.date | date: 'dd/MM/yyyy' }} + {{ loan.plannedReturningDate | date: 'dd/MM/yyyy'}} + {{ loan.effectiveReturningDate | date: 'dd/MM/yyyy'}} diff --git a/src/app/components/loan-table/loan-table.ts b/src/app/components/loan-table/loan-table.ts index f900874..8b564f2 100644 --- a/src/app/components/loan-table/loan-table.ts +++ b/src/app/components/loan-table/loan-table.ts @@ -1,10 +1,12 @@ -import { Component } from '@angular/core'; +import {Component, inject, OnInit, signal} from '@angular/core'; import {DatePipe} from "@angular/common"; import {Modal} from "../modal/modal"; import {NzButtonComponent} from "ng-zorro-antd/button"; import {NzTableComponent} from "ng-zorro-antd/table"; import {UpdateLoan} from "../update-loan/update-loan"; -import {LoanInfo} from "../../interfaces/loan.interfaces"; +import {GetLoanDto, LoansService} from "../../services/api"; +import {NzNotificationService} from "ng-zorro-antd/notification"; +import {firstValueFrom} from "rxjs"; @Component({ selector: 'app-loan-table', @@ -18,189 +20,32 @@ import {LoanInfo} from "../../interfaces/loan.interfaces"; templateUrl: './loan-table.html', styleUrl: './loan-table.css', }) -export class LoanTable { - listOfData: LoanInfo[] = [ - { - book: { - title: 'Dune', - isbn: '9780441013593', - author: 'Frank Herbert', - releaseYear: 1965 - }, - user: { - name: 'Dupont', - firstName: 'Mathys', - email: 'mathys@biblio.fr', - birthDate: new Date('2004-05-21'), - loan: [] - }, - date: new Date('2025-11-01'), - plannedReturningDate: new Date('2025-12-01'), - effectiveReturningDate: null - }, - { - book: { - title: '1984', - isbn: '9780451524935', - author: 'George Orwell', - releaseYear: 1949 - }, - user: { - name: 'Durand', - firstName: 'Lucie', - email: 'lucie@biblio.fr', - birthDate: new Date('1998-03-12'), - loan: [] - }, - date: new Date('2025-10-20'), - plannedReturningDate: new Date('2025-11-20'), - effectiveReturningDate: new Date('2025-11-05') - }, - { - book: { - title: 'Le Seigneur des Anneaux', - isbn: '9780261102385', - author: 'J.R.R. Tolkien', - releaseYear: 1954 - }, - user: { - name: 'Bernard', - firstName: 'Thomas', - email: 'thomas@biblio.fr', - birthDate: new Date('1990-07-04'), - loan: [] - }, - date: new Date('2025-09-10'), - plannedReturningDate: new Date('2025-10-10'), - effectiveReturningDate: new Date('2025-10-02') - }, - { - book: { - title: 'Les Misérables', - isbn: '9780140444308', - author: 'Victor Hugo', - releaseYear: 1862 - }, - user: { - name: 'Moreau', - firstName: 'Sophie', - email: 'sophie@biblio.fr', - birthDate: new Date('1987-02-25'), - loan: [] - }, - date: new Date('2025-11-03'), - plannedReturningDate: new Date('2025-12-03'), - effectiveReturningDate: null - }, - { - book: { - title: 'Fahrenheit 451', - isbn: '9781451673319', - author: 'Ray Bradbury', - releaseYear: 1953 - }, - user: { - name: 'Leroy', - firstName: 'Julien', - email: 'julien@biblio.fr', - birthDate: new Date('2001-09-18'), - loan: [] - }, - date: new Date('2025-10-15'), - plannedReturningDate: new Date('2025-11-15'), - effectiveReturningDate: new Date('2025-11-13') - }, - { - book: { - title: 'Harry Potter à l’école des sorciers', - isbn: '9780747532743', - author: 'J.K. Rowling', - releaseYear: 1997 - }, - user: { - name: 'Petit', - firstName: 'Emma', - email: 'emma@biblio.fr', - birthDate: new Date('2006-11-30'), - loan: [] - }, - date: new Date('2025-11-08'), - plannedReturningDate: new Date('2025-12-08'), - effectiveReturningDate: null - }, - { - book: { - title: 'Le Petit Prince', - isbn: '9780156012195', - author: 'Antoine de Saint-Exupéry', - releaseYear: 1943 - }, - user: { - name: 'Roux', - firstName: 'Nicolas', - email: 'nicolas@biblio.fr', - birthDate: new Date('1995-08-14'), - loan: [] - }, - date: new Date('2025-09-25'), - plannedReturningDate: new Date('2025-10-25'), - effectiveReturningDate: new Date('2025-10-20') - }, - { - book: { - title: 'L’Étranger', - isbn: '9782070360024', - author: 'Albert Camus', - releaseYear: 1942 - }, - user: { - name: 'Fontaine', - firstName: 'Claire', - email: 'claire@biblio.fr', - birthDate: new Date('1992-04-17'), - loan: [] - }, - date: new Date('2025-10-05'), - plannedReturningDate: new Date('2025-11-05'), - effectiveReturningDate: new Date('2025-11-01') - }, - { - book: { - title: 'Le Hobbit', - isbn: '9780261102217', - author: 'J.R.R. Tolkien', - releaseYear: 1937 - }, - user: { - name: 'Blanc', - firstName: 'Hugo', - email: 'hugo@biblio.fr', - birthDate: new Date('2000-01-09'), - loan: [] - }, - date: new Date('2025-11-02'), - plannedReturningDate: new Date('2025-12-02'), - effectiveReturningDate: null - }, - { - book: { - title: 'La Peste', - isbn: '9780141185064', - author: 'Albert Camus', - releaseYear: 1947 - }, - user: { - name: 'Garnier', - firstName: 'Léa', - email: 'lea@biblio.fr', - birthDate: new Date('1999-06-11'), - loan: [] - }, - date: new Date('2025-09-01'), - plannedReturningDate: new Date('2025-10-01'), - effectiveReturningDate: new Date('2025-09-27') +export class LoanTable implements OnInit { + private loansService = inject(LoansService); + private notificationService = inject(NzNotificationService) + + loans = signal([]); + + loansLoading = signal(false); + + async ngOnInit() { + await this.fetchloans(); + } + + async fetchloans() { + this.loansLoading.set(true) + + try { + const loans = await firstValueFrom(this.loansService.getAllLoanEndpoint()) + + } catch (e) { + this.notificationService.error( + 'Erreur', + 'Erreur de communication avec l\'API' + ) } - ]; + this.loansLoading.set(false) + } delete() { return diff --git a/src/app/components/user-table/user-table.html b/src/app/components/user-table/user-table.html index 4b9782b..e220f8a 100644 --- a/src/app/components/user-table/user-table.html +++ b/src/app/components/user-table/user-table.html @@ -1,4 +1,5 @@ - + Nom @@ -10,15 +11,15 @@ - @for (data of basicTable.data; track data) { + @for (user of users(); track user.id) { - {{ data.name}} - {{ data.firstName }} - {{ data.email }} - {{ data.birthDate | date: 'dd/MM/yyyy'}} + {{ user.name}} + {{ user.firstName }} + {{ user.email }} + {{ user.birthDate | date: 'dd/MM/yyyy'}} - + Livre @@ -27,11 +28,11 @@ - @for (loans of data.loan; track loans) { + @for (loan of user.loans; track loan.id) { - {{ loans.book.title }} - {{ loans.date | date: 'dd/MM/yyyy' }} - {{ loans.effectiveReturningDate | date: 'dd/MM/yyyy'}} + {{ loan.bookTitle }} + {{ loan.date | date: 'dd/MM/yyyy' }} + {{ loan.effectiveReturningDate | date: 'dd/MM/yyyy'}} } diff --git a/src/app/components/user-table/user-table.ts b/src/app/components/user-table/user-table.ts index 43fc804..5bce3aa 100644 --- a/src/app/components/user-table/user-table.ts +++ b/src/app/components/user-table/user-table.ts @@ -1,10 +1,12 @@ -import { Component } from '@angular/core'; +import {Component, inject, OnInit, signal} from '@angular/core'; import {NzTableComponent} from "ng-zorro-antd/table"; import {Modal} from "../modal/modal"; import {DatePipe} from "@angular/common"; import {NzButtonComponent} from "ng-zorro-antd/button"; -import {UserInfo} from "../../interfaces/user.interfaces"; import {UpdateUser} from "../update-user/update-user"; +import {GetUserDto, UsersService} from "../../services/api"; +import {NzNotificationService} from "ng-zorro-antd/notification"; +import {firstValueFrom} from "rxjs"; @Component({ selector: 'app-user-table', @@ -18,245 +20,32 @@ import {UpdateUser} from "../update-user/update-user"; templateUrl: './user-table.html', styleUrl: './user-table.css', }) -export class UserTable { - listOfData: UserInfo[] = [ - { - name: 'Dupont', - firstName: 'Mathys', - email: 'mathys@biblio.fr', - birthDate: new Date('2004-05-21'), - loan: [ - { - book: { - title: 'Dune', - isbn: '9780441013593', - author: 'Frank Herbert', - releaseYear: 1965 - }, - user: null, - date: new Date('2025-11-01'), - plannedReturningDate: new Date('2025-12-01'), - effectiveReturningDate: null - }, - { - book: { - title: 'Dune', - isbn: '9780441013593', - author: 'Frank Herbert', - releaseYear: 1965 - }, - user: null, - date: new Date('2025-11-01'), - plannedReturningDate: new Date('2025-12-01'), - effectiveReturningDate: null - }, - { - book: { - title: 'Dune', - isbn: '9780441013593', - author: 'Frank Herbert', - releaseYear: 1965 - }, - user: null, - date: new Date('2025-11-01'), - plannedReturningDate: new Date('2025-12-01'), - effectiveReturningDate: null - }, - { - book: { - title: 'Dune', - isbn: '9780441013593', - author: 'Frank Herbert', - releaseYear: 1965 - }, - user: null, - date: new Date('2025-11-01'), - plannedReturningDate: new Date('2025-12-01'), - effectiveReturningDate: null - } - ] - }, - { - name: 'Durand', - firstName: 'Lucie', - email: 'lucie@biblio.fr', - birthDate: new Date('1998-03-12'), - loan: [ - { - book: { - title: '1984', - isbn: '9780451524935', - author: 'George Orwell', - releaseYear: 1949 - }, - user: null, - date: new Date('2025-10-20'), - plannedReturningDate: new Date('2025-11-20'), - effectiveReturningDate: new Date('2025-11-05') - } - ] - }, - { - name: 'Bernard', - firstName: 'Thomas', - email: 'thomas@biblio.fr', - birthDate: new Date('1990-07-04'), - loan: [ - { - book: { - title: 'Le Seigneur des Anneaux', - isbn: '9780261102385', - author: 'J.R.R. Tolkien', - releaseYear: 1954 - }, - user: null, - date: new Date('2025-09-10'), - plannedReturningDate: new Date('2025-10-10'), - effectiveReturningDate: new Date('2025-10-02') - } - ] - }, - { - name: 'Moreau', - firstName: 'Sophie', - email: 'sophie@biblio.fr', - birthDate: new Date('1987-02-25'), - loan: [ - { - book: { - title: 'Les Misérables', - isbn: '9780140444308', - author: 'Victor Hugo', - releaseYear: 1862 - }, - user: null, - date: new Date('2025-11-03'), - plannedReturningDate: new Date('2025-12-03'), - effectiveReturningDate: null - } - ] - }, - { - name: 'Leroy', - firstName: 'Julien', - email: 'julien@biblio.fr', - birthDate: new Date('2001-09-18'), - loan: [ - { - book: { - title: 'Fahrenheit 451', - isbn: '9781451673319', - author: 'Ray Bradbury', - releaseYear: 1953 - }, - user: null, - date: new Date('2025-10-15'), - plannedReturningDate: new Date('2025-11-15'), - effectiveReturningDate: new Date('2025-11-13') - } - ] - }, - { - name: 'Petit', - firstName: 'Emma', - email: 'emma@biblio.fr', - birthDate: new Date('2006-11-30'), - loan: [ - { - book: { - title: 'Harry Potter à l’école des sorciers', - isbn: '9780747532743', - author: 'J.K. Rowling', - releaseYear: 1997 - }, - user: null, - date: new Date('2025-11-08'), - plannedReturningDate: new Date('2025-12-08'), - effectiveReturningDate: null - } - ] - }, - { - name: 'Roux', - firstName: 'Nicolas', - email: 'nicolas@biblio.fr', - birthDate: new Date('1995-08-14'), - loan: [ - { - book: { - title: 'Le Petit Prince', - isbn: '9780156012195', - author: 'Antoine de Saint-Exupéry', - releaseYear: 1943 - }, - user: null, - date: new Date('2025-09-25'), - plannedReturningDate: new Date('2025-10-25'), - effectiveReturningDate: new Date('2025-10-20') - } - ] - }, - { - name: 'Fontaine', - firstName: 'Claire', - email: 'claire@biblio.fr', - birthDate: new Date('1992-04-17'), - loan: [ - { - book: { - title: 'L’Étranger', - isbn: '9782070360024', - author: 'Albert Camus', - releaseYear: 1942 - }, - user: null, - date: new Date('2025-10-05'), - plannedReturningDate: new Date('2025-11-05'), - effectiveReturningDate: new Date('2025-11-01') - } - ] - }, - { - name: 'Blanc', - firstName: 'Hugo', - email: 'hugo@biblio.fr', - birthDate: new Date('2000-01-09'), - loan: [ - { - book: { - title: 'Le Hobbit', - isbn: '9780261102217', - author: 'J.R.R. Tolkien', - releaseYear: 1937 - }, - user: null, - date: new Date('2025-11-02'), - plannedReturningDate: new Date('2025-12-02'), - effectiveReturningDate: null - } - ] - }, - { - name: 'Garnier', - firstName: 'Léa', - email: 'lea@biblio.fr', - birthDate: new Date('1999-06-11'), - loan: [ - { - book: { - title: 'La Peste', - isbn: '9780141185064', - author: 'Albert Camus', - releaseYear: 1947 - }, - user: null, - date: new Date('2025-09-01'), - plannedReturningDate: new Date('2025-10-01'), - effectiveReturningDate: new Date('2025-09-27') - } - ] +export class UserTable implements OnInit { + private usersService = inject(UsersService); + private notificationService = inject(NzNotificationService) + + users = signal([]); + + usersLoading = signal(false); + + async ngOnInit() { + await this.fetchUsers(); + } + + async fetchUsers() { + this.usersLoading.set(true) + + try { + const users = await firstValueFrom(this.usersService.getAllUsersEndpoint()) + + } catch (e) { + this.notificationService.error( + 'Erreur', + 'Erreur de communication avec l\'API' + ) } - ]; + this.usersLoading.set(false) + } delete() { return diff --git a/src/app/interfaces/author.interfaces.ts b/src/app/interfaces/author.interfaces.ts deleted file mode 100644 index 55b2781..0000000 --- a/src/app/interfaces/author.interfaces.ts +++ /dev/null @@ -1,4 +0,0 @@ -export interface AuthorInfo { - name: string; - firstName: string; -} \ No newline at end of file diff --git a/src/app/interfaces/book.interfaces.ts b/src/app/interfaces/book.interfaces.ts deleted file mode 100644 index bcf6555..0000000 --- a/src/app/interfaces/book.interfaces.ts +++ /dev/null @@ -1,6 +0,0 @@ -export interface BookInfo { - title: string; - isbn: string; - releaseYear: number; - author: string; -} \ No newline at end of file diff --git a/src/app/interfaces/loan.interfaces.ts b/src/app/interfaces/loan.interfaces.ts deleted file mode 100644 index 40b907f..0000000 --- a/src/app/interfaces/loan.interfaces.ts +++ /dev/null @@ -1,10 +0,0 @@ -import {BookInfo} from "./book.interfaces"; -import {UserInfo} from "./user.interfaces"; - -export interface LoanInfo { - book: BookInfo; - user: UserInfo; - date: Date; - plannedReturningDate: Date; - effectiveReturningDate: Date; -} \ No newline at end of file diff --git a/src/app/interfaces/user.interfaces.ts b/src/app/interfaces/user.interfaces.ts deleted file mode 100644 index 2211918..0000000 --- a/src/app/interfaces/user.interfaces.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {LoanInfo} from "./loan.interfaces"; - -export interface UserInfo { - name: string; - firstName: string; - email: string; - birthDate: Date; - loan: LoanInfo[]; -} \ No newline at end of file diff --git a/src/app/pages/author/author.html b/src/app/pages/author/author.html index b20b3dd..53be2b3 100644 --- a/src/app/pages/author/author.html +++ b/src/app/pages/author/author.html @@ -3,8 +3,6 @@
- @for (author of authors; track $index) { - - } +
diff --git a/src/app/pages/author/author.ts b/src/app/pages/author/author.ts index db317c6..67c74ba 100644 --- a/src/app/pages/author/author.ts +++ b/src/app/pages/author/author.ts @@ -1,7 +1,6 @@ -import {Component, input} from '@angular/core'; +import {Component} from '@angular/core'; import {CreateAuthor} from "../../components/create-author/create-author"; import {Modal} from "../../components/modal/modal"; -import {AuthorInfo} from "../../interfaces/author.interfaces"; import {AuthorCard} from "../../components/author-card/author-card"; @Component({ @@ -14,16 +13,6 @@ import {AuthorCard} from "../../components/author-card/author-card"; templateUrl: './author.html', styleUrl: './author.css', }) -export class Author { - authorInfo = input.required(); - - authors: AuthorInfo[] = [ - { name: 'Victor', firstName: 'Hugo' }, - { name: 'J.K.', firstName: 'Rowling' }, - { name: 'J.R.R.', firstName: 'Tolkien' }, - { name: 'Frank', firstName: 'Herbert' }, - { name: 'Ray', firstName: 'Bradbury' }, - { name: 'George ', firstName: 'Orwell' } - ]; +export class Author{ } diff --git a/src/app/pages/book/book.html b/src/app/pages/book/book.html index 79d21b2..9be1fa1 100644 --- a/src/app/pages/book/book.html +++ b/src/app/pages/book/book.html @@ -3,8 +3,6 @@
- @for (book of books; track $index) { - - } +
diff --git a/src/app/pages/book/book.ts b/src/app/pages/book/book.ts index b79d09d..c69f913 100644 --- a/src/app/pages/book/book.ts +++ b/src/app/pages/book/book.ts @@ -1,5 +1,4 @@ -import { Component } from '@angular/core'; -import {BookInfo} from "../../interfaces/book.interfaces"; +import {Component, inject, OnInit, signal} from '@angular/core'; import {BookCard} from "../../components/book-card/book-card"; import {Modal} from "../../components/modal/modal"; import {CreateBook} from "../../components/create-book/create-book"; @@ -14,14 +13,5 @@ import {CreateBook} from "../../components/create-book/create-book"; templateUrl: './book.html', styleUrls: ['./book.css'], }) -export class Book { - books: BookInfo[] = [ - { 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 }, - ]; - +export class Book{ } diff --git a/src/app/pages/loan/loan.ts b/src/app/pages/loan/loan.ts index bfeb6f4..56e5d87 100644 --- a/src/app/pages/loan/loan.ts +++ b/src/app/pages/loan/loan.ts @@ -1,14 +1,14 @@ import { Component } from '@angular/core'; -import {LoanTable} from "../../components/loan-table/loan-table"; import {Modal} from "../../components/modal/modal"; import {CreateLoan} from "../../components/create-loan/create-loan"; +import {LoanTable} from "../../components/loan-table/loan-table"; @Component({ selector: 'app-loan', imports: [ - LoanTable, Modal, - CreateLoan + CreateLoan, + LoanTable ], templateUrl: './loan.html', styleUrl: './loan.css',