Misthios/grafana-zabbix
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Trigger panel: fixed Select triggers section.

Browse Source
This commit is contained in:
Alexander Zobnin
2016-02-02 16:06:43 +03:00
parent fa10d76e2b
commit 5a2acc6633
2 changed files with 124 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
plugins/panel-triggers/editor.html
View File

@@ -7,21 +7,29 @@
Group Group
</li> </li>
<li> <li>
<select class="tight-form-input input-large" <input type="text"
ng-model="panel.triggers.group" ng-model="panel.triggers.group.filter"
ng-options="g.name for g in metric.groupList track by g.name" bs-typeahead="getGroupNames"
ng-change="groupChanged()"> ng-change="onTargetPartChange(panel.triggers.group)"
</select> ng-blur="parseTarget()"
data-min-length=0
data-items=100
class="input-large tight-form-input"
ng-style="panel.triggers.group.style">
</li> </li>
<li class="tight-form-item" style="width: 50px"> <li class="tight-form-item" style="width: 50px">
Host Host
</li> </li>
<li> <li>
<select class="tight-form-input input-large last" <input type="text"
ng-model="panel.triggers.host" ng-model="panel.triggers.host.filter"
ng-options="h.name for h in metric.hostList track by h.name" bs-typeahead="getHostNames"
ng-change="hostChanged()"> ng-change="onTargetPartChange(panel.triggers.host)"
</select> ng-blur="parseTarget()"
data-min-length=0
data-items=100
class="input-large tight-form-input last"
ng-style="panel.triggers.host.style">
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
@@ -32,22 +40,28 @@
Application Application
</li> </li>
<li> <li>
<select class="tight-form-input input-large" <input type="text"
ng-model="panel.triggers.application" ng-model="panel.triggers.application.filter"
ng-options="app.name for app in metric.applicationList track by app.name" bs-typeahead="getApplicationNames"
ng-change="appChanged()"> ng-change="onTargetPartChange(panel.triggers.application)"
</select> ng-blur="parseTarget()"
data-min-length=0
data-items=100
class="input-large tight-form-input"
ng-style="panel.triggers.application.style">
</li> </li>
<li class="tight-form-item" style="width: 50px"> <li class="tight-form-item" style="width: 50px">
Trigger Trigger
</li> </li>
<li> <li>
<input type="text" <input type="text"
class="input-large tight-form-input last" ng-model="panel.triggers.trigger.filter"
ng-change="onTargetPartChange(panel.triggers.trigger)"
ng-blur="parseTarget()"
placeholder="trigger name" placeholder="trigger name"
ng-model="panel.triggers.name" class="input-large tight-form-input last"
empty-to-null ng-style="panel.triggers.trigger.style"
ng-blur="get_data()"> empty-to-null">
</li> </li>
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>

167
plugins/panel-triggers/module.js
View File

