doneit-web/src/app/modals/profile/edit-profile/edit-profile.page.html

<ion-content class=" bg-blue">
  <div class="main-content width-100 overflow-y-auto height-100">
    <div class="profile-header width-100">
      <div class="div-logo d-md-none">
        <div class="logo height-fit-content">
          <img class="img" src='assets/images/logo-no-bg.png' alt='logo'>
        </div>
      </div>
      <div class="btn-close d-flex cursor-pointer" (click)="close()">
        <ion-icon class="icon" src="assets/images/icons-search-close.svg"></ion-icon>
      </div>
    </div>
    <div class="profile-content overflow-y-auto width-100 height-100">
      <div class="profile-title d-flex justify-space-between align-center width-100">
        <div class="d-flex align-center">
          <div>Dados do perfil</div>
        </div>

        <!-- <div class="d-flex " (click)="close()">
          <ion-icon class="icon" src="assets/images/icons-search-close.svg"></ion-icon>
        </div> -->
      </div>

      <div >
        <div class="d-flex align-center">
          <ion-icon  class="profile-pic"  src="assets/images/icons-default-profile.svg"></ion-icon>
        </div>
      </div>

      <div class="profile-info">
        <div class="user-role">{{loggeduser.RoleDescription}}</div>

        <div class="container-div width-100">
          <div class="ion-item-class-2">
            <div class="ion-icon-class">
              <ion-icon slot="start" name="person"></ion-icon>
            </div>
            <div class="ion-input-class">
              <ion-input disabled placeholder="Nome" [(ngModel)]="loggeduser.FullName"></ion-input>
            </div>
          </div>
        </div>

        <div class="container-div width-100">
          <div class="ion-item-class-2">
            <div class="ion-icon-class">
              <ion-icon slot="start" name="mail"></ion-icon>
            </div>
            <div class="ion-input-class">
              <ion-input disabled placeholder="Email" [(ngModel)]="loggeduser.Email"></ion-input>
            </div>
          </div>
        </div>
      </div>

      <div hidden class="login-preference width-100" (mouseover)="checkState()" (click)="checkState()">
        <div class="preference">Preferência Login</div>

        <ion-row>
          <ion-col class="align-center d-flex">
            <div class="d-flex align-center"  (click)="LoginPreferenceMethod('pin')">
              <ion-checkbox [checked]="userLoginPreference=='pin' " class="checkBox" ></ion-checkbox>
              PIN
            </div>

          </ion-col>
          <ion-col class="align-center d-flex">
            <div (click)="addFingerprint()" class="d-flex align-center">
              <ion-checkbox class="checkBox" [checked]="false"></ion-checkbox>
              Impressão Digital
            </div>
          </ion-col>
        </ion-row>
      </div>

      <div hidden class="d-flex width-100 justify-center mt-10">
        <button hidden (click)="addPin()" class="btn-ok  buttonSize" fill="clear" color="#fff" >
          <ion-label>Alterar PIN</ion-label>
        </button>
      </div>
    </div>
  </div>
</ion-content>
<!--
  Para adicionar a funcionalidade assim que o método
  para alterar o nome e email estiver pronto
-->
<ion-footer hidden class=" footer-container ion-no-border bg-blue">

  <div class="d-flex justify-space-between">

    <ion-buttons slot="start" (click)="close()">
      <button class="btn-cancel" fill="clear" color="#061b52" >
        <ion-label>Cancelar</ion-label>
      </button>
      </ion-buttons>
      <ion-buttons slot="end" (click)="close()">
        <button class="btn-ok" fill="clear" color="#fff" >
          <ion-label>Gravar</ion-label>
        </button>
      </ion-buttons>
  </div>

</ion-footer>