IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-01-23 23:13:52 -06:00
Code Issues Packages Projects Releases Wiki Activity

mysql: added query help

Browse Source
This commit is contained in:
Torkel Ödegaard 2017-04-21 15:52:42 +02:00
parent 97e2d75f51
commit ea53e7221e
3 changed files with 41 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/app/plugins/datasource/mysql/module.ts
View File

@ -23,6 +23,7 @@ class MysqlQueryCtrl extends QueryCtrl {
target: MysqlQuery; target: MysqlQuery;
lastQueryMeta: QueryMeta; lastQueryMeta: QueryMeta;
lastQueryError: string; lastQueryError: string;
showHelp: boolean;
constructor($scope, $injector) { constructor($scope, $injector) {
super($scope, $injector); super($scope, $injector);

35
public/app/plugins/datasource/mysql/partials/query.editor.html
View File

@ -12,9 +12,12 @@
<select class="gf-form-input gf-size-auto" ng-model="ctrl.target.format" ng-options="f.value as f.text for f in ctrl.formats" ng-change="ctrl.refresh()"></select> <select class="gf-form-input gf-size-auto" ng-model="ctrl.target.format" ng-options="f.value as f.text for f in ctrl.formats" ng-change="ctrl.refresh()"></select>
</div> </div>
</div> </div>
<div class="gf-form max-width-30"> <div class="gf-form">
<label class="gf-form-label query-keyword">Name by</label> <label class="gf-form-label query-keyword" ng-click="ctrl.showHelp = !ctrl.showHelp">
<input type="text" class="gf-form-input" ng-model="ctrl.target.alias" spellcheck='false' placeholder="pattern" ng-blur="ctrl.refresh()"> Show Help
<i class="fa fa-caret-down" ng-show="ctrl.showHelp"></i>
<i class="fa fa-caret-right" ng-hide="ctrl.showHelp"></i>
</label>
</div> </div>
<div class="gf-form" ng-show="ctrl.lastQueryMeta"> <div class="gf-form" ng-show="ctrl.lastQueryMeta">
<label class="gf-form-label query-keyword" ng-click="ctrl.showLastQuerySQL = !ctrl.showLastQuerySQL"> <label class="gf-form-label query-keyword" ng-click="ctrl.showLastQuerySQL = !ctrl.showLastQuerySQL">
@ -28,7 +31,29 @@
</div> </div>
</div> </div>
<pre class="small" ng-show="ctrl.showLastQuerySQL">{{ctrl.lastQueryMeta.sql}}</pre> <div class="gf-form" ng-show="ctrl.showLastQuerySQL">
<pre class="small alert alert-error" ng-show="ctrl.lastQueryError">{{ctrl.lastQueryError}}</pre> <pre class="gf-form-pre">{{ctrl.lastQueryMeta.sql}}</pre>
</div>
<div class="gf-form" ng-show="ctrl.showHelp">
<pre class="gf-form-pre alert alert-info">Time series:
- return column named time_sec (UTC in seconds), use UNIX_TIMESTAMP(column)
- return column named value for the time point value
- return column named metric to represent the series name
Table:
- return any set of columns
Macros:
- $__time(column) -&gt; UNIX_TIMESTAMP(column) as time_sec
- $__timeFilter(column) -&gt; UNIX_TIMESTAMP(time_date_time) &gt; from AND UNIX_TIMESTAMP(time_date_time) &lt; 1492750877
</pre>
</div>
</div>
<div class="gf-form" ng-show="ctrl.lastQueryError">
<pre class="gf-form-pre alert alert-error">{{ctrl.lastQueryError}}</pre>
</div>
</query-editor-row> </query-editor-row>

10
public/sass/components/_gf-form.scss
View File

@ -66,6 +66,16 @@ $gf-form-margin: 0.25rem;
} }
} }
.gf-form-pre {
display: block;
flex-grow: 1;
font-size: $font-size-sm;
margin: 0;
margin-right: $gf-form-margin;
border: $input-btn-border-width solid transparent;
@include border-radius($label-border-radius-sm);
}
.gf-form-error { .gf-form-error {
padding: $input-padding-y $input-padding-x; padding: $input-padding-y $input-padding-x;
margin-right: $gf-form-margin; margin-right: $gf-form-margin;