From eb4f957eca2a045ad0d5cf0c1e79b9c08494b088 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Fri, 23 Sep 2016 17:09:38 +0200 Subject: Client: add requests stats page --- client/src/app/admin/admin.routes.ts | 2 + client/src/app/admin/index.ts | 1 + client/src/app/admin/menu-admin.component.html | 5 ++ client/src/app/admin/requests/index.ts | 4 ++ .../src/app/admin/requests/request-stats/index.ts | 1 + .../request-stats/request-stats.component.html | 18 +++++++ .../request-stats/request-stats.component.scss | 6 +++ .../request-stats/request-stats.component.ts | 59 ++++++++++++++++++++++ .../src/app/admin/requests/requests.component.ts | 8 +++ client/src/app/admin/requests/requests.routes.ts | 22 ++++++++ client/src/app/admin/requests/shared/index.ts | 2 + .../admin/requests/shared/request-stats.model.ts | 8 +++ .../app/admin/requests/shared/request.service.ts | 21 ++++++++ 13 files changed, 157 insertions(+) create mode 100644 client/src/app/admin/requests/index.ts create mode 100644 client/src/app/admin/requests/request-stats/index.ts create mode 100644 client/src/app/admin/requests/request-stats/request-stats.component.html create mode 100644 client/src/app/admin/requests/request-stats/request-stats.component.scss create mode 100644 client/src/app/admin/requests/request-stats/request-stats.component.ts create mode 100644 client/src/app/admin/requests/requests.component.ts create mode 100644 client/src/app/admin/requests/requests.routes.ts create mode 100644 client/src/app/admin/requests/shared/index.ts create mode 100644 client/src/app/admin/requests/shared/request-stats.model.ts create mode 100644 client/src/app/admin/requests/shared/request.service.ts (limited to 'client/src/app/admin') diff --git a/client/src/app/admin/admin.routes.ts b/client/src/app/admin/admin.routes.ts index 1fcace994..edb8ba49f 100644 --- a/client/src/app/admin/admin.routes.ts +++ b/client/src/app/admin/admin.routes.ts @@ -2,6 +2,7 @@ import { Routes } from '@angular/router'; import { AdminComponent } from './admin.component'; import { FriendsRoutes } from './friends'; +import { RequestsRoutes } from './requests'; import { UsersRoutes } from './users'; export const AdminRoutes: Routes = [ @@ -15,6 +16,7 @@ export const AdminRoutes: Routes = [ pathMatch: 'full' }, ...FriendsRoutes, + ...RequestsRoutes, ...UsersRoutes ] } diff --git a/client/src/app/admin/index.ts b/client/src/app/admin/index.ts index 3d0e67b15..493caed15 100644 --- a/client/src/app/admin/index.ts +++ b/client/src/app/admin/index.ts @@ -1,4 +1,5 @@ export * from './friends'; +export * from './requests'; export * from './users'; export * from './admin.component'; export * from './admin.routes'; diff --git a/client/src/app/admin/menu-admin.component.html b/client/src/app/admin/menu-admin.component.html index f821974bd..e250615aa 100644 --- a/client/src/app/admin/menu-admin.component.html +++ b/client/src/app/admin/menu-admin.component.html @@ -10,6 +10,11 @@ List friends + +
+ + Request stats +
diff --git a/client/src/app/admin/requests/index.ts b/client/src/app/admin/requests/index.ts new file mode 100644 index 000000000..236a9ee8f --- /dev/null +++ b/client/src/app/admin/requests/index.ts @@ -0,0 +1,4 @@ +export * from './request-stats'; +export * from './shared'; +export * from './requests.component'; +export * from './requests.routes'; diff --git a/client/src/app/admin/requests/request-stats/index.ts b/client/src/app/admin/requests/request-stats/index.ts new file mode 100644 index 000000000..be3a66f77 --- /dev/null +++ b/client/src/app/admin/requests/request-stats/index.ts @@ -0,0 +1 @@ +export * from './request-stats.component'; diff --git a/client/src/app/admin/requests/request-stats/request-stats.component.html b/client/src/app/admin/requests/request-stats/request-stats.component.html new file mode 100644 index 000000000..114fd371f --- /dev/null +++ b/client/src/app/admin/requests/request-stats/request-stats.component.html @@ -0,0 +1,18 @@ +

Requests stats

