grafana-chartwerk-panel/src/models/options.ts

import { PanelOptions, Aggregation } from 'types';

import { filterMetricListByAlias, getAggregatedValueFromSerie } from '../utils';

// Convert Grafana options into Chartwerk Gauge options
export class Options {
  private minValue: number | undefined;
  private maxValue: number | undefined;

  constructor(private grafanaSeriesList: any[], private grafanaOptions: PanelOptions) {
    this._setMin();
    this._setMax();
  }

  private _setMin(): any {
    if(!this.grafanaOptions.gauge.min.metricName) {
      this.minValue = this.grafanaOptions.gauge.min.value;
      return;
    }
    const filteredSeries = filterMetricListByAlias(this.grafanaSeriesList, this.grafanaOptions.gauge.min.metricName, 'Min');
    const serie = filteredSeries[0];
    // Last value for now
    const aggregatedValue = getAggregatedValueFromSerie(serie, Aggregation.LAST);
    this.minValue = aggregatedValue ? aggregatedValue : undefined;
  }

  private _setMax(): any {
    if(!this.grafanaOptions.gauge.max.metricName) {
      this.maxValue = this.grafanaOptions.gauge.max.value;
      return;
    }
    const filteredSeries = filterMetricListByAlias(this.grafanaSeriesList, this.grafanaOptions.gauge.max.metricName, 'Max');
    const serie = filteredSeries[0];
    // Last value for now
    const aggregatedValue = getAggregatedValueFromSerie(serie, Aggregation.LAST);
    this.maxValue = aggregatedValue ? aggregatedValue : undefined;
  }

  public getChartwerkOptions(): any {
    console.log('opt', this.maxValue, this.minValue);
    return {
      maxValue: this.maxValue,
      minValue: this.minValue,
      valueFormatter: (val: any) => val.toFixed(2),
      defaultColor: 'green',
      reversed: this.grafanaOptions.gauge.reversed,
      stops: [
        {
          color: 'green',
          value: 100,
        },
        {
          color: 'orange',
          value: 140,
        },
      ],
      // @ts-ignore
      icons: [{ src: 'https://cityhost.ua/upload_img/blog5ef308ea5529c_trash2-01.jpg', position: 'middle', size: 30 }],
    };
  }
}