add visualizar reportes de usuarios (administrador)

This commit is contained in:
Mariela Bonilla 2021-08-12 03:05:50 -06:00
parent 6575afe8d5
commit fab8fa06b7
3 changed files with 185 additions and 24 deletions

View File

@ -1,8 +1,15 @@
<div class="content"> <div class="content">
<div class="py-2">
<button type="button" class="ds-btn ds-btn--primary" (click)="exportReportesGeneralesAdministradorExcel()">Export as Excel</button> <button type="button" class="ds-btn ds-btn--primary" (click)="exportReportesGeneralesAdministradorExcel()">Export as Excel</button>
<button type="button" class="ds-btn ds-btn--primary" (click)="exportReportesGeneralesAdministradorPDF()">Export as PDF</button> <button type="button" class="ds-btn ds-btn--primary" (click)="exportReportesGeneralesAdministradorPDF()">Export as PDF</button>
<button type="button" [hidden]="reportsGeneral" class="ds-btn ds-btn--primary" style="float: right" (click)="cambiarVista()">
<div class="container-fluid"> Ver Reporte de Usuarios
</button>
<button type="button" [hidden]="reportForUsers" class="ds-btn ds-btn--primary" style="float: right" (click)="cambiarVista()">
Ver Reporte Generales
</button>
</div>
<div class="container-fluid py-5" [hidden]="reportsGeneral">
<div class="row justify-content-around"> <div class="row justify-content-around">
<div class="col-lg-3 col-sm-6"> <div class="col-lg-3 col-sm-6">
<div class="card"> <div class="card">
@ -181,4 +188,59 @@
</div> </div>
</div> </div>
</div> </div>
<div class="container-fluid" [hidden]="reportForUsers">
<div class="row justify-content-around">
<div class="col-md-10">
<div class="card encuestas-por-usuario">
<div class="card-header w-100">
<h4 class="ds-title">Reporte de Encuestas Usuarios</h4>
</div>
<div class="card-content">
<div class="row">
<div class="col-md-12">
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>Usuario</th>
<th></th>
<th>Total de encuestas</th>
<th>Encuestas en borrador</th>
<th>Encuestas publicadas</th>
<th>Encuestas finalizadas</th>
<th>Encuestas completadas por usuario</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let usuario of usuarios; let j = index; trackBy: trackIdUsuario">
<td>
<div class="photo mb-2"><img src="../../../../content/profile_icons/C{{ usuario.iconoPerfil }}.png" /></div>
</td>
<td>{{ usuario.nombre }}</td>
<td class="text-center">
{{ encuestasUsuario[j] }}
</td>
<td class="text-center">
{{ encuestasUsuarioBorrador[j] }}
</td>
<td class="text-center">
{{ encuestasUsuarioPublicadas[j] }}
</td>
<td class="text-center">
{{ encuestasUsuarioFinalizadas[j] }}
</td>
<td class="text-center">
{{ encuestasUsuarioCompletadas[j] }}
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>

View File

@ -31,3 +31,16 @@
.por-categoria { .por-categoria {
padding: 5% 0; padding: 5% 0;
} }
.encuestas-por-usuario .table-responsive {
height: 500px;
max-height: 500px;
}
.encuestas-por-usuario .photo {
width: 40px;
height: 40px;
}
.encuestas-por-usuario .photo img {
border-radius: 100%;
}

View File