+ +
+
+ Interval seconds between requests: + {{ secondsInterval }} +
+ +
+ Remaining time before the scheduled request: + {{ remainingSeconds }} +
+ +
+ Total requests: + {{ stats.requests.length }} +
+
diff --git a/client/src/app/admin/requests/request-stats/request-stats.component.scss b/client/src/app/admin/requests/request-stats/request-stats.component.scss new file mode 100644 index 000000000..92c28dc99 --- /dev/null +++ b/client/src/app/admin/requests/request-stats/request-stats.component.scss @@ -0,0 +1,6 @@ +.label-description { + display: inline-block; + width: 350px; + font-weight: bold; + color: black; +} diff --git a/client/src/app/admin/requests/request-stats/request-stats.component.ts b/client/src/app/admin/requests/request-stats/request-stats.component.ts new file mode 100644 index 000000000..8ff4eb540 --- /dev/null +++ b/client/src/app/admin/requests/request-stats/request-stats.component.ts @@ -0,0 +1,59 @@ +import { Component, OnInit, OnDestroy } from '@angular/core'; + +import { RequestService, RequestStats } from '../shared'; + +@Component({ + selector: 'my-request-stats', + templateUrl: './request-stats.component.html', + styleUrls: [ './request-stats.component.scss' ] +}) +export class RequestStatsComponent implements OnInit, OnDestroy { + stats: RequestStats = null; + + private interval: NodeJS.Timer = null; + + constructor(private requestService: RequestService) { } + + ngOnInit() { + this.getStats(); + } + + ngOnDestroy() { + if (this.secondsInterval !== null) { + clearInterval(this.interval); + } + } + + get remainingSeconds() { + return Math.floor(this.stats.remainingMilliSeconds / 1000); + } + + get secondsInterval() { + return Math.floor(this.stats.milliSecondsInterval / 1000); + } + + getStats() { + this.requestService.getStats().subscribe( + stats => { + console.log(stats); + this.stats = stats; + this.runInterval(); + }, + + err => alert(err) + ); + } + + private runInterval() { + this.interval = setInterval(() => { + this.stats.remainingMilliSeconds -= 1000; + + if (this.stats.remainingMilliSeconds <= 0) { + setTimeout(() => this.getStats(), this.stats.remainingMilliSeconds + 100); + clearInterval(this.interval); + } + }, 1000); + } + + +} diff --git a/client/src/app/admin/requests/requests.component.ts b/client/src/app/admin/requests/requests.component.ts new file mode 100644 index 000000000..471112b45 --- /dev/null +++ b/client/src/app/admin/requests/requests.component.ts @@ -0,0 +1,8 @@ +import { Component } from '@angular/core'; + +@Component({ + template: '' +}) + +export class RequestsComponent { +} diff --git a/client/src/app/admin/requests/requests.routes.ts b/client/src/app/admin/requests/requests.routes.ts new file mode 100644 index 000000000..78221a9ff --- /dev/null +++ b/client/src/app/admin/requests/requests.routes.ts @@ -0,0 +1,22 @@ +import { Routes } from '@angular/router'; + +import { RequestsComponent } from './requests.component'; +import { RequestStatsComponent } from './request-stats'; + +export const RequestsRoutes: Routes = [ + { + path: 'requests', + component: RequestsComponent, + children: [ + { + path: '', + redirectTo: 'stats', + pathMatch: 'full' + }, + { + path: 'stats', + component: RequestStatsComponent + } + ] + } +]; diff --git a/client/src/app/admin/requests/shared/index.ts b/client/src/app/admin/requests/shared/index.ts new file mode 100644 index 000000000..32ab5767b --- /dev/null +++ b/client/src/app/admin/requests/shared/index.ts @@ -0,0 +1,2 @@ +export * from './request-stats.model'; +export * from './request.service'; diff --git a/client/src/app/admin/requests/shared/request-stats.model.ts b/client/src/app/admin/requests/shared/request-stats.model.ts new file mode 100644 index 000000000..7e4b26bca --- /dev/null +++ b/client/src/app/admin/requests/shared/request-stats.model.ts @@ -0,0 +1,8 @@ +export interface RequestStats { + milliSecondsInterval: number; + remainingMilliSeconds: number; + requests: { + request: any, + to: any + }[]; +} diff --git a/client/src/app/admin/requests/shared/request.service.ts b/client/src/app/admin/requests/shared/request.service.ts new file mode 100644 index 000000000..59d138039 --- /dev/null +++ b/client/src/app/admin/requests/shared/request.service.ts @@ -0,0 +1,21 @@ +import { Injectable } from '@angular/core'; +import { Observable } from 'rxjs/Observable'; + +import { RequestStats } from './request-stats.model'; +import { AuthHttp, RestExtractor } from '../../../shared'; + +@Injectable() +export class RequestService { + private static BASE_REQUEST_URL: string = '/api/v1/requests/'; + + constructor ( + private authHttp: AuthHttp, + private restExtractor: RestExtractor + ) {} + + getStats(): Observable { + return this.authHttp.get(RequestService.BASE_REQUEST_URL + 'stats') + .map(this.restExtractor.extractDataGet) + .catch((res) => this.restExtractor.handleError(res)); + } +} -- cgit v1.2.3