<!--
 *******************************************************************************
 * Copyright (c) 2018 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License v. 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0.
 *
 * SPDX-License-Identifier: EPL-2.0
 *******************************************************************************
-->


<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>