Add Configuración de Parámetros

se realizó la historia de usuario 55

src/main/webapp/app/entities/parametro-aplicacion/detail/parametro-aplicacion-detail.component.html

@@ -45,78 +45,79 @@
   </div>
 </div>-->
 <div class="row justify-content-center ds-form">
-  <div class="w-75 pb-lg-5 pr-lg-5 mb-5" style="border-bottom: 1px solid #e7ebf3">
+  <div class="row w-75 mb-5" style="border-bottom: 1px solid #e7ebf3">
-    <div class="col-lg-8 mr-lg-5">
+    <div class="col-lg-10 mr-lg-5">
       <div class="row">
         <div class="w-100">
           <p class="ds-title">Parámetros de la aplicación</p>
         </div>
         <div>
-          <p class="ds-subtitle">
+          <p class="ds-subtitle">Informacion de los parametros que se permiten para la creacion de las encuestas dentro de DataSurvey.</p>
-            Parámetros necesarios para los datos mínimos y máximos que permitirá para las diferentes encuestas dentro de DataSurvey.
-          </p>
         </div>
       </div>
     </div>
   </div>
 </div>
-<jhi-alert-error></jhi-alert-error>
+<div class="row justify-content-center ds-form">
-
+  <jhi-alert-error></jhi-alert-error>
-<jhi-alert></jhi-alert>
+  <jhi-alert></jhi-alert>
-<div *ngIf="parametroAplicacion" class="ds-form">
+  <div class="row w-75 pb-lg-5 pr-lg-5 mb-5" style="border-bottom: 1px solid #e7ebf3">
-  <div class="row justify-content-center info-parametros">
+    <div class="col-lg-4 mr-lg-5">
+      <div class="row">
         <div class="w-100">
-      <h4 class="text-dark text-center fw-bold">Dias para encuestas</h4>
+          <p class="ds-title">Dias para encuestas</p>
         </div>
-    <div class="row w-100 pb-lg-2 mb-5 justify-content-center">
+        <div>
+          <p class="ds-subtitle">
+            Cantidad mínima y máxima de los días que se permitirá para la creación de las encuestas dentro de DataSurvey.
+          </p>
+        </div>
+      </div>
+    </div>
+    <div *ngIf="parametroAplicacion" class="ds-form col-lg ml-lg-5 mr-lg-5 pr-lg-5">
+      <div class="row mb-2">
+        <div class="form-group w-100">
+          <label class="form-control-label">Cantidad mínima</label>
+          <p class="form-control text-center">{{ parametroAplicacion.minDiasEncuesta }}</p>
+        </div>
+        <div class="form-group w-100">
+          <label class="form-control-label">Cantidad máxima</label>
+          <p class="form-control text-center">{{ parametroAplicacion.maxDiasEncuesta }}</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<div class="row justify-content-center ds-form">
+  <div class="row w-75 pb-lg-5 pr-lg-5 mb-5">
     <div class="col-lg-4 mr-lg-5">
       <div class="row">
-          <div class="form-group w-100">
-            <p class="form-control-label">Cantidad mínima</p>
-            <p class="form-control text-center" style="border-bottom: 1px solid #e7ebf3">{{ parametroAplicacion.minDiasEncuesta }}</p>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 mr-lg-5">
-        <div class="row">
-          <div class="form-group w-100">
-            <p class="form-control-label">Cantidad máxima</p>
-            <p class="form-control text-center" style="border-bottom: 1px solid #e7ebf3">{{ parametroAplicacion.maxDiasEncuesta }}</p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="row justify-content-center info-parametros">
         <div class="w-100">
-      <h4 class="text-dark text-center fw-bold">Preguntas para encuestas</h4>
+          <p class="ds-title">Preguntas para encuestas</p>
         </div>
-    <div class="row w-100 pb-lg-2 mb-5 justify-content-center">
+        <div>
-      <div class="col-lg-4 mr-lg-5">
+          <p class="ds-subtitle">
-        <div class="row">
+            Cantidad mínima y máxima de las preguntas que se permitirá ingresar para la creación de las encuestas dentro de DataSurvey.
+          </p>
+        </div>
+      </div>
+    </div>
+    <div *ngIf="parametroAplicacion" class="ds-form col-lg ml-lg-5 mr-lg-5 pr-lg-5">
+      <div class="row mb-2">
         <div class="form-group w-100">
