more work on influxdb 0.9 query editor and query builder, can now handle regex conditions, tag operator and tag value quotes changes automatically depending if the tag value is a regex or not, #1525

This commit is contained in:
Torkel Ödegaard 2015-06-26 10:38:39 +02:00
parent dd8d6bc705
commit 3f167d7fd1
4 changed files with 56 additions and 12 deletions

View File

@ -8,6 +8,13 @@ function (_) {
this.target = target; this.target = target;
} }
function renderTagCondition (key, value) {
if (value && value[0] === '/' && value[value.length - 1] === '/') {
return key + ' =~ ' + value;
}
return key + " = '" + value + "'";
}
var p = InfluxQueryBuilder.prototype; var p = InfluxQueryBuilder.prototype;
p.build = function() { p.build = function() {
@ -42,7 +49,7 @@ function (_) {
if (tag.key === withKey) { if (tag.key === withKey) {
return memo; return memo;
} }
memo.push(' ' + tag.key + '=' + "'" + tag.value + "'"); memo.push(renderTagCondition(tag.key, tag.value));
return memo; return memo;
}, []); }, []);
@ -72,7 +79,7 @@ function (_) {
query += aggregationFunc + '(value)'; query += aggregationFunc + '(value)';
query += ' FROM ' + measurement + ' WHERE '; query += ' FROM ' + measurement + ' WHERE ';
var conditions = _.map(target.tags, function(tag) { var conditions = _.map(target.tags, function(tag) {
return tag.key + '=' + "'" + tag.value + "' "; return renderTagCondition(tag.key, tag.value);
}); });
conditions.push('$timeFilter'); conditions.push('$timeFilter');

View File

@ -39,7 +39,7 @@ function (angular, _, InfluxQueryBuilder) {
$scope.tagSegments.push(MetricSegment.newCondition(tag.condition)); $scope.tagSegments.push(MetricSegment.newCondition(tag.condition));
} }
$scope.tagSegments.push(new MetricSegment({value: tag.key, type: 'key', cssClass: 'query-segment-key' })); $scope.tagSegments.push(new MetricSegment({value: tag.key, type: 'key', cssClass: 'query-segment-key' }));
$scope.tagSegments.push(new MetricSegment({fake: true, value: "=", cssClass: 'query-segment-operator'})); $scope.tagSegments.push(new MetricSegment.newOperator("="));
$scope.tagSegments.push(new MetricSegment({value: tag.value, type: 'value', cssClass: 'query-segment-value'})); $scope.tagSegments.push(new MetricSegment({value: tag.value, type: 'value', cssClass: 'query-segment-value'}));
}); });
@ -177,6 +177,7 @@ function (angular, _, InfluxQueryBuilder) {
$scope.tagSegmentUpdated = function(segment, index) { $scope.tagSegmentUpdated = function(segment, index) {
$scope.tagSegments[index] = segment; $scope.tagSegments[index] = segment;
// handle remove tag condition
if (segment.value === $scope.removeTagFilterSegment.value) { if (segment.value === $scope.removeTagFilterSegment.value) {
$scope.tagSegments.splice(index, 3); $scope.tagSegments.splice(index, 3);
if ($scope.tagSegments.length === 0) { if ($scope.tagSegments.length === 0) {
@ -193,7 +194,7 @@ function (angular, _, InfluxQueryBuilder) {
if (index > 2) { if (index > 2) {
$scope.tagSegments.splice(index, 0, MetricSegment.newCondition('AND')); $scope.tagSegments.splice(index, 0, MetricSegment.newCondition('AND'));
} }
$scope.tagSegments.push(MetricSegment.newFake('=', 'operator', 'query-segment-operator')); $scope.tagSegments.push(MetricSegment.newOperator('='));
$scope.tagSegments.push(MetricSegment.newFake('select tag value', 'value', 'query-segment-value')); $scope.tagSegments.push(MetricSegment.newFake('select tag value', 'value', 'query-segment-value'));
segment.type = 'key'; segment.type = 'key';
segment.cssClass = 'query-segment-key'; segment.cssClass = 'query-segment-key';
@ -210,7 +211,7 @@ function (angular, _, InfluxQueryBuilder) {
$scope.rebuildTargetTagConditions = function() { $scope.rebuildTargetTagConditions = function() {
var tags = []; var tags = [];
var tagIndex = 0; var tagIndex = 0;
_.each($scope.tagSegments, function(segment2) { _.each($scope.tagSegments, function(segment2, index) {
if (segment2.type === 'key') { if (segment2.type === 'key') {
if (tags.length === 0) { if (tags.length === 0) {
tags.push({}); tags.push({});
@ -219,6 +220,7 @@ function (angular, _, InfluxQueryBuilder) {
} }
else if (segment2.type === 'value') { else if (segment2.type === 'value') {
tags[tagIndex].value = segment2.value; tags[tagIndex].value = segment2.value;
$scope.tagSegments[index-1] = $scope.getTagValueOperator(segment2.value);
} }
else if (segment2.type === 'condition') { else if (segment2.type === 'condition') {
tags.push({ condition: segment2.value }); tags.push({ condition: segment2.value });
@ -230,6 +232,14 @@ function (angular, _, InfluxQueryBuilder) {
$scope.$parent.get_data(); $scope.$parent.get_data();
}; };
$scope.getTagValueOperator = function(tagValue) {
if (tagValue[0] === '/' && tagValue[tagValue.length - 1] === '/') {
return MetricSegment.newOperator('=~');
}
return MetricSegment.newOperator('=');
};
function MetricSegment(options) { function MetricSegment(options) {
if (options === '*' || options.value === '*') { if (options === '*' || options.value === '*') {
this.value = '*'; this.value = '*';
@ -265,6 +275,10 @@ function (angular, _, InfluxQueryBuilder) {
return new MetricSegment({value: condition, type: 'condition', cssClass: 'query-keyword' }); return new MetricSegment({value: condition, type: 'condition', cssClass: 'query-keyword' });
}; };
MetricSegment.newOperator = function(op) {
return new MetricSegment({value: op, type: 'operator', cssClass: 'query-segment-operator' });
};
MetricSegment.newPlusButton = function() { MetricSegment.newPlusButton = function() {
return new MetricSegment({fake: true, html: '<i class="fa fa-plus "></i>', type: 'plus-button' }); return new MetricSegment({fake: true, html: '<i class="fa fa-plus "></i>', type: 'plus-button' });
}; };

View File

@ -31,6 +31,11 @@ define([
+ ' GROUP BY time($interval) ORDER BY asc'); + ' GROUP BY time($interval) ORDER BY asc');
}); });
it('should switch regex operator with tag value is regex', function() {
var builder = new InfluxQueryBuilder({measurement: 'cpu', tags: [{key: 'app', value: '/e.*/'}]});
var query = builder.build();
expect(query).to.be('SELECT mean(value) FROM "cpu" WHERE app =~ /e.*/ AND $timeFilter GROUP BY time($interval) ORDER BY asc');
});
}); });
describe('series with multiple tags only', function() { describe('series with multiple tags only', function() {
@ -105,6 +110,12 @@ define([
expect(query).to.be('SHOW TAG VALUES FROM "cpu" WITH KEY = "app" WHERE host = \'server1\''); expect(query).to.be('SHOW TAG VALUES FROM "cpu" WITH KEY = "app" WHERE host = \'server1\'');
}); });
it('should switch to regex operator in tag condition', function() {
var builder = new InfluxQueryBuilder({measurement: 'cpu', tags: [{key: 'host', value: '/server.*/'}]});
var query = builder.buildExploreQuery('TAG_VALUES', 'app');
expect(query).to.be('SHOW TAG VALUES FROM "cpu" WITH KEY = "app" WHERE host =~ /server.*/');
});
}); });
}); });

View File

@ -65,6 +65,18 @@ define([
}); });
}); });
describe('when last tag value segment is updated to regex', function() {
beforeEach(function() {
ctx.scope.init();
ctx.scope.tagSegmentUpdated({value: 'asd', type: 'plus-button'}, 0);
ctx.scope.tagSegmentUpdated({value: '/server.*/', type: 'value'}, 2);
});
it('should update operator', function() {
expect(ctx.scope.tagSegments[1].value).to.be('=~');
});
});
describe('when second tag key is added', function() { describe('when second tag key is added', function() {
beforeEach(function() { beforeEach(function() {
ctx.scope.init(); ctx.scope.init();