make sure we can change the temperature duration key for the chart.

pull/262/head
Jason Kulatunga 2 years ago
parent 934f16f0a5
commit 399a2450ff

@ -126,19 +126,20 @@
matTooltip="not yet implemented"
mat-button
[matMenuTriggerFor]="tempRangeMenu">
<span class="font-medium text-sm text-hint">1 week</span>
<span class="font-medium text-sm text-hint">{{tempDurationKey}}</span>
</button>
<mat-menu #tempRangeMenu="matMenu">
<button mat-menu-item>1 month</button>
<button mat-menu-item>12 months</button>
<button mat-menu-item>all time</button>
<button (click)="changeSummaryTempDuration('forever')" mat-menu-item>forever</button>
<button (click)="changeSummaryTempDuration('year')" mat-menu-item>year</button>
<button (click)="changeSummaryTempDuration('month')" mat-menu-item>month</button>
<button (click)="changeSummaryTempDuration('week')" mat-menu-item>week</button>
</mat-menu>
</div>
</div>
</div>
<div class="flex flex-col flex-auto">
<apx-chart *ngIf="temperatureOptions" class="flex-auto w-full h-full"
<apx-chart #tempChart *ngIf="temperatureOptions" class="flex-auto w-full h-full"
[chart]="temperatureOptions.chart"
[colors]="temperatureOptions.colors"
[fill]="temperatureOptions.fill"

@ -3,7 +3,7 @@ import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { ApexOptions } from 'ng-apexcharts';
import {ApexOptions, ChartComponent} from 'ng-apexcharts';
import { DashboardService } from 'app/modules/dashboard/dashboard.service';
import * as moment from 'moment';
import {MatDialog} from '@angular/material/dialog';
@ -25,9 +25,11 @@ export class DashboardComponent implements OnInit, AfterViewInit, OnDestroy
data: any;
temperatureOptions: ApexOptions;
config: AppConfig;
tempDurationKey: string = "forever"
// Private
private _unsubscribeAll: Subject<any>;
@ViewChild("tempChart", { static: false }) tempChart: ChartComponent;
/**
* Constructor
@ -283,6 +285,31 @@ export class DashboardComponent implements OnInit, AfterViewInit, OnDestroy
}
}
/*
DURATION_KEY_WEEK = "week"
DURATION_KEY_MONTH = "month"
DURATION_KEY_YEAR = "year"
DURATION_KEY_FOREVER = "forever"
*/
changeSummaryTempDuration(durationKey: string){
this.tempDurationKey = durationKey
this._smartService.getSummaryTempData(durationKey)
.subscribe((data) => {
// given a list of device temp history, override the data in the "summary" object.
for(const wwn in this.data.data.summary) {
// console.log(`Updating ${wwn}, length: ${this.data.data.summary[wwn].temp_history.length}`)
this.data.data.summary[wwn].temp_history = data.data.temp_history[wwn] || []
}
// Prepare the chart series data
this.tempChart.updateSeries(this._deviceDataTemperatureSeries())
});
}
/**
* Track by function for ngFor loops
*

@ -31,6 +31,6 @@ export class DashboardResolver implements Resolve<any>
*/
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any>
{
return this._dashboardService.getData();
return this._dashboardService.getSummaryData();
}
}

@ -44,7 +44,7 @@ export class DashboardService
/**
* Get data
*/
getData(): Observable<any>
getSummaryData(): Observable<any>
{
return this._httpClient.get(getBasePath() + '/api/summary').pipe(
tap((response: any) => {
@ -52,4 +52,14 @@ export class DashboardService
})
);
}
getSummaryTempData(durationKey: string): Observable<any>
{
let params = {}
if(durationKey){
params["duration_key"] = durationKey
}
return this._httpClient.get(getBasePath() + '/api/summary/temp', {params: params});
}
}

Loading…
Cancel
Save