module.html 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <div class="panel-alert-list" style="{{ctrl.contentHeight}}">
  2. <section class="card-section card-list-layout-list" ng-if="ctrl.panel.show === 'current'">
  3. <ol class="card-list">
  4. <li class="card-item-wrapper" ng-show="!ctrl.currentAlerts.length">
  5. <div class="alert-list card-item card-item--alert">
  6. <div class="alert-list-body">
  7. <div class="alert-list-main">
  8. <p class="alert-list-title">
  9. No alerts in selected interval
  10. </p>
  11. </div>
  12. </div>
  13. </div>
  14. </li>
  15. <li class="card-item-wrapper" ng-repeat="alert in ctrl.currentAlerts">
  16. <div class="alert-list card-item card-item--alert">
  17. <div class="alert-list-body">
  18. <div class="alert-list-icon alert-list-item-state {{alert.stateModel.stateClass}}">
  19. <i class="{{alert.stateModel.iconClass}}"></i>
  20. </div>
  21. <div class="alert-list-main">
  22. <p class="alert-list-title">
  23. <a href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&tab=alert">
  24. {{alert.name}}
  25. </a>
  26. </p>
  27. <p class="alert-list-text">
  28. <span class="alert-list-state {{alert.stateModel.stateClass}}">{{alert.stateModel.text}}</span>
  29. for {{alert.newStateDateAgo}}
  30. </p>
  31. </div>
  32. </div>
  33. </div>
  34. </li>
  35. </ol>
  36. </section>
  37. <section class="card-section card-list-layout-list" ng-if="ctrl.panel.show === 'changes'">
  38. <ol class ="card-list">
  39. <li class="card-item-wrapper" ng-repeat="al in ctrl.alertHistory">
  40. <div class="alert-list card-item card-item--alert">
  41. <div class="alert-list-body">
  42. <div class="alert-list-icon alert-list-item-state {{al.stateModel.stateClass}}">
  43. <i class="{{al.stateModel.iconClass}}"></i>
  44. </div>
  45. <div class="alert-list-main">
  46. <p class="alert-list-title">{{al.alertName}}</p>
  47. <div class="alert-list-text">
  48. <span class="alert-list-state {{al.stateModel.stateClass}}">{{al.stateModel.text}}</span>
  49. <span class="alert-list-info alert-list-info-left">{{al.info}}</span>
  50. </div>
  51. </div>
  52. </div>
  53. <div class="alert-list-footer">
  54. <span class="alert-list-text">{{al.time}}</span>
  55. <span class="alert-list-text"><!--Img Link--></span>
  56. </div>
  57. </div>
  58. </li>
  59. </ol>
  60. </section>
  61. </div>