tab_alerting.html 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <div class="editor-row">
  2. <div class="gf-form-group section" >
  3. <h5 class="section-heading">Query</h5>
  4. <div class="gf-form" style="margin-bottom: 2rem">
  5. <span class="gf-form-label width-9">Query to watch</span>
  6. <div class="gf-form-select-wrapper max-width-7">
  7. <select class="gf-form-input"
  8. ng-model="ctrl.panel.alerting.queryRef"
  9. ng-options="target.refId as target.refId for target in ctrl.panel.targets"></select>
  10. </div>
  11. </div>
  12. <h5 class="section-heading">Thresholds</h5>
  13. <div class="gf-form">
  14. <span class="gf-form-label width-9">
  15. <i class="icon-gf icon-gf-warn alert-state-warn"></i>
  16. Warn level
  17. </span>
  18. <input class="gf-form-input max-width-7" type="text" ng-model="ctrl.panel.alerting.warnLevel" ng-change="alertTab.thresholdsUpdated()"></input>
  19. </div>
  20. <div class="gf-form">
  21. <span class="gf-form-label width-9">
  22. <i class="icon-gf icon-gf-critical alert-state-critical"></i>
  23. Critical level
  24. </span>
  25. <input class="gf-form-input max-width-7" type="text" ng-model="ctrl.panel.alerting.critLevel" ng-change="alertTab.thresholdsUpdated()"></input>
  26. </div>
  27. </div>
  28. <div class="gf-form-group section">
  29. <h5 class="section-heading">Aggregation settings</h5>
  30. <div class="gf-form">
  31. <span class="gf-form-label width-10">Aggregation method</span>
  32. <div class="gf-form-select-wrapper max-width-10">
  33. <select class="gf-form-input"
  34. ng-model="ctrl.panel.alerting.aggregator"
  35. ng-options="oper as oper for oper in ['avg', 'sum', 'min', 'max', 'median']"></select>
  36. </div>
  37. </div>
  38. <div class="gf-form">
  39. <span class="gf-form-label width-10">Query range</span>
  40. <input class="gf-form-input max-width-10" type="text"
  41. ng-model="ctrl.panel.alerting.queryRange" placeholder="10m"></input>
  42. </div>
  43. <div class="gf-form">
  44. <span class="gf-form-label width-10">Interval</span>
  45. <input class="gf-form-input max-width-10" type="text"
  46. ng-model="ctrl.panel.alerting.interval" placeholder="10s"></input>
  47. </div>
  48. </div>
  49. <div class="gf-form-group section">
  50. <h5 class="section-heading">Alert info</h5>
  51. <div class="gf-form">
  52. <span class="gf-form-label width-10">Alert name</span>
  53. <input type="text" class="gf-form-input width-18" ng-model="ctrl.panel.alerting.title">
  54. </div>
  55. <div class="gf-form-inline">
  56. <div class="gf-form">
  57. <span class="gf-form-label width-10" style="margin-top: -73px;">Alert description</span>
  58. </div>
  59. <div class="gf-form">
  60. <textarea rows="5" ng-model="ctrl.panel.alerting.description" class="gf-form-input width-18"></textarea>
  61. </div>
  62. </div>
  63. </div>
  64. </div>