query.editor.html 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  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"
  31. ng-click="target.hide = !target.hide; get_data();"
  32. role="menuitem">
  33. <i class="fa fa-eye"></i>
  34. </a>
  35. </li>
  36. </ul>
  37. <ul class="tight-form-list" role="menu">
  38. <li class="tight-form-item query-keyword" style="width: 100px">
  39. Metric
  40. </li>
  41. <li>
  42. <input type="text" class="input-large tight-form-input" ng-model="target.metric"
  43. spellcheck='false' bs-typeahead="suggestMetrics" placeholder="metric name" data-min-length=0 data-items=100
  44. ng-blur="targetBlur()">
  45. </input>
  46. <a bs-tooltip="target.errors.metric" style="color: rgb(229, 189, 28)" ng-show="target.errors.metric">
  47. <i class="fa fa-warning"></i>
  48. </a>
  49. </li>
  50. <li class="tight-form-item query-keyword">
  51. Aggregator
  52. </li>
  53. <li>
  54. <select ng-model="target.aggregator" class="tight-form-input input-small"
  55. ng-options="agg for agg in aggregators"
  56. ng-change="targetBlur()">
  57. </select>
  58. <a bs-tooltip="target.errors.aggregator" style="color: rgb(229, 189, 28)" ng-show="target.errors.aggregator">
  59. <i class="fa fa-warning"></i>
  60. </a>
  61. </li>
  62. <li class="tight-form-item query-keyword">
  63. Alias:
  64. <tip>Use patterns like $tag_tagname to replace part of the alias for a tag value</tip>
  65. </li>
  66. <li>
  67. <input type="text" class="tight-form-input input-large"
  68. ng-model="target.alias"
  69. spellcheck='false'
  70. placeholder="series alias"
  71. data-min-length=0 data-items=100
  72. ng-blur="targetBlur()"></input>
  73. </li>
  74. </ul>
  75. <div class="clearfix"></div>
  76. </div>
  77. <div class="tight-form">
  78. <ul class="tight-form-list" role="menu">
  79. <li class="tight-form-item tight-form-align query-keyword" style="width: 100px">
  80. Down sample
  81. </li>
  82. <li>
  83. <input type="text" class="input-large tight-form-input"
  84. ng-model="target.downsampleInterval"
  85. ng-model-onblur
  86. ng-change="targetBlur()"
  87. placeholder="interval (empty = auto)"></input>
  88. </li>
  89. <li class="tight-form-item query-keyword">
  90. Aggregator
  91. </li>
  92. <li>
  93. <select ng-model="target.downsampleAggregator" class="tight-form-input input-small"
  94. ng-options="agg for agg in aggregators"
  95. ng-change="targetBlur()">
  96. </select>
  97. </li>
  98. <li class="tight-form-item query-keyword">
  99. Fill policy
  100. <tip>Available since OpenTSDB 2.2</tip>
  101. </li>
  102. <li>
  103. <select ng-model="target.downsampleFillPolicy" class="tight-form-input input-small"
  104. ng-options="agg for agg in fillPolicies"
  105. ng-change="targetBlur()">
  106. </select>
  107. </li>
  108. <li class="tight-form-item query-keyword">
  109. Disable downsampling <editor-checkbox text="" model="target.disableDownsampling" change="targetBlur()"></editor-checkbox>
  110. </li>
  111. </ul>
  112. <div class="clearfix"></div>
  113. </div>
  114. <div class="tight-form">
  115. <ul class="tight-form-list" role="menu">
  116. <li class="tight-form-item tight-form-align query-keyword" style="width: 100px">
  117. Tags
  118. </li>
  119. <li ng-repeat="(key, value) in target.tags track by $index" class="tight-form-item">
  120. {{key}}&nbsp;=&nbsp;{{value}}
  121. <a ng-click="editTag(key, value)">
  122. <i class="fa fa-pencil"></i>
  123. </a>
  124. <a ng-click="removeTag(key)">
  125. <i class="fa fa-remove"></i>
  126. </a>
  127. </li>
  128. <li class="tight-form-item query-keyword" ng-hide="addTagMode">
  129. <a ng-click="addTag()">
  130. <i class="fa fa-plus"></i>
  131. </a>
  132. </li>
  133. <li ng-show="addTagMode">
  134. <input type="text" class="input-small tight-form-input" spellcheck='false'
  135. bs-typeahead="suggestTagKeys" data-min-length=0 data-items=100
  136. ng-model="target.currentTagKey" placeholder="key"></input>
  137. <input type="text" class="input-small tight-form-input"
  138. spellcheck='false' bs-typeahead="suggestTagValues"
  139. data-min-length=0 data-items=100 ng-model="target.currentTagValue" placeholder="value">
  140. </input>
  141. <a ng-click="addTag()">
  142. add tag
  143. </a>
  144. <a bs-tooltip="target.errors.tags"
  145. style="color: rgb(229, 189, 28)"
  146. ng-show="target.errors.tags">
  147. <i class="fa fa-warning"></i>
  148. </a>
  149. </li>
  150. </ul>
  151. <div class="clearfix"></div>
  152. </div>
  153. <div class="tight-form">
  154. <ul class="tight-form-list" role="menu">
  155. <li class="tight-form-item tight-form-align query-keyword" style="width: 100px">
  156. Rate <editor-checkbox text="" model="target.shouldComputeRate" change="targetBlur()"></editor-checkbox>
  157. </li>
  158. <li class="tight-form-item query-keyword" ng-hide="!target.shouldComputeRate">
  159. Counter <editor-checkbox text="" model="target.isCounter" change="targetBlur()"></editor-checkbox>
  160. </li>
  161. <li class="tight-form-item query-keyword" ng-hide="!target.isCounter || !target.shouldComputeRate">
  162. Counter Max:
  163. </li>
  164. <li ng-hide="!target.isCounter || !target.shouldComputeRate">
  165. <input type="text" class="tight-form-input input-small" ng-disabled="!target.shouldComputeRate"
  166. ng-model="target.counterMax" spellcheck='false'
  167. placeholder="max value" ng-model-onblur
  168. ng-blur="targetBlur()"></input>
  169. </li>
  170. <li class="tight-form-item query-keyword" ng-hide="!target.isCounter || !target.shouldComputeRate">
  171. Reset Value:
  172. </li>
  173. <li ng-hide="!target.isCounter || !target.shouldComputeRate">
  174. <input type="text" class="tight-form-input input-small" ng-disabled="!target.shouldComputeRate"
  175. ng-model="target.counterResetValue" spellcheck='false'
  176. placeholder="reset value" ng-model-onblur
  177. ng-blur="targetBlur()"></input>
  178. </li>
  179. </ul>
  180. <div class="clearfix"></div>
  181. </div>