sanchezvem/library-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

connect front to back

Browse Source
This commit is contained in:
sanchezvem
2025-11-18 10:47:33 +01:00
parent 37094996ad
commit 73ce63d7d0
21 changed files with 399 additions and 617 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
src/app/components/author-card/author-card.css
View File

@@ -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;
}
}

63
src/app/components/author-card/author-card.html
View File

@@ -1,16 +1,47 @@
<div class="book-card-container">
<div class="ml-2">
<nz-card nzHoverable style="width:240px" [nzCover]="coverTemplate">
<nz-card-meta nzTitle="{{ authorInfo().name + authorInfo().firstName }}"></nz-card-meta>
</nz-card>
<ng-template #coverTemplate>
<img alt="example" src="https://www.w3schools.com/howto/img_avatar.png" />
</ng-template>
<div class="mt-2">
<app-modal [name]="'Modifier'" class="ml-7">
<app-update-author></app-update-author>
</app-modal>
<button nz-button nzType="primary" (click)="delete()" class="ml-2">Supprimer</button>
</div>
</div>
</div>
<nz-table [nzData]="authors()"
[nzLoading]="authorsLoading()">
<thead>
<tr style="text-align: center">
<th>Prénom</th>
<th>Nom</th>
<th>Livre</th>
<th>Action</th>
</tr>
</thead>
<tbody style="text-align: center">
@for (author of authors(); track author.id) {
<tr>
<td>{{ author.name}}</td>
<td>{{ author.firstName }}</td>
<td>
<app-modal type="link" [name]="'Voir les livres'">
<nz-table [nzData]="authors()">
<thead>
<tr style="text-align: center">
<th>Titre</th>
<th>ISBN</th>
<th>Date de publication</th>
</tr>
</thead>
<tbody style="text-align: center">
@for (book of author.books; track book.id) {
<tr>
<td>{{ book.title }}</td>
<td>{{ book.isbn}}</td>
<td>{{ book.releaseYear}}</td>
</tr>
}
</tbody>
</nz-table>
</app-modal>
</td>
<td>
<app-modal [name]="'Modifier'">
<app-update-loan></app-update-loan>
</app-modal>
<button nz-button nzType="primary" (click)="delete()" class="bg-red-600 border-red-600">Supprimer</button>
</td>
</tr>
}
</tbody>
</nz-table>

45
src/app/components/author-card/author-card.ts
View File

@@ -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<AuthorInfo>();
export class AuthorCard implements OnInit {
private authorsService = inject(AuthorsService);
private notificationService = inject(NzNotificationService)
authors = signal<GetAuthorDto[]>([]);
authorsLoading = signal<boolean>(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

110
src/app/components/book-card/book-card.css
View File

@@ -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;
}
}

48
src/app/components/book-card/book-card.html
View File

@@ -1,19 +1,29 @@
<div class="book-card-container">
<nz-card
[nzBordered]="false"
nzTitle="{{ bookInfo().title }}"
[nzExtra]="extraTemplate">
<p>{{ bookInfo().isbn }}</p>
<p>{{ bookInfo().author }}</p>
<p>{{ bookInfo().releaseYear }}</p>
<br>
<app-modal [name]="'Modifier'" class="ml-31">
<app-update-book></app-update-book>
</app-modal>
<button nz-button nzType="primary" (click)="delete()" class="ml-28 mt-1">Supprimer</button>
</nz-card>
</div>
<ng-template #extraTemplate>
<a>More</a>
</ng-template>
<nz-table [nzData]="books()"
[nzLoading]="booksLoading()">
<thead>
<tr style="text-align: center">
<th>Titre</th>
<th>ISBN</th>
<th>Auteur</th>
<th>Date de publication</th>
<th>Action</th>
</tr>
</thead>
<tbody style="text-align: center">
@for (book of books(); track book.id) {
<tr>
<td>{{ book.title}}</td>
<td>{{ book.isbn }}</td>
<td>{{ book.bookAuthorName }} {{ book.bookAuthorFirstName }}</td>
<td>{{ book.releaseYear}}</td>
<td></td>
<td>
<app-modal [name]="'Modifier'">
<app-update-user></app-update-user>
</app-modal>
<button nz-button nzType="primary" (click)="delete()" class="bg-red-600 border-red-600">Supprimer</button>
</td>
</tr>
}
</tbody>
</nz-table>

43
src/app/components/book-card/book-card.ts
View File

