<div class="popup-general">
  <div class="row">
      <div class="col-lg-12">
          <div class="dialog-title">
              <img src="{{ logoSrc }}" with="25" height="25">
              <span class="header-popup-text">Seleccionar un vuelo</span>
              <div class="pull-right">
                  <button type="button" class="close" (click)="close()"></button>
              </div>
          </div>
      </div>
  </div>

  <div>

    <div class="mat-elevation-z8" style="margin: 15px 0px 15px;">
      <table class="table table-striped table-hover" mat-table [dataSource]="dataSource" matSort>

        <ng-container matColumnDef="id">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> ID </th>
          <td mat-cell *matCellDef="let row"> {{row.id}} </td>
        </ng-container>
    
        <ng-container matColumnDef="agente">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> Costo </th>
          <td mat-cell *matCellDef="let row"> {{row.costo}} </td>
        </ng-container>
        <ng-container matColumnDef="pasajero">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> Codigo Aerolinea </th>
          <td mat-cell *matCellDef="let row"> {{row.codigoAerolinea}} </td>
        </ng-container>
        <ng-container matColumnDef="monto">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> Codigo Aeronave </th>
          <td mat-cell *matCellDef="let row"> {{row.codigoTipoAeronave}} </td>
        </ng-container>
    
        <tr  mat-header-row *matHeaderRowDef="displayedColumns"></tr>
        <tr mat-row *matRowDef="let row; columns: displayedColumns;" (click)="detalles(row)"></tr>

      </table>
    
      <mat-paginator [pageSizeOptions]="[5, 10, 25, 100]" aria-label="Select page of users"></mat-paginator>  
    </div>
  </div>

  <div class="dialog-footer">
      <div>
          <button type="button" class="btn btn-primary pull-right" (click)="save()" *ngIf="mode !== 'view'"
              [disabled]="record ? ((form?.invalid && form?.touched) || processing) : (form?.invalid || processing)">
              <span><i class="fa fa-floppy-o"></i>&nbsp;{{ 'btn.save' | translate }}</span>
          </button>
          &nbsp;
          <button class="btn btn-default pull-left" (click)="close()">
              <span>{{ 'btn.cancel' | translate }}</span>
          </button>
      </div>
  </div>
</div>