<ion-header>
<ion-toolbar color="primary">
  <ion-buttons slot="start">
    <ion-menu-button></ion-menu-button>
  </ion-buttons>
  <ion-title>Contratos</ion-title>
</ion-toolbar>
</ion-header>
<ion-content class="ion-padding">
<h2 class="ion-text-capitalize" style="padding-bottom: 0.5em">Reagendados</h2>
  <ng-container *ngFor="let ccontract of ccontracts; let i = index">
    <ion-card *ngIf="ccontract.status==2">
      <ion-item>
        <ion-label>
          <h2 class="ion-text-capitalize">{{ ccontract.category }}</h2>
          <p class="ion-text-wrap">{{ ccontract.address }}</p>
          <p class="ion-text-wrap ion-text-capitalize">{{ ccontracts_dates[i] }}</p>
          <p class="ion-text-wrap ion-text-capitalize">Proveedor: {{ ccontract.supplier }}</p>
          <p>Monto: ${{ ccontract.amount }}</p>
          <p *ngIf="ccontract.time_limit < 10" class="ion-text-wrap">Código de inicio de servicio: ${{ ccontract.code }} (Por favor, dar este código
            al proveedor para iniciar el servicio)</p>
        </ion-label>
        <ion-button style="height: 3em; padding-left: 0.5em;" color="danger">Cancelar<br>contrato</ion-button>
      </ion-item>
    </ion-card>
  </ng-container>
</ion-content>
