src/app/dialogs/file-import/file-import.component.html

<div class="panel panel-default">
  <div class="panel-heading">
    <form #fileImportForm="ngForm">
      <table>
        <tr>
          <td style="width:80%;">
            <h4 class="panel-title">
              <div>Dateiauswahl Meldung importieren</div>
            </h4>
          </td>
        </tr>
      </table>
    </form>
  </div>
  <div class="panel-body">
    <table class="table table-striped table-bordered">
      <thead>
        <tr>

          <th class="notification-tab-first-col">
            <app-sorting [initColumnName]="'creationDate'" (click)="sort('creationDate')" [isDesc]="sortingState?.isDesc" [defaultState]="sortingState?.defaultState"
              [columnName]="sortingState?.column">Erstellungs Datum</app-sorting>
          </th>
          <th class="notification-tab-filename">
            <app-sorting [initColumnName]="'fileName'" (click)="sort('fileName')" [isDesc]="sortingState?.isDesc" [defaultState]="sortingState?.defaultState"
              [columnName]="sortingState?.column"></app-sorting>
          </th>
          <th class="notification-tab-branch">
            <app-sorting [initColumnName]="'branchName'" (click)="sort('branchName')" [isDesc]="sortingState?.isDesc" [defaultState]="sortingState?.defaultState"
              [columnName]="sortingState?.column"></app-sorting>
          </th>
          <th class="notification-tab-grid-territory">
            <app-sorting [initColumnName]="'gridTerritoryName'" (click)="sort('gridTerritoryName')" [isDesc]="sortingState?.isDesc" [defaultState]="sortingState?.defaultState"
              [columnName]="sortingState?.column"> </app-sorting>
          </th>
          <th class="notification-tab-description">
            <app-sorting [initColumnName]="'notificationText'" (click)="sort('notificationText')" [isDesc]="sortingState?.isDesc" [defaultState]="sortingState?.defaultState"
              [columnName]="sortingState?.column">Kurztext</app-sorting>
          </th>
          <th class="notification-tab-edit-buttons"></th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let fileModel of defaultList" class='notification_row_testable'>
          <td colspan="8" style="padding:0px;">
            <table style="width:100%">
              <tr>

                <td class="notification-tab-first-col">
                  <span> 
                    {{ fileModel.creationDate | formattedTimestamp: 'DD.MM.YYYY HH:mm' }}
                  </span>
                </td>
                <td class="notification-tab-filename">
                  {{ fileModel.fileName }}
                </td>
                <td class="notification-tab-branch" [ngClass]="sessionContext.getBranchClassByName(fileModel.branchName)">
                  {{ fileModel.branchName }}
                </td>
                <td class="notification-tab-grid-territory">
                  <span>
                  {{ fileModel.gridTerritoryName }}
                  </span>
                </td>
                <td class="notification-tab-description" style="overflow:hidden !important;text-overflow: ellipsis;" data-toggle="tooltip"
                  [attr.data-original-title]="fileModel.notificationText">{{ fileModel.notificationText }}</td>
                <td class="notification-tab-edit-buttons">
                  <button type="button" class="btn btn-primary btn-sm" (click)="importThisFile(fileModel)">
                                <span class="glyphicon glyphicon-import"></span>
                              </button>
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
  <div>
    <button class="btn btn-primary btn-sm" (click)="cancel()">Abbrechen</button>
  </div>
</div>