backend/src/main/java/core/api/controller/TaskgroupController.java

@@ -1,10 +1,7 @@
 package core.api.controller;
 
 import core.api.models.auth.SimpleStatusResponse;
-import core.api.models.timemanager.taskgroup.RecursiveTaskgroupInfo;
-import core.api.models.timemanager.taskgroup.TaskgroupDetailInfo;
-import core.api.models.timemanager.taskgroup.TaskgroupEntityInfo;
-import core.api.models.timemanager.taskgroup.TaskgroupFieldInfo;
+import core.api.models.timemanager.taskgroup.*;
 import core.entities.timemanager.Taskgroup;
 import core.services.*;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -116,4 +113,10 @@ public class TaskgroupController {
         taskService.clearTasks(taskgroupPermissionResult.getResult());
         return ResponseEntity.ok(new SimpleStatusResponse("success"));
     }
+
+    @GetMapping("/taskgroups/path")
+    public ResponseEntity<?> getTaskgroupPaths() {
+        List<Taskgroup> taskgroups = taskgroupService.getTaskgroupsByUser(SecurityContextHolder.getContext().getAuthentication().getName());
+        return ResponseEntity.ok(taskgroups.stream().map(TaskgroupPathInfo::new));
+    }
 }

backend/src/main/java/core/api/models/timemanager/taskgroup/TaskgroupPathInfo.java

@@ -0,0 +1,21 @@
+package core.api.models.timemanager.taskgroup;
+
+import com.fasterxml.jackson.annotation.JsonProperty;
+import core.entities.timemanager.Taskgroup;
+
+import java.util.ArrayList;
+import java.util.List;
+
+public class TaskgroupPathInfo {
+
+    @JsonProperty
+    private List<String> taskgroupPathNames;
+
+    public TaskgroupPathInfo(Taskgroup taskgroup) {
+        taskgroupPathNames = new ArrayList<>();
+        List<Taskgroup> taskgroupPath = Taskgroup.getAncestorList(taskgroup);
+        for(Taskgroup cT : taskgroupPath) {
+            taskgroupPathNames.add(cT.getTaskgroupName());
+        }
+    }
+}

backend/src/main/java/core/services/TaskgroupService.java

@@ -107,4 +107,8 @@ public class TaskgroupService {
     public void deleteTaskgroupByUser(User user) {
         taskgroupRepository.deleteAllByUser(user);
     }
+
+    public List<Taskgroup> getTaskgroupsByUser(String name) {
+        return taskgroupRepository.findAllByUser(name);
+    }
 }

frontend/src/api/.openapi-generator/FILES

@@ -50,6 +50,7 @@ model/taskTaskgroupInfo.ts
 model/taskgroupDetailInfo.ts
 model/taskgroupEntityInfo.ts
 model/taskgroupFieldInfo.ts
+model/taskgroupPathInfo.ts
 model/userAddInfo.ts
 model/userInfo.ts
 model/userUpdateInfo.ts

frontend/src/api/api/taskgroup.service.ts

@@ -25,6 +25,7 @@ import { SimpleStatusResponse } from '../model/models';
 import { TaskgroupDetailInfo } from '../model/models';
 import { TaskgroupEntityInfo } from '../model/models';
 import { TaskgroupFieldInfo } from '../model/models';
+import { TaskgroupPathInfo } from '../model/models';
 
 import { BASE_PATH, COLLECTION_FORMATS }                     from '../variables';
 import { Configuration }                                     from '../configuration';
@@ -201,6 +202,61 @@ export class TaskgroupService {
         );
     }
 