-            <p class="form-control-label">Cantidad mínima</p>
+          <label class="form-control-label">Cantidad mínima</label>
-            <p class="form-control text-center" style="border-bottom: 1px solid #e7ebf3">{{ parametroAplicacion.minCantidadPreguntas }}</p>
+          <p class="form-control text-center">{{ parametroAplicacion.minCantidadPreguntas }}</p>
         </div>
-        </div>
-      </div>
-      <div class="col-lg-4 mr-lg-5">
-        <div class="row">
         <div class="form-group w-100">
-            <p class="form-control-label">Cantidad máxima</p>
+          <label class="form-control-label">Cantidad máxima</label>
           <p class="form-control text-center">{{ parametroAplicacion.maxCantidadPreguntas }}</p>
         </div>
       </div>
-      </div>
-    </div>
       <div class="row">
-      <button class="ds-btn ds-btn--secondary" type="submit" (click)="previousState()" data-cy="entityDetailsBackButton">
-        <fa-icon icon="arrow-left"></fa-icon>&nbsp;<span jhiTranslate="entity.action.back">Back</span>
-      </button>
-
         <button class="ds-btn ds-btn--primary" type="button" [routerLink]="['/parametro-aplicacion', parametroAplicacion.id, 'edit']">
           <fa-icon icon="pencil-alt"></fa-icon>&nbsp;<span jhiTranslate="entity.action.edit">Edit</span>
         </button>
       </div>
     </div>
+  </div>
 </div>

src/main/webapp/app/entities/parametro-aplicacion/update/parametro-aplicacion-update.component.html