@ -18,6 +18,7 @@ import * as Chartist from 'chartist';
import { faWallet, faUsers, faUsersSlash } from '@fortawesome/free-solid-svg-icons'; import { faWallet, faUsers, faUsersSlash } from '@fortawesome/free-solid-svg-icons';
import { IUsuarioExtra } from '../../usuario-extra/usuario-extra.model'; import { IUsuarioExtra } from '../../usuario-extra/usuario-extra.model';
import { IUser } from '../../user/user.model';
@Component({ @Component({
selector: 'jhi-dashboard-admin', selector: 'jhi-dashboard-admin',
@ -34,7 +35,7 @@ export class DashboardAdminComponent implements OnInit {
gananciasTotales: number = 0; gananciasTotales: number = 0;
categorias: ICategoria[] | undefined = []; categorias: ICategoria[] | undefined = [];
encuestas: IEncuesta[] | undefined = []; encuestas: IEncuesta[] | undefined = [];
usuarios: IUsuarioExtra[] | null = []; usuarios: IUsuarioExtra[] | undefined = [];
faWallet = faWallet; faWallet = faWallet;
faUsers = faUsers; faUsers = faUsers;
faUsersSlash = faUsersSlash; faUsersSlash = faUsersSlash;
@ -42,9 +43,15 @@ export class DashboardAdminComponent implements OnInit {
encuestasFinalizadas: number = 0; encuestasFinalizadas: number = 0;
encuestasBorrador: number = 0; encuestasBorrador: number = 0;
encuestasCompletadas: number = 0; encuestasCompletadas: number = 0;
encuestasUsuario: number[] = [];
encuestasUsuarioPublicadas: number[] = [];
encuestasUsuarioFinalizadas: number[] = [];
encuestasUsuarioBorrador: number[] = [];
encuestasUsuarioCompletadas: number[] = [];
usuariosGenerales: IUser[] | null = [];
reportsGeneral = true; reportsGeneral = false;
reportForUsers = false; reportForUsers = true;
chartFechas = []; chartFechas = [];
@ -63,30 +70,68 @@ export class DashboardAdminComponent implements OnInit {
return item.id!; return item.id!;
} }
trackIdUsuario(_index: number, item: IUsuarioExtra): number {
return item.id!;
}
cambiarVista() {
if (this.reportsGeneral) {
this.reportsGeneral = false;
this.reportForUsers = true;
} else if (this.reportForUsers) {
this.reportsGeneral = true;
this.reportForUsers = false;
}
}
loadAll() { loadAll() {
this.cargarGananciasTotales(); this.cargarGananciasTotales();
this.cargarCantidadUsuarios(); this.cargarUsers();
this.cargarEncuestas();
} }
cargarGananciasTotales() { cargarGananciasTotales() {
this.facturaService.query().subscribe( this.facturaService.query().subscribe(res => {
res => {
const tempFacturas = res.body; const tempFacturas = res.body;
tempFacturas?.forEach(f => { tempFacturas?.forEach(f => {
if (f.costo != undefined) { if (f.costo != undefined) {
this.gananciasTotales += f.costo; this.gananciasTotales += f.costo;
} }
}); });
}, });
() => {} }
);
cargarUsers() {
this.usuarioExtraService
.retrieveAllPublicUsers()
.pipe(finalize(() => this.cargarCantidadUsuarios()))
.subscribe(res => {
res.forEach(user => {
let rolList: string[] | undefined;
rolList = user.authorities;
let a = rolList?.pop();
if (a == 'ROLE_ADMIN') {
user.authorities = ['Admin'];
} else if (a == 'ROLE_USER') {
user.authorities = ['Usuario'];
}
});
this.usuariosGenerales = res;
});
} }
cargarCantidadUsuarios() { cargarCantidadUsuarios() {
this.usuarioExtraService.query().subscribe(res => { this.usuarioExtraService
.query()
.pipe(finalize(() => this.cargarEncuestas()))
.subscribe(res => {
const tmpUsuarios = res.body; const tmpUsuarios = res.body;
this.usuarios = tmpUsuarios;
if (tmpUsuarios) {
tmpUsuarios.forEach(u => {
u.user = this.usuariosGenerales?.find(g => g.id == u.user?.id);
});
}
this.usuarios = tmpUsuarios?.filter(u => u.user?.authorities && u.user?.authorities[0] === 'Usuario');
this.cantUsuarioActivos = tmpUsuarios?.filter(u => u.estado === 'ACTIVE').length; this.cantUsuarioActivos = tmpUsuarios?.filter(u => u.estado === 'ACTIVE').length;
this.cantUsuarioBloqueados = tmpUsuarios?.filter(u => u.estado === 'SUSPENDED').length; this.cantUsuarioBloqueados = tmpUsuarios?.filter(u => u.estado === 'SUSPENDED').length;
}); });
@ -111,6 +156,47 @@ export class DashboardAdminComponent implements OnInit {
cantidadCompletadas = cantidadCompletadas + (Number(_contadorCompletadas?.toString().split('.')[1]) - 1); cantidadCompletadas = cantidadCompletadas + (Number(_contadorCompletadas?.toString().split('.')[1]) - 1);
}); });
this.encuestasCompletadas = cantidadCompletadas; this.encuestasCompletadas = cantidadCompletadas;
//reportes generales de todos los usuarios
const publicadasUser: number[] | null = [];
const finalizadasUser: number[] | null = [];
const borradoresUser: number[] | null = [];
const encuestasUser: number[] | null = [];
const encuestasCompletadasUser: number[] | null = [];
if (this.usuarios) {
this.usuarios.forEach(u => {
let cantEncuestas = 0;
let cantPublicadas = 0;
let cantFinalizadas = 0;
let cantBorradores = 0;
cantEncuestas = tmpEncuestas.filter(
e => e.estado !== 'DELETED' && e.usuarioExtra?.id === u.id && e.usuarioExtra?.user?.authorities
).length;
cantPublicadas = tmpEncuestas.filter(e => e.estado === 'ACTIVE' && e.usuarioExtra?.id === u.id).length;
cantFinalizadas = tmpEncuestas.filter(e => e.estado === 'FINISHED' && e.usuarioExtra?.id === u.id).length;
cantBorradores = tmpEncuestas.filter(e => e.estado === 'DRAFT' && e.usuarioExtra?.id === u.id).length;
encuestasUser.push(cantEncuestas);
borradoresUser.push(cantBorradores);
publicadasUser.push(cantPublicadas);
finalizadasUser.push(cantFinalizadas);
let cantidadCompletadasUser: number = 0;
tmpEncuestas
.filter(e => e.estado === 'ACTIVE' && e.usuarioExtra?.id === u.id)
.forEach(e => {
const _contadorCompletadas = e.calificacion;
cantidadCompletadasUser = cantidadCompletadasUser + (Number(_contadorCompletadas?.toString().split('.')[1]) - 1);
});
encuestasCompletadasUser.push(cantidadCompletadasUser);
});
this.encuestasUsuarioCompletadas = encuestasCompletadasUser;
this.encuestasUsuario = encuestasUser;
this.encuestasUsuarioBorrador = borradoresUser;
this.encuestasUsuarioPublicadas = publicadasUser;
this.encuestasUsuarioFinalizadas = finalizadasUser;
}
} }
}); });
} }