feat(host-details): update node availability

pull/2255/head
Chaim Lando 2018-09-12 12:32:39 +03:00
parent 42497ab60c
commit 10b904a13b
8 changed files with 82 additions and 11 deletions

View File

@ -0,0 +1,27 @@
angular
.module('portainer.docker')
.controller('NodeAvailabilitySelectController', [
function NodeAvailabilitySelectController() {
this.state = {
hasChanges: false
};
this.onChange = onChange;
this.save = save;
this.cancelChanges = cancelChanges;
function onChange() {
this.state.hasChanges = this.originalValue !== this.availability;
}
function save() {
this.onSave({ availability: this.availability });
}
function cancelChanges() {
this.state.hasChanges = false;
this.availability = this.originalValue;
}
}
]);

View File

@ -0,0 +1,21 @@
<div class="input-group input-group-sm">
<select name="nodeAvailability" class="selectpicker form-control" ng-model="$ctrl.availability"
ng-change="$ctrl.onChange($event)">
<option value="active">Active</option>
<option value="pause">Pause</option>
<option value="drain">Drain</option>
</select>
<div class="btn-toolbar" role="toolbar">
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary btn-sm" ng-disabled="!$ctrl.state.hasChanges"
ng-click="$ctrl.save()">Apply changes</button>
<button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a ng-click="$ctrl.cancelChanges()">Reset changes</a></li>
</ul>
</div>
</div>
</div>

View File

@ -0,0 +1,10 @@
angular.module('portainer.docker').component('nodeAvailabilitySelect', {
templateUrl:
'app/docker/components/host-view-panels/node-availability-select/node-availability-select.html',
controller: 'NodeAvailabilitySelectController',
bindings: {
availability: '<',
originalValue: '<',
onSave: '&'
}
});

View File

@ -5,23 +5,18 @@ angular
this.state = {
managerAddress: ''
};
this.$onInit = initView;
this.$onChanges = $onChanges;
this.addLabel = addLabel;
this.updateNodeLabels = updateNodeLabels;
this.updateNodeAvailability = updateNodeAvailability;
var managerRole = 'manager';
function initView() {
}
function $onChanges() {
if (!this.details) {
return;
}
if (this.details.role === managerRole) {
this.state.managerAddress =
'(' + this.details.managerAddress + ')';
this.state.managerAddress = '(' + this.details.managerAddress + ')';
}
}
@ -35,7 +30,11 @@ angular
}
function updateNodeLabels(labels) {
this.onChangedLabels({labels: labels});
this.onChangedLabels({ labels: labels });
}
function updateNodeAvailability(availability) {
this.onChangedAvailability({ availability: availability });
}
}
]);

View File

@ -15,11 +15,16 @@
</tr>
<tr>
<td>Availability</td>
<td>{{ $ctrl.details.availability }}</td>
<td>
<node-availability-select
on-save="$ctrl.updateNodeAvailability(availability)"
availability="$ctrl.details.availability"
original-value="$ctrl.details.availability"></node-availability-select>
</td>
</tr>
<tr>
<td>Status</td>
<td>{{ $ctrl.details.status }}</td>
<td><span class="label label-{{ $ctrl.details.status | nodestatusbadge }}">{{ $ctrl.details.status }}</span></td>
</tr>
<tr>
<td>Engine Labels</td>

View File

@ -4,6 +4,7 @@ angular.module('portainer.docker').component('swarmNodeDetailsPanel', {
controller: 'SwarmNodeDetailsPanelController',
bindings: {
details: '<',
onChangedLabels: '&'
onChangedLabels: '&',
onChangedAvailability: '&'
}
});

View File

@ -6,6 +6,8 @@ angular.module('portainer.docker').controller('NodeDetailsViewController', [
ctrl.$onInit = initView;
ctrl.updateLabels = updateLabels;
ctrl.updateAvailability = updateAvailability;
ctrl.state = {
isAgent: false
};
@ -65,6 +67,11 @@ angular.module('portainer.docker').controller('NodeDetailsViewController', [
updateNode(originalNode);
}
function updateAvailability(availability) {
originalNode.Availability = availability;
updateNode(originalNode);
}
function updateNode(node) {
var config = {
Name: node.Name,

View File

@ -6,5 +6,6 @@
<swarm-node-details-panel
details="$ctrl.nodeDetails"
on-changed-labels="$ctrl.updateLabels(labels)"
on-changed-availability="$ctrl.updateAvailability(availability)"
></swarm-node-details-panel>
</host-overview>