@@ -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<BookInfo>();
export class BookCard implements OnInit {
private booksService = inject(BooksService);
private notificationService = inject(NzNotificationService)
books = signal<GetBookDto[]>([]);
booksLoading = signal<boolean>(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

1
src/app/components/create-author/create-author.ts
View File

@@ -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',

15
src/app/components/loan-table/loan-table.html
View File

@@ -1,4 +1,5 @@
<nz-table #basicTable [nzData]="listOfData">
<nz-table [nzData]="loans()"
[nzLoading]="loansLoading()">
<thead>
<tr style="text-align: center">
<th>Utilisateur</th>
@@ -10,13 +11,13 @@
</tr>
</thead>
<tbody style="text-align: center">
@for (data of basicTable.data; track data) {
@for (loan of loans(); track loan.id) {
<tr>
<td>{{ data.user.name}} {{data.user.firstName }}</td>
<td>{{ data.book.title }}</td>
<td>{{ data.date | date: 'dd/MM/yyyy' }}</td>
<td>{{ data.plannedReturningDate | date: 'dd/MM/yyyy'}}</td>
<td>{{ data.effectiveReturningDate | date: 'dd/MM/yyyy'}}</td>
<td>{{ loan.userName}} {{loan.userFirstName }}</td>
<td>{{ loan.bookTitle }}</td>
<td>{{ loan.date | date: 'dd/MM/yyyy' }}</td>
<td>{{ loan.plannedReturningDate | date: 'dd/MM/yyyy'}}</td>
<td>{{ loan.effectiveReturningDate | date: 'dd/MM/yyyy'}}</td>
<td>
<app-modal [name]="'Modifier'">
<app-update-loan></app-update-loan>

213
src/app/components/loan-table/loan-table.ts
View File

@@ -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<GetLoanDto[]>([]);
loansLoading = signal<boolean>(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

23
src/app/components/user-table/user-table.html
View File

@@ -1,4 +1,5 @@
<nz-table #basicTable [nzData]="listOfData">
<nz-table [nzData]="users()"
[nzLoading]="usersLoading()">
<thead>
<tr style="text-align: center">
<th>Nom</th>
@@ -10,15 +11,15 @@
</tr>
</thead>
<tbody style="text-align: center">
@for (data of basicTable.data; track data) {
@for (user of users(); track user.id) {
<tr>
<td>{{ data.name}}</td>
<td>{{ data.firstName }}</td>
<td>{{ data.email }}</td>
<td>{{ data.birthDate | date: 'dd/MM/yyyy'}}</td>
<td>{{ user.name}}</td>
<td>{{ user.firstName }}</td>
<td>{{ user.email }}</td>
<td>{{ user.birthDate | date: 'dd/MM/yyyy'}}</td>
<td>
<app-modal type="link" [name]="'Voir les emprunts'">
<nz-table #basicTable [nzData]="listOfData">
<nz-table [nzData]="users()">
<thead>
<tr style="text-align: center">
<th>Livre</th>
@@ -27,11 +28,11 @@
</tr>
</thead>
<tbody style="text-align: center">
@for (loans of data.loan; track loans) {
@for (loan of user.loans; track loan.id) {
<tr>
<td>{{ loans.book.title }}</td>
<td>{{ loans.date | date: 'dd/MM/yyyy' }}</td>
<td>{{ loans.effectiveReturningDate | date: 'dd/MM/yyyy'}}</td>
<td>{{ loan.bookTitle }}</td>
<td>{{ loan.date | date: 'dd/MM/yyyy' }}</td>
<td>{{ loan.effectiveReturningDate | date: 'dd/MM/yyyy'}}</td>
</tr>
}
</tbody>

269
src/app/components/user-table/user-table.ts
View File

@@ -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<GetUserDto[]>([]);
usersLoading = signal<boolean>(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

4
src/app/interfaces/author.interfaces.ts
View File

@@ -1,4 +0,0 @@
export interface AuthorInfo {
name: string;
firstName: string;
}

6
src/app/interfaces/book.interfaces.ts
View File

@@ -1,6 +0,0 @@
export interface BookInfo {
title: string;
isbn: string;
releaseYear: number;
author: string;
}

10
src/app/interfaces/loan.interfaces.ts
View File

@@ -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;
}

9
src/app/interfaces/user.interfaces.ts
View File

@@ -1,9 +0,0 @@
import {LoanInfo} from "./loan.interfaces";
export interface UserInfo {
name: string;
firstName: string;
email: string;
birthDate: Date;
loan: LoanInfo[];
}

4
src/app/pages/author/author.html
View File

@@ -3,8 +3,6 @@
</app-modal>
<section class="author-grid">
@for (author of authors; track $index) {
<app-author-card [authorInfo]="author"></app-author-card>
}
<app-author-card></app-author-card>
</section>

15
src/app/pages/author/author.ts
View File

@@ -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<AuthorInfo>();
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{
}

4
src/app/pages/book/book.html
View File

@@ -3,8 +3,6 @@
</app-modal>
<section class="book-grid">
@for (book of books; track $index) {
<app-book-card [bookInfo]="book"></app-book-card>
}
<app-book-card></app-book-card>
</section>

14
src/app/pages/book/book.ts
View File

@@ -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{
}

6
src/app/pages/loan/loan.ts
View File

@@ -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',