niggl/srumboard_frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

created dropdown to choose a user assigned to the task.

Browse Source
This commit is contained in:
test 2020-07-03 11:17:37 +02:00
parent f5dae215a4
commit c393afb7b8
2 changed files with 126 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

165
src/app/task-form/task-form.component.html
View File

@ -1,83 +1,118 @@
<div class="card" style="width: 100%;"> <div class="card" style="width: 100%;">
<div class="container"> <div class="container">
<div class="card-body"> <div class="card-body">
<div style="text-align: right;"> <div style="text-align: right;">
<i class="fa fa-times fa-2x" (click)="onClose()"></i> <i class="fa fa-times fa-2x" (click)="onClose()"></i>
</div> </div>
<div class="row"> <div class="row">
<div class="col-8" style="text-align: left;"> <div class="col-8" style="text-align: left;">
<h4 class="card-title">Neuen Task anlegen</h4> <h4 class="card-title">Neuen Task anlegen</h4>
<div ngbDropdown class="dropdown card-text"> <div ngbDropdown class="dropdown card-text">
<span ngbDropdownToggle class="dropdown" id="dropdownMenuUserstory" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <span ngbDropdownToggle class="dropdown" id="dropdownMenuUserstory" data-toggle="dropdown"
Gehört zu Story: {{getUserstoryTitleById(task.userstoryid) || "Keine"}} aria-haspopup="true" aria-expanded="false">
<i class="fa fa-caret-down"></i> Gehört zu Story: {{getUserstoryTitleById(task.userstoryid) || "Keine"}}
</span> <i class="fa fa-caret-down"></i>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenuUserstory"> </span>
<option ngbDropdownItem *ngFor="let userstory of userstories" (click)="task.userstoryid = userstory.id">{{ userstory.title }}</option> <div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenuUserstory">
<option ngbDropdownItem *ngFor="let userstory of userstories"
(click)="task.userstoryid = userstory.id">{{ userstory.title }}</option>
</div>
</div> </div>
</div> </div>
</div> <div class="col-4"></div>
<div class="col-4"></div>
</div>
<form (ngSubmit)="onSubmit()">
<div class="row">
<div class="col-8">
<div class="form-group">
<label for="Title">Titel</label>
<input type="text" class="form-control" id="Title" required name="title" [(ngModel)]="task.title" id="titleField"/>
</div>
<div class="form-group">
<label for="Inhalt">What to do?</label>
<textarea type="text" class="form-control" id="Story" required name="story" rows="5" [(ngModel)]="task.content"></textarea>
</div>
</div> </div>
<div class="col-4"> <form (ngSubmit)="onSubmit()">
<div class="row">
<div class="col-8">
<div class="form-group">
<label for="Title">Titel</label>
<input type="text" class="form-control" id="Title" required name="title"
[(ngModel)]="task.title" id="titleField" />
</div>
<div class="form-group">
<label for="Inhalt">What to do?</label>
<textarea type="text" class="form-control" id="Story" required name="story" rows="5"
[(ngModel)]="task.content"></textarea>
</div>
</div>
<div class="col-4">
<div ngbDropdown class="dropdown"> <div ngbDropdown class="dropdown">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Prio: {{task.priority}} Prio: {{task.priority}}
</button> </button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2"> <div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<option ngbDropdownItem *ngFor="let p of getAllPriorities()" (click)="task.priority=p">{{p}}</option> <option ngbDropdownItem *ngFor="let p of getAllPriorities()" (click)="task.priority=p">
{{p}}</option>
</div> </div>
</div> </div>
<div class="form-group"> <!-- Section to choose, create or delete a random status for the userstory. -->
<div ngbDropdown class="dropdown" [autoClose]="false"> <div class="form-group">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <div ngbDropdown class="dropdown" [autoClose]="false">
Status: {{getStatusTitleById(task.statusid)}} <button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
</button> id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2"> aria-expanded="false">
<div class="card-text" for="Inhalt">Status wählen</div> Status: {{getStatusTitleById(task.statusid)}}
<option disable-auto-close ngbDropdownItem *ngFor="let status of allStatus" (click)="task.statusid = status.id">{{ status.title }}</option> </button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<div class="dropdown-divider"></div> <div class="card-text" for="Inhalt">Status wählen</div>
<div class="card-text" for="Inhalt">Neuer Status</div> <option disable-auto-close ngbDropdownItem *ngFor="let status of allStatus"
<input #statusname type="text" id="statusname" class="dropdown-item" (change)="status.title=statusname.value" placeholder="New Title..." style="background-color: rgba(211, 211, 211, 0.342);"> (click)="task.statusid = status.id">{{ status.title }}</option>
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button" (click)="createTaskStatus(status)">Status anlegen</button>
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button" (click)="deleteStatus(task.statusid)">Status löschen</button> <div class="dropdown-divider"></div>
<div class="card-text" for="Inhalt">Neuer Status</div>
<input #statusname type="text" id="statusname" class="dropdown-item"
(change)="status.title=statusname.value" placeholder="New Title..."
style="background-color: rgba(211, 211, 211, 0.342);">
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="createTaskStatus(status)">Status anlegen</button>
<button disable-auto-close ngbDropdownItem class="dropdown-item" type="button"
(click)="deleteStatus(task.statusid)">Status löschen</button>
</div>
</div> </div>
</div> <div class="dropdown-menu">
<div class="dropdown-menu"> <select class="form-control custom-select mr-sm-2" id="prio" required name="prio"
<select class="form-control custom-select mr-sm-2" id="prio" required name="prio" [(ngModel)]="task.statusid"> [(ngModel)]="task.statusid">
<option *ngFor="let status of allStatus" [value]="status.id">{{ <option *ngFor="let status of allStatus" [value]="status.id">{{
status.title status.title
}}</option> }}</option>
</select> </select>
</div>
</div>
<!-- Section to choose an author for the userstory. -->
<div class="form-group">
<div ngbDropdown class="dropdown" [autoClose]="true">
<button ngbDropdownToggle class="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
Bearbeiter: {{getAuthorById(task.assignedtoid)}}
</button>
<div ngbDropdownMenu class="dropdown-menu" aria-labelledby="dropdownMenu2">
<div class="card-text" for="Inhalt">User wählen</div>
<option disable-auto-close ngbDropdownItem *ngFor="let user of allUser"
(click)="task.assignedtoid = user.id">{{ user.name }}</option>
</div>
</div>
<div class="dropdown-menu">
<select class="form-control custom-select mr-sm-2" id="prio" required name="prio"
[(ngModel)]="task.assignedtoid">
<option *ngFor="let user of allUser" [value]="user.id">{{
user.name
}}</option>
</select>
</div>
</div>
</div> </div>
</div> </div>
<div class="form-group"> <div class="row">
<label for="Inhalt">Assigned User</label> <div class="col-6">
<input type="text" class="form-control" id="Author" required name="author"/> <button (click)="onClose()" type="dismiss" class="btn btn-secondary" data-dismiss="modal">
Abbrechen
</button>
<button type="submit" class="btn btn-primary">Erstellen</button>
</div>
</div> </div>
</div> </form>
</div>
<div class="row">
<div class="col-6">
<button (click)="onClose()" type="dismiss" class="btn btn-secondary" data-dismiss="modal">
Abbrechen
</button>
<button type="submit" class="btn btn-primary">Erstellen</button>
</div> </div>
</div> </div>
</form></div>
</div>
</div> </div>

26
src/app/task-form/task-form.component.ts
View File

@ -26,10 +26,13 @@ export class TaskFormComponent implements OnInit {
public userstories: any[] = []; public userstories: any[] = [];
public allStatus: any[] = []; public allStatus: any[] = [];
public status: ScrumStatus = {title: "", description: ""}; public status: ScrumStatus = {title: "", description: ""};
public allUser: any[] = [];
public user: ScrumUser = { name: "" };
constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) { constructor(private backendService: BackendService, private activeModalService: NgbActiveModal) {
this.getUserStories(); this.getUserStories();
this.getTaskStatus(); this.getTaskStatus();
this.getAllUsers();
} }
ngOnInit(): void { ngOnInit(): void {
@ -155,4 +158,27 @@ export class TaskFormComponent implements OnInit {
} }
return status.title; return status.title;
} }
// Methods for choosing creator of a userstory.
getAllUsers() {
this.backendService.getUsers().subscribe((response) => {
if (response.status > 399) {
alert('Fehler');
} else {
this.allUser.push(...response.body);
}
});
}
getAuthorById(id: number): string {
if (!id) {
return null;
}
var user = this.allUser.find((x) => x.id === id);
if (!user) {
return null;
}
return user.name;
}
} }