sebastian/timemanager
Template
1
0
Fork 0
Code Issues 11 Pull Requests Actions Packages Projects Releases Wiki Activity

Design of TaskEditor and automatically inserting new tasks after creation

Browse Source
This commit is contained in:
Sebastian 2023-10-22 10:21:39 +02:00
parent 72e56efea3
commit d6116729fd
5 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/taskgroups/taskgroup-dashboard/taskgroup-dashboard.component.html
View File

@ -18,7 +18,7 @@
<mat-card style="width: 100%"> <mat-card style="width: 100%">
<mat-card-content> <mat-card-content>
<app-task-dashboard [taskgroupID]="taskgroupID"></app-task-dashboard> <app-task-dashboard #taskDashboard [taskgroupID]="taskgroupID"></app-task-dashboard>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
<div style="width: 100%"> <div style="width: 100%">

11
frontend/src/app/taskgroups/taskgroup-dashboard/taskgroup-dashboard.component.ts
View File

@ -1,4 +1,4 @@
import { Component, OnInit } from '@angular/core'; import {Component, OnInit, ViewChild} from '@angular/core';
import {MatDialog as MatDialog} from "@angular/material/dialog"; import {MatDialog as MatDialog} from "@angular/material/dialog";
import {TaskgroupCreationComponent} from "../taskgroup-creation/taskgroup-creation.component"; import {TaskgroupCreationComponent} from "../taskgroup-creation/taskgroup-creation.component";
import {TaskgroupEntityInfo, TaskgroupService} from "../../../api"; import {TaskgroupEntityInfo, TaskgroupService} from "../../../api";
@ -6,6 +6,7 @@ import {TaskgroupDeletionComponent} from "../taskgroup-deletion/taskgroup-deleti
import {ActivatedRoute} from "@angular/router"; import {ActivatedRoute} from "@angular/router";
import {TaskEditorComponent} from "../../tasks/task-editor/task-editor.component"; import {TaskEditorComponent} from "../../tasks/task-editor/task-editor.component";
import {TaskEditorData} from "../../tasks/task-editor/TaskEditorData"; import {TaskEditorData} from "../../tasks/task-editor/TaskEditorData";
import {TaskDashboardComponent} from "../../tasks/task-dashboard/task-dashboard.component";
@Component({ @Component({
selector: 'app-taskgroup-dashboard', selector: 'app-taskgroup-dashboard',
@ -20,6 +21,7 @@ export class TaskgroupDashboardComponent implements OnInit {
taskgroups: TaskgroupEntityInfo[] = [] taskgroups: TaskgroupEntityInfo[] = []
taskgroupID: number = -1; taskgroupID: number = -1;
@ViewChild("taskDashboard") taskDashboard: TaskDashboardComponent | undefined
ngOnInit(): void { ngOnInit(): void {
this.activatedRoute.paramMap.subscribe(params => { this.activatedRoute.paramMap.subscribe(params => {
@ -73,6 +75,11 @@ export class TaskgroupDashboardComponent implements OnInit {
task: undefined, task: undefined,
taskgroupID: this.taskgroupID taskgroupID: this.taskgroupID
} }
const dialogRef = this.dialog.open(TaskEditorComponent, {data: editorData, minWidth: "400px"}) const dialogRef = this.dialog.open(TaskEditorComponent, {data: editorData, width: "600px"})
dialogRef.afterClosed().subscribe(res => {
if(res != undefined) {
this.taskDashboard!.addTask(res);
}
})
} }
} }

5
frontend/src/app/tasks/task-dashboard/task-dashboard.component.ts
View File

@ -94,4 +94,9 @@ export class TaskDashboardComponent implements OnChanges{
} }
}) })
} }
addTask(task: TaskEntityInfo) {
const data = this.datasource.data;
data.push(task)
this.datasource.data = data;
}
} }

9
frontend/src/app/tasks/task-editor/task-editor.component.css
View File

@ -4,5 +4,12 @@
.date-form { .date-form {
width: 49%; width: 49%;
margin-right: 9px; }
#startDate {
float: left;
}
#endDate {
float: right;
} }

4
frontend/src/app/tasks/task-editor/task-editor.component.html
View File

@ -10,14 +10,14 @@
<mat-label>ETA</mat-label> <mat-label>ETA</mat-label>
<input matInput type="number" [formControl]="etaCtrl" min="0"> <input matInput type="number" [formControl]="etaCtrl" min="0">
</mat-form-field> </mat-form-field>
<mat-form-field class="date-form"> <mat-form-field class="date-form" id="startDate">
<mat-label>Startdate</mat-label> <mat-label>Startdate</mat-label>
<input matInput [matDatepicker]="startpicker" [formControl]="startDate"> <input matInput [matDatepicker]="startpicker" [formControl]="startDate">
<mat-hint>MM/DD/YYYY</mat-hint> <mat-hint>MM/DD/YYYY</mat-hint>
<mat-datepicker-toggle matIconSuffix [for]="startpicker"></mat-datepicker-toggle> <mat-datepicker-toggle matIconSuffix [for]="startpicker"></mat-datepicker-toggle>
<mat-datepicker #startpicker></mat-datepicker> <mat-datepicker #startpicker></mat-datepicker>
</mat-form-field> </mat-form-field>
<mat-form-field class="date-form"> <mat-form-field class="date-form" id="endDate">
<mat-label>Deadline</mat-label> <mat-label>Deadline</mat-label>
<input matInput [matDatepicker]="deadlinepicker" [formControl]="endDate"> <input matInput [matDatepicker]="deadlinepicker" [formControl]="endDate">
<mat-hint>MM/DD/YYYY</mat-hint> <mat-hint>MM/DD/YYYY</mat-hint>