Create Component for Creating and Editing Tasks

This commit is contained in:
Sebastian 2023-10-02 10:57:56 +02:00
parent a7229d1d9d
commit 3e239df1bf
16 changed files with 421 additions and 32 deletions

View File

@ -5,13 +5,7 @@
</component>
<component name="ChangeListManager">
<list default="true" id="3a869f59-290a-4ab2-b036-a878ce801bc4" name="Changes" comment="Datastructure for Tasks">
<change afterPath="$PROJECT_DIR$/src/main/java/core/api/controller/TaskController.java" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/main/java/core/api/models/timemanager/tasks/TaskEntityInfo.java" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/java/core/api/models/timemanager/tasks/TaskEntityInfo.java" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/main/java/core/entities/timemanager/Task.java" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/java/core/entities/timemanager/Task.java" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/main/java/core/entities/timemanager/Taskgroup.java" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/java/core/entities/timemanager/Taskgroup.java" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/main/java/core/services/TaskService.java" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/java/core/services/TaskService.java" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../openapi.yaml" beforeDir="false" afterPath="$PROJECT_DIR$/../openapi.yaml" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />

View File

@ -5,6 +5,7 @@ api/account.service.ts
api/api.ts
api/login.service.ts
api/properties.service.ts
api/task.service.ts
api/taskgroup.service.ts
api/users.service.ts
configuration.ts
@ -25,6 +26,8 @@ model/propertiesInfo.ts
model/propertyInfo.ts
model/propertyUpdateRequest.ts
model/signUpRequest.ts
model/taskEntityInfo.ts
model/taskFieldInfo.ts
model/taskgroupEntityInfo.ts
model/taskgroupFieldInfo.ts
model/userAddInfo.ts

View File

@ -5,6 +5,7 @@ import { HttpClient } from '@angular/common/http';
import { AccountService } from './api/account.service';
import { LoginService } from './api/login.service';
import { PropertiesService } from './api/properties.service';
import { TaskService } from './api/task.service';
import { TaskgroupService } from './api/taskgroup.service';
import { UsersService } from './api/users.service';

View File

@ -4,8 +4,10 @@ export * from './login.service';
import { LoginService } from './login.service';
export * from './properties.service';
import { PropertiesService } from './properties.service';
export * from './task.service';
import { TaskService } from './task.service';
export * from './taskgroup.service';
import { TaskgroupService } from './taskgroup.service';
export * from './users.service';
import { UsersService } from './users.service';
export const APIS = [AccountService, LoginService, PropertiesService, TaskgroupService, UsersService];
export const APIS = [AccountService, LoginService, PropertiesService, TaskService, TaskgroupService, UsersService];

View File

