doneit-web/src/app/shared/agenda/view-event/view-event.page.html

<ion-header  class="ion-no-border">
  <ion-toolbar class="header-toolbar">
    <div class="main-header px-20" style="overflow: unset !important;">
      <div class="title-content d-flex"  >
        <div class="left">
          <button class="btn-no-color" (click)="close()">
            <ion-icon *ngIf="ThemeService.currentTheme == 'default' " slot="end" src='assets/images/icons-calendar-arrow-left.svg'></ion-icon>
            <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " slot="end" src='assets/images/theme/gov/icons-calendar-arrow-left.svg'></ion-icon>
          </button>
        </div>
        <div class="middle" (click)="openOptions()">
          <p class="title">{{loadedEvent.Subject}}</p>
        </div>

        <div class="div-icon d-flex align-base">
          <button class="btn-no-color" (click)="editEvent()">
            <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="edit" slot="end" src="assets/images/icons-edit.svg" ></ion-icon>
            <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="edit" slot="end" src="assets/images/theme/gov/icons-edit.svg" ></ion-icon>
          </button>
          <button class="btn-no-color" (click)="deleteEvent()">
            <ion-icon class="delete" name="trash-sharp"></ion-icon>
          </button>
        </div>

      </div>
    </div>
  </ion-toolbar>
</ion-header>

<ion-content>

  <div class="main-content">
    <div class="upper-content">
      <div class="content-location">

        <span class="date">{{loadedEvent.Location}}</span>

        <div *ngIf="loadedEvent.Organizer">
          
          <div *ngIf="eventsService.isMyEvent(loadedEvent) == false || sesseionStora.user.Profile =='PR'">
            <span class="label" *ngIf="loadedEvent.CalendarName == 'Oficial' " style="background-color: #99e47b;">{{loadedEvent.CalendarName}}</span>
            <span class="label" *ngIf="loadedEvent.CalendarName == 'Pessoal' " style="background-color: #958bfc;">{{loadedEvent.CalendarName}}</span>
          </div>

          <div *ngIf="eventsService.isMyEvent(loadedEvent) == true && sesseionStora.user.Profile !='PR'">
            <span class="label" *ngIf="loadedEvent.CalendarName == 'Oficial' "  style="background-color: #ffb703;">{{loadedEvent.CalendarName}}</span>
            <span class="label" *ngIf="loadedEvent.CalendarName == 'Pessoal' " style="background-color: #f05d5e;">{{loadedEvent.CalendarName}}</span>
          </div>
        </div>

      </div>
      <div class="content-details">
        <ion-label>
          <p>{{customDate}}</p>
          <p *ngIf="toDateString(loadedEvent.StartDate) == toDateString(loadedEvent.EndDate)">das {{loadedEvent.StartDate | date: 'HH:mm'}} às {{loadedEvent.EndDate | date: 'HH:mm'}}</p>
          <p *ngIf="toDateString(loadedEvent.StartDate) != toDateString(loadedEvent.EndDate)">{{loadedEvent.StartDate | date: 'd/M/yy' }} - {{ loadedEvent.StartDate | date: 'dd/M/yy'}} </p>
          <p *ngIf="loadedEvent.EventRecurrence">
            <span *ngIf="loadedEvent.EventRecurrence.Type == 0">Diário</span>
            <span *ngIf="loadedEvent.EventRecurrence.Type == 1">Semanal</span>
            <span *ngIf="loadedEvent.EventRecurrence.Type == 2">Mensal</span>
            <span *ngIf="loadedEvent.EventRecurrence.Type == 3">Anual</span>
            <span *ngIf="loadedEvent.EventRecurrence.Type == -1">(Não se repete)</span>            
          </p>

        </ion-label>
      </div>
    </div>
    <div class="line"></div>
    <div class="middle-content">
      <div *ngIf="loadedEvent.Attendees">
        <h5>Intervenientes</h5>
        <ion-item class="ion-no-margin ion-no-padding">
          <ion-label>
            <div *ngFor="let attendee of loadedEvent.Attendees">
              <p>{{attendee.Name}}</p>
            </div>
          </ion-label>
        </ion-item>
      </div>
      <div *ngIf="loadedEvent.Body.Text">
        <h5>Detalhes</h5>
        <ion-item lines="none" class="ion-no-margin ion-no-padding">
          <div [innerHTML]="loadedEvent.Body.Text"></div>
        </ion-item>
        <div class="line"></div>
      </div>
    </div>

    <div *ngIf="loadedEvent.Attachments" class="bottom-content width-100">
      <h5>Documentos Anexados</h5>
      <ion-list class="width-100">
        <li *ngFor="let attach of loadedEvent.Attachments; let i = index" class="width-100" lines="none" class="ion-no-margin ion-no-padding pa-0">
          <ion-label class="width-100 d-flex align-center">
            <p class="flex-grow-1 cursor-pointer" (click)="docIndex(i);LoadDocumentDetails()">
              <span class="attach-title-item d-block">{{attach.SourceName}}</span>
              <span class="span-left d-block">{{attach.Stakeholders}}</span>
            </p>

            <div class="d-flex pr-10 cursor-pointer" (click)="docIndex(i);LoadDocumentDetails()">
              <span class="span-right">{{ attach.CreateDate | date: 'dd-MM-yyyy HH:mm' }}</span>
            </div>

            <div (click)="docIndex(i);LoadDocumentDetails()" class="doc-options">
              <ion-icon *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-menu.svg"  ></ion-icon>
              <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-menu.svg"  ></ion-icon>
            </div>

          </ion-label>
        </li>
      </ion-list>
    </div>

  </div>

</ion-content>