Browse Source

Alerting web hooks tab hastic version #101 (#104)

* Add Webhooks tab

* Remove old unused method

* Change alert status and send it to server
master
rozetko 6 years ago committed by Alexey Velikiy
parent
commit
3f5f8de7b4
  1. 5
      src/controllers/analytic_controller.ts
  2. 8
      src/models/analytic_unit.ts
  3. 50
      src/module.ts
  4. 20
      src/partials/tab_webhooks.html
  5. 9
      src/services/analytic_service.ts

5
src/controllers/analytic_controller.ts

@ -330,6 +330,11 @@ export class AnalyticController {
} }
} }
async toggleAnalyticUnitAlert(analyticUnit: AnalyticUnit) {
analyticUnit.alert = analyticUnit.alert ? true : false;
await this._analyticService.setAnalyticUnitAlert(analyticUnit);
}
private async _runStatusWaiter(analyticUnit: AnalyticUnit) { private async _runStatusWaiter(analyticUnit: AnalyticUnit) {
if(analyticUnit === undefined || analyticUnit === null) { if(analyticUnit === undefined || analyticUnit === null) {
throw new Error('analyticUnit not defined'); throw new Error('analyticUnit not defined');

8
src/models/analytic_unit.ts

@ -37,7 +37,10 @@ export class AnalyticUnit {
this._panelObject = {}; this._panelObject = {};
} }
_.defaults(this._panelObject, { _.defaults(this._panelObject, {
name: 'AnalyticUnitName', confidence: 0.2, color: ANALYTIC_UNIT_COLORS[0], type: 'GENERAL' name: 'AnalyticUnitName',
color: ANALYTIC_UNIT_COLORS[0],
type: 'GENERAL',
alert: false
}); });
//this._metric = new Metric(_panelObject.metric); //this._metric = new Metric(_panelObject.metric);
@ -58,6 +61,9 @@ export class AnalyticUnit {
set color(value: string) { this._panelObject.color = value; } set color(value: string) { this._panelObject.color = value; }
get color(): string { return this._panelObject.color; } get color(): string { return this._panelObject.color; }
set alert(value: boolean) { this._panelObject.alert = value; }
get alert(): boolean { return this._panelObject.alert; }
get selected(): boolean { return this._selected; } get selected(): boolean { return this._selected; }
set selected(value: boolean) { this._selected = value; } set selected(value: boolean) { this._selected = value; }

50
src/module.ts

@ -254,10 +254,11 @@ class GraphCtrl extends MetricsPanelCtrl {
const partialPath = this.panelPath + 'partials'; const partialPath = this.panelPath + 'partials';
this.addEditorTab('Analytics', `${partialPath}/tab_analytics.html`, 2); this.addEditorTab('Analytics', `${partialPath}/tab_analytics.html`, 2);
this.addEditorTab('Axes', axesEditorComponent, 3); this.addEditorTab('Webhooks', `${partialPath}/tab_webhooks.html`, 3);
this.addEditorTab('Legend', `${partialPath}/tab_legend.html`, 4); this.addEditorTab('Axes', axesEditorComponent, 4);
this.addEditorTab('Display', `${partialPath}/tab_display.html`, 5); this.addEditorTab('Legend', `${partialPath}/tab_legend.html`, 5);
this.addEditorTab('Plugin info', `${partialPath}/tab_info.html`, 6); this.addEditorTab('Display', `${partialPath}/tab_display.html`, 6);
this.addEditorTab('Plugin info', `${partialPath}/tab_info.html`, 7);
this.subTabIndex = 0; this.subTabIndex = 0;
} }
@ -303,8 +304,6 @@ class GraphCtrl extends MetricsPanelCtrl {
range: this.range, range: this.range,
}); });
//this.onPredictionReceived(this.seriesList);
this.dataWarning = null; this.dataWarning = null;
const hasSomePoint = this.seriesList.some(s => s.datapoints.length > 0); const hasSomePoint = this.seriesList.some(s => s.datapoints.length > 0);
@ -337,41 +336,6 @@ class GraphCtrl extends MetricsPanelCtrl {
} }
onPredictionReceived(spanList) {
var predictions = [];
for (var span of spanList) {
var predictionLow = {
target: '',
color: '',
datapoints: []
};
var predictionHigh = {
target: '',
color: '',
datapoints: []
};
for (var datapoint of span.datapoints) {
predictionHigh.datapoints.push([datapoint[0] + 2, datapoint[1]]);
predictionLow.datapoints.push([datapoint[0] - 2, datapoint[1]]);
}
predictionHigh.target = `${span.label} high`;
predictionLow.target = `${span.label} low`;
predictionHigh.color = span.color;
predictionLow.color = span.color;
predictions.push(predictionHigh, predictionLow);
}
var predictionSeries = this.processor.getSeriesList({
dataList: predictions,
range: this.range
});
for (var serie of predictionSeries) {
serie.prediction = true;
this.seriesList.push(serie);
}
}
onRender(data) { onRender(data) {
if (!this.seriesList) { if (!this.seriesList) {
return; return;
@ -551,6 +515,10 @@ class GraphCtrl extends MetricsPanelCtrl {
this.render(this.seriesList); this.render(this.seriesList);
} }
onAnalyticUnitAlertChange(analyticUnit: AnalyticUnit) {
this.analyticsController.toggleAnalyticUnitAlert(analyticUnit);
}
onColorChange(id: AnalyticUnitId, value: string) { onColorChange(id: AnalyticUnitId, value: string) {
if(id === undefined) { if(id === undefined) {
throw new Error('id is undefined'); throw new Error('id is undefined');

20
src/partials/tab_webhooks.html

@ -0,0 +1,20 @@
<div class="gf-form-button-row" ng-if="ctrl.analyticsController.serverStatus === false">
<h5>Hastic server at "{{ctrl.backendURL}}" is not available</h5>
<button class="btn btn-inverse" ng-click="ctrl.runBackendConnectivityCheck()">
<i class="fa fa-plug"></i>
Reconnect to Hastic server
</button>
</div>
<div ng-if="ctrl.analyticsController.serverStatus === true">
<h5> Enable webhooks </h5>
<div class="editor-row">
<div class="gf-form" ng-repeat="analyticUnit in ctrl.analyticsController.analyticUnits">
<label class="gf-form-label max-width-15"> {{ analyticUnit.name }} ({{ analyticUnit.type }}) </label>
<gf-form-switch
on-change="ctrl.onAnalyticUnitAlertChange(analyticUnit)"
checked="analyticUnit.alert"
/>
</div>
</div>
</div>

9
src/services/analytic_service.ts

@ -127,7 +127,14 @@ export class AnalyticService {
}; };
} }
private async _analyticRequest(method: string, url: string, data?) { async setAnalyticUnitAlert(analyticUnit: AnalyticUnit) {
return this.patch('/analyticUnits/alert', {
analyticUnitId: analyticUnit.id,
alert: analyticUnit.alert
});
}
private async _analyticRequest(method: string, url: string, data?: any) {
try { try {
method = method.toUpperCase(); method = method.toUpperCase();
url = this._backendURL + url; url = this._backendURL + url;

Loading…
Cancel
Save