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

InfluxDB: flux query editor cleanup (#25753)

Browse Source
This commit is contained in:
Ryan McKinley 2020-06-22 16:36:58 -07:00 committed by GitHub
parent 740a9ad5f9
commit 46df05fd9d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 24 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
public/app/plugins/datasource/influxdb/components/FluxQueryEditor.tsx
View File

@ -2,7 +2,7 @@ import React, { Component } from 'react';
import coreModule from 'app/core/core_module'; import coreModule from 'app/core/core_module';
import { InfluxQuery } from '../types'; import { InfluxQuery } from '../types';
import { SelectableValue } from '@grafana/data'; import { SelectableValue } from '@grafana/data';
import { InlineFormLabel, LinkButton, Select, TextArea } from '@grafana/ui'; import { InlineFormLabel, LinkButton, Segment, TextArea } from '@grafana/ui';
interface Props { interface Props {
target: InfluxQuery; target: InfluxQuery;
@ -16,7 +16,7 @@ const samples: Array<SelectableValue<string>> = [
label: 'Simple query', label: 'Simple query',
description: 'filter by measurment and field', description: 'filter by measurment and field',
value: `from(bucket: "db/rp") value: `from(bucket: "db/rp")
|> range(start: v.timeRangeStart, stop:timeRangeStop) |> range(start: v.timeRangeStart, stop:v.timeRangeStop)
|> filter(fn: (r) => |> filter(fn: (r) =>
r._measurement == "example-measurement" and r._measurement == "example-measurement" and
r._field == "example-field" r._field == "example-field"
@ -51,7 +51,7 @@ v1.measurements(bucket: v.bucket)`,
label: 'Schema Exploration: (fields)', label: 'Schema Exploration: (fields)',
description: 'Return every possible key in a single table', description: 'Return every possible key in a single table',
value: `from(bucket: v.bucket) value: `from(bucket: v.bucket)
|> range(start: -30m) |> range(start: v.timeRangeStart, stop:timeRangeStop)
|> keys() |> keys()
|> keep(columns: ["_value"]) |> keep(columns: ["_value"])
|> group() |> group()
@ -112,10 +112,10 @@ export class FluxQueryEditor extends Component<Props> {
</div> </div>
<div className="gf-form-inline"> <div className="gf-form-inline">
<div className="gf-form"> <div className="gf-form">
<InlineFormLabel width={6} tooltip="This supports queries copied from chronograph"> <InlineFormLabel width={5} tooltip="Queries can be copied from chronograph">
Help Help
</InlineFormLabel> </InlineFormLabel>
<Select width={20} options={samples} placeholder="Sample Query" onChange={this.onSampleChange} /> <Segment options={samples} value="Sample Query" onChange={this.onSampleChange} />
<LinkButton <LinkButton
icon="external-link-alt" icon="external-link-alt"
variant="secondary" variant="secondary"
@ -137,6 +137,6 @@ export class FluxQueryEditor extends Component<Props> {
coreModule.directive('fluxQueryEditor', [ coreModule.directive('fluxQueryEditor', [
'reactDirective', 'reactDirective',
(reactDirective: any) => { (reactDirective: any) => {
return reactDirective(FluxQueryEditor, ['target', 'change']); return reactDirective(FluxQueryEditor, ['target', 'change', 'refresh']);
}, },
]); ]);

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

@ -1,6 +1,10 @@
<query-editor-row ng-if="ctrl.datasource.is2x" query-ctrl="ctrl" can-collapse="true" has-text-edit-mode="false"> <query-editor-row ng-if="ctrl.datasource.is2x" query-ctrl="ctrl" can-collapse="true" has-text-edit-mode="true">
<flux-query-editor target="ctrl.target" change="ctrl.onChange" refresh="ctrl.refresh"></flux-query-editor> <flux-query-editor
target="ctrl.target"
change="ctrl.onChange"
refresh="ctrl.onRunQuery"
></flux-query-editor>
</query-editor-row> </query-editor-row>
<query-editor-row ng-if="!ctrl.datasource.is2x" query-ctrl="ctrl" can-collapse="true" has-text-edit-mode="true"> <query-editor-row ng-if="!ctrl.datasource.is2x" query-ctrl="ctrl" can-collapse="true" has-text-edit-mode="true">
@ -233,4 +237,4 @@
</div> </div>
</div> </div>
</div> </div>
</query-editor-row> </query-editor-row>

11
public/app/plugins/datasource/influxdb/query_ctrl.ts
View File

@ -75,10 +75,17 @@ export class InfluxQueryCtrl extends QueryCtrl {
}); });
} }
/**
* Only called for flux
*/
onChange = (target: InfluxQuery) => { onChange = (target: InfluxQuery) => {
this.target.query = target.query; this.target.query = target.query;
}; };
onRunQuery = () => {
this.panelCtrl.refresh();
};
removeOrderByTime() { removeOrderByTime() {
this.target.orderByTime = 'ASC'; this.target.orderByTime = 'ASC';
} }
@ -247,6 +254,10 @@ export class InfluxQueryCtrl extends QueryCtrl {
// Only valid for InfluxQL queries // Only valid for InfluxQL queries
toggleEditorMode() { toggleEditorMode() {
if (this.datasource.is2x) {
return; // nothing
}
try { try {
this.target.query = this.queryModel.render(false); this.target.query = this.queryModel.render(false);
} catch (err) { } catch (err) {