You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by at...@apache.org on 2018/05/18 10:26:54 UTC
[ambari] 01/02: AMBARI-23861 Service status is difficult to
understand in the left nav of the new UI
This is an automated email from the ASF dual-hosted git repository.
atkach pushed a commit to branch trunk
in repository https://gitbox.apache.org/repos/asf/ambari.git
commit 3f95121d5cca024843ed7e40e97ed12c65d7aae2
Author: Andrii Tkach <at...@apache.org>
AuthorDate: Wed May 16 16:26:30 2018 +0300
AMBARI-23861 Service status is difficult to understand in the left nav of the new UI
---
ambari-web/app/styles/alerts.less | 45 +++++++++++++---------
ambari-web/app/styles/application.less | 9 +++--
.../app/templates/main/service/menu_item.hbs | 13 +++++--
ambari-web/app/views/main/menu.js | 12 +++++-
4 files changed, 51 insertions(+), 28 deletions(-)
diff --git a/ambari-web/app/styles/alerts.less b/ambari-web/app/styles/alerts.less
index c1b84b5..c3cc588 100644
--- a/ambari-web/app/styles/alerts.less
+++ b/ambari-web/app/styles/alerts.less
@@ -48,11 +48,11 @@
margin-left: -15px;
margin-right: 3px;
}
- .service-alerts-critical {
+ .stopped {
color: @health-status-red;
}
- .service-alerts-warning {
- color: @health-status-orange;
+ .started {
+ color: @health-status-green;
}
}
@@ -364,17 +364,21 @@
}
+.alert-mixin {
+ border-radius: 50%;
+ color: #ffffff;
+ text-align: center;
+ display: inline-block;
+ position: relative;
+}
+
.service-block .summary-box-header {
- .alerts-crit-count, .alerts-warn-count, .no-alerts-label, .alerts-none-count {
+ .alerts-crit-count, .alerts-warn-count, .alerts-none-count {
+ .alert-mixin;
padding: 3px 5px;
font-size: 10px;
- border-radius: 50%;
min-width: 16px;
height: 16px;
- color: #ffffff;
- text-align: center;
- display: inline-block;
- position: relative;
top: -3px;
}
.glyphicon {
@@ -386,22 +390,28 @@
}
}
+.alerts-block {
+ .alerts-crit-count, .alerts-warn-count, .alerts-none-count {
+ .alert-mixin;
+ padding: 3px 5px;
+ font-size: 10px;
+ min-width: 16px;
+ height: 16px;
+ }
+}
+
.summary-value {
- .alerts-crit-count, .alerts-warn-count, .no-alerts-label {
+ .alerts-crit-count, .alerts-warn-count, alerts-none-count {
+ .alert-mixin;
padding: 3px 0;
font-size: 9px;
- border-radius: 50%;
width: 15px;
height: 15px;
- color: #ffffff;
- text-align: center;
- display: inline-block;
- position: relative;
top: -3px;
}
}
-.alerts-crit-count, .alerts-warn-count, .no-alerts-label {
+.alerts-crit-count, .alerts-warn-count, .alerts-none-count {
cursor: pointer;
}
@@ -414,9 +424,6 @@
.label.alerts-none-count {
background: @top-nav-ops-count-bg-color;
}
-.label.no-alerts-label {
- background: @health-status-green;
-}
#summary-alerts-popup {
.alert-list-wrap {
diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less
index c54f5e1..fc1c51e 100644
--- a/ambari-web/app/styles/application.less
+++ b/ambari-web/app/styles/application.less
@@ -1179,17 +1179,20 @@ a.services-menu-blocks{
word-break:break-word;
}
- .glyphicon.glyphicon-refresh, .icon-medkit {
+ .glyphicon.glyphicon-refresh, .icon-medkit, .label {
margin-left: 4px;
margin-right: 4px;
- top: 0px;
+ }
+
+ .glyphicon.glyphicon-refresh {
+ top: 1px;
}
.icon-medkit {
color: @maintenance-grey;
}
- .menu-item-name.INSTALLED:not(.client-only-service) {
+ .menu-item-name.master-down:not(.client-only-service) {
color: @health-status-red;
}
.menu-item-name.UNKNOWN {
diff --git a/ambari-web/app/templates/main/service/menu_item.hbs b/ambari-web/app/templates/main/service/menu_item.hbs
index 34242a9..ee75581 100644
--- a/ambari-web/app/templates/main/service/menu_item.hbs
+++ b/ambari-web/app/templates/main/service/menu_item.hbs
@@ -17,16 +17,21 @@
}}
<a class="services-menu-blocks" {{bindAttr href="view.link" data-href="view.dataHref"}}>
+ <span class="pull-right alerts-block">
+ <span {{bindAttr class=":label view.noAlerts:hidden view.hasCriticalAlerts:alerts-crit-count:alerts-warn-count"}}>
+ {{view.alertsCountDisplay}}
+ </span>
+ </span>
<span class="pull-right">
<i rel="tooltip" {{action goToConfigs target="view"}} {{bindAttr class=":glyphicon :glyphicon-refresh :restart-required-service view.content.isRestartRequired::hidden" data-original-title="view.restartRequiredMessage"}}></i>
</span>
<span class="pull-right">
<i rel="tooltip" {{bindAttr class=":icon-medkit :passive-state-service view.content.isInPassive::hidden" }} {{translateAttr data-original-title="services.service.summary.inMaintenanceMode.tooltip"}}></i>
</span>
- {{#if view.content.alertsCount}}
- <i {{bindAttr class=":icon-circle :status-icon view.hasCriticalAlerts:service-alerts-critical:service-alerts-warning"}}></i>
- {{/if}}
- <span {{bindAttr class="view.isClientOnlyService:client-only-service :menu-item-name view.content.workStatus" data-original-title="view.content.toolTipContent"}} rel="serviceHealthTooltip">
+ {{#unless view.isClientOnlyService}}
+ <i {{bindAttr class="view.content.isStarted:started:stopped :icon-circle :status-icon"}}></i>
+ {{/unless}}
+ <span {{bindAttr class="view.isClientOnlyService:client-only-service :menu-item-name view.content.workStatus view.isMasterDown:master-down" data-original-title="view.content.toolTipContent"}} rel="serviceHealthTooltip">
{{unbound view.content.displayName}}
</span>
</a>
diff --git a/ambari-web/app/views/main/menu.js b/ambari-web/app/views/main/menu.js
index d243a41..dae885f 100644
--- a/ambari-web/app/views/main/menu.js
+++ b/ambari-web/app/views/main/menu.js
@@ -212,12 +212,20 @@ App.SideNavServiceMenuView = Em.CollectionView.extend({
shouldBeRestarted: Em.computed.someBy('content.hostComponents', 'staleConfigs', true),
- alertsCount: function () {
- return this.get('content.alertsCount') > 99 ? "99+" : this.get('content.alertsCount') ;
+ alertsCountDisplay: function () {
+ return this.get('content.alertsCount') > 99 ? "99+" : this.get('content.alertsCount');
}.property('content.alertsCount'),
+ noAlerts: Em.computed.equal('content.alertsCount', 0),
+
hasCriticalAlerts: Em.computed.alias('content.hasCriticalAlerts'),
+ isMasterDown: function() {
+ return this.get('content.hostComponents').filterProperty('isMaster').some((component) => {
+ return !component.get('isRunning');
+ });
+ }.property('content.hostComponents.@each.workStatus'),
+
isClientOnlyService : function(){
return App.get('services.clientOnly').contains(this.get('content.serviceName'));
}.property('content.serviceName'),
--
To stop receiving notification emails like this one, please contact
atkach@apache.org.