Skip to content
This repository has been archived by the owner on Oct 20, 2021. It is now read-only.

Commit

Permalink
feat: allows to display HC status transitions
Browse files Browse the repository at this point in the history 
This closes gravitee-io/issues#1240
  • Loading branch information
@aelamrani
aelamrani committed May 25, 2018
1 parent d808746 commit f7bc3a6
Show file tree
Hide file tree
Showing 2 changed files with 44 additions and 44 deletions.
80 changes: 40 additions & 40 deletions src/management/api/proxy/backend/healthcheck/healthcheck-visualize.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -178,9 +178,9 @@ <h5>Last month</h5>
<md-card flex>
<div class="widget-card" flex>
<md-card-title>
<md-card-title-text>
<span class="md-title"><strong>Latest check</strong></span>
<span class="md-subhead">&nbsp;</span>
<md-card-title-text layout="row">
<span class="md-title" flex><strong>Latest check</strong></span>
<span class="md-title"><md-switch aria-label="Show only status transitions" ng-model="transitionMode">Show only status transitions</md-switch></span>
</md-card-title-text>
<md-card-title-media>
</md-card-title-media>
Expand All @@ -190,47 +190,47 @@ <h5>Last month</h5>
<md-table-container>
<table md-table class="gravitee-analytics-top-hits-table" multiple md-row-select="healthCheckCtrl.widget.chart.selectable" data-ng-model="healthCheckCtrl.selected">
<thead md-head>
<tr md-row>
<th md-column>Date</th>
<th md-column>Endpoint</th>
<th md-column>Gateway</th>
<th md-column>Health</th>
<th md-column>Target</th>
<th md-column>Status | Elapsed Time</th>
<th md-column></th>
</tr>
<tr md-row>
<th md-column>Date</th>
<th md-column>Endpoint</th>
<th md-column>Gateway</th>
<th md-column>Health</th>
<th md-column>Target</th>
<th md-column>Status | Elapsed Time</th>
<th md-column></th>
</tr>
</thead>
<tbody md-body>
<tr ng-if="healthCheckCtrl.logs.logs.length > 0" md-row
ng-repeat="log in healthCheckCtrl.logs.logs | limitTo: healthCheckCtrl.query.size"
md-auto-select md-select="log" md-select-id="key">
<td md-cell>{{log.timestamp | date:'MMM d, y h:mm:ss.sss a'}}</td>
<td md-cell>
<md-tooltip md-direction="bottom">{{healthCheckCtrl.getEndpointStatus(log.state)}}</md-tooltip>
<ng-md-icon ng-if="log.state === 0" icon="close" size="14px" style="fill: red"></ng-md-icon>
<ng-md-icon ng-if="log.state === 1" icon="trending_down" size="14px" style="fill: orange"></ng-md-icon>
<ng-md-icon ng-if="log.state === 2" icon="trending_up" size="14px" style="fill: orange"></ng-md-icon>
<ng-md-icon ng-if="log.state === 3" icon="check" size="14px" style="fill: green"></ng-md-icon>
{{log.endpoint}}
</td>
<td md-cell>{{healthCheckCtrl.getMetadata(log.gateway).hostname}}</td>
<td md-cell>
<ng-md-icon ng-if="log.success" icon="done" size="14px" style="fill: green"></ng-md-icon>
<ng-md-icon ng-if="!log.success" icon="close" size="14px" style="fill: red"></ng-md-icon>
</td>
<td md-cell>
<tr ng-if="transitionMode?healthCheckCtrl.transitionLogs.logs.length > 0:healthCheckCtrl.logs.logs.length > 0" md-row
ng-repeat="log in transitionMode?healthCheckCtrl.transitionLogs.logs:healthCheckCtrl.logs.logs | limitTo: healthCheckCtrl.query.size"
md-auto-select md-select="log" md-select-id="key">
<td md-cell>{{log.timestamp | date:'MMM d, y h:mm:ss.sss a'}}</td>
<td md-cell>
<md-tooltip md-direction="bottom">{{healthCheckCtrl.getEndpointStatus(log.state)}}</md-tooltip>
<ng-md-icon ng-if="log.state === 0" icon="close" size="14px" style="fill: red"></ng-md-icon>
<ng-md-icon ng-if="log.state === 1" icon="trending_down" size="14px" style="fill: orange"></ng-md-icon>
<ng-md-icon ng-if="log.state === 2" icon="trending_up" size="14px" style="fill: orange"></ng-md-icon>
<ng-md-icon ng-if="log.state === 3" icon="check" size="14px" style="fill: green"></ng-md-icon>
{{log.endpoint}}
</td>
<td md-cell>{{transitionMode?healthCheckCtrl.transitionLogs.metadata[log.gateway].hostname:healthCheckCtrl.logs.metadata[log.gateway].hostname}}</td>
<td md-cell>
<ng-md-icon ng-if="log.success" icon="done" size="14px" style="fill: green"></ng-md-icon>
<ng-md-icon ng-if="!log.success" icon="close" size="14px" style="fill: red"></ng-md-icon>
</td>
<td md-cell>
<span>
{{log.request.method | uppercase}} {{log.request.uri}}
</span>
</td>
<td md-cell>{{log.response.status}} | {{log.responseTime}} ms</td>
<td md-cell>
<ng-md-icon ng-if="!log.success" icon="remove_red_eye" size="16px" ui-sref="management.apis.detail.proxy.healthcheck.log({log: log.id})"></ng-md-icon>
</td>
</tr>
<tr ng-if="healthCheckCtrl.logs.total === 0">
<td md-cell colspan="6">No log</td>
</tr>
</td>
<td md-cell>{{log.response.status}} | {{log.responseTime}} ms</td>
<td md-cell>
<ng-md-icon ng-if="!log.success" icon="remove_red_eye" size="16px" ui-sref="management.apis.detail.proxy.healthcheck.log({log: log.id})"></ng-md-icon>
</td>
</tr>
<tr ng-if="transitionMode?healthCheckCtrl.transitionLogs.total === 0:healthCheckCtrl.logs.total === 0">
<td md-cell colspan="6">No log</td>
</tr>
</tbody>
</table>
</md-table-container>
Expand All @@ -239,7 +239,7 @@ <h5>Last month</h5>
md-limit="healthCheckCtrl.query.size"
md-limit-options="[10, 25, 50, 75, 100]"
md-page="healthCheckCtrl.query.page"
md-total="{{healthCheckCtrl.logs.total}}"
md-total="{{transitionMode?healthCheckCtrl.transitionLogs.total:healthCheckCtrl.logs.total}}"
md-on-paginate="healthCheckCtrl.onPaginate"
md-page-select>
</md-table-pagination>
Expand Down
8 changes: 4 additions & 4 deletions src/management/api/proxy/backend/healthcheck/healthcheck.controller.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ class ApiHealthCheckController {
private gateway: any;
private endpoint: any;
private logs: {total: string; logs: any[], metadata: any};
private transitionLogs: {total: string; logs: any[], metadata: any};
private query: LogsQuery;
private chartData: any;

Expand Down Expand Up @@ -74,6 +75,9 @@ class ApiHealthCheckController {
this.ApiService.apiHealthLogs(this.api.id, this.query).then((logs) => {
this.logs = logs.data;
});
this.ApiService.apiHealthLogs(this.api.id, _.assign({transition: true}, this.query)).then((logs) => {
this.transitionLogs = logs.data;
});

let from = averageFrom || moment().subtract(1, 'months');
let to = averageTo || moment();
Expand Down Expand Up @@ -162,10 +166,6 @@ class ApiHealthCheckController {
});
}

getMetadata(id) {
return this.logs.metadata[id];
}

getEndpointStatus(state) {
switch(state) {
case 3: return 'UP';
Expand Down

0 comments on commit f7bc3a6

Please sign in to comment.