Add create question to survey list of questions
This commit is contained in:
parent
0af94cd9f2
commit
78e58ab69a
|
@ -10,6 +10,16 @@
|
|||
<button type="button" class="ds-btn ds-btn--secondary" (click)="loadAll()" [disabled]="isLoading">
|
||||
<fa-icon icon="sync" [spin]="isLoading"></fa-icon> <span>Refrescar preguntas</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="ds-btn ds-btn--secondary"
|
||||
(click)="createQuestion()"
|
||||
[disabled]="isLoading"
|
||||
data-toggle="modal"
|
||||
data-target="#crearPregunta"
|
||||
>
|
||||
<fa-icon icon="sync" [icon]="faPlus"></fa-icon> <span>Crear pregunta</span>
|
||||
</button>
|
||||
<ng-container *ngIf="encuesta!.estado === 'DRAFT'">
|
||||
<button type="button" class="ds-btn ds-btn--primary" (click)="publishSurvey()">Publicar encuesta</button>
|
||||
</ng-container>
|
||||
|
@ -64,7 +74,7 @@
|
|||
class="ds-survey--option ds-survey--option--base ds-survey--closed-option can-delete"
|
||||
[attr.data-id]="ePreguntaOpcionFinal.id"
|
||||
>
|
||||
<input class="ds-survey--checkbox" id="{{ ePregunta.id }}-{{ ePreguntaOpcionFinal.id }}" type="checkbox" disabled />
|
||||
<!-- <input class="ds-survey--checkbox" id="{{ ePregunta.id }}-{{ ePreguntaOpcionFinal.id }}" type="checkbox" disabled /> -->
|
||||
<label for="{{ ePregunta.id }}-{{ ePreguntaOpcionFinal.id }}">{{ ePreguntaOpcionFinal.nombre }}</label>
|
||||
<fa-icon
|
||||
*ngIf="encuesta!.estado === 'DRAFT'"
|
||||
|
@ -229,6 +239,93 @@
|
|||
|
||||
<!-- ------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
<!-- Modal -->
|
||||
<div
|
||||
class="modal fade ds-modal"
|
||||
id="crearPregunta"
|
||||
tabindex="-1"
|
||||
role="dialog"
|
||||
aria-labelledby="exampleModalCenterTitle"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog modal-dialog-centered" role="document">
|
||||
<div class="modal-content">
|
||||
<form
|
||||
autocomplete="off"
|
||||
class="ds-form"
|
||||
name="editFormQuestion"
|
||||
role="form"
|
||||
novalidate
|
||||
(ngSubmit)="saveQuestion()"
|
||||
[formGroup]="editFormQuestion"
|
||||
>
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title" id="exampleModalLongTitle">Crear Pregunta</h1>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<!-- Survey Create Question Modal -->
|
||||
<div>
|
||||
<jhi-alert-error></jhi-alert-error>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-control-label" for="field_nombre">Pregunta</label>
|
||||
<input type="text" class="form-control" name="nombre" id="field_nombre" data-cy="nombre" formControlName="nombre" />
|
||||
<div
|
||||
*ngIf="
|
||||
editFormQuestion.get('nombre')!.invalid &&
|
||||
(editFormQuestion.get('nombre')!.dirty || editFormQuestion.get('nombre')!.touched)
|
||||
"
|
||||
>
|
||||
<small
|
||||
class="form-text text-danger"
|
||||
*ngIf="editFormQuestion.get('nombre')?.errors?.required"
|
||||
jhiTranslate="entity.validation.required"
|
||||
>
|
||||
This field is required.
|
||||
</small>
|
||||
<small
|
||||
class="form-text text-danger"
|
||||
*ngIf="editFormQuestion.get('nombre')?.errors?.minlength"
|
||||
jhiTranslate="entity.validation.minlength"
|
||||
[translateValues]="{ min: 1 }"
|
||||
>
|
||||
This field is required to be at least 1 characters.
|
||||
</small>
|
||||
<small
|
||||
class="form-text text-danger"
|
||||
*ngIf="editFormQuestion.get('nombre')?.errors?.maxlength"
|
||||
jhiTranslate="entity.validation.maxlength"
|
||||
[translateValues]="{ max: 500 }"
|
||||
>
|
||||
This field cannot be longer than 500 characters.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<input id="createAnotherQuestion" type="checkbox" (change)="createAnotherQuestionChange($event)" />
|
||||
<label for="createAnotherQuestion">Crear otra</label>
|
||||
<button id="cancelBtnQuestion" type="button" class="ds-btn ds-btn--secondary" data-dismiss="modal">
|
||||
<fa-icon icon="arrow-left"></fa-icon> <span jhiTranslate="entity.action.cancel">Cancel</span>
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
id="save-question"
|
||||
data-cy="entityCreateSaveButton"
|
||||
class="ds-btn ds-btn--primary"
|
||||
[disabled]="editFormQuestion.invalid || isSaving"
|
||||
>
|
||||
<span jhiTranslate="entity.action.create">Create</span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
<!-- <div class="row justify-content-center">
|
||||
<div class="col-8">
|
||||
<form name="editForm" role="form" novalidate (ngSubmit)="save()" [formGroup]="editForm">
|
||||
|
|
|
@ -25,6 +25,7 @@ import { EPreguntaCerradaService } from 'app/entities/e-pregunta-cerrada/service
|
|||
import { EPreguntaCerradaDeleteDialogComponent } from 'app/entities/e-pregunta-cerrada/delete/e-pregunta-cerrada-delete-dialog.component';
|
||||
|
||||
import { faTimes, faPlus } from '@fortawesome/free-solid-svg-icons';
|
||||
import { PreguntaCerradaTipo } from 'app/entities/enumerations/pregunta-cerrada-tipo.model';
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-encuesta-update',
|
||||
|
@ -35,6 +36,7 @@ export class EncuestaUpdateComponent implements OnInit, AfterViewChecked {
|
|||
faPlus = faPlus;
|
||||
|
||||
isSaving = false;
|
||||
isSavingQuestion = false;
|
||||
|
||||
categoriasSharedCollection: ICategoria[] = [];
|
||||
usuarioExtrasSharedCollection: IUsuarioExtra[] = [];
|
||||
|
@ -63,6 +65,11 @@ export class EncuestaUpdateComponent implements OnInit, AfterViewChecked {
|
|||
// ePreguntaCerrada: [],
|
||||
});
|
||||
|
||||
editFormQuestion = this.fb.group({
|
||||
id: [],
|
||||
nombre: [null, [Validators.required, Validators.minLength(1), Validators.maxLength(500)]],
|
||||
});
|
||||
|
||||
ePreguntas?: any[];
|
||||
ePreguntasOpciones?: any[];
|
||||
encuesta: Encuesta | null = null;
|
||||
|
@ -70,6 +77,7 @@ export class EncuestaUpdateComponent implements OnInit, AfterViewChecked {
|
|||
isLoading = false;
|
||||
|
||||
createAnother: Boolean = false;
|
||||
createAnotherQuestion: Boolean = false;
|
||||
selectedQuestionToCreateOption: IEPreguntaCerrada | null = null;
|
||||
|
||||
constructor(
|
||||
|
@ -283,6 +291,62 @@ export class EncuestaUpdateComponent implements OnInit, AfterViewChecked {
|
|||
this.createAnother = event.target.checked;
|
||||
}
|
||||
|
||||
createQuestion(): void {
|
||||
const surveyId = this.encuesta?.id;
|
||||
console.log(surveyId);
|
||||
}
|
||||
|
||||
protected createFromFormQuestion(): IEPreguntaCerrada {
|
||||
return {
|
||||
// ...new EPreguntaCerrada(),
|
||||
id: undefined,
|
||||
nombre: this.editFormQuestion.get(['nombre'])!.value,
|
||||
tipo: PreguntaCerradaTipo.SINGLE,
|
||||
opcional: false,
|
||||
orden: 10,
|
||||
encuesta: this.encuesta,
|
||||
};
|
||||
}
|
||||
|
||||
createAnotherQuestionChange(event: any) {
|
||||
this.createAnotherQuestion = event.target.checked;
|
||||
}
|
||||
|
||||
saveQuestion(): void {
|
||||
this.isSavingQuestion = true;
|
||||
const ePreguntaCerrada = this.createFromFormQuestion();
|
||||
if (ePreguntaCerrada.id !== undefined) {
|
||||
this.subscribeToSaveResponseQuestion(this.ePreguntaCerradaService.update(ePreguntaCerrada));
|
||||
} else {
|
||||
this.subscribeToSaveResponseQuestion(this.ePreguntaCerradaService.create(ePreguntaCerrada));
|
||||
}
|
||||
}
|
||||
|
||||
protected subscribeToSaveResponseQuestion(result: Observable<HttpResponse<IEPreguntaCerrada>>): void {
|
||||
result.pipe(finalize(() => this.onSaveFinalizeQuestion())).subscribe(
|
||||
() => this.onSaveSuccessQuestion(),
|
||||
() => this.onSaveErrorQuestion()
|
||||
);
|
||||
}
|
||||
|
||||
protected onSaveSuccessQuestion(): void {
|
||||
this.editFormQuestion.reset();
|
||||
this.ePreguntas = [];
|
||||
this.ePreguntasOpciones = [];
|
||||
this.loadAll();
|
||||
if (!this.createAnotherQuestion) {
|
||||
$('#cancelBtnQuestion').click();
|
||||
}
|
||||
}
|
||||
|
||||
protected onSaveErrorQuestion(): void {
|
||||
// Api for inheritance.
|
||||
}
|
||||
|
||||
protected onSaveFinalizeQuestion(): void {
|
||||
this.isSavingQuestion = false;
|
||||
}
|
||||
|
||||
// previousState(): void {
|
||||
// window.history.back();
|
||||
// }
|
||||
|
|
|
@ -37,7 +37,7 @@
|
|||
|
||||
&--small {
|
||||
font-size: 0.8rem;
|
||||
padding: 0.6rem;
|
||||
padding: 0.3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -105,14 +105,14 @@
|
|||
align-items: center;
|
||||
font-size: 0.9rem;
|
||||
color: #15131d;
|
||||
padding: 1rem 3rem 1rem 0.5rem;
|
||||
padding: 1rem;
|
||||
transition: all 0.1s ease-in-out;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
|
||||
label {
|
||||
width: 100%;
|
||||
margin: 0 1rem;
|
||||
margin: 0;
|
||||
color: #1f3779;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue