<ion-header>
<ion-toolbar color="primary">
  <ion-buttons slot="start">
    <ion-menu-button></ion-menu-button>
  </ion-buttons>
  <ion-title>{{'contracts.header' | translate}}</ion-title>
</ion-toolbar>
</ion-header>
<ion-tabs>
  <ion-tab-bar slot="bottom">

    <ion-tab-button tab="pending">
      <ion-icon name="information-circle"></ion-icon>
      <ion-label>{{'contracts.header_1' | translate}}</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="contracted">
      <ion-icon name="checkmark-circle"></ion-icon>
      <ion-label>{{'contracts.header_2' | translate}}</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="finished">
      <ion-icon name="archive"></ion-icon>
      <ion-label>{{'contracts.header_3' | translate}}</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="reported">
      <ion-icon name="flag"></ion-icon>
      <ion-label>{{'contracts.header_4' | translate}}</ion-label>
    </ion-tab-button>

  </ion-tab-bar>
</ion-tabs>
