TSK-355: updated report strucutre

This commit is contained in:
Mustapha Zorgati 2018-03-28 13:49:01 +02:00
parent aeb7bc49ee
commit 906aa8f386
8 changed files with 56 additions and 43 deletions

View File

@ -1,7 +0,0 @@
export class ReportMeta {
name: string;
date: string;
header: Array<string>;
rowDesc: string;
totalDesc: string;
}

View File

@ -1,11 +0,0 @@
import { ReportMeta } from "./report-meta";
export class ReportModel {
meta: ReportMeta;
// The keys of the rows object are unknown. They represent the name of that specific row.
// Each row (value of rows Object) has two keys: 'cells:Object' and 'total:number'.
// The keys of 'cells' are the same as 'meta.header:number'.
// This also applies to sumRow.
rows: Object;
sumRow: Object;
}

View File

@ -1,21 +1,21 @@
<div class="row" *ngIf="model"> <div class="row" *ngIf="isDataAvailable">
<div class="col-sm-12" style="margin-bottom: 10px"> <div class="col-sm-12" style="margin-bottom: 10px">
<h4>{{model.meta.name}} ({{model.meta.date | date : 'dd.MM.yyyy HH:mm:ss'}})</h4> <h4>{{meta.name}} ({{meta.date | date : 'dd.MM.yyyy HH:mm:ss'}})</h4>
<table class="table table-responsive table-condensed"> <table class="table table-responsive table-condensed">
<tr> <tr>
<th>{{model.meta.rowDesc}}</th> <th>{{meta.rowDesc}}</th>
<th *ngFor="let header of model.meta.header">{{header}}</th> <th *ngFor="let header of meta.header">{{header}}</th>
<th>{{model.meta.totalDesc}}</th> <th>{{meta.totalDesc}}</th>
</tr> </tr>
<tr *ngFor="let row of model.rows | mapToIterable | orderBy:['key']"> <tr *ngFor="let row of rows | mapToIterable | orderBy:['key']">
<td>{{row.key}}</td> <td>{{row.key}}</td>
<td *ngFor="let header of model.meta.header">{{row.val.cells[header]}}</td> <td *ngFor="let header of meta.header">{{row.val.cells[header]}}</td>
<th>{{row.val.total}}</th> <th>{{row.val.total}}</th>
</tr> </tr>
<tr> <tr>
<th>{{model.meta.totalDesc}}</th> <th>{{meta.totalDesc}}</th>
<th *ngFor="let header of model.meta.header">{{model.sumRow.cells[header]}}</th> <th *ngFor="let header of meta.header">{{sumRow.cells[header]}}</th>
<th>{{model.sumRow.total}}</th> <th>{{sumRow.total}}</th>
</tr> </tr>
</table> </table>
</div> </div>

View File

@ -1,5 +1,7 @@
import { Component, Input, OnInit } from "@angular/core"; import { Component, Input, OnInit } from "@angular/core";
import { ReportModel } from "../model/report"; import { RestConnectorService } from "../service/rest-connector.service";
import { error } from "util";
import { ReportType } from "./reportType";
@Component({ @Component({
selector: 'report', selector: 'report',
@ -8,14 +10,46 @@ import { ReportModel } from "../model/report";
export class Report implements OnInit { export class Report implements OnInit {
@Input() @Input()
model: ReportModel; type: ReportType;
constructor() { meta: ReportMeta;
/*
* The keys of the rows object are unknown. They represent the name of that specific row.
* Each row (value of rows Object) has two keys: 'cells:Object' and 'total:number'.
* The keys of 'cells' are the same as 'meta.header:number'.
* This also applies to sumRow.
*/
rows: Object;
sumRow: Object;
private isDataAvailable: boolean = false;
constructor(private restConnector: RestConnectorService) {
} }
ngOnInit(): void { ngOnInit(): void {
switch (this.type) {
case ReportType.WorkbasketStatus:
this.restConnector.getTaskStatusReport().subscribe(res => {
this.meta = res['meta'];
this.rows = res['rows'];
this.sumRow = res['sumRow'];
this.isDataAvailable = true;
});
break;
default:
error("unknown ReportType '" + this.type + "'");
}
}
} }
class ReportMeta {
name: string;
date: string;
header: Array<string>;
rowDesc: string;
totalDesc: string;
} }

View File

@ -0,0 +1,3 @@
export enum ReportType {
WorkbasketStatus
}

View File

@ -4,7 +4,6 @@ import { environment } from '../../environments/environment';
import { Observable } from 'rxjs/Observable'; import { Observable } from 'rxjs/Observable';
import { State } from '../model/state'; import { State } from '../model/state';
import { WorkbasketCounter } from '../model/workbasket-counter'; import { WorkbasketCounter } from '../model/workbasket-counter';
import { ReportModel } from "../model/report";
@Injectable() @Injectable()
export class RestConnectorService { export class RestConnectorService {
@ -23,7 +22,7 @@ export class RestConnectorService {
.map(res => res.json()); .map(res => res.json());
} }
getTaskStatusReport(): Observable<ReportModel> { getTaskStatusReport(): Observable<Object> {
return this.http.get(environment.taskanaRestUrl + "/v1/monitor/taskStatusReport", this.createAuthorizationHeader()) return this.http.get(environment.taskanaRestUrl + "/v1/monitor/taskStatusReport", this.createAuthorizationHeader())
.map(res => res.json()); .map(res => res.json());
} }

View File

@ -1,4 +1,4 @@
<div style="display: block" *ngIf="isDataAvailable"> <div style="display: block" *ngIf="isDataAvailable">
<canvas baseChart [data]="pieChartData" [labels]="pieChartLabels" [chartType]="pieChartType"></canvas> <canvas baseChart [data]="pieChartData" [labels]="pieChartLabels" [chartType]="pieChartType"></canvas>
</div> </div>
<report *ngIf="isDataAvailable" [model]="taskStatusReport"></report> <report [type]="reportType"></report>

View File

@ -1,7 +1,6 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { RestConnectorService } from '../service/rest-connector.service'; import { RestConnectorService } from '../service/rest-connector.service';
import { Report } from "../report/report.component"; import { ReportType } from "../report/reportType";
import { ReportModel } from "../model/report";
@Component({ @Component({
selector: 'tasks', selector: 'tasks',
@ -16,8 +15,7 @@ export class TasksComponent implements OnInit {
pieChartData: number[] = []; pieChartData: number[] = [];
pieChartType: string = 'pie'; pieChartType: string = 'pie';
isDataAvailable: boolean = false; isDataAvailable: boolean = false;
report: Report; reportType = ReportType.WorkbasketStatus;
taskStatusReport: ReportModel;
constructor(private restConnectorService: RestConnectorService) { constructor(private restConnectorService: RestConnectorService) {
} }
@ -39,10 +37,7 @@ export class TasksComponent implements OnInit {
} else { } else {
this.pieChartData.push(0); this.pieChartData.push(0);
} }
});
this.restConnectorService.getTaskStatusReport().subscribe(report => {
this.taskStatusReport = report;
this.isDataAvailable = true; this.isDataAvailable = true;
}) });
} }
} }