From 792e80081b12f1b04e70911f3b98a17635edb8fd Mon Sep 17 00:00:00 2001 From: Pablo Bonilla Date: Sat, 10 Jul 2021 21:29:19 -0600 Subject: [PATCH] Transfer survey registration logic to survey list component --- .../encuesta/list/encuesta.component.html | 378 +++++++++++++++++- .../encuesta/list/encuesta.component.ts | 182 ++++++++- .../paper-dashboard/_datasurvey-modal.scss | 2 +- 3 files changed, 547 insertions(+), 15 deletions(-) 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 03117c4..5b56b55 100644 --- a/src/main/webapp/app/entities/encuesta/list/encuesta.component.html +++ b/src/main/webapp/app/entities/encuesta/list/encuesta.component.html @@ -123,18 +123,372 @@ >
-
-

Crear Encuesta

-
-
Registrar Encuesta
-
- - -
+
+
+

Crear Encuesta

+
+
+ +
+ + +
+ + +
+ +
+ + +
+ + This field is required. + + + This field is required to be at least 1 characters. + + + This field cannot be longer than 50 characters. + +
+
+ +
+ + +
+ +
+ + +
+ + This field is required. + +
+
+ +
+ + +
+
+
+
+ + +
+
+ + + + 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 d3dbbb5..ff0114c 100644 --- a/src/main/webapp/app/entities/encuesta/list/encuesta.component.ts +++ b/src/main/webapp/app/entities/encuesta/list/encuesta.component.ts @@ -2,10 +2,23 @@ import { Component, OnInit } from '@angular/core'; import { HttpResponse } from '@angular/common/http'; import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; -import { IEncuesta } from '../encuesta.model'; +import { IEncuesta, Encuesta } from '../encuesta.model'; import { EncuestaService } from '../service/encuesta.service'; import { EncuestaDeleteDialogComponent } from '../delete/encuesta-delete-dialog.component'; +import { FormBuilder, Validators } from '@angular/forms'; +import { ActivatedRoute } from '@angular/router'; +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 { 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'; + @Component({ selector: 'jhi-encuesta', templateUrl: './encuesta.component.html', @@ -14,7 +27,35 @@ export class EncuestaComponent implements OnInit { encuestas?: IEncuesta[]; isLoading = false; - constructor(protected encuestaService: EncuestaService, protected modalService: NgbModal) {} + isSaving = false; + + categoriasSharedCollection: ICategoria[] = []; + usuarioExtrasSharedCollection: IUsuarioExtra[] = []; + + editForm = this.fb.group({ + id: [], + nombre: [null, [Validators.required, Validators.minLength(1), Validators.maxLength(50)]], + descripcion: [], + fechaCreacion: [null, [Validators.required]], + fechaPublicacion: [], + fechaFinalizar: [], + fechaFinalizada: [], + calificacion: [null, [Validators.required]], + acceso: [null, [Validators.required]], + contrasenna: [], + estado: [null, [Validators.required]], + categoria: [], + usuarioExtra: [], + }); + + constructor( + protected encuestaService: EncuestaService, + protected modalService: NgbModal, + protected categoriaService: CategoriaService, + protected usuarioExtraService: UsuarioExtraService, + protected activatedRoute: ActivatedRoute, + protected fb: FormBuilder + ) {} loadAll(): void { this.isLoading = true; @@ -32,6 +73,24 @@ export class EncuestaComponent implements OnInit { ngOnInit(): void { this.loadAll(); + + // Call upon selecting a survey to edit + // this.updateForm(encuesta); + + this.loadRelationshipsOptions(); + + // this.activatedRoute.data.subscribe(({ encuesta }) => { + // if (encuesta.id === undefined) { + // const today = dayjs().startOf('day'); + // encuesta.fechaCreacion = today; + // encuesta.fechaPublicacion = today; + // encuesta.fechaFinalizar = today; + // encuesta.fechaFinalizada = today; + // } + + // this.updateForm(encuesta); + + // }); } trackId(index: number, item: IEncuesta): number { @@ -48,4 +107,123 @@ export class EncuestaComponent implements OnInit { } }); } + + previousState(): void { + window.history.back(); + } + + save(): void { + this.isSaving = true; + const encuesta = this.createFromForm(); + console.log(encuesta); + + if (encuesta.id !== null) { + this.subscribeToSaveResponse(this.encuestaService.update(encuesta)); + } else { + this.subscribeToSaveResponse(this.encuestaService.create(encuesta)); + } + } + + trackCategoriaById(index: number, item: ICategoria): number { + return item.id!; + } + + trackUsuarioExtraById(index: number, item: IUsuarioExtra): number { + return item.id!; + } + + protected subscribeToSaveResponse(result: Observable>): void { + result.pipe(finalize(() => this.onSaveFinalize())).subscribe( + () => this.onSaveSuccess(), + () => this.onSaveError() + ); + } + + protected onSaveSuccess(): void { + this.previousState(); + } + + protected onSaveError(): void { + // Api for inheritance. + } + + protected onSaveFinalize(): void { + this.isSaving = false; + } + + protected updateForm(encuesta: IEncuesta): void { + this.editForm.patchValue({ + id: encuesta.id, + nombre: encuesta.nombre, + descripcion: encuesta.descripcion, + fechaCreacion: encuesta.fechaCreacion ? encuesta.fechaCreacion.format(DATE_TIME_FORMAT) : null, + fechaPublicacion: encuesta.fechaPublicacion ? encuesta.fechaPublicacion.format(DATE_TIME_FORMAT) : null, + fechaFinalizar: encuesta.fechaFinalizar ? encuesta.fechaFinalizar.format(DATE_TIME_FORMAT) : null, + fechaFinalizada: encuesta.fechaFinalizada ? encuesta.fechaFinalizada.format(DATE_TIME_FORMAT) : null, + calificacion: encuesta.calificacion, + acceso: encuesta.acceso, + contrasenna: encuesta.contrasenna, + estado: encuesta.estado, + categoria: encuesta.categoria, + usuarioExtra: encuesta.usuarioExtra, + }); + + this.categoriasSharedCollection = this.categoriaService.addCategoriaToCollectionIfMissing( + this.categoriasSharedCollection, + encuesta.categoria + ); + this.usuarioExtrasSharedCollection = this.usuarioExtraService.addUsuarioExtraToCollectionIfMissing( + this.usuarioExtrasSharedCollection, + encuesta.usuarioExtra + ); + } + + protected loadRelationshipsOptions(): void { + this.categoriaService + .query() + .pipe(map((res: HttpResponse) => res.body ?? [])) + .pipe( + map((categorias: ICategoria[]) => + this.categoriaService.addCategoriaToCollectionIfMissing(categorias, this.editForm.get('categoria')!.value) + ) + ) + .subscribe((categorias: ICategoria[]) => (this.categoriasSharedCollection = categorias)); + + this.usuarioExtraService + .query() + .pipe(map((res: HttpResponse) => res.body ?? [])) + .pipe( + map((usuarioExtras: IUsuarioExtra[]) => + this.usuarioExtraService.addUsuarioExtraToCollectionIfMissing(usuarioExtras, this.editForm.get('usuarioExtra')!.value) + ) + ) + .subscribe((usuarioExtras: IUsuarioExtra[]) => (this.usuarioExtrasSharedCollection = usuarioExtras)); + } + + protected createFromForm(): IEncuesta { + return { + ...new Encuesta(), + id: this.editForm.get(['id'])!.value, + nombre: this.editForm.get(['nombre'])!.value, + descripcion: this.editForm.get(['descripcion'])!.value, + fechaCreacion: this.editForm.get(['fechaCreacion'])!.value + ? dayjs(this.editForm.get(['fechaCreacion'])!.value, DATE_TIME_FORMAT) + : undefined, + fechaPublicacion: this.editForm.get(['fechaPublicacion'])!.value + ? dayjs(this.editForm.get(['fechaPublicacion'])!.value, DATE_TIME_FORMAT) + : undefined, + fechaFinalizar: this.editForm.get(['fechaFinalizar'])!.value + ? dayjs(this.editForm.get(['fechaFinalizar'])!.value, DATE_TIME_FORMAT) + : undefined, + fechaFinalizada: this.editForm.get(['fechaFinalizada'])!.value + ? dayjs(this.editForm.get(['fechaFinalizada'])!.value, DATE_TIME_FORMAT) + : undefined, + calificacion: this.editForm.get(['calificacion'])!.value, + acceso: this.editForm.get(['acceso'])!.value, + contrasenna: this.editForm.get(['contrasenna'])!.value, + estado: this.editForm.get(['estado'])!.value, + categoria: this.editForm.get(['categoria'])!.value, + usuarioExtra: this.editForm.get(['usuarioExtra'])!.value, + }; + } } diff --git a/src/main/webapp/content/scss/paper-dashboard/_datasurvey-modal.scss b/src/main/webapp/content/scss/paper-dashboard/_datasurvey-modal.scss index 9e1edc9..cd2cb81 100644 --- a/src/main/webapp/content/scss/paper-dashboard/_datasurvey-modal.scss +++ b/src/main/webapp/content/scss/paper-dashboard/_datasurvey-modal.scss @@ -1,5 +1,5 @@ .ds-modal { - padding-right: 0; + padding: 0 !important; h1 { text-align: left;