tab_alerting.html 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. <div class="gf-form-group" >
  2. <h5 class="section-heading">Alert Rule</h5>
  3. <div class="gf-form-inline">
  4. <div class="gf-form">
  5. <query-part-editor
  6. class="gf-form-label query-part"
  7. part="ctrl.query"
  8. part-updated="ctrl.queryUpdated()">
  9. </query-part-editor>
  10. </div>
  11. <div class="gf-form">
  12. <span class="gf-form-label">Transform using</span>
  13. <div class="gf-form-select-wrapper">
  14. <select class="gf-form-input"
  15. ng-model="ctrl.rule.transform.type"
  16. ng-options="f.type as f.text for f in ctrl.transforms"
  17. ng-change="ctrl.transformChanged()"
  18. >
  19. </select>
  20. </div>
  21. </div>
  22. <div class="gf-form" ng-if="ctrl.transformDef.type === 'aggregation'">
  23. <span class="gf-form-label">Method</span>
  24. <div class="gf-form-select-wrapper">
  25. <select class="gf-form-input"
  26. ng-model="ctrl.rule.transform.method"
  27. ng-options="f for f in ctrl.aggregators">
  28. </select>
  29. </div>
  30. </div>
  31. <div class="gf-form" ng-if="ctrl.transformDef.type === 'forecast'">
  32. <span class="gf-form-label">Timespan</span>
  33. <input class="gf-form-input max-width-7" type="text" ng-model="ctrl.rule.transform.timespan" ng-change="ctrl.ruleUpdated()"></input>
  34. </div>
  35. </div>
  36. </div>
  37. <div class="gf-form-group" >
  38. <h5 class="section-heading">Levels</h5>
  39. <div class="gf-form-inline">
  40. <div class="gf-form">
  41. <span class="gf-form-label">
  42. <i class="icon-gf icon-gf-warn alert-icon-warn"></i>
  43. Warn if value
  44. </span>
  45. <span class="gf-form-label">
  46. &gt;
  47. </span>
  48. <input class="gf-form-input max-width-7" type="number" ng-model="ctrl.rule.warnLevel" ng-change="alertTab.thresholdsUpdated()"></input>
  49. </div>
  50. <div class="gf-form">
  51. <span class="gf-form-label">
  52. <i class="icon-gf icon-gf-warn alert-icon-critical"></i>
  53. Critcal if value
  54. </span>
  55. <span class="gf-form-label">
  56. &gt;
  57. </span>
  58. <input class="gf-form-input max-width-7" type="number" ng-model="ctrl.rule.critLevel" ng-change="alertTab.thresholdsUpdated()"></input>
  59. </div>
  60. </div>
  61. </div>
  62. <!-- <div class="gf&#45;form"> -->
  63. <!-- <span class="gf&#45;form&#45;label width&#45;12">Aggregation method</span> -->
  64. <!-- <div class="gf&#45;form&#45;select&#45;wrapper max&#45;width&#45;10"> -->
  65. <!-- <select class="gf&#45;form&#45;input" -->
  66. <!-- ng&#45;model="ctrl.panel.alerting.aggregator" -->
  67. <!-- ng&#45;options="oper as oper for oper in alertTab.aggregators"></select> -->
  68. <!-- </div> -->
  69. <!-- </div> -->
  70. <!-- -->
  71. <!-- <div class="gf&#45;form"> -->
  72. <!-- <span class="gf&#45;form&#45;label width&#45;12">Query range (seconds)</span> -->
  73. <!-- <input class="gf&#45;form&#45;input max&#45;width&#45;10" type="number" -->
  74. <!-- ng&#45;model="ctrl.panel.alerting.queryRange" placeholder="3600"></input> -->
  75. <!-- </div> -->
  76. <!-- -->
  77. <!-- <div class="gf&#45;form"> -->
  78. <!-- <span class="gf&#45;form&#45;label width&#45;12">Frequency (seconds)</span> -->
  79. <!-- <input class="gf&#45;form&#45;input max&#45;width&#45;10" type="number" -->
  80. <!-- ng&#45;model="ctrl.panel.alerting.frequency" placeholder="60"></input> -->
  81. <!-- </div> -->
  82. <!-- </div> -->
  83. <div>
  84. <div class="gf-form-group section">
  85. <h5 class="section-heading">Alert info</h5>
  86. <div class="gf-form">
  87. <span class="gf-form-label width-10">Alert name</span>
  88. <input type="text" class="gf-form-input width-22" ng-model="ctrl.panel.alerting.name">
  89. </div>
  90. <div class="gf-form-inline">
  91. <div class="gf-form">
  92. <span class="gf-form-label width-10" style="margin-top: -73px;">Alert description</span>
  93. </div>
  94. <div class="gf-form">
  95. <textarea rows="5" ng-model="ctrl.panel.alerting.description" class="gf-form-input width-22"></textarea>
  96. </div>
  97. </div>
  98. </div>
  99. </div>
  100. <div class="editor-row">
  101. <div class="gf-form-button-row">
  102. <button class="btn btn-warning" ng-click="alertTab.markAsDeleted()">Delete Alert</button>
  103. </div>
  104. </div>