Merged branch comments/dashbaord
This commit is contained in:
		| @@ -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"> | ||||
|   | ||||
| @@ -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; | ||||
|   | ||||
		Reference in New Issue
	
	Block a user