diff --git a/monitor/src/app/app.module.ts b/monitor/src/app/app.module.ts index 1a428b26f..166c5a0c1 100644 --- a/monitor/src/app/app.module.ts +++ b/monitor/src/app/app.module.ts @@ -11,12 +11,19 @@ import { AngularSvgIconModule } from 'angular-svg-icon'; import { AppComponent } from './app.component'; import { TasksComponent } from './tasks/tasks.component'; import { WorkbasketComponent } from './workbasket/workbasket.component'; +import { Report } from "./report/report.component"; +import { MapToIterable } from "./pipes/mapToIterable"; +import { OrderBy } from "./pipes/orderBy"; @NgModule({ declarations: [ AppComponent, TasksComponent, WorkbasketComponent, + Report, + MapToIterable, + OrderBy + ], imports: [ BrowserModule, @@ -31,4 +38,5 @@ import { WorkbasketComponent } from './workbasket/workbasket.component'; providers: [HttpClientModule], bootstrap: [AppComponent] }) -export class AppModule { } +export class AppModule { +} diff --git a/monitor/src/app/model/report-meta.ts b/monitor/src/app/model/report-meta.ts new file mode 100644 index 000000000..bdcff3c88 --- /dev/null +++ b/monitor/src/app/model/report-meta.ts @@ -0,0 +1,7 @@ +export class ReportMeta { + name: string; + date: string; + header: Array; + rowDesc: string; + totalDesc: string; +} diff --git a/monitor/src/app/model/report.ts b/monitor/src/app/model/report.ts new file mode 100644 index 000000000..11b367b1d --- /dev/null +++ b/monitor/src/app/model/report.ts @@ -0,0 +1,11 @@ +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; +} diff --git a/monitor/src/app/pipes/mapToIterable.ts b/monitor/src/app/pipes/mapToIterable.ts new file mode 100644 index 000000000..bda3bf69b --- /dev/null +++ b/monitor/src/app/pipes/mapToIterable.ts @@ -0,0 +1,16 @@ +import { Pipe, PipeTransform } from '@angular/core'; + +@Pipe({ + name: 'mapToIterable' +}) +export class MapToIterable implements PipeTransform { + transform(dict: Object) { + let a = []; + for (let key in dict) { + if (dict.hasOwnProperty(key)) { + a.push({key: key, val: dict[key]}); + } + } + return a; + } +} diff --git a/monitor/src/app/pipes/orderBy.ts b/monitor/src/app/pipes/orderBy.ts new file mode 100644 index 000000000..ef1a391d4 --- /dev/null +++ b/monitor/src/app/pipes/orderBy.ts @@ -0,0 +1,25 @@ +import { Pipe, PipeTransform } from "@angular/core"; + +@Pipe({name: 'orderBy'}) + +export class OrderBy implements PipeTransform { + transform(records: Array, sortKeys?: string[]): any { + return records.sort(function (a, b) { + for (let i = 0; i < sortKeys.length; i++) { + let sortKey = sortKeys[i]; + let direction = 1; + if (sortKey.charAt(0) == "-") { + direction = -1; + sortKey = sortKey.substr(1); + } + + if (a[sortKey] < b[sortKey]) { + return -1 * direction; + } else if (a[sortKey] > b[sortKey]) { + return direction; + } + } + return 0; + }); + }; +} diff --git a/monitor/src/app/report/report.component.html b/monitor/src/app/report/report.component.html new file mode 100644 index 000000000..2ceed538e --- /dev/null +++ b/monitor/src/app/report/report.component.html @@ -0,0 +1,22 @@ +
+
+

{{model.meta.name}} ({{model.meta.date | date : 'dd.MM.yyyy HH:mm:ss'}})

+ + + + + + + + + + + + + + + + +
{{model.meta.rowDesc}}{{header}}{{model.meta.totalDesc}}
{{row.key}}{{row.val.cells[header]}}{{row.val.total}}
{{model.meta.totalDesc}}{{model.sumRow.cells[header]}}{{model.sumRow.total}}
+
+
diff --git a/monitor/src/app/report/report.component.ts b/monitor/src/app/report/report.component.ts new file mode 100644 index 000000000..6e423e0e5 --- /dev/null +++ b/monitor/src/app/report/report.component.ts @@ -0,0 +1,21 @@ +import { Component, Input, OnInit } from "@angular/core"; +import { ReportModel } from "../model/report"; + +@Component({ + selector: 'report', + templateUrl: './report.component.html' +}) +export class Report implements OnInit { + + @Input() + model: ReportModel; + + constructor() { + } + + ngOnInit(): void { + + } + + +} diff --git a/monitor/src/app/service/rest-connector.service.ts b/monitor/src/app/service/rest-connector.service.ts index 84020ed07..7ad62cb77 100644 --- a/monitor/src/app/service/rest-connector.service.ts +++ b/monitor/src/app/service/rest-connector.service.ts @@ -1,14 +1,16 @@ import { Injectable } from '@angular/core'; -import { RequestOptions, Headers, Http, Response } from '@angular/http'; +import { Headers, Http, RequestOptions } from '@angular/http'; import { environment } from '../../environments/environment'; import { Observable } from 'rxjs/Observable'; import { State } from '../model/state'; import { WorkbasketCounter } from '../model/workbasket-counter'; +import { ReportModel } from "../model/report"; @Injectable() export class RestConnectorService { - constructor(private http: Http) { } + constructor(private http: Http) { + } getTaskStatistics(): Observable { return this.http.get(environment.taskanaRestUrl + "/v1/monitor/countByState?states=READY,CLAIMED,COMPLETED", this.createAuthorizationHeader()) @@ -21,6 +23,11 @@ export class RestConnectorService { .map(res => res.json()); } + getTaskStatusReport(): Observable { + return this.http.get(environment.taskanaRestUrl + "/v1/monitor/taskStatusReport", this.createAuthorizationHeader()) + .map(res => res.json()); + } + private createAuthorizationHeader() { let headers: Headers = new Headers(); headers.append("Authorization", "Basic dXNlcl8xXzE6dXNlcl8xXzE="); diff --git a/monitor/src/app/tasks/tasks.component.html b/monitor/src/app/tasks/tasks.component.html index 20ac48f0f..0e1916ba7 100644 --- a/monitor/src/app/tasks/tasks.component.html +++ b/monitor/src/app/tasks/tasks.component.html @@ -1,3 +1,4 @@
+ diff --git a/monitor/src/app/tasks/tasks.component.ts b/monitor/src/app/tasks/tasks.component.ts index 37ea99db7..1a65321cd 100644 --- a/monitor/src/app/tasks/tasks.component.ts +++ b/monitor/src/app/tasks/tasks.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { RestConnectorService } from '../service/rest-connector.service'; -import { State } from '../model/state'; +import { Report } from "../report/report.component"; +import { ReportModel } from "../model/report"; @Component({ selector: 'tasks', @@ -15,8 +16,11 @@ export class TasksComponent implements OnInit { pieChartData: number[] = []; pieChartType: string = 'pie'; isDataAvailable: boolean = false; + report: Report; + taskStatusReport: ReportModel; - constructor(private restConnectorService: RestConnectorService) { } + constructor(private restConnectorService: RestConnectorService) { + } ngOnInit() { this.restConnectorService.getTaskStatistics().subscribe(data => { @@ -35,7 +39,10 @@ export class TasksComponent implements OnInit { } else { this.pieChartData.push(0); } - this.isDataAvailable = true; }); + this.restConnectorService.getTaskStatusReport().subscribe(report => { + this.taskStatusReport = report; + this.isDataAvailable = true; + }) } }