mirror of
https://github.com/portainer/portainer.git
synced 2025-08-05 13:55:21 +02:00
Implemented single network view, connect, disconnect, remove.
This commit is contained in:
parent
a712d5b77e
commit
8a4be8b93a
5 changed files with 250 additions and 3 deletions
110
app/components/network/network.html
Normal file
110
app/components/network/network.html
Normal file
|
@ -0,0 +1,110 @@
|
|||
<div class="detail">
|
||||
|
||||
<h4>Network: {{ network.Name }}</h4>
|
||||
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Name:</td>
|
||||
<td>{{ network.Name }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Id:</td>
|
||||
<td>{{ network.Id }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Scope:</td>
|
||||
<td>{{ network.Scope }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Driver:</td>
|
||||
<td>{{ network.Driver }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>IPAM:</td>
|
||||
<td>
|
||||
<table class="table table-striped">
|
||||
<tr>
|
||||
<td>Driver:</td>
|
||||
<td>{{ network.IPAM.Driver }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Subnet:</td>
|
||||
<td>{{ network.IPAM.Config[0].Subnet }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Gateway:</td>
|
||||
<td>{{ network.IPAM.Config[0].Gateway }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Containers:</td>
|
||||
<td>
|
||||
<table class="table table-striped" ng-repeat="(Id, container) in network.Containers">
|
||||
<tr>
|
||||
<td>Id:</td>
|
||||
<td><a href="#/containers/{{ Id }}">{{ Id }}</a></td>
|
||||
<td>
|
||||
<button ng-click="disconnect(network.Id, Id)" class="btn btn-danger btn-sm">
|
||||
Disconnect from network
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>EndpointID:</td>
|
||||
<td>{{ container.EndpointID}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>MacAddress:</td>
|
||||
<td>{{ container.MacAddress}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>IPv4Address:</td>
|
||||
<td>{{ container.IPv4Address}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>IPv6Address:</td>
|
||||
<td>{{ container.IPv6Address}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
<form class="form-inline">
|
||||
<div class="form-group">
|
||||
<label>Container ID:
|
||||
<input ng-model="containerId" placeholder="3613f73ba0e4" class="form-control">
|
||||
</label>
|
||||
</div>
|
||||
<button ng-click="connect(network.Id, containerId)" class="btn btn-primary">
|
||||
Connect
|
||||
</button>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Options:</td>
|
||||
<td>
|
||||
<table role="table" class="table table-striped">
|
||||
<tr>
|
||||
<th>Key</th>
|
||||
<th>Value</th>
|
||||
</tr>
|
||||
<tr ng-repeat="(k, v) in network.Options">
|
||||
<td>{{ k }}</td>
|
||||
<td>{{ v }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
<hr/>
|
||||
|
||||
|
||||
<div class="btn-remove">
|
||||
<button class="btn btn-large btn-block btn-primary btn-danger" ng-click="removeImage(id)">Remove Network
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
51
app/components/network/networkController.js
Normal file
51
app/components/network/networkController.js
Normal file
|
@ -0,0 +1,51 @@
|
|||
angular.module('network', []).config(['$routeProvider', function ($routeProvider) {
|
||||
$routeProvider.when('/networks/:id/', {
|
||||
templateUrl: 'app/components/network/network.html',
|
||||
controller: 'NetworkController'
|
||||
});
|
||||
}]).controller('NetworkController', ['$scope', 'Network', 'ViewSpinner', 'Messages', '$routeParams', '$location',
|
||||
function ($scope, Network, ViewSpinner, Messages, $routeParams, $location) {
|
||||
|
||||
$scope.disconnect = function disconnect(networkId, containerId) {
|
||||
ViewSpinner.spin();
|
||||
Network.disconnect({id: $routeParams.id}, {Container: containerId}, function (d) {
|
||||
ViewSpinner.stop();
|
||||
Messages.send("Container disconnected", d);
|
||||
$location.path('/networks/' + $routeParams.id); // Refresh the current page.
|
||||
}, function (e) {
|
||||
ViewSpinner.stop();
|
||||
Messages.error("Failure", e.data);
|
||||
});
|
||||
};
|
||||
$scope.connect = function connect(networkId, containerId) {
|
||||
ViewSpinner.spin();
|
||||
Network.connect({id: $routeParams.id}, {Container: containerId}, function (d) {
|
||||
ViewSpinner.stop();
|
||||
Messages.send("Container connected", d);
|
||||
$location.path('/networks/' + $routeParams.id); // Refresh the current page.
|
||||
}, function (e) {
|
||||
ViewSpinner.stop();
|
||||
Messages.error("Failure", e.data);
|
||||
});
|
||||
};
|
||||
$scope.remove = function remove(networkId) {
|
||||
ViewSpinner.spin();
|
||||
Network.remove({id: $routeParams.id}, function (d) {
|
||||
ViewSpinner.stop();
|
||||
Messages.send("Network removed", d);
|
||||
$location.path('/networks'); // Go to the networks page
|
||||
}, function (e) {
|
||||
ViewSpinner.stop();
|
||||
Messages.error("Failure", e.data);
|
||||
});
|
||||
};
|
||||
|
||||
ViewSpinner.spin();
|
||||
Network.get({id: $routeParams.id}, function (d) {
|
||||
$scope.network = d;
|
||||
ViewSpinner.stop();
|
||||
}, function (e) {
|
||||
Messages.error("Failure", e.data);
|
||||
ViewSpinner.stop();
|
||||
});
|
||||
}]);
|
Loading…
Add table
Add a link
Reference in a new issue