@@ -1,229 +1,53 @@
-<!--<div class="row justify-content-center">
-  <div class="col-8">
-    <form name="editForm" role="form" novalidate (ngSubmit)="save()" [formGroup]="editForm">
-      <h2
-        id="jhi-parametro-aplicacion-heading"
-        data-cy="ParametroAplicacionCreateUpdateHeading"
-        jhiTranslate="dataSurveyApp.parametroAplicacion.home.createOrEditLabel"
-      >
-        Create or edit a Parametro Aplicacion
-      </h2>
-
-      <div>
-        <jhi-alert-error></jhi-alert-error>
-
-        <div class="form-group" [hidden]="editForm.get('id')!.value == null">
-          <label class="form-control-label" jhiTranslate="global.field.id" for="field_id">ID</label>
-          <input type="number" class="form-control" name="id" id="field_id" data-cy="id" formControlName="id" [readonly]="true" />
-        </div>
-
-        <div class="form-group">
-          <label class="form-control-label" jhiTranslate="dataSurveyApp.parametroAplicacion.maxDiasEncuesta" for="field_maxDiasEncuesta"
-            >Max Dias Encuesta</label
-          >
-          <input
-            type="number"
-            class="form-control"
-            name="maxDiasEncuesta"
-            id="field_maxDiasEncuesta"
-            data-cy="maxDiasEncuesta"
-            formControlName="maxDiasEncuesta"
-          />
-          <div
-            *ngIf="
-              editForm.get('maxDiasEncuesta')!.invalid &&
-              (editForm.get('maxDiasEncuesta')!.dirty || editForm.get('maxDiasEncuesta')!.touched)
-            "
-          >
-            <small
-              class="form-text text-danger"
-              *ngIf="editForm.get('maxDiasEncuesta')?.errors?.required"
-              jhiTranslate="entity.validation.required"
-            >
-              This field is required.
-            </small>
-            <small
-              class="form-text text-danger"
-              [hidden]="!editForm.get('maxDiasEncuesta')?.errors?.number"
-              jhiTranslate="entity.validation.number"
-            >
-              This field should be a number.
-            </small>
-          </div>
-        </div>
-
-        <div class="form-group">
-          <label class="form-control-label" jhiTranslate="dataSurveyApp.parametroAplicacion.minDiasEncuesta" for="field_minDiasEncuesta"
-            >Min Dias Encuesta</label
-          >
-          <input
-            type="number"
-            class="form-control"
-            name="minDiasEncuesta"
-            id="field_minDiasEncuesta"
-            data-cy="minDiasEncuesta"
-            formControlName="minDiasEncuesta"
-          />
-          <div
-            *ngIf="
-              editForm.get('minDiasEncuesta')!.invalid &&
-              (editForm.get('minDiasEncuesta')!.dirty || editForm.get('minDiasEncuesta')!.touched)
-            "
-          >
-            <small
-              class="form-text text-danger"
-              *ngIf="editForm.get('minDiasEncuesta')?.errors?.required"
-              jhiTranslate="entity.validation.required"
-            >
-              This field is required.
-            </small>
-            <small
-              class="form-text text-danger"
-              [hidden]="!editForm.get('minDiasEncuesta')?.errors?.number"
-              jhiTranslate="entity.validation.number"
-            >
-              This field should be a number.
-            </small>
-          </div>
-        </div>
-
-        <div class="form-group">
-          <label
-            class="form-control-label"
-            jhiTranslate="dataSurveyApp.parametroAplicacion.maxCantidadPreguntas"
-            for="field_maxCantidadPreguntas"
-            >Max Cantidad Preguntas</label
-          >
-          <input
-            type="number"
-            class="form-control"
-            name="maxCantidadPreguntas"
-            id="field_maxCantidadPreguntas"
-            data-cy="maxCantidadPreguntas"
-            formControlName="maxCantidadPreguntas"
-          />
-          <div
-            *ngIf="
-              editForm.get('maxCantidadPreguntas')!.invalid &&
-              (editForm.get('maxCantidadPreguntas')!.dirty || editForm.get('maxCantidadPreguntas')!.touched)
-            "
-          >
-            <small
-              class="form-text text-danger"
-              *ngIf="editForm.get('maxCantidadPreguntas')?.errors?.required"
-              jhiTranslate="entity.validation.required"
-            >
-              This field is required.
-            </small>
-            <small
-              class="form-text text-danger"
-              [hidden]="!editForm.get('maxCantidadPreguntas')?.errors?.number"
-              jhiTranslate="entity.validation.number"
-            >
-              This field should be a number.
-            </small>
-          </div>
-        </div>
-
-        <div class="form-group">
-          <label
-            class="form-control-label"
-            jhiTranslate="dataSurveyApp.parametroAplicacion.minCantidadPreguntas"
-            for="field_minCantidadPreguntas"
-            >Min Cantidad Preguntas</label
-          >
-          <input
-            type="number"
-            class="form-control"
-            name="minCantidadPreguntas"
-            id="field_minCantidadPreguntas"
-            data-cy="minCantidadPreguntas"
-            formControlName="minCantidadPreguntas"
-          />
-          <div
-            *ngIf="
-              editForm.get('minCantidadPreguntas')!.invalid &&
-              (editForm.get('minCantidadPreguntas')!.dirty || editForm.get('minCantidadPreguntas')!.touched)
-            "
-          >
-            <small
-              class="form-text text-danger"
-              *ngIf="editForm.get('minCantidadPreguntas')?.errors?.required"
-              jhiTranslate="entity.validation.required"
-            >
-              This field is required.
-            </small>
-            <small
-              class="form-text text-danger"
-              [hidden]="!editForm.get('minCantidadPreguntas')?.errors?.number"
-              jhiTranslate="entity.validation.number"
-            >
-              This field should be a number.
-            </small>
-          </div>
-        </div>
-      </div>
-
-      <div>
-        <button type="button" id="cancel-save" data-cy="entityCreateCancelButton" class="btn btn-secondary" (click)="previousState()">
-          <fa-icon icon="ban"></fa-icon>&nbsp;<span jhiTranslate="entity.action.cancel">Cancel</span>
-        </button>
-
-        <button
-          type="submit"
-          id="save-entity"
-          data-cy="entityCreateSaveButton"
-          [disabled]="editForm.invalid || isSaving"
-          class="btn btn-primary"
-        >
-          <fa-icon icon="save"></fa-icon>&nbsp;<span jhiTranslate="entity.action.save">Save</span>
-        </button>
-      </div>
-    </form>
-  </div>
-</div>-->
-
 <div class="row justify-content-center ds-form">
