Skip to content
This repository has been archived by the owner on Nov 9, 2017. It is now read-only.

Commit

Permalink
Merge pull request #547 from lucasponce/AlertsCenterWork
Browse files Browse the repository at this point in the history
Add basic pagination into AlertsCenter
  • Loading branch information
mtho11 committed Oct 9, 2015
2 parents 3d776e0 + f8237c9 commit 82cb731
Show file tree
Hide file tree
Showing 5 changed files with 96 additions and 81 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<div class="row hk-top-row">
<div class="col-xs-6">
<a ng-show="isAppServerPage()" href="/hawkular-ui/app/app-list" class="back">« All Application Servers</a>
<a ng-hide="isAppServerPage()" href="/hawkular-ui/url/url-list" class="back">« All URLs</a>
<a ng-hide="isUrlPage()" href="/hawkular-ui/url/url-list" class="back">« All URLs</a>
<a ng-show="isAlertsCenterPage()" href="/hawkular-ui/alerts-center" class="back">« All Alerts</a>
</div>
<div class="col-xs-6">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,10 @@ module Subtab {
return $location.path().indexOf('/hawkular/ui/alerts-center') !== 0;
};

$scope.isUrlPage = () => {
return $location.path().indexOf('/hawkular-ui/url/') !== 0;
};

$scope.isAppServerPage = () => {
return $location.path().indexOf('/hawkular-ui/app/') === 0;
};
Expand Down
132 changes: 73 additions & 59 deletions console/src/main/scripts/plugins/metrics/html/alerts-center-list.html
Original file line number Diff line number Diff line change
@@ -1,71 +1,85 @@
<div class="hk-alert-center">
<h1 class="text-center">Alert Center</h1>
<div class="hk-screen-content">

<!-- No Alerts -->
<div ng-show="ac.alertsList.length === 0">
<div class="hk-info-top clearfix">
<h3>Alerts ({{ac.alertsList.length}})</h3>
</div>
<div class="blank-slate-pf">
<div class="blank-slate-pf-icon">
<i class="fa fa-flag"></i>
<hawkular-subtab ng-controller="Subtab.SubtabController">
</hawkular-subtab>

<div class="hk-alert-center">
<h1 class="text-center">Alert Center</h1>

<!-- No Alerts -->
<div ng-show="ac.alertsList.length === 0">
<div class="hk-info-top clearfix">
<h3>Alerts ({{ac.alertsList.length}})</h3>
</div>
<div class="blank-slate-pf">
<div class="blank-slate-pf-icon">
<i class="fa fa-flag"></i>
</div>
<h1>No Alerts.</h1>
</div>
<h1>No Alerts.</h1>
</div>
</div>

<!-- have alerts -->
<div ng-show="ac.alertsList.length > 0">
<!-- have alerts -->
<div ng-show="ac.alertsList.length > 0">

<div class="hk-info-top clearfix">
<h3 class="pull-left">Alerts ({{ac.alertsList.length}})</h3>
<div class="hk-info-top clearfix">
<h3 class="pull-left">Alerts ({{ac.headerLinks.total}})</h3>
<span class="hk-update pull-right" data-toggle="tooltip" data-placement="top" title="Last update">
<i class="fa fa-clock-o" ng-click="ac.getAlerts()"></i>{{ac.lastUpdateDate | date:'HH:mm'}}</span>
</div>
<div class="hk-table-container">
<div class="hk-actions-table">
<button class="btn btn-default" type="button" ng-click="ac.ackSelected()"
ng-disabled="!ac.hasOpenSelectedItems || ac.isWorking">Acknowledge
</button>
<button class="btn btn-primary" type="button" ng-click="ac.resolveSelected()"
ng-disabled="ac.selectCount < 1 || ac.isWorking || ac.hasResolvedItems()">Resolve
</button>
</div>
<table class="datatable table table-bordered hk-table-alerts hk-table-detailed hk-table-select">
<thead>
<tr>
<th ng-click="ac.selectAll()"><input type="checkbox"/></th>
<th>State</th>
<th>Severity</th>
<th>Description</th>
<th>Created</th>
<th>Resource Path</th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="alert in ac.alertsList" ng-class="{'hk-selected': ac.selected}"
ng-click="ac.selectItem(alert)">
<td><input type="checkbox" ng-checked="alert.selected"/></td>
<td ng-class="{'hk-bold': alert.status === 'OPEN'}">{{alert.status|firstUpper}}</td>
<td>{{alert.severity|firstUpper}}</td>
<td>{{alert.trigger.description| characters: 35}}</td>
<td>{{alert.ctime | date:'d MMM yyyy, HH:mm'}}</td>
<td>{{alert.context.resourcePath | truncate: 30}}</td>
<td><a class="btn btn-link"><i class="fa fa-chevron-circle-right fa-lg"
tooltip="View Details" tooltip-trigger tooltip-placement="top"
ng-click="ac.showDetailPage(alert.alertId)">
</i></a>
</td>
</tr>
</tbody>
</table>
<div class="dataTables_footer">
<hk-data-pagination resource-list="ac.alertsList" current-page="ac.alertsCurPage"
page-setter="ac.setPage(pageNumber)"
per-page="ac.alertsPerPage" headers="ac.headerLinks"></hk-data-pagination>

