Trigger panel: set color for Ok events.

This commit is contained in:
Alexander Zobnin
2016-02-03 15:30:50 +03:00
parent 9996529602
commit f1adb7f515
2 changed files with 52 additions and 5 deletions

View File

@@ -105,7 +105,7 @@
<strong>Limit triggers number to</strong>
</li>
<li>
<input class="input-small tight-form-input last"
<input class="input-small tight-form-input"
type="number"
ng-model="panel.limit"
ng-model-onblur
@@ -130,7 +130,7 @@
<strong>Show events</strong>
</li>
<li>
<select class="input-medium tight-form-input"
<select class="tight-form-input input-medium last"
ng-model="panel.showEvents"
ng-options="f.text for f in showEventsFields track by f.value"
ng-change="get_data()">
@@ -198,7 +198,6 @@
<h5>Customize triggers severity and colors</h5>
<div class="tight-form"
ng-repeat="trigger in panel.triggerSeverity"
ng-class="{last: $last}"
ng-style="{background:trigger.color}">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 10px; color: #101010">
@@ -241,5 +240,28 @@
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form last"
ng-style="{background:panel.okEventColor}">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 160px; color: #101010">
<span style="padding-left: 25px"> OK event color </span>
</li>
<li data-trigger-index="6">
&nbsp;
<i class="pointer fa fa-eyedropper trigger-color"
style="color: #101010"
ng-click="openOkEventColorSelector($event)">&nbsp;</i>
<input type="text"
class="tight-form-input input-small"
style="color: #101010"
empty-to-null
ng-model="panel.okEventColor"
ng-style="{background:panel.okEventColor}"
ng-model-onblur
ng-change="get_data()">
</li>
</ul>
<div class="clearfix"></div>
</div>
</div>
</div>

View File

@@ -79,7 +79,8 @@ function (angular, app, _, $, config, PanelMeta) {
showTriggers: 'all triggers',
sortTriggersBy: { text: 'last change', value: 'lastchange' },
showEvents: { text: 'Problem events', value: '1' },
triggerSeverity: grafanaDefaultSeverity
triggerSeverity: grafanaDefaultSeverity,
okEventColor: '#890F02'
};
_.defaults($scope.panel, panelDefaults);
@@ -145,7 +146,14 @@ function (angular, app, _, $, config, PanelMeta) {
triggerObj.lastchangeUnix = lastchangeUnix;
triggerObj.lastchange = lastchange.toLocaleString();
triggerObj.age = age.toLocaleString();
triggerObj.color = $scope.panel.triggerSeverity[trigger.priority].color;
// Set color
if (trigger.value === '1') {
triggerObj.color = $scope.panel.triggerSeverity[trigger.priority].color;
} else {
triggerObj.color = $scope.panel.okEventColor;
}
triggerObj.severity = $scope.panel.triggerSeverity[trigger.priority].severity;
return triggerObj;
});
@@ -327,6 +335,23 @@ function (angular, app, _, $, config, PanelMeta) {
});
};
$scope.openOkEventColorSelector = function(event) {
var el = $(event.currentTarget);
var popoverScope = $scope.$new();
popoverScope.trigger = {color: $scope.panel.okEventColor};
popoverScope.changeTriggerSeverityColor = function(trigger, color) {
$scope.panel.okEventColor = color;
$scope.refreshTriggerSeverity();
};
popoverSrv.show({
element: el,
placement: 'top',
templateUrl: 'public/plugins/triggers/trigger.colorpicker.html',
scope: popoverScope
});
};
/**
* Convert event age from Unix format (milliseconds sins 1970)
* to Zabbix format (like at Last 20 issues panel).