<h2 mat-dialog-title> Condiciones </h2>
<mat-dialog-content style="padding: 0 !important;">

  <table 
    mat-table 
    matSort 
    [dataSource]="dataSource" 
    class="animated fadeIn" 
    [style.display]="isLoading ? 'none' : 'revert'">

    <ng-container matColumnDef="NUMERO_CONDICION">
      <th mat-header-cell *matHeaderCellDef>No. Condición</th>
      <td mat-cell *matCellDef="let element">#{{ element.NUMERO_CONDICION }}</td>
    </ng-container>
    <ng-container matColumnDef="TIPO_CONDITION">
      <th mat-header-cell *matHeaderCellDef>Tipo de condición</th>
      <td mat-cell *matCellDef="let element">{{ element.TIPO_CONDICION }}</td>
    </ng-container>
    <ng-container matColumnDef="ACCIONES">
      <th mat-header-cell *matHeaderCellDef>Acciones</th>
      <td mat-cell *matCellDef="let element">
        <button 
          mat-mini-fab 
          color="primary" 
          class="override_no_shadow pink_primary_background white_font " 
          matTooltip="Ver información" 
          (click)="openDialog(element)">
          <mat-icon>info</mat-icon>
        </button>
      </td>
    </ng-container>
    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
    <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
    <tr class="mat-row" *matNoDataRow>
      <td class="mat-cell p-40 centre" colspan="12">
        <object data="assets/img/empty_data.svg" width="150"></object>
        <h2>Sin datos</h2>
      </td>
    </tr>
  </table>
</mat-dialog-content>
<mat-dialog-actions align="end">
  <button mat-button mat-dialog-close cdkFocusInitial>Cerrar</button>
</mat-dialog-actions>
