Skip to content

N
nexpie-grafana-theme
Commit f934081b by Torkel Ödegaard
Options

feat(alerting): making progress on alerting list, #5784

parent 9f29c541
Showing with 87 additions and 81 deletions
pkg/api/alerting.go
...@@ -50,6 +50,9 @@ func GetAlerts(c *middleware.Context) Response { ...@@ -50,6 +50,9 @@ func GetAlerts(c *middleware.Context) Response {
Message: alert.Message, Message: alert.Message,
State: alert.State, State: alert.State,
Severity: alert.Severity, Severity: alert.Severity,
EvalDate: alert.EvalDate,
NewStateDate: alert.NewStateDate,
ExecutionError: alert.ExecutionError,
}) })
} }
......
pkg/api/dtos/alerting.go
...@@ -15,7 +15,9 @@ type AlertRule struct { ...@@ -15,7 +15,9 @@ type AlertRule struct {
Message string `json:"message"` Message string `json:"message"`
State m.AlertStateType `json:"state"` State m.AlertStateType `json:"state"`
Severity m.AlertSeverityType `json:"severity"` Severity m.AlertSeverityType `json:"severity"`
NewStateDate time.Time `json:"newStateDate"`
EvalDate time.Time `json:"evalDate"`
ExecutionError string `json:"executionError"`
DashbboardUri string `json:"dashboardUri"` DashbboardUri string `json:"dashboardUri"`
} }
......
pkg/api/index.go
...@@ -93,14 +93,14 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) { ...@@ -93,14 +93,14 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) {
if setting.AlertingEnabled && (c.OrgRole == m.ROLE_ADMIN || c.OrgRole == m.ROLE_EDITOR) { if setting.AlertingEnabled && (c.OrgRole == m.ROLE_ADMIN || c.OrgRole == m.ROLE_EDITOR) {
alertChildNavs := []*dtos.NavLink{ alertChildNavs := []*dtos.NavLink{
{Text: "Home", Url: setting.AppSubUrl + "/alerting"}, {Text: "Alert List", Url: setting.AppSubUrl + "/alerting/list"},
{Text: "Notifications", Url: setting.AppSubUrl + "/alerting/notifications"}, {Text: "Notifications", Url: setting.AppSubUrl + "/alerting/notifications"},
} }
data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{ data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{
Text: "Alerting", Text: "Alerting",
Icon: "icon-gf icon-gf-monitoring", Icon: "icon-gf icon-gf-monitoring",
Url: setting.AppSubUrl + "/alerting", Url: setting.AppSubUrl + "/alerting/list",
Children: alertChildNavs, Children: alertChildNavs,
}) })
} }
......
pkg/models/alert.go
...@@ -32,6 +32,7 @@ func (s AlertSeverityType) IsValid() bool { ...@@ -32,6 +32,7 @@ func (s AlertSeverityType) IsValid() bool {
type Alert struct { type Alert struct {
Id int64 Id int64
Version int64
OrgId int64 OrgId int64
DashboardId int64 DashboardId int64
PanelId int64 PanelId int64
...@@ -45,11 +46,10 @@ type Alert struct { ...@@ -45,11 +46,10 @@ type Alert struct {
ExecutionError string ExecutionError string
Frequency int64 Frequency int64
LastEvalData *simplejson.Json EvalData *simplejson.Json
LastEvalTime time.Time EvalDate time.Time
NewStateDate time.Time
CreatedBy int64 StateChanges int
UpdatedBy int64
Created time.Time Created time.Time
Updated time.Time Updated time.Time
......
pkg/services/sqlstore/alert.go
...@@ -161,8 +161,6 @@ func upsertAlerts(existingAlerts []*m.Alert, cmd *m.SaveAlertsCommand, sess *xor ...@@ -161,8 +161,6 @@ func upsertAlerts(existingAlerts []*m.Alert, cmd *m.SaveAlertsCommand, sess *xor
alert.Updated = time.Now() alert.Updated = time.Now()
alert.Created = time.Now() alert.Created = time.Now()
alert.State = m.AlertStatePending alert.State = m.AlertStatePending
alert.CreatedBy = cmd.UserId
alert.UpdatedBy = cmd.UserId
_, err := sess.Insert(alert) _, err := sess.Insert(alert)
if err != nil { if err != nil {
...@@ -222,8 +220,10 @@ func SetAlertState(cmd *m.SetAlertStateCommand) error { ...@@ -222,8 +220,10 @@ func SetAlertState(cmd *m.SetAlertStateCommand) error {
} }
alert.State = cmd.State alert.State = cmd.State
sess.Id(alert.Id).Update(&alert) alert.StateChanges += 1
alert.NewStateDate = time.Now()
sess.Id(alert.Id).Update(&alert)
return nil return nil
}) })
} }
pkg/services/sqlstore/migrations/alert_mig.go
...@@ -10,6 +10,7 @@ func addAlertMigrations(mg *Migrator) { ...@@ -10,6 +10,7 @@ func addAlertMigrations(mg *Migrator) {
Name: "alert", Name: "alert",
Columns: []*Column{ Columns: []*Column{
{Name: "id", Type: DB_BigInt, IsPrimaryKey: true, IsAutoIncrement: true}, {Name: "id", Type: DB_BigInt, IsPrimaryKey: true, IsAutoIncrement: true},
{Name: "version", Type: DB_BigInt, Nullable: false},
{Name: "dashboard_id", Type: DB_BigInt, Nullable: false}, {Name: "dashboard_id", Type: DB_BigInt, Nullable: false},
{Name: "panel_id", Type: DB_BigInt, Nullable: false}, {Name: "panel_id", Type: DB_BigInt, Nullable: false},
{Name: "org_id", Type: DB_BigInt, Nullable: false}, {Name: "org_id", Type: DB_BigInt, Nullable: false},
...@@ -23,12 +24,12 @@ func addAlertMigrations(mg *Migrator) { ...@@ -23,12 +24,12 @@ func addAlertMigrations(mg *Migrator) {
{Name: "paused", Type: DB_Bool, Nullable: false}, {Name: "paused", Type: DB_Bool, Nullable: false},
{Name: "silenced", Type: DB_Bool, Nullable: false}, {Name: "silenced", Type: DB_Bool, Nullable: false},
{Name: "execution_error", Type: DB_Text, Nullable: false}, {Name: "execution_error", Type: DB_Text, Nullable: false},
{Name: "last_eval_data", Type: DB_Text, Nullable: false}, {Name: "eval_data", Type: DB_Text, Nullable: true},
{Name: "last_eval_time", Type: DB_DateTime, Nullable: false}, {Name: "eval_date", Type: DB_DateTime, Nullable: true},
{Name: "new_state_date", Type: DB_DateTime, Nullable: false},
{Name: "state_changes", Type: DB_Int, Nullable: false},
{Name: "created", Type: DB_DateTime, Nullable: false}, {Name: "created", Type: DB_DateTime, Nullable: false},
{Name: "updated", Type: DB_DateTime, Nullable: false}, {Name: "updated", Type: DB_DateTime, Nullable: false},
{Name: "updated_by", Type: DB_BigInt, Nullable: false},
{Name: "created_by", Type: DB_BigInt, Nullable: false},
}, },
Indices: []*Index{ Indices: []*Index{
{Cols: []string{"org_id", "id"}, Type: IndexType}, {Cols: []string{"org_id", "id"}, Type: IndexType},
......
pkg/services/sqlstore/migrations/annotation_mig.go
...@@ -32,6 +32,7 @@ func addAnnotationMig(mg *Migrator) { ...@@ -32,6 +32,7 @@ func addAnnotationMig(mg *Migrator) {
// create indices // create indices
mg.AddMigration("add index annotation org_id & alert_id ", NewAddIndexMigration(table, table.Indices[0])) mg.AddMigration("add index annotation org_id & alert_id ", NewAddIndexMigration(table, table.Indices[0]))
mg.AddMigration("add index annotation org_id & type", NewAddIndexMigration(table, table.Indices[1])) mg.AddMigration("add index annotation org_id & type", NewAddIndexMigration(table, table.Indices[1]))
mg.AddMigration("add index annotation timestamp", NewAddIndexMigration(table, table.Indices[2])) mg.AddMigration("add index annotation timestamp", NewAddIndexMigration(table, table.Indices[2]))
} }
public/app/core/routes/routes.ts
...@@ -194,7 +194,7 @@ function setupAngularRoutes($routeProvider, $locationProvider) { ...@@ -194,7 +194,7 @@ function setupAngularRoutes($routeProvider, $locationProvider) {
controllerAs: 'ctrl', controllerAs: 'ctrl',
templateUrl: 'public/app/features/styleguide/styleguide.html', templateUrl: 'public/app/features/styleguide/styleguide.html',
}) })
.when('/alerting', { .when('/alerting/list', {
templateUrl: 'public/app/features/alerting/partials/alert_list.html', templateUrl: 'public/app/features/alerting/partials/alert_list.html',
controller: 'AlertListCtrl', controller: 'AlertListCtrl',
controllerAs: 'ctrl', controllerAs: 'ctrl',
......
public/app/features/alerting/alert_def.ts
///<reference path="../../headers/common.d.ts" /> ///<reference path="../../headers/common.d.ts" />
var alertSeverityIconMap = {
"ok": "icon-gf-online alert-icon-online",
"warning": "icon-gf-warn alert-icon-warn",
"critical": "icon-gf-critical alert-icon-critical",
};
function getSeverityIconClass(alertState) {
return alertSeverityIconMap[alertState];
}
import { import {
QueryPartDef, QueryPartDef,
...@@ -50,14 +41,28 @@ function createReducerPart(model) { ...@@ -50,14 +41,28 @@ function createReducerPart(model) {
return new QueryPart(model, def); return new QueryPart(model, def);
} }
var severityLevels = [ var severityLevels = {
{text: 'Critical', value: 'critical'}, 'critical': {text: 'Critical', iconClass: 'icon-gf-critical alert-icon-critical'},
{text: 'Warning', value: 'warning'}, 'warning': {text: 'Warning', iconClass: 'icon-gf-warn alert-icon-warn'},
]; };
function getStateDisplayModel(state, severity) {
var model = {
text: 'OK',
iconClass: 'icon-gf-online alert-icon-online'
};
if (state === 'firing') {
model.text = severityLevels[severity].text;
model.iconClass = severityLevels[severity].iconClass;
}
return model;
}
export default { export default {
alertQueryDef: alertQueryDef, alertQueryDef: alertQueryDef,
getSeverityIconClass: getSeverityIconClass, getStateDisplayModel: getStateDisplayModel,
conditionTypes: conditionTypes, conditionTypes: conditionTypes,
evalFunctions: evalFunctions, evalFunctions: evalFunctions,
severityLevels: severityLevels, severityLevels: severityLevels,
......
public/app/features/alerting/alerts_ctrl.ts → public/app/features/alerting/alert_list_ctrl.ts
...@@ -3,23 +3,20 @@ ...@@ -3,23 +3,20 @@
import angular from 'angular'; import angular from 'angular';
import _ from 'lodash'; import _ from 'lodash';
import coreModule from '../../core/core_module'; import coreModule from '../../core/core_module';
import config from 'app/core/config'; import moment from 'moment';
import alertDef from './alert_def'; import alertDef from './alert_def';
export class AlertListCtrl { export class AlertListCtrl {
alerts: any; alerts: any;
filter = { filters = {
ok: false, state: 'OK'
warn: false,
critical: false,
acknowleged: false
}; };
/** @ngInject */ /** @ngInject */
constructor(private backendSrv, private $route) { constructor(private backendSrv, private $route) {
_.each($route.current.params.state, state => { _.each($route.current.params.state, state => {
this.filter[state.toLowerCase()] = true; this.filters[state.toLowerCase()] = true;
}); });
this.loadAlerts(); this.loadAlerts();
...@@ -27,10 +24,6 @@ export class AlertListCtrl { ...@@ -27,10 +24,6 @@ export class AlertListCtrl {
updateFilter() { updateFilter() {
var stats = []; var stats = [];
this.filter.ok && stats.push('OK');
this.filter.warn && stats.push('Warn');
this.filter.critical && stats.push('critical');
this.$route.current.params.state = stats; this.$route.current.params.state = stats;
this.$route.updateParams(); this.$route.updateParams();
} }
...@@ -38,17 +31,14 @@ export class AlertListCtrl { ...@@ -38,17 +31,14 @@ export class AlertListCtrl {
loadAlerts() { loadAlerts() {
var stats = []; var stats = [];
this.filter.ok && stats.push('OK');
this.filter.warn && stats.push('Warn');
this.filter.critical && stats.push('critical');
var params = { var params = {
state: stats state: stats
}; };
this.backendSrv.get('/api/alerts', params).then(result => { this.backendSrv.get('/api/alerts', params).then(result => {
this.alerts = _.map(result, alert => { this.alerts = _.map(result, alert => {
alert.severityClass = alertDef.getSeverityIconClass(alert.severity); alert.stateModel = alertDef.getStateDisplayModel(alert.state, alert.severity);
alert.newStateDateAgo = moment(alert.newStateDate).fromNow().replace(" ago", "");
return alert; return alert;
}); });
}); });
......
public/app/features/alerting/all.ts
import './alerts_ctrl'; import './alert_list_ctrl';
import './alert_log_ctrl'; import './alert_log_ctrl';
import './notifications_list_ctrl'; import './notifications_list_ctrl';
import './notification_edit_ctrl'; import './notification_edit_ctrl';
......
public/app/features/alerting/partials/alert_list.html
...@@ -6,38 +6,46 @@ ...@@ -6,38 +6,46 @@
<h1>Alerting</h1> <h1>Alerting</h1>
</div> </div>
<div class="gf-form-group">
<div class="gf-form-inline"> <div class="gf-form-inline">
<gf-form-switch class="gf-form" label="OK" label-class="width-5" checked="ctrl.filter.ok" on-change="ctrl.updateFilter()"></gf-form-switch> <div class="gf-form">
<gf-form-switch class="gf-form" label="Warn" label-class="width-5" checked="ctrl.filter.warn" on-change="ctrl.updateFilter()"></gf-form-switch> <label class="gf-form-label">Filter by state</label>
<gf-form-switch class="gf-form" label="Critical" label-class="width-5" checked="ctrl.filter.critical" on-change="ctrl.updateFilter()"></gf-form-switch> <div class="gf-form-select-wrapper width-13">
<select class="gf-form-input" ng-model="ctrl.filters.state" ng-options="f for f in ['OK', 'Warning', 'Critical']" ng-change="ctrl.severityChanged()">
</select>
</div>
</div>
</div>
</div> </div>
<table class="grafana-options-table"> <section class="card-section card-list-layout-list">
<thead>
<th style="min-width: 200px"><strong>Name</strong></th> <ol class="card-list" >
<th style="width: 1%">State</th> <li class="card-item-wrapper" ng-repeat="alert in ctrl.alerts">
<th style="width: 1%">Severity</th> <a class="card-item" href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&tab=alert">
<th style="width: 1%"></th> <div class="card-item-header">
</thead> <div class="card-item-type">ACTIVE</div>
<tr ng-repeat="alert in ctrl.alerts"> <div class="card-item-notice" ng-show="alert.executionError">
<td> <span>Execution Error</span>
<a href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&editorTab=Alerting"> </div>
{{alert.name}} </div>
</a> <div class="card-item-body">
</td> <div class="card-item-details">
<td class="text-center"> <div class="card-item-name">{{alert.name}}</div>
{{alert.state}} <div class="card-item-sub-name">
</td> <div class="alert-list-state-line">
<td class="text-center"> <i class="icon-gf {{alert.stateModel.iconClass}}"></i>
{{alert.severity}} {{alert.stateModel.text}}
</td> for
<td class="text-center"> {{alert.newStateDateAgo}}
<a href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&editorTab=Alerting" class="btn btn-inverse btn-small"> </div>
<i class="fa fa-edit"></i> </div>
edit </div>
</div>
</a> </a>
</td> </li>
</tr> </ol>
</table> </section>
</div> </div>
public/app/features/alerting/partials/alert_tab.html
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label">Severity</span> <span class="gf-form-label">Severity</span>
<div class="gf-form-select-wrapper width-13"> <div class="gf-form-select-wrapper width-13">
<select class="gf-form-input" ng-model="ctrl.alert.severity" ng-options="f.value as f.text for f in ctrl.severityLevels" ng-change="ctrl.severityChanged()"> <select class="gf-form-input" ng-model="ctrl.alert.severity" ng-options="key as value.text for (key, value) in ctrl.severityLevels" ng-change="ctrl.severityChanged()">
</select> </select>
</div> </div>
</div> </div>
......
public/app/features/plugins/partials/plugin_list.html
...@@ -5,10 +5,6 @@ ...@@ -5,10 +5,6 @@
<div class="page-header"> <div class="page-header">
<h1>Plugins</h1> <h1>Plugins</h1>
<!-- <a class="btn btn&#45;inverse" href="https://grafana.net/plugins?utm_source=grafana_plugin_list" target="_blank"> -->
<!-- Explore plugins on Grafana.net -->
<!-- </a> -->
<div class="page-header-tabs"> <div class="page-header-tabs">
<ul class="gf-tabs"> <ul class="gf-tabs">
<li class="gf-tabs-item"> <li class="gf-tabs-item">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment