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-2: #1ec863;
 | 
			
		||||
  --green-3: #23ae89;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
:root {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -201,6 +201,7 @@
 | 
			
		|||
              >
 | 
			
		||||
              <td>{{ item.ApplicationType | kubernetesApplicationTypeText }}</td>
 | 
			
		||||
              <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.GLOBAL">Global</span>
 | 
			
		||||
                <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