<div class="row">
    <div class="col-md text-center text-md-right mb-4">
        <kendo-buttongroup [selection]="'single'">
            <button kendoButton [togglable]="true" (click)="onFilterClick(3)" [selected]="true">3 Months</button>
            <button kendoButton [togglable]="true" (click)="onFilterClick(6)">6 Months</button>
            <button kendoButton [togglable]="true" (click)="onFilterClick(12)">1 Year</button>
        </kendo-buttongroup>
    </div>
    <div class="col-md order-md-first text-center text-md-left">
        <h2>
            <span class="small text-uppercase text-muted d-block">Statistics</span>
            {{ rangeStart | date }} - {{ today | date }}
        </h2>
    </div>
</div>
<kendo-tabstrip (select)="onTabSelect($event)">
    <kendo-tabstrip-tab [title]="'All Issues'" [selected]="true">
        <ng-template kendoTabContent>
            <app-statistics [loading]="isLoading" [issues]="issues" [months]="months"></app-statistics>
        </ng-template>
    </kendo-tabstrip-tab>

    <kendo-tabstrip-tab [title]="'Assigned to Me'">
        <ng-template kendoTabContent>
            <app-statistics [loading]="isLoading" [issues]="issues" [months]="months"></app-statistics>
        </ng-template>
    </kendo-tabstrip-tab>

    <kendo-tabstrip-tab [title]="'Created by Me'">
        <ng-template kendoTabContent>
            <app-statistics [loading]="isLoading" [issues]="issues" [months]="months"></app-statistics>
        </ng-template>
    </kendo-tabstrip-tab>
</kendo-tabstrip>
