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

<ion-header class=" bg-blue ion-no-border">
  <div class="profile-header width-100">
    <div class="div-logo d-md-none width-40">
      <div class="logo-icon" *ngIf="hideImage">
        <img *ngIf="ThemeService.currentTheme == 'default' " src='assets/images/logo-no-bg.png' alt='logo'>
        <img *ngIf="ThemeService.currentTheme == 'gov' " src='assets/images/theme/gov/governoangola_A.png' alt='logo'>
        <img *ngIf="ThemeService.currentTheme == 'tribunal' " src='assets/images/theme/tribunal/tribunal-constitucional.png' alt='logo'>
      </div>
      <div *ngIf="ThemeService.currentTheme == 'gov'" class="logo-description d-flex align-center justify-content-center">
        <div class="logo-description-content">
          <!-- <p class="logo-description-text">Calendário Partilhado</p> -->
          <p class="logo-description-text tp-5">GABINETE DIGITAL</p>
          <div class="add-line"></div>
        </div>
      </div>
      <div *ngIf="ThemeService.currentTheme == 'default'" class="logo-description d-flex align-center justify-content-center">
        <div class="logo-description-content">
          <!-- <p class="logo-description-text color-white">Calendário Partilhado</p> -->
          <p class="logo-description-text tp-5 color-white">GABINETE DIGITAL</p>
          <div class="add-line-white"></div>
        </div>
      </div>
    </div>
    <div class="btn-close d-flex cursor-pointer" *ngIf="hideImage" (click)="close()">
      <ion-icon *ngIf="ThemeService.currentTheme == 'default' "class="icon" src="assets/images/icons-search-close.svg"></ion-icon>
      <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="icon" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
    </div>
  </div>
</ion-header>
<ion-header class=" bg-blue ion-no-border">
  <div class="profile-content">

    <div class="profile-title d-flex justify-content-center width-100">
      <ion-label >{{loggeduser.RoleDescription}}</ion-label>
    </div>

    <div class="d-flex mt-10 width-100">
      <ion-buttons slot="start" class="buttonSize" >
        <button (click)="logout()" class="btn-delete" fill="clear" >
          <ion-label style="color:#d30a0a;">Terminar sessão</ion-label>
        </button>
        <button (click)="editProfile()" class="btn-cancel" fill="clear" color="#fff" >
          <ion-label>Editar Perfil</ion-label>
        </button>
      </ion-buttons>
    </div>
    <div class="line"></div>
    <ion-label (click)="asyncNotification()" *ngIf="notificationdata">{{notificationdata.length}} novas notificações</ion-label>
    <ion-label (click)="asyncNotification()" *ngIf="!notificationdata">0 novas notificações</ion-label>
  </div>
</ion-header>

<ion-content class=" bg-blue">
  <div class="d-flex flex-column height-100 overflow-y-auto">

    <div class="notifications-content height-100">

      <ion-list>
        <div class="item cursor-pointer ion-no-padding ion-no-margin" lines="none"
        *ngFor = "let item of notificationdata; let i = index"
        (click)="notificatinsRoutes(item.index,item.Service,item.Object,item.IdObject,item.FolderId)"
        >
            <div class="item-conten-{{item.Service}}-{{item.TypeAgenda}}-{{item.Role}}">
              <div class="notification-item">
                <img class="notification-icon" slot="end" *ngIf = "item.Service == 'agenda'"  src="assets/images/icons-default-agenda.svg" >
                <img class="notification-icon" slot="end" *ngIf = "item.Service == 'gabinete-digital'"  src="assets/images/icons-correspondencias.svg" >
                <img class="notification-icon" slot="end" *ngIf = "item.Service == 'accoes'"  src="assets/images/icons-nav-accoes-active.svg" >
                <img class="notification-icon" slot="end" *ngIf = "item.Service == 'chat'"  src="assets/images/icons-nav-agenda-active.svg" >
              </div>
              <div class="approve-event-time">
                <p *ngIf = "item.Service == 'agenda'">{{item.dateInit}}</p>
                <p *ngIf = "item.Service == 'agenda'">{{item.dateEnd}}</p>
              </div>
              <div class="approve-event-detail">
                <p *ngIf = "item.Service == 'agenda'">{{item.Location}}</p>
                <h3 id="profile-title">{{item.title}}</h3>
                <p id="profile-title" *ngIf = "item.Service != 'agenda'">{{item.body}}</p>
              </div>
              <!-- <div class="notification-label-MD-official" *ngIf = "item.Service == 'agenda' && item.TypeAgenda == 'official' && item.Role == '100000011'"   ></div>
              <div class="notification-label-MD-pessoal" *ngIf = "item.Service == 'agenda' && item.TypeAgenda == 'pessoal' && item.Role == '100000011'"   ></div>
              <div class="notification-label-PR-official" *ngIf = "item.Service == 'agenda' && item.TypeAgenda == 'official' && item.Role == '100000014'"   ></div>
              <div class="notification-label-PR-pessoal" *ngIf = "item.Service == 'agenda' && item.TypeAgenda == 'pessoal' && item.Role == '100000014'"   ></div> -->
            </div>
          </div>
      </ion-list>

    </div>

  </div>

</ion-content>