Frontend Components for Creating Daily Repeating Tasks

frontend/src/api/api/taskseries.service.ts

@@ -0,0 +1,159 @@
+/**
+ * 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.
+ */
+/* tslint:disable:no-unused-variable member-ordering */
+
+import { Inject, Injectable, Optional }                      from '@angular/core';
+import { HttpClient, HttpHeaders, HttpParams,
+         HttpResponse, HttpEvent, HttpParameterCodec, HttpContext 
+        }       from '@angular/common/http';
+import { CustomHttpParameterCodec }                          from '../encoder';
+import { Observable }                                        from 'rxjs';
+
+import { SimpleStatusResponse } from '../model/models';
+import { TaskRepeatDayInfo } from '../model/models';
+
+import { BASE_PATH, COLLECTION_FORMATS }                     from '../variables';
+import { Configuration }                                     from '../configuration';
+
+
+
+@Injectable({
+  providedIn: 'root'
+})
+export class TaskseriesService {
+
+    protected basePath = 'http://127.0.0.1:8080/api';
+    public defaultHeaders = new HttpHeaders();
+    public configuration = new Configuration();
+    public encoder: HttpParameterCodec;
+
+    constructor(protected httpClient: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string, @Optional() configuration: Configuration) {
+        if (configuration) {
+            this.configuration = configuration;
+        }
+        if (typeof this.configuration.basePath !== 'string') {
+            if (typeof basePath !== 'string') {
+                basePath = this.basePath;
+            }
+            this.configuration.basePath = basePath;
+        }
+        this.encoder = this.configuration.encoder || new CustomHttpParameterCodec();
+    }
+
+
+    private addToHttpParams(httpParams: HttpParams, value: any, key?: string): HttpParams {
+        if (typeof value === "object" && value instanceof Date === false) {
+            httpParams = this.addToHttpParamsRecursive(httpParams, value);
+        } else {
+            httpParams = this.addToHttpParamsRecursive(httpParams, value, key);
+        }
+        return httpParams;
+    }
+
+    private addToHttpParamsRecursive(httpParams: HttpParams, value?: any, key?: string): HttpParams {
+        if (value == null) {
+            return httpParams;
+        }
+
+        if (typeof value === "object") {
+            if (Array.isArray(value)) {
+                (value as any[]).forEach( elem => httpParams = this.addToHttpParamsRecursive(httpParams, elem, key));
+            } else if (value instanceof Date) {
+                if (key != null) {
+                    httpParams = httpParams.append(key,
+                        (value as Date).toISOString().substr(0, 10));
+                } else {
+                   throw Error("key may not be null if value is Date");
+                }
+            } else {
+                Object.keys(value).forEach( k => httpParams = this.addToHttpParamsRecursive(
+                    httpParams, value[k], key != null ? `${key}.${k}` : k));
+            }
+        } else if (key != null) {
+            httpParams = httpParams.append(key, value);
+        } else {
+            throw Error("key may not be null if value is not object or array");
+        }
+        return httpParams;
+    }
+
+    /**
+     * daily repeating task creation
+     * Creates a daily repeating task
+     * @param taskID internal id of taskgroup
+     * @param taskRepeatDayInfo 
+     * @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 tasksTaskIDTaskseriesDailyPost(taskID: number, taskRepeatDayInfo?: TaskRepeatDayInfo, observe?: 'body', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<SimpleStatusResponse>;
+    public tasksTaskIDTaskseriesDailyPost(taskID: number, taskRepeatDayInfo?: TaskRepeatDayInfo, observe?: 'response', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpResponse<SimpleStatusResponse>>;
+    public tasksTaskIDTaskseriesDailyPost(taskID: number, taskRepeatDayInfo?: TaskRepeatDayInfo, observe?: 'events', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpEvent<SimpleStatusResponse>>;
+    public tasksTaskIDTaskseriesDailyPost(taskID: number, taskRepeatDayInfo?: TaskRepeatDayInfo, observe: any = 'body', reportProgress: boolean = false, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<any> {
+        if (taskID === null || taskID === undefined) {
+            throw new Error('Required parameter taskID was null or undefined when calling tasksTaskIDTaskseriesDailyPost.');
+        }
+
+        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();
+        }
+
+
+        // to determine the Content-Type header
+        const consumes: string[] = [
+            'application/json'
+        ];
+        const httpContentTypeSelected: string | undefined = this.configuration.selectHeaderContentType(consumes);
+        if (httpContentTypeSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Content-Type', httpContentTypeSelected);
+        }
+
+        let responseType_: 'text' | 'json' = 'json';
+        if(localVarHttpHeaderAcceptSelected && localVarHttpHeaderAcceptSelected.startsWith('text')) {
+            responseType_ = 'text';
+        }
+
+        return this.httpClient.post<SimpleStatusResponse>(`${this.configuration.basePath}/tasks/${encodeURIComponent(String(taskID))}/taskseries/daily`,
+            taskRepeatDayInfo,
+            {
+                context: localVarHttpContext,
+                responseType: <any>responseType_,
+                withCredentials: this.configuration.withCredentials,
+                headers: localVarHeaders,
+                observe: observe,
+                reportProgress: reportProgress
+            }
+        );
+    }
+
+}

frontend/src/api/model/taskRepeatDayInfo.ts

@@ -0,0 +1,33 @@
+/**
+ * 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 TaskRepeatDayInfo { 
+    /**
+     * number repeating days
+     */
+    offset: number;
+    deadlineStrategy: TaskRepeatDayInfo.DeadlineStrategyEnum;
+    /**
+     * Date until the tasks repeat
+     */
+    endingDate: string;
+}
+export namespace TaskRepeatDayInfo {
+    export type DeadlineStrategyEnum = 'DEADLINE_EQUAL_START' | 'DEADLINE_FIT_START';
+    export const DeadlineStrategyEnum = {
+        EqualStart: 'DEADLINE_EQUAL_START' as DeadlineStrategyEnum,
+        FitStart: 'DEADLINE_FIT_START' as DeadlineStrategyEnum
+    };
+}
+
+

