Ontica/Empiria.Land.Intranet

<form [formGroup]="form" empNgFormKeyDownEnter autocomplete="off"
  class="form-section">

  <div class="fx-column-container" [style.margin-right.px]="-8">

    <div class="fx-column-container fx-gap-three-quarter">

      <div class="fx-item">
        <label for="userID">Usuario de firma electrónica:</label>
        <input type="text" id="userID" name="userID" autocomplete="off" class="text-box"
          formControlName="userID"
          [class.invalid-control]="form.controls.userID.invalid && form.controls.userID.touched">
      </div>

      <div class="fx-item">
        <label for="password">Contraseña de firma electrónica:</label>
        <input [type]="showPassword ? 'text' : 'password'"
          id="password" name="password" autocomplete="one-time-code" class="text-box"
          formControlName="password"
          [class.invalid-control]="form.controls.password.invalid && form.controls.password.touched">
      </div>

    </div>


    <div class="fx-item-none">

      <mat-checkbox
        [checked]="showPassword"
        (click)="$event.stopPropagation"
        (change)="onToggleShowPasswordClicked()">
        Mostrar contraseña
      </mat-checkbox>

    </div>

    <div *ngIf="exceptionMsg" class="inline-error"
      [style.marginTop.px]="8"
      [style.marginBottom.px]="0">
      {{exceptionMsg}}
    </div>


    <mat-divider class="horizontal">

    </mat-divider>


    <div  class="fx-row-container fx-end fx-items-center">

      <div class="fx-item-none">

        <button type="sumbit"
          [class.btn]="!formHelper.isFormReady(form)"
          [class.btn-action]="formHelper.isFormReady(form)"
          [style.marginRight.px]="8"
          (click)="onExecuteOperationClicked()">
          {{buttonText}}
        </button>

      </div>

    </div>

  </div>

</form>