doneit-web/src/app/pages/gabinete-digital/gabinete-digital.page.html

<ion-header class="ion-no-border">
  <app-header></app-header>
</ion-header>

<ion-content class="height-100">
  <ion-refresher  name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
    <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
    <ion-refresher-content>
    </ion-refresher-content>
  </ion-refresher>
  <div class="main-content d-flex height-100">

      <!-- Aside left -->
      <div class="aside-wrapper d-flex flex-column justify-center width-md-40 flex-grow-1 ">
        <div class="title-container">
          <ion-label class="title">Gabinete Digital</ion-label>
          <button class="btn-no-color btn-refresh" (click)="doRefresh($event)">
            <ion-icon class="title-icon" name="reload-circle"></ion-icon>
          </button>
        </div>
        
        <div class="aside overflow-y-auto d-flex  flex-wrap width-100">
          <div [class.active]="selectedElement == 'approval'" (click)="openEventsToApprovePage('MDGPR');selectedElement='approval'"  class="exp-card d-flex flex-column" *ngIf="loggeduser.Profile == 'MDGPR'" >
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-agenda.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Eventos para Aprovação</p>
            <p class="text-center exp-card-content">{{count_ev_md+count_ev_pr}} <span class="title1">Documentos</span></p>
          </div>

          <div [class.active]="selectedElement == 'Correspondence'" (click)="openExpedientListPage(); selectedElement='Correspondence'" class="exp-card d-flex flex-column justify-center" *ngIf="loggeduser.Profile == 'MDGPR'">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-correspondencia.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Correspondencia</p>
            <p class="text-center exp-card-content">{{count_exp_dailywork}} <span class="title1">Documentos</span></p>
          </div>

          <!-- <div  [class.active]="selectedElement == 'Pending'" (click)="openPendentesPage(); selectedElement='Pending'" class="exp-card d-flex flex-column justify-center" > -->
          <div  [class.active]="selectedElementF('Pending')" (click)="openPendentesPage(); selectedElement='Pending'" class="exp-card d-flex flex-column justify-center"  >
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-expediente-pendente.svg"></ion-icon>
            </div>
      
            <p class="text-center exp-card-title ">Pendentes</p>
            <p class="text-center exp-card-content"><span class="number">{{count_total_pending}} </span> <span class="title1">Documentos</span></p>
          </div>

          <div [class.active]="selectedElement == 'Dispatches'" class="exp-card d-flex flex-column justify-center" (click)="openDespachosPage(); selectedElement='Dispatches'">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-despachos-presidente.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Despachos</p>
            <p class="text-center exp-card-content">{{count_desp_dailywork}} <span class="title1">Documentos</span> </p>
          </div>

          <div [class.active]="selectedElement == 'RequestsForOpinion'" class="exp-card d-flex flex-column justify-center" (click)="openPedidosPage('parecer'); selectedElement='RequestsForOpinion'">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-expediente-parecer.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Pedidos de Parecer</p>
            <p class="text-center exp-card-content">{{count_par_dailywork}} <span class="title1">Documentos</span></p>
          </div>

          <div [class.active]="selectedElement == 'RequestForApproval'" class="exp-card d-flex flex-column justify-center" (click)="openPedidosPage('deferimento'); selectedElement = 'RequestForApproval'">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-expediente-deferimento.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Pedidos de Deferimento</p>
            <p class="text-center exp-card-content">{{count_def_dailywork}} <span class="title1">Documentos</span></p>
          </div>

          <div (click)="openExpedientesPrPage(); selectedElement = 'Expediente Presidente'" [class.active]="selectedElement == 'Expediente Presidente'" class="exp-card d-md-flex d-none flex-column justify-center white-background">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-expediente-presidente.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Expediente Presidente</p>
            <p class="text-center exp-card-content"><span class="number">{{count_exp_pr}}</span> <span class="title1">Documentos</span></p>
          </div>

          <div (click)="openDespachosPrPage(); selectedElement='DispatchesPr'" [class.active]="selectedElement == 'DispatchesPr'" class="exp-card d-md-flex d-none flex-column justify-center" *ngIf="loggeduser.Profile == 'MDGPR'">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-despachos-presidente.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Despacho do Presidente da República</p>
            <p class="text-center exp-card-content"><span class="number">{{ count_de_pr }}</span> <span class="title1">Documentos</span> </p>
          </div>

          <div (click)="openExpedientesPrPage(); selectedElement='ExpedientesPr'" [class.active]="selectedElement == 'ExpedientesPr'" class="exp-card-long justify-center width-100">
            <div class="center-div">
              <div class="exp-card-icon">
                <ion-icon  src="assets/images/icons-expediente-presidente.svg"></ion-icon>
              </div>
              <div class="exp-card-text">
                <p class="exp-card-title ">Expediente Presidente</p>
                <p class="exp-card-content"><span class="number">-</span> <span class="title1">Documentos</span> </p>
              </div>
            </div>
          </div>

          <div (click)="openDespachosPrPage(); selectedElement='showDespachosPr'" [class.active]="selectedElement == 'showDespachosPr'" class="exp-card-long width-100" *ngIf="loggeduser.Profile == 'MDGPR'">
            <div class="center-div">
              <div class="exp-card-icon">
                <ion-icon  src="assets/images/icons-despachos-presidente.svg"></ion-icon>
              </div>
              <div class="exp-card-text">
                <p class="text-center exp-card-title">Despacho do Presidente da República</p>
                <p class="text-center exp-card-content"><span class="number">{{ count_de_pr }}</span> <span class="title1">Documentos</span> </p>
              </div>
            </div>
          </div>

          <div (click)="openDiplomasPage(); selectedElement='DiplomasPorAssinar'" [class.active]="selectedElement == 'DiplomasPorAssinar'" class="exp-card d-flex flex-column justify-center">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-expediente-diploma.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Diplomas por Validar</p>
            <p class="text-center exp-card-content"><span class="number">-</span> <span class="title1">Documentos</span> </p>
          </div>

          <div (click)="openDiplomasPage(); selectedElement='DiplomasAssinados'" [class.active]="selectedElement == 'DiplomasAssinados'" class="exp-card d-flex flex-column justify-center" *ngIf="loggeduser.Profile == 'MDGPR'">
            <div class="d-flex justify-center">
              <ion-icon  src="assets/images/icons-diplomas-assinados-presidente.svg"></ion-icon>
            </div>
            <p class="text-center exp-card-title ">Diplomas assinaldos PR</p>
            <p class="text-center exp-card-content"><span class="number">-</span> <span class="title1">Documentos</span> </p>
          </div>

        </div>

      </div>

      <!-- Aside right -->
      <div class="aside-content d-none flex-column height-100">
        
        <app-empty-container [texto]="emptyTextDescription" *ngIf="showEmptyContainer" class="d-flex height-100 flex-column"></app-empty-container>
        <app-events-to-approve [profile]="'MDGPR'" *ngIf="showEventsToApprove" class="d-flex height-100 flex-column"></app-events-to-approve>
        
        <app-expedients (openExpedientDetail)="openExpedientPage($event)" [profile]="profile" class="d-flex height-100 flex-column" *ngIf="showExpedients"></app-expedients>
        <app-expediente (openExpedientList)="openExpedientListPage()" [profile]="profile" [serialNumber]="serialNumber" class="d-flex height-100 flex-column" *ngIf="showExpedientDetail"></app-expediente>
        <app-pedidos (openPedido)="openExpedientPage($event)" [profile]="profile" [segment]="segment" [serialNumber]="serialNumber" class="d-flex height-100 flex-column" *ngIf="showPedidos"></app-pedidos>
        <app-despachos (openExpedientDetail)="openExpedientPage($event)" [profile]="profile" class="d-flex height-100 flex-column" *ngIf="showDespachos"></app-despachos>
        <app-despachos-pr (openExpedientDetail)="openExpedientPage($event)" [profile]="profile" class="d-flex height-100 flex-column" *ngIf="showDespachosPr"></app-despachos-pr>
        <app-pendentes (openExpedientDetail)="openExpedientPage($event)" [profile]="profile" class="d-flex height-100 flex-column" *ngIf="showPendentes"></app-pendentes>
        <app-diplomas (openExpedientDetail)="openExpedientesPrPage($event)" [profile]="profile" [segment]="segment" class="d-flex height-100 flex-column" *ngIf="showDiplomas"></app-diplomas>
        <app-expedientes-pr (openExpedientDetail)="openExpedientPage($event)" [profile]="profile" class="d-flex height-100 flex-column" *ngIf="showExpedientesPr"></app-expedientes-pr>
    
      </div>
  </div>
</ion-content>