diff --git a/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.html b/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.html
index 6873d16..49ca308 100644
--- a/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.html
+++ b/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.html
@@ -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>
diff --git a/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.ts b/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.ts
index f04d377..e7b714f 100644
--- a/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.ts
+++ b/src/main/webapp/app/entities/encuesta/detail/encuesta-detail.component.ts
@@ -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();
   }
diff --git a/src/main/webapp/app/entities/encuesta/list/encuesta.component.html b/src/main/webapp/app/entities/encuesta/list/encuesta.component.html
index 01aef26..f7bd41e 100644
--- a/src/main/webapp/app/entities/encuesta/list/encuesta.component.html
+++ b/src/main/webapp/app/entities/encuesta/list/encuesta.component.html
@@ -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>
diff --git a/src/main/webapp/app/entities/encuesta/list/encuesta.component.ts b/src/main/webapp/app/entities/encuesta/list/encuesta.component.ts
index 9300138..0dfca97 100644
--- a/src/main/webapp/app/entities/encuesta/list/encuesta.component.ts
+++ b/src/main/webapp/app/entities/encuesta/list/encuesta.component.ts
@@ -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';
diff --git a/src/main/webapp/app/entities/encuesta/route/encuesta-routing.module.ts b/src/main/webapp/app/entities/encuesta/route/encuesta-routing.module.ts
index ebb2c3f..df9a23d 100644
--- a/src/main/webapp/app/entities/encuesta/route/encuesta-routing.module.ts
+++ b/src/main/webapp/app/entities/encuesta/route/encuesta-routing.module.ts
@@ -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,
diff --git a/src/main/webapp/app/entities/encuesta/service/encuesta.service.ts b/src/main/webapp/app/entities/encuesta/service/encuesta.service.ts
index ef95403..8517aee 100644
--- a/src/main/webapp/app/entities/encuesta/service/encuesta.service.ts
+++ b/src/main/webapp/app/entities/encuesta/service/encuesta.service.ts
@@ -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
diff --git a/src/main/webapp/content/scss/paper-dashboard.scss b/src/main/webapp/content/scss/paper-dashboard.scss
index 3eab78d..8f83aad 100644
--- a/src/main/webapp/content/scss/paper-dashboard.scss
+++ b/src/main/webapp/content/scss/paper-dashboard.scss
@@ -98,3 +98,4 @@
 @import 'paper-dashboard/datasurvey-list';
 @import 'paper-dashboard/datasurvey-table';
 @import 'paper-dashboard/datasurvey-contextmenu';
+@import 'paper-dashboard/datasurvey-survey';