Excelian/Angular-Material-ECMA6-Dashboard

View on GitHub
client/app/components/dashboard/alerts/alerts.html

Summary

Maintainability
Test Coverage
<md-card>
  <md-card-content>
    <md-card>
      <md-toolbar class="md-warn">
        <div class="md-toolbar-tools">
          <h2 class="md-flex">System Alerts</h2>
        </div>
      </md-toolbar>
      <md-content md-theme="docs-dark" layout-padding layout="row" layout-sm="column">
        <md-input-container >
          <label>Filter</label>
          <input ng-model="alertsCtrl.displayControl.filter">
        </md-input-container>
        <md-switch class="md-warn" ng-model="alertsCtrl.displayControl.displayFrozen" aria-label="Freeze Switch">
          <label class="light-text">
            {{alertsCtrl.displayControl.displayFrozen?'Unfreeze Display':'Freeze Display'}}
          </label>
        </md-switch>
      </md-content>
      <md-content id="events-viewer" md-theme="docs-dark"  layout-padding  layout="column">
        <md-list style="max-height: 300px">
          <md-list-item layout="row" layout-wrap layout-align="start center"
                ng-repeat="alert in alertsCtrl.alerts | filter:{description: alertsCtrl.displayControl.filter}">
            <span ng-class-odd="'light-text-odd'" ng-class-even="'light-text-even'">
            <md-icon md-svg-icon="assets/img/icons/ic_error_24px.svg" style="color:red"
                     ng-show="alert.type==='error'"></md-icon>
            <md-icon md-svg-icon="assets/img/icons/ic_warning_24px.svg" style="color:darkorange"
                     ng-show="alert.type==='warning'"></md-icon>
            <md-icon md-svg-icon="assets/img/icons/ic_info_24px.svg" style="color:#003cb3;"
                     ng-show="alert.type==='info'"></md-icon>
            <strong>{{alert.ts}}</strong> {{alert.description}}
              </span>
          </md-list-item>
        </md-list>
      </md-content>
  </md-card-content>
</md-card>