mirror of https://github.com/portainer/portainer
feat(swarm): display the IP address of each node when API Version >= … (#595)
parent
781dad3e17
commit
85a07237b1
|
@ -163,57 +163,65 @@
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>
|
<th>
|
||||||
<a ui-sref="swarm" ng-click="order('Description.Hostname')">
|
<a ui-sref="swarm" ng-click="order('Hostname')">
|
||||||
Name
|
Name
|
||||||
<span ng-show="sortType == 'Description.Hostname' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
<span ng-show="sortType == 'Hostname' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||||
<span ng-show="sortType == 'Description.Hostname' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
<span ng-show="sortType == 'Hostname' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||||
</a>
|
</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<a ui-sref="swarm" ng-click="order('Spec.Role')">
|
<a ui-sref="swarm" ng-click="order('Role')">
|
||||||
Role
|
Role
|
||||||
<span ng-show="sortType == 'Spec.Role' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
<span ng-show="sortType == 'Role' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||||
<span ng-show="sortType == 'Spec.Role' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
<span ng-show="sortType == 'Role' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||||
</a>
|
</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<a ui-sref="swarm" ng-click="order('Description.Resources.NanoCPUs')">
|
<a ui-sref="swarm" ng-click="order('CPUs')">
|
||||||
CPU
|
CPU
|
||||||
<span ng-show="sortType == 'Description.Resources.NanoCPUs' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
<span ng-show="sortType == 'CPUs' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||||
<span ng-show="sortType == 'Description.Resources.NanoCPUs' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
<span ng-show="sortType == 'CPUs' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||||
</a>
|
</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<a ui-sref="swarm" ng-click="order('Description.Resources.MemoryBytes')">
|
<a ui-sref="swarm" ng-click="order('Memory')">
|
||||||
Memory
|
Memory
|
||||||
<span ng-show="sortType == 'Description.Resources.MemoryBytes' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
<span ng-show="sortType == 'Memory' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||||
<span ng-show="sortType == 'Description.Resources.MemoryBytes' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
<span ng-show="sortType == 'Memory' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||||
</a>
|
</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<a ui-sref="swarm" ng-click="order('Description.Engine.EngineVersion')">
|
<a ui-sref="swarm" ng-click="order('EngineVersion')">
|
||||||
Engine
|
Engine
|
||||||
<span ng-show="sortType == 'Description.Engine.EngineVersion' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
<span ng-show="sortType == 'EngineVersion' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||||
<span ng-show="sortType == 'Description.Engine.EngineVersion' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
<span ng-show="sortType == 'EngineVersion' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||||
|
</a>
|
||||||
|
</th>
|
||||||
|
<th ng-if="applicationState.endpoint.apiVersion >= 1.25">
|
||||||
|
<a ui-sref="swarm" ng-click="order('Addr')">
|
||||||
|
IP Address
|
||||||
|
<span ng-show="sortType == 'Addr' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||||
|
<span ng-show="sortType == 'Addr' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||||
</a>
|
</a>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<a ui-sref="swarm" ng-click="order('node.Status.State')">
|
<a ui-sref="swarm" ng-click="order('Status')">
|
||||||
Status
|
Status
|
||||||
<span ng-show="sortType == 'node.Status.State' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
<span ng-show="sortType == 'Status' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
|
||||||
<span ng-show="sortType == 'node.Status.State' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
<span ng-show="sortType == 'Status' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
|
||||||
</a>
|
</a>
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr dir-paginate="node in (state.filteredNodes = (nodes | filter:state.filter | orderBy:sortType:sortReverse | itemsPerPage: state.pagination_count))">
|
<tr dir-paginate="node in (state.filteredNodes = (nodes | filter:state.filter | orderBy:sortType:sortReverse | itemsPerPage: state.pagination_count))">
|
||||||
<td><a ui-sref="node({id: node.ID})">{{ node.Description.Hostname }}</a></td>
|
<td><a ui-sref="node({id: node.ID})">{{ node.Hostname }}</a></td>
|
||||||
<td>{{ node.Spec.Role }}</td>
|
<td>{{ node.Role }}</td>
|
||||||
<td>{{ node.Description.Resources.NanoCPUs / 1000000000 }}</td>
|
<td>{{ node.CPUs / 1000000000 }}</td>
|
||||||
<td>{{ node.Description.Resources.MemoryBytes|humansize }}</td>
|
<td>{{ node.Memory|humansize }}</td>
|
||||||
<td>{{ node.Description.Engine.EngineVersion }}</td>
|
<td>{{ node.EngineVersion }}</td>
|
||||||
<td><span class="label label-{{ node.Status.State|nodestatusbadge }}">{{ node.Status.State }}</span></td>
|
<td ng-if="applicationState.endpoint.apiVersion >= 1.25">{{ node.Addr }}</td>
|
||||||
|
<td><span class="label label-{{ node.Status|nodestatusbadge }}">{{ node.Status }}</span></td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
|
@ -28,7 +28,9 @@ function ($scope, Info, Version, Node, Pagination) {
|
||||||
$scope.info = d;
|
$scope.info = d;
|
||||||
if ($scope.applicationState.endpoint.mode.provider === 'DOCKER_SWARM_MODE') {
|
if ($scope.applicationState.endpoint.mode.provider === 'DOCKER_SWARM_MODE') {
|
||||||
Node.query({}, function(d) {
|
Node.query({}, function(d) {
|
||||||
$scope.nodes = d;
|
$scope.nodes = d.map(function (node) {
|
||||||
|
return new NodeViewModel(node);
|
||||||
|
});
|
||||||
var CPU = 0, memory = 0;
|
var CPU = 0, memory = 0;
|
||||||
angular.forEach(d, function(node) {
|
angular.forEach(d, function(node) {
|
||||||
CPU += node.Description.Resources.NanoCPUs;
|
CPU += node.Description.Resources.NanoCPUs;
|
||||||
|
|
|
@ -27,6 +27,10 @@ function NodeViewModel(data) {
|
||||||
this.Plugins = data.Description.Engine.Plugins;
|
this.Plugins = data.Description.Engine.Plugins;
|
||||||
this.Status = data.Status.State;
|
this.Status = data.Status.State;
|
||||||
|
|
||||||
|
if (data.Status.Addr) {
|
||||||
|
this.Addr = data.Status.Addr;
|
||||||
|
}
|
||||||
|
|
||||||
if (data.ManagerStatus) {
|
if (data.ManagerStatus) {
|
||||||
this.Leader = data.ManagerStatus.Leader;
|
this.Leader = data.ManagerStatus.Leader;
|
||||||
this.Reachability = data.ManagerStatus.Reachability;
|
this.Reachability = data.ManagerStatus.Reachability;
|
||||||
|
|
Loading…
Reference in New Issue