-  <div class="w-75 pb-lg-5 pr-lg-5 mb-5" style="border-bottom: 1px solid #e7ebf3">
+  <div class="row w-75 mb-5" style="border-bottom: 1px solid #e7ebf3">
-    <div class="col-lg-8 mr-lg-5">
+    <div class="col-lg-10 mr-lg-5">
       <div class="row">
         <div class="w-100">
           <p class="ds-title">Parámetros de la aplicación</p>
         </div>
         <div>
-          <p class="ds-subtitle">
+          <p class="ds-subtitle">Edición de los parámetros que se permiten para la creación de las encuestas dentro de DataSurvey.</p>
-            Parámetros necesarios para los datos mínimos y máximos que permitirá para las diferentes encuestas dentro de DataSurvey.
-          </p>
         </div>
       </div>
     </div>
   </div>
 </div>
-<jhi-alert-error></jhi-alert-error>
-
-<jhi-alert></jhi-alert>
 
+<div class="alert alert-danger" *ngIf="minDiasIncorrect">La cantidad mínima de los días, debe ser inferior a la cantidad máxima</div>
+<div class="alert alert-danger" *ngIf="minPreguntasIncorrect">
+  La cantidad mínima de las preguntas, debe ser inferior a la cantidad máxima
+</div>
+<div class="alert alert-danger" *ngIf="notNumbers">Los valores digitadas deben ser numéricas y enteras</div>
+<div class="alert alert-danger" *ngIf="notPositive">Los valores ingresados deben ser mayores que 0</div>
 <!-- Form -->
 <form
   autocomplete="off"
-  class="ds-form col-lg ml-lg-5 mr-lg-5 pr-lg-5"
+  class="ds-form row justify-content-center"
   name="editForm"
   role="form"
   novalidate
   (ngSubmit)="save()"
   [formGroup]="editForm"
 >
-  <div class="row justify-content-center info-parametros">
+  <div class="row w-75 pb-lg-5 pr-lg-5 mb-5" style="border-bottom: 1px solid #e7ebf3">
-    <div class="w-100">
-      <h4 class="text-dark text-center fw-bold">Edición Días para Encuestas</h4>
-    </div>
-    <div class="row w-100 pb-lg-2 mb-5 justify-content-center">
     <div class="col-lg-4 mr-lg-5">
       <div class="row">
+        <div class="w-100">
+          <p class="ds-title">Edición Días para Encuestas</p>
+        </div>
+        <div>
+          <p class="ds-subtitle">
+            Editar la cantidad mínima y máxima de los días que se permitirá para la creación de las encuestas dentro de DataSurvey.
+          </p>
+        </div>
+      </div>
+    </div>
+    <div class="col-lg ml-lg-5 mr-lg-5 pr-lg-5">
+      <div class="row mb-2">
         <div class="form-group w-100">
           <label class="form-control-label" for="field_minDiasEncuesta">Cantidad mínima</label>
           <input
-              type="text"
+            type="number"
             class="form-control"
             name="minDiasEncuesta"
             id="field_minDiasEncuesta"
@@ -243,16 +67,21 @@
             >
               This field is required.
             </small>
+            <small
+              class="form-text text-danger"
+              [hidden]="!editForm.get('minDiasEncuesta')?.errors?.pattern"
+              jhiTranslate="entity.validation.integerNumber"
+            >
+              This field should be a number.
+            </small>
+            <small class="form-text text-danger" [hidden]="!editForm.get('minDiasEncuesta')?.errors?.min">
+              Este campo no puede ser mayor que 1
+            </small>
           </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 mr-lg-5">
-        <div class="row">
           <div class="form-group w-100">
             <label class="form-control-label" for="field_maxDiasEncuesta">Cantidad máxima</label>
             <input