<div class="hk-table-container">
<div class="hk-actions-table">
<button class="btn btn-default" type="button" ng-click="ac.ackSelected()"
ng-disabled="!ac.hasOpenSelectedItems || ac.isWorking">Acknowledge
</button>
<button class="btn btn-primary" type="button" ng-click="ac.resolveSelected()"
ng-disabled="ac.selectCount < 1 || ac.isWorking || ac.hasResolvedItems()">Resolve
</button>
</div>
<div class="dataTables_header">
<div id="DataTables_Table_0_filter" class="dataTables_filter">
<label><input type="search" ng-model="ac.search" aria-controls="DataTables_Table_0"></label>
</div>
<div class="dataTables_info" id="DataTables_Table_0_info" role="status" aria-live="polite">Showing <b>1</b> to <b>{{(ac.alertsList | filter:ac.search).length}}</b> of <b>{{ac.alertsList.length}}</b> Items</div>
</div>
<table class="datatable table table-bordered hk-table-alerts hk-table-detailed hk-table-select">
<thead>
<tr>
<th ng-click="ac.selectAll()"><input type="checkbox"/></th>
<th>State</th>
<th>Severity</th>
<th>Description</th>
<th>Created</th>
<th>Resource Path</th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="alert in ac.alertsList | filter:ac.search" ng-class="{'hk-selected': ac.selected}"
ng-click="ac.selectItem(alert)">
<td><input type="checkbox" ng-checked="alert.selected"/></td>
<td ng-class="{'hk-bold': alert.status === 'OPEN'}">{{alert.status|firstUpper}}</td>
<td>{{alert.severity|firstUpper}}</td>
<td>{{alert.trigger.description| characters: 35}}</td>
<td>{{alert.ctime | date:'d MMM yyyy, HH:mm'}}</td>
<td>{{alert.context.resourcePath | truncate: 30}}</td>
<td><a class="btn btn-link"><i class="fa fa-chevron-circle-right fa-lg"
tooltip="View Details" tooltip-trigger tooltip-placement="top"
ng-click="ac.showDetailPage(alert.alertId)">
</i></a>
</td>
</tr>
</tbody>
</table>
<div class="dataTables_footer">
<hk-data-pagination resource-list="ac.alertsList" current-page="ac.alertsCurPage"
page-setter="ac.setPage(pageNumber)"
per-page="ac.alertsPerPage" headers="ac.headerLinks"></hk-data-pagination>
</div>
</div>
</div>

</div>
</div>

</div>
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,9 @@ module HawkularMetrics {
}

public cancel():void {
this.$location.url(`/hawkular-ui/alerts-center`);
let timeOffset = this.alertsTimeOffset;
let endTime = this.alertsTimeEnd;
this.$location.url(`/hawkular-ui/alerts-center/${timeOffset}/${endTime}`);
}

public save(): void {
Expand Down
35 changes: 15 additions & 20 deletions console/src/main/scripts/plugins/metrics/ts/alertsCenterList.ts
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ module HawkularMetrics {

private autoRefresh(intervalInSeconds:number):void {
let autoRefreshPromise = this.$interval(() => {
this.$log.debug('autoRefresh .... ' + new Date());
this.getAlerts();
}, intervalInSeconds * 1000);

Expand All @@ -84,8 +85,20 @@ module HawkularMetrics {
}

public getAlerts():void {
this.HawkularAlertsManager.queryAlerts().then((queriedAlerts) => {
this.alertsList = queriedAlerts.alertList;

this.alertsTimeEnd = this.$routeParams.endTime ? this.$routeParams.endTime : Date.now();
this.alertsTimeStart = this.alertsTimeEnd - this.alertsTimeOffset;

this.HawkularAlertsManager.queryAlerts({startTime: this.alertsTimeStart,
endTime: this.alertsTimeEnd,
currentPage: this.alertsCurPage,
perPage: this.alertsPerPage
})
.then((queriedAlerts) => {
this.headerLinks = this.HkHeaderParser.parse(queriedAlerts.headers);
this.alertsList = queriedAlerts.alertList;
this.lastUpdateDate = new Date();
console.dir(this.headerLinks);
}, (error) => {
this.$log.warn(error);
}).catch((error) => {
Expand All @@ -95,24 +108,6 @@ module HawkularMetrics {
});
}

//public getAlerts():void {
// this.$log.info('GetAlerts');
// this.alertsTimeEnd = this.$routeParams.endTime ? this.$routeParams.endTime : Date.now();
// this.alertsTimeStart = this.alertsTimeEnd - this.alertsTimeOffset;
//
// this.HawkularAlertsManager.queryAllAlertsPaginated(this.alertsTimeStart, this.alertsTimeEnd, this.alertsCurPage,
// this.alertsPerPage).then((queriedAlerts) => {
// console.dir(queriedAlerts);
// this.headerLinks = this.HkHeaderParser.parse(queriedAlerts.headers);
// this.alertsList = queriedAlerts.alertList;
// this.lastUpdateDate = new Date();
// //this.alertsList.$resolved = true;
// }, (error) => {
// return this.ErrorsManager.errorHandler(error, 'Error fetching alerts.');
// });
//}


public showDetailPage(alertId:AlertId):void {
let timeOffset = this.alertsTimeOffset;
let endTime = this.alertsTimeEnd;
Expand Down

0 comments on commit 82cb731

Please sign in to comment.