Ontica/Empiria.Land.Intranet

<div class="section-title">Historia del trámite</div>

<div class="tab-container mat-elevation-z1">

  <table mat-table [dataSource]="dataSource">

    <ng-container matColumnDef="taskName">
      <th mat-header-cell *matHeaderCellDef> Tipo de movimiento </th>
      <td mat-cell *matCellDef="let row"> {{ row.taskName }} </td>
    </ng-container>
    <ng-container matColumnDef="assigneeName">
      <th mat-header-cell *matHeaderCellDef> Responsable </th>
      <td mat-cell *matCellDef="let row"> {{ row.assigneeName }} </td>
    </ng-container>
    <ng-container matColumnDef="checkInTime">
      <th mat-header-cell *matHeaderCellDef> Recibido </th>
      <td mat-cell *matCellDef="let row" class="nowrap">
        {{ row.checkInTime | dateTimeFormat: 'DMY HH:mm' }}
      </td>
    </ng-container>
    <ng-container matColumnDef="checkOutTime">
      <th mat-header-cell *matHeaderCellDef> Terminado </th>
      <td mat-cell *matCellDef="let row" class="nowrap">
        {{ row.checkInTime === row.endProcessTime ? '' : row.endProcessTime | dateTimeFormat: 'DMY HH:mm' }}
      </td>
    </ng-container>
    <ng-container matColumnDef="endProcessTime">
      <th mat-header-cell *matHeaderCellDef> Entregado </th>
      <td mat-cell *matCellDef="let row" class="nowrap">
        {{ row.checkOutTime | dateTimeFormat: 'DMY HH:mm' }}
      </td>
    </ng-container>
    <ng-container matColumnDef="elapsedTime">
      <th mat-header-cell *matHeaderCellDef class="text-align-right"> Trabajo </th>
      <td mat-cell *matCellDef="let row" class="text-align-right nowrap">
        {{ row.checkInTime === row.endProcessTime ? '' : row.elapsedTime | timeFormat }}
      </td>
    </ng-container>
    <ng-container matColumnDef="statusName">
      <th mat-header-cell *matHeaderCellDef> Estado </th>
      <td mat-cell *matCellDef="let row" class="nowrap"> {{ row.statusName }} </td>
    </ng-container>
    <ng-container matColumnDef="notes">
      <th mat-header-cell *matHeaderCellDef> Observaciones </th>
      <td mat-cell *matCellDef="let row"> {{ row.notes }} </td>
    </ng-container>


    <ng-container matColumnDef="footerElapsedTime">
      <td mat-footer-cell *matFooterCellDef [attr.colspan]="6" class="text-align-right">
        {{ elapsedTimeTotal | timeFormat }}
      </td>
    </ng-container>
    <ng-container matColumnDef="footerNotes">
      <td mat-footer-cell *matFooterCellDef [attr.colspan]="2" class="text-align-right"></td>
    </ng-container>


    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
    <tr mat-footer-row *matFooterRowDef="displayedFooterColumns" [hidden]="dataSource.data.length === 0"></tr>
  </table>

  <div *ngIf="dataSource.data.length === 0" class="text-not-found" [style.paddingTop.rem]="0.5">
    <p>No se han encontrado registros.</p>
  </div>

</div>