ui: Return empty state for no health check in Topology Cards (#9403)

This commit is contained in:
Kenia 2020-12-15 14:32:03 -05:00 committed by GitHub
parent eda404de81
commit a919b60f5c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 18 additions and 5 deletions

View File

@ -25,6 +25,9 @@
{{/if}} {{/if}}
{{#if (eq @item.Datacenter @dc)}} {{#if (eq @item.Datacenter @dc)}}
{{#let (service/health-percentage @item) as |percentage|}} {{#let (service/health-percentage @item) as |percentage|}}
{{#if (eq percentage '')}}
<span class="empty">No health checks</span>
{{else}}
{{#if (not-eq percentage.passing 0)}} {{#if (not-eq percentage.passing 0)}}
<span class="passing">{{percentage.passing}}%</span> <span class="passing">{{percentage.passing}}%</span>
{{/if}} {{/if}}
@ -34,6 +37,7 @@
{{#if (not-eq percentage.critical 0)}} {{#if (not-eq percentage.critical 0)}}
<span class="critical">{{percentage.critical}}%</span> <span class="critical">{{percentage.critical}}%</span>
{{/if}} {{/if}}
{{/if}}
{{/let}} {{/let}}
{{else}} {{else}}
<dl class="health"> <dl class="health">

View File

@ -57,6 +57,10 @@
@extend %with-cancel-square-fill-color-mask, %as-pseudo; @extend %with-cancel-square-fill-color-mask, %as-pseudo;
background-color: $red-500; background-color: $red-500;
} }
.empty::before {
@extend %with-minus-square-fill-mask, %as-pseudo;
color: $gray-500;
}
} }
div:nth-child(3) { div:nth-child(3) {
border-top: 1px solid $gray-200; border-top: 1px solid $gray-200;

View File

@ -2,9 +2,14 @@ import { helper } from '@ember/component/helper';
export default helper(function serviceHealthPercentage([params] /*, hash*/) { export default helper(function serviceHealthPercentage([params] /*, hash*/) {
const total = params.ChecksCritical + params.ChecksPassing + params.ChecksWarning; const total = params.ChecksCritical + params.ChecksPassing + params.ChecksWarning;
return {
passing: Math.round((params.ChecksPassing / total) * 100), if (total === 0) {
warning: Math.round((params.ChecksWarning / total) * 100), return '';
critical: Math.round((params.ChecksCritical / total) * 100), } else {
}; return {
passing: Math.round((params.ChecksPassing / total) * 100),
warning: Math.round((params.ChecksWarning / total) * 100),
critical: Math.round((params.ChecksCritical / total) * 100),
};
}
}); });