fix: inicializar users/roles en Alpine y null-safety en loadRegister
- Declara users:[] y roles:[] en el estado inicial de Alpine para que x-for funcione reactivamente desde el primer render - Agrega totalPages:0 al estado inicial - Añade comprobación response.ok antes de parsear JSON - Usa || [] y || 0 para evitar TypeError si el backend retorna error - Reemplaza data.Users.length con this.users.length (siempre array) Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
co-authored by
Copilot
parent
10639d233b
commit
4fec04e5fe
+16
-16
@@ -324,12 +324,13 @@
|
|||||||
|
|
||||||
Id: null,
|
Id: null,
|
||||||
deleteId: null,
|
deleteId: null,
|
||||||
|
users: [],
|
||||||
|
roles: [],
|
||||||
loading: false,
|
loading: false,
|
||||||
totalRecords: 0, // Agregar esta línea
|
totalRecords: 0,
|
||||||
|
totalPages: 0,
|
||||||
isLoading: false,
|
isLoading: false,
|
||||||
|
|
||||||
roles: '',
|
|
||||||
|
|
||||||
init() {
|
init() {
|
||||||
this.loadRegister();
|
this.loadRegister();
|
||||||
},
|
},
|
||||||
@@ -342,23 +343,22 @@
|
|||||||
//this.loading = true;
|
//this.loading = true;
|
||||||
const search = this.searchQuery ? `&search=${this.searchQuery}` : '';
|
const search = this.searchQuery ? `&search=${this.searchQuery}` : '';
|
||||||
fetch(`/app/loadusers?page=${page}${search}`)
|
fetch(`/app/loadusers?page=${page}${search}`)
|
||||||
.then(response => response.json())
|
.then(response => {
|
||||||
|
if (!response.ok) throw new Error(`HTTP ${response.status}`);
|
||||||
|
return response.json();
|
||||||
|
})
|
||||||
.then(data => {
|
.then(data => {
|
||||||
this.totalRecords = data.total; // Establece el total de registros aquí
|
this.totalRecords = data.total || 0;
|
||||||
this.users = data.Users; // Asignar
|
this.users = data.Users || [];
|
||||||
this.roles = data.Roles;
|
this.roles = data.Roles || [];
|
||||||
console.log(this.roles);
|
this.totalPages = data.totalPages || 0;
|
||||||
|
|
||||||
this.totalPages = data.totalPages; // Asignar total de páginas
|
|
||||||
this.createPagination(this.totalPages, page);
|
this.createPagination(this.totalPages, page);
|
||||||
|
if (this.users.length > 0) {
|
||||||
if (data.Users.length != 0) {
|
const totalPages = Math.ceil(this.totalRecords / (data.limit || 10));
|
||||||
// Lógica de paginación
|
this.createPagination(totalPages, page);
|
||||||
const totalPages = Math.ceil(this.totalRecords / data.limit);
|
|
||||||
this.createPagination(totalPages, page)
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch(error => console.error('Error:', error))
|
.catch(error => console.error('Error cargando usuarios:', error))
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
this.isLoading = false; // Ocultar el GIF de carga
|
this.isLoading = false; // Ocultar el GIF de carga
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user