336 lines
12 KiB
HTML
336 lines
12 KiB
HTML
<div class="row justify-content-center">
|
|
<div class="row w-75 pb-lg-5 pr-lg-5 mb-5" style="border-bottom: 1px solid #e7ebf3">
|
|
<div class="col-lg-4 mr-lg-5">
|
|
<div class="row">
|
|
<div class="w-100">
|
|
<p class="ds-title">Perfil</p>
|
|
</div>
|
|
<div>
|
|
<p class="ds-subtitle">Información general de su usuario, el correo electrónico es su identificador en DataSurvey</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Form de info usuario -->
|
|
<form
|
|
autocomplete="off"
|
|
class="ds-form col-lg ml-lg-5 mr-lg-5 pr-lg-5"
|
|
name="editForm"
|
|
role="form"
|
|
novalidate
|
|
(ngSubmit)="save()"
|
|
[formGroup]="editForm"
|
|
>
|
|
<div class="row mb-2">
|
|
<div
|
|
class="alert alert-danger"
|
|
*ngIf="error"
|
|
jhiTranslate="global.messages.info.authenticated.updateForm"
|
|
data-cy="loginError"
|
|
></div>
|
|
|
|
<div *ngIf="success" class="alert alert-success alert-dismissible fade show" role="alert">
|
|
Sus datos fueron actualizados de manera exitosa
|
|
<!--<button type="button" class="close" data-dismiss="alert" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>-->
|
|
</div>
|
|
|
|
<div class="form-group w-100">
|
|
<label class="form-control-label" for="field_email">Correo electrónico</label>
|
|
<input type="text" class="form-control" name="email" id="field_email" data-cy="email" formControlName="email" [readonly]="true" />
|
|
<div *ngIf="editForm.get('email')!.invalid && (editForm.get('email')!.dirty || editForm.get('email')!.touched)">
|
|
<small class="form-text text-danger" *ngIf="editForm.get('email')?.errors?.required" jhiTranslate="entity.validation.required">
|
|
This field is required.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-2">
|
|
<div class="form-group w-100">
|
|
<label class="form-control-label" jhiTranslate="dataSurveyApp.usuarioExtra.nombre" for="field_nombre">Nombre</label>
|
|
<input type="text" class="form-control" name="nombre" id="field_nombre" data-cy="nombre" formControlName="nombre" />
|
|
<div *ngIf="editForm.get('nombre')!.invalid && (editForm.get('nombre')!.dirty || editForm.get('nombre')!.touched)">
|
|
<small class="form-text text-danger" *ngIf="editForm.get('nombre')?.errors?.required" jhiTranslate="entity.validation.required">
|
|
This field is required.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-2">
|
|
<div class="form-group w-100">
|
|
<label class="form-control-label" jhiTranslate="dataSurveyApp.usuarioExtra.fechaNacimiento" for="field_fechaNacimiento"
|
|
>Fecha de nacimiento</label
|
|
>
|
|
<div class="d-flex">
|
|
<input
|
|
id="field_fechaNacimiento"
|
|
data-cy="fechaNacimiento"
|
|
type="date"
|
|
class="form-control"
|
|
name="fechaNacimiento"
|
|
formControlName="fechaNacimiento"
|
|
placeholder="YYYY-MM-DD HH:mm"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-4">
|
|
<div class="form-group w-100">
|
|
<label>Ícono de perfil</label>
|
|
<div class="d-flex">
|
|
<jhi-swiper style="width: 22.5rem !important" [data]="profileIcons" (onSelectEvent)="selectIcon($event)"></jhi-swiper>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<button
|
|
type="button"
|
|
id="cancel-save"
|
|
data-cy="entityCreateCancelButton"
|
|
class="ds-btn ds-btn--secondary"
|
|
(click)="previousState()"
|
|
>
|
|
<fa-icon icon="arrow-left"></fa-icon> <span jhiTranslate="entity.action.cancel">Cancel</span>
|
|
</button>
|
|
|
|
<button
|
|
type="submit"
|
|
id="save-entity"
|
|
data-cy="entityCreateSaveButton"
|
|
[disabled]="editForm.invalid || isSaving"
|
|
class="ds-btn ds-btn--primary"
|
|
>
|
|
<span jhiTranslate="entity.action.save">Save</span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="row w-75 pb-lg-5 pr-lg-5">
|
|
<div class="col-lg-4 mr-lg-5">
|
|
<div class="row">
|
|
<div class="w-100">
|
|
<p class="ds-title">Contraseña</p>
|
|
</div>
|
|
<div>
|
|
<p class="ds-subtitle">
|
|
Utilice una contraseña segura al realizar el cambio, este dato debe ser secreto ya que provee acceso a su cuenta
|
|
</p>
|
|
</div>
|
|
|
|
<div class="alert alert-danger" *ngIf="isGoogle" jhiTranslate="login.messages.error.isGoogle" data-cy="loginError"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Form de password-->
|
|
<form
|
|
autocomplete="off"
|
|
class="ds-form col-lg ml-lg-5 mr-lg-5 pr-lg-5"
|
|
name="passwordForm"
|
|
role="form"
|
|
novalidate
|
|
(ngSubmit)="savePassword()"
|
|
[formGroup]="passwordForm"
|
|
>
|
|
<div class="row mb-3 pb-3" style="border-bottom: 1px solid #e7ebf3">
|
|
<div
|
|
class="alert alert-danger"
|
|
*ngIf="errorPassword && !doNotMatch && !successPassword && !samePassword"
|
|
jhiTranslate="global.messages.info.authenticated.passwordForm"
|
|
data-cy="loginError"
|
|
></div>
|
|
|
|
<div
|
|
*ngIf="successPassword && !errorPassword && !samePassword && !doNotMatch"
|
|
class="alert alert-success alert-dismissible fade show"
|
|
role="alert"
|
|
>
|
|
Sus contraseña fue actualizada de manera exitosa
|
|
<!-- <button type="button" class="close" data-dismiss="alert" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>-->
|
|
</div>
|
|
|
|
<div
|
|
class="alert alert-danger"
|
|
*ngIf="doNotMatch && !successPassword && !errorPassword"
|
|
jhiTranslate="global.messages.error.dontmatch"
|
|
>
|
|
The password and its confirmation do not match!
|
|
</div>
|
|
|
|
<div
|
|
class="alert alert-danger"
|
|
*ngIf="samePassword && !successPassword && !errorPassword && !doNotMatch"
|
|
jhiTranslate="global.messages.error.samePassword"
|
|
>
|
|
The password and its confirmation do not match!
|
|
</div>
|
|
|
|
<div class="form-group w-100">
|
|
<label class="form-control-label" for="field_password">Contraseña actual</label>
|
|
<input
|
|
type="password"
|
|
class="form-control"
|
|
name="password"
|
|
id="field_password"
|
|
data-cy="password"
|
|
formControlName="password"
|
|
placeholder="Su contraseña actual"
|
|
[readOnly]="isGoogle"
|
|
/>
|
|
|
|
<div
|
|
*ngIf="
|
|
passwordForm.get('password')!.invalid &&
|
|
(passwordForm.get('password')!.dirty || passwordForm.get('password')!.touched) &&
|
|
!isGoogle
|
|
"
|
|
>
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('password')?.errors?.required"
|
|
jhiTranslate="entity.validation.required"
|
|
>
|
|
This field is required.
|
|
</small>
|
|
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('password')?.errors?.minlength"
|
|
jhiTranslate="global.messages.validate.newpassword.minlength"
|
|
>
|
|
Your password is required to be at least 4 characters.
|
|
</small>
|
|
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('password')?.errors?.maxlength"
|
|
jhiTranslate="global.messages.validate.newpassword.maxlength"
|
|
>
|
|
Your password cannot be longer than 50 characters.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-2">
|
|
<div class="form-group w-100">
|
|
<label class="form-control-label" for="field_passwordNew">Contraseña nueva</label>
|
|
<input
|
|
type="password"
|
|
class="form-control"
|
|
name="passwordNew"
|
|
id="field_passwordNew"
|
|
data-cy="passwordNew"
|
|
formControlName="passwordNew"
|
|
placeholder="Contraseña nueva"
|
|
[readOnly]="isGoogle"
|
|
/>
|
|
<div
|
|
*ngIf="
|
|
passwordForm.get('passwordNew')!.invalid &&
|
|
(passwordForm.get('passwordNew')!.dirty || passwordForm.get('passwordNew')!.touched) &&
|
|
!isGoogle
|
|
"
|
|
>
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('passwordNew')?.errors?.required"
|
|
jhiTranslate="entity.validation.required"
|
|
>
|
|
This field is required.
|
|
</small>
|
|
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('passwordNew')?.errors?.minlength"
|
|
jhiTranslate="global.messages.validate.newpassword.minlength"
|
|
>
|
|
Your password is required to be at least 4 characters.
|
|
</small>
|
|
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('passwordNew')?.errors?.maxlength"
|
|
jhiTranslate="global.messages.validate.newpassword.maxlength"
|
|
>
|
|
Your password cannot be longer than 50 characters.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-4">
|
|
<div class="form-group w-100">
|
|
<label class="form-control-label" for="field_passwordNewConfirm">Confirmar contraseña nueva</label>
|
|
<input
|
|
type="password"
|
|
class="form-control"
|
|
name="passwordNewConfirm"
|
|
id="field_passwordNewConfirm"
|
|
data-cy="passwordNewConfirm"
|
|
formControlName="passwordNewConfirm"
|
|
placeholder="Contraseña nueva"
|
|
[readOnly]="isGoogle"
|
|
/>
|
|
<div
|
|
*ngIf="
|
|
passwordForm.get('passwordNewConfirm')!.invalid &&
|
|
(passwordForm.get('passwordNewConfirm')!.dirty || passwordForm.get('passwordNewConfirm')!.touched) &&
|
|
!isGoogle
|
|
"
|
|
>
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('passwordNewConfirm')?.errors?.required"
|
|
jhiTranslate="entity.validation.required"
|
|
>
|
|
This field is required.
|
|
</small>
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('passwordNewConfirm')?.errors?.minlength"
|
|
jhiTranslate="global.messages.validate.newpassword.minlength"
|
|
>
|
|
Your password is required to be at least 4 characters.
|
|
</small>
|
|
|
|
<small
|
|
class="form-text text-danger"
|
|
*ngIf="passwordForm.get('passwordNewConfirm')?.errors?.maxlength"
|
|
jhiTranslate="global.messages.validate.newpassword.maxlength"
|
|
>
|
|
Your password cannot be longer than 50 characters.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<button
|
|
*ngIf="!isGoogle"
|
|
type="button"
|
|
id="cancel-save"
|
|
data-cy="entityCreateCancelButton"
|
|
class="ds-btn ds-btn--secondary"
|
|
(click)="previousState()"
|
|
>
|
|
<fa-icon icon="arrow-left"></fa-icon> <span jhiTranslate="entity.action.cancel">Cancel</span>
|
|
</button>
|
|
|
|
<button
|
|
*ngIf="!isGoogle"
|
|
type="submit"
|
|
id="save-entity"
|
|
data-cy="entityCreateSaveButton"
|
|
[disabled]="passwordForm.invalid || isSaving"
|
|
class="ds-btn ds-btn--primary"
|
|
>
|
|
<span jhiTranslate="entity.action.save">Save</span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|