alert_list.html 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <navbar icon="icon-gf icon-gf-alert" title="Alerting" title-url="alerting">
  2. </navbar>
  3. <div class="page-container" >
  4. <div class="page-header">
  5. <h1>Alert List</h1>
  6. <a class="btn btn-inverse" ng-click="ctrl.openHowTo()">
  7. <i class="fa fa-info-circle"></i>
  8. How to add an alert
  9. </a>
  10. </div>
  11. <div class="gf-form-group">
  12. <div class="gf-form-inline">
  13. <div class="gf-form">
  14. <label class="gf-form-label">Filter by state</label>
  15. <div class="gf-form-select-wrapper width-13">
  16. <select class="gf-form-input" ng-model="ctrl.filters.state" ng-options="f.value as f.text for f in ctrl.stateFilters" ng-change="ctrl.filtersChanged()">
  17. </select>
  18. </div>
  19. </div>
  20. </div>
  21. </div>
  22. <section class="card-section card-list-layout-list">
  23. <ol class="card-list" >
  24. <li class="card-item-wrapper" ng-repeat="alert in ctrl.alerts">
  25. <div class="card-item card-item--alert">
  26. <div class="card-item-header">
  27. <div class="card-item-type">
  28. <a class="card-item-cog" href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&tab=alert" bs-tooltip="'Edit alert rule'">
  29. <i class="icon-gf icon-gf-settings"></i>
  30. </a>
  31. </div>
  32. </div>
  33. <div class="card-item-body">
  34. <div class="card-item-details">
  35. <div class="card-item-name">
  36. <a href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&tab=alert">
  37. {{alert.name}}
  38. </a>
  39. </div>
  40. <div class="card-item-sub-name">
  41. <span class="alert-list-item-state {{alert.stateModel.stateClass}}">
  42. <i class="{{alert.stateModel.iconClass}}"></i>
  43. {{alert.stateModel.text}}
  44. </span> for {{alert.newStateDateAgo}}
  45. </div>
  46. <div class="small muted" ng-show="alert.executionError">
  47. {{alert.executionError}}
  48. </div>
  49. </div>
  50. </div>
  51. </div>
  52. </li>
  53. </ol>
  54. </section>
  55. </div>