frontend/src/app/tasks/task-series-creator/task-series-creator.component.html

@@ -0,0 +1,52 @@
+<h1 mat-dialog-title>Create Task-Series</h1>
+<mat-stepper linear="linear" #stepper orientation="vertical">
+  <mat-step [stepControl]="firstFormGroup">
+    <form [formGroup]="firstFormGroup">
+      <ng-template matStepLabel>Select Task Repeating Strategy</ng-template>
+      <mat-form-field appearance="outline" class="long-form">
+        <mat-label>Repeating Strategy</mat-label>
+        <mat-select formControlName="repeatingStrategyCtrl">
+          <mat-option value="DAILY">Daily</mat-option>
+          <mat-option value="WEEKLY">Weekly</mat-option>
+        </mat-select>
+      </mat-form-field>
+      <div>
+        <button mat-raised-button color="primary" matStepperNext (click)="onSelectRepeatingStrategy()">Next</button>
+      </div>
+    </form>
+  </mat-step>
+  <mat-step [stepControl]="repeatingStrategy ? dailyFormGroup : weeklyFormGroup">
+    <form [formGroup]="dailyFormGroup" *ngIf="repeatingStrategy=='DAILY'">
+      <ng-template matStepLabel>Define Repeating Information</ng-template>
+      <mat-form-field appearance="outline" class="long-form">
+        <mat-label>Offset</mat-label>
+        <input matInput formControlName="offsetCtrl" type="number" (keypress)="($event.charCode >= 48 && $event.charCode < 58)">
+      </mat-form-field>
+      <mat-form-field appearance="outline" class="long-form">
+        <mat-label>Deadline Strategy</mat-label>
+        <mat-select formControlName="deadlineStrategyCtrl">
+          <mat-option value="DEADLINE_FIT_START">Fit Next Start</mat-option>
+          <mat-option value="DEADLINE_EQUAL_START">Equal Same Start</mat-option>
+        </mat-select>
+      </mat-form-field>
+      <div>
+        <button mat-raised-button color="primary" matStepperNext>Next</button>
+      </div>
+    </form>
+  </mat-step>
+  <mat-step [stepControl]="endDateFormGroup">
+    <form [formGroup]="endDateFormGroup">
+      <ng-template matStepLabel>When should the TaskSerie end?</ng-template>
+      <mat-form-field appearance="outline" class="long-form">
+        <mat-label>Choose a date</mat-label>
+        <input matInput [matDatepicker]="picker" formControlName="endDateCtrl">
+        <mat-hint>MM/DD/YYYY</mat-hint>
+        <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
+        <mat-datepicker #picker></mat-datepicker>
+      </mat-form-field>
+      <div>
+        <button mat-raised-button color="primary" (click)="save()">Submit</button>
+      </div>
+    </form>
+  </mat-step>
+</mat-stepper>

