Documentation Index
Fetch the complete documentation index at: https://mintlify.com/AngheloMP10/biblioteca-virtual-frontend/llms.txt
Use this file to discover all available pages before exploring further.
Overview
The PrestamoListComponent provides administrators with a view of all loan requests in the system. Admins can approve or reject pending loan requests, and view the history of all loans.
@Component({
selector: 'app-prestamo-list',
standalone: true,
imports: [CommonModule],
templateUrl: './prestamo-list.html',
styleUrls: ['./prestamo-list.css'],
})
app-prestamo-list
Imports:
CommonModule - Angular common directives
Template: ./prestamo-list.html
Properties
prestamos
prestamos: Prestamo[] = []
Prestamo object includes:
id: Loan request identifierlibro: Book object with title and detailsusuario: User who requested the loanfechaSolicitud: Date when the loan was requestedestado: Loan status (PENDIENTE, APROBADO, RECHAZADO)
The array is sorted by ID in descending order (newest first) with pending requests prioritized.
Injected Services
private prestamoService = inject(PrestamoService)
- PrestamoService - Handles all loan-related API operations
Lifecycle Hooks
ngOnInit
ngOnInit(): void {
this.cargarPrestamos();
}
Methods
cargarPrestamos
Fetches all loan requests from the PrestamoService:
- Calls
PrestamoService.getAll()
- Sorts the results by ID in descending order (newest first)
- Populates the
prestamos array
This method is called on initialization and after approving or rejecting a loan to refresh the list.
aprobar
aprobar(id: number): void
- Displays confirmation dialog “¿Aprobar este préstamo? El libro dejará de estar disponible.”
- If confirmed, calls
PrestamoService.aprobar() with the loan ID
- On success:
- Shows alert “Préstamo Aprobado”
- Reloads the loan list by calling
cargarPrestamos()
When a loan is approved, the associated book’s disponible status is set to false by the backend.
Parameters:
id - The numeric ID of the loan request to approve
rechazar
rechazar(id: number): void
- Displays confirmation dialog “¿Rechazar solicitud?”
- If confirmed, calls
PrestamoService.rechazar() with the loan ID
- On success:
- Shows alert “Solicitud Rechazada”
- Reloads the loan list by calling
cargarPrestamos()
Rejecting a loan does not affect the book’s availability status.
Parameters:
id - The numeric ID of the loan request to reject
Full Source Code
import { Component, OnInit, inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { PrestamoService } from '../../../core/services/prestamo';
import { Prestamo } from '../../../core/models/prestamo';
@Component({
selector: 'app-prestamo-list',
standalone: true,
imports: [CommonModule],
templateUrl: './prestamo-list.html',
styleUrls: ['./prestamo-list.css'],
})
export class PrestamoListComponent implements OnInit {
private prestamoService = inject(PrestamoService);
prestamos: Prestamo[] = [];
ngOnInit(): void {
this.cargarPrestamos();
}
cargarPrestamos(): void {
this.prestamoService.getAll().subscribe({
next: (data) => {
// Los PENDIENTES primero
this.prestamos = data.sort((a, b) => b.id - a.id);
},
});
}
aprobar(id: number): void {
if (
confirm('¿Aprobar este préstamo? El libro dejará de estar disponible.')
) {
this.prestamoService.aprobar(id).subscribe(() => {
alert('Préstamo Aprobado');
this.cargarPrestamos();
});
}
}
rechazar(id: number): void {
if (confirm('¿Rechazar solicitud?')) {
this.prestamoService.rechazar(id).subscribe(() => {
alert('Solicitud Rechazada');
this.cargarPrestamos();
});
}
}
}
- Prestamo - Loan request data structure
- Libro - Book data structure