IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

feat(influxdb): more work onnew influxdb editor

Browse Source
This commit is contained in:
Torkel Ödegaard 2015-11-24 17:01:18 +01:00
parent 9b4150509c
commit 31e2a8b8e9
6 changed files with 50 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
public/app/plugins/datasource/influxdb/influx_query.ts
View File

@ -6,9 +6,19 @@ import queryPart = require('./query_part');
declare var InfluxQueryBuilder: any;
class InfluxSelectModel {
modelParts: any[];
persistedParts: any[];
constructor(persistedParts: any[]) {
this.persistedParts = persistedParts;
this.modelParts = _.map(persistedParts, queryPart.create);
}
}
class InfluxQuery {
target: any;
selectParts: any[];
selectModels: any[];
groupByParts: any;
queryBuilder: any;
@ -29,10 +39,8 @@ class InfluxQuery {
}
updateSelectParts() {
this.selectParts = _.map(this.target.select, function(parts: any) {
return _.map(parts, function(part: any) {
return queryPart.create(part);
});
this.selectModels = _.map(this.target.select, function(parts: any) {
return new InfluxSelectModel(parts);
});
}
@ -41,6 +49,18 @@ class InfluxQuery {
this.updateSelectParts();
}
removeSelectPart(selectModel, part) {
var partIndex = _.indexOf(selectModel.modelParts, part);
selectModel.persistedParts.splice(partIndex, 1);
this.updateSelectParts();
}
addSelectPart(selectModel, name) {
var partModel = queryPart.create({name: name});
selectModel.persistedParts.push(partModel.part);
selectModel.modelParts.push(partModel);
}
addSelect() {
this.target.select.push([
{name: 'mean', params: ['value']},
@ -92,8 +112,8 @@ class InfluxQuery {
var query = 'SELECT ';
var i, y;
for (i = 0; i < this.selectParts.length; i++) {
let parts = this.selectParts[i];
for (i = 0; i < this.selectModels.length; i++) {
let parts = this.selectModels[i].modelParts;
var selectText = "";
for (y = 0; y < parts.length; y++) {
let part = parts[y];

8
public/app/plugins/datasource/influxdb/partials/query.editor.html
View File

@ -65,15 +65,15 @@
<div ng-hide="target.rawQuery">
<div class="tight-form" ng-repeat="parts in queryModel.selectParts">
<div class="tight-form" ng-repeat="selectModel in queryModel.selectModels">
<ul class="tight-form-list">
<li class="tight-form-item query-keyword tight-form-align" style="width: 75px;">
<span ng-show="$index === 0">SELECT</span>
</li>
<li ng-repeat="part in parts">
<influx-query-part-editor part="part" class="tight-form-item tight-form-func"></influx-query-part-editor>
<li ng-repeat="part in selectModel.modelParts">
<influx-query-part-editor part="part" class="tight-form-item tight-form-func" remove-action="removeSelectPart(selectModel, part)" part-updated="selectPartUpdated(selectModel, part)"></influx-query-part-editor>
</li>
<li class="dropdown" dropdown-typeahead="selectMenu" dropdown-typeahead-on-select="selectMenuAction(parts, $item, $subItem)">
<li class="dropdown" dropdown-typeahead="selectMenu" dropdown-typeahead-on-select="selectMenuAction(selectModel, $item, $subItem)">
</li>
</ul>
<div class="clearfix"></div>

2
public/app/plugins/datasource/influxdb/partials/query_part.html
View File

@ -1,6 +1,6 @@
<div class="tight-form-func-controls">
<span class="pointer fa fa-question-circle"></span>
<span class="pointer fa fa-remove" ></span>
<span class="pointer fa fa-remove" ng-click="removeAction()" ></span>
</div>
<a ng-click="toggleControls()">{{part.def.name}}</a><span>(</span><span class="query-part-parameters"></span><span>)</span>

34
public/app/plugins/datasource/influxdb/query_ctrl.js
View File

@ -62,8 +62,18 @@ function (angular, _, InfluxQueryBuilder, InfluxQuery, queryPart) {
}, []);
};
$scope.selectMenuAction = function(selectParts, cat, subitem) {
selectParts.push(queryPart.create({name: subitem.value }));
$scope.selectMenuAction = function(selectModel, cat, subitem) {
$scope.queryModel.addSelectPart(selectModel, subitem.value);
$scope.get_data();
};
$scope.removeSelectPart = function(selectModel, part) {
$scope.queryModel.removeSelectPart(selectModel, part);
$scope.get_data();
};
$scope.selectPartUpdated = function() {
$scope.get_data();
};
$scope.fixTagSegments = function() {
@ -75,27 +85,9 @@ function (angular, _, InfluxQueryBuilder, InfluxQuery, queryPart) {
}
};
$scope.addGroupBy = function() {
$scope.target.groupBy.push({type: 'tag', key: "select tag"});
};
$scope.removeGroupBy = function(index) {
$scope.target.groupBy.splice(index, 1);
$scope.get_data();
};
$scope.addSelect = function() {
$scope.queryModel.addSelect();
};
$scope.removeSelect = function(index) {
$scope.queryModel.removeSelect(index);
$scope.get_data();
};
$scope.measurementChanged = function() {
$scope.target.measurement = $scope.measurementSegment.value;
$scope.$parent.get_data();
$scope.get_data();
};
$scope.getFields = function() {

3
public/app/plugins/datasource/influxdb/query_part.ts
View File

@ -135,7 +135,8 @@ class QueryPart {
throw {message: 'Could not find query part ' + part.name};
}
this.params = part.params || _.clone(this.def.defaultParams);
part.params = part.params || _.clone(this.def.defaultParams);
this.params = part.params;
this.updateText();
}

5
public/app/plugins/datasource/influxdb/query_part_editor.js
View File

@ -17,7 +17,8 @@ function (angular, _, $) {
templateUrl: 'app/plugins/datasource/influxdb/partials/query_part.html',
scope: {
part: "=",
deleteAction: "&",
removeAction: "&",
partUpdated: "&",
},
link: function postLink($scope, elem) {
var part = $scope.part;
@ -55,7 +56,7 @@ function (angular, _, $) {
$link.html(templateSrv.highlightVariablesAsHtml(newValue));
part.updateParam($input.val(), paramIndex);
$scope.$apply($scope.targetChanged);
$scope.$apply($scope.partUpdated);
}
$input.hide();