Merged branch comments/dashbaord

This commit is contained in:
Nicolai Ort 2020-07-14 18:49:06 +02:00
commit b51bd226ea
2 changed files with 339 additions and 306 deletions

View File

@ -4,6 +4,8 @@
<div>
<div class="row px-3 py-2">
<!-- Show a message if no sprints exist yet, with a link to the page where a new one can be created -->
<ng-container *ngIf="selectedSprint === undefined">
<h3 class="mr-3 text-primary">Alle Userstories</h3>
<a [routerLink]="['sprints']"
@ -57,6 +59,7 @@
</select>
</label>
<!-- If the active sprint is selected: Show the number of remaining days + urgency -->
<span class="mr-5"></span>
<h3
*ngIf="selectedSprint === currentSprint"
@ -71,6 +74,8 @@
</div>
<div class="row">
<!-- Info on the userstories in the selected sprint -->
<div class="p-3 col-12 col-xl-6 col-lg-6 col-md-12 col-sm-12">
<div class="card">
<div class="card-header">

View File

@ -1,12 +1,7 @@
import { Component, OnChanges } from '@angular/core';
import { Component } from '@angular/core';
import { forkJoin } from 'rxjs';
import Chart from 'chart.js';
import {
BackendService,
ScrumSprint,
ScrumStatus,
ScrumUserstory,
} from '../../services/backend.service';
import { BackendService, ScrumSprint, ScrumStatus, ScrumUserstory } from '../../services/backend.service';
@Component({
selector: 'app-dashboard',
@ -25,6 +20,9 @@ export class DashboardComponent {
);
}
/**
* Returns all userstories in the selected sprint.
*/
public get selectedSprintUserstories(): ScrumUserstory[] {
if (this.selectedSprint === undefined) {
return this.userstories;
@ -34,6 +32,10 @@ export class DashboardComponent {
);
}
/**
* Returns the currently active sprint.
* If multiple sprints are active at the current time, any one of them may be returned.
*/
public get currentSprint(): ScrumSprint {
const now = Date.now();
return this.sprints.find(
@ -42,6 +44,10 @@ export class DashboardComponent {
}
private _selectedSprint: ScrumSprint;
/**
* Returns the sprint selected by the user.
*/
public get selectedSprint(): ScrumSprint {
if (this._selectedSprint === undefined) {
if (this.currentSprint === undefined) {
@ -52,15 +58,26 @@ export class DashboardComponent {
return this._selectedSprint;
}
/**
* Sets the sprint selected by the user.
*/
public set selectedSprint(value) {
this._selectedSprint = value;
this.createChart();
}
/** All status. */
public status: ScrumStatus[] = [];
/** All userstories. */
public userstories: ScrumUserstory[] = [];
/** All sprints. */
public sprints: ScrumSprint[] = [];
/**
* The pie chart showing the userstories in the selected sprint.
*/
public chart: Chart;
constructor(private backendService: BackendService) {
@ -89,9 +106,11 @@ export class DashboardComponent {
/**
* Returns the date in the following format: 1.7.2020
* @param dateValue an integer representing the number of milliseconds since the
* ECMAScript epoch -or- a string in a format recognized by the Date.parse() method.
*/
public toDateString(isoFormatString) {
const date = new Date(isoFormatString);
public toDateString(dateValue) {
const date = new Date(dateValue);
return `${date.getDate()}.${date.getMonth() + 1}.${date.getFullYear()}`;
}
@ -130,6 +149,9 @@ export class DashboardComponent {
}
}
/**
* Returns a sufficiently large array of background colors to be used in the chart.
*/
private getBackgroundColors(): string[] {
const baseColors = [
'rgb(255, 153, 102)',
@ -154,12 +176,18 @@ export class DashboardComponent {
return colors;
}
/**
* Returns the number of userstories in the selected sprint that have the given status.
*/
public getNumberOfUserstoriesByStatus(status: ScrumStatus): number {
return this.selectedSprintUserstories.filter(
(us) => us.statusid === status.id
).length;
}
/**
* Returns the days remaining until the end date of the selected sprint.
*/
public getRemainingDaysInSprint(): number {
if (this.selectedSprint === undefined) {
return undefined;