query.editor.html 2.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. <query-editor-row query-ctrl="ctrl" can-collapse="false">
  2. <div class="gf-form-inline">
  3. <div class="gf-form gf-form--grow">
  4. <textarea rows="5" class="gf-form-input" ng-model="ctrl.target.rawSql" spellcheck="false" placeholder="query expression" data-min-length=0 data-items=100 ng-model-onblur ng-change="ctrl.panelCtrl.refresh()"></textarea>
  5. </div>
  6. </div>
  7. <div class="gf-form-inline">
  8. <div class="gf-form gf-form--grow">
  9. <code-editor content="ctrl.target.rawSql" on-change="ctrl.panelCtrl.refresh()"
  10. data-mode="sql">
  11. </code-editor>
  12. </div>
  13. </div>
  14. <div class="gf-form-inline">
  15. <div class="gf-form">
  16. <label class="gf-form-label query-keyword">Format as</label>
  17. <div class="gf-form-select-wrapper">
  18. <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>
  19. </div>
  20. </div>
  21. <div class="gf-form">
  22. <label class="gf-form-label query-keyword" ng-click="ctrl.showHelp = !ctrl.showHelp">
  23. Show Help
  24. <i class="fa fa-caret-down" ng-show="ctrl.showHelp"></i>
  25. <i class="fa fa-caret-right" ng-hide="ctrl.showHelp"></i>
  26. </label>
  27. </div>
  28. <div class="gf-form" ng-show="ctrl.lastQueryMeta">
  29. <label class="gf-form-label query-keyword" ng-click="ctrl.showLastQuerySQL = !ctrl.showLastQuerySQL">
  30. Generated SQL
  31. <i class="fa fa-caret-down" ng-show="ctrl.showLastQuerySQL"></i>
  32. <i class="fa fa-caret-right" ng-hide="ctrl.showLastQuerySQL"></i>
  33. </label>
  34. </div>
  35. <div class="gf-form gf-form--grow">
  36. <div class="gf-form-label gf-form-label--grow"></div>
  37. </div>
  38. </div>
  39. <div class="gf-form" ng-show="ctrl.showLastQuerySQL">
  40. <pre class="gf-form-pre">{{ctrl.lastQueryMeta.sql}}</pre>
  41. </div>
  42. <div class="gf-form" ng-show="ctrl.showHelp">
  43. <pre class="gf-form-pre alert alert-info">Time series:
  44. - return column named time_sec (UTC in seconds), use UNIX_TIMESTAMP(column)
  45. - return column named value for the time point value
  46. - return column named metric to represent the series name
  47. Table:
  48. - return any set of columns
  49. Macros:
  50. - $__time(column) -&gt; UNIX_TIMESTAMP(column) as time_sec
  51. - $__timeFilter(column) -&gt; UNIX_TIMESTAMP(time_date_time) &ge; from AND UNIX_TIMESTAMP(time_date_time) &le; 1492750877
  52. </pre>
  53. </div>
  54. </div>
  55. <div class="gf-form" ng-show="ctrl.lastQueryError">
  56. <pre class="gf-form-pre alert alert-error">{{ctrl.lastQueryError}}</pre>
  57. </div>
  58. </query-editor-row>