-              type="text"
+              type="number"
               class="form-control"
               name="maxDiasEncuesta"
               id="field_maxDiasEncuesta"
@@ -272,23 +101,42 @@
               >
                 This field is required.
               </small>
+              <small
+                class="form-text text-danger"
+                [hidden]="!editForm.get('maxDiasEncuesta')?.errors?.pattern"
+                jhiTranslate="entity.validation.integerNumber"
+              >
+                This field should be a number.
+              </small>
+              <small class="form-text text-danger" [hidden]="!editForm.get('maxDiasEncuesta')?.errors?.min">
+                Este campo no puede ser mayor que 1
+              </small>
             </div>
           </div>
         </div>
       </div>
     </div>
   </div>
-  <div class="row justify-content-center info-parametros">
+
-    <div class="w-100">
+  <div class="row w-75 pb-lg-5 pr-lg-5 mb-5" style="border-bottom: 1px solid #e7ebf3">
-      <h4 class="text-dark text-center fw-bold">Edición Preguntas para Encuestas</h4>
-    </div>
-    <div class="row w-100 pb-lg-2 mb-5 justify-content-center">
     <div class="col-lg-4 mr-lg-5">
       <div class="row">
+        <div class="w-100">
+          <p class="ds-title">Edición Preguntas para Encuestas</p>
+        </div>
+        <div>
+          <p class="ds-subtitle">
+            Editar la cantidad mínima y máxima de las preguntas que se permitirán para la creación de las encuestas dentro de DataSurvey.
+          </p>
+        </div>
+      </div>
+    </div>
+    <div class="col-lg ml-lg-5 mr-lg-5 pr-lg-5">
+      <div class="row mb-2">
         <div class="form-group w-100">
           <label class="form-control-label" for="field_minCantidadPreguntas">Cantidad mínima</label>
           <input
-              type="text"
+            type="number"
             class="form-control"
             name="minCantidadPreguntas"
             id="field_minCantidadPreguntas"
@@ -308,16 +156,21 @@
             >
               This field is required.
             </small>
+            <small
+              class="form-text text-danger"
+              [hidden]="!editForm.get('minCantidadPreguntas')?.errors?.pattern"
+              jhiTranslate="entity.validation.integerNumber"
+            >
+              This field should be a number.
+            </small>
+            <small class="form-text text-danger" [hidden]="!editForm.get('minCantidadPreguntas')?.errors?.min">
+              Este campo no puede ser mayor que 1
+            </small>
           </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 mr-lg-5">
-        <div class="row">
           <div class="form-group w-100">
             <label class="form-control-label" for="field_maxCantidadPreguntas">Cantidad máxima</label>
             <input
-              type="text"
+              type="number"
               class="form-control"
               name="maxCantidadPreguntas"
               id="field_maxCantidadPreguntas"
@@ -337,13 +190,28 @@
               >
                 This field is required.
               </small>
-            </div>
+              <small
+                class="form-text text-danger"
+                [hidden]="!editForm.get('maxCantidadPreguntas')?.errors?.pattern"
+                jhiTranslate="entity.validation.integerNumber"
+              >
+                This field should be a integer number.
+              </small>
+              <small class="form-text text-danger" [hidden]="!editForm.get('minCantidadPreguntas')?.errors?.min">
+                Este campo no puede ser mayor que 1
+              </small>
             </div>
           </div>
         </div>
       </div>
       <div class="row">
-      <button type="button" id="cancel-save" data-cy="entityCreateCancelButton" class="ds-btn ds-btn--secondary" (click)="previousState()">
+        <button
+          type="button"
+          id="cancel-save"
+          data-cy="entityCreateCancelButton"
+          class="ds-btn ds-btn--secondary"
+          (click)="previousState()"
+        >
           <fa-icon icon="arrow-left"></fa-icon>&nbsp;&nbsp;<span jhiTranslate="entity.action.cancel">Cancel</span>
         </button>
 
@@ -358,4 +226,5 @@
         </button>
       </div>
     </div>
+  </div>
 </form>

src/main/webapp/app/entities/parametro-aplicacion/update/parametro-aplicacion-update.component.scss

