add ver vista previa en listado
This commit is contained in:
parent
3d7ec93084
commit
69fdc4c2f5
|
@ -1,4 +1,4 @@
|
|||
<div class="row justify-content-center">
|
||||
<!--<div class="row justify-content-center">
|
||||
<div class="col-8">
|
||||
<div *ngIf="encuesta">
|
||||
<h2 data-cy="encuestaDetailsHeading"><span jhiTranslate="dataSurveyApp.encuesta.detail.title">Encuesta</span></h2>
|
||||
|
@ -77,4 +77,75 @@
|
|||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-8">
|
||||
<div *ngIf="encuesta">
|
||||
<h2 data-cy="encuestaDetailsHeading"><span jhiTranslate="dataSurveyApp.encuesta.detail.title">Encuesta</span></h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-around">
|
||||
<div class="col-12">
|
||||
<div *ngIf="encuesta">
|
||||
<div class="row">
|
||||
<div class="col-5">
|
||||
<h2 class="text-center">{{ encuesta.nombre }}</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-5">
|
||||
<div class="alert alert-warning" id="no-result" *ngIf="ePreguntas?.length === 0">
|
||||
<span>No se encontraron preguntas</span>
|
||||
</div>
|
||||
|
||||
<div id="preguntas" *ngIf="ePreguntas && ePreguntas.length > 0">
|
||||
<div>
|
||||
<div *ngFor="let ePregunta of ePreguntas; let i = index; trackBy: trackId" [attr.data-index]="ePregunta.id">
|
||||
<span>{{ ePregunta.nombre }} | </span>
|
||||
<span>{{ ePregunta.tipo }} | </span>
|
||||
<span>{{ ePregunta.opcional }}</span>
|
||||
|
||||
<ng-container *ngIf="ePregunta.tipo">
|
||||
<ng-container *ngFor="let ePreguntaOpcion of ePreguntasOpciones; let j = index; trackBy: trackId">
|
||||
<ng-container *ngIf="ePregunta.id == ePreguntaOpcion[j].epreguntaCerrada.id">
|
||||
<div *ngFor="let ePreguntaOpcion2 of ePreguntaOpcion; let k = index; trackBy: trackId">
|
||||
<input id="{{ ePregunta.id }}-{{ ePreguntaOpcion2.id }}" type="checkbox" />
|
||||
<label for="{{ ePregunta.id }}-{{ ePreguntaOpcion2.id }}">{{ ePreguntaOpcion2.nombre }}</label>
|
||||
</div>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
<textarea *ngIf="!ePregunta.tipo" name="" id="" cols="30" rows="10"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<div *ngIf="encuesta">
|
||||
<dt><span jhiTranslate="dataSurveyApp.encuesta.fechaCreacion">Fecha Creacion</span></dt>
|
||||
<dd>
|
||||
<span>{{ encuesta.fechaCreacion | formatMediumDatetime }}</span>
|
||||
</dd>
|
||||
<dt><span jhiTranslate="dataSurveyApp.encuesta.fechaPublicacion">Fecha Publicacion</span></dt>
|
||||
<dd>
|
||||
<span>{{ encuesta.fechaPublicacion | formatMediumDatetime }}</span>
|
||||
</dd>
|
||||
<dt><span jhiTranslate="dataSurveyApp.encuesta.fechaFinalizar">Fecha Finalizar</span></dt>
|
||||
<dd>
|
||||
<span>{{ encuesta.fechaFinalizar | formatMediumDatetime }}</span>
|
||||
</dd>
|
||||
<dt><span jhiTranslate="dataSurveyApp.encuesta.fechaFinalizada">Fecha Finalizada</span></dt>
|
||||
<dd>
|
||||
<span>{{ encuesta.fechaFinalizada | formatMediumDatetime }}</span>
|
||||
</dd>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,23 +1,108 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { HttpResponse } from '@angular/common/http';
|
||||
import { FormBuilder, Validators } from '@angular/forms';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { EstadoEncuesta } from 'app/entities/enumerations/estado-encuesta.model';
|
||||
|
||||
import { IEncuesta } from '../encuesta.model';
|
||||
import { Observable } from 'rxjs';
|
||||
import { finalize, map } from 'rxjs/operators';
|
||||
|
||||
import * as dayjs from 'dayjs';
|
||||
import { DATE_TIME_FORMAT } from 'app/config/input.constants';
|
||||
|
||||
import { IEncuesta, Encuesta } from '../encuesta.model';
|
||||
import { EncuestaService } from '../service/encuesta.service';
|
||||
import { ICategoria } from 'app/entities/categoria/categoria.model';
|
||||
import { CategoriaService } from 'app/entities/categoria/service/categoria.service';
|
||||
import { IUsuarioExtra } from 'app/entities/usuario-extra/usuario-extra.model';
|
||||
import { UsuarioExtraService } from 'app/entities/usuario-extra/service/usuario-extra.service';
|
||||
|
||||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
|
||||
import { IEPreguntaCerrada } from 'app/entities/e-pregunta-cerrada/e-pregunta-cerrada.model';
|
||||
import { EPreguntaCerradaService } from 'app/entities/e-pregunta-cerrada/service/e-pregunta-cerrada.service';
|
||||
import { EPreguntaCerradaDeleteDialogComponent } from 'app/entities/e-pregunta-cerrada/delete/e-pregunta-cerrada-delete-dialog.component';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-encuesta-detail',
|
||||
templateUrl: './encuesta-detail.component.html',
|
||||
})
|
||||
export class EncuestaDetailComponent implements OnInit {
|
||||
encuesta: IEncuesta | null = null;
|
||||
categoriasSharedCollection: ICategoria[] = [];
|
||||
usuarioExtrasSharedCollection: IUsuarioExtra[] = [];
|
||||
|
||||
constructor(protected activatedRoute: ActivatedRoute) {}
|
||||
encuesta: IEncuesta | null = null;
|
||||
isLoading = false;
|
||||
|
||||
ePreguntas?: any[];
|
||||
ePreguntasOpciones?: any[];
|
||||
|
||||
constructor(
|
||||
protected activatedRoute: ActivatedRoute,
|
||||
protected encuestaService: EncuestaService,
|
||||
protected categoriaService: CategoriaService,
|
||||
protected usuarioExtraService: UsuarioExtraService,
|
||||
protected fb: FormBuilder,
|
||||
protected modalService: NgbModal
|
||||
) {}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.activatedRoute.data.subscribe(({ encuesta }) => {
|
||||
this.encuesta = encuesta;
|
||||
if (encuesta) {
|
||||
this.encuesta = encuesta;
|
||||
this.loadAll();
|
||||
} else {
|
||||
this.previousState();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
trackId(index: number, item: IEPreguntaCerrada): number {
|
||||
return item.id!;
|
||||
}
|
||||
|
||||
getEncuesta(id: number) {
|
||||
return this.encuestaService.findEncuesta(id);
|
||||
}
|
||||
|
||||
loadAll(): void {
|
||||
this.isLoading = true;
|
||||
|
||||
this.encuestaService
|
||||
.findQuestions(this.encuesta?.id!)
|
||||
.pipe(
|
||||
finalize(() =>
|
||||
this.encuestaService.findQuestionsOptions(this.encuesta?.id!).subscribe(
|
||||
(res: any) => {
|
||||
this.isLoading = false;
|
||||
this.ePreguntasOpciones = res.body ?? [];
|
||||
},
|
||||
() => {
|
||||
this.isLoading = false;
|
||||
}
|
||||
)
|
||||
)
|
||||
)
|
||||
.subscribe(
|
||||
(res: any) => {
|
||||
this.isLoading = false;
|
||||
this.ePreguntas = res.body ?? [];
|
||||
},
|
||||
() => {
|
||||
this.isLoading = false;
|
||||
}
|
||||
);
|
||||
|
||||
this.encuestaService.findQuestionsOptions(this.encuesta?.id!).subscribe(
|
||||
(res: any) => {
|
||||
this.isLoading = false;
|
||||
this.ePreguntasOpciones = res.body ?? [];
|
||||
},
|
||||
() => {
|
||||
this.isLoading = false;
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
previousState(): void {
|
||||
window.history.back();
|
||||
}
|
||||
|
|
|
@ -59,7 +59,7 @@
|
|||
</li>
|
||||
<li>
|
||||
<button type="button" (click)="openPreview()" id="contextmenu-preview">
|
||||
<fa-icon class="contextmenu__icon" [icon]="faPollH"></fa-icon>Vista Previa
|
||||
<fa-icon class="contextmenu__icon" [icon]="faPollH"></fa-icon>Ver Vista Previa
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
|
|
|
@ -63,7 +63,7 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
|
|||
isLoading = false;
|
||||
|
||||
isSaving = false;
|
||||
selectedIdSurvey: number = 0;
|
||||
selectedSurvey: number = 0;
|
||||
|
||||
categoriasSharedCollection: ICategoria[] = [];
|
||||
usuarioExtrasSharedCollection: IUsuarioExtra[] = [];
|
||||
|
@ -323,7 +323,7 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
|
|||
}
|
||||
|
||||
openPreview() {
|
||||
const surveyId = this.selectedIdSurvey;
|
||||
const surveyId = this.selectedSurvey;
|
||||
this.router.navigate(['/encuesta', surveyId, 'preview']);
|
||||
}
|
||||
|
||||
|
@ -347,7 +347,7 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
|
|||
document.getElementById('contextmenu-edit--separator')!.style.display = 'block';
|
||||
document.getElementById('contextmenu-delete--separator')!.style.display = 'block';
|
||||
document.getElementById('contextmenu-edit')!.style.display = 'block';
|
||||
document.getElementById('contextmenu-duplicate')!.style.display = 'block';
|
||||
document.getElementById('contextmenu-preview')!.style.display = 'block';
|
||||
document.getElementById('contextmenu-rename')!.style.display = 'block';
|
||||
document.getElementById('contextmenu-share')!.style.display = 'block';
|
||||
|
||||
|
@ -357,7 +357,8 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
|
|||
} else if ((event.target as HTMLElement).classList.contains('ds-list--entity')) {
|
||||
event.target.classList.add('active');
|
||||
document.getElementById('contextmenu-create--separator')!.style.display = 'none';
|
||||
this.selectedIdSurvey = Number(event.target.dataset.id);
|
||||
|
||||
this.selectedSurvey = Number(event.target.dataset.id);
|
||||
}
|
||||
|
||||
document.getElementById('contextmenu')!.style.top = event.layerY + 'px';
|
||||
|
|
|
@ -14,7 +14,7 @@ const encuestaRoute: Routes = [
|
|||
canActivate: [UserRouteAccessService],
|
||||
},
|
||||
{
|
||||
path: ':id/view',
|
||||
path: ':id/preview',
|
||||
component: EncuestaDetailComponent,
|
||||
resolve: {
|
||||
encuesta: EncuestaRoutingResolveService,
|
||||
|
@ -30,7 +30,7 @@ const encuestaRoute: Routes = [
|
|||
canActivate: [UserRouteAccessService],
|
||||
},
|
||||
{
|
||||
path: ':id/preview',
|
||||
path: ':id/edit',
|
||||
component: EncuestaUpdateComponent,
|
||||
resolve: {
|
||||
encuesta: EncuestaRoutingResolveService,
|
||||
|
|
|
@ -45,6 +45,22 @@ export class EncuestaService {
|
|||
.pipe(map((res: EntityResponseType) => this.convertDateFromServer(res)));
|
||||
}
|
||||
|
||||
findEncuesta(id: number): Observable<IEncuesta> {
|
||||
return this.http.get<IEncuesta>(`${this.resourceUrl}/${id}`);
|
||||
}
|
||||
|
||||
findQuestions(id: number): Observable<EntityResponseType> {
|
||||
return this.http
|
||||
.get<any>(`${this.resourceUrl}/preguntas/${id}`, { observe: 'response' })
|
||||
.pipe(map((res: EntityResponseType) => this.convertDateFromServer(res)));
|
||||
}
|
||||
|
||||
findQuestionsOptions(id: number): Observable<EntityResponseType> {
|
||||
return this.http
|
||||
.get<any>(`${this.resourceUrl}/preguntas-opciones/${id}`, { observe: 'response' })
|
||||
.pipe(map((res: EntityResponseType) => this.convertDateFromServer(res)));
|
||||
}
|
||||
|
||||
query(req?: any): Observable<EntityArrayResponseType> {
|
||||
const options = createRequestOption(req);
|
||||
return this.http
|
||||
|
|
|
@ -98,3 +98,4 @@
|
|||
@import 'paper-dashboard/datasurvey-list';
|
||||
@import 'paper-dashboard/datasurvey-table';
|
||||
@import 'paper-dashboard/datasurvey-contextmenu';
|
||||
@import 'paper-dashboard/datasurvey-survey';
|
||||
|
|
Loading…
Reference in New Issue