diff --git a/pkg/api/index.go b/pkg/api/index.go index 46dfc813259..e9d784cb652 100644 --- a/pkg/api/index.go +++ b/pkg/api/index.go @@ -99,7 +99,7 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) { data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{ Text: "Alerting", - Icon: "icon-gf icon-gf-monitoring", + Icon: "icon-gf icon-gf-alert", Url: setting.AppSubUrl + "/alerting/list", Children: alertChildNavs, }) diff --git a/pkg/services/sqlstore/alert.go b/pkg/services/sqlstore/alert.go index d47e742c82d..32c118d51b7 100644 --- a/pkg/services/sqlstore/alert.go +++ b/pkg/services/sqlstore/alert.go @@ -161,6 +161,7 @@ func upsertAlerts(existingAlerts []*m.Alert, cmd *m.SaveAlertsCommand, sess *xor alert.Updated = time.Now() alert.Created = time.Now() alert.State = m.AlertStatePending + alert.NewStateDate = time.Now() _, err := sess.Insert(alert) if err != nil { diff --git a/public/app/core/routes/routes.ts b/public/app/core/routes/routes.ts index afe8dca2534..03a104a72fb 100644 --- a/public/app/core/routes/routes.ts +++ b/public/app/core/routes/routes.ts @@ -194,6 +194,9 @@ function setupAngularRoutes($routeProvider, $locationProvider) { controllerAs: 'ctrl', templateUrl: 'public/app/features/styleguide/styleguide.html', }) + .when('/alerting', { + redirectTo: '/alerting/list' + }) .when('/alerting/list', { templateUrl: 'public/app/features/alerting/partials/alert_list.html', controller: 'AlertListCtrl', @@ -218,12 +221,6 @@ function setupAngularRoutes($routeProvider, $locationProvider) { controllerAs: 'ctrl', resolve: loadAlertingBundle, }) - .when('/alerting/:alertId/states', { - templateUrl: 'public/app/features/alerting/partials/alert_log.html', - controller: 'AlertLogCtrl', - controllerAs: 'ctrl', - resolve: loadAlertingBundle, - }) .otherwise({ templateUrl: 'public/app/partials/error.html', controller: 'ErrorCtrl' diff --git a/public/app/features/alerting/alert_def.ts b/public/app/features/alerting/alert_def.ts index bcac982f5ea..5584d874425 100644 --- a/public/app/features/alerting/alert_def.ts +++ b/public/app/features/alerting/alert_def.ts @@ -42,19 +42,29 @@ function createReducerPart(model) { } var severityLevels = { - 'critical': {text: 'Critical', iconClass: 'icon-gf-critical alert-icon-critical'}, - 'warning': {text: 'Warning', iconClass: 'icon-gf-warn alert-icon-warn'}, + 'critical': {text: 'CRITICAL', iconClass: 'icon-gf icon-gf-critical', stateClass: 'alert-state-critical'}, + 'warning': {text: 'WARNING', iconClass: 'icon-gf icon-gf-warning', stateClass: 'alert-state-warning'}, }; function getStateDisplayModel(state, severity) { var model = { text: 'OK', - iconClass: 'icon-gf-online alert-icon-online' + iconClass: 'icon-gf icon-gf-online', + stateClass: 'alert-state-ok' }; if (state === 'firing') { model.text = severityLevels[severity].text; model.iconClass = severityLevels[severity].iconClass; + model.stateClass = severityLevels[severity].stateClass; + } else if (state === 'pending') { + model.text = "PENDING"; + model.iconClass = "fa fa-question"; + model.stateClass = "alert-state-pending"; + } else if (state === 'paused') { + model.text = "PAUSED"; + model.iconClass = "fa fa-pause"; + model.stateClass = "alert-state-paused"; } return model; diff --git a/public/app/features/alerting/partials/alert_list.html b/public/app/features/alerting/partials/alert_list.html index e0b0896f3bd..6c4ed3f709b 100644 --- a/public/app/features/alerting/partials/alert_list.html +++ b/public/app/features/alerting/partials/alert_list.html @@ -1,9 +1,9 @@ - +
-

Alerting

+

Alert List

@@ -22,27 +22,34 @@
  1. - +
    -
    ACTIVE
    +
    + + + +
    Execution Error
    -
    {{alert.name}}
    +
    + + {{alert.name}} + +
    -
    - + + {{alert.stateModel.text}} - for - {{alert.newStateDateAgo}} + for {{alert.newStateDateAgo}}
    - +
diff --git a/public/app/features/alerting/partials/notification_edit.html b/public/app/features/alerting/partials/notification_edit.html index 4b1dfc6d573..2faf3e2dfe0 100644 --- a/public/app/features/alerting/partials/notification_edit.html +++ b/public/app/features/alerting/partials/notification_edit.html @@ -1,4 +1,4 @@ - + Notifications diff --git a/public/app/features/alerting/partials/notifications_list.html b/public/app/features/alerting/partials/notifications_list.html index b46f23fe2a8..df3cbfcc65d 100644 --- a/public/app/features/alerting/partials/notifications_list.html +++ b/public/app/features/alerting/partials/notifications_list.html @@ -1,8 +1,4 @@ - - - - Notifications - +
diff --git a/public/app/plugins/panel/graph/threshold_manager.ts b/public/app/plugins/panel/graph/threshold_manager.ts index 0d6c79e5ffd..7db224af684 100644 --- a/public/app/plugins/panel/graph/threshold_manager.ts +++ b/public/app/plugins/panel/graph/threshold_manager.ts @@ -15,17 +15,17 @@ export class ThresholdManager { constructor(private panelCtrl) {} getHandleHtml(handleIndex, model, valueStr) { - var colorClass = 'crit'; - if (model.colorMode === 'warning') { - colorClass = 'warn'; + var stateClass = model.colorMode; + if (model.colorMode === 'custom') { + stateClass = 'critical'; } return `
-
+
- + ${valueStr}
`; diff --git a/public/app/plugins/panel/singlestat/editor.html b/public/app/plugins/panel/singlestat/editor.html index e6be9f83032..c0c522abac9 100644 --- a/public/app/plugins/panel/singlestat/editor.html +++ b/public/app/plugins/panel/singlestat/editor.html @@ -182,9 +182,9 @@
  • -   - +   Min value is bigger than max. +  
    • diff --git a/public/sass/base/_grafana_icons.scss b/public/sass/base/_grafana_icons.scss index f251427e7c9..65fe0e23871 100644 --- a/public/sass/base/_grafana_icons.scss +++ b/public/sass/base/_grafana_icons.scss @@ -79,7 +79,8 @@ .icon-gf-jump-to-dashboard:before { content: "\e60d"; } -.icon-gf-warn:before { +.icon-gf-warn, +.icon-gf-warning:before { content: "\e60e"; } .icon-gf-nodata:before { diff --git a/public/sass/components/_alerts.scss b/public/sass/components/_alerts.scss index aee80b500fb..2c538c1c1c0 100644 --- a/public/sass/components/_alerts.scss +++ b/public/sass/components/_alerts.scss @@ -7,18 +7,6 @@ // ------------------------- -.alert-icon-online { - color: $online; -} - -.alert-icon-warn { - color: $warn; -} - -.alert-icon-crit, -.alert-icon-critical { - color: $critical; -} .alert { padding: 8px 35px 13px 14px; diff --git a/public/sass/components/_cards.scss b/public/sass/components/_cards.scss index c64fbbe8aa7..c3aad6b4313 100644 --- a/public/sass/components/_cards.scss +++ b/public/sass/components/_cards.scss @@ -64,6 +64,13 @@ font-size: 11px; padding: 2px 6px; } + + &--alert { + padding: 0.5rem 1rem; + .card-item-name { + font-size: $font-size-h5; + } + } } .card-item-body { diff --git a/public/sass/pages/_alerting.scss b/public/sass/pages/_alerting.scss index 00ecf707520..33577d1e30a 100644 --- a/public/sass/pages/_alerting.scss +++ b/public/sass/pages/_alerting.scss @@ -1,31 +1,18 @@ -.copy-query { - display: block; - width: 30px; - height: 36px; - margin: 0; - padding: 0; - border: 0; - background: transparent url(/img/CopyQuery.png) 50% 50% no-repeat; - cursor: pointer; +.alert-state-paused, +.alert-state-pending { + color: $text-muted; } -.alert-state { - display: inline-block; - padding-left: 30px; - background: 0 50% no-repeat; - background-size: 20px auto; -} - -.alert-state-online { - background-image: url('/img/online.svg'); +.alert-state-ok { + color: $online; } .alert-state-warning { - background-image: url('/img/warn-tiny.svg'); + color: $warn; } .alert-state-critical { - background-image: url('/img/critical.svg'); + color: $critical; } .alert-notify-emails { @@ -40,3 +27,14 @@ .alert-notify-emails .bootstrap-tagsinput input { border: 0; } + +// Alert List + +.alert-list-item-state { + font-weight: bold; + .icon-gf, .fa { + font-size: 120%; + position: relative; + top: 2px; + } +}