doneit-web/src/app/pages/publications/publications.page.html

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

<ion-content>
  <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>

  <!-- Main container -->
  <div class="main-content d-flex  height-100 background-white overflow-hidden border-t-radius ">
    <!-- Left -->
    <div class="aside-left app-default-padding d-flex flex-grow-1 flex-column aside max-width-md-35">
      <!-- Header -->
      <ion-toolbar >
        <div class="main-header">
          <div class="title-content">
            <div class="div-title">
              <ion-label class="title">Acções Presidenciais</ion-label>
            </div>
            <div class="div-icon">
              <ion-icon (click)="AddPublicationFolder()" slot="end" src='assets/images/icons-add.svg'></ion-icon>
              <ion-icon (click)="doRefresh($event)" slot="icon-only" class="title-icon" name="reload-circle" title="Actualizar"></ion-icon>
            </div>
          </div>
        </div>
      </ion-toolbar>
      <!-- Content -->
  
      <div class="main-content overflow-auto-y">
        <div class="item d-flex" 
          *ngFor="let viagem of publicationsTravelFolderList"
          (click)="viewPublications(viagem.ProcessId)">
          <div class="item-icon">
            <ion-icon slot="end" src='assets/images/icons-plane-active.svg'></ion-icon>
          </div>
          <div class="item-content">
              <p class="item-content-date my-5">De {{viagem.DateBegin}} a {{viagem.DateEnd}}</p>
              <p class="item-content-title my-10">{{viagem.Description}}</p>
              <p class="item-content-detail my-5">{{viagem.Detail}}</p>
          </div>
        </div>
        <div class="item width-100"
          *ngFor="let evento of publicationsEventFolderList"
          (click)="viewPublications(evento)">
          <div class="item-icon2">
            <ion-icon slot="end" src='assets/images/icons-nav-actions.svg'></ion-icon>
          </div>
          <div class="item-content">
            <ion-label>
              <p class="item-content-date">{{evento.DateBegin}}</p>
              <p class="item-content-title">{{evento.Description}}</p>
            </ion-label>
          </div>
        </div>
      </div>  
    </div>

    <!-- Right -->
    <div class="content d-none d-md-flex flex-grow-1 flex-column max-width-65 max-width-md-60">

      <div class="width-100 height-100 d-flex align-center justify-center" 
        *ngIf="(
          desktopComponent.showViewPublication == false &&
          desktopComponent.showAddNewPublication == false &&
          desktopComponent.showPublicationDetail == false &&
          desktopComponent.showAddActions == false
        )"><div>Nenhuma ação presidencial selecionada</div></div>
     
      <!-- View Publication -->
      <app-view-publications 
        *ngIf="desktopComponent.showViewPublication"
        [folderId]="folderId"
        class="height-100 d-flex flex-column overflow-hidden flex-grow-1"
        (addNewPublication)="addNewPublication($event)"
        (openPublicationDetails)="openPublicationDetails($event)"
        (goBacktoPublicationDetails)="goBacktoPublicationDetails($event)"
        (goBackToViewPublications)="goBackToViewPublications($event)"
        (closeDesktopComponent)="closeDesktopComponent($event)"
      >
      </app-view-publications>

      <app-new-publication 
        *ngIf="desktopComponent.showAddNewPublication"
        class="height-100 d-flex flex-column overflow-hidden background-white flex-grow-1"
        [folderId]="folderId"
        [publicationType]="publicationType"
        [publicationId]="publicationId"
        
        (closeDesktopComponent)="closeDesktopComponent($event)"
        (goBacktoPublicationDetails)="goBacktoPublicationDetails($event)"
        (goBackToViewPublications)="goBackToViewPublications($event)"
      >
      </app-new-publication>

      <app-publication-detail-shared
        *ngIf="desktopComponent.showPublicationDetail"
        class="height-100 d-flex flex-column overflow-hidden background-white flex-grow-1"
        [publicationId]="publicationId"
        [folderId]="folderId"
        (addNewPublication)="addNewPublication($event)"
        (closeDesktopComponent)="closeDesktopComponent($event)"
        (goBacktoPublicationDetails)="goBacktoPublicationDetails($event)"
        (goBackToViewPublications)="goBackToViewPublications($event)"
      ></app-publication-detail-shared>

      <app-new-action
        *ngIf="desktopComponent.showAddActions"
        class="height-100 d-flex flex-column overflow-hidden background-white flex-grow-1"
        (closeDesktopComponent)="closeDesktopComponent($event)"
      ></app-new-action>

    </div>

  </div>

  
</ion-content>