<ion-header >
  <ion-toolbar  class="header-toolbar">
      <ion-title color="light">   {{ts.trPK('worklistMain','title')}}</ion-title>
      <ion-buttons slot="start">
        <nav-buttons backLink="/notification/homepage"></nav-buttons>
      </ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content>
      <div *ngIf="pInformation && pInformation != '' " class="tipsPadding">{{pInformation}}</div>

  <ion-card>
      <ion-card-header class="boxHdr">
          <div class="hrTitle"> {{ts.trPK('worklistMain','info')}} </div>
      </ion-card-header>
      <ion-card-content>
          <div>
              <ion-grid>
                  <ion-row>
                      <ion-col class="colBold">
                          <label for=""> {{ts.trPK('worklistMain','from')}} 
                            
                          </label>
                      </ion-col>
                      <ion-col>
                          <label for="">{{getPassNotificationDetails.FROM_USER}}</label>
                      </ion-col>
                  </ion-row>

                  <ion-row>
                      <ion-col class="colBold">
                          <label for="">{{ts.trPK('worklistMain','to')}} 
                          </label>
                      </ion-col>
                      <ion-col>
                          <label for=""> {{getPassNotificationDetails.TO_USER}}</label>
                      </ion-col>
                  </ion-row>

                  <ion-row>
                      <ion-col class="colBold">
                          <label for="">{{ts.trPK('worklistMain','sent')}} 
                          </label>
                      </ion-col>
                      <ion-col>
                          <label for="">{{getPassNotificationDetails.BEGIN_DATE}}</label>
                      </ion-col>
                  </ion-row>
                  <ion-row>
                      <ion-col class="colBold">
                          <label for="">{{ts.trPK('worklistMain','closed')}} 
                          </label>
                      </ion-col>
                      <ion-col>
                          <label for="">{{getPassNotificationDetails.END_DATE}}</label>
                      </ion-col>
                  </ion-row>
                  <ion-row>
                      <ion-col class="colBold">
                          <label for="">{{ts.trPK('worklistMain','id')}} 
                          </label>
                      </ion-col>
                      <ion-col>
                          <label for="">{{getPassNotificationDetails.NOTIFICATION_ID}}</label>
                      </ion-col>
                  </ion-row>
                  <ion-row *ngIf=" getPassNotificationDetails.RESPONDER != '' ">
                      <ion-col class="colBold">
                          <label for="">{{ts.trPK('worklistMain','responder')}} 
                            </label>
                      </ion-col>
                      <ion-col>
                          <label for="">{{getPassNotificationDetails.RESPONDER}} </label>
                      </ion-col>
                  </ion-row>

                  <ion-row>
                      <ion-col class="colBold">
                          <label for="">{{ts.trPK('worklistMain','subject')}}  </label>
                      </ion-col>
                      <ion-col>
                          <label for="">{{getPassNotificationDetails.SUBJECT}} </label>
                      </ion-col>
                  </ion-row>
                  <ion-row>
                      <ion-col class="greenTxt" col-4>
                          <button ion-button block class="notColBtn" (click)="openNotificationBody()">
                              <p>{{ts.trPK('worklistMain','notfDetails')}}  </p>
                              <ion-img class="serviceItemImg" src="../assets/imgs/details.png"></ion-img>
                          </button>
                      </ion-col>
                      <ion-col class="greenTxt" col-4>
                          <button ion-button block class="notColBtn" (click)="openActionHistory()">
                              <p>{{ts.trPK('worklistMain','actionHis')}}</p>
                              <ion-img class="serviceItemImg" src="../assets/imgs/actionHistory.png"></ion-img>
                          </button>
                      </ion-col>
                      <ion-col class="greenTxt" col-4>
                          <button ion-button block class="notColBtn" (click)="openSupportDocuments()">
                              <p>{{ts.trPK('worklistMain','suppDoc')}}</p>
                              <ion-img class="serviceItemImg" src="../assets/imgs/documents.png"></ion-img>
                          </button>
                      </ion-col>
                  </ion-row>
              </ion-grid>

          </div>
      </ion-card-content>
  </ion-card>
  <div>

        <!-- ATTRIBUTE_DISPLAY_NAME: "Note"
        ATTRIBUTE_FORMAT: "4000"
        ATTRIBUTE_NAME: "WF_NOTE"
        ATTRIBUTE_TYPE: "VARCHAR2" -->
        <div id="notificationDynamicFields">
        </div>
      <!-- <json-schema-form *ngIf="schemaNotific" [form]="schemaNotific" [(ngModel)]="notExampleJsonObject">
      </json-schema-form> -->
  </div>
  <ion-item *ngIf="notificationButtonRes?.length >0" class="requiredItem">
          <ion-label class="boldTxtNav">{{'actionHis, action' | translate}} </ion-label>
          <ion-select okText="{{ts.trPK('general','ok')}}" cancelText="{{ts.trPK('general','cancel')}}" [(ngModel)]="actionType" required >
            <ion-select-option value= "{{notificationButtons.BUTTON_ACTION}}" *ngFor="let notificationButtons of notificationButtonRes; let i=index;">{{notificationButtons.BUTTON_LABEL}}</ion-select-option>
          </ion-select>
        </ion-item>
  
</ion-content>
<ion-footer>
      <div class="centerDiv" >
          <ion-button color="customnavy" class="gridBtn" (click)="actionButton()"> {{ts.trPK('general','submit')}}</ion-button>
      </div>
      <div class="centerDiv" >
            <ion-button color="customnavy" class="gridBtn" (click)="nextNotfification()">{{'worklistMain, skip' | translate}}</ion-button>
        </div>
  </ion-footer>