+    /**
+     * lists all taskgrouppaths
+     * lists all taskgroup-paths
+     * @param observe set whether or not to return the data Observable as the body, response or events. defaults to returning the body.
+     * @param reportProgress flag to report request and response progress.
+     */
+    public taskgroupsPathGet(observe?: 'body', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<Array<TaskgroupPathInfo>>;
+    public taskgroupsPathGet(observe?: 'response', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpResponse<Array<TaskgroupPathInfo>>>;
+    public taskgroupsPathGet(observe?: 'events', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpEvent<Array<TaskgroupPathInfo>>>;
+    public taskgroupsPathGet(observe: any = 'body', reportProgress: boolean = false, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<any> {
+
+        let localVarHeaders = this.defaultHeaders;
+
+        let localVarCredential: string | undefined;
+        // authentication (API_TOKEN) required
+        localVarCredential = this.configuration.lookupCredential('API_TOKEN');
+        if (localVarCredential) {
+            localVarHeaders = localVarHeaders.set('Authorization', 'Bearer ' + localVarCredential);
+        }
+
+        let localVarHttpHeaderAcceptSelected: string | undefined = options && options.httpHeaderAccept;
+        if (localVarHttpHeaderAcceptSelected === undefined) {
+            // to determine the Accept header
+            const httpHeaderAccepts: string[] = [
+                'application/json'
+            ];
+            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
+        }
+        if (localVarHttpHeaderAcceptSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
+        }
+
+        let localVarHttpContext: HttpContext | undefined = options && options.context;
+        if (localVarHttpContext === undefined) {
+            localVarHttpContext = new HttpContext();
+        }
+
+
+        let responseType_: 'text' | 'json' = 'json';
+        if(localVarHttpHeaderAcceptSelected && localVarHttpHeaderAcceptSelected.startsWith('text')) {
+            responseType_ = 'text';
+        }
+
+        return this.httpClient.get<Array<TaskgroupPathInfo>>(`${this.configuration.basePath}/taskgroups/path`,
+            {
+                context: localVarHttpContext,
+                responseType: <any>responseType_,
+                withCredentials: this.configuration.withCredentials,
+                headers: localVarHeaders,
+                observe: observe,
+                reportProgress: reportProgress
+            }
+        );
+    }
+
     /**
      * creates taskgroup
      * creates taskgroup

frontend/src/api/model/models.ts

@@ -33,6 +33,7 @@ export * from './taskTaskgroupInfo';
 export * from './taskgroupDetailInfo';
 export * from './taskgroupEntityInfo';
 export * from './taskgroupFieldInfo';
+export * from './taskgroupPathInfo';
 export * from './userAddInfo';
 export * from './userInfo';
 export * from './userUpdateInfo';

frontend/src/api/model/taskgroupPathInfo.ts

@@ -0,0 +1,17 @@
+/**
+ * API Title
+ * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
+ *
+ * The version of the OpenAPI document: 1.0
+ * 
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+
+
+export interface TaskgroupPathInfo { 
+    taskgroupPathNames: Array<string>;
+}
+

frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.html

@@ -1,5 +1,12 @@
 <div class="container">
   <app-navigation-link-list #navLinkList [navigationLinks]="defaultNavigationLinkPath"></app-navigation-link-list>
+  <mat-form-field style="width: 100%">
+    <mat-label>Toppings</mat-label>
+    <mat-select [(ngModel)]="selectedSeries" multiple (ngModelChange)="updateSerieSelection()">
+      <mat-option *ngFor="let topping of toppingList" [value]="topping">{{topping}}</mat-option>
+    </mat-select>
+  </mat-form-field>
+
   <div style="text-align:center">
     <apx-chart
       [series]="chartOptions.series!"
@@ -9,6 +16,7 @@
     ></apx-chart>
   </div>
  <div class="custom-slider">
-   <ngx-slider class="ngx-slider" [(value)]="minValue" [(highValue)]="maxValue" [options]="options"></ngx-slider>
+   <ngx-slider class="ngx-slider" [options]="options" [formControl]="sliderControl" (userChangeStart)="onUserChangeStart($event)"
+               (userChangeEnd)="onUserChangeStop($event)" (userChange)="onUserChange($event)"></ngx-slider>
  </div>
 </div>

frontend/src/app/statistics/taskgroup-activity/taskgroup-activity.component.ts

@@ -1,7 +1,7 @@
-import {Component, ViewChild} from '@angular/core';
+import {Component, OnInit, ViewChild} from '@angular/core';
 import {NavigationLink} from "../../navigation-link-list/navigation-link-list.component";
 import * as moment from "moment";
-import {LabelType, Options} from "ngx-slider-v2";
+import {ChangeContext, LabelType, Options} from "ngx-slider-v2";
 import {
   ChartComponent,
   ApexAxisChartSeries,
@@ -9,6 +9,9 @@ import {
   ApexXAxis,
   ApexTitleSubtitle
 } from "ng-apexcharts";
+import {timeInterval} from "rxjs";
+import {FormControl} from "@angular/forms";
+import {TaskgroupService} from "../../../api";
 
 export type ChartOptions = {
   series: ApexAxisChartSeries;
@@ -21,7 +24,7 @@ export type ChartOptions = {
   templateUrl: './taskgroup-activity.component.html',
   styleUrls: ['./taskgroup-activity.component.css']
 })
-export class TaskgroupActivityComponent {
+export class TaskgroupActivityComponent implements OnInit{
   defaultNavigationLinkPath: NavigationLink[] = [
     {
       linkText: 'Dashboard',
@@ -37,14 +40,13 @@ export class TaskgroupActivityComponent {
     }
   ];
 
-  minValue: number = 50;
-  maxValue: number = 200;
-  /*options: Options = {
-    floor: 0,
-    ceil: 250
-  };*/
 
+  toppings = new FormControl();
+  toppingList: string[] = [];
+  selectedSeries: string[] = []
+  sliderControl: FormControl = new FormControl()
   dateRange: Date[] = this.createDateRange();
+  selectedDateRange: Date[] = this.dateRange;
   value: number = this.dateRange[0].getTime();
   options: Options = {
     stepsArray: this.dateRange.map((date: Date) => {
@@ -58,24 +60,23 @@ export class TaskgroupActivityComponent {
   };
 
   @ViewChild("chart") chart?: ChartComponent;
-  public chartOptions: Partial<ChartOptions> = {
-    series: [
-      {
-        name: "My-series",
-        data: [10, 41, 35, 51, 49, 62, 69, 91, 148]
+  public chartOptions: Partial<ChartOptions> = this.generateChartOptions()
+
+  constructor(private taskgroupService: TaskgroupService) {
+  }
+
+  ngOnInit() {
+    this.taskgroupService.taskgroupsPathGet().subscribe({
+      next: resp => {
+        resp.forEach(taskgroupPath => {
+          let taskgroupPathName = "";
+          taskgroupPath.taskgroupPathNames.forEach(name => taskgroupPathName += (name + "/"))
+          this.toppingList.push(taskgroupPathName)
+        })
       }
-    ],
-    chart: {
-      height: 350,
-      type: "bar"
-    },
-    title: {
-      text: "My First Angular Chart"
-    },
-    xaxis: {
-      categories: ["Jan", "Feb",  "Mar",  "Apr",  "May",  "Jun",  "Jul",  "Aug", "Sep"]
-    }
-  };
+    })
+  }
+
 
   createDateRange(): Date[] {
     const dates: Date[] = [];
@@ -83,7 +84,76 @@ export class TaskgroupActivityComponent {
 
       dates.push(moment().subtract(30-i, 'd').toDate());
     }
+    this.sliderControl.setValue([dates[0], dates[dates.length-1]])
     return dates;
   }
 
+  createDateRangeBetween(minValue: moment.Moment, maxValue: moment.Moment) {
+    const dates: Date[] = [];
+    const numberDays = maxValue.diff(minValue, 'days');
+    for(let i=0; i<=numberDays; i++) {
+      dates.push(minValue.add(i, 'd').toDate());
+    }
+    return dates;
+  }
+
+  onUserChangeStart(changeContext: ChangeContext) {
+
+      //console.log("onUserChangeStart" + new Date(changeContext.value));
+  }
+
+  onUserChangeStop(changeContext: ChangeContext) {
+      //console.log("onUserChangeStop" + new Date(changeContext.highValue!))
+  }
+
+  onUserChange(changeContext: ChangeContext) {
+    const dateRange = this.createDateRangeBetween(moment(changeContext.value), moment(changeContext.highValue!))
+    this.chartOptions = this.generateChartOptions()
+  }
+
+  generateChartOptions(): Partial<ChartOptions> {
+    return {
+      series: this.selectedSeries.map(serie => this.generateSeries(serie)!),
+        chart: {
+      height: 350,
+        type: "bar",
+        stacked: false
+    },
+      title: {
+        text: ""
+      },
+      xaxis: {
+        categories: this.selectedDateRange.map(date => date.toDateString())
+      }
+    };
+  }
+
+  generateSeries(serie: string) {
+    if(serie == "KIT/") {
+      return {
+        name: "Marine Sprite",
+        data: [44, 55, 41, 37, 22, 43, 21]
+      }
+    } else if(serie == "Striking Calf") {
+      return {
+        name: "Striking Calf",
+        data: [53, 32, 33, 52, 13, 43, 32]
+      }
+    } else if(serie == "Tank Picture") {
+      return {
+        name: "Tank Picture",
+        data: [12, 17, 11, 9, 15, 11, 20]
+      }
+    } else {
+      return {
+        name: "",
+        data: []
+      }
+    }
+
+  }
+
+  updateSerieSelection() {
+    this.chartOptions = this.generateChartOptions()
+  }
 }

openapi.yaml

@@ -883,6 +883,23 @@ paths:
               schema:
                 type: object
                 $ref: "#/components/schemas/SimpleStatusResponse"    
+  /taskgroups/path:
+    get:
+      security:
+        - API_TOKEN: []
+      tags:
+        - taskgroup
+      summary: lists all taskgrouppaths
+      description: lists all taskgroup-paths
+      responses:
+        200:
+          description: Operation successfull
+          content:
+            application/json:
+              schema:
+                type: array
+                items:
+                  $ref: '#/components/schemas/TaskgroupPathInfo'
   /tasks/all/{scope}/{detailed}:
     get:
       security:
@@ -2530,3 +2547,12 @@ components:
         scheduleStopTime:
           type: string
           format: date
+    TaskgroupPathInfo:
+      required:
+        - taskgroupPathNames
+      additionalProperties: false
+      properties:
+        taskgroupPathNames:
+          type: array
+          items:
+            type: string