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