<h1 mat-dialog-title class="prevent-select">Seleccionar vagón</h1>
<div mat-dialog-content class="prevent-select">
  <div class="is-loading animated fadeIn fast" *ngIf="isLoading">
    <mat-spinner align="center"></mat-spinner>
    <h3>Cargando datos ...</h3>
  </div>
  <div class="has-error animated fadeIn pt-64" *ngIf="!isLoading && hasError">
    <mat-icon class="red_primary_font">error</mat-icon>
    <h2>{{ errorStr }}</h2>
  </div>
  <div class="train-occupations-column">
    <div class="train-sections-container">
      <img [src]="'assets/img/train/' + occupation.IMAGE" [alt]="occupation.CAR" *ngFor="let occupation of trainOccupations"  
      [matTooltip]="occupation.CAR" (click)="selectCar(occupation)">
    </div>
    <object data="assets/img/empty_data.svg" width="200" *ngIf="image == ''"></object>
    <img [src]="'assets/img/train/' + image" [alt]="selectedCar" *ngIf="image != ''">
    <h2>{{ image == '' ? 'Aún no ha seleccionado un vagón' : selectedCar }}</h2>
  </div>
</div>
<div mat-dialog-actions align="end">
  <button mat-button mat-dialog-close>Cerrar</button>
  <button mat-button [disabled]="image == ''" (click)="close()">Continuar</button>
</div>