Skip to content
This repository has been archived by the owner on Mar 23, 2020. It is now read-only.

Added separate dropdown for group by in time series graph [part of FOGL-1524] #334

Open
wants to merge 5 commits into
base: FOGL-1524
Choose a base branch
from
Open

Added separate dropdown for group by in time series graph [part of FOGL-1524] #334

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
12e6e65
added saperate dropdown for group by
MonikaSharma06 Oct 22, 2018
0d6e2ad
changes in field addon
MonikaSharma06 Oct 22, 2018
7824c1e
don't show dropdown if there is only one metric
MonikaSharma06 Oct 23, 2018
4d3ec2d
changes as per feedback
MonikaSharma06 Oct 24, 2018
9e9843d
Merge branch 'FOGL-1524' into FOGL-1524_b
MonikaSharma06 Nov 5, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
63 changes: 43 additions & 20 deletions src/app/components/core/asset-readings/series-graph/series-graph.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,27 +9,50 @@
</div>
</header>
<section class="modal-card-body">
<div class="columns is-mobile">
<div class="field">
<div *ngIf='readings' class="select is-small">
<select #selectedKey (change)="setReading(selectedKey.value)">
<option *ngFor="let reading of readings" [value]='reading' [selected]="readingKey == reading">{{reading}}</option>
</select>
</div>
</div>&nbsp;&nbsp;&nbsp;
<div class="field has-addons">
<p class="control">
<app-number-input-debounce placeholder="time (default 10)" (value)="setTimeValue($event)" [val]="timeValue"></app-number-input-debounce>
</p>
<p class="control">
<span class="select is-small">
<select #selectedTime (change)="setGroup(selectedTime.value)">
<option value="minutes" [selected]="optedGroup == 'minutes'">minutes</option>
<option value="hours" [selected]="optedGroup == 'hours'">hours</option>
<option value="seconds" [selected]="optedGroup == 'seconds'">seconds</option>
<div class="columns">
<div class="column">
<div *ngIf='readings' class="field">
<div *ngIf='readings.length > 1' class="select is-small is-fullwidth">
<select #selectedKey (change)="setReading(selectedKey.value)">
<option *ngFor="let reading of readings" [value]='reading' [selected]="readingKey == reading">{{reading}}</option>
</select>
</span>
</p>
</div>
<label *ngIf="readings.length == 1">{{readings[0]}}</label>
</div>
</div>
<div class="column">
<div class="field has-addons">
<p class="control">
<app-number-input-debounce placeholder="(default) 10" (value)="setTimeValue($event)" [val]="timeValue"></app-number-input-debounce>
</p>
<p class="control">
<span class="select is-small">
<select #selectedTimeUnit (change)="setTimeUnit(selectedTimeUnit.value)">
<option value="minutes" [selected]="timeUnit == 'minutes'">minutes</option>
<option value="hours" [selected]="timeUnit == 'hours'">hours</option>
<option value="seconds" [selected]="timeUnit == 'seconds'">seconds</option>
</select>
</span>
</p>
</div>
</div>
<div class="column">
<div class="field has-addons">
<p class="control">
<a class="button is-small is-static">
Group By
</a>
</p>
<p class="control">
<span class="select is-small">
<select #selectedTime (change)="setGroup(selectedTime.value)">
<option value="minutes" [selected]="optedGroup == 'minutes'">minutes</option>
<option value="hours" [selected]="optedGroup == 'hours'">hours</option>
<option value="seconds" [selected]="optedGroup == 'seconds'">seconds</option>
</select>
</span>
</p>
</div>
</div>
</div>
<div *ngIf="showSpinner" class="app-loading">
Expand Down
8 changes: 7 additions & 1 deletion src/app/components/core/asset-readings/series-graph/series-graph.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ export class SeriesGraphComponent implements OnDestroy {
public readingKey = '';
public optedGroup = 'minutes';
public timeValue = 10;
public timeUnit = 'minutes';
public readKeyColorLabel = [];
public showSpinner = false;
public MAX_RANGE = MAX_INT_SIZE;
Expand Down Expand Up @@ -92,6 +93,11 @@ export class SeriesGraphComponent implements OnDestroy {
this.plotSeriesGraph();
}

setTimeUnit(timeUnit) {
this.timeUnit = timeUnit;
this.plotSeriesGraph();
}

setTimeValue(time) {
if (time === null || time === undefined) {
time = 10;
Expand Down Expand Up @@ -153,7 +159,7 @@ export class SeriesGraphComponent implements OnDestroy {
if (this.readingKey === '') {
this.readingKey = this.readings[0];
}
this.assetService.getAssetAverage(this.assetCode, this.readingKey, this.optedGroup, this.timeValue).
this.assetService.getAssetAverage(this.assetCode, this.readingKey, this.optedGroup, this.timeValue, this.timeUnit).
subscribe(
(data: any[]) => {
if (data.length === 0) {
Expand Down
4 changes: 2 additions & 2 deletions src/app/services/assets.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,10 +64,10 @@ export class AssetsService {
catchError((error: Response) => observableThrowError(error)));
}

public getAssetAverage(assetCode: string, reading: string, group, time) {
public getAssetAverage(assetCode: string, reading: string, group, time, timeUnit) {
let params = new HttpParams();
params = params.append('group', group);
params = params.append(group, time);
params = params.append(timeUnit, time);
return this.http.get(this.GET_ASSET + '/' + encodeURIComponent(assetCode) + '/' + encodeURIComponent(reading) + '/series',
{ params: params }).pipe(
map(response => response),
Expand Down