query.editor.html 6.3 KB

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