<ion-header>
  <ion-toolbar class="header-toolbar-new">
    <nav-buttons></nav-buttons>
    <ion-title color="light">
      {{ts.trPK('worklistMain','ITEM_HIS')}}
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content class="colorBG">

  <!-- <ion-card>
    <ion-card-header class="boxHdr">
      <div class="hrTitle">{{'worklistMain, actionHis' | translate}}</div>
    </ion-card-header>
    <ion-card-content> -->


  <!-- <ion-card class="cardContent"> -->
  <!-- <ion-card-header class="boxHdr">
                <div class="hrTitle"> {{ts.trPK('worklistMain','info')}} </div>
            </ion-card-header> -->
  <!-- <ion-card-content> -->
      
  <div class="noDataDiv" [hidden]="itemHistoryRes && itemHistoryRes.length > 0">
    <p>{{ 'general, empty' | translate}}</p>
  </div>
  <ion-list class="itemeHistoryist" *ngIf="itemHistoryRes && itemHistoryRes.length > 0 ">
      <ion-grid class="gridItemReq">

        <ion-item class="itemReqContent" *ngFor="let itemHistory of itemHistoryRes; let i=index; ">
          <div class="itemReqDiv">

            
           <!-- // <ion-row> -->
             <!-- <ion-col class="colItemReqHeader"> -->
                <!-- <label for="">{{ts.trPK('worklistMain','description')}}
                                </label> -->
                <!-- </ion-col>
                            <ion-col> {{itemHistory.OU_NAME}}-->
                <!-- <label for="">{{i+1}}.  </label> -->
              <!-- </ion-col> -->
            <!-- </ion-row> -->
            <ion-row class="rowBorder">
              <ion-col size="6" class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','request_number')}}
                </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.REQUEST_NUMBER}} </ion-label>
              </ion-col>
              <!-- </ion-row>

                        <ion-row> -->

              <ion-col size="6" class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','uom')}} </label>
                <br />
                <!-- </ion-col>
                                <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.UNIT_OF_MEASURE}} </ion-label>
              </ion-col>
            </ion-row>
            <ion-row class="rowBorder">

              <ion-col size="6" class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','quantity')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.QUANTITY}} </ion-label>
              </ion-col>
              <!-- </ion-row>
                        <ion-row> -->

              <ion-col size="6"class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','Date_Req')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.DATE_REQUIRED}} </ion-label>

              </ion-col>
            </ion-row>
            <ion-row class="rowBorder">


              <ion-col size="6" class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','line_status')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.LINE_STATUS_DIS}} </ion-label>
              </ion-col>

              <!-- </ion-row>
                        <ion-row> -->

              <ion-col size="6" class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','date_status')}} </label>
                <br />
                <!-- </ion-col>
                                <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.STATUS_DATE}} </ion-label>
              </ion-col>

            </ion-row>
            <ion-row class="rowBorder">


              <ion-col size="6" class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','trans_type')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.TRANSACTION_TYPE_NAME}} </ion-label>
              </ion-col>

              <!-- </ion-row>
                        <ion-row> -->

              <ion-col size="6" class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','organization')}} </label>
                <br />
                <!-- </ion-col>
                                <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.ORGANIZATION_NAME}} </ion-label>
              </ion-col>

            </ion-row>
            <ion-row class="rowBorder">


              <ion-col size="6" class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','organization_code')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.ORGANIZATION_CODE}} </ion-label>
              </ion-col>

              <!-- </ion-row>
                        <ion-row> -->

              <ion-col size="6" class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','operating_unit')}} </label>
                <br />
                <!-- </ion-col>
                                <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.OPERATING_UNIT_NAME}} </ion-label>
              </ion-col>

            </ion-row>
            <ion-row class="rowBorder">


              <ion-col size="6" class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','from_subinventory')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.FROM_SUBINVENTORY_CODE}} </ion-label>
              </ion-col>

              <!-- </ion-row>
                        <ion-row> -->

              <ion-col size="6" class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','from_locator')}} </label>
                <br />
                <!-- </ion-col>
                                <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.FROM_LOCATOR}} </ion-label>
              </ion-col>

            </ion-row>
            <ion-row class="rowBorder">


              <ion-col size="6" class="colItems" [ngClass]=" direction === 'en' ? 'colBorder' :'colBorder-ar' ">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','to_subinventory')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.TO_SUBINVENTORY_CODE}} </ion-label>
              </ion-col>

              <!-- </ion-row>
                        <ion-row> -->

              <ion-col size="6" class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','to_locator')}} </label>
                <br />
                <!-- </ion-col>
                                <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.TO_LOCATOR}} </ion-label>
              </ion-col>

            </ion-row>
            <ion-row>


              <ion-col  class="colItems">
                <label class="colItemReq" for="">{{ts.trPK('worklistMain','ShipToLocation')}} </label>
                <br />
                <!-- </ion-col>
                            <ion-col> -->
                <ion-label class="labelValue" for="">{{itemHistory.SHIP_TO_LOCATION}} </ion-label>
              </ion-col>


            </ion-row>
          </div>

        </ion-item>

      </ion-grid>
  </ion-list>
  <!-- </ion-card-content> 
             </ion-card> -->

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