diff --git a/public/app/plugins/panel/alertlist/README.md b/public/app/plugins/panel/alertlist/README.md new file mode 100644 index 00000000000..bc01e2ff1d1 --- /dev/null +++ b/public/app/plugins/panel/alertlist/README.md @@ -0,0 +1 @@ +# Alert List Panel - Native plugin diff --git a/public/app/plugins/panel/alertlist/editor.html b/public/app/plugins/panel/alertlist/editor.html new file mode 100644 index 00000000000..13acc0ebbbb --- /dev/null +++ b/public/app/plugins/panel/alertlist/editor.html @@ -0,0 +1,12 @@ +
+
+
Options
+
+ Show +
+ +
+
+ +
+
diff --git a/public/app/plugins/panel/alertlist/img/icn-singlestat-panel.svg b/public/app/plugins/panel/alertlist/img/icn-singlestat-panel.svg new file mode 100644 index 00000000000..a1e15d4d58d --- /dev/null +++ b/public/app/plugins/panel/alertlist/img/icn-singlestat-panel.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/app/plugins/panel/alertlist/module.html b/public/app/plugins/panel/alertlist/module.html new file mode 100644 index 00000000000..450a09960c7 --- /dev/null +++ b/public/app/plugins/panel/alertlist/module.html @@ -0,0 +1,59 @@ +
+
+ +
    +
  1. +
    +
    +
    + + + +
    +
    +
    +
    + +
    + + + {{alert.stateModel.text}} + for {{alert.newStateDateAgo}} +
    +
    + {{alert.executionError}} +
    +
    +
    +
    +
  2. +
+
+ + +
+
    +
  1. +
    +
    +
    +
    + + + {{al.stateModel.text}} + {{al.metrics}} +
    +
    + {{al.time}} +
    +
    +
    +
    +
  2. +
+
+
diff --git a/public/app/plugins/panel/alertlist/module.ts b/public/app/plugins/panel/alertlist/module.ts new file mode 100644 index 00000000000..40c5af02133 --- /dev/null +++ b/public/app/plugins/panel/alertlist/module.ts @@ -0,0 +1,75 @@ +/// + +import _ from 'lodash'; +import moment from 'moment'; +import alertDef from '../../../features/alerting/alert_def'; +import config from 'app/core/config'; +import {PanelCtrl} from 'app/plugins/sdk'; + +class AlertListPanel extends PanelCtrl { + static templateUrl = 'module.html'; + + showOptions = [ + {text: 'Current state', value: 'current'}, + {text: 'State changes', value: 'changes'}, + ]; + + currentAlerts: any = []; + alertHistory: any = []; + // Set and populate defaults + panelDefaults = { + show: 'current' + }; + + /** @ngInject */ + constructor($scope, $injector, private $location, private backendSrv) { + super($scope, $injector); + _.defaults(this.panel, this.panelDefaults); + + this.events.on('init-edit-mode', this.onInitEditMode.bind(this)); + this.events.on('render', this.onRender.bind(this)); + this.events.on('refresh', this.onRender.bind(this)); + } + + onRender() { + if (this.panel.show === 'current') { + this.getCurrentAlertState(); + } + + if (this.panel.show === 'changes') { + this.getAlertHistory(); + } + } + + getAlertHistory() { + this.backendSrv.get(`/api/alert-history?dashboardId=32&panelId=1`) + .then(res => { + this.alertHistory = _.map(res, al => { + al.time = moment(al.timestamp).format('MMM D, YYYY HH:mm:ss'); + al.stateModel = alertDef.getStateDisplayModel(al.newState); + return al; + }); + }); + } + + getCurrentAlertState() { + this.backendSrv.get(`/api/alerts`) + .then(res => { + this.currentAlerts = _.map(res, al => { + al.stateModel = alertDef.getStateDisplayModel(al.state); + al.newStateDateAgo = moment(al.newStateDate).fromNow().replace(" ago", ""); + + return al; + }); + }); + } + + onInitEditMode() { + this.addEditorTab('Options', 'public/app/plugins/panel/alertlist/editor.html'); + } +} + +export { + AlertListPanel, + AlertListPanel as PanelCtrl +} diff --git a/public/app/plugins/panel/alertlist/plugin.json b/public/app/plugins/panel/alertlist/plugin.json new file mode 100644 index 00000000000..4767eec9e2a --- /dev/null +++ b/public/app/plugins/panel/alertlist/plugin.json @@ -0,0 +1,16 @@ +{ + "type": "panel", + "name": "Alert List", + "id": "alertlist", + + "info": { + "author": { + "name": "Grafana Project", + "url": "http://grafana.org" +}, + "logos": { + "small": "img/icn-singlestat-panel.svg", + "large": "img/icn-singlestat-panel.svg" + } + } +}