query.editor.html 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. <div class="tight-form">
  2. <ul class="tight-form-list pull-right">
  3. <li class="tight-form-item small" ng-show="target.datasource">
  4. <em>{{target.datasource}}</em>
  5. </li>
  6. <li class="tight-form-item">
  7. <div class="dropdown">
  8. <a class="pointer dropdown-toggle" data-toggle="dropdown" tabindex="1">
  9. <i class="fa fa-bars"></i>
  10. </a>
  11. <ul class="dropdown-menu pull-right" role="menu">
  12. <li role="menuitem"><a tabindex="1" ng-click="toggleQueryMode()">Switch editor mode</a></li>
  13. <li role="menuitem"><a tabindex="1" ng-click="duplicateDataQuery(target)">Duplicate</a></li>
  14. <li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index-1)">Move up </a></li>
  15. <li role="menuitem"><a tabindex="1" ng-click="moveDataQuery($index, $index+1)">Move down</a></li>
  16. </ul>
  17. </div>
  18. </li>
  19. <li class="tight-form-item last">
  20. <a class="pointer" tabindex="1" ng-click="removeDataQuery(target)">
  21. <i class="fa fa-remove"></i>
  22. </a>
  23. </li>
  24. </ul>
  25. <ul class="tight-form-list">
  26. <li class="tight-form-item" style="min-width: 15px; text-align: center">
  27. {{target.refId}}
  28. </li>
  29. <li>
  30. <a class="tight-form-item" ng-click="target.hide = !target.hide; get_data();" role="menuitem">
  31. <i class="fa fa-eye"></i>
  32. </a>
  33. </li>
  34. </ul>
  35. <!-- Raw Query mode -->
  36. <input type="text" class="tight-form-clear-input" style="width: 80%" ng-model="target.query"
  37. placeholder="select ..." ng-show="target.rawQuery"
  38. give-focus="target.rawQuery"
  39. spellcheck='false'
  40. data-min-length=0 data-items=100
  41. ng-model-onblur
  42. ng-blur="get_data()"></input>
  43. <!-- Query editor mode -->
  44. <ul class="tight-form-list" role="menu" ng-hide="target.rawQuery">
  45. <li class="tight-form-item">
  46. series
  47. </li>
  48. <li>
  49. <input type="text"
  50. class="tight-form-input span8"
  51. ng-model="target.series"
  52. spellcheck='false'
  53. bs-typeahead="listSeries"
  54. match-all="true"
  55. min-length="3"
  56. placeholder="series name"
  57. data-min-length=0 data-items=100
  58. ng-blur="seriesBlur()">
  59. </li>
  60. <li class="tight-form-item">
  61. alias
  62. </li>
  63. <li>
  64. <input type="text" class="input-medium tight-form-input" ng-model="target.alias"
  65. spellcheck='false' placeholder="alias" ng-blur="get_data()">
  66. </li>
  67. </ul>
  68. <div class="clearfix"></div>
  69. </div>
  70. <div class="tight-form">
  71. <!-- Raw Query mode -->
  72. <ul class="tight-form-list" ng-show="target.rawQuery">
  73. <li class="tight-form-item tight-form-align">
  74. alias
  75. </li>
  76. <li>
  77. <input type="text"
  78. class="input-medium tight-form-input"
  79. ng-model="target.alias"
  80. spellcheck='false'
  81. placeholder="alias"
  82. ng-blur="get_data()">
  83. </li>
  84. <li class="tight-form-item">
  85. group by time
  86. </li>
  87. <li>
  88. <input type="text" class="input-mini tight-form-input" ng-model="target.interval"
  89. spellcheck='false' placeholder="{{interval}}" data-placement="right"
  90. bs-tooltip="'Leave blank for auto handling based on time range and panel width'"
  91. ng-model-onblur ng-change="get_data()" >
  92. </li>
  93. </ul>
  94. <!-- Query editor mode -->
  95. <ul class="tight-form-list" role="menu" ng-hide="target.rawQuery">
  96. <li class="tight-form-item tight-form-align">
  97. select
  98. </li>
  99. <li class="dropdown">
  100. <span influxdb-func-editor08 class="tight-form-item tight-form-func">
  101. </span>
  102. </li>
  103. <li class="tight-form-item">
  104. where
  105. </li>
  106. <li>
  107. <input type="text" class="input-medium tight-form-input" ng-model="target.condition"
  108. bs-tooltip="'Add a where clause'" data-placement="right" spellcheck='false' placeholder="column ~= value" ng-blur="get_data()">
  109. </li>
  110. <li class="tight-form-item">
  111. group by time
  112. </li>
  113. <li>
  114. <input type="text" class="input-mini tight-form-input" ng-model="target.interval"
  115. spellcheck='false' placeholder="{{interval}}" data-placement="right"
  116. bs-tooltip="'Leave blank for auto handling based on time range and panel width'"
  117. ng-model-onblur ng-change="get_data()" >
  118. </li>
  119. <li class="tight-form-item">
  120. and
  121. </li>
  122. <li>
  123. <input type="text" class="input-small tight-form-input" ng-model="target.groupby_field" bs-tooltip="'Add a group by column or leave blank'"
  124. placeholder="column" spellcheck="false" bs-typeahead="listColumns" data-min-length=0 ng-blur="get_data()">
  125. </li>
  126. <li class="dropdown">
  127. <a class="tight-form-item pointer" data-toggle="dropdown" bs-tooltip="'Insert missing values, important when stacking'" data-placement="right">
  128. <span ng-show="target.fill">
  129. fill ({{target.fill}})
  130. </span>
  131. <span ng-show="!target.fill">
  132. no fill
  133. </span>
  134. </a>
  135. <ul class="dropdown-menu">
  136. <li><a ng-click="target.fill = ''">no fill</a></li>
  137. <li><a ng-click="target.fill = 'null'">fill (null)</a></li>
  138. <li><a ng-click="target.fill = '0'">fill (0)</a></li>
  139. </ul>
  140. </li>
  141. </ul>
  142. <div class="clearfix"></div>
  143. </div>