src/app/lists/status-changes/status-changes.component.html

<!--
******************************************************************************
* Copyright © 2018 PTA GmbH.
* All rights reserved. This program and the accompanying materials
* are made available under the terms of the Eclipse Public License v1.0
* which accompanies this distribution, and is available at
* 
*     http://www.eclipse.org/legal/epl-v10.html
* 
******************************************************************************
-->

<div class="panel panel-default" style="width:100%;">
  <div class="panel-heading" style="display: inline-flex; width: 100%;padding: 0px 0px 0px 0px">
    <h4 class="panel-title" style="width: 100%;padding: 10px 15px">
      <a [ngClass]="(!isExpandedStatus)?'glyphicon glyphicon-chevron-down':'glyphicon glyphicon-chevron-up'"
        data-toggle="collapse" href="#collapse5" (click)="isExpandedStatus = !isExpandedStatus"></a>
      <a *ngIf="isStatusCollapsed" data-toggle="collapse" href="#collapse5" (click)="isExpandedStatus = !isExpandedStatus">Statuswechsel</a>

      <div *ngIf="!isStatusCollapsed">Statuswechsel</div>
    </h4>
  </div>
  <div id="collapse5" style="width:100%;" class="panel-collapse collapse in" [ngClass]="{'in': !isStatusCollapsed }">
    <div id="grid-wrapper" class="panel-body" style="width:100%;">

      <ag-grid-angular *ngIf="!showSpinner" style="height: 600px;" class="ag-theme-balham" [gridOptions]="gridOptions"
        [rowData]="statuschanges">

      </ag-grid-angular>
      <app-loading-spinner *ngIf="showSpinner"></app-loading-spinner>
    </div>
  </div>
</div>