query.editor.html 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  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" style="width: 86px">
  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">
  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">
  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" style="width: 86px">
  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">
  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">
  99. <editor-checkbox text="Disable downsampling" model="target.disableDownsampling" change="targetBlur()"></editor-checkbox>
  100. </li>
  101. </ul>
  102. <div class="clearfix"></div>
  103. </div>
  104. <div class="tight-form">
  105. <ul class="tight-form-list" role="menu">
  106. <li class="tight-form-item tight-form-align" style="width: 86px">
  107. Tags
  108. </li>
  109. <li ng-repeat="(key, value) in target.tags track by $index" class="tight-form-item">
  110. {{key}}&nbsp;=&nbsp;{{value}}
  111. <a ng-click="removeTag(key)">
  112. <i class="fa fa-remove"></i>
  113. </a>
  114. </li>
  115. <li class="tight-form-item" ng-hide="addTagMode">
  116. <a ng-click="addTag()">
  117. <i class="fa fa-plus"></i>
  118. </a>
  119. </li>
  120. <li ng-show="addTagMode">
  121. <input type="text" class="input-small tight-form-input" spellcheck='false'
  122. bs-typeahead="suggestTagKeys" data-min-length=0 data-items=100
  123. ng-model="target.currentTagKey" placeholder="key"></input>
  124. <input type="text" class="input-small tight-form-input"
  125. spellcheck='false' bs-typeahead="suggestTagValues"
  126. data-min-length=0 data-items=100 ng-model="target.currentTagValue" placeholder="value">
  127. </input>
  128. <a ng-click="addTag()">
  129. add tag
  130. </a>
  131. <a bs-tooltip="target.errors.tags"
  132. style="color: rgb(229, 189, 28)"
  133. ng-show="target.errors.tags">
  134. <i class="fa fa-warning"></i>
  135. </a>
  136. </li>
  137. </ul>
  138. <div class="clearfix"></div>
  139. </div>
  140. <div class="tight-form">
  141. <ul class="tight-form-list" role="menu">
  142. <li class="tight-form-item tight-form-align" style="width: 86px">
  143. <editor-checkbox text="Rate" model="target.shouldComputeRate" change="targetBlur()"></editor-checkbox>
  144. </li>
  145. <li class="tight-form-item" ng-hide="!target.shouldComputeRate">
  146. <editor-checkbox text="Counter" model="target.isCounter" change="targetBlur()"></editor-checkbox>
  147. </li>
  148. <li class="tight-form-item" ng-hide="!target.isCounter">
  149. Counter Max:
  150. </li>
  151. <li ng-hide="!target.isCounter">
  152. <input type="text" class="tight-form-input input-small" ng-disabled="!target.shouldComputeRate"
  153. ng-model="target.counterMax" spellcheck='false'
  154. placeholder="max value" ng-model-onblur
  155. ng-blur="targetBlur()"></input>
  156. </li>
  157. <li class="tight-form-item" ng-hide="!target.isCounter">
  158. Reset Value:
  159. </li>
  160. <li ng-hide="!target.isCounter">
  161. <input type="text" class="tight-form-input input-small" ng-disabled="!target.shouldComputeRate"
  162. ng-model="target.counterResetValue" spellcheck='false'
  163. placeholder="reset value" ng-model-onblur
  164. ng-blur="targetBlur()"></input>
  165. </li>
  166. </ul>
  167. <div class="clearfix"></div>
  168. </div>