@@ -17,8 +17,7 @@ define([
'lodash', 'lodash',
'jquery', 'jquery',
'app/core/config', 'app/core/config',
'app/features/panel/panel_meta', 'app/features/panel/panel_meta'
'../zabbix/helperFunctions',
], ],
function (angular, app, _, $, config, PanelMeta) { function (angular, app, _, $, config, PanelMeta) {
'use strict'; 'use strict';
@@ -27,7 +26,7 @@ function (angular, app, _, $, config, PanelMeta) {
app.useModule(module); app.useModule(module);
/** @ngInject */ /** @ngInject */
function TriggerPanelCtrl($q, $scope, $element, datasourceSrv, panelSrv, templateSrv, zabbixHelperSrv, popoverSrv) { function TriggerPanelCtrl($q, $scope, $element, datasourceSrv, panelSrv, templateSrv, popoverSrv) {
$scope.panelMeta = new PanelMeta({ $scope.panelMeta = new PanelMeta({
panelName: 'Zabbix triggers', panelName: 'Zabbix triggers',
@@ -66,9 +65,10 @@ function (angular, app, _, $, config, PanelMeta) {
var panelDefaults = { var panelDefaults = {
datasource: null, datasource: null,
triggers: { triggers: {
group: {name: 'All', groupid: null}, group: {filter: ""},
host: {name: 'All', hostid: null}, host: {filter: ""},
application: {name: 'All', value: null} application: {filter: ""},
trigger: {filter: ""}
}, },
hostField: true, hostField: true,
severityField: false, severityField: false,
@@ -91,13 +91,13 @@ function (angular, app, _, $, config, PanelMeta) {
$scope.panel.title = "Zabbix Triggers"; $scope.panel.title = "Zabbix Triggers";
} }
if (!$scope.metric) { // Load scope defaults
$scope.metric = { var scopeDefaults = {
groupList: [{name: 'All', groupid: null}], metric: {},
hostList: [{name: 'All', hostid: null}], inputStyles: {},
applicationList: [{name: 'All', applicationid: null}] oldTarget: _.cloneDeep($scope.panel.triggers)
}; };
} _.defaults($scope, scopeDefaults);
// Get zabbix data sources // Get zabbix data sources
var datasources = _.filter(datasourceSrv.getMetricSources(), function(datasource) { var datasources = _.filter(datasourceSrv.getMetricSources(), function(datasource) {
@@ -109,11 +109,11 @@ function (angular, app, _, $, config, PanelMeta) {
if (!$scope.panel.datasource) { if (!$scope.panel.datasource) {
$scope.panel.datasource = $scope.datasources[0]; $scope.panel.datasource = $scope.datasources[0];
} }
// Load datasource
// Update lists of groups, hosts and applications datasourceSrv.get($scope.panel.datasource).then(function (datasource) {
$scope.updateGroups() $scope.datasource = datasource;
.then($scope.updateHosts) $scope.initFilters();
.then($scope.updateApplications); });
}; };
$scope.refreshData = function() { $scope.refreshData = function() {
@@ -142,7 +142,7 @@ function (angular, app, _, $, config, PanelMeta) {
// Consider local time offset // Consider local time offset
var ageUnix = now - lastchange + now.getTimezoneOffset() * 60000; var ageUnix = now - lastchange + now.getTimezoneOffset() * 60000;
var age = zabbixHelperSrv.toZabbixAgeFormat(ageUnix); var age = toZabbixAgeFormat(ageUnix);
var triggerObj = trigger; var triggerObj = trigger;
triggerObj.lastchangeUnix = lastchangeUnix; triggerObj.lastchangeUnix = lastchangeUnix;
triggerObj.lastchange = lastchange.toLocaleString(); triggerObj.lastchange = lastchange.toLocaleString();
@@ -191,44 +191,65 @@ function (angular, app, _, $, config, PanelMeta) {
}); });
}; };
$scope.groupChanged = function() { $scope.initFilters = function () {
return $scope.updateHosts() $scope.filterGroups();
.then($scope.updateApplications) $scope.filterHosts();
.then($scope.refreshData); $scope.filterApplications();
//$scope.filterItems();
}; };
$scope.hostChanged = function() { // Get list of metric names for bs-typeahead directive
return $scope.updateApplications() function getMetricNames(scope, metricList) {
.then($scope.refreshData); return _.uniq(_.map(scope.metric[metricList], 'name'));
}
// Map functions for bs-typeahead
$scope.getGroupNames = _.partial(getMetricNames, $scope, 'groupList');
$scope.getHostNames = _.partial(getMetricNames, $scope, 'filteredHosts');
$scope.getApplicationNames = _.partial(getMetricNames, $scope, 'filteredApplications');
$scope.getItemNames = _.partial(getMetricNames, $scope, 'filteredItems');
$scope.filterGroups = function() {
$scope.datasource.queryProcessor.filterGroups().then(function(groups) {
$scope.metric.groupList = groups;
});
}; };
$scope.appChanged = function() { $scope.filterHosts = function () {
var app = $scope.panel.triggers.application.name; var groupFilter = templateSrv.replace($scope.panel.triggers.group.filter);
$scope.datasource.queryProcessor.filterHosts(groupFilter).then(function(hosts) {
$scope.metric.filteredHosts = hosts;
});
};
return datasourceSrv.get($scope.panel.datasource).then(function (datasource) { $scope.filterApplications = function () {
return datasource.zabbixAPI.getAppByName(app).then(function (applications) { var groupFilter = templateSrv.replace($scope.panel.triggers.group.filter);
var appids = _.map(applications, 'applicationid'); var hostFilter = templateSrv.replace($scope.panel.triggers.host.filter);
$scope.panel.triggers.application.value = appids.length ? appids : null; $scope.datasource.queryProcessor.filterApplications(groupFilter, hostFilter)
.then(function(apps) {
$scope.metric.filteredApplications = apps;
}); });
}).then($scope.refreshData);
}; };
$scope.updateGroups = function() { $scope.onTargetPartChange = function (targetPart) {
return datasourceSrv.get($scope.panel.datasource).then(function (datasource) { var regexStyle = {'color': '#CCA300'};
return $scope.updateGroupList(datasource); targetPart.isRegex = isRegex(targetPart.filter);
}); targetPart.style = targetPart.isRegex ? regexStyle : {};
}; };
$scope.updateHosts = function() { function isRegex(str) {
return datasourceSrv.get($scope.panel.datasource).then(function (datasource) { // Pattern for testing regex
return $scope.updateHostList(datasource); var regexPattern = /^\/(.*)\/([gmi]*)$/m;
}); return regexPattern.test(str);
}; }
$scope.updateApplications = function() { $scope.parseTarget = function() {
return datasourceSrv.get($scope.panel.datasource).then(function (datasource) { $scope.initFilters();
return $scope.updateAppList(datasource); var newTarget = _.cloneDeep($scope.panel.triggers);
}); if (!_.isEqual($scope.oldTarget, $scope.panel.triggers)) {
$scope.oldTarget = newTarget;
$scope.get_data();
}
}; };
$scope.refreshTriggerSeverity = function() { $scope.refreshTriggerSeverity = function() {
@@ -266,38 +287,32 @@ function (angular, app, _, $, config, PanelMeta) {
}); });
}; };
$scope.updateGroupList = function (datasource) { /**
datasource.zabbixAPI.performHostGroupSuggestQuery().then(function (groups) { * Convert event age from Unix format (milliseconds sins 1970)
$scope.metric.groupList = $scope.metric.groupList.concat(groups); * to Zabbix format (like at Last 20 issues panel).
}); * @param {Date} AgeUnix time in Unix format
}; * @return {string} Formatted time
*/
$scope.updateHostList = function (datasource) { function toZabbixAgeFormat(ageUnix) {
var groups = $scope.panel.triggers.group.groupid ? $scope.panel.triggers.group.name : '*'; var age = new Date(+ageUnix);
if (groups) { var ageZabbix = age.getSeconds() + 's';
datasource.zabbixAPI.hostFindQuery(groups).then(function (hosts) { if (age.getMinutes()) {
$scope.metric.hostList = [{name: 'All', hostid: null}]; ageZabbix = age.getMinutes() + 'm ' + ageZabbix;
$scope.metric.hostList = $scope.metric.hostList.concat(hosts);
});
} }
}; if (age.getHours()) {
ageZabbix = age.getHours() + 'h ' + ageZabbix;
$scope.updateAppList = function (datasource) {
var groups = $scope.panel.triggers.group.groupid ? $scope.panel.triggers.group.name : '*';
var hosts = $scope.panel.triggers.host.hostid ? $scope.panel.triggers.host.name : '*';
if (groups && hosts) {
datasource.zabbixAPI.appFindQuery(hosts, groups).then(function (apps) {
apps = _.map(_.uniq(_.map(apps, 'name')), function (appname) {
return {
name: appname,
value: appname
};
});
$scope.metric.applicationList = [{name: 'All', value: null}];
$scope.metric.applicationList = $scope.metric.applicationList.concat(apps);
});
} }
}; if (age.getDate() - 1) {
ageZabbix = age.getDate() - 1 + 'd ' + ageZabbix;
}
if (age.getMonth()) {
ageZabbix = age.getMonth() + 'M ' + ageZabbix;
}
if (age.getYear() - 70) {
ageZabbix = age.getYear() -70 + 'y ' + ageZabbix;
}
return ageZabbix;
}
$scope.init(); $scope.init();
} }