doneit-web/src/app/shared/gabinete-digital/events-to-approve/events-to-approve.page.html

<ion-header>
  <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
  <div class="title width-100">
    <div class="title-container d-flex justify-space-between">
      <span class="text-center mt-0 aside-title px-20"><label>Eventos para Aprovação</label></span>
      <div class="d-flex">

        <div>
          <div title="Pesquisa" *ngIf="!hideSearchBtn" class="mr-20 d-flex align-center cursor-pointer">
            <div (click)="openSearch();showSearch=true" *ngIf="!showSearch" class="d-flex">
              <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'doneIt' " class="font-35" src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
              <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'default' " class="font-35" src='assets/images/icons-search.svg'></ion-icon>
              <ion-icon title="Perfil" *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" src='assets/images/theme/gov/icons-search.svg'></ion-icon>
            </div>
            <button title="Fechar" class="btn-no-color d-flex" (click)="closeSearch();showSearch=false;searchSubject=''" *ngIf="showSearch">
              <ion-icon *ngIf="ThemeService.currentTheme == 'default' || ThemeService.currentTheme == 'doneIt' " class="font-35" name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
              <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="font-35" name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
            </button>
  
            <div *ngIf="showSearch">
              <div class="d-flex search-input-container ml-10 justify-between" *ngIf="showSearch">
                <!-- <div class="icon" (click)="basicSearch()">
                  <ion-icon class="icon-z" slot="end" name="search"></ion-icon>
                </div> -->
                <div class="input-text d-flex ion-align-items-center">
                  <ion-input (keyup.enter)="basicSearch()" [(ngModel)]='searchSubject' (ngModelChange)="dynamicSearch()"
                    class="search-input text-black" type="search" placeholder="Pesquisar"></ion-input>
                </div>
                
                <!-- <div class="icon" (click)="clearSearchInput()">
                  <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'default' "name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
                  <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'doneIt' "name="restaurant-outline"  src="assets/images/theme/doneIt/icons-search.svg"></ion-icon>
                  <ion-icon title="Limpar" *ngIf="ThemeService.currentTheme == 'gov' " name="restaurant-outline" src="assets/images/theme/gov/icons-search-close.svg"></ion-icon>
                </div> -->
                <div (click)="basicSearch()"  class="d-flex align-center icon">
  
                  <ion-icon  class="icon-z" slot="end" src="assets/images/theme/gov/search.svg"></ion-icon>
      
                </div>
              </div>
            </div>
          </div>
        </div>

        <mat-form-field class="task-filter-input" appearance="none"   color="ion-color-secondary"  placeholder="Selecione agenda">
          <mat-select [(value)]="filterName">
  
            <mat-option value="Para hoje" >
              Para hoje
            </mat-option>
  
            <mat-option value="Novos" >
              Novos
            </mat-option>
  
            <mat-option value="Lidos" >
              Lidos
            </mat-option>
  
            <mat-option value="Não lidos" >
              Não lidos
            </mat-option>
  

            <mat-option value="OverdueTasks">
              Em atraso
            </mat-option>

            <mat-option value="Todos" >
              Todos
            </mat-option>
  
          </mat-select>
        </mat-form-field>
      </div>

    </div>
    <ion-toolbar>
      <ion-segment [(ngModel)]="segment" (ionChange)="segmentChanged($event)">
        <!-- <ion-segment-button value="MDGPR">
          Minha agenda
        </ion-segment-button> -->

        <ion-segment-button *ngFor="let calendars of eventService.calendarNamesAry; let i  index"  [value]="i === 'Meu calendario' ? 'Meu calendario' : i.OwnerUserId">
          <div *ngIf="calendars == 'Meu calendario'"> Minha agenda </div>
          <div *ngIf="calendars != 'Meu calendario' && calendars.Role == 'Presidente da República'">{{ environment.agendaPR }}</div>
          <div *ngIf="calendars != 'Meu calendario' && calendars.Role == 'Ministro e Director do Gabinete do PR'"> environment.agendaVP </div>
          <div *ngIf="calendars != 'Meu calendario' && calendars.Role != 'Ministro e Director do Gabinete do PR' && calendars.Role != 'Presidente da República'"> Agenda do {{calendars.Fullname }} </div>
        </ion-segment-button>
      </ion-segment>
    </ion-toolbar>
   </div>
</ion-header>
<ion-content>
  <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
     <ion-refresher-content>
    </ion-refresher-content>
  </ion-refresher>
  <div class="main-content overflow-y-auto height-100" >

    <div  class="height-100">

      <div >

        <ion-list class="width-100" >
          <div
            class="item-hover ion-no-padding ion-no-margin cursor-pointer"
            *ngFor="let event of eventoaprovacaostore.get(segment)"
            (click)="goToEventDetail(event)"
          >
            <div class="expediente" *ngIf="TaskService.filter(event, filterName)">
              <!-- (click)="openApproveModal(event)" -->
              <div class="event-{{color}}-{{event.workflowInstanceDataFields.Agenda}} width-100 d-flex">
                <div class="approve-event-time">
                  <p>{{event.workflowInstanceDataFields.StartDate | date: 'HH:mm'}}</p>
                  <p>{{event.workflowInstanceDataFields.EndDate | date: 'HH:mm'}}</p>
                </div>
                <div class="approve-event-detail">
                  <div class="p" *ngIf="toDateString(event.workflowInstanceDataFields.StartDate) != toDateString(event.workflowInstanceDataFields.EndDate)">{{event.workflowInstanceDataFields.StartDate | date: 'd/M/yy' }} - {{ event.workflowInstanceDataFields.EndDate | date: 'dd/M/yy'}}  |  {{event.workflowInstanceDataFields.Location}}</div>
                  <div class="p" *ngIf="toDateString(event.workflowInstanceDataFields.StartDate) == toDateString(event.workflowInstanceDataFields.EndDate)">{{event.workflowInstanceDataFields.StartDate | date: 'd/M/yy' }}  |  {{event.workflowInstanceDataFields.Location}}</div>
                  <div class="h3">{{event.workflowInstanceDataFields.Subject}}</div>
                </div>
                <div>
                  <span class="dead-line ml-10" *ngIf="TaskService.deadlineIsToday(event.deadline)">Para hoje</span>
                  <span class="new-task ml-10" *ngIf="TaskService.lessThen24Hours(event.taskReceiveDate)">Nova</span>
                </div>
              </div>
            </div>
          </div>
        </ion-list>
      </div>

      <div  *ngIf="eventoaprovacaostore.get(segment)" class="centered-div">

        <div *ngIf="eventoaprovacaostore.get(segment).length == 0">
          <div >
            <div class="d-flex height-90 align-center justify-content-center"
              >
              Lista vazia
            </div>
          </div>
        </div>
      </div>
  </div>

</div>

</ion-content>