@ -0,0 +1,223 @@
/**
* 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 { InlineResponse403 } from '../model/models';
import { TaskEntityInfo } from '../model/models';
import { TaskFieldInfo } from '../model/models';
import { BASE_PATH, COLLECTION_FORMATS } from '../variables';
import { Configuration } from '../configuration';
@Injectable({
providedIn: 'root'
})
export class TaskService {
protected basePath = 'http://localhost: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;
}
/**
* creates a new task
* creates tasks
* @param taskgroupID internal id of taskgroup
* @param taskFieldInfo
* @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 tasksTaskgroupIDPut(taskgroupID: number, taskFieldInfo?: TaskFieldInfo, observe?: 'body', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<TaskEntityInfo>;
public tasksTaskgroupIDPut(taskgroupID: number, taskFieldInfo?: TaskFieldInfo, observe?: 'response', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpResponse<TaskEntityInfo>>;
public tasksTaskgroupIDPut(taskgroupID: number, taskFieldInfo?: TaskFieldInfo, observe?: 'events', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpEvent<TaskEntityInfo>>;
public tasksTaskgroupIDPut(taskgroupID: number, taskFieldInfo?: TaskFieldInfo, observe: any = 'body', reportProgress: boolean = false, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<any> {
if (taskgroupID === null || taskgroupID === undefined) {
throw new Error('Required parameter taskgroupID was null or undefined when calling tasksTaskgroupIDPut.');
}
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.put<TaskEntityInfo>(`${this.configuration.basePath}/tasks/${encodeURIComponent(String(taskgroupID))}`,
taskFieldInfo,
{
context: localVarHttpContext,
responseType: <any>responseType_,
withCredentials: this.configuration.withCredentials,
headers: localVarHeaders,
observe: observe,
reportProgress: reportProgress
}
);
}
/**
* list tasks
* list tasks
* @param taskgroupID internal id of taskgroup
* @param status scope of listed tasks
* @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 tasksTaskgroupIDStatusGet(taskgroupID: number, status: 'all' | 'overdue' | 'upcoming', observe?: 'body', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<Array<TaskEntityInfo>>;
public tasksTaskgroupIDStatusGet(taskgroupID: number, status: 'all' | 'overdue' | 'upcoming', observe?: 'response', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpResponse<Array<TaskEntityInfo>>>;
public tasksTaskgroupIDStatusGet(taskgroupID: number, status: 'all' | 'overdue' | 'upcoming', observe?: 'events', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<HttpEvent<Array<TaskEntityInfo>>>;
public tasksTaskgroupIDStatusGet(taskgroupID: number, status: 'all' | 'overdue' | 'upcoming', observe: any = 'body', reportProgress: boolean = false, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext}): Observable<any> {
if (taskgroupID === null || taskgroupID === undefined) {
throw new Error('Required parameter taskgroupID was null or undefined when calling tasksTaskgroupIDStatusGet.');
}
if (status === null || status === undefined) {
throw new Error('Required parameter status was null or undefined when calling tasksTaskgroupIDStatusGet.');
}
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<TaskEntityInfo>>(`${this.configuration.basePath}/tasks/${encodeURIComponent(String(taskgroupID))}/${encodeURIComponent(String(status))}`,
{
context: localVarHttpContext,
responseType: <any>responseType_,
withCredentials: this.configuration.withCredentials,
headers: localVarHeaders,
observe: observe,
reportProgress: reportProgress
}
);
}
}

View File

@ -11,6 +11,8 @@ export * from './propertiesInfo';
export * from './propertyInfo';
export * from './propertyUpdateRequest';
export * from './signUpRequest';
export * from './taskEntityInfo';
export * from './taskFieldInfo';
export * from './taskgroupEntityInfo';
export * from './taskgroupFieldInfo';
export * from './userAddInfo';

View File

@ -0,0 +1,40 @@
/**
* 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 TaskEntityInfo {
/**
* internal id of task
*/
taskID: number;
/**
* name of task
*/
taskName: string;
/**
* expected time to finish task
*/
eta: number;
/**
* date from which the task can be started
*/
startDate: string;
/**
* date until the task has to be finished
*/
deadline: string;
/**
* determines whether the task is overdue
*/
overdue: boolean;
}

View File

@ -0,0 +1,32 @@
/**
* 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 TaskFieldInfo {
/**
* name of task
*/
taskName: string;
/**
* expected time to finish task
*/
eta: number;
/**
* date from which the task can be started
*/
startDate: string;
/**
* date until the task has to be finished
*/
deadline: string;
}

View File

