/*-
* ========================LICENSE_START=================================
- * ORAN-OSC
+ * O-RAN-SC
* %%
- * Copyright (C) 2019 AT&T Intellectual Property and Nokia
+ * Copyright (C) 2019 AT&T Intellectual Property
* %%
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
import { Component, OnInit, ViewChildren, QueryList } from '@angular/core';
import { BaseChartDirective } from 'ng2-charts/ng2-charts';
import { StatsService } from '../services/stats/stats.service';
-import { MatSlideToggleChange } from "@angular/material/slide-toggle";
import { HttpClient } from '@angular/common/http';
-import { HttpHeaders } from "@angular/common/http";
-import { Observable } from "rxjs";
-import { HttpErrorResponse } from "@angular/common/http";
import { map } from 'rxjs/operators';
+import { DashboardSuccessTransport } from '../interfaces/dashboard.types';
+import { DomSanitizer, SafeUrl, SafeResourceUrl } from '@angular/platform-browser';
@Component({
- selector: 'app-stats',
+ selector: 'rd-stats',
templateUrl: './stats.component.html',
styleUrls: ['./stats.component.scss']
})
checked = false;
load;
delay;
+ metricsUrlAc : SafeResourceUrl;
+ metricsUrlMc : SafeResourceUrl;
public latencyChartColors: Array<any> = [
{ // blue
// the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin)
suggestedMin: 0,
// the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax)
-// suggestedMax: 1000
+ // suggestedMax: 1000
},
scaleLabel: {
display: true,
// the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin)
suggestedMin: 0,
// the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax)
-// suggestedMax: 1000
+ // suggestedMax: 1000
},
scaleLabel: {
display: true,
// the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin)
suggestedMin: 0,
// the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax)
-// suggestedMax: 1000
+ // suggestedMax: 1000
},
scaleLabel: {
display: true,
];
public x = 11;
-
public y = 11;
-
public z = 11;
public loop = true;
+ public sliderLoadMax = Number(this.service.loadMax) || 0;
+
+ public sliderDelayMax = Number(this.service.delayMax) || 0;
+
latencyClickData() {
// this.latencyChartData = [{data: [Math.random() * 100, Math.random() * 100, Math.random() * 100,
// Math.random() * 100, Math.random() * 100, Math.random() * 100, Math.random() * 100, Math.random() * 100,
this.loadChartLabels.shift();
child.datasets[0].data.shift();
- //const loadData = this.service.getLoad();
- //child.datasets[0].data.push(this.service.load);
+ // const loadData = this.service.getLoad();
+ // child.datasets[0].data.push(this.service.load);
child.datasets[0].data.push(metricsv['load']);
this.loadChartLabels.push('' + this.x++);
}
this.latencyChartLabels.shift();
child.datasets[0].data.shift();
- //const loadData = this.service.getLoad();
- //child.datasets[0].data.push(this.service.load);
+ // const loadData = this.service.getLoad();
+ // child.datasets[0].data.push(this.service.load);
child.datasets[0].data.push(metricsv['latency']);
this.latencyChartLabels.push('' + this.x++);
}
this.latencyChartLabels.shift();
child.datasets[0].data.shift();
- //const loadData = this.service.getLoad();
- //child.datasets[0].data.push(this.service.load);
+ // const loadData = this.service.getLoad();
+ // child.datasets[0].data.push(this.service.load);
child.datasets[0].data.push(metricsv['ricload']);
this.latencyChartLabels.push('' + this.x++);
}
});
this.cpuChartLabels = [...this.cpuChartLabels, label];
- console.log(this.cpuChartLabels);
- console.log(this.cpuChartData);
+ // console.log(this.cpuChartLabels);
+ // console.log(this.cpuChartData);
}
-
- public sliderLoadMax = Number(this.service.loadMax) || 0;
-
- public sliderDelayMax = Number(this.service.delayMax) || 0;
formatLabel(value: number | null) {
if (!value) {
return value;
}
- constructor(private service: StatsService, private httpClient: HttpClient) {
+ constructor(private service: StatsService, private httpClient: HttpClient, private sanitize: DomSanitizer) {
this.sliderLoadMax = Number(this.service.loadMax) || 0;
-
this.sliderDelayMax = Number(this.service.delayMax) || 0;
- console.log('this.sliderLoadMax: ' + this.sliderLoadMax);
- console.log('this.sliderDelayMax: ' + this.sliderDelayMax);
+ // console.log('this.sliderLoadMax: ' + this.sliderLoadMax);
+ // console.log('this.sliderDelayMax: ' + this.sliderDelayMax);
}
ngOnInit() {
this.fetchLoad().subscribe(loadv => {
- console.log('loadv: ' + loadv);
- this.checked = loadv;
- });
+ // console.log('loadv: ' + loadv);
+ this.checked = loadv;
+ });
this.fetchDelay().subscribe(delayv => {
- console.log('delayv: ' + delayv);
+ // console.log('delayv: ' + delayv);
this.delay = delayv;
});
this.fetchMetrics().subscribe(metricsv => {
- console.log('metricsv.load: ' + metricsv['load']);
-
+ // console.log('metricsv.load: ' + metricsv['load']);
+ });
+ this.service.getAppMetricsUrl('AC').subscribe((res:DashboardSuccessTransport) => {
+ this.metricsUrlAc = this.sanitize.bypassSecurityTrustResourceUrl(res.data);
+ });
+ this.service.getAppMetricsUrl('MC').subscribe((res:DashboardSuccessTransport) => {
+ this.metricsUrlMc = this.sanitize.bypassSecurityTrustResourceUrl(res.data);
});
}
if (this.timeLeft > 0) {
this.timeLeft--;
this.fetchMetrics().subscribe(metricsv => {
- console.log('metricsv.load: ' + metricsv['latency']);
- console.log('metricsv.load: ' + metricsv['load']);
- console.log('metricsv.load: ' + metricsv['ricload']);
+ // console.log('metricsv.load: ' + metricsv['latency']);
+ // console.log('metricsv.load: ' + metricsv['load']);
+ // console.log('metricsv.load: ' + metricsv['ricload']);
this.loopLoadData(metricsv);
});
-
+
} else {
this.timeLeft = 60;
}
pauseLoadTimer() {
clearInterval(this.interval);
}
-
+
fetchMetrics() {
return this.httpClient.get<any[]>(this.service.hostURL + this.service.metricsPath, this.service.httpOptions).pipe(map(res => {
- console.log(res);
- console.log(res['load']);
return res;
}));
}
fetchDelay() {
return this.httpClient.get<any[]>(this.service.hostURL + this.service.delayPath, this.service.httpOptions).pipe(map(res => {
- console.log(res);
- console.log(res['delay']);
const delayv = res['delay'];
- console.log(delayv);
this.delay = delayv;
return this.delay;
}));
}
-
+
saveDelay() {
- console.log(this.delay);
this.service.putDelay(this.delay);
}
-
+
fetchLoad() {
return this.httpClient.get<any[]>(this.service.hostURL + this.service.loadPath, this.service.httpOptions).pipe(map(res => {
- console.log(res);
- console.log(res['load']);
const loadv = res['load'];
- console.log(loadv);
this.load = loadv;
return this.load;
}));
-
+
}
-
+
saveLoad() {
- console.log(this.load);
this.service.putLoad(this.load);
}