mirror of https://github.com/portainer/portainer
feat(applications): show status indication [EE-1623] (#5614)
* feat(applications): show status indication * feat(k8s/applications): move colors to theme * fix helm application indicator for main header * refactor(k8s/apps): receive more general ok status Co-authored-by: waysonwei <degui.wei@gmail.com>pull/5790/head
parent
7b72130433
commit
50f63ae865
|
@ -88,6 +88,7 @@ html {
|
||||||
|
|
||||||
--green-1: #164;
|
--green-1: #164;
|
||||||
--green-2: #1ec863;
|
--green-2: #1ec863;
|
||||||
|
--green-3: #23ae89;
|
||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
|
|
|
@ -201,6 +201,7 @@
|
||||||
>
|
>
|
||||||
<td>{{ item.ApplicationType | kubernetesApplicationTypeText }}</td>
|
<td>{{ item.ApplicationType | kubernetesApplicationTypeText }}</td>
|
||||||
<td ng-if="item.ApplicationType !== $ctrl.KubernetesApplicationTypes.POD">
|
<td ng-if="item.ApplicationType !== $ctrl.KubernetesApplicationTypes.POD">
|
||||||
|
<status-indicator ok="(item.TotalPodsCount > 0 && item.TotalPodsCount === item.RunningPodsCount) || item.Status === 'Ready'"></status-indicator>
|
||||||
<span ng-if="item.DeploymentType === $ctrl.KubernetesApplicationDeploymentTypes.REPLICATED">Replicated</span>
|
<span ng-if="item.DeploymentType === $ctrl.KubernetesApplicationDeploymentTypes.REPLICATED">Replicated</span>
|
||||||
<span ng-if="item.DeploymentType === $ctrl.KubernetesApplicationDeploymentTypes.GLOBAL">Global</span>
|
<span ng-if="item.DeploymentType === $ctrl.KubernetesApplicationDeploymentTypes.GLOBAL">Global</span>
|
||||||
<span ng-if="item.RunningPodsCount >= 0 && item.TotalPodsCount >= 0">
|
<span ng-if="item.RunningPodsCount >= 0 && item.TotalPodsCount >= 0">
|
||||||
|
|
|
@ -0,0 +1,12 @@
|
||||||
|
import angular from 'angular';
|
||||||
|
|
||||||
|
import './status-indicator.css';
|
||||||
|
|
||||||
|
export const statusIndicator = {
|
||||||
|
templateUrl: './status-indicator.html',
|
||||||
|
bindings: {
|
||||||
|
ok: '<',
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
angular.module('portainer.app').component('statusIndicator', statusIndicator);
|
|
@ -0,0 +1,13 @@
|
||||||
|
.status-indicator {
|
||||||
|
padding: 0 !important;
|
||||||
|
margin-right: 1ch;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: var(--red-3);
|
||||||
|
height: 10px;
|
||||||
|
width: 10px;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ok {
|
||||||
|
background-color: var(--green-3);
|
||||||
|
}
|
|
@ -0,0 +1 @@
|
||||||
|
<i aria-hidden="true" ng-class="['status-indicator', { ok: $ctrl.ok }]"></i>
|
Loading…
Reference in New Issue