@@ -7,3 +7,7 @@ info-parametros {
   font-weight: 700;
   font-size: 1.3rem;
 }
+
+.form-control {
+  margin-bottom: 20px;
+}

src/main/webapp/app/entities/parametro-aplicacion/update/parametro-aplicacion-update.component.ts

@@ -15,13 +15,19 @@ import { ParametroAplicacionService } from '../service/parametro-aplicacion.serv
 })
 export class ParametroAplicacionUpdateComponent implements OnInit {
   isSaving = false;
+  minDiasIncorrect = false;
+  minPreguntasIncorrect = false;
+  notNumbers = false;
+  notPositive = false;
+  error = false;
+  success = false;
 
   editForm = this.fb.group({
     id: [],
-    maxDiasEncuesta: [null, [Validators.required]],
+    maxDiasEncuesta: [null, [Validators.required, Validators.pattern(/^[0-9]\d*$/), Validators.min(1)]],
-    minDiasEncuesta: [null, [Validators.required]],
+    minDiasEncuesta: [null, [Validators.required, Validators.pattern(/^[0-9]\d*$/), Validators.min(1)]],
-    maxCantidadPreguntas: [null, [Validators.required]],
+    maxCantidadPreguntas: [null, [Validators.required, Validators.pattern(/^[0-9]\d*$/), Validators.min(1)]],
-    minCantidadPreguntas: [null, [Validators.required]],
+    minCantidadPreguntas: [null, [Validators.required, Validators.pattern(/^[0-9]\d*$/), Validators.min(1)]],
   });
 
   constructor(
@@ -41,6 +47,30 @@ export class ParametroAplicacionUpdateComponent implements OnInit {
   }
 
   save(): void {
+    this.minDiasIncorrect = false;
+    this.minPreguntasIncorrect = false;
+    this.notNumbers = false;
+    this.notPositive = false;
+
+    const minCantDias = this.editForm.get(['minDiasEncuesta'])!.value;
+    const maxCantDias = this.editForm.get(['maxDiasEncuesta'])!.value;
+    const minCantPreguntas = this.editForm.get(['minCantidadPreguntas'])!.value;
+    const maxCantPreguntas = this.editForm.get(['maxCantidadPreguntas'])!.value;
+
+    if (minCantDias > maxCantDias) {
+      this.minDiasIncorrect = true;
+    } else if (minCantPreguntas > maxCantPreguntas) {
+      this.minPreguntasIncorrect = true;
+    } else if (
+      !Number.isInteger(minCantDias) ||
+      !Number.isInteger(maxCantDias) ||
+      !Number.isInteger(minCantPreguntas) ||
+      !Number.isInteger(maxCantPreguntas)
+    ) {
+      this.notNumbers = true;
+    } else if (minCantDias < 1 || maxCantDias < 1 || minCantPreguntas < 1 || maxCantPreguntas < 1) {
+      this.notPositive = true;
+    } else {
       this.isSaving = true;
       const parametroAplicacion = this.createFromForm();
       if (parametroAplicacion.id !== undefined) {
@@ -49,6 +79,7 @@ export class ParametroAplicacionUpdateComponent implements OnInit {
         this.subscribeToSaveResponse(this.parametroAplicacionService.create(parametroAplicacion));
       }
     }
+  }
 
   protected subscribeToSaveResponse(result: Observable<HttpResponse<IParametroAplicacion>>): void {
     result.pipe(finalize(() => this.onSaveFinalize())).subscribe(
@@ -89,4 +120,6 @@ export class ParametroAplicacionUpdateComponent implements OnInit {
       minCantidadPreguntas: this.editForm.get(['minCantidadPreguntas'])!.value,
     };
   }
+
+  private validations() {}
 }

src/main/webapp/i18n/es/global.json

@@ -138,6 +138,7 @@
       "maxbytes": "Este campo no puede tener más de {{max}} bytes.",
       "pattern": "Este campo debe seguir el patrón {{pattern}}.",
       "number": "Este campo debe ser un número.",
+      "integerNumber": "Este campo debe ser un número entero.",
       "datetimelocal": "Este campo debe ser una fecha y hora."
     }
   },