frontend/src/app/tasks/task-series-creator/task-series-creator.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TaskSeriesCreatorComponent } from './task-series-creator.component';
+
+describe('TaskSeriesCreatorComponent', () => {
+  let component: TaskSeriesCreatorComponent;
+  let fixture: ComponentFixture<TaskSeriesCreatorComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [TaskSeriesCreatorComponent]
+    });
+    fixture = TestBed.createComponent(TaskSeriesCreatorComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/src/app/tasks/task-series-creator/task-series-creator.component.ts

@@ -0,0 +1,78 @@
+import {Component, Inject} from '@angular/core';
+import {FormBuilder, Validators} from "@angular/forms";
+import {TaskEntityInfo, TaskRepeatDayInfo, TaskseriesService} from "../../../api";
+import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
+import DeadlineStrategyEnum = TaskRepeatDayInfo.DeadlineStrategyEnum;
+import * as moment from "moment";
+
+
+@Component({
+  selector: 'app-task-series-creator',
+  templateUrl: './task-series-creator.component.html',
+  styleUrls: ['./task-series-creator.component.css']
+})
+export class TaskSeriesCreatorComponent {
+
+  firstFormGroup = this._formBuilder.group({
+    repeatingStrategyCtrl: ['', Validators.required]
+  })
+
+  dailyFormGroup = this._formBuilder.group({
+    offsetCtrl: ['', Validators.required],
+    deadlineStrategyCtrl: ['', Validators.required]
+  })
+
+  weeklyFormGroup = this._formBuilder.group({
+
+  })
+
+  endDateFormGroup = this._formBuilder.group({
+    endDateCtrl: ['', Validators.required]
+  })
+
+  repeatingStrategy: "DAILY"|"WEEKLY"|undefined = undefined
+
+  constructor(private _formBuilder: FormBuilder,
+              private taskSeriesService: TaskseriesService,
+              @Inject(MAT_DIALOG_DATA) public task: TaskEntityInfo,
+              private dialogRef: MatDialogRef<TaskSeriesCreatorComponent>) {
+
+  }
+
+  onSelectRepeatingStrategy() {
+    const selectedStrategy = this.firstFormGroup.get("repeatingStrategyCtrl")!.value!
+    if(selectedStrategy === "DAILY") {
+      this.repeatingStrategy = "DAILY";
+    } else {
+      this.repeatingStrategy = "WEEKLY";
+    }
+    console.log(this.repeatingStrategy)
+  }
+
+  save() {
+    if(this.repeatingStrategy === 'DAILY') {
+      this.saveDailyRepeating()
+    }
+  }
+
+  saveDailyRepeating() {
+    this.taskSeriesService.tasksTaskIDTaskseriesDailyPost(this.task.taskID,{
+      offset: Number(this.dailyFormGroup.get('offsetCtrl')!.value!),
+      deadlineStrategy: this.convertDeadlineStrategyCtrlToDeadlineEnum(),
+      endingDate: moment( this.endDateFormGroup.get('endDateCtrl')!.value!).format('YYYY-MM-DDTHH:mm:ss.SSSZ')
+    }).subscribe({
+      next: resp => {
+        this.dialogRef.close();
+      }
+    })
+  }
+
+  convertDeadlineStrategyCtrlToDeadlineEnum() {
+    const deadlineStrategy = this.dailyFormGroup.get('deadlineStrategyCtrl')!.value;
+    if(deadlineStrategy === DeadlineStrategyEnum.EqualStart) {
+      return DeadlineStrategyEnum.EqualStart;
+    } else {
+      return DeadlineStrategyEnum.FitStart;
+    }
+  }
+}

openapi.yaml

@@ -2830,6 +2830,7 @@ components:
       required:
         - offset
         - deadlineStrategy
+        - endingDate
       additionalProperties: false
       properties:
         offset:
@@ -2842,3 +2843,7 @@ components:
           enum:
             - DEADLINE_EQUAL_START
             - DEADLINE_FIT_START
+        endingDate:
+          type: string
+          format: date
+          description: Date until the tasks repeat