diff --git a/public/app/features/alerts/alert_def.ts b/public/app/features/alerts/alert_def.ts
new file mode 100644
index 00000000000..382d4dc43b7
--- /dev/null
+++ b/public/app/features/alerts/alert_def.ts
@@ -0,0 +1,19 @@
+///
+
+//import _ from 'lodash';
+
+var alertStateToCssMap = {
+ "OK": "icon-gf-online",
+ "WARN": "icon-gf-warn",
+ "CRITICAL": "icon-gf-critical",
+ "ACKNOWLEDGED": "icon-gf-alert-disabled"
+
+};
+
+function getCssForState(alertState) {
+ return alertStateToCssMap[alertState];
+}
+
+export default {
+ getCssForState
+};
diff --git a/public/app/features/alerts/alert_log_ctrl.ts b/public/app/features/alerts/alert_log_ctrl.ts
index 191f6337e99..4b6490ffa83 100644
--- a/public/app/features/alerts/alert_log_ctrl.ts
+++ b/public/app/features/alerts/alert_log_ctrl.ts
@@ -4,6 +4,8 @@ import angular from 'angular';
import _ from 'lodash';
import coreModule from '../../core/core_module';
import config from 'app/core/config';
+import alertDef from './alert_def';
+import moment from 'moment';
export class AlertLogCtrl {
@@ -22,6 +24,11 @@ export class AlertLogCtrl {
loadAlertLogs() {
this.backendSrv.get('/api/alerts/events/' + this.alertId).then(result => {
this.alertLogs = result;
+
+ _.each(this.alertLogs, log => {
+ log.iconCss = alertDef.getCssForState(log.newState);
+ log.humanTime = moment(log.created).format("YYYY-MM-DD HH:mm:ss");
+ });
});
this.backendSrv.get('/api/alerts/' + this.alertId).then(result => {
diff --git a/public/app/features/alerts/partials/alert_log.html b/public/app/features/alerts/partials/alert_log.html
index 028b9bfc638..512432267c4 100644
--- a/public/app/features/alerts/partials/alert_log.html
+++ b/public/app/features/alerts/partials/alert_log.html
@@ -9,15 +9,15 @@
Status |
- Time |
+ Time |
Description |
- {{alertLog.newState}}
+
|
- {{alertLog.created}}
+ {{alertLog.humanTime}}
|
{{alertLog.info}}
|