@ -39,6 +39,8 @@ import {MatListModule} from "@angular/material/list";
import { TaskgroupDashboardComponent } from './taskgroups/taskgroup-dashboard/taskgroup-dashboard.component';
import { TaskgroupCreationComponent } from './taskgroups/taskgroup-creation/taskgroup-creation.component';
import { TaskgroupDeletionComponent } from './taskgroups/taskgroup-deletion/taskgroup-deletion.component';
import { TaskEditorComponent } from './tasks/task-editor/task-editor.component';
import {MatDatepickerModule} from "@angular/material/datepicker";
@NgModule({
declarations: [
@ -58,31 +60,33 @@ import { TaskgroupDeletionComponent } from './taskgroups/taskgroup-deletion/task
SettingsComponent,
TaskgroupDashboardComponent,
TaskgroupCreationComponent,
TaskgroupDeletionComponent
],
imports: [
BrowserModule,
AppRoutingModule,
FormsModule,
ApiModule,
HttpClientModule,
BrowserAnimationsModule,
MatToolbarModule,
MatButtonModule,
MatIconModule,
MatDialogModule,
MatFormFieldModule,
MatInputModule,
MatProgressSpinnerModule,
MatSnackBarModule,
MatMenuModule,
MatTabsModule,
MatTableModule,
MatCheckboxModule,
MatCardModule,
ReactiveFormsModule,
MatListModule
TaskgroupDeletionComponent,
TaskEditorComponent
],
imports: [
BrowserModule,
AppRoutingModule,
FormsModule,
ApiModule,
HttpClientModule,
BrowserAnimationsModule,
MatToolbarModule,
MatButtonModule,
MatIconModule,
MatDialogModule,
MatFormFieldModule,
MatInputModule,
MatProgressSpinnerModule,
MatSnackBarModule,
MatMenuModule,
MatTabsModule,
MatTableModule,
MatCheckboxModule,
MatCardModule,
ReactiveFormsModule,
MatListModule,
MatDatepickerModule
],
providers: [
HttpClientModule,
/*

View File

@ -33,6 +33,12 @@
#addTaskgroupBtn {
margin-top: 20px;
float: right;
}
#addTaskBtn {
margin-top: 20px;
float: left;
}
.edit-btn {

View File

@ -15,5 +15,8 @@
</mat-card-content>
</mat-card>
<button id="addTaskgroupBtn" mat-raised-button color="primary" (click)="openTaskgroupCreation()">Create new Taskgroup</button>
<div>
<button id="addTaskBtn" mat-raised-button color="primary" (click)="openTaskCreation()">Create New Task</button>
<button id="addTaskgroupBtn" mat-raised-button color="primary" (click)="openTaskgroupCreation()">Create new Taskgroup</button>
</div>
</div>

View File

@ -4,6 +4,7 @@ import {TaskgroupCreationComponent} from "../taskgroup-creation/taskgroup-creati
import {TaskgroupEntityInfo, TaskgroupService} from "../../../api";
import {TaskgroupDeletionComponent} from "../taskgroup-deletion/taskgroup-deletion.component";
import {ActivatedRoute} from "@angular/router";
import {TaskEditorComponent} from "../../tasks/task-editor/task-editor.component";
@Component({
selector: 'app-taskgroup-dashboard',
@ -65,4 +66,8 @@ export class TaskgroupDashboardComponent implements OnInit {
}
})
}
openTaskCreation() {
const dialogRef = this.dialog.open(TaskEditorComponent, {minWidth: "400px"})
}
}

View File

@ -0,0 +1,3 @@
.long-form {
width: 100%;
}

View File

@ -0,0 +1,27 @@
<h1 mat-dialog-title>Create New Task</h1>
<div mat-dialog-content>
<mat-form-field appearance="outline" class="long-form">
<mat-label>Name</mat-label>
<input matInput [formControl]="nameCtrl">
<mat-hint align="end">{{nameCtrl.value.length}} / 255</mat-hint>
</mat-form-field>
<mat-form-field appearance="outline" class="long-form">
<mat-label>ETA</mat-label>
<input matInput type="number" [formControl]="etaCtrl" min="0">
</mat-form-field>
<!--
<mat-form-field>
<mat-label>Startdate</mat-label>
<input matInput [matDatepicker]="startpicker">
<mat-hint>MM/DD/YYYY</mat-hint>
<mat-datepicker-toggle matIconSuffix [for]="startpicker"></mat-datepicker-toggle>
<mat-datepicker #startpicker></mat-datepicker>
</mat-form-field>
<mat-form-field>
<mat-label>Deadline</mat-label>
<input matInput [matDatepicker]="deadlinepicker">
<mat-hint>MM/DD/YYYY</mat-hint>
<mat-datepicker-toggle matIconSuffix [for]="deadlinepicker"></mat-datepicker-toggle>
<mat-datepicker #deadlinepicker></mat-datepicker>
</mat-form-field>-->
</div>

View File

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

View File

@ -0,0 +1,19 @@
import { Component, OnInit } from '@angular/core';
import {FormControl, Validators} from "@angular/forms";
@Component({
selector: 'app-task-editor',
templateUrl: './task-editor.component.html',
styleUrls: ['./task-editor.component.css']
})
export class TaskEditorComponent implements OnInit {
nameCtrl = new FormControl('', [Validators.required, Validators.maxLength(255)])
etaCtrl = new FormControl(0, [Validators.required, Validators.min(0)])
startDate = new FormControl(Date.now(), [Validators.required])
constructor() { }
ngOnInit(): void {
}
}