<ion-header >
  <ion-toolbar  class="header-toolbar">
      <ion-title color="light">   {{ts.trPK('home','worklist')}}</ion-title>
      <ion-buttons slot="start">
        <nav-buttons backLink="/home"></nav-buttons>
      </ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content [ngClass]=" direction == 'ltr' ? 'left' : 'right'">
  <!-- first select type view  -->
  <ion-item>
    <ion-label>{{ts.trPK('worklist','view')}}</ion-label>
    <ion-select okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}" [(ngModel)]="notificationType"
      (ionChange)=onChangeView($event)>
      <ion-select-option value="1" selected="true">{{ts.trPK('worklist','openNot')}}</ion-select-option>
      <ion-select-option value="2">{{ts.trPK('worklist','fyi')}}</ion-select-option>
      <ion-select-option value="3">{{ts.trPK('worklist','toDo')}}</ion-select-option>
      <ion-select-option value="4">{{ts.trPK('worklist','all')}}</ion-select-option>
      <ion-select-option value="5">{{ts.trPK('worklist','meNot')}} </ion-select-option>
    </ion-select>

  </ion-item>

  <ion-item>
    <ion-label>{{ts.trPK('worklist','searchby')}}</ion-label>
    <ion-select  okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}" [(ngModel)]="searchBy"
      (ionChange)="getValueSelected($event)">
      <ion-select-option value="1">{{ts.trPK('worklist','from')}}</ion-select-option>
      <ion-select-option value="2">{{ts.trPK('worklist','subject')}}</ion-select-option>
      <ion-select-option value="3">{{ts.trPK('worklist','sent')}}</ion-select-option>
      <ion-select-option value="4">{{ts.trPK('worklist','itemType')}}</ion-select-option>
      <ion-select-option value="5">{{ts.trPK('worklist','none')}}</ion-select-option>

    </ion-select>
  </ion-item>


  <div *ngIf="HideDateInput==true">
    <ion-item>
      <ion-label>{{ts.trPK('worklist','sent')}} </ion-label>
      <ion-datetime  placeholder="{{ts.trPK('worklist','enter')}}" displayFormat="DD-MMM-YYYY" pickerFormat="DD-MMM-YYYY"
        [(ngModel)]="InputDate"></ion-datetime>
    </ion-item>
  </div>
  <div *ngIf="HideTextInput==true">
    <ion-item>
      <ion-input placeholder="{{ts.trPK('worklist','enter')}}" [(ngModel)]="inputSearch">
      </ion-input>
    </ion-item>
  </div>

  <ion-list class="notification-list ">
    <div class="timeline">
      <ion-item *ngFor="let notificationList of WorkListResObj">

        <div class="timeline-item" slot="start">
          <!-- <div class="item-date"> {{notificationList.BEGIN_DATE }} </div> -->

          <div class="item-date"> {{notificationList.BEGIN_DATE | dateString }} </div>
          <div class="timeline-thumb bg-color-dot timeline-icon">
          </div>
        </div>

        <ion-label (click)="openNotificationDetail(notificationList)"> {{notificationList.SUBJECT}}
        </ion-label>

      </ion-item>
    </div>
  </ion-list>

  <!-- *ngIf="rowsNo <= noOfrows" -->

  <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content></ion-infinite-scroll-content>
  </ion-infinite-scroll>



</ion-content>
<ion-footer>
  <div class="centerDiv">

    <ion-button color="customnavy"   (click)="getAllPushNotificationFun()">{{ts.trPK('worklist','search')}}</ion-button>
  </div>
</ion-footer>