diff --git a/public/app/features/alerts/alert_def.ts b/public/app/features/alerts/alert_def.ts index a51716f19dc..2cb48c174cc 100644 --- a/public/app/features/alerts/alert_def.ts +++ b/public/app/features/alerts/alert_def.ts @@ -3,9 +3,9 @@ //import _ from 'lodash'; var alertStateToCssMap = { - "OK": "icon-gf-online alert-state-online", - "WARN": "icon-gf-warn alert-state-warn", - "CRITICAL": "icon-gf-critical alert-state-critical", + "OK": "icon-gf-online alert-icon-online", + "WARN": "icon-gf-warn alert-icon-warn", + "CRITICAL": "icon-gf-critical alert-icon-critical", "ACKNOWLEDGED": "icon-gf-alert-disabled" }; diff --git a/public/app/plugins/panel/graph/alert_tab_ctrl.ts b/public/app/plugins/panel/graph/alert_tab_ctrl.ts index e55c9b1ceec..226f76f8243 100644 --- a/public/app/plugins/panel/graph/alert_tab_ctrl.ts +++ b/public/app/plugins/panel/graph/alert_tab_ctrl.ts @@ -8,9 +8,10 @@ export class AlertTabCtrl { panel: any; panelCtrl: any; alerting: any; + metricTargets = [{ refId: '- select query -' } ]; /** @ngInject */ - constructor($scope) { + constructor($scope, private $timeout) { $scope.alertTab = this; //HACK ATTACK! this.panelCtrl = $scope.ctrl; this.panel = this.panelCtrl.panel; @@ -18,18 +19,26 @@ export class AlertTabCtrl { this.panel.alerting.aggregator = this.panel.alerting.aggregator || 'avg'; this.panel.alerting.interval = this.panel.alerting.interval || '60s'; this.panel.alerting.queryRange = this.panel.alerting.queryRange || '10m'; + this.panel.alerting.warnOperator = this.panel.alerting.warnOperator || '>'; + this.panel.alerting.critOperator = this.panel.alerting.critOperator || '>'; + this.panel.alerting.title = this.panel.alerting.title || this.panel.title + ' alert'; + + this.panel.targets.map(target => { + this.metricTargets.push(target); + }); + this.panel.alerting.queryRef = this.panel.alerting.queryRef || this.metricTargets[0].refId; this.convertThresholdsToAlertThresholds(); } convertThresholdsToAlertThresholds() { if (this.panel.grid && this.panel.grid.threshold1) { - this.panel.alerting.warnOperator = '<'; + this.panel.alerting.warnOperator = '>'; this.panel.alerting.warnLevel = this.panel.grid.threshold1; } if (this.panel.grid && this.panel.grid.threshold2) { - this.panel.alerting.critOperator = '<'; + this.panel.alerting.critOperator = '>'; this.panel.alerting.critLevel = this.panel.grid.threshold2; } } diff --git a/public/app/plugins/panel/graph/partials/tab_alerting.html b/public/app/plugins/panel/graph/partials/tab_alerting.html index 101a81859eb..addb6932d4d 100644 --- a/public/app/plugins/panel/graph/partials/tab_alerting.html +++ b/public/app/plugins/panel/graph/partials/tab_alerting.html @@ -3,17 +3,17 @@
Query
Query to watch -
+
+ ng-options="target.refId as target.refId for target in alertTab.metricTargets">
Thresholds
- + Warn level
@@ -23,7 +23,7 @@
- + Critical level
diff --git a/public/sass/components/_alerts.scss b/public/sass/components/_alerts.scss index 7950a85bbcb..9f67f84d499 100644 --- a/public/sass/components/_alerts.scss +++ b/public/sass/components/_alerts.scss @@ -7,15 +7,15 @@ // ------------------------- -.alert-state-online { +.alert-icon-online { color: $online; } -.alert-state-warn { +.alert-icon-warn { color: $warn; } -.alert-state-critical { +.alert-icon-critical { color: $critical; }