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 {
Message: alert.Message,
State: alert.State,
Severity: alert.Severity,
EvalDate: alert.EvalDate,
NewStateDate: alert.NewStateDate,
ExecutionError: alert.ExecutionError,
})
}
......
pkg/api/dtos/alerting.go
......@@ -15,7 +15,9 @@ type AlertRule struct {
Message string `json:"message"`
State m.AlertStateType `json:"state"`
Severity m.AlertSeverityType `json:"severity"`
NewStateDate time.Time `json:"newStateDate"`
EvalDate time.Time `json:"evalDate"`
ExecutionError string `json:"executionError"`
DashbboardUri string `json:"dashboardUri"`
}
......
pkg/api/index.go
......@@ -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) {
alertChildNavs := []*dtos.NavLink{
{Text: "Home", Url: setting.AppSubUrl + "/alerting"},
{Text: "Alert List", Url: setting.AppSubUrl + "/alerting/list"},
{Text: "Notifications", Url: setting.AppSubUrl + "/alerting/notifications"},
}
data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{
Text: "Alerting",
Icon: "icon-gf icon-gf-monitoring",
Url: setting.AppSubUrl + "/alerting",
Url: setting.AppSubUrl + "/alerting/list",
Children: alertChildNavs,
})
}
......
pkg/models/alert.go
......@@ -32,6 +32,7 @@ func (s AlertSeverityType) IsValid() bool {
type Alert struct {
Id int64
Version int64
OrgId int64
DashboardId int64
PanelId int64
......@@ -45,11 +46,10 @@ type Alert struct {
ExecutionError string
Frequency int64
LastEvalData *simplejson.Json
LastEvalTime time.Time
CreatedBy int64
UpdatedBy int64
EvalData *simplejson.Json
EvalDate time.Time
NewStateDate time.Time
StateChanges int
Created time.Time
Updated time.Time
......
pkg/services/sqlstore/alert.go
......@@ -161,8 +161,6 @@ func upsertAlerts(existingAlerts []*m.Alert, cmd *m.SaveAlertsCommand, sess *xor
alert.Updated = time.Now()
alert.Created = time.Now()
alert.State = m.AlertStatePending
alert.CreatedBy = cmd.UserId
alert.UpdatedBy = cmd.UserId
_, err := sess.Insert(alert)
if err != nil {
......@@ -222,8 +220,10 @@ func SetAlertState(cmd *m.SetAlertStateCommand) error {
}
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
})
}
pkg/services/sqlstore/migrations/alert_mig.go
......@@ -10,6 +10,7 @@ func addAlertMigrations(mg *Migrator) {
Name: "alert",
Columns: []*Column{
{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: "panel_id", Type: DB_BigInt, Nullable: false},
{Name: "org_id", Type: DB_BigInt, Nullable: false},
......@@ -23,12 +24,12 @@ func addAlertMigrations(mg *Migrator) {
{Name: "paused", Type: DB_Bool, Nullable: false},
{Name: "silenced", Type: DB_Bool, Nullable: false},
{Name: "execution_error", Type: DB_Text, Nullable: false},
{Name: "last_eval_data", Type: DB_Text, Nullable: false},
{Name: "last_eval_time", Type: DB_DateTime, Nullable: false},
{Name: "eval_data", Type: DB_Text, Nullable: true},
{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: "updated", Type: DB_DateTime, Nullable: false},
{Name: "updated_by", Type: DB_BigInt, Nullable: false},
{Name: "created_by", Type: DB_BigInt, Nullable: false},
},
Indices: []*Index{
{Cols: []string{"org_id", "id"}, Type: IndexType},
......
pkg/services/sqlstore/migrations/annotation_mig.go
......@@ -32,6 +32,7 @@ func addAnnotationMig(mg *Migrator) {
// create indices
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 timestamp", NewAddIndexMigration(table, table.Indices[2]))
}
public/app/core/routes/routes.ts
......@@ -194,7 +194,7 @@ function setupAngularRoutes($routeProvider, $locationProvider) {
controllerAs: 'ctrl',
templateUrl: 'public/app/features/styleguide/styleguide.html',
})
.when('/alerting', {
.when('/alerting/list', {
templateUrl: 'public/app/features/alerting/partials/alert_list.html',
controller: 'AlertListCtrl',
controllerAs: 'ctrl',
......
public/app/features/alerting/alert_def.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 {
QueryPartDef,
......@@ -50,14 +41,28 @@ function createReducerPart(model) {
return new QueryPart(model, def);
}
var severityLevels = [
{text: 'Critical', value: 'critical'},
{text: 'Warning', value: 'warning'},
];
var severityLevels = {
'critical': {text: 'Critical', iconClass: 'icon-gf-critical alert-icon-critical'},
'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 {
alertQueryDef: alertQueryDef,
getSeverityIconClass: getSeverityIconClass,
getStateDisplayModel: getStateDisplayModel,
conditionTypes: conditionTypes,
evalFunctions: evalFunctions,
severityLevels: severityLevels,
......
public/app/features/alerting/alerts_ctrl.ts → public/app/features/alerting/alert_list_ctrl.ts
......@@ -3,23 +3,20 @@
import angular from 'angular';
import _ from 'lodash';
import coreModule from '../../core/core_module';
import config from 'app/core/config';
import moment from 'moment';
import alertDef from './alert_def';
export class AlertListCtrl {
alerts: any;
filter = {
ok: false,
warn: false,
critical: false,
acknowleged: false
filters = {
state: 'OK'
};
/** @ngInject */
constructor(private backendSrv, private $route) {
_.each($route.current.params.state, state => {
this.filter[state.toLowerCase()] = true;
this.filters[state.toLowerCase()] = true;
});
this.loadAlerts();
......@@ -27,10 +24,6 @@ export class AlertListCtrl {
updateFilter() {
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.updateParams();
}
......@@ -38,17 +31,14 @@ export class AlertListCtrl {
loadAlerts() {
var stats = [];
this.filter.ok && stats.push('OK');
this.filter.warn && stats.push('Warn');
this.filter.critical && stats.push('critical');
var params = {
state: stats
};
this.backendSrv.get('/api/alerts', params).then(result => {
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;
});
});
......
public/app/features/alerting/all.ts
import './alerts_ctrl';
import './alert_list_ctrl';
import './alert_log_ctrl';
import './notifications_list_ctrl';
import './notification_edit_ctrl';
......
public/app/features/alerting/partials/alert_list.html
......@@ -6,38 +6,46 @@
<h1>Alerting</h1>
</div>
<div class="gf-form-group">
<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>
<gf-form-switch class="gf-form" label="Warn" label-class="width-5" checked="ctrl.filter.warn" on-change="ctrl.updateFilter()"></gf-form-switch>
<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">
<label class="gf-form-label">Filter by state</label>
<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>
<table class="grafana-options-table">
<thead>
<th style="min-width: 200px"><strong>Name</strong></th>
<th style="width: 1%">State</th>
<th style="width: 1%">Severity</th>
<th style="width: 1%"></th>
</thead>
<tr ng-repeat="alert in ctrl.alerts">
<td>
<a href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&editorTab=Alerting">
{{alert.name}}
</a>
</td>
<td class="text-center">
{{alert.state}}
</td>
<td class="text-center">
{{alert.severity}}
</td>
<td class="text-center">
<a href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&editorTab=Alerting" class="btn btn-inverse btn-small">
<i class="fa fa-edit"></i>
edit
<section class="card-section card-list-layout-list">
<ol class="card-list" >
<li class="card-item-wrapper" ng-repeat="alert in ctrl.alerts">
<a class="card-item" href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&tab=alert">
<div class="card-item-header">
<div class="card-item-type">ACTIVE</div>
<div class="card-item-notice" ng-show="alert.executionError">
<span>Execution Error</span>
</div>
</div>
<div class="card-item-body">
<div class="card-item-details">
<div class="card-item-name">{{alert.name}}</div>
<div class="card-item-sub-name">
<div class="alert-list-state-line">
<i class="icon-gf {{alert.stateModel.iconClass}}"></i>
{{alert.stateModel.text}}
for
{{alert.newStateDateAgo}}
</div>
</div>
</div>
</div>
</a>
</td>
</tr>
</table>
</li>
</ol>
</section>
</div>
public/app/features/alerting/partials/alert_tab.html
......@@ -34,7 +34,7 @@
<div class="gf-form">
<span class="gf-form-label">Severity</span>
<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>
</div>
</div>
......
public/app/features/plugins/partials/plugin_list.html
......@@ -5,10 +5,6 @@
<div class="page-header">
<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">
<ul class="gf-tabs">
<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