github
/
portainer
mirror of https://github.com/portainer/portainer
1
0
Fork 0
Code Issues Releases Wiki Activity

chore(project): add prettier for code format (#3645) 

* chore(project): install prettier and lint-staged

* chore(project): apply prettier to html too

* chore(project): git ignore eslintcache

* chore(project): add a comment about format script

* chore(prettier): update printWidth

* chore(prettier): remove useTabs option

* chore(prettier): add HTML validation

* refactor(prettier): fix closing tags

* feat(prettier): define angular parser for html templates

* style(prettier): run prettier on codebase

Co-authored-by: Anthony Lapenna <lapenna.anthony@gmail.com>
pull/3702/head
Chaim Lev-Ari 2020-04-11 00:54:53 +03:00 committed by GitHub
parent 6663073be1
commit cf5056d9c0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
714 changed files with 31228 additions and 28305 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -5,3 +5,4 @@ portainer-checksum.txt
api/cmd/portainer/portainer* api/cmd/portainer/portainer*
.tmp .tmp
.vscode .vscode
.eslintcache

13
.prettierrc Normal file
View File

@ -0,0 +1,13 @@
{
"printWidth": 180,
"singleQuote": true,
"htmlWhitespaceSensitivity": "strict",
"overrides": [
{
"files": ["*.html"],
"options": {
"parser": "angular"
}
}
]
}

4
app/__module.js
View File

@ -32,12 +32,12 @@ angular.module('portainer', [
'portainer.extensions', 'portainer.extensions',
'portainer.integrations', 'portainer.integrations',
'rzModule', 'rzModule',
'moment-picker' 'moment-picker',
]); ]);
if (require) { if (require) {
var req = require.context('./', true, /^(.*\.(js$))[^.]*$/im); var req = require.context('./', true, /^(.*\.(js$))[^.]*$/im);
req.keys().forEach(function(key) { req.keys().forEach(function (key) {
req(key); req(key);
}); });
} }

4
app/agent/components/file-uploader/file-uploader-controller.js
View File

@ -4,7 +4,7 @@ angular.module('portainer.agent').controller('FileUploaderController', [
var ctrl = this; var ctrl = this;
ctrl.state = { ctrl.state = {
uploadInProgress: false uploadInProgress: false,
}; };
ctrl.onFileSelected = onFileSelected; ctrl.onFileSelected = onFileSelected;
@ -19,5 +19,5 @@ angular.module('portainer.agent').controller('FileUploaderController', [
ctrl.state.uploadInProgress = false; ctrl.state.uploadInProgress = false;
}); });
} }
} },
]); ]);

7
app/agent/components/file-uploader/file-uploader.html
View File

@ -1,6 +1,3 @@
<button <button ngf-select="$ctrl.onFileSelected($file)" class="btn ng-scope" button-spinner="$ctrl.state.uploadInProgress">
ngf-select="$ctrl.onFileSelected($file)" <i style="margin: 0;" class="fa fa-upload" ng-if="!$ctrl.state.uploadInProgress"></i>
class="btn ng-scope"
button-spinner="$ctrl.state.uploadInProgress">
<i style="margin:0" class="fa fa-upload" ng-if="!$ctrl.state.uploadInProgress"></i>
</button> </button>

4
app/agent/components/file-uploader/file-uploader.js
View File

@ -2,6 +2,6 @@ angular.module('portainer.agent').component('fileUploader', {
templateUrl: './file-uploader.html', templateUrl: './file-uploader.html',
controller: 'FileUploaderController', controller: 'FileUploaderController',
bindings: { bindings: {
uploadFile: '<onFileSelected' uploadFile: '<onFileSelected',
} },
}); });

43
app/agent/components/files-datatable/files-datatable.html
View File

@ -1,14 +1,20 @@
<div class="datatable"> <div class="datatable">
<rd-widget> <rd-widget>
<rd-widget-header icon="{{$ctrl.titleIcon}}" title-text="{{ $ctrl.titleText }}"> <rd-widget-header icon="{{ $ctrl.titleIcon }}" title-text="{{ $ctrl.titleText }}">
<file-uploader authorization="DockerAgentBrowsePut" ng-if="$ctrl.isUploadAllowed" on-file-selected="$ctrl.onFileSelectedForUpload"> <file-uploader authorization="DockerAgentBrowsePut" ng-if="$ctrl.isUploadAllowed" on-file-selected="($ctrl.onFileSelectedForUpload)"> </file-uploader>
</file-uploader>
</rd-widget-header> </rd-widget-header>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-model-options="{ debounce: 300 }" <input
ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus> type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-model-options="{ debounce: 300 }"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table"> <table class="table">
@ -43,36 +49,33 @@
<tbody> <tbody>
<tr ng-if="!$ctrl.isRoot"> <tr ng-if="!$ctrl.isRoot">
<td colspan="4"> <td colspan="4">
<a ng-click="$ctrl.goToParent()"><i class="fa fa-level-up-alt space-right"></i>Go <a ng-click="$ctrl.goToParent()"><i class="fa fa-level-up-alt space-right"></i>Go to parent</a>
to parent</a>
</td> </td>
</tr> </tr>
<tr ng-repeat="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder))"> <tr ng-repeat="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder))">
<td> <td>
<span ng-if="item.edit"> <span ng-if="item.edit">
<input class="input-sm" type="text" ng-model="item.newName" <input
on-enter-key="$ctrl.rename({name: item.Name, newName: item.newName}); item.edit = false;" class="input-sm"
auto-focus /> type="text"
ng-model="item.newName"
on-enter-key="$ctrl.rename({ name: item.Name, newName: item.newName }); item.edit = false"
auto-focus
/>
<a class="interactive" ng-click="item.edit = false;"><i class="fa fa-times"></i></a> <a class="interactive" ng-click="item.edit = false;"><i class="fa fa-times"></i></a>
<a class="interactive" ng-click="$ctrl.rename({name: item.Name, newName: item.newName}); item.edit = false;"><i <a class="interactive" ng-click="$ctrl.rename({name: item.Name, newName: item.newName}); item.edit = false;"><i class="fa fa-check-square"></i></a>
class="fa fa-check-square"></i></a>
</span> </span>
<span ng-if="!item.edit && item.Dir"> <span ng-if="!item.edit && item.Dir">
<a ng-click="$ctrl.browse({name: item.Name})"><i class="fa fa-folder space-right" <a ng-click="$ctrl.browse({name: item.Name})"><i class="fa fa-folder space-right" aria-hidden="true"></i>{{ item.Name }}</a>
aria-hidden="true"></i>{{ item.Name }}</a>
</span>
<span ng-if="!item.edit && !item.Dir">
<i class="fa fa-file space-right" aria-hidden="true"></i>{{
item.Name }}
</span> </span>
<span ng-if="!item.edit && !item.Dir"> <i class="fa fa-file space-right" aria-hidden="true"></i>{{ item.Name }} </span>
</td> </td>
<td>{{ item.Size | humansize }}</td> <td>{{ item.Size | humansize }}</td>
<td> <td>
{{ item.ModTime | getisodatefromtimestamp }} {{ item.ModTime | getisodatefromtimestamp }}
</td> </td>
<td> <td>
<btn authorization="DockerAgentBrowseGet" class="btn btn-xs btn-primary space-right" ng-click="$ctrl.download({ name: item.Name })" <btn authorization="DockerAgentBrowseGet" class="btn btn-xs btn-primary space-right" ng-click="$ctrl.download({ name: item.Name })" ng-if="!item.Dir">
ng-if="!item.Dir">
<i class="fa fa-download" aria-hidden="true"></i> Download <i class="fa fa-download" aria-hidden="true"></i> Download
</btn> </btn>
<btn authorization="DockerAgentBrowseRename" class="btn btn-xs btn-primary space-right" ng-click="item.newName = item.Name; item.edit = true"> <btn authorization="DockerAgentBrowseRename" class="btn btn-xs btn-primary space-right" ng-click="item.newName = item.Name; item.edit = true">

4
app/agent/components/files-datatable/files-datatable.js
View File

@ -17,6 +17,6 @@ angular.module('portainer.agent').component('filesDatatable', {
delete: '&', delete: '&',
isUploadAllowed: '<', isUploadAllowed: '<',
onFileSelectedForUpload: '<' onFileSelectedForUpload: '<',
} },
}); });

26
app/agent/components/host-browser/host-browser-controller.js
View File

@ -1,12 +1,15 @@
import _ from 'lodash-es'; import _ from 'lodash-es';
angular.module('portainer.agent').controller('HostBrowserController', [ angular.module('portainer.agent').controller('HostBrowserController', [
'HostBrowserService', 'Notifications', 'FileSaver', 'ModalService', 'HostBrowserService',
'Notifications',
'FileSaver',
'ModalService',
function HostBrowserController(HostBrowserService, Notifications, FileSaver, ModalService) { function HostBrowserController(HostBrowserService, Notifications, FileSaver, ModalService) {
var ctrl = this; var ctrl = this;
var ROOT_PATH = '/host'; var ROOT_PATH = '/host';
ctrl.state = { ctrl.state = {
path: ROOT_PATH path: ROOT_PATH,
}; };
ctrl.goToParent = goToParent; ctrl.goToParent = goToParent;
@ -21,7 +24,7 @@ angular.module('portainer.agent').controller('HostBrowserController', [
function getRelativePath(path) { function getRelativePath(path) {
path = path || ctrl.state.path; path = path || ctrl.state.path;
var rootPathRegex = new RegExp('^' + ROOT_PATH + '\/?'); var rootPathRegex = new RegExp('^' + ROOT_PATH + '/?');
var relativePath = path.replace(rootPathRegex, '/'); var relativePath = path.replace(rootPathRegex, '/');
return relativePath; return relativePath;
} }
@ -71,7 +74,7 @@ angular.module('portainer.agent').controller('HostBrowserController', [
HostBrowserService.get(filePath) HostBrowserService.get(filePath)
.then(function onFileReceived(data) { .then(function onFileReceived(data) {
var downloadData = new Blob([data.file], { var downloadData = new Blob([data.file], {
type: 'text/plain;charset=utf-8' type: 'text/plain;charset=utf-8',
}); });
FileSaver.saveAs(downloadData, file); FileSaver.saveAs(downloadData, file);
}) })
@ -83,15 +86,12 @@ angular.module('portainer.agent').controller('HostBrowserController', [
function confirmDeleteFile(name) { function confirmDeleteFile(name) {
var filePath = buildPath(ctrl.state.path, name); var filePath = buildPath(ctrl.state.path, name);
ModalService.confirmDeletion( ModalService.confirmDeletion('Are you sure that you want to delete ' + getRelativePath(filePath) + ' ?', function onConfirm(confirmed) {
'Are you sure that you want to delete ' + getRelativePath(filePath) + ' ?', if (!confirmed) {
function onConfirm(confirmed) { return;
if (!confirmed) {
return;
}
return deleteFile(filePath);
} }
); return deleteFile(filePath);
});
} }
function deleteFile(path) { function deleteFile(path) {
@ -145,5 +145,5 @@ angular.module('portainer.agent').controller('HostBrowserController', [
function refreshList() { function refreshList() {
getFilesForPath(ctrl.state.path); getFilesForPath(ctrl.state.path);
} }
} },
]); ]);

10
app/agent/components/host-browser/host-browser.html
View File

@ -1,6 +1,8 @@
<files-datatable <files-datatable
title-text="Host browser - {{$ctrl.getRelativePath()}}" title-icon="fa-file" title-text="Host browser - {{ $ctrl.getRelativePath() }}"
dataset="$ctrl.files" table-key="host_browser" title-icon="fa-file"
dataset="$ctrl.files"
table-key="host_browser"
order-by="Dir" order-by="Dir"
is-root="$ctrl.isRoot()" is-root="$ctrl.isRoot()"
go-to-parent="$ctrl.goToParent()" go-to-parent="$ctrl.goToParent()"
@ -8,9 +10,7 @@
rename="$ctrl.renameFile(name, newName)" rename="$ctrl.renameFile(name, newName)"
download="$ctrl.downloadFile(name)" download="$ctrl.downloadFile(name)"
delete="$ctrl.deleteFile(name)" delete="$ctrl.deleteFile(name)"
is-upload-allowed="true" is-upload-allowed="true"
on-file-selected-for-upload="$ctrl.onFileSelectedForUpload" on-file-selected-for-upload="($ctrl.onFileSelectedForUpload)"
> >
</files-datatable> </files-datatable>

2
app/agent/components/host-browser/host-browser.js
View File

@ -1,5 +1,5 @@
angular.module('portainer.agent').component('hostBrowser', { angular.module('portainer.agent').component('hostBrowser', {
controller: 'HostBrowserController', controller: 'HostBrowserController',
templateUrl: './host-browser.html', templateUrl: './host-browser.html',
bindings: {} bindings: {},
}); });

4
app/agent/components/node-selector/node-selector.js
View File

@ -2,6 +2,6 @@ angular.module('portainer.agent').component('nodeSelector', {
templateUrl: './nodeSelector.html', templateUrl: './nodeSelector.html',
controller: 'NodeSelectorController', controller: 'NodeSelectorController',
bindings: { bindings: {
model: '=' model: '=',
} },
}); });

4
app/agent/components/node-selector/nodeSelector.html
View File

@ -1,8 +1,6 @@
<div class="form-group"> <div class="form-group">
<label for="target_node" class="col-sm-1 control-label text-left">Node</label> <label for="target_node" class="col-sm-1 control-label text-left">Node</label>
<div class="col-sm-11"> <div class="col-sm-11">
<select class="form-control" <select class="form-control" ng-model="$ctrl.model" ng-options="agent.NodeName as agent.NodeName for agent in $ctrl.agents"></select>
ng-model="$ctrl.model" ng-options="agent.NodeName as agent.NodeName for agent in $ctrl.agents"
></select>
</div> </div>
</div> </div>

36
app/agent/components/node-selector/nodeSelectorController.js
View File

@ -1,18 +1,20 @@
angular.module('portainer.agent') angular.module('portainer.agent').controller('NodeSelectorController', [
.controller('NodeSelectorController', ['AgentService', 'Notifications', function (AgentService, Notifications) { 'AgentService',
var ctrl = this; 'Notifications',
function (AgentService, Notifications) {
var ctrl = this;
this.$onInit = function() { this.$onInit = function () {
AgentService.agents() AgentService.agents()
.then(function success(data) { .then(function success(data) {
ctrl.agents = data; ctrl.agents = data;
if (!ctrl.model) { if (!ctrl.model) {
ctrl.model = data[0].NodeName; ctrl.model = data[0].NodeName;
} }
}) })
.catch(function error(err) { .catch(function error(err) {
Notifications.error('Failure', err, 'Unable to load agents'); Notifications.error('Failure', err, 'Unable to load agents');
}); });
}; };
},
}]); ]);

4
app/agent/components/volume-browser/volume-browser.js
View File

@ -4,6 +4,6 @@ angular.module('portainer.agent').component('volumeBrowser', {
bindings: { bindings: {
volumeId: '<', volumeId: '<',
nodeName: '<', nodeName: '<',
isUploadEnabled: '<' isUploadEnabled: '<',
} },
}); });

9
app/agent/components/volume-browser/volumeBrowser.html
View File

@ -1,6 +1,8 @@
<files-datatable <files-datatable
title-text="Volume browser" title-icon="fa-file" title-text="Volume browser"
dataset="$ctrl.files" table-key="volume_browser" title-icon="fa-file"
dataset="$ctrl.files"
table-key="volume_browser"
order-by="Dir" order-by="Dir"
is-root="$ctrl.state.path === '/'" is-root="$ctrl.state.path === '/'"
go-to-parent="$ctrl.up()" go-to-parent="$ctrl.up()"
@ -8,7 +10,6 @@
rename="$ctrl.rename(name, newName)" rename="$ctrl.rename(name, newName)"
download="$ctrl.download(name)" download="$ctrl.download(name)"
delete="$ctrl.delete(name)" delete="$ctrl.delete(name)"
is-upload-allowed="$ctrl.isUploadEnabled" is-upload-allowed="$ctrl.isUploadEnabled"
on-file-selected-for-upload="$ctrl.onFileSelectedForUpload" on-file-selected-for-upload="($ctrl.onFileSelectedForUpload)"
></files-datatable> ></files-datatable>

234
app/agent/components/volume-browser/volumeBrowserController.js
View File

@ -1,137 +1,137 @@
import _ from 'lodash-es'; import _ from 'lodash-es';
angular.module('portainer.agent') angular.module('portainer.agent').controller('VolumeBrowserController', [
.controller('VolumeBrowserController', ['HttpRequestHelper', 'VolumeBrowserService', 'FileSaver', 'Blob', 'ModalService', 'Notifications', 'HttpRequestHelper',
function (HttpRequestHelper, VolumeBrowserService, FileSaver, Blob, ModalService, Notifications) { 'VolumeBrowserService',
var ctrl = this; 'FileSaver',
'Blob',
'ModalService',
'Notifications',
function (HttpRequestHelper, VolumeBrowserService, FileSaver, Blob, ModalService, Notifications) {
var ctrl = this;
this.state = { this.state = {
path: '/' path: '/',
}; };
this.rename = function(file, newName) { this.rename = function (file, newName) {
var filePath = this.state.path === '/' ? file : this.state.path + '/' + file; var filePath = this.state.path === '/' ? file : this.state.path + '/' + file;
var newFilePath = this.state.path === '/' ? newName : this.state.path + '/' + newName; var newFilePath = this.state.path === '/' ? newName : this.state.path + '/' + newName;
VolumeBrowserService.rename(this.volumeId, filePath, newFilePath) VolumeBrowserService.rename(this.volumeId, filePath, newFilePath)
.then(function success() { .then(function success() {
Notifications.success('File successfully renamed', newFilePath); Notifications.success('File successfully renamed', newFilePath);
return VolumeBrowserService.ls(ctrl.volumeId, ctrl.state.path); return VolumeBrowserService.ls(ctrl.volumeId, ctrl.state.path);
}) })
.then(function success(data) { .then(function success(data) {
ctrl.files = data; ctrl.files = data;
}) })
.catch(function error(err) { .catch(function error(err) {
Notifications.error('Failure', err, 'Unable to rename file'); Notifications.error('Failure', err, 'Unable to rename file');
}); });
}; };
this.delete = function(file) { this.delete = function (file) {
var filePath = this.state.path === '/' ? file : this.state.path + '/' + file; var filePath = this.state.path === '/' ? file : this.state.path + '/' + file;
ModalService.confirmDeletion( ModalService.confirmDeletion('Are you sure that you want to delete ' + filePath + ' ?', function onConfirm(confirmed) {
'Are you sure that you want to delete ' + filePath + ' ?', if (!confirmed) {
function onConfirm(confirmed) { return;
if(!confirmed) { return; } }
deleteFile(filePath); deleteFile(filePath);
}
);
};
this.download = function(file) {
var filePath = this.state.path === '/' ? file : this.state.path + '/' + file;
VolumeBrowserService.get(this.volumeId, filePath)
.then(function success(data) {
var downloadData = new Blob([data.file]);
FileSaver.saveAs(downloadData, file);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to download file');
});
};
this.up = function() {
var parentFolder = parentPath(this.state.path);
browse(parentFolder);
};
this.browse = function(folder) {
var path = buildPath(this.state.path, folder);
browse(path);
};
function deleteFile(file) {
VolumeBrowserService.delete(ctrl.volumeId, file)
.then(function success() {
Notifications.success('File successfully deleted', file);
return VolumeBrowserService.ls(ctrl.volumeId, ctrl.state.path);
})
.then(function success(data) {
ctrl.files = data;
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to delete file');
});
}
function browse(path) {
VolumeBrowserService.ls(ctrl.volumeId, path)
.then(function success(data) {
ctrl.state.path = path;
ctrl.files = data;
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to browse volume');
});
}
this.onFileSelectedForUpload = function onFileSelectedForUpload(file) {
VolumeBrowserService.upload(ctrl.state.path, file, ctrl.volumeId)
.then(function onFileUpload() {
onFileUploaded();
})
.catch(function onFileUpload(err) {
Notifications.error('Failure', err, 'Unable to upload file');
}); });
}; };
function parentPath(path) { this.download = function (file) {
if (path.lastIndexOf('/') === 0) { var filePath = this.state.path === '/' ? file : this.state.path + '/' + file;
return '/'; VolumeBrowserService.get(this.volumeId, filePath)
.then(function success(data) {
var downloadData = new Blob([data.file]);
FileSaver.saveAs(downloadData, file);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to download file');
});
};
this.up = function () {
var parentFolder = parentPath(this.state.path);
browse(parentFolder);
};
this.browse = function (folder) {
var path = buildPath(this.state.path, folder);
browse(path);
};
function deleteFile(file) {
VolumeBrowserService.delete(ctrl.volumeId, file)
.then(function success() {
Notifications.success('File successfully deleted', file);
return VolumeBrowserService.ls(ctrl.volumeId, ctrl.state.path);
})
.then(function success(data) {
ctrl.files = data;
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to delete file');
});
} }
var split = _.split(path, '/'); function browse(path) {
return _.join(_.slice(split, 0, split.length - 1), '/'); VolumeBrowserService.ls(ctrl.volumeId, path)
} .then(function success(data) {
ctrl.state.path = path;
function buildPath(parent, file) { ctrl.files = data;
if (parent === '/') { })
return parent + file; .catch(function error(err) {
Notifications.error('Failure', err, 'Unable to browse volume');
});
} }
return parent + '/' + file;
}
this.onFileSelectedForUpload = function onFileSelectedForUpload(file) {
VolumeBrowserService.upload(ctrl.state.path, file, ctrl.volumeId)
.then(function onFileUpload() {
onFileUploaded();
})
.catch(function onFileUpload(err) {
Notifications.error('Failure', err, 'Unable to upload file');
});
};
this.$onInit = function() { function parentPath(path) {
HttpRequestHelper.setPortainerAgentTargetHeader(this.nodeName); if (path.lastIndexOf('/') === 0) {
VolumeBrowserService.ls(this.volumeId, this.state.path) return '/';
.then(function success(data) { }
ctrl.files = data;
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to browse volume');
});
};
function onFileUploaded() { var split = _.split(path, '/');
refreshList(); return _.join(_.slice(split, 0, split.length - 1), '/');
} }
function refreshList() { function buildPath(parent, file) {
browse(ctrl.state.path); if (parent === '/') {
} return parent + file;
}
return parent + '/' + file;
}
this.$onInit = function () {
HttpRequestHelper.setPortainerAgentTargetHeader(this.nodeName);
VolumeBrowserService.ls(this.volumeId, this.state.path)
.then(function success(data) {
ctrl.files = data;
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to browse volume');
});
};
function onFileUploaded() {
refreshList();
}
}]); function refreshList() {
browse(ctrl.state.path);
}
},
]);

4
app/agent/models/agent.js
View File

@ -1,5 +1,5 @@
export function AgentViewModel(data) { export function AgentViewModel(data) {
this.IPAddress = data.IPAddress; this.IPAddress = data.IPAddress;
this.NodeName = data.NodeName; this.NodeName = data.NodeName;
this.NodeRole = data.NodeRole; this.NodeRole = data.NodeRole;
} }

27
app/agent/rest/agent.js
View File

@ -1,12 +1,19 @@
angular.module('portainer.agent') angular.module('portainer.agent').factory('Agent', [
.factory('Agent', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', 'StateManager', '$resource',
'API_ENDPOINT_ENDPOINTS',
'EndpointProvider',
'StateManager',
function AgentFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, StateManager) { function AgentFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, StateManager) {
'use strict'; 'use strict';
return $resource(API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/v:version/agents', { return $resource(
endpointId: EndpointProvider.endpointID, API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/v:version/agents',
version: StateManager.getAgentApiVersion {
endpointId: EndpointProvider.endpointID,
version: StateManager.getAgentApiVersion,
},
{
query: { method: 'GET', isArray: true },
}
);
}, },
{ ]);
query: { method: 'GET', isArray: true }
});
}]);

58
app/agent/rest/browse.js
View File

@ -1,27 +1,39 @@
import { browseGetResponse } from './response/browse'; import { browseGetResponse } from './response/browse';
angular.module('portainer.agent') angular.module('portainer.agent').factory('Browse', [
.factory('Browse', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', 'StateManager', '$resource',
'API_ENDPOINT_ENDPOINTS',
'EndpointProvider',
'StateManager',
function BrowseFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, StateManager) { function BrowseFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, StateManager) {
'use strict'; 'use strict';
return $resource(API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/v:version/browse/:action', { return $resource(
endpointId: EndpointProvider.endpointID, API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/v:version/browse/:action',
version: StateManager.getAgentApiVersion {
endpointId: EndpointProvider.endpointID,
version: StateManager.getAgentApiVersion,
},
{
ls: {
method: 'GET',
isArray: true,
params: { action: 'ls' },
},
get: {
method: 'GET',
params: { action: 'get' },
transformResponse: browseGetResponse,
responseType: 'arraybuffer',
},
delete: {
method: 'DELETE',
params: { action: 'delete' },
},
rename: {
method: 'PUT',
params: { action: 'rename' },
},
}
);
}, },
{ ]);
ls: {
method: 'GET', isArray: true, params: { action: 'ls' }
},
get: {
method: 'GET', params: { action: 'get' },
transformResponse: browseGetResponse,
responseType: 'arraybuffer'
},
delete: {
method: 'DELETE', params: { action: 'delete' }
},
rename: {
method: 'PUT', params: { action: 'rename' }
}
});
}]);

11
app/agent/rest/host.js
View File

@ -1,16 +1,19 @@
angular.module('portainer.agent').factory('Host', [ angular.module('portainer.agent').factory('Host', [
'$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', 'StateManager', '$resource',
'API_ENDPOINT_ENDPOINTS',
'EndpointProvider',
'StateManager',
function AgentFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, StateManager) { function AgentFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, StateManager) {
'use strict'; 'use strict';
return $resource( return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/v:version/host/:action', API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/v:version/host/:action',
{ {
endpointId: EndpointProvider.endpointID, endpointId: EndpointProvider.endpointID,
version: StateManager.getAgentApiVersion version: StateManager.getAgentApiVersion,
}, },
{ {
info: { method: 'GET', params: { action: 'info' } } info: { method: 'GET', params: { action: 'info' } },
} }
); );
} },
]); ]);

18
app/agent/rest/ping.js
View File

@ -1,11 +1,14 @@
angular.module('portainer.agent').factory('AgentPing', [ angular.module('portainer.agent').factory('AgentPing', [
'$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$q', '$resource',
'API_ENDPOINT_ENDPOINTS',
'EndpointProvider',
'$q',
function AgentPingFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, $q) { function AgentPingFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider, $q) {
'use strict'; 'use strict';
return $resource( return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/ping', API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/ping',
{ {
endpointId: EndpointProvider.endpointID endpointId: EndpointProvider.endpointID,
}, },
{ {
ping: { ping: {
@ -13,8 +16,7 @@ angular.module('portainer.agent').factory('AgentPing', [
interceptor: { interceptor: {
response: function versionInterceptor(response) { response: function versionInterceptor(response) {
var instance = response.resource; var instance = response.resource;
var version = var version = response.headers('Portainer-Agent-Api-Version') || 1;
response.headers('Portainer-Agent-Api-Version') || 1;
instance.version = Number(version); instance.version = Number(version);
return instance; return instance;
}, },
@ -24,10 +26,10 @@ angular.module('portainer.agent').factory('AgentPing', [
return { version: 1 }; return { version: 1 };
} }
return $q.reject(error); return $q.reject(error);
} },
} },
} },
} }
); );
} },
]); ]);

25
app/agent/rest/v1/agent.js
View File

@ -1,10 +1,17 @@
angular.module('portainer.agent') angular.module('portainer.agent').factory('AgentVersion1', [
.factory('AgentVersion1', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', function AgentFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) { '$resource',
'use strict'; 'API_ENDPOINT_ENDPOINTS',
return $resource(API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/agents', { 'EndpointProvider',
endpointId: EndpointProvider.endpointID function AgentFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'use strict';
return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/agents',
{
endpointId: EndpointProvider.endpointID,
},
{
query: { method: 'GET', isArray: true },
}
);
}, },
{ ]);
query: { method: 'GET', isArray: true }
});
}]);

56
app/agent/rest/v1/browse.js
View File

@ -1,25 +1,37 @@
import { browseGetResponse } from '../response/browse'; import { browseGetResponse } from '../response/browse';
angular.module('portainer.agent') angular.module('portainer.agent').factory('BrowseVersion1', [
.factory('BrowseVersion1', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', function BrowseFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) { '$resource',
'use strict'; 'API_ENDPOINT_ENDPOINTS',
return $resource(API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/browse/:volumeID/:action', { 'EndpointProvider',
endpointId: EndpointProvider.endpointID function BrowseFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'use strict';
return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/docker/browse/:volumeID/:action',
{
endpointId: EndpointProvider.endpointID,
},
{
ls: {
method: 'GET',
isArray: true,
params: { action: 'ls' },
},
get: {
method: 'GET',
params: { action: 'get' },
transformResponse: browseGetResponse,
responseType: 'arraybuffer',
},
delete: {
method: 'DELETE',
params: { action: 'delete' },
},
rename: {
method: 'PUT',
params: { action: 'rename' },
},
}
);
}, },
{ ]);
ls: {
method: 'GET', isArray: true, params: { action: 'ls' }
},
get: {
method: 'GET', params: { action: 'get' },
transformResponse: browseGetResponse,
responseType: 'arraybuffer'
},
delete: {
method: 'DELETE', params: { action: 'delete' }
},
rename: {
method: 'PUT', params: { action: 'rename' }
}
});
}]);

14
app/agent/services/agentService.js
View File

@ -1,7 +1,12 @@
import { AgentViewModel } from '../models/agent'; import { AgentViewModel } from '../models/agent';
angular.module('portainer.agent').factory('AgentService', [ angular.module('portainer.agent').factory('AgentService', [
'$q', 'Agent', 'AgentVersion1', 'HttpRequestHelper', 'Host', 'StateManager', '$q',
'Agent',
'AgentVersion1',
'HttpRequestHelper',
'Host',
'StateManager',
function AgentServiceFactory($q, Agent, AgentVersion1, HttpRequestHelper, Host, StateManager) { function AgentServiceFactory($q, Agent, AgentVersion1, HttpRequestHelper, Host, StateManager) {
'use strict'; 'use strict';
var service = {}; var service = {};
@ -25,9 +30,10 @@ angular.module('portainer.agent').factory('AgentService', [
var agentVersion = getAgentApiVersion(); var agentVersion = getAgentApiVersion();
var service = agentVersion > 1 ? Agent : AgentVersion1; var service = agentVersion > 1 ? Agent : AgentVersion1;
service.query({ version: agentVersion }) service
.query({ version: agentVersion })
.$promise.then(function success(data) { .$promise.then(function success(data) {
var agents = data.map(function(item) { var agents = data.map(function (item) {
return new AgentViewModel(item); return new AgentViewModel(item);
}); });
deferred.resolve(agents); deferred.resolve(agents);
@ -40,5 +46,5 @@ angular.module('portainer.agent').factory('AgentService', [
} }
return service; return service;
} },
]); ]);

21
app/agent/services/hostBrowserService.js
View File

@ -1,5 +1,10 @@
angular.module('portainer.agent').factory('HostBrowserService', [ angular.module('portainer.agent').factory('HostBrowserService', [
'Browse', 'Upload', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$q', 'StateManager', 'Browse',
'Upload',
'API_ENDPOINT_ENDPOINTS',
'EndpointProvider',
'$q',
'StateManager',
function HostBrowserServiceFactory(Browse, Upload, API_ENDPOINT_ENDPOINTS, EndpointProvider, $q, StateManager) { function HostBrowserServiceFactory(Browse, Upload, API_ENDPOINT_ENDPOINTS, EndpointProvider, $q, StateManager) {
var service = {}; var service = {};
@ -24,7 +29,7 @@ angular.module('portainer.agent').factory('HostBrowserService', [
function rename(path, newPath) { function rename(path, newPath) {
var payload = { var payload = {
CurrentFilePath: path, CurrentFilePath: path,
NewFilePath: newPath NewFilePath: newPath,
}; };
return Browse.rename({}, payload).$promise; return Browse.rename({}, payload).$promise;
} }
@ -32,21 +37,15 @@ angular.module('portainer.agent').factory('HostBrowserService', [
function upload(path, file, onProgress) { function upload(path, file, onProgress) {
var deferred = $q.defer(); var deferred = $q.defer();
var agentVersion = StateManager.getAgentApiVersion(); var agentVersion = StateManager.getAgentApiVersion();
var url = var url = API_ENDPOINT_ENDPOINTS + '/' + EndpointProvider.endpointID() + '/docker' + (agentVersion > 1 ? '/v' + agentVersion : '') + '/browse/put';
API_ENDPOINT_ENDPOINTS +
'/' +
EndpointProvider.endpointID() +
'/docker' +
(agentVersion > 1 ? '/v' + agentVersion : '') +
'/browse/put';
Upload.upload({ Upload.upload({
url: url, url: url,
data: { file: file, Path: path } data: { file: file, Path: path },
}).then(deferred.resolve, deferred.reject, onProgress); }).then(deferred.resolve, deferred.reject, onProgress);
return deferred.promise; return deferred.promise;
} }
return service; return service;
} },
]); ]);

2
app/agent/services/pingService.js
View File

@ -10,5 +10,5 @@ angular.module('portainer.agent').service('AgentPingService', [
} }
return service; return service;
} },
]); ]);

33
app/agent/services/volumeBrowserService.js
View File

@ -1,5 +1,11 @@
angular.module('portainer.agent').factory('VolumeBrowserService', [ angular.module('portainer.agent').factory('VolumeBrowserService', [
'StateManager', 'Browse', 'BrowseVersion1', '$q', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', 'Upload', 'StateManager',
'Browse',
'BrowseVersion1',
'$q',
'API_ENDPOINT_ENDPOINTS',
'EndpointProvider',
'Upload',
function VolumeBrowserServiceFactory(StateManager, Browse, BrowseVersion1, $q, API_ENDPOINT_ENDPOINTS, EndpointProvider, Upload) { function VolumeBrowserServiceFactory(StateManager, Browse, BrowseVersion1, $q, API_ENDPOINT_ENDPOINTS, EndpointProvider, Upload) {
'use strict'; 'use strict';
var service = {}; var service = {};
@ -14,22 +20,22 @@ angular.module('portainer.agent').factory('VolumeBrowserService', [
return agentVersion > 1 ? Browse : BrowseVersion1; return agentVersion > 1 ? Browse : BrowseVersion1;
} }
service.ls = function(volumeId, path) { service.ls = function (volumeId, path) {
return getBrowseService().ls({ volumeID: volumeId, path: path, version: getAgentApiVersion() }).$promise; return getBrowseService().ls({ volumeID: volumeId, path: path, version: getAgentApiVersion() }).$promise;
}; };
service.get = function(volumeId, path) { service.get = function (volumeId, path) {
return getBrowseService().get({ volumeID: volumeId, path: path, version: getAgentApiVersion() }).$promise; return getBrowseService().get({ volumeID: volumeId, path: path, version: getAgentApiVersion() }).$promise;
}; };
service.delete = function(volumeId, path) { service.delete = function (volumeId, path) {
return getBrowseService().delete({ volumeID: volumeId, path: path, version: getAgentApiVersion() }).$promise; return getBrowseService().delete({ volumeID: volumeId, path: path, version: getAgentApiVersion() }).$promise;
}; };
service.rename = function(volumeId, path, newPath) { service.rename = function (volumeId, path, newPath) {
var payload = { var payload = {
CurrentFilePath: path, CurrentFilePath: path,
NewFilePath: newPath NewFilePath: newPath,
}; };
return getBrowseService().rename({ volumeID: volumeId, version: getAgentApiVersion() }, payload).$promise; return getBrowseService().rename({ volumeID: volumeId, version: getAgentApiVersion() }, payload).$promise;
}; };
@ -37,26 +43,19 @@ angular.module('portainer.agent').factory('VolumeBrowserService', [
service.upload = function upload(path, file, volumeId, onProgress) { service.upload = function upload(path, file, volumeId, onProgress) {
var deferred = $q.defer(); var deferred = $q.defer();
var agentVersion = StateManager.getAgentApiVersion(); var agentVersion = StateManager.getAgentApiVersion();
if (agentVersion <2) { if (agentVersion < 2) {
deferred.reject('upload is not supported on this agent version'); deferred.reject('upload is not supported on this agent version');
return; return;
} }
var url = var url = API_ENDPOINT_ENDPOINTS + '/' + EndpointProvider.endpointID() + '/docker' + '/v' + agentVersion + '/browse/put?volumeID=' + volumeId;
API_ENDPOINT_ENDPOINTS +
'/' +
EndpointProvider.endpointID() +
'/docker' +
'/v' + agentVersion +
'/browse/put?volumeID=' +
volumeId;
Upload.upload({ Upload.upload({
url: url, url: url,
data: { file: file, Path: path } data: { file: file, Path: path },
}).then(deferred.resolve, deferred.reject, onProgress); }).then(deferred.resolve, deferred.reject, onProgress);
return deferred.promise; return deferred.promise;
}; };
return service; return service;
} },
]); ]);

77
app/app.js
View File

@ -1,46 +1,55 @@
import $ from 'jquery'; import $ from 'jquery';
import '@babel/polyfill' import '@babel/polyfill';
angular.module('portainer') angular.module('portainer').run([
.run(['$rootScope', '$state', '$interval', 'LocalStorage', 'EndpointProvider', 'SystemService', 'cfpLoadingBar', '$transitions', 'HttpRequestHelper', '$rootScope',
function ($rootScope, $state, $interval, LocalStorage, EndpointProvider, SystemService, cfpLoadingBar, $transitions, HttpRequestHelper) { '$state',
'use strict'; '$interval',
'LocalStorage',
'EndpointProvider',
'SystemService',
'cfpLoadingBar',
'$transitions',
'HttpRequestHelper',
function ($rootScope, $state, $interval, LocalStorage, EndpointProvider, SystemService, cfpLoadingBar, $transitions, HttpRequestHelper) {
'use strict';
EndpointProvider.initialize(); EndpointProvider.initialize();
$rootScope.$state = $state; $rootScope.$state = $state;
// Workaround to prevent the loading bar from going backward // Workaround to prevent the loading bar from going backward
// https://github.com/chieffancypants/angular-loading-bar/issues/273 // https://github.com/chieffancypants/angular-loading-bar/issues/273
var originalSet = cfpLoadingBar.set; var originalSet = cfpLoadingBar.set;
cfpLoadingBar.set = function overrideSet(n) { cfpLoadingBar.set = function overrideSet(n) {
if (n > cfpLoadingBar.status()) { if (n > cfpLoadingBar.status()) {
originalSet.apply(cfpLoadingBar, arguments); originalSet.apply(cfpLoadingBar, arguments);
} }
}; };
$transitions.onBefore({}, function() { $transitions.onBefore({}, function () {
HttpRequestHelper.resetAgentHeaders(); HttpRequestHelper.resetAgentHeaders();
}); });
$state.defaultErrorHandler(function() { $state.defaultErrorHandler(function () {
// Do not log transitionTo errors // Do not log transitionTo errors
}); });
// Keep-alive Edge endpoints by sending a ping request every minute // Keep-alive Edge endpoints by sending a ping request every minute
$interval(function() { $interval(function () {
ping(EndpointProvider, SystemService); ping(EndpointProvider, SystemService);
}, 60 * 1000) }, 60 * 1000);
$(document).ajaxSend(function (event, jqXhr, jqOpts) { $(document).ajaxSend(function (event, jqXhr, jqOpts) {
const type = jqOpts.type === 'POST' || jqOpts.type === 'PUT' || jqOpts.type === 'PATCH'; const type = jqOpts.type === 'POST' || jqOpts.type === 'PUT' || jqOpts.type === 'PATCH';
const hasNoContentType = jqOpts.contentType !== 'application/json' && jqOpts.headers && !jqOpts.headers['Content-Type']; const hasNoContentType = jqOpts.contentType !== 'application/json' && jqOpts.headers && !jqOpts.headers['Content-Type'];
if (type && hasNoContentType) { if (type && hasNoContentType) {
jqXhr.setRequestHeader('Content-Type', 'application/json'); jqXhr.setRequestHeader('Content-Type', 'application/json');
} }
jqXhr.setRequestHeader('Authorization', 'Bearer ' + LocalStorage.getJWT()); jqXhr.setRequestHeader('Authorization', 'Bearer ' + LocalStorage.getJWT());
}); });
}]); },
]);
function ping(EndpointProvider, SystemService) { function ping(EndpointProvider, SystemService) {
let endpoint = EndpointProvider.currentEndpoint(); let endpoint = EndpointProvider.currentEndpoint();

90
app/azure/_module.js
View File

@ -1,49 +1,51 @@
angular.module('portainer.azure', ['portainer.app']) angular.module('portainer.azure', ['portainer.app']).config([
.config(['$stateRegistryProvider', function ($stateRegistryProvider) { '$stateRegistryProvider',
'use strict'; function ($stateRegistryProvider) {
'use strict';
var azure = { var azure = {
name: 'azure', name: 'azure',
url: '/azure', url: '/azure',
parent: 'root', parent: 'root',
abstract: true abstract: true,
}; };
var containerInstances = { var containerInstances = {
name: 'azure.containerinstances', name: 'azure.containerinstances',
url: '/containerinstances', url: '/containerinstances',
views: { views: {
'content@': { 'content@': {
templateUrl: './views/containerinstances/containerinstances.html', templateUrl: './views/containerinstances/containerinstances.html',
controller: 'AzureContainerInstancesController' controller: 'AzureContainerInstancesController',
} },
} },
}; };
var containerInstanceCreation = { var containerInstanceCreation = {
name: 'azure.containerinstances.new', name: 'azure.containerinstances.new',
url: '/new/', url: '/new/',
views: { views: {
'content@': { 'content@': {
templateUrl: './views/containerinstances/create/createcontainerinstance.html', templateUrl: './views/containerinstances/create/createcontainerinstance.html',
controller: 'AzureCreateContainerInstanceController' controller: 'AzureCreateContainerInstanceController',
} },
} },
}; };
var dashboard = { var dashboard = {
name: 'azure.dashboard', name: 'azure.dashboard',
url: '/dashboard', url: '/dashboard',
views: { views: {
'content@': { 'content@': {
templateUrl: './views/dashboard/dashboard.html', templateUrl: './views/dashboard/dashboard.html',
controller: 'AzureDashboardController' controller: 'AzureDashboardController',
} },
} },
}; };
$stateRegistryProvider.register(azure); $stateRegistryProvider.register(azure);
$stateRegistryProvider.register(containerInstances); $stateRegistryProvider.register(containerInstances);
$stateRegistryProvider.register(containerInstanceCreation); $stateRegistryProvider.register(containerInstanceCreation);
$stateRegistryProvider.register(dashboard); $stateRegistryProvider.register(dashboard);
}]); },
]);

4
app/azure/components/azure-endpoint-config/azure-endpoint-config.js
View File

@ -2,7 +2,7 @@ angular.module('portainer.azure').component('azureEndpointConfig', {
bindings: { bindings: {
applicationId: '=', applicationId: '=',
tenantId: '=', tenantId: '=',
authenticationKey: '=' authenticationKey: '=',
}, },
templateUrl: './azureEndpointConfig.html' templateUrl: './azureEndpointConfig.html',
}); });

13
app/azure/components/azure-endpoint-config/azureEndpointConfig.html
View File

@ -6,7 +6,7 @@
<div class="form-group"> <div class="form-group">
<label for="azure_credential_appid" class="col-sm-3 col-lg-2 control-label text-left">Application ID</label> <label for="azure_credential_appid" class="col-sm-3 col-lg-2 control-label text-left">Application ID</label>
<div class="col-sm-9 col-lg-10"> <div class="col-sm-9 col-lg-10">
<input type="text" class="form-control" name="azure_credential_appid" ng-model="$ctrl.applicationId" placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" required> <input type="text" class="form-control" name="azure_credential_appid" ng-model="$ctrl.applicationId" placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" required />
</div> </div>
</div> </div>
<!-- !applicationId-input --> <!-- !applicationId-input -->
@ -14,7 +14,7 @@
<div class="form-group"> <div class="form-group">
<label for="azure_credential_tenantid" class="col-sm-3 col-lg-2 control-label text-left">Tenant ID</label> <label for="azure_credential_tenantid" class="col-sm-3 col-lg-2 control-label text-left">Tenant ID</label>
<div class="col-sm-9 col-lg-10"> <div class="col-sm-9 col-lg-10">
<input type="text" class="form-control" name="azure_credential_tenantid" ng-model="$ctrl.tenantId" placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" required> <input type="text" class="form-control" name="azure_credential_tenantid" ng-model="$ctrl.tenantId" placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" required />
</div> </div>
</div> </div>
<!-- !tenantId-input --> <!-- !tenantId-input -->
@ -22,7 +22,14 @@
<div class="form-group"> <div class="form-group">
<label for="azure_credential_authkey" class="col-sm-3 col-lg-2 control-label text-left">Authentication key</label> <label for="azure_credential_authkey" class="col-sm-3 col-lg-2 control-label text-left">Authentication key</label>
<div class="col-sm-9 col-lg-10"> <div class="col-sm-9 col-lg-10">
<input type="text" class="form-control" name="azure_credential_authkey" ng-model="$ctrl.authenticationKey" placeholder="cOrXoK/1D35w8YQ8nH1/8ZGwzz45JIYD5jxHKXEQknk=" required> <input
type="text"
class="form-control"
name="azure_credential_authkey"
ng-model="$ctrl.authenticationKey"
placeholder="cOrXoK/1D35w8YQ8nH1/8ZGwzz45JIYD5jxHKXEQknk="
required
/>
</div> </div>
</div> </div>
<!-- !authenticationkey-input --> <!-- !authenticationkey-input -->

2
app/azure/components/azure-sidebar-content/azure-sidebar-content.js
View File

@ -1,3 +1,3 @@
angular.module('portainer.azure').component('azureSidebarContent', { angular.module('portainer.azure').component('azureSidebarContent', {
templateUrl: './azureSidebarContent.html' templateUrl: './azureSidebarContent.html',
}); });

32
app/azure/components/datatables/containergroups-datatable/containerGroupsDatatable.html
View File

@ -2,13 +2,10 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
</div> </div>
<div class="actionBar"> <div class="actionBar">
<button type="button" class="btn btn-sm btn-danger" <button type="button" class="btn btn-sm btn-danger" ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)">
ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)">
<i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove <i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove
</button> </button>
<button type="button" class="btn btn-sm btn-primary" ui-sref="azure.containerinstances.new"> <button type="button" class="btn btn-sm btn-primary" ui-sref="azure.containerinstances.new">
@ -17,7 +14,15 @@
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover table-filters nowrap-cells"> <table class="table table-hover table-filters nowrap-cells">
@ -47,20 +52,23 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td> <td>
<span class="md-checkbox"> <span class="md-checkbox">
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)"/> <input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)" />
<label for="select_{{ $index }}"></label> <label for="select_{{ $index }}"></label>
</span> </span>
<a ui-sref="azure.containerinstances.container({ id: item.Id })">{{ item.Name | truncate:50 }}</a> <a ui-sref="azure.containerinstances.container({ id: item.Id })">{{ item.Name | truncate: 50 }}</a>
</td> </td>
<td>{{ item.Location }}</td> <td>{{ item.Location }}</td>
<td> <td>
<a ng-if="item.Ports.length > 0" ng-repeat="p in item.Ports" class="image-tag" ng-href="http://{{ item.IPAddress }}:{{ p.port }}" target="_blank"> <a ng-if="item.Ports.length > 0" ng-repeat="p in item.Ports" class="image-tag" ng-href="http://{{ item.IPAddress }}:{{ p.port }}" target="_blank">
<i class="fa fa-external-link-alt" aria-hidden="true"></i> :{{ p.port }} <i class="fa fa-external-link-alt" aria-hidden="true"></i> :{{ p.port }}
</a> </a>
<span ng-if="item.Ports.length == 0" >-</span> <span ng-if="item.Ports.length == 0">-</span>
</td> </td>
</tr> </tr>
<tr ng-if="!$ctrl.dataset"> <tr ng-if="!$ctrl.dataset">
@ -73,9 +81,7 @@
</table> </table>
</div> </div>
<div class="footer" ng-if="$ctrl.dataset"> <div class="footer" ng-if="$ctrl.dataset">
<div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> <div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> {{ $ctrl.state.selectedItemCount }} item(s) selected </div>
{{ $ctrl.state.selectedItemCount }} item(s) selected
</div>
<div class="paginationControls"> <div class="paginationControls">
<form class="form-inline"> <form class="form-inline">
<span class="limitSelector"> <span class="limitSelector">

4
app/azure/components/datatables/containergroups-datatable/containerGroupsDatatable.js
View File

@ -8,6 +8,6 @@ angular.module('portainer.azure').component('containergroupsDatatable', {
tableKey: '@', tableKey: '@',
orderBy: '@', orderBy: '@',
reverseOrder: '<', reverseOrder: '<',
removeAction: '<' removeAction: '<',
} },
}); });

24
app/azure/models/container_group.js
View File

@ -8,8 +8,8 @@ export function ContainerGroupDefaultModel() {
{ {
container: 80, container: 80,
host: 80, host: 80,
protocol: 'TCP' protocol: 'TCP',
} },
]; ];
this.CPU = 1; this.CPU = 1;
this.Memory = 1; this.Memory = 1;
@ -32,12 +32,12 @@ export function CreateContainerGroupRequest(model) {
var binding = model.Ports[i]; var binding = model.Ports[i];
containerPorts.push({ containerPorts.push({
port: binding.container port: binding.container,
}); });
addressPorts.push({ addressPorts.push({
port: binding.host, port: binding.host,
protocol: binding.protocol protocol: binding.protocol,
}); });
} }
@ -52,15 +52,15 @@ export function CreateContainerGroupRequest(model) {
resources: { resources: {
requests: { requests: {
cpu: model.CPU, cpu: model.CPU,
memoryInGB: model.Memory memoryInGB: model.Memory,
} },
} },
} },
} },
], ],
ipAddress: { ipAddress: {
type: model.AllocatePublicIP ? 'Public': 'Private', type: model.AllocatePublicIP ? 'Public' : 'Private',
ports: addressPorts ports: addressPorts,
} },
}; };
} }

2
app/azure/models/provider.js
View File

@ -4,6 +4,6 @@ export function ContainerInstanceProviderViewModel(data) {
this.Id = data.id; this.Id = data.id;
this.Namespace = data.namespace; this.Namespace = data.namespace;
var containerGroupType = _.find(data.resourceTypes, { 'resourceType': 'containerGroups' }); var containerGroupType = _.find(data.resourceTypes, { resourceType: 'containerGroups' });
this.Locations = containerGroupType.locations; this.Locations = containerGroupType.locations;
} }

31
app/azure/rest/azure.js
View File

@ -1,17 +1,20 @@
angular.module('portainer.azure') angular.module('portainer.azure').factory('Azure', [
.factory('Azure', ['$http', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$http',
function AzureFactory($http, API_ENDPOINT_ENDPOINTS, EndpointProvider) { 'API_ENDPOINT_ENDPOINTS',
'use strict'; 'EndpointProvider',
function AzureFactory($http, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'use strict';
var service = {}; var service = {};
service.delete = function(id, apiVersion) { service.delete = function (id, apiVersion) {
var url = API_ENDPOINT_ENDPOINTS + '/' + EndpointProvider.endpointID() + '/azure' + id + '?api-version=' + apiVersion; var url = API_ENDPOINT_ENDPOINTS + '/' + EndpointProvider.endpointID() + '/azure' + id + '?api-version=' + apiVersion;
return $http({ return $http({
method: 'DELETE', method: 'DELETE',
url: url url: url,
}); });
}; };
return service; return service;
}]); },
]);

76
app/azure/rest/container_group.js
View File

@ -1,41 +1,45 @@
angular.module('portainer.azure') angular.module('portainer.azure').factory('ContainerGroup', [
.factory('ContainerGroup', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$resource',
function ContainerGroupFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) { 'API_ENDPOINT_ENDPOINTS',
'use strict'; 'EndpointProvider',
function ContainerGroupFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'use strict';
var resource = {}; var resource = {};
var base = $resource( var base = $resource(
API_ENDPOINT_ENDPOINTS +'/:endpointId/azure/subscriptions/:subscriptionId/providers/Microsoft.ContainerInstance/containerGroups', API_ENDPOINT_ENDPOINTS + '/:endpointId/azure/subscriptions/:subscriptionId/providers/Microsoft.ContainerInstance/containerGroups',
{ {
'endpointId': EndpointProvider.endpointID, endpointId: EndpointProvider.endpointID,
'api-version': '2018-04-01' 'api-version': '2018-04-01',
}, },
{ {
query: { method: 'GET', params: { subscriptionId: '@subscriptionId' } } query: { method: 'GET', params: { subscriptionId: '@subscriptionId' } },
}
);
var withResourceGroup = $resource(
API_ENDPOINT_ENDPOINTS +'/:endpointId/azure/subscriptions/:subscriptionId/resourceGroups/:resourceGroupName/providers/Microsoft.ContainerInstance/containerGroups/:containerGroupName',
{
'endpointId': EndpointProvider.endpointID,
'api-version': '2018-04-01'
},
{
create: {
method: 'PUT',
params: {
subscriptionId: '@subscriptionId',
resourceGroupName: '@resourceGroupName',
containerGroupName: '@containerGroupName'
}
} }
} );
);
resource.query = base.query; var withResourceGroup = $resource(
resource.create = withResourceGroup.create; API_ENDPOINT_ENDPOINTS +
'/:endpointId/azure/subscriptions/:subscriptionId/resourceGroups/:resourceGroupName/providers/Microsoft.ContainerInstance/containerGroups/:containerGroupName',
{
endpointId: EndpointProvider.endpointID,
'api-version': '2018-04-01',
},
{
create: {
method: 'PUT',
params: {
subscriptionId: '@subscriptionId',
resourceGroupName: '@resourceGroupName',
containerGroupName: '@containerGroupName',
},
},
}
);
return resource; resource.query = base.query;
}]); resource.create = withResourceGroup.create;
return resource;
},
]);

28
app/azure/rest/location.js
View File

@ -1,12 +1,18 @@
angular.module('portainer.azure') angular.module('portainer.azure').factory('Location', [
.factory('Location', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$resource',
function LocationFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) { 'API_ENDPOINT_ENDPOINTS',
'use strict'; 'EndpointProvider',
return $resource(API_ENDPOINT_ENDPOINTS +'/:endpointId/azure/subscriptions/:subscriptionId/locations', { function LocationFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'endpointId': EndpointProvider.endpointID, 'use strict';
'api-version': '2016-06-01' return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/azure/subscriptions/:subscriptionId/locations',
{
endpointId: EndpointProvider.endpointID,
'api-version': '2016-06-01',
},
{
query: { method: 'GET', params: { subscriptionId: '@subscriptionId' } },
}
);
}, },
{ ]);
query: { method: 'GET', params: { subscriptionId: '@subscriptionId' } }
});
}]);

28
app/azure/rest/provider.js
View File

@ -1,12 +1,18 @@
angular.module('portainer.azure') angular.module('portainer.azure').factory('Provider', [
.factory('Provider', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$resource',
function ProviderFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) { 'API_ENDPOINT_ENDPOINTS',
'use strict'; 'EndpointProvider',
return $resource(API_ENDPOINT_ENDPOINTS +'/:endpointId/azure/subscriptions/:subscriptionId/providers/:providerNamespace', { function ProviderFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'endpointId': EndpointProvider.endpointID, 'use strict';
'api-version': '2018-02-01' return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/azure/subscriptions/:subscriptionId/providers/:providerNamespace',
{
endpointId: EndpointProvider.endpointID,
'api-version': '2018-02-01',
},
{
get: { method: 'GET', params: { subscriptionId: '@subscriptionId', providerNamespace: '@providerNamespace' } },
}
);
}, },
{ ]);
get: { method: 'GET', params: { subscriptionId: '@subscriptionId', providerNamespace: '@providerNamespace' } }
});
}]);

28
app/azure/rest/resource_group.js
View File

@ -1,12 +1,18 @@
angular.module('portainer.azure') angular.module('portainer.azure').factory('ResourceGroup', [
.factory('ResourceGroup', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$resource',
function ResourceGroupFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) { 'API_ENDPOINT_ENDPOINTS',
'use strict'; 'EndpointProvider',
return $resource(API_ENDPOINT_ENDPOINTS +'/:endpointId/azure/subscriptions/:subscriptionId/resourcegroups', { function ResourceGroupFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'endpointId': EndpointProvider.endpointID, 'use strict';
'api-version': '2018-02-01' return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/azure/subscriptions/:subscriptionId/resourcegroups',
{
endpointId: EndpointProvider.endpointID,
'api-version': '2018-02-01',
},
{
query: { method: 'GET', params: { subscriptionId: '@subscriptionId' } },
}
);
}, },
{ ]);
query: { method: 'GET', params: { subscriptionId: '@subscriptionId' } }
});
}]);

28
app/azure/rest/subscription.js
View File

@ -1,12 +1,18 @@
angular.module('portainer.azure') angular.module('portainer.azure').factory('Subscription', [
.factory('Subscription', ['$resource', 'API_ENDPOINT_ENDPOINTS', 'EndpointProvider', '$resource',
function SubscriptionFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) { 'API_ENDPOINT_ENDPOINTS',
'use strict'; 'EndpointProvider',
return $resource(API_ENDPOINT_ENDPOINTS + '/:endpointId/azure/subscriptions', { function SubscriptionFactory($resource, API_ENDPOINT_ENDPOINTS, EndpointProvider) {
'endpointId': EndpointProvider.endpointID, 'use strict';
'api-version': '2016-06-01' return $resource(
API_ENDPOINT_ENDPOINTS + '/:endpointId/azure/subscriptions',
{
endpointId: EndpointProvider.endpointID,
'api-version': '2016-06-01',
},
{
query: { method: 'GET' },
}
);
}, },
{ ]);
query: { method: 'GET' }
});
}]);

114
app/azure/services/azureService.js
View File

@ -1,66 +1,72 @@
angular.module('portainer.azure') angular.module('portainer.azure').factory('AzureService', [
.factory('AzureService', ['$q', 'Azure', 'SubscriptionService', 'ResourceGroupService', 'ContainerGroupService', 'ProviderService', '$q',
function AzureServiceFactory($q, Azure, SubscriptionService, ResourceGroupService, ContainerGroupService, ProviderService) { 'Azure',
'use strict'; 'SubscriptionService',
var service = {}; 'ResourceGroupService',
'ContainerGroupService',
'ProviderService',
function AzureServiceFactory($q, Azure, SubscriptionService, ResourceGroupService, ContainerGroupService, ProviderService) {
'use strict';
var service = {};
service.deleteContainerGroup = function(id) { service.deleteContainerGroup = function (id) {
return Azure.delete(id, '2018-04-01'); return Azure.delete(id, '2018-04-01');
}; };
service.createContainerGroup = function(model, subscriptionId, resourceGroupName) { service.createContainerGroup = function (model, subscriptionId, resourceGroupName) {
return ContainerGroupService.create(model, subscriptionId, resourceGroupName); return ContainerGroupService.create(model, subscriptionId, resourceGroupName);
}; };
service.subscriptions = function() { service.subscriptions = function () {
return SubscriptionService.subscriptions(); return SubscriptionService.subscriptions();
}; };
service.containerInstanceProvider = function(subscriptions) { service.containerInstanceProvider = function (subscriptions) {
return retrieveResourcesForEachSubscription(subscriptions, ProviderService.containerInstanceProvider); return retrieveResourcesForEachSubscription(subscriptions, ProviderService.containerInstanceProvider);
}; };
service.resourceGroups = function(subscriptions) { service.resourceGroups = function (subscriptions) {
return retrieveResourcesForEachSubscription(subscriptions, ResourceGroupService.resourceGroups); return retrieveResourcesForEachSubscription(subscriptions, ResourceGroupService.resourceGroups);
}; };
service.containerGroups = function(subscriptions) { service.containerGroups = function (subscriptions) {
return retrieveResourcesForEachSubscription(subscriptions, ContainerGroupService.containerGroups); return retrieveResourcesForEachSubscription(subscriptions, ContainerGroupService.containerGroups);
}; };
service.aggregate = function(resourcesBySubcription) { service.aggregate = function (resourcesBySubcription) {
var aggregatedResources = []; var aggregatedResources = [];
Object.keys(resourcesBySubcription).forEach(function(key) { Object.keys(resourcesBySubcription).forEach(function (key) {
aggregatedResources = aggregatedResources.concat(resourcesBySubcription[key]); aggregatedResources = aggregatedResources.concat(resourcesBySubcription[key]);
}); });
return aggregatedResources; return aggregatedResources;
}; };
function retrieveResourcesForEachSubscription(subscriptions, resourceQuery) { function retrieveResourcesForEachSubscription(subscriptions, resourceQuery) {
var deferred = $q.defer(); var deferred = $q.defer();
var resources = {}; var resources = {};
var resourceQueries = []; var resourceQueries = [];
for (var i = 0; i < subscriptions.length; i++) { for (var i = 0; i < subscriptions.length; i++) {
var subscription = subscriptions[i]; var subscription = subscriptions[i];
resourceQueries.push(resourceQuery(subscription.Id)); resourceQueries.push(resourceQuery(subscription.Id));
}
$q.all(resourceQueries)
.then(function success(data) {
for (var i = 0; i < data.length; i++) {
var result = data[i];
resources[subscriptions[i].Id] = result;
}
deferred.resolve(resources);
})
.catch(function error(err) {
deferred.reject({ msg: 'Unable to retrieve resources', err: err });
});
return deferred.promise;
} }
$q.all(resourceQueries) return service;
.then(function success(data) { },
for (var i = 0; i < data.length; i++) { ]);
var result = data[i];
resources[subscriptions[i].Id] = result;
}
deferred.resolve(resources);
})
.catch(function error(err) {
deferred.reject({ msg: 'Unable to retrieve resources', err: err });
});
return deferred.promise;
}
return service;
}]);

62
app/azure/services/containerGroupService.js
View File

@ -1,35 +1,41 @@
import { ContainerGroupViewModel, CreateContainerGroupRequest } from '../models/container_group'; import { ContainerGroupViewModel, CreateContainerGroupRequest } from '../models/container_group';
angular.module('portainer.azure') angular.module('portainer.azure').factory('ContainerGroupService', [
.factory('ContainerGroupService', ['$q', 'ContainerGroup', function ContainerGroupServiceFactory($q, ContainerGroup) { '$q',
'use strict'; 'ContainerGroup',
var service = {}; function ContainerGroupServiceFactory($q, ContainerGroup) {
'use strict';
var service = {};
service.containerGroups = function(subscriptionId) { service.containerGroups = function (subscriptionId) {
var deferred = $q.defer(); var deferred = $q.defer();
ContainerGroup.query({ subscriptionId: subscriptionId }).$promise ContainerGroup.query({ subscriptionId: subscriptionId })
.then(function success(data) { .$promise.then(function success(data) {
var containerGroups = data.value.map(function (item) { var containerGroups = data.value.map(function (item) {
return new ContainerGroupViewModel(item); return new ContainerGroupViewModel(item);
}); });
deferred.resolve(containerGroups); deferred.resolve(containerGroups);
}) })
.catch(function error(err) { .catch(function error(err) {
deferred.reject({ msg: 'Unable to retrieve container groups', err: err }); deferred.reject({ msg: 'Unable to retrieve container groups', err: err });
}); });
return deferred.promise; return deferred.promise;
}; };
service.create = function(model, subscriptionId, resourceGroupName) { service.create = function (model, subscriptionId, resourceGroupName) {
var payload = new CreateContainerGroupRequest(model); var payload = new CreateContainerGroupRequest(model);
return ContainerGroup.create({ return ContainerGroup.create(
subscriptionId: subscriptionId, {
resourceGroupName: resourceGroupName, subscriptionId: subscriptionId,
containerGroupName: model.Name resourceGroupName: resourceGroupName,
}, payload).$promise; containerGroupName: model.Name,
}; },
payload
).$promise;
};
return service; return service;
}]); },
]);

43
app/azure/services/locationService.js
View File

@ -1,26 +1,29 @@
import { LocationViewModel } from '../models/location'; import { LocationViewModel } from '../models/location';
angular.module('portainer.azure') angular.module('portainer.azure').factory('LocationService', [
.factory('LocationService', ['$q', 'Location', function LocationServiceFactory($q, Location) { '$q',
'use strict'; 'Location',
var service = {}; function LocationServiceFactory($q, Location) {
'use strict';
var service = {};
service.locations = function(subscriptionId) { service.locations = function (subscriptionId) {
var deferred = $q.defer(); var deferred = $q.defer();
Location.query({ subscriptionId: subscriptionId }).$promise Location.query({ subscriptionId: subscriptionId })
.then(function success(data) { .$promise.then(function success(data) {
var locations = data.value.map(function (item) { var locations = data.value.map(function (item) {
return new LocationViewModel(item); return new LocationViewModel(item);
}); });
deferred.resolve(locations); deferred.resolve(locations);
}) })
.catch(function error(err) { .catch(function error(err) {
deferred.reject({ msg: 'Unable to retrieve locations', err: err }); deferred.reject({ msg: 'Unable to retrieve locations', err: err });
}); });
return deferred.promise; return deferred.promise;
}; };
return service; return service;
}]); },
]);

39
app/azure/services/providerService.js
View File

@ -1,24 +1,27 @@
import { ContainerInstanceProviderViewModel } from '../models/provider'; import { ContainerInstanceProviderViewModel } from '../models/provider';
angular.module('portainer.azure') angular.module('portainer.azure').factory('ProviderService', [
.factory('ProviderService', ['$q', 'Provider', function ProviderServiceFactory($q, Provider) { '$q',
'use strict'; 'Provider',
var service = {}; function ProviderServiceFactory($q, Provider) {
'use strict';
var service = {};
service.containerInstanceProvider = function(subscriptionId) { service.containerInstanceProvider = function (subscriptionId) {
var deferred = $q.defer(); var deferred = $q.defer();
Provider.get({ subscriptionId: subscriptionId, providerNamespace: 'Microsoft.ContainerInstance' }).$promise Provider.get({ subscriptionId: subscriptionId, providerNamespace: 'Microsoft.ContainerInstance' })
.then(function success(data) { .$promise.then(function success(data) {
var provider = new ContainerInstanceProviderViewModel(data); var provider = new ContainerInstanceProviderViewModel(data);
deferred.resolve(provider); deferred.resolve(provider);
}) })
.catch(function error(err) { .catch(function error(err) {
deferred.reject({ msg: 'Unable to retrieve provider', err: err }); deferred.reject({ msg: 'Unable to retrieve provider', err: err });
}); });
return deferred.promise; return deferred.promise;
}; };
return service; return service;
}]); },
]);

43
app/azure/services/resourceGroupService.js
View File

@ -1,26 +1,29 @@
import { ResourceGroupViewModel } from '../models/resource_group'; import { ResourceGroupViewModel } from '../models/resource_group';
angular.module('portainer.azure') angular.module('portainer.azure').factory('ResourceGroupService', [
.factory('ResourceGroupService', ['$q', 'ResourceGroup', function ResourceGroupServiceFactory($q, ResourceGroup) { '$q',
'use strict'; 'ResourceGroup',
var service = {}; function ResourceGroupServiceFactory($q, ResourceGroup) {
'use strict';
var service = {};
service.resourceGroups = function(subscriptionId) { service.resourceGroups = function (subscriptionId) {
var deferred = $q.defer(); var deferred = $q.defer();
ResourceGroup.query({ subscriptionId: subscriptionId }).$promise ResourceGroup.query({ subscriptionId: subscriptionId })
.then(function success(data) { .$promise.then(function success(data) {
var resourceGroups = data.value.map(function (item) { var resourceGroups = data.value.map(function (item) {
return new ResourceGroupViewModel(item, subscriptionId); return new ResourceGroupViewModel(item, subscriptionId);
}); });
deferred.resolve(resourceGroups); deferred.resolve(resourceGroups);
}) })
.catch(function error(err) { .catch(function error(err) {
deferred.reject({ msg: 'Unable to retrieve resource groups', err: err }); deferred.reject({ msg: 'Unable to retrieve resource groups', err: err });
}); });
return deferred.promise; return deferred.promise;
}; };
return service; return service;
}]); },
]);

43
app/azure/services/subscriptionService.js
View File

@ -1,26 +1,29 @@
import { SubscriptionViewModel } from '../models/subscription'; import { SubscriptionViewModel } from '../models/subscription';
angular.module('portainer.azure') angular.module('portainer.azure').factory('SubscriptionService', [
.factory('SubscriptionService', ['$q', 'Subscription', function SubscriptionServiceFactory($q, Subscription) { '$q',
'use strict'; 'Subscription',
var service = {}; function SubscriptionServiceFactory($q, Subscription) {
'use strict';
var service = {};
service.subscriptions = function() { service.subscriptions = function () {
var deferred = $q.defer(); var deferred = $q.defer();
Subscription.query({}).$promise Subscription.query({})
.then(function success(data) { .$promise.then(function success(data) {
var subscriptions = data.value.map(function (item) { var subscriptions = data.value.map(function (item) {
return new SubscriptionViewModel(item); return new SubscriptionViewModel(item);
}); });
deferred.resolve(subscriptions); deferred.resolve(subscriptions);
}) })
.catch(function error(err) { .catch(function error(err) {
deferred.reject({ msg: 'Unable to retrieve subscriptions', err: err }); deferred.reject({ msg: 'Unable to retrieve subscriptions', err: err });
}); });
return deferred.promise; return deferred.promise;
}; };
return service; return service;
}]); },
]);

79
app/azure/views/containerinstances/containerInstancesController.js
View File

@ -1,41 +1,44 @@
angular.module('portainer.azure') angular.module('portainer.azure').controller('AzureContainerInstancesController', [
.controller('AzureContainerInstancesController', ['$scope', '$state', 'AzureService', 'Notifications', '$scope',
function ($scope, $state, AzureService, Notifications) { '$state',
'AzureService',
'Notifications',
function ($scope, $state, AzureService, Notifications) {
function initView() {
AzureService.subscriptions()
.then(function success(data) {
var subscriptions = data;
return AzureService.containerGroups(subscriptions);
})
.then(function success(data) {
$scope.containerGroups = AzureService.aggregate(data);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to load container groups');
});
}
function initView() { $scope.deleteAction = function (selectedItems) {
AzureService.subscriptions() var actionCount = selectedItems.length;
.then(function success(data) { angular.forEach(selectedItems, function (item) {
var subscriptions = data; AzureService.deleteContainerGroup(item.Id)
return AzureService.containerGroups(subscriptions); .then(function success() {
}) Notifications.success('Container group successfully removed', item.Name);
.then(function success(data) { var index = $scope.containerGroups.indexOf(item);
$scope.containerGroups = AzureService.aggregate(data); $scope.containerGroups.splice(index, 1);
}) })
.catch(function error(err) { .catch(function error(err) {
Notifications.error('Failure', err, 'Unable to load container groups'); Notifications.error('Failure', err, 'Unable to remove container group');
}); })
} .finally(function final() {
--actionCount;
$scope.deleteAction = function (selectedItems) { if (actionCount === 0) {
var actionCount = selectedItems.length; $state.reload();
angular.forEach(selectedItems, function (item) { }
AzureService.deleteContainerGroup(item.Id) });
.then(function success() {
Notifications.success('Container group successfully removed', item.Name);
var index = $scope.containerGroups.indexOf(item);
$scope.containerGroups.splice(index, 1);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to remove container group');
})
.finally(function final() {
--actionCount;
if (actionCount === 0) {
$state.reload();
}
}); });
}); };
};
initView(); initView();
}]); },
]);

10
app/azure/views/containerinstances/containerinstances.html
View File

@ -10,10 +10,12 @@
<div class="row"> <div class="row">
<div class="col-sm-12"> <div class="col-sm-12">
<containergroups-datatable <containergroups-datatable
title-text="Containers" title-icon="fa-server" title-text="Containers"
dataset="containerGroups" table-key="containergroups" title-icon="fa-server"
order-by="Name" dataset="containerGroups"
remove-action="deleteAction" table-key="containergroups"
order-by="Name"
remove-action="deleteAction"
></containergroups-datatable> ></containergroups-datatable>
</div> </div>
</div> </div>

170
app/azure/views/containerinstances/create/createContainerInstanceController.js
View File

@ -1,89 +1,93 @@
import { ContainerGroupDefaultModel } from '../../../models/container_group'; import { ContainerGroupDefaultModel } from '../../../models/container_group';
angular.module('portainer.azure') angular.module('portainer.azure').controller('AzureCreateContainerInstanceController', [
.controller('AzureCreateContainerInstanceController', ['$q', '$scope', '$state', 'AzureService', 'Notifications', '$q',
function ($q, $scope, $state, AzureService, Notifications) { '$scope',
'$state',
'AzureService',
'Notifications',
function ($q, $scope, $state, AzureService, Notifications) {
var allResourceGroups = [];
var allProviders = [];
var allResourceGroups = []; $scope.state = {
var allProviders = []; actionInProgress: false,
selectedSubscription: null,
$scope.state = { selectedResourceGroup: null,
actionInProgress: false, };
selectedSubscription: null,
selectedResourceGroup: null
};
$scope.changeSubscription = function() {
var selectedSubscription = $scope.state.selectedSubscription;
updateResourceGroupsAndLocations(selectedSubscription, allResourceGroups, allProviders);
};
$scope.addPortBinding = function() {
$scope.model.Ports.push({ host: '', container: '', protocol: 'TCP' });
};
$scope.removePortBinding = function(index) {
$scope.model.Ports.splice(index, 1);
};
$scope.create = function() {
var model = $scope.model;
var subscriptionId = $scope.state.selectedSubscription.Id;
var resourceGroupName = $scope.state.selectedResourceGroup.Name;
$scope.state.actionInProgress = true;
AzureService.createContainerGroup(model, subscriptionId, resourceGroupName)
.then(function success() {
Notifications.success('Container successfully created', model.Name);
$state.go('azure.containerinstances');
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to create container');
})
.finally(function final() {
$scope.state.actionInProgress = false;
});
};
function updateResourceGroupsAndLocations(subscription, resourceGroups, providers) {
$scope.state.selectedResourceGroup = resourceGroups[subscription.Id][0];
$scope.resourceGroups = resourceGroups[subscription.Id];
var currentSubLocations = providers[subscription.Id].Locations;
$scope.model.Location = currentSubLocations[0];
$scope.locations = currentSubLocations;
}
function initView() {
var model = new ContainerGroupDefaultModel();
AzureService.subscriptions()
.then(function success(data) {
var subscriptions = data;
$scope.state.selectedSubscription = subscriptions[0];
$scope.subscriptions = subscriptions;
return $q.all({
resourceGroups: AzureService.resourceGroups(subscriptions),
containerInstancesProviders: AzureService.containerInstanceProvider(subscriptions)
});
})
.then(function success(data) {
var resourceGroups = data.resourceGroups;
allResourceGroups = resourceGroups;
var containerInstancesProviders = data.containerInstancesProviders;
allProviders = containerInstancesProviders;
$scope.model = model;
$scope.changeSubscription = function () {
var selectedSubscription = $scope.state.selectedSubscription; var selectedSubscription = $scope.state.selectedSubscription;
updateResourceGroupsAndLocations(selectedSubscription, resourceGroups, containerInstancesProviders); updateResourceGroupsAndLocations(selectedSubscription, allResourceGroups, allProviders);
}) };
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to retrieve Azure resources');
});
}
initView(); $scope.addPortBinding = function () {
}]); $scope.model.Ports.push({ host: '', container: '', protocol: 'TCP' });
};
$scope.removePortBinding = function (index) {
$scope.model.Ports.splice(index, 1);
};
$scope.create = function () {
var model = $scope.model;
var subscriptionId = $scope.state.selectedSubscription.Id;
var resourceGroupName = $scope.state.selectedResourceGroup.Name;
$scope.state.actionInProgress = true;
AzureService.createContainerGroup(model, subscriptionId, resourceGroupName)
.then(function success() {
Notifications.success('Container successfully created', model.Name);
$state.go('azure.containerinstances');
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to create container');
})
.finally(function final() {
$scope.state.actionInProgress = false;
});
};
function updateResourceGroupsAndLocations(subscription, resourceGroups, providers) {
$scope.state.selectedResourceGroup = resourceGroups[subscription.Id][0];
$scope.resourceGroups = resourceGroups[subscription.Id];
var currentSubLocations = providers[subscription.Id].Locations;
$scope.model.Location = currentSubLocations[0];
$scope.locations = currentSubLocations;
}
function initView() {
var model = new ContainerGroupDefaultModel();
AzureService.subscriptions()
.then(function success(data) {
var subscriptions = data;
$scope.state.selectedSubscription = subscriptions[0];
$scope.subscriptions = subscriptions;
return $q.all({
resourceGroups: AzureService.resourceGroups(subscriptions),
containerInstancesProviders: AzureService.containerInstanceProvider(subscriptions),
});
})
.then(function success(data) {
var resourceGroups = data.resourceGroups;
allResourceGroups = resourceGroups;
var containerInstancesProviders = data.containerInstancesProviders;
allProviders = containerInstancesProviders;
$scope.model = model;
var selectedSubscription = $scope.state.selectedSubscription;
updateResourceGroupsAndLocations(selectedSubscription, resourceGroups, containerInstancesProviders);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to retrieve Azure resources');
});
}
initView();
},
]);

35
app/azure/views/containerinstances/create/createcontainerinstance.html
View File

@ -1,8 +1,6 @@
<rd-header> <rd-header>
<rd-header-title title-text="Create container instance"></rd-header-title> <rd-header-title title-text="Create container instance"></rd-header-title>
<rd-header-content> <rd-header-content> <a ui-sref="azure.containerinstances">Container instances</a> &gt; Add container </rd-header-content>
<a ui-sref="azure.containerinstances">Container instances</a> &gt; Add container
</rd-header-content>
</rd-header> </rd-header>
<div class="row"> <div class="row">
@ -17,7 +15,13 @@
<div class="form-group"> <div class="form-group">
<label for="azure_subscription" class="col-sm-1 control-label text-left">Subscription</label> <label for="azure_subscription" class="col-sm-1 control-label text-left">Subscription</label>
<div class="col-sm-11"> <div class="col-sm-11">
<select class="form-control" name="azure_subscription" ng-model="state.selectedSubscription" ng-options="subscription.Name for subscription in subscriptions" ng-change="changeSubscription()"></select> <select
class="form-control"
name="azure_subscription"
ng-model="state.selectedSubscription"
ng-options="subscription.Name for subscription in subscriptions"
ng-change="changeSubscription()"
></select>
</div> </div>
</div> </div>
<!-- !subscription-input --> <!-- !subscription-input -->
@ -25,7 +29,12 @@
<div class="form-group"> <div class="form-group">
<label for="azure_resourcegroup" class="col-sm-1 control-label text-left">Resource group</label> <label for="azure_resourcegroup" class="col-sm-1 control-label text-left">Resource group</label>
<div class="col-sm-11"> <div class="col-sm-11">
<select class="form-control" name="azure_resourcegroup" ng-model="state.selectedResourceGroup" ng-options="resourceGroup.Name for resourceGroup in resourceGroups"></select> <select
class="form-control"
name="azure_resourcegroup"
ng-model="state.selectedResourceGroup"
ng-options="resourceGroup.Name for resourceGroup in resourceGroups"
></select>
</div> </div>
</div> </div>
<!-- !resourcegroup-input --> <!-- !resourcegroup-input -->
@ -44,7 +53,7 @@
<div class="form-group"> <div class="form-group">
<label for="container_name" class="col-sm-1 control-label text-left">Name</label> <label for="container_name" class="col-sm-1 control-label text-left">Name</label>
<div class="col-sm-11"> <div class="col-sm-11">
<input type="text" class="form-control" ng-model="model.Name" name="container_name" placeholder="e.g. myContainer"> <input type="text" class="form-control" ng-model="model.Name" name="container_name" placeholder="e.g. myContainer" />
</div> </div>
</div> </div>
<!-- !name-input --> <!-- !name-input -->
@ -52,7 +61,7 @@
<div class="form-group"> <div class="form-group">
<label for="image_name" class="col-sm-1 control-label text-left">Image</label> <label for="image_name" class="col-sm-1 control-label text-left">Image</label>
<div class="col-sm-11"> <div class="col-sm-11">
<input type="text" class="form-control" ng-model="model.Image" name="image_name" placeholder="e.g. nginx:alpine"> <input type="text" class="form-control" ng-model="model.Image" name="image_name" placeholder="e.g. nginx:alpine" />
</div> </div>
</div> </div>
<!-- !image-input --> <!-- !image-input -->
@ -81,7 +90,7 @@
<!-- host-port --> <!-- host-port -->
<div class="input-group col-sm-4 input-group-sm"> <div class="input-group col-sm-4 input-group-sm">
<span class="input-group-addon">host</span> <span class="input-group-addon">host</span>
<input type="text" class="form-control" ng-model="binding.host" placeholder="e.g. 80"> <input type="text" class="form-control" ng-model="binding.host" placeholder="e.g. 80" />
</div> </div>
<!-- !host-port --> <!-- !host-port -->
<span style="margin: 0 10px 0 10px;"> <span style="margin: 0 10px 0 10px;">
@ -90,7 +99,7 @@
<!-- container-port --> <!-- container-port -->
<div class="input-group col-sm-4 input-group-sm"> <div class="input-group col-sm-4 input-group-sm">
<span class="input-group-addon">container</span> <span class="input-group-addon">container</span>
<input type="text" class="form-control" ng-model="binding.container" placeholder="e.g. 80"> <input type="text" class="form-control" ng-model="binding.container" placeholder="e.g. 80" />
</div> </div>
<!-- !container-port --> <!-- !container-port -->
<!-- protocol-actions --> <!-- protocol-actions -->
@ -115,9 +124,7 @@
<label for="public_ip" class="control-label text-left"> <label for="public_ip" class="control-label text-left">
Allocate public IP address Allocate public IP address
</label> </label>
<label class="switch" style="margin-left: 20px;"> <label class="switch" style="margin-left: 20px;"> <input type="checkbox" name="public_ip" ng-model="model.AllocatePublicIP" /><i></i> </label>
<input type="checkbox" name="public_ip" ng-model="model.AllocatePublicIP"><i></i>
</label>
</div> </div>
</div> </div>
<!-- public-ip --> <!-- public-ip -->
@ -128,7 +135,7 @@
<div class="form-group"> <div class="form-group">
<label for="container_cpu" class="col-sm-1 control-label text-left">CPU</label> <label for="container_cpu" class="col-sm-1 control-label text-left">CPU</label>
<div class="col-sm-11"> <div class="col-sm-11">
<input type="number" class="form-control" ng-model="model.CPU" name="container_cpu" placeholder="1"> <input type="number" class="form-control" ng-model="model.CPU" name="container_cpu" placeholder="1" />
</div> </div>
</div> </div>
<!-- !cpu-input --> <!-- !cpu-input -->
@ -136,7 +143,7 @@
<div class="form-group"> <div class="form-group">
<label for="container_memory" class="col-sm-1 control-label text-left">Memory</label> <label for="container_memory" class="col-sm-1 control-label text-left">Memory</label>
<div class="col-sm-11"> <div class="col-sm-11">
<input type="number" class="form-control" ng-model="model.Memory" name="container_memory" placeholder="1"> <input type="number" class="form-control" ng-model="model.Memory" name="container_memory" placeholder="1" />
</div> </div>
</div> </div>
<!-- !memory-input --> <!-- !memory-input -->

42
app/azure/views/dashboard/dashboardController.js
View File

@ -1,21 +1,23 @@
angular.module('portainer.azure') angular.module('portainer.azure').controller('AzureDashboardController', [
.controller('AzureDashboardController', ['$scope', 'AzureService', 'Notifications', '$scope',
function ($scope, AzureService, Notifications) { 'AzureService',
'Notifications',
function ($scope, AzureService, Notifications) {
function initView() {
AzureService.subscriptions()
.then(function success(data) {
var subscriptions = data;
$scope.subscriptions = subscriptions;
return AzureService.resourceGroups(subscriptions);
})
.then(function success(data) {
$scope.resourceGroups = AzureService.aggregate(data);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to load dashboard data');
});
}
function initView() { initView();
AzureService.subscriptions() },
.then(function success(data) { ]);
var subscriptions = data;
$scope.subscriptions = subscriptions;
return AzureService.resourceGroups(subscriptions);
})
.then(function success(data) {
$scope.resourceGroups = AzureService.aggregate(data);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to load dashboard data');
});
}
initView();
}]);

61
app/config.js
View File

@ -2,8 +2,15 @@ import toastr from 'toastr';
import { Terminal } from 'xterm'; import { Terminal } from 'xterm';
import * as fit from 'xterm/lib/addons/fit/fit'; import * as fit from 'xterm/lib/addons/fit/fit';
angular.module('portainer') angular.module('portainer').config([
.config(['$urlRouterProvider', '$httpProvider', 'localStorageServiceProvider', 'jwtOptionsProvider', 'AnalyticsProvider', '$uibTooltipProvider', '$compileProvider', 'cfpLoadingBarProvider', '$urlRouterProvider',
'$httpProvider',
'localStorageServiceProvider',
'jwtOptionsProvider',
'AnalyticsProvider',
'$uibTooltipProvider',
'$compileProvider',
'cfpLoadingBarProvider',
function ($urlRouterProvider, $httpProvider, localStorageServiceProvider, jwtOptionsProvider, AnalyticsProvider, $uibTooltipProvider, $compileProvider, cfpLoadingBarProvider) { function ($urlRouterProvider, $httpProvider, localStorageServiceProvider, jwtOptionsProvider, AnalyticsProvider, $uibTooltipProvider, $compileProvider, cfpLoadingBarProvider) {
'use strict'; 'use strict';
@ -12,13 +19,15 @@ angular.module('portainer')
$compileProvider.debugInfoEnabled(false); $compileProvider.debugInfoEnabled(false);
} }
localStorageServiceProvider localStorageServiceProvider.setPrefix('portainer');
.setPrefix('portainer');
jwtOptionsProvider.config({ jwtOptionsProvider.config({
tokenGetter: ['LocalStorage', function(LocalStorage) { tokenGetter: [
return LocalStorage.getJWT(); 'LocalStorage',
}] function (LocalStorage) {
return LocalStorage.getJWT();
},
],
}); });
$httpProvider.interceptors.push('jwtInterceptor'); $httpProvider.interceptors.push('jwtInterceptor');
$httpProvider.interceptors.push('EndpointStatusInterceptor'); $httpProvider.interceptors.push('EndpointStatusInterceptor');
@ -26,19 +35,22 @@ angular.module('portainer')
$httpProvider.defaults.headers.put['Content-Type'] = 'application/json'; $httpProvider.defaults.headers.put['Content-Type'] = 'application/json';
$httpProvider.defaults.headers.patch['Content-Type'] = 'application/json'; $httpProvider.defaults.headers.patch['Content-Type'] = 'application/json';
$httpProvider.interceptors.push(['HttpRequestHelper', function(HttpRequestHelper) { $httpProvider.interceptors.push([
return { 'HttpRequestHelper',
request: function(config) { function (HttpRequestHelper) {
if (config.url.indexOf('/docker/') > -1) { return {
config.headers['X-PortainerAgent-Target'] = HttpRequestHelper.portainerAgentTargetHeader(); request: function (config) {
if (HttpRequestHelper.portainerAgentManagerOperation()) { if (config.url.indexOf('/docker/') > -1) {
config.headers['X-PortainerAgent-ManagerOperation'] = '1'; config.headers['X-PortainerAgent-Target'] = HttpRequestHelper.portainerAgentTargetHeader();
if (HttpRequestHelper.portainerAgentManagerOperation()) {
config.headers['X-PortainerAgent-ManagerOperation'] = '1';
}
} }
} return config;
return config; },
} };
}; },
}]); ]);
AnalyticsProvider.setAccount({ tracker: __CONFIG_GA_ID, set: { anonymizeIp: true } }); AnalyticsProvider.setAccount({ tracker: __CONFIG_GA_ID, set: { anonymizeIp: true } });
AnalyticsProvider.startOffline(true); AnalyticsProvider.startOffline(true);
@ -48,10 +60,10 @@ angular.module('portainer')
Terminal.applyAddon(fit); Terminal.applyAddon(fit);
$uibTooltipProvider.setTriggers({ $uibTooltipProvider.setTriggers({
'mouseenter': 'mouseleave', mouseenter: 'mouseleave',
'click': 'click', click: 'click',
'focus': 'blur', focus: 'blur',
'outsideClick': 'outsideClick' outsideClick: 'outsideClick',
}); });
cfpLoadingBarProvider.includeSpinner = false; cfpLoadingBarProvider.includeSpinner = false;
@ -59,4 +71,5 @@ angular.module('portainer')
cfpLoadingBarProvider.latencyThreshold = 600; cfpLoadingBarProvider.latencyThreshold = 600;
$urlRouterProvider.otherwise('/auth'); $urlRouterProvider.otherwise('/auth');
}]); },
]);

51
app/constants.js
View File

@ -1,25 +1,26 @@
angular.module('portainer') angular
.constant('API_ENDPOINT_AUTH', 'api/auth') .module('portainer')
.constant('API_ENDPOINT_DOCKERHUB', 'api/dockerhub') .constant('API_ENDPOINT_AUTH', 'api/auth')
.constant('API_ENDPOINT_ENDPOINTS', 'api/endpoints') .constant('API_ENDPOINT_DOCKERHUB', 'api/dockerhub')
.constant('API_ENDPOINT_ENDPOINT_GROUPS', 'api/endpoint_groups') .constant('API_ENDPOINT_ENDPOINTS', 'api/endpoints')
.constant('API_ENDPOINT_MOTD', 'api/motd') .constant('API_ENDPOINT_ENDPOINT_GROUPS', 'api/endpoint_groups')
.constant('API_ENDPOINT_EXTENSIONS', 'api/extensions') .constant('API_ENDPOINT_MOTD', 'api/motd')
.constant('API_ENDPOINT_REGISTRIES', 'api/registries') .constant('API_ENDPOINT_EXTENSIONS', 'api/extensions')
.constant('API_ENDPOINT_RESOURCE_CONTROLS', 'api/resource_controls') .constant('API_ENDPOINT_REGISTRIES', 'api/registries')
.constant('API_ENDPOINT_SCHEDULES', 'api/schedules') .constant('API_ENDPOINT_RESOURCE_CONTROLS', 'api/resource_controls')
.constant('API_ENDPOINT_SETTINGS', 'api/settings') .constant('API_ENDPOINT_SCHEDULES', 'api/schedules')
.constant('API_ENDPOINT_STACKS', 'api/stacks') .constant('API_ENDPOINT_SETTINGS', 'api/settings')
.constant('API_ENDPOINT_STATUS', 'api/status') .constant('API_ENDPOINT_STACKS', 'api/stacks')
.constant('API_ENDPOINT_SUPPORT', 'api/support') .constant('API_ENDPOINT_STATUS', 'api/status')
.constant('API_ENDPOINT_USERS', 'api/users') .constant('API_ENDPOINT_SUPPORT', 'api/support')
.constant('API_ENDPOINT_TAGS', 'api/tags') .constant('API_ENDPOINT_USERS', 'api/users')
.constant('API_ENDPOINT_TEAMS', 'api/teams') .constant('API_ENDPOINT_TAGS', 'api/tags')
.constant('API_ENDPOINT_TEAM_MEMBERSHIPS', 'api/team_memberships') .constant('API_ENDPOINT_TEAMS', 'api/teams')
.constant('API_ENDPOINT_TEMPLATES', 'api/templates') .constant('API_ENDPOINT_TEAM_MEMBERSHIPS', 'api/team_memberships')
.constant('API_ENDPOINT_WEBHOOKS', 'api/webhooks') .constant('API_ENDPOINT_TEMPLATES', 'api/templates')
.constant('DEFAULT_TEMPLATES_URL', 'https://raw.githubusercontent.com/portainer/templates/master/templates.json') .constant('API_ENDPOINT_WEBHOOKS', 'api/webhooks')
.constant('PAGINATION_MAX_ITEMS', 10) .constant('DEFAULT_TEMPLATES_URL', 'https://raw.githubusercontent.com/portainer/templates/master/templates.json')
.constant('APPLICATION_CACHE_VALIDITY', 3600) .constant('PAGINATION_MAX_ITEMS', 10)
.constant('CONSOLE_COMMANDS_LABEL_PREFIX', 'io.portainer.commands.') .constant('APPLICATION_CACHE_VALIDITY', 3600)
.constant('PREDEFINED_NETWORKS', ['host', 'bridge', 'none']); .constant('CONSOLE_COMMANDS_LABEL_PREFIX', 'io.portainer.commands.')
.constant('PREDEFINED_NETWORKS', ['host', 'bridge', 'none']);

964
app/docker/__module.js
View File

File diff suppressed because it is too large Load Diff

4
app/docker/components/container-capabilities/container-capabilities.js
View File

@ -1,6 +1,6 @@
angular.module('portainer.docker').component('containerCapabilities', { angular.module('portainer.docker').component('containerCapabilities', {
templateUrl: './containerCapabilities.html', templateUrl: './containerCapabilities.html',
bindings: { bindings: {
capabilities: '=' capabilities: '=',
} },
}); });

7
app/docker/components/container-capabilities/containerCapabilities.html
View File

@ -11,12 +11,9 @@
</label> </label>
</div> </div>
<div class="col-xs-4 col-sm-2 col-md-1"> <div class="col-xs-4 col-sm-2 col-md-1">
<label class="switch" style="margin-left: 20px;"> <label class="switch" style="margin-left: 20px;"> <input type="checkbox" name="capability" ng-model="cap.allowed" /><i></i> </label>
<input type="checkbox" name="capability" ng-model="cap.allowed"><i></i>
</label>
</div>
<div class="col-xs-0 col-sm-1 col-md-1">
</div> </div>
<div class="col-xs-0 col-sm-1 col-md-1"> </div>
</div> </div>
</div> </div>
</form> </form>

25
app/docker/components/container-quick-actions/containerQuickActions.html
View File

@ -1,10 +1,11 @@
<div class="btn-group btn-group-xs" role="group" aria-label="..." style="display:inline-flex;"> <div class="btn-group btn-group-xs" role="group" aria-label="..." style="display: inline-flex;">
<a <a
authorization="DockerContainerLogs" authorization="DockerContainerLogs"
ng-if="$ctrl.state.showQuickActionLogs && $ctrl.taskId === undefined" ng-if="$ctrl.state.showQuickActionLogs && $ctrl.taskId === undefined"
style="margin: 0 2.5px;" style="margin: 0 2.5px;"
ui-sref="docker.containers.container.logs({id: $ctrl.containerId, nodeName: $ctrl.nodeName})" ui-sref="docker.containers.container.logs({id: $ctrl.containerId, nodeName: $ctrl.nodeName})"
title="Logs"> title="Logs"
>
<i class="fa fa-file-alt space-right" aria-hidden="true"></i> <i class="fa fa-file-alt space-right" aria-hidden="true"></i>
</a> </a>
<a <a
@ -12,15 +13,17 @@
ng-if="$ctrl.state.showQuickActionLogs && $ctrl.taskId !== undefined" ng-if="$ctrl.state.showQuickActionLogs && $ctrl.taskId !== undefined"
style="margin: 0 2.5px;" style="margin: 0 2.5px;"
ui-sref="docker.tasks.task.logs({id: $ctrl.taskId})" ui-sref="docker.tasks.task.logs({id: $ctrl.taskId})"
title="Logs"> title="Logs"
>
<i class="fa fa-file-alt space-right" aria-hidden="true"></i> <i class="fa fa-file-alt space-right" aria-hidden="true"></i>
</a> </a>
<a <a
authorization="DockerContainerInspect" authorization="DockerContainerInspect"
ng-if="$ctrl.state.showQuickActionInspect && $ctrl.taskId === undefined" ng-if="$ctrl.state.showQuickActionInspect && $ctrl.taskId === undefined"
style="margin: 0 2.5px;" style="margin: 0 2.5px;"
ui-sref="docker.containers.container.inspect({id: $ctrl.containerId, nodeName: $ctrl.nodeName})" ui-sref="docker.containers.container.inspect({id: $ctrl.containerId, nodeName: $ctrl.nodeName})"
title="Inspect"> title="Inspect"
>
<i class="fa fa-info-circle space-right" aria-hidden="true"></i> <i class="fa fa-info-circle space-right" aria-hidden="true"></i>
</a> </a>
<a <a
@ -28,7 +31,8 @@
ng-if="$ctrl.state.showQuickActionInspect && $ctrl.taskId !== undefined" ng-if="$ctrl.state.showQuickActionInspect && $ctrl.taskId !== undefined"
style="margin: 0 2.5px;" style="margin: 0 2.5px;"
ui-sref="docker.tasks.task({id: $ctrl.taskId})" ui-sref="docker.tasks.task({id: $ctrl.taskId})"
title="Inspect"> title="Inspect"
>
<i class="fa fa-info-circle space-right" aria-hidden="true"></i> <i class="fa fa-info-circle space-right" aria-hidden="true"></i>
</a> </a>
<a <a
@ -36,7 +40,8 @@
ng-if="$ctrl.state.showQuickActionStats && ['starting', 'running', 'healthy', 'unhealthy'].indexOf($ctrl.status) !== -1 && $ctrl.taskId === undefined" ng-if="$ctrl.state.showQuickActionStats && ['starting', 'running', 'healthy', 'unhealthy'].indexOf($ctrl.status) !== -1 && $ctrl.taskId === undefined"
style="margin: 0 2.5px;" style="margin: 0 2.5px;"
ui-sref="docker.containers.container.stats({id: $ctrl.containerId, nodeName: $ctrl.nodeName})" ui-sref="docker.containers.container.stats({id: $ctrl.containerId, nodeName: $ctrl.nodeName})"
title="Stats"> title="Stats"
>
<i class="fa fa-chart-area space-right" aria-hidden="true"></i> <i class="fa fa-chart-area space-right" aria-hidden="true"></i>
</a> </a>
<a <a
@ -44,7 +49,8 @@
ng-if="$ctrl.state.showQuickActionExec && ['starting', 'running', 'healthy', 'unhealthy'].indexOf($ctrl.status) !== -1 && $ctrl.taskId === undefined" ng-if="$ctrl.state.showQuickActionExec && ['starting', 'running', 'healthy', 'unhealthy'].indexOf($ctrl.status) !== -1 && $ctrl.taskId === undefined"
style="margin: 0 2.5px;" style="margin: 0 2.5px;"
ui-sref="docker.containers.container.exec({id: $ctrl.containerId, nodeName: $ctrl.nodeName})" ui-sref="docker.containers.container.exec({id: $ctrl.containerId, nodeName: $ctrl.nodeName})"
title="Exec Console"> title="Exec Console"
>
<i class="fa fa-terminal space-right" aria-hidden="true"></i> <i class="fa fa-terminal space-right" aria-hidden="true"></i>
</a> </a>
<a <a
@ -52,7 +58,8 @@
ng-if="$ctrl.state.showQuickActionAttach && ['starting', 'running', 'healthy', 'unhealthy'].indexOf($ctrl.status) !== -1 && $ctrl.taskId === undefined" ng-if="$ctrl.state.showQuickActionAttach && ['starting', 'running', 'healthy', 'unhealthy'].indexOf($ctrl.status) !== -1 && $ctrl.taskId === undefined"
style="margin: 0 2.5px;" style="margin: 0 2.5px;"
ui-sref="docker.containers.container.attach({id: $ctrl.containerId, nodeName: $ctrl.nodeName})" ui-sref="docker.containers.container.attach({id: $ctrl.containerId, nodeName: $ctrl.nodeName})"
title="Attach Console"> title="Attach Console"
>
<i class="fa fa-plug space-right" aria-hidden="true"></i> <i class="fa fa-plug space-right" aria-hidden="true"></i>
</a> </a>
</div> </div>

4
app/docker/components/container-quick-actions/containerQuickActions.js
View File

@ -5,6 +5,6 @@ angular.module('portainer.docker').component('containerQuickActions', {
nodeName: '<', nodeName: '<',
status: '<', status: '<',
state: '<', state: '<',
taskId: '<' taskId: '<',
} },
}); });

45
app/docker/components/container-restart-policy/container-restart-policy-controller.js
View File

@ -1,26 +1,25 @@
angular angular.module('portainer.docker').controller('ContainerRestartPolicyController', [
.module('portainer.docker') function ContainerRestartPolicyController() {
.controller('ContainerRestartPolicyController', [function ContainerRestartPolicyController() { var ctrl = this;
var ctrl = this;
this.state = { this.state = {
editModel : {} editModel: {},
};
ctrl.save = save;
function save() {
if (ctrl.state.editModel.name === ctrl.name && ctrl.state.editModel.maximumRetryCount === ctrl.maximumRetryCount) {
return;
}
ctrl.updateRestartPolicy(ctrl.state.editModel);
}
this.$onInit = function() {
ctrl.state.editModel = {
name: ctrl.name ? ctrl.name : 'no',
maximumRetryCount: ctrl.maximumRetryCount
}; };
};
} ctrl.save = save;
function save() {
if (ctrl.state.editModel.name === ctrl.name && ctrl.state.editModel.maximumRetryCount === ctrl.maximumRetryCount) {
return;
}
ctrl.updateRestartPolicy(ctrl.state.editModel);
}
this.$onInit = function () {
ctrl.state.editModel = {
name: ctrl.name ? ctrl.name : 'no',
maximumRetryCount: ctrl.maximumRetryCount,
};
};
},
]); ]);

11
app/docker/components/container-restart-policy/container-restart-policy.js
View File

@ -1,10 +1,9 @@
angular.module('portainer.docker') angular.module('portainer.docker').component('containerRestartPolicy', {
.component('containerRestartPolicy', {
templateUrl: './container-restart-policy.html', templateUrl: './container-restart-policy.html',
controller: 'ContainerRestartPolicyController', controller: 'ContainerRestartPolicyController',
bindings: { bindings: {
'name': '<', name: '<',
'maximumRetryCount': '<', maximumRetryCount: '<',
'updateRestartPolicy': '&' updateRestartPolicy: '&',
} },
}); });

2
app/docker/components/dashboard-cluster-agent-info/dashboard-cluster-agent-info.js
View File

@ -1,4 +1,4 @@
angular.module('portainer.docker').component('dashboardClusterAgentInfo', { angular.module('portainer.docker').component('dashboardClusterAgentInfo', {
templateUrl: './dashboardClusterAgentInfo.html', templateUrl: './dashboardClusterAgentInfo.html',
controller: 'DashboardClusterAgentInfoController' controller: 'DashboardClusterAgentInfoController',
}); });

31
app/docker/components/dashboard-cluster-agent-info/dashboardClusterAgentInfoController.js
View File

@ -1,16 +1,17 @@
angular.module('portainer.docker') angular.module('portainer.docker').controller('DashboardClusterAgentInfoController', [
.controller('DashboardClusterAgentInfoController', ['AgentService', 'Notifications', 'AgentService',
function (AgentService, Notifications) { 'Notifications',
var ctrl = this; function (AgentService, Notifications) {
var ctrl = this;
this.$onInit = function() { this.$onInit = function () {
AgentService.agents() AgentService.agents()
.then(function success(data) { .then(function success(data) {
ctrl.agentCount = data.length; ctrl.agentCount = data.length;
}) })
.catch(function error(err) { .catch(function error(err) {
Notifications.error('Failure', err, 'Unable to retrieve agent information'); Notifications.error('Failure', err, 'Unable to retrieve agent information');
}); });
}; };
},
}]); ]);

38
app/docker/components/datatables/configs-datatable/configsDatatable.html
View File

@ -2,9 +2,7 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
<div class="settings"> <div class="settings">
<span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open"> <span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open">
<span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span> <span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span>
@ -16,7 +14,7 @@
<div class="menuContent"> <div class="menuContent">
<div> <div>
<div class="md-checkbox"> <div class="md-checkbox">
<input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()"/> <input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()" />
<label for="setting_auto_refresh">Auto refresh</label> <label for="setting_auto_refresh">Auto refresh</label>
</div> </div>
<div ng-if="$ctrl.settings.repeater.autoRefresh"> <div ng-if="$ctrl.settings.repeater.autoRefresh">
@ -45,17 +43,30 @@
</div> </div>
</div> </div>
<div class="actionBar" authorization="DockerConfigDelete, DockerConfigCreate"> <div class="actionBar" authorization="DockerConfigDelete, DockerConfigCreate">
<button type="button" class="btn btn-sm btn-danger" authorization="DockerConfigDelete" <button
ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"> type="button"
class="btn btn-sm btn-danger"
authorization="DockerConfigDelete"
ng-disabled="$ctrl.state.selectedItemCount === 0"
ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"
>
<i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove <i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove
</button> </button>
<button type="button" class="btn btn-sm btn-primary" ui-sref="docker.configs.new" authorization="DockerConfigCreate"> <button type="button" class="btn btn-sm btn-primary" ui-sref="docker.configs.new" authorization="DockerConfigCreate">
<i class="fa fa-plus space-right" aria-hidden="true"></i>Add config <i class="fa fa-plus space-right" aria-hidden="true"></i>Add config
</button> </button>
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
@ -89,10 +100,13 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td> <td>
<span class="md-checkbox" authorization="DockerConfigDelete, DockerConfigCreate"> <span class="md-checkbox" authorization="DockerConfigDelete, DockerConfigCreate">
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)"/> <input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)" />
<label for="select_{{ $index }}"></label> <label for="select_{{ $index }}"></label>
</span> </span>
<a ui-sref="docker.configs.config({id: item.Id})">{{ item.Name }}</a> <a ui-sref="docker.configs.config({id: item.Id})">{{ item.Name }}</a>
@ -115,9 +129,7 @@
</table> </table>
</div> </div>
<div class="footer" ng-if="$ctrl.dataset"> <div class="footer" ng-if="$ctrl.dataset">
<div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> <div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> {{ $ctrl.state.selectedItemCount }} item(s) selected </div>
{{ $ctrl.state.selectedItemCount }} item(s) selected
</div>
<div class="paginationControls"> <div class="paginationControls">
<form class="form-inline"> <form class="form-inline">
<span class="limitSelector"> <span class="limitSelector">

4
app/docker/components/datatables/configs-datatable/configsDatatable.js
View File

@ -10,6 +10,6 @@ angular.module('portainer.docker').component('configsDatatable', {
reverseOrder: '<', reverseOrder: '<',
showOwnershipColumn: '<', showOwnershipColumn: '<',
removeAction: '<', removeAction: '<',
refreshCallback: '<' refreshCallback: '<',
} },
}); });

26
app/docker/components/datatables/container-networks-datatable/containerNetworksDatatable.html
View File

@ -2,9 +2,7 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
</div> </div>
<div class="actionBar"> <div class="actionBar">
<form class="form-horizontal"> <form class="form-horizontal">
@ -17,7 +15,13 @@
</select> </select>
</div> </div>
<div class="col-sm-1"> <div class="col-sm-1">
<button type="button" class="btn btn-primary btn-sm" ng-disabled="$ctrl.joinNetworkActionInProgress || !$ctrl.selectedNetwork" ng-click="$ctrl.joinNetworkAction($ctrl.container, $ctrl.selectedNetwork)" button-spinner="$ctrl.joinNetworkActionInProgress"> <button
type="button"
class="btn btn-primary btn-sm"
ng-disabled="$ctrl.joinNetworkActionInProgress || !$ctrl.selectedNetwork"
ng-click="$ctrl.joinNetworkAction($ctrl.container, $ctrl.selectedNetwork)"
button-spinner="$ctrl.joinNetworkActionInProgress"
>
<span ng-hide="$ctrl.joinNetworkActionInProgress">Join network</span> <span ng-hide="$ctrl.joinNetworkActionInProgress">Join network</span>
<span ng-show="$ctrl.joinNetworkActionInProgress">Joining network...</span> <span ng-show="$ctrl.joinNetworkActionInProgress">Joining network...</span>
</button> </button>
@ -37,13 +41,21 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="(key, value) in $ctrl.dataset | itemsPerPage: $ctrl.state.paginatedItemLimit" ng-class="{active: item.Checked}"> <tr dir-paginate="(key, value) in $ctrl.dataset | itemsPerPage: $ctrl.state.paginatedItemLimit" ng-class="{ active: item.Checked }">
<td><a ui-sref="docker.networks.network({ id: key, nodeName: $ctrl.nodeName })">{{ key }}</a></td> <td
><a ui-sref="docker.networks.network({ id: key, nodeName: $ctrl.nodeName })">{{ key }}</a></td
>
<td>{{ value.IPAddress || '-' }}</td> <td>{{ value.IPAddress || '-' }}</td>
<td>{{ value.Gateway || '-' }}</td> <td>{{ value.Gateway || '-' }}</td>
<td>{{ value.MacAddress || '-' }}</td> <td>{{ value.MacAddress || '-' }}</td>
<td authorization="DockerNetworkDisconnect"> <td authorization="DockerNetworkDisconnect">
<button type="button" class="btn btn-xs btn-danger" ng-disabled="$ctrl.leaveNetworkActionInProgress" button-spinner="$ctrl.leaveNetworkActionInProgress" ng-click="$ctrl.leaveNetworkAction($ctrl.container, key)"> <button
type="button"
class="btn btn-xs btn-danger"
ng-disabled="$ctrl.leaveNetworkActionInProgress"
button-spinner="$ctrl.leaveNetworkActionInProgress"
ng-click="$ctrl.leaveNetworkAction($ctrl.container, key)"
>
<span ng-hide="$ctrl.leaveNetworkActionInProgress"><i class="fa fa-trash-alt space-right" aria-hidden="true"></i> Leave network</span> <span ng-hide="$ctrl.leaveNetworkActionInProgress"><i class="fa fa-trash-alt space-right" aria-hidden="true"></i> Leave network</span>
<span ng-show="$ctrl.leaveNetworkActionInProgress">Leaving network...</span> <span ng-show="$ctrl.leaveNetworkActionInProgress">Leaving network...</span>
</button> </button>

4
app/docker/components/datatables/container-networks-datatable/containerNetworksDatatable.js
View File

@ -12,6 +12,6 @@ angular.module('portainer.docker').component('containerNetworksDatatable', {
joinNetworkActionInProgress: '<', joinNetworkActionInProgress: '<',
leaveNetworkActionInProgress: '<', leaveNetworkActionInProgress: '<',
leaveNetworkAction: '<', leaveNetworkAction: '<',
nodeName: '<' nodeName: '<',
} },
}); });

6
app/docker/components/datatables/container-processes-datatable/containerProcessesDatatable.html
View File

@ -2,13 +2,11 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }" />
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">

4
app/docker/components/datatables/container-processes-datatable/containerProcessesDatatable.js
View File

@ -8,6 +8,6 @@ angular.module('portainer.docker').component('containerProcessesDatatable', {
headerset: '<', headerset: '<',
tableKey: '@', tableKey: '@',
orderBy: '@', orderBy: '@',
reverseOrder: '<' reverseOrder: '<',
} },
}); });

68
app/docker/components/datatables/containers-datatable/actions/containersDatatableActions.html
View File

@ -1,31 +1,69 @@
<div class="actionBar" authorization="DockerContainerStart, DockerContainerStop, DockerContainerKill, DockerContainerRestart, DockerContainerPause, DockerContainerUnpause, DockerContainerDelete, DockerContainerCreate"> <div
class="actionBar"
authorization="DockerContainerStart, DockerContainerStop, DockerContainerKill, DockerContainerRestart, DockerContainerPause, DockerContainerUnpause, DockerContainerDelete, DockerContainerCreate"
>
<div class="btn-group" role="group" aria-label="..."> <div class="btn-group" role="group" aria-label="...">
<button authorization="DockerContainerStart" type="button" class="btn btn-sm btn-success" ng-click="$ctrl.startAction($ctrl.selectedItems)" <button
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noStoppedItemsSelected"> authorization="DockerContainerStart"
type="button"
class="btn btn-sm btn-success"
ng-click="$ctrl.startAction($ctrl.selectedItems)"
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noStoppedItemsSelected"
>
<i class="fa fa-play space-right" aria-hidden="true"></i>Start <i class="fa fa-play space-right" aria-hidden="true"></i>Start
</button> </button>
<button authorization="DockerContainerStop" type="button" class="btn btn-sm btn-danger" ng-click="$ctrl.stopAction($ctrl.selectedItems)" <button
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noRunningItemsSelected"> authorization="DockerContainerStop"
type="button"
class="btn btn-sm btn-danger"
ng-click="$ctrl.stopAction($ctrl.selectedItems)"
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noRunningItemsSelected"
>
<i class="fa fa-stop space-right" aria-hidden="true"></i>Stop <i class="fa fa-stop space-right" aria-hidden="true"></i>Stop
</button> </button>
<button authorization="DockerContainerKill" type="button" class="btn btn-sm btn-danger" ng-click="$ctrl.killAction($ctrl.selectedItems)" <button
ng-disabled="$ctrl.selectedItemCount === 0"> authorization="DockerContainerKill"
type="button"
class="btn btn-sm btn-danger"
ng-click="$ctrl.killAction($ctrl.selectedItems)"
ng-disabled="$ctrl.selectedItemCount === 0"
>
<i class="fa fa-bomb space-right" aria-hidden="true"></i>Kill <i class="fa fa-bomb space-right" aria-hidden="true"></i>Kill
</button> </button>
<button authorization="DockerContainerRestart" type="button" class="btn btn-sm btn-primary" ng-click="$ctrl.restartAction($ctrl.selectedItems)" <button
ng-disabled="$ctrl.selectedItemCount === 0"> authorization="DockerContainerRestart"
type="button"
class="btn btn-sm btn-primary"
ng-click="$ctrl.restartAction($ctrl.selectedItems)"
ng-disabled="$ctrl.selectedItemCount === 0"
>
<i class="fa fa-sync space-right" aria-hidden="true"></i>Restart <i class="fa fa-sync space-right" aria-hidden="true"></i>Restart
</button> </button>
<button authorization="DockerContainerPause" type="button" class="btn btn-sm btn-primary" ng-click="$ctrl.pauseAction($ctrl.selectedItems)" <button
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noRunningItemsSelected"> authorization="DockerContainerPause"
type="button"
class="btn btn-sm btn-primary"
ng-click="$ctrl.pauseAction($ctrl.selectedItems)"
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noRunningItemsSelected"
>
<i class="fa fa-pause space-right" aria-hidden="true"></i>Pause <i class="fa fa-pause space-right" aria-hidden="true"></i>Pause
</button> </button>
<button authorization="DockerContainerUnpause" type="button" class="btn btn-sm btn-primary" ng-click="$ctrl.resumeAction($ctrl.selectedItems)" <button
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noPausedItemsSelected"> authorization="DockerContainerUnpause"
type="button"
class="btn btn-sm btn-primary"
ng-click="$ctrl.resumeAction($ctrl.selectedItems)"
ng-disabled="$ctrl.selectedItemCount === 0 || $ctrl.noPausedItemsSelected"
>
<i class="fa fa-play space-right" aria-hidden="true"></i>Resume <i class="fa fa-play space-right" aria-hidden="true"></i>Resume
</button> </button>
<button authorization="DockerContainerDelete" type="button" class="btn btn-sm btn-danger" <button
ng-disabled="$ctrl.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.selectedItems)"> authorization="DockerContainerDelete"
type="button"
class="btn btn-sm btn-danger"
ng-disabled="$ctrl.selectedItemCount === 0"
ng-click="$ctrl.removeAction($ctrl.selectedItems)"
>
<i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove <i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove
</button> </button>
</div> </div>

4
app/docker/components/datatables/containers-datatable/actions/containersDatatableActions.js
View File

@ -7,6 +7,6 @@ angular.module('portainer.docker').component('containersDatatableActions', {
noStoppedItemsSelected: '=', noStoppedItemsSelected: '=',
noRunningItemsSelected: '=', noRunningItemsSelected: '=',
noPausedItemsSelected: '=', noPausedItemsSelected: '=',
showAddAction: '<' showAddAction: '<',
} },
}); });

184
app/docker/components/datatables/containers-datatable/actions/containersDatatableActionsController.js
View File

@ -1,106 +1,112 @@
angular.module('portainer.docker') angular.module('portainer.docker').controller('ContainersDatatableActionsController', [
.controller('ContainersDatatableActionsController', ['$state', 'ContainerService', 'ModalService', 'Notifications', 'HttpRequestHelper', '$state',
function ($state, ContainerService, ModalService, Notifications, HttpRequestHelper) { 'ContainerService',
this.startAction = function(selectedItems) { 'ModalService',
var successMessage = 'Container successfully started'; 'Notifications',
var errorMessage = 'Unable to start container'; 'HttpRequestHelper',
executeActionOnContainerList(selectedItems, ContainerService.startContainer, successMessage, errorMessage); function ($state, ContainerService, ModalService, Notifications, HttpRequestHelper) {
}; this.startAction = function (selectedItems) {
var successMessage = 'Container successfully started';
var errorMessage = 'Unable to start container';
executeActionOnContainerList(selectedItems, ContainerService.startContainer, successMessage, errorMessage);
};
this.stopAction = function(selectedItems) { this.stopAction = function (selectedItems) {
var successMessage = 'Container successfully stopped'; var successMessage = 'Container successfully stopped';
var errorMessage = 'Unable to stop container'; var errorMessage = 'Unable to stop container';
executeActionOnContainerList(selectedItems, ContainerService.stopContainer, successMessage, errorMessage); executeActionOnContainerList(selectedItems, ContainerService.stopContainer, successMessage, errorMessage);
}; };
this.restartAction = function(selectedItems) { this.restartAction = function (selectedItems) {
var successMessage = 'Container successfully restarted'; var successMessage = 'Container successfully restarted';
var errorMessage = 'Unable to restart container'; var errorMessage = 'Unable to restart container';
executeActionOnContainerList(selectedItems, ContainerService.restartContainer, successMessage, errorMessage); executeActionOnContainerList(selectedItems, ContainerService.restartContainer, successMessage, errorMessage);
}; };
this.killAction = function(selectedItems) { this.killAction = function (selectedItems) {
var successMessage = 'Container successfully killed'; var successMessage = 'Container successfully killed';
var errorMessage = 'Unable to kill container'; var errorMessage = 'Unable to kill container';
executeActionOnContainerList(selectedItems, ContainerService.killContainer, successMessage, errorMessage); executeActionOnContainerList(selectedItems, ContainerService.killContainer, successMessage, errorMessage);
}; };
this.pauseAction = function(selectedItems) { this.pauseAction = function (selectedItems) {
var successMessage = 'Container successfully paused'; var successMessage = 'Container successfully paused';
var errorMessage = 'Unable to pause container'; var errorMessage = 'Unable to pause container';
executeActionOnContainerList(selectedItems, ContainerService.pauseContainer, successMessage, errorMessage); executeActionOnContainerList(selectedItems, ContainerService.pauseContainer, successMessage, errorMessage);
}; };
this.resumeAction = function(selectedItems) { this.resumeAction = function (selectedItems) {
var successMessage = 'Container successfully resumed'; var successMessage = 'Container successfully resumed';
var errorMessage = 'Unable to resume container'; var errorMessage = 'Unable to resume container';
executeActionOnContainerList(selectedItems, ContainerService.resumeContainer, successMessage, errorMessage); executeActionOnContainerList(selectedItems, ContainerService.resumeContainer, successMessage, errorMessage);
}; };
this.removeAction = function(selectedItems) { this.removeAction = function (selectedItems) {
var isOneContainerRunning = false; var isOneContainerRunning = false;
for (var i = 0; i < selectedItems.length; i++) { for (var i = 0; i < selectedItems.length; i++) {
var container = selectedItems[i]; var container = selectedItems[i];
if (container.State === 'running') { if (container.State === 'running') {
isOneContainerRunning = true; isOneContainerRunning = true;
break; break;
}
} }
}
var title = 'You are about to remove one or more container.'; var title = 'You are about to remove one or more container.';
if (isOneContainerRunning) { if (isOneContainerRunning) {
title = 'You are about to remove one or more running container.'; title = 'You are about to remove one or more running container.';
} }
ModalService.confirmContainerDeletion(title, function (result) { ModalService.confirmContainerDeletion(title, function (result) {
if(!result) { return; } if (!result) {
return;
}
var cleanVolumes = false; var cleanVolumes = false;
if (result[0]) { if (result[0]) {
cleanVolumes = true; cleanVolumes = true;
} }
removeSelectedContainers(selectedItems, cleanVolumes); removeSelectedContainers(selectedItems, cleanVolumes);
}
);
};
function executeActionOnContainerList(containers, action, successMessage, errorMessage) {
var actionCount = containers.length;
angular.forEach(containers, function (container) {
HttpRequestHelper.setPortainerAgentTargetHeader(container.NodeName);
action(container.Id)
.then(function success() {
Notifications.success(successMessage, container.Names[0]);
})
.catch(function error(err) {
errorMessage = errorMessage + ':' + container.Names[0];
Notifications.error('Failure', err, errorMessage);
})
.finally(function final() {
--actionCount;
if (actionCount === 0) {
$state.reload();
}
}); });
}); };
}
function removeSelectedContainers(containers, cleanVolumes) { function executeActionOnContainerList(containers, action, successMessage, errorMessage) {
var actionCount = containers.length; var actionCount = containers.length;
angular.forEach(containers, function (container) { angular.forEach(containers, function (container) {
HttpRequestHelper.setPortainerAgentTargetHeader(container.NodeName); HttpRequestHelper.setPortainerAgentTargetHeader(container.NodeName);
ContainerService.remove(container, cleanVolumes) action(container.Id)
.then(function success() { .then(function success() {
Notifications.success('Container successfully removed', container.Names[0]); Notifications.success(successMessage, container.Names[0]);
}) })
.catch(function error(err) { .catch(function error(err) {
Notifications.error('Failure', err, 'Unable to remove container'); errorMessage = errorMessage + ':' + container.Names[0];
}) Notifications.error('Failure', err, errorMessage);
.finally(function final() { })
--actionCount; .finally(function final() {
if (actionCount === 0) { --actionCount;
$state.reload(); if (actionCount === 0) {
} $state.reload();
}
});
}); });
}); }
}
}]); function removeSelectedContainers(containers, cleanVolumes) {
var actionCount = containers.length;
angular.forEach(containers, function (container) {
HttpRequestHelper.setPortainerAgentTargetHeader(container.NodeName);
ContainerService.remove(container, cleanVolumes)
.then(function success() {
Notifications.success('Container successfully removed', container.Names[0]);
})
.catch(function error(err) {
Notifications.error('Failure', err, 'Unable to remove container');
})
.finally(function final() {
--actionCount;
if (actionCount === 0) {
$state.reload();
}
});
});
}
},
]);

210
app/docker/components/datatables/containers-datatable/containersDatatable.html
View File

@ -2,60 +2,65 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
<div class="settings"> <div class="settings">
<span class="setting" ng-class="{ 'setting-active': $ctrl.columnVisibility.state.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.columnVisibility.state.open"> <span
<span uib-dropdown-toggle ><i class="fa fa-columns space-right" aria-hidden="true"></i>Columns</span> class="setting"
<div class="dropdown-menu dropdown-menu-right" uib-dropdown-menu> ng-class="{ 'setting-active': $ctrl.columnVisibility.state.open }"
<div class="tableMenu"> uib-dropdown
<div class="menuHeader"> dropdown-append-to-body
Show / Hide Columns auto-close="disabled"
is-open="$ctrl.columnVisibility.state.open"
>
<span uib-dropdown-toggle><i class="fa fa-columns space-right" aria-hidden="true"></i>Columns</span>
<div class="dropdown-menu dropdown-menu-right" uib-dropdown-menu>
<div class="tableMenu">
<div class="menuHeader">
Show / Hide Columns
</div>
<div class="menuContent">
<div class="md-checkbox">
<input id="col_vis_state" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.state.display" />
<label for="col_vis_state" ng-bind="$ctrl.columnVisibility.columns.state.label"></label>
</div> </div>
<div class="menuContent"> <div class="md-checkbox">
<div class="md-checkbox" > <input id="col_vis_actions" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.actions.display" />
<input id="col_vis_state" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.state.display"/> <label for="col_vis_actions" ng-bind="$ctrl.columnVisibility.columns.actions.label"></label>
<label for="col_vis_state" ng-bind="$ctrl.columnVisibility.columns.state.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_actions" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.actions.display"/>
<label for="col_vis_actions" ng-bind="$ctrl.columnVisibility.columns.actions.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_stack" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.stack.display"/>
<label for="col_vis_stack" ng-bind="$ctrl.columnVisibility.columns.stack.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_image" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.image.display"/>
<label for="col_vis_image" ng-bind="$ctrl.columnVisibility.columns.image.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_created" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.created.display"/>
<label for="col_vis_created" ng-bind="$ctrl.columnVisibility.columns.created.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_ip" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.ip.display"/>
<label for="col_vis_ip" ng-bind="$ctrl.columnVisibility.columns.ip.label"></label>
</div>
<div class="md-checkbox" ng-if="$ctrl.showHostColumn">
<input id="col_vis_host" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.host.display"/>
<label for="col_vis_host" ng-bind="$ctrl.columnVisibility.columns.host.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_ports" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.ports.display"/>
<label for="col_vis_ports" ng-bind="$ctrl.columnVisibility.columns.ports.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_ownership" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.ownership.display"/>
<label for="col_vis_ownership" ng-bind="$ctrl.columnVisibility.columns.ownership.label"></label>
</div>
</div> </div>
<div> <div class="md-checkbox">
<a type="button" class="btn btn-default btn-sm" ng-click="$ctrl.columnVisibility.state.open = false;">Close</a> <input id="col_vis_stack" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.stack.display" />
<label for="col_vis_stack" ng-bind="$ctrl.columnVisibility.columns.stack.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_image" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.image.display" />
<label for="col_vis_image" ng-bind="$ctrl.columnVisibility.columns.image.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_created" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.created.display" />
<label for="col_vis_created" ng-bind="$ctrl.columnVisibility.columns.created.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_ip" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.ip.display" />
<label for="col_vis_ip" ng-bind="$ctrl.columnVisibility.columns.ip.label"></label>
</div>
<div class="md-checkbox" ng-if="$ctrl.showHostColumn">
<input id="col_vis_host" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.host.display" />
<label for="col_vis_host" ng-bind="$ctrl.columnVisibility.columns.host.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_ports" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.ports.display" />
<label for="col_vis_ports" ng-bind="$ctrl.columnVisibility.columns.ports.label"></label>
</div>
<div class="md-checkbox">
<input id="col_vis_ownership" ng-click="$ctrl.onColumnVisibilityChange()" type="checkbox" ng-model="$ctrl.columnVisibility.columns.ownership.display" />
<label for="col_vis_ownership" ng-bind="$ctrl.columnVisibility.columns.ownership.label"></label>
</div> </div>
</div> </div>
<div>
<a type="button" class="btn btn-default btn-sm" ng-click="$ctrl.columnVisibility.state.open = false;">Close</a>
</div>
</div> </div>
</div>
</span> </span>
<span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open"> <span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open">
<span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span> <span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span>
@ -66,12 +71,12 @@
</div> </div>
<div class="menuContent"> <div class="menuContent">
<div class="md-checkbox"> <div class="md-checkbox">
<input id="setting_container_trunc" type="checkbox" ng-model="$ctrl.settings.truncateContainerName" ng-change="$ctrl.onSettingsContainerNameTruncateChange()"/> <input id="setting_container_trunc" type="checkbox" ng-model="$ctrl.settings.truncateContainerName" ng-change="$ctrl.onSettingsContainerNameTruncateChange()" />
<label for="setting_container_trunc">Truncate container name</label> <label for="setting_container_trunc">Truncate container name</label>
</div> </div>
<div> <div>
<div class="md-checkbox"> <div class="md-checkbox">
<input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()"/> <input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()" />
<label for="setting_auto_refresh">Auto refresh</label> <label for="setting_auto_refresh">Auto refresh</label>
</div> </div>
<div ng-if="$ctrl.settings.repeater.autoRefresh"> <div ng-if="$ctrl.settings.repeater.autoRefresh">
@ -97,23 +102,23 @@
</div> </div>
<div class="menuContent"> <div class="menuContent">
<div class="md-checkbox" authorization="DockerContainerStats"> <div class="md-checkbox" authorization="DockerContainerStats">
<input id="setting_show_stats" type="checkbox" ng-model="$ctrl.settings.showQuickActionStats" ng-change="$ctrl.onSettingsQuickActionChange()"/> <input id="setting_show_stats" type="checkbox" ng-model="$ctrl.settings.showQuickActionStats" ng-change="$ctrl.onSettingsQuickActionChange()" />
<label for="setting_show_stats">Stats</label> <label for="setting_show_stats">Stats</label>
</div> </div>
<div class="md-checkbox" authorization="DockerContainerLogs"> <div class="md-checkbox" authorization="DockerContainerLogs">
<input id="setting_show_logs" type="checkbox" ng-model="$ctrl.settings.showQuickActionLogs" ng-change="$ctrl.onSettingsQuickActionChange()"/> <input id="setting_show_logs" type="checkbox" ng-model="$ctrl.settings.showQuickActionLogs" ng-change="$ctrl.onSettingsQuickActionChange()" />
<label for="setting_show_logs">Logs</label> <label for="setting_show_logs">Logs</label>
</div> </div>
<div class="md-checkbox" authorization="DockerExecStart"> <div class="md-checkbox" authorization="DockerExecStart">
<input id="setting_show_console" type="checkbox" ng-model="$ctrl.settings.showQuickActionExec" ng-change="$ctrl.onSettingsQuickActionChange()"/> <input id="setting_show_console" type="checkbox" ng-model="$ctrl.settings.showQuickActionExec" ng-change="$ctrl.onSettingsQuickActionChange()" />
<label for="setting_show_console">Console</label> <label for="setting_show_console">Console</label>
</div> </div>
<div class="md-checkbox" authorization="DockerContainerInspect"> <div class="md-checkbox" authorization="DockerContainerInspect">
<input id="setting_show_inspect" type="checkbox" ng-model="$ctrl.settings.showQuickActionInspect" ng-change="$ctrl.onSettingsQuickActionChange()"/> <input id="setting_show_inspect" type="checkbox" ng-model="$ctrl.settings.showQuickActionInspect" ng-change="$ctrl.onSettingsQuickActionChange()" />
<label for="setting_show_inspect">Inspect</label> <label for="setting_show_inspect">Inspect</label>
</div> </div>
<div class="md-checkbox" authorization="DockerContainerAttach"> <div class="md-checkbox" authorization="DockerContainerAttach">
<input id="setting_show_attach" type="checkbox" ng-model="$ctrl.settings.showQuickActionAttach" ng-change="$ctrl.onSettingsQuickActionChange()"/> <input id="setting_show_attach" type="checkbox" ng-model="$ctrl.settings.showQuickActionAttach" ng-change="$ctrl.onSettingsQuickActionChange()" />
<label for="setting_show_attach">Attach</label> <label for="setting_show_attach">Attach</label>
</div> </div>
</div> </div>
@ -126,7 +131,8 @@
</span> </span>
</div> </div>
</div> </div>
<containers-datatable-actions ng-if="!$ctrl.offlineMode" <containers-datatable-actions
ng-if="!$ctrl.offlineMode"
selected-items="$ctrl.state.selectedItems" selected-items="$ctrl.state.selectedItems"
selected-item-count="$ctrl.state.selectedItemCount" selected-item-count="$ctrl.state.selectedItemCount"
no-stopped-items-selected="$ctrl.state.noStoppedItemsSelected" no-stopped-items-selected="$ctrl.state.noStoppedItemsSelected"
@ -136,14 +142,26 @@
></containers-datatable-actions> ></containers-datatable-actions>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover table-filters nowrap-cells"> <table class="table table-hover table-filters nowrap-cells">
<thead> <thead>
<tr> <tr>
<th> <th>
<span class="md-checkbox" ng-if="!$ctrl.offlineMode" authorization="DockerContainerStart, DockerContainerStop, DockerContainerKill, DockerContainerRestart, DockerContainerPause, DockerContainerUnpause, DockerContainerDelete, DockerContainerCreate"> <span
class="md-checkbox"
ng-if="!$ctrl.offlineMode"
authorization="DockerContainerStart, DockerContainerStop, DockerContainerKill, DockerContainerRestart, DockerContainerPause, DockerContainerUnpause, DockerContainerDelete, DockerContainerCreate"
>
<input id="select_all" type="checkbox" ng-model="$ctrl.state.selectAll" ng-change="$ctrl.selectAll()" /> <input id="select_all" type="checkbox" ng-model="$ctrl.state.selectAll" ng-change="$ctrl.selectAll()" />
<label for="select_all"></label> <label for="select_all"></label>
</span> </span>
@ -170,7 +188,7 @@
</div> </div>
<div class="menuContent"> <div class="menuContent">
<div class="md-checkbox" ng-repeat="filter in $ctrl.filters.state.values track by $index"> <div class="md-checkbox" ng-repeat="filter in $ctrl.filters.state.values track by $index">
<input id="filter_state_{{ $index }}" type="checkbox" ng-model="filter.display" ng-change="$ctrl.onStateFilterChange()"/> <input id="filter_state_{{ $index }}" type="checkbox" ng-model="filter.display" ng-change="$ctrl.onStateFilterChange()" />
<label for="filter_state_{{ $index }}">{{ filter.label }}</label> <label for="filter_state_{{ $index }}">{{ filter.label }}</label>
</div> </div>
</div> </div>
@ -180,7 +198,17 @@
</div> </div>
</div> </div>
</th> </th>
<th ng-if="$ctrl.settings.showQuickActionStats || $ctrl.settings.showQuickActionLogs || $ctrl.settings.showQuickActionExec || $ctrl.settings.showQuickActionAttach|| $ctrl.settings.showQuickActionInspect" ng-show="$ctrl.columnVisibility.columns.actions.display" authorization="DockerContainerStats, DockerContainerLogs, DockerExecStart, DockerContainerInspect, DockerTaskInspect, DockerTaskLogs, DockerContainerAttach"> <th
ng-if="
$ctrl.settings.showQuickActionStats ||
$ctrl.settings.showQuickActionLogs ||
$ctrl.settings.showQuickActionExec ||
$ctrl.settings.showQuickActionAttach ||
$ctrl.settings.showQuickActionInspect
"
ng-show="$ctrl.columnVisibility.columns.actions.display"
authorization="DockerContainerStats, DockerContainerLogs, DockerExecStart, DockerContainerInspect, DockerTaskInspect, DockerTaskLogs, DockerContainerAttach"
>
Quick actions Quick actions
</th> </th>
<th ng-show="$ctrl.columnVisibility.columns.stack.display"> <th ng-show="$ctrl.columnVisibility.columns.stack.display">
@ -199,8 +227,8 @@
</th> </th>
<th ng-show="$ctrl.columnVisibility.columns.created.display"> <th ng-show="$ctrl.columnVisibility.columns.created.display">
<a ng-click="$ctrl.changeOrderBy('Created')"> <a ng-click="$ctrl.changeOrderBy('Created')">
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Created' && !$ctrl.state.reverseOrder"></i> <i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Created' && !$ctrl.state.reverseOrder"></i>
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Created' && $ctrl.state.reverseOrder"></i> <i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Created' && $ctrl.state.reverseOrder"></i>
Created Created
</a> </a>
</th> </th>
@ -235,39 +263,69 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td> <td>
<span class="md-checkbox" ng-if="!$ctrl.offlineMode" authorization="DockerContainerStart, DockerContainerStop, DockerContainerKill, DockerContainerRestart, DockerContainerPause, DockerContainerUnpause, DockerContainerDelete, DockerContainerCreate"> <span
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)"/> class="md-checkbox"
ng-if="!$ctrl.offlineMode"
authorization="DockerContainerStart, DockerContainerStop, DockerContainerKill, DockerContainerRestart, DockerContainerPause, DockerContainerUnpause, DockerContainerDelete, DockerContainerCreate"
>
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)" />
<label for="select_{{ $index }}"></label> <label for="select_{{ $index }}"></label>
</span> </span>
<a ng-if="!$ctrl.offlineMode" ui-sref="docker.containers.container({ id: item.Id, nodeName: item.NodeName })" title="{{ item | containername }}">{{ item | containername | truncate: $ctrl.settings.containerNameTruncateSize }}</a> <a ng-if="!$ctrl.offlineMode" ui-sref="docker.containers.container({ id: item.Id, nodeName: item.NodeName })" title="{{ item | containername }}">{{
item | containername | truncate: $ctrl.settings.containerNameTruncateSize
}}</a>
<span ng-if="$ctrl.offlineMode">{{ item | containername | truncate: $ctrl.settings.containerNameTruncateSize }}</span> <span ng-if="$ctrl.offlineMode">{{ item | containername | truncate: $ctrl.settings.containerNameTruncateSize }}</span>
</td> </td>
<td ng-show="$ctrl.columnVisibility.columns.state.display"> <td ng-show="$ctrl.columnVisibility.columns.state.display">
<span ng-if="['starting','healthy','unhealthy'].indexOf(item.Status) !== -1" class="label label-{{ item.Status|containerstatusbadge }} interactive" uib-tooltip="This container has a health check">{{ item.Status }}</span> <span
<span ng-if="['starting','healthy','unhealthy'].indexOf(item.Status) === -1" class="label label-{{ item.Status|containerstatusbadge }}">{{ item.Status }}</span> ng-if="['starting', 'healthy', 'unhealthy'].indexOf(item.Status) !== -1"
class="label label-{{ item.Status | containerstatusbadge }} interactive"
uib-tooltip="This container has a health check"
>{{ item.Status }}</span
>
<span ng-if="['starting', 'healthy', 'unhealthy'].indexOf(item.Status) === -1" class="label label-{{ item.Status | containerstatusbadge }}">{{ item.Status }}</span>
</td> </td>
<td ng-if="!$ctrl.offlineMode && ($ctrl.settings.showQuickActionStats || $ctrl.settings.showQuickActionLogs || $ctrl.settings.showQuickActionExec || $ctrl.settings.showQuickActionAttach || $ctrl.settings.showQuickActionInspect)" ng-show="$ctrl.columnVisibility.columns.actions.display" authorization="DockerContainerStats, DockerContainerLogs, DockerExecStart, DockerContainerInspect, DockerTaskInspect, DockerTaskLogs"> <td
ng-if="
!$ctrl.offlineMode &&
($ctrl.settings.showQuickActionStats ||
$ctrl.settings.showQuickActionLogs ||
$ctrl.settings.showQuickActionExec ||
$ctrl.settings.showQuickActionAttach ||
$ctrl.settings.showQuickActionInspect)
"
ng-show="$ctrl.columnVisibility.columns.actions.display"
authorization="DockerContainerStats, DockerContainerLogs, DockerExecStart, DockerContainerInspect, DockerTaskInspect, DockerTaskLogs"
>
<container-quick-actions container-id="item.Id" node-name="item.NodeName" status="item.Status" state="$ctrl.settings"></container-quick-actions> <container-quick-actions container-id="item.Id" node-name="item.NodeName" status="item.Status" state="$ctrl.settings"></container-quick-actions>
</td> </td>
<td ng-if="$ctrl.offlineMode"> <td ng-if="$ctrl.offlineMode"> </td>
</td>
<td ng-show="$ctrl.columnVisibility.columns.stack.display">{{ item.StackName ? item.StackName : '-' }}</td> <td ng-show="$ctrl.columnVisibility.columns.stack.display">{{ item.StackName ? item.StackName : '-' }}</td>
<td ng-show="$ctrl.columnVisibility.columns.image.display"> <td ng-show="$ctrl.columnVisibility.columns.image.display">
<a ng-if="!$ctrl.offlineMode" ui-sref="docker.images.image({ id: item.Image })">{{ item.Image | trimshasum }}</a> <a ng-if="!$ctrl.offlineMode" ui-sref="docker.images.image({ id: item.Image })">{{ item.Image | trimshasum }}</a>
<span ng-if="$ctrl.offlineMode">{{ item.Image | trimshasum }}</span> <span ng-if="$ctrl.offlineMode">{{ item.Image | trimshasum }}</span>
</td> </td>
<td ng-show="$ctrl.columnVisibility.columns.created.display"> <td ng-show="$ctrl.columnVisibility.columns.created.display">
{{item.Created | getisodatefromtimestamp}} {{ item.Created | getisodatefromtimestamp }}
</td> </td>
<td ng-show="$ctrl.columnVisibility.columns.ip.display">{{ item.IP ? item.IP : '-' }}</td> <td ng-show="$ctrl.columnVisibility.columns.ip.display">{{ item.IP ? item.IP : '-' }}</td>
<td ng-if="$ctrl.showHostColumn" ng-show="$ctrl.columnVisibility.columns.host.display">{{ item.NodeName ? item.NodeName : '-' }}</td> <td ng-if="$ctrl.showHostColumn" ng-show="$ctrl.columnVisibility.columns.host.display">{{ item.NodeName ? item.NodeName : '-' }}</td>
<td ng-show="$ctrl.columnVisibility.columns.ports.display"> <td ng-show="$ctrl.columnVisibility.columns.ports.display">
<a ng-if="item.Ports.length > 0" ng-repeat="p in item.Ports" class="image-tag" ng-href="http://{{ $ctrl.state.publicURL || p.host }}:{{p.public}}" target="_blank"> <a
ng-if="item.Ports.length > 0"
ng-repeat="p in item.Ports"
class="image-tag"
ng-href="http://{{ $ctrl.state.publicURL || p.host }}:{{ p.public }}"
target="_blank"
>
<i class="fa fa-external-link-alt" aria-hidden="true"></i> {{ p.public }}:{{ p.private }} <i class="fa fa-external-link-alt" aria-hidden="true"></i> {{ p.public }}:{{ p.private }}
</a> </a>
<span ng-if="item.Ports.length == 0" >-</span> <span ng-if="item.Ports.length == 0">-</span>
</td> </td>
<td ng-if="$ctrl.showOwnershipColumn" ng-show="$ctrl.columnVisibility.columns.ownership.display"> <td ng-if="$ctrl.showOwnershipColumn" ng-show="$ctrl.columnVisibility.columns.ownership.display">
<span> <span>
@ -286,9 +344,7 @@
</table> </table>
</div> </div>
<div class="footer" ng-if="$ctrl.dataset"> <div class="footer" ng-if="$ctrl.dataset">
<div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> <div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> {{ $ctrl.state.selectedItemCount }} item(s) selected </div>
{{ $ctrl.state.selectedItemCount }} item(s) selected
</div>
<div class="paginationControls"> <div class="paginationControls">
<form class="form-inline"> <form class="form-inline">
<span class="limitSelector"> <span class="limitSelector">

4
app/docker/components/datatables/containers-datatable/containersDatatable.js
View File

@ -12,6 +12,6 @@ angular.module('portainer.docker').component('containersDatatable', {
showHostColumn: '<', showHostColumn: '<',
showAddAction: '<', showAddAction: '<',
offlineMode: '<', offlineMode: '<',
refreshCallback: '<' refreshCallback: '<',
} },
}); });

367
app/docker/components/datatables/containers-datatable/containersDatatableController.js
View File

@ -1,207 +1,210 @@
import _ from 'lodash-es'; import _ from 'lodash-es';
angular.module('portainer.docker') angular.module('portainer.docker').controller('ContainersDatatableController', [
.controller('ContainersDatatableController', ['$scope', '$controller', 'DatatableService', 'EndpointProvider', '$scope',
function ($scope, $controller, DatatableService, EndpointProvider) { '$controller',
'DatatableService',
'EndpointProvider',
function ($scope, $controller, DatatableService, EndpointProvider) {
angular.extend(this, $controller('GenericDatatableController', { $scope: $scope }));
angular.extend(this, $controller('GenericDatatableController', {$scope: $scope})); var ctrl = this;
var ctrl = this; this.state = Object.assign(this.state, {
noStoppedItemsSelected: true,
noRunningItemsSelected: true,
noPausedItemsSelected: true,
publicURL: EndpointProvider.endpointPublicURL(),
});
this.state = Object.assign(this.state, { this.settings = Object.assign(this.settings, {
noStoppedItemsSelected: true, truncateContainerName: true,
noRunningItemsSelected: true, containerNameTruncateSize: 32,
noPausedItemsSelected: true, showQuickActionStats: true,
publicURL: EndpointProvider.endpointPublicURL() showQuickActionLogs: true,
}); showQuickActionExec: true,
showQuickActionInspect: true,
showQuickActionAttach: false,
});
this.settings = Object.assign(this.settings, { this.filters = {
truncateContainerName: true,
containerNameTruncateSize: 32,
showQuickActionStats: true,
showQuickActionLogs: true,
showQuickActionExec: true,
showQuickActionInspect: true,
showQuickActionAttach: false
});
this.filters = {
state: {
open: false,
enabled: false,
values: []
}
};
this.columnVisibility = {
state: {
open: false
},
columns: {
state: { state: {
label: 'State', open: false,
display: true enabled: false,
values: [],
}, },
actions: { };
label: 'Quick Actions',
display: true this.columnVisibility = {
state: {
open: false,
}, },
stack: { columns: {
label: 'Stack', state: {
display: true label: 'State',
display: true,
},
actions: {
label: 'Quick Actions',
display: true,
},
stack: {
label: 'Stack',
display: true,
},
image: {
label: 'Image',
display: true,
},
created: {
label: 'Created',
display: true,
},
ip: {
label: 'IP Address',
display: true,
},
host: {
label: 'Host',
display: true,
},
ports: {
label: 'Published Ports',
display: true,
},
ownership: {
label: 'Ownership',
display: true,
},
}, },
image: { };
label: 'Image',
display: true this.onColumnVisibilityChange = function () {
}, DatatableService.setColumnVisibilitySettings(this.tableKey, this.columnVisibility);
created: { };
label: 'Created',
display: true this.onSelectionChanged = function () {
}, this.updateSelectionState();
ip: { };
label: 'IP Address',
display: true this.updateSelectionState = function () {
}, this.state.noStoppedItemsSelected = true;
host: { this.state.noRunningItemsSelected = true;
label: 'Host', this.state.noPausedItemsSelected = true;
display: true
}, for (var i = 0; i < this.dataset.length; i++) {
ports: { var item = this.dataset[i];
label: 'Published Ports', if (item.Checked) {
display: true this.updateSelectionStateBasedOnItemStatus(item);
}, }
ownership: {
label: 'Ownership',
display: true
} }
} };
};
this.onColumnVisibilityChange = function() { this.updateSelectionStateBasedOnItemStatus = function (item) {
DatatableService.setColumnVisibilitySettings(this.tableKey, this.columnVisibility); if (item.Status === 'paused') {
}; this.state.noPausedItemsSelected = false;
} else if (['stopped', 'created'].indexOf(item.Status) !== -1) {
this.onSelectionChanged = function() { this.state.noStoppedItemsSelected = false;
this.updateSelectionState(); } else if (['running', 'healthy', 'unhealthy', 'starting'].indexOf(item.Status) !== -1) {
} this.state.noRunningItemsSelected = false;
this.updateSelectionState = function() {
this.state.noStoppedItemsSelected = true;
this.state.noRunningItemsSelected = true;
this.state.noPausedItemsSelected = true;
for (var i = 0; i < this.dataset.length; i++) {
var item = this.dataset[i];
if (item.Checked) {
this.updateSelectionStateBasedOnItemStatus(item);
} }
} };
};
this.updateSelectionStateBasedOnItemStatus = function(item) { this.applyFilters = function (value) {
if (item.Status === 'paused') { var container = value;
this.state.noPausedItemsSelected = false; var filters = ctrl.filters;
} else if (['stopped', 'created'].indexOf(item.Status) !== -1) { for (var i = 0; i < filters.state.values.length; i++) {
this.state.noStoppedItemsSelected = false; var filter = filters.state.values[i];
} else if (['running', 'healthy', 'unhealthy', 'starting'].indexOf(item.Status) !== -1) { if (container.Status === filter.label && filter.display) {
this.state.noRunningItemsSelected = false; return true;
} }
};
this.applyFilters = function(value) {
var container = value;
var filters = ctrl.filters;
for (var i = 0; i < filters.state.values.length; i++) {
var filter = filters.state.values[i];
if (container.Status === filter.label && filter.display) {
return true;
} }
} return false;
return false; };
};
this.onStateFilterChange = function() { this.onStateFilterChange = function () {
var filters = this.filters.state.values; var filters = this.filters.state.values;
var filtered = false; var filtered = false;
for (var i = 0; i < filters.length; i++) { for (var i = 0; i < filters.length; i++) {
var filter = filters[i]; var filter = filters[i];
if (!filter.display) { if (!filter.display) {
filtered = true; filtered = true;
}
} }
} this.filters.state.enabled = filtered;
this.filters.state.enabled = filtered; };
};
this.onSettingsContainerNameTruncateChange = function() { this.onSettingsContainerNameTruncateChange = function () {
if (this.settings.truncateContainerName) { if (this.settings.truncateContainerName) {
this.settings.containerNameTruncateSize = 32; this.settings.containerNameTruncateSize = 32;
} else { } else {
this.settings.containerNameTruncateSize = 256; this.settings.containerNameTruncateSize = 256;
}
DatatableService.setDataTableSettings(this.tableKey, this.settings);
};
this.onSettingsQuickActionChange = function() {
DatatableService.setDataTableSettings(this.tableKey, this.settings);
};
this.prepareTableFromDataset = function() {
var availableStateFilters = [];
for (var i = 0; i < this.dataset.length; i++) {
var item = this.dataset[i];
availableStateFilters.push({ label: item.Status, display: true });
}
this.filters.state.values = _.uniqBy(availableStateFilters, 'label');
};
this.updateStoredFilters = function(storedFilters) {
var datasetFilters = this.filters.state.values;
for (var i = 0; i < datasetFilters.length; i++) {
var filter = datasetFilters[i];
var existingFilter = _.find(storedFilters, ['label', filter.label]);
if (existingFilter && !existingFilter.display) {
filter.display = existingFilter.display;
this.filters.state.enabled = true;
} }
} DatatableService.setDataTableSettings(this.tableKey, this.settings);
}; };
this.$onInit = function() { this.onSettingsQuickActionChange = function () {
this.setDefaults(); DatatableService.setDataTableSettings(this.tableKey, this.settings);
this.prepareTableFromDataset(); };
this.state.orderBy = this.orderBy; this.prepareTableFromDataset = function () {
var storedOrder = DatatableService.getDataTableOrder(this.tableKey); var availableStateFilters = [];
if (storedOrder !== null) { for (var i = 0; i < this.dataset.length; i++) {
this.state.reverseOrder = storedOrder.reverse; var item = this.dataset[i];
this.state.orderBy = storedOrder.orderBy; availableStateFilters.push({ label: item.Status, display: true });
} }
this.filters.state.values = _.uniqBy(availableStateFilters, 'label');
};
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey); this.updateStoredFilters = function (storedFilters) {
if (textFilter !== null) { var datasetFilters = this.filters.state.values;
this.state.textFilter = textFilter;
this.onTextFilterChange();
}
var storedFilters = DatatableService.getDataTableFilters(this.tableKey); for (var i = 0; i < datasetFilters.length; i++) {
if (storedFilters !== null) { var filter = datasetFilters[i];
this.filters = storedFilters; var existingFilter = _.find(storedFilters, ['label', filter.label]);
this.filters.state.open = false; if (existingFilter && !existingFilter.display) {
this.updateStoredFilters(storedFilters.state.values); filter.display = existingFilter.display;
} this.filters.state.enabled = true;
}
}
};
var storedSettings = DatatableService.getDataTableSettings(this.tableKey); this.$onInit = function () {
if (storedSettings !== null) { this.setDefaults();
this.settings = storedSettings; this.prepareTableFromDataset();
this.settings.open = false;
}
this.onSettingsRepeaterChange();
var storedColumnVisibility = DatatableService.getColumnVisibilitySettings(this.tableKey); this.state.orderBy = this.orderBy;
if (storedColumnVisibility !== null) { var storedOrder = DatatableService.getDataTableOrder(this.tableKey);
this.columnVisibility = storedColumnVisibility; if (storedOrder !== null) {
this.columnVisibility.state.open = false; this.state.reverseOrder = storedOrder.reverse;
} this.state.orderBy = storedOrder.orderBy;
}; }
}]);
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
if (textFilter !== null) {
this.state.textFilter = textFilter;
this.onTextFilterChange();
}
var storedFilters = DatatableService.getDataTableFilters(this.tableKey);
if (storedFilters !== null) {
this.filters = storedFilters;
this.filters.state.open = false;
this.updateStoredFilters(storedFilters.state.values);
}
var storedSettings = DatatableService.getDataTableSettings(this.tableKey);
if (storedSettings !== null) {
this.settings = storedSettings;
this.settings.open = false;
}
this.onSettingsRepeaterChange();
var storedColumnVisibility = DatatableService.getColumnVisibilitySettings(this.tableKey);
if (storedColumnVisibility !== null) {
this.columnVisibility = storedColumnVisibility;
this.columnVisibility.state.open = false;
}
};
},
]);

19
app/docker/components/datatables/events-datatable/eventsDatatable.html
View File

@ -2,13 +2,19 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
@ -38,7 +44,10 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td>{{ item.Time | getisodatefromtimestamp }}</td> <td>{{ item.Time | getisodatefromtimestamp }}</td>
<td>{{ item.Type }}</td> <td>{{ item.Type }}</td>
<td>{{ item.Details }}</td> <td>{{ item.Details }}</td>

4
app/docker/components/datatables/events-datatable/eventsDatatable.js
View File

@ -7,6 +7,6 @@ angular.module('portainer.docker').component('eventsDatatable', {
dataset: '<', dataset: '<',
tableKey: '@', tableKey: '@',
orderBy: '@', orderBy: '@',
reverseOrder: '<' reverseOrder: '<',
} },
}); });

38
app/docker/components/datatables/host-jobs-datatable/jobsDatatable.html
View File

@ -16,7 +16,15 @@
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover table-filters nowrap-cells"> <table class="table table-hover table-filters nowrap-cells">
@ -36,10 +44,8 @@
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Status' && $ctrl.state.reverseOrder"></i> <i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Status' && $ctrl.state.reverseOrder"></i>
</a> </a>
<div> <div>
<span uib-dropdown-toggle class="table-filter" ng-if="!$ctrl.filters.state.enabled"> Filter <span uib-dropdown-toggle class="table-filter" ng-if="!$ctrl.filters.state.enabled"> Filter <i class="fa fa-filter" aria-hidden="true"></i></span>
<i class="fa fa-filter" aria-hidden="true"></i></span> <span uib-dropdown-toggle class="table-filter filter-active" ng-if="$ctrl.filters.state.enabled">Filter <i class="fa fa-check" aria-hidden="true"></i></span>
<span uib-dropdown-toggle class="table-filter filter-active" ng-if="$ctrl.filters.state.enabled">Filter
<i class="fa fa-check" aria-hidden="true"></i></span>
</div> </div>
<div class="dropdown-menu" uib-dropdown-menu> <div class="dropdown-menu" uib-dropdown-menu>
<div class="tableMenu"> <div class="tableMenu">
@ -68,19 +74,25 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
>
<td> <td>
<a ui-sref="docker.containers.container.logs({ id: item.Id, nodeName: item.NodeName })" title="{{ item.Id }}"> <a ui-sref="docker.containers.container.logs({ id: item.Id, nodeName: item.NodeName })" title="{{ item.Id }}"> {{ item | containername }}</a>
{{ item | containername }}</a>
</td> </td>
<td> <td>
<span ng-if="['starting','healthy','unhealthy'].indexOf(item.Status) !== -1" class="label label-{{ item.Status|containerstatusbadge }} interactive" <span
uib-tooltip="This container has a health check">{{ item.Status }}</span> ng-if="['starting', 'healthy', 'unhealthy'].indexOf(item.Status) !== -1"
<span ng-if="['starting','healthy','unhealthy'].indexOf(item.Status) === -1" class="label label-{{ item.Status|containerstatusbadge }}"> class="label label-{{ item.Status | containerstatusbadge }} interactive"
{{ item.Status }}</span> uib-tooltip="This container has a health check"
>{{ item.Status }}</span
>
<span ng-if="['starting', 'healthy', 'unhealthy'].indexOf(item.Status) === -1" class="label label-{{ item.Status | containerstatusbadge }}">
{{ item.Status }}</span
>
</td> </td>
<td> <td>
{{item.Created | getisodatefromtimestamp}} {{ item.Created | getisodatefromtimestamp }}
</td> </td>
</tr> </tr>
<tr ng-if="!$ctrl.dataset"> <tr ng-if="!$ctrl.dataset">

4
app/docker/components/datatables/host-jobs-datatable/jobsDatatable.js
View File

@ -7,6 +7,6 @@ angular.module('portainer.docker').component('jobsDatatable', {
dataset: '<', dataset: '<',
tableKey: '@', tableKey: '@',
orderBy: '@', orderBy: '@',
reverseOrder: '<' reverseOrder: '<',
} },
}); });

257
app/docker/components/datatables/host-jobs-datatable/jobsDatatableController.js
View File

@ -1,141 +1,150 @@
import _ from 'lodash-es'; import _ from 'lodash-es';
angular.module('portainer.docker') angular.module('portainer.docker').controller('JobsDatatableController', [
.controller('JobsDatatableController', ['$scope', '$controller', '$q', '$state', 'PaginationService', 'DatatableService', 'ContainerService', 'ModalService', 'Notifications', '$scope',
function ($scope, $controller, $q, $state, PaginationService, DatatableService, ContainerService, ModalService, Notifications) { '$controller',
'$q',
'$state',
'PaginationService',
'DatatableService',
'ContainerService',
'ModalService',
'Notifications',
function ($scope, $controller, $q, $state, PaginationService, DatatableService, ContainerService, ModalService, Notifications) {
angular.extend(this, $controller('GenericDatatableController', { $scope: $scope }));
angular.extend(this, $controller('GenericDatatableController', {$scope: $scope})); var ctrl = this;
var ctrl = this; this.filters = {
state: {
open: false,
enabled: false,
values: [],
},
};
this.filters = { this.applyFilters = function (value) {
state: { var container = value;
open: false, var filters = ctrl.filters;
enabled: false, for (var i = 0; i < filters.state.values.length; i++) {
values: [] var filter = filters.state.values[i];
} if (container.Status === filter.label && filter.display) {
}; return true;
this.applyFilters = function (value) {
var container = value;
var filters = ctrl.filters;
for (var i = 0; i < filters.state.values.length; i++) {
var filter = filters.state.values[i];
if (container.Status === filter.label && filter.display) {
return true;
}
}
return false;
};
this.onStateFilterChange = function () {
var filters = this.filters.state.values;
var filtered = false;
for (var i = 0; i < filters.length; i++) {
var filter = filters[i];
if (!filter.display) {
filtered = true;
}
}
this.filters.state.enabled = filtered;
DatatableService.setDataTableFilters(this.tableKey, this.filters);
};
this.prepareTableFromDataset = function () {
var availableStateFilters = [];
for (var i = 0; i < this.dataset.length; i++) {
var item = this.dataset[i];
availableStateFilters.push({
label: item.Status,
display: true
});
}
this.filters.state.values = _.uniqBy(availableStateFilters, 'label');
};
this.updateStoredFilters = function (storedFilters) {
var datasetFilters = this.filters.state.values;
for (var i = 0; i < datasetFilters.length; i++) {
var filter = datasetFilters[i];
var existingFilter = _.find(storedFilters, ['label', filter.label]);
if (existingFilter && !existingFilter.display) {
filter.display = existingFilter.display;
this.filters.state.enabled = true;
}
}
};
function confirmPurgeJobs() {
return showConfirmationModal();
function showConfirmationModal() {
var deferred = $q.defer();
ModalService.confirm({
title: 'Are you sure ?',
message: 'Clearing job history will remove all stopped jobs containers.',
buttons: {
confirm: {
label: 'Purge',
className: 'btn-danger'
}
},
callback: function onConfirm(confirmed) {
deferred.resolve(confirmed);
}
});
return deferred.promise;
} }
} }
return false;
};
this.purgeAction = function () { this.onStateFilterChange = function () {
confirmPurgeJobs().then(function success(confirmed) { var filters = this.filters.state.values;
if (!confirmed) { var filtered = false;
return $q.when(); for (var i = 0; i < filters.length; i++) {
} var filter = filters[i];
ContainerService.prune({ label: ['io.portainer.job.endpoint'] }).then(function success() { if (!filter.display) {
filtered = true;
}
}
this.filters.state.enabled = filtered;
DatatableService.setDataTableFilters(this.tableKey, this.filters);
};
this.prepareTableFromDataset = function () {
var availableStateFilters = [];
for (var i = 0; i < this.dataset.length; i++) {
var item = this.dataset[i];
availableStateFilters.push({
label: item.Status,
display: true,
});
}
this.filters.state.values = _.uniqBy(availableStateFilters, 'label');
};
this.updateStoredFilters = function (storedFilters) {
var datasetFilters = this.filters.state.values;
for (var i = 0; i < datasetFilters.length; i++) {
var filter = datasetFilters[i];
var existingFilter = _.find(storedFilters, ['label', filter.label]);
if (existingFilter && !existingFilter.display) {
filter.display = existingFilter.display;
this.filters.state.enabled = true;
}
}
};
function confirmPurgeJobs() {
return showConfirmationModal();
function showConfirmationModal() {
var deferred = $q.defer();
ModalService.confirm({
title: 'Are you sure ?',
message: 'Clearing job history will remove all stopped jobs containers.',
buttons: {
confirm: {
label: 'Purge',
className: 'btn-danger',
},
},
callback: function onConfirm(confirmed) {
deferred.resolve(confirmed);
},
});
return deferred.promise;
}
}
this.purgeAction = function () {
confirmPurgeJobs().then(function success(confirmed) {
if (!confirmed) {
return $q.when();
}
ContainerService.prune({ label: ['io.portainer.job.endpoint'] })
.then(function success() {
Notifications.success('Success', 'Job history cleared'); Notifications.success('Success', 'Job history cleared');
$state.reload(); $state.reload();
}).catch(function error(err) { })
.catch(function error(err) {
Notifications.error('Failure', err.message, 'Unable to clear job history'); Notifications.error('Failure', err.message, 'Unable to clear job history');
}); });
}); });
}; };
this.$onInit = function() { this.$onInit = function () {
this.setDefaults(); this.setDefaults();
this.prepareTableFromDataset(); this.prepareTableFromDataset();
this.state.orderBy = this.orderBy; this.state.orderBy = this.orderBy;
var storedOrder = DatatableService.getDataTableOrder(this.tableKey); var storedOrder = DatatableService.getDataTableOrder(this.tableKey);
if (storedOrder !== null) { if (storedOrder !== null) {
this.state.reverseOrder = storedOrder.reverse; this.state.reverseOrder = storedOrder.reverse;
this.state.orderBy = storedOrder.orderBy; this.state.orderBy = storedOrder.orderBy;
} }
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey); var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
if (textFilter !== null) { if (textFilter !== null) {
this.state.textFilter = textFilter; this.state.textFilter = textFilter;
this.onTextFilterChange(); this.onTextFilterChange();
} }
var storedFilters = DatatableService.getDataTableFilters(this.tableKey); var storedFilters = DatatableService.getDataTableFilters(this.tableKey);
if (storedFilters !== null) { if (storedFilters !== null) {
this.filters = storedFilters; this.filters = storedFilters;
this.updateStoredFilters(storedFilters.state.values); this.updateStoredFilters(storedFilters.state.values);
} }
if (this.filters && this.filters.state) { if (this.filters && this.filters.state) {
this.filters.state.open = false; this.filters.state.open = false;
} }
var storedSettings = DatatableService.getDataTableSettings(this.tableKey); var storedSettings = DatatableService.getDataTableSettings(this.tableKey);
if (storedSettings !== null) { if (storedSettings !== null) {
this.settings = storedSettings; this.settings = storedSettings;
this.settings.open = false; this.settings.open = false;
} }
this.onSettingsRepeaterChange(); this.onSettingsRepeaterChange();
}; };
} },
]); ]);

67
app/docker/components/datatables/images-datatable/imagesDatatable.html
View File

@ -2,9 +2,7 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
<div class="settings"> <div class="settings">
<span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open"> <span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open">
<span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span> <span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span>
@ -16,7 +14,7 @@
<div class="menuContent"> <div class="menuContent">
<div> <div>
<div class="md-checkbox"> <div class="md-checkbox">
<input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()"/> <input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()" />
<label for="setting_auto_refresh">Auto refresh</label> <label for="setting_auto_refresh">Auto refresh</label>
</div> </div>
<div ng-if="$ctrl.settings.repeater.autoRefresh"> <div ng-if="$ctrl.settings.repeater.autoRefresh">
@ -46,11 +44,17 @@
</div> </div>
<div class="actionBar" ng-if="!$ctrl.offlineMode" authorization="DockerImageDelete, DockerImageBuild, DockerImageLoad, DockerImageGet"> <div class="actionBar" ng-if="!$ctrl.offlineMode" authorization="DockerImageDelete, DockerImageBuild, DockerImageLoad, DockerImageGet">
<div class="btn-group" authorization="DockerImageDelete"> <div class="btn-group" authorization="DockerImageDelete">
<button type="button" class="btn btn-sm btn-danger" <button type="button" class="btn btn-sm btn-danger" ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems, false)">
ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems, false)">
<i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove <i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove
</button> </button>
<button type="button" class="btn btn-sm btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" ng-disabled="$ctrl.state.selectedItemCount === 0"> <button
type="button"
class="btn btn-sm btn-danger dropdown-toggle"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
ng-disabled="$ctrl.state.selectedItemCount === 0"
>
<span class="caret"></span> <span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span> <span class="sr-only">Toggle Dropdown</span>
</button> </button>
@ -63,19 +67,33 @@
</button> </button>
<div class="btn-group"> <div class="btn-group">
<button type="button" class="btn btn-sm btn-primary" ng-disabled="$ctrl.exportInProgress" ui-sref="docker.images.import" authorization="DockerImageLoad"> <button type="button" class="btn btn-sm btn-primary" ng-disabled="$ctrl.exportInProgress" ui-sref="docker.images.import" authorization="DockerImageLoad">
<i class="fa fa-upload space-right" aria-hidden="true"></i>Import <i class="fa fa-upload space-right" aria-hidden="true"></i>Import
</button> </button>
<button type="button" class="btn btn-sm btn-primary" ng-disabled="$ctrl.state.selectedItemCount === 0 || $ctrl.exportInProgress" <button
ng-click="$ctrl.downloadAction($ctrl.state.selectedItems)" button-spinner="$ctrl.exportInProgress" authorization="DockerImageGet"> type="button"
<i class="fa fa-download space-right" aria-hidden="true"></i> class="btn btn-sm btn-primary"
<span ng-hide="$ctrl.exportInProgress">Export</span> ng-disabled="$ctrl.state.selectedItemCount === 0 || $ctrl.exportInProgress"
<span ng-show="$ctrl.exportInProgress">Export in progress...</span> ng-click="$ctrl.downloadAction($ctrl.state.selectedItems)"
button-spinner="$ctrl.exportInProgress"
authorization="DockerImageGet"
>
<i class="fa fa-download space-right" aria-hidden="true"></i>
<span ng-hide="$ctrl.exportInProgress">Export</span>
<span ng-show="$ctrl.exportInProgress">Export in progress...</span>
</button> </button>
</div> </div>
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover table-filters nowrap-cells"> <table class="table table-hover table-filters nowrap-cells">
@ -102,11 +120,11 @@
</div> </div>
<div class="menuContent"> <div class="menuContent">
<div class="md-checkbox"> <div class="md-checkbox">
<input id="filter_usage_usedImages" type="checkbox" ng-model="$ctrl.filters.state.showUsedImages" ng-change="$ctrl.onUsageFilterChange()"/> <input id="filter_usage_usedImages" type="checkbox" ng-model="$ctrl.filters.state.showUsedImages" ng-change="$ctrl.onUsageFilterChange()" />
<label for="filter_usage_usedImages">Used images</label> <label for="filter_usage_usedImages">Used images</label>
</div> </div>
<div class="md-checkbox"> <div class="md-checkbox">
<input id="filter_usage_unusedImages" type="checkbox" ng-model="$ctrl.filters.state.showUnusedImages" ng-change="$ctrl.onUsageFilterChange()"/> <input id="filter_usage_unusedImages" type="checkbox" ng-model="$ctrl.filters.state.showUnusedImages" ng-change="$ctrl.onUsageFilterChange()" />
<label for="filter_usage_unusedImages">Unused images</label> <label for="filter_usage_unusedImages">Unused images</label>
</div> </div>
</div> </div>
@ -147,14 +165,19 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td> <td>
<span class="md-checkbox" ng-if="!$ctrl.offlineMode"> <span class="md-checkbox" ng-if="!$ctrl.offlineMode">
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)"/> <input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)" />
<label for="select_{{ $index }}"></label> <label for="select_{{ $index }}"></label>
</span> </span>
<a ng-if="!$ctrl.offlineMode" ui-sref="docker.images.image({ id: item.Id, nodeName: item.NodeName })" class="monospaced" title="{{ item.Id }}">{{ item.Id | truncate:40 }}</a> <a ng-if="!$ctrl.offlineMode" ui-sref="docker.images.image({ id: item.Id, nodeName: item.NodeName })" class="monospaced" title="{{ item.Id }}">{{
<span ng-if="$ctrl.offlineMode">{{ item.Id | truncate:40 }}</span> item.Id | truncate: 40
}}</a>
<span ng-if="$ctrl.offlineMode">{{ item.Id | truncate: 40 }}</span>
<span style="margin-left: 10px;" class="label label-warning image-tag" ng-if="::item.ContainerCount === 0">Unused</span> <span style="margin-left: 10px;" class="label label-warning image-tag" ng-if="::item.ContainerCount === 0">Unused</span>
</td> </td>
<td> <td>
@ -174,9 +197,7 @@
</table> </table>
</div> </div>
<div class="footer" ng-if="$ctrl.dataset"> <div class="footer" ng-if="$ctrl.dataset">
<div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> <div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> {{ $ctrl.state.selectedItemCount }} item(s) selected </div>
{{ $ctrl.state.selectedItemCount }} item(s) selected
</div>
<div class="paginationControls"> <div class="paginationControls">
<form class="form-inline"> <form class="form-inline">
<span class="limitSelector"> <span class="limitSelector">

4
app/docker/components/datatables/images-datatable/imagesDatatable.js
View File

@ -14,6 +14,6 @@ angular.module('portainer.docker').component('imagesDatatable', {
forceRemoveAction: '<', forceRemoveAction: '<',
exportInProgress: '<', exportInProgress: '<',
offlineMode: '<', offlineMode: '<',
refreshCallback: '<' refreshCallback: '<',
} },
}); });

123
app/docker/components/datatables/images-datatable/imagesDatatableController.js
View File

@ -1,71 +1,72 @@
angular.module('portainer.docker') angular.module('portainer.docker').controller('ImagesDatatableController', [
.controller('ImagesDatatableController', ['$scope', '$controller', 'DatatableService', '$scope',
function ($scope, $controller, DatatableService) { '$controller',
'DatatableService',
function ($scope, $controller, DatatableService) {
angular.extend(this, $controller('GenericDatatableController', { $scope: $scope }));
angular.extend(this, $controller('GenericDatatableController', {$scope: $scope})); var ctrl = this;
var ctrl = this; this.filters = {
state: {
open: false,
enabled: false,
showUsedImages: true,
showUnusedImages: true,
},
};
this.filters = { this.applyFilters = function (value) {
state: { var image = value;
open: false, var filters = ctrl.filters;
enabled: false, if ((image.ContainerCount === 0 && filters.state.showUnusedImages) || (image.ContainerCount !== 0 && filters.state.showUsedImages)) {
showUsedImages: true, return true;
showUnusedImages: true }
} return false;
}; };
this.applyFilters = function(value) { this.onstateFilterChange = function () {
var image = value; var filters = this.filters.state;
var filters = ctrl.filters; var filtered = false;
if ((image.ContainerCount === 0 && filters.state.showUnusedImages) if (!filters.showUsedImages || !filters.showUnusedImages) {
|| (image.ContainerCount !== 0 && filters.state.showUsedImages)) { filtered = true;
return true; }
} this.filters.state.enabled = filtered;
return false; DatatableService.setDataTableFilters(this.tableKey, this.filters);
}; };
this.onstateFilterChange = function() { this.$onInit = function () {
var filters = this.filters.state; this.setDefaults();
var filtered = false; this.prepareTableFromDataset();
if (!filters.showUsedImages || !filters.showUnusedImages) {
filtered = true;
}
this.filters.state.enabled = filtered;
DatatableService.setDataTableFilters(this.tableKey, this.filters);
};
this.$onInit = function() { this.state.orderBy = this.orderBy;
this.setDefaults(); var storedOrder = DatatableService.getDataTableOrder(this.tableKey);
this.prepareTableFromDataset(); if (storedOrder !== null) {
this.state.reverseOrder = storedOrder.reverse;
this.state.orderBy = storedOrder.orderBy;
}
this.state.orderBy = this.orderBy; var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
var storedOrder = DatatableService.getDataTableOrder(this.tableKey); if (textFilter !== null) {
if (storedOrder !== null) { this.state.textFilter = textFilter;
this.state.reverseOrder = storedOrder.reverse; this.onTextFilterChange();
this.state.orderBy = storedOrder.orderBy; }
}
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey); var storedFilters = DatatableService.getDataTableFilters(this.tableKey);
if (textFilter !== null) { if (storedFilters !== null) {
this.state.textFilter = textFilter; this.filters = storedFilters;
this.onTextFilterChange(); }
} if (this.filters && this.filters.state) {
this.filters.state.open = false;
}
var storedFilters = DatatableService.getDataTableFilters(this.tableKey); var storedSettings = DatatableService.getDataTableSettings(this.tableKey);
if (storedFilters !== null) { if (storedSettings !== null) {
this.filters = storedFilters; this.settings = storedSettings;
} this.settings.open = false;
if (this.filters && this.filters.state) { }
this.filters.state.open = false;
}
var storedSettings = DatatableService.getDataTableSettings(this.tableKey); this.onSettingsRepeaterChange();
if (storedSettings !== null) { };
this.settings = storedSettings; },
this.settings.open = false; ]);
}
this.onSettingsRepeaterChange();
};
}]);

20
app/docker/components/datatables/macvlan-nodes-datatable/macvlanNodesDatatable.html
View File

@ -2,13 +2,19 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
@ -56,8 +62,10 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" <tr
ng-class="{active: item.Checked}"> dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td> <td>
<span class="md-checkbox"> <span class="md-checkbox">
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)" /> <input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)" />

4
app/docker/components/datatables/macvlan-nodes-datatable/macvlanNodesDatatable.js
View File

@ -10,6 +10,6 @@ angular.module('portainer.docker').component('macvlanNodesDatatable', {
reverseOrder: '<', reverseOrder: '<',
showIpAddressColumn: '<', showIpAddressColumn: '<',
accessToNodeDetails: '<', accessToNodeDetails: '<',
state: '=' state: '=',
} },
}); });

16
app/docker/components/datatables/networks-datatable/network-row-content/networkRowContent.html
View File

@ -1,14 +1,22 @@
<td ng-if="allowCheckbox"> <td ng-if="allowCheckbox">
<span class="md-checkbox" ng-if="!parentCtrl.offlineMode" authorization="DockerNetworkDelete, DockerNetworkCreate"> <span class="md-checkbox" ng-if="!parentCtrl.offlineMode" authorization="DockerNetworkDelete, DockerNetworkCreate">
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="parentCtrl.selectItem(item, $event); $event.stopPropagation()" ng-disabled="parentCtrl.disableRemove(item)"/> <input
id="select_{{ $index }}"
type="checkbox"
ng-model="item.Checked"
ng-click="parentCtrl.selectItem(item, $event); $event.stopPropagation()"
ng-disabled="parentCtrl.disableRemove(item)"
/>
<label for="select_{{ $index }}"></label> <label for="select_{{ $index }}"></label>
</span> </span>
<a ng-if="parentCtrl.itemCanExpand(item)"><i ng-class="{ 'fas fa-angle-down': item.Expanded, 'fas fa-angle-right': !item.Expanded }" class="space-right" aria-hidden="true"></i></a> <a ng-if="parentCtrl.itemCanExpand(item)"
><i ng-class="{ 'fas fa-angle-down': item.Expanded, 'fas fa-angle-right': !item.Expanded }" class="space-right" aria-hidden="true"></i
></a>
</td> </td>
<td ng-if="!allowCheckbox"></td> <td ng-if="!allowCheckbox"></td>
<td> <td>
<a ng-if="!parentCtrl.offlineMode" ui-sref="docker.networks.network({ id: item.Id, nodeName: item.NodeName })" title="{{ item.Name }}">{{ item.Name | truncate:40 }}</a> <a ng-if="!parentCtrl.offlineMode" ui-sref="docker.networks.network({ id: item.Id, nodeName: item.NodeName })" title="{{ item.Name }}">{{ item.Name | truncate: 40 }}</a>
<span ng-if="parentCtrl.offlineMode">{{ item.Name | truncate:40 }}</span> <span ng-if="parentCtrl.offlineMode">{{ item.Name | truncate: 40 }}</span>
<span style="margin-left: 10px;" class="label label-info image-tag space-left" ng-if="item.ResourceControl.System">System</span> <span style="margin-left: 10px;" class="label label-info image-tag space-left" ng-if="item.ResourceControl.System">System</span>
</td> </td>
<td>{{ item.StackName ? item.StackName : '-' }}</td> <td>{{ item.StackName ? item.StackName : '-' }}</td>

37
app/docker/components/datatables/networks-datatable/network-row-content/networkRowContent.js
View File

@ -1,20 +1,21 @@
import { ResourceControlOwnership as RCO } from 'Portainer/models/resourceControl/resourceControlOwnership'; import { ResourceControlOwnership as RCO } from 'Portainer/models/resourceControl/resourceControlOwnership';
angular.module('portainer.docker') angular.module('portainer.docker').directive('networkRowContent', [
.directive('networkRowContent', [function networkRowContent() { function networkRowContent() {
var directive = { var directive = {
templateUrl: './networkRowContent.html', templateUrl: './networkRowContent.html',
restrict: 'A', restrict: 'A',
transclude: true, transclude: true,
scope: { scope: {
item: '<', item: '<',
parentCtrl: '<', parentCtrl: '<',
allowCheckbox: '<', allowCheckbox: '<',
allowExpand: '<' allowExpand: '<',
}, },
controller: ($scope) => { controller: ($scope) => {
$scope.RCO = RCO; $scope.RCO = RCO;
} },
}; };
return directive; return directive;
}]); },
]);

46
app/docker/components/datatables/networks-datatable/networksDatatable.html
View File

@ -2,9 +2,7 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
<div class="settings"> <div class="settings">
<span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open"> <span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open">
<span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span> <span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span>
@ -16,7 +14,7 @@
<div class="menuContent"> <div class="menuContent">
<div> <div>
<div class="md-checkbox"> <div class="md-checkbox">
<input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()"/> <input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()" />
<label for="setting_auto_refresh">Auto refresh</label> <label for="setting_auto_refresh">Auto refresh</label>
</div> </div>
<div ng-if="$ctrl.settings.repeater.autoRefresh"> <div ng-if="$ctrl.settings.repeater.autoRefresh">
@ -45,8 +43,13 @@
</div> </div>
</div> </div>
<div class="actionBar" ng-if="!$ctrl.offlineMode" authorization="DockerNetworkDelete, DockerNetworkCreate"> <div class="actionBar" ng-if="!$ctrl.offlineMode" authorization="DockerNetworkDelete, DockerNetworkCreate">
<button type="button" class="btn btn-sm btn-danger" authorization="DockerNetworkDelete" <button
ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"> type="button"
class="btn btn-sm btn-danger"
authorization="DockerNetworkDelete"
ng-disabled="$ctrl.state.selectedItemCount === 0"
ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"
>
<i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove <i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove
</button> </button>
<button type="button" class="btn btn-sm btn-primary" ui-sref="docker.networks.new" authorization="DockerNetworkCreate"> <button type="button" class="btn btn-sm btn-primary" ui-sref="docker.networks.new" authorization="DockerNetworkCreate">
@ -55,13 +58,21 @@
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
<thead> <thead>
<tr> <tr>
<th style="width:55px;"> <th style="width: 55px;">
<span class="md-checkbox" ng-if="!$ctrl.offlineMode" authorization="DockerNetworkDelete, DockerNetworkCreate"> <span class="md-checkbox" ng-if="!$ctrl.offlineMode" authorization="DockerNetworkDelete, DockerNetworkCreate">
<input id="select_all" type="checkbox" ng-model="$ctrl.state.selectAll" ng-change="$ctrl.selectAll()" /> <input id="select_all" type="checkbox" ng-model="$ctrl.state.selectAll" ng-change="$ctrl.selectAll()" />
<label for="select_all"></label> <label for="select_all"></label>
@ -150,12 +161,17 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate-start="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" <tr
ng-class="{active: item.Checked}" network-row-content item="item" parent-ctrl="$ctrl" ng-click="$ctrl.expandItem(item, !item.Expanded)" allow-checkbox="true"> dir-paginate-start="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
</tr> ng-class="{ active: item.Checked }"
<tr dir-paginate-end ng-show="item.Expanded" ng-repeat="it in item.Subs" style="background: #d5e8f3;" network-row-content
network-row-content item="it" parent-ctrl="$ctrl"> item="item"
parent-ctrl="$ctrl"
ng-click="$ctrl.expandItem(item, !item.Expanded)"
allow-checkbox="true"
>
</tr> </tr>
<tr dir-paginate-end ng-show="item.Expanded" ng-repeat="it in item.Subs" style="background: #d5e8f3;" network-row-content item="it" parent-ctrl="$ctrl"> </tr>
<tr ng-if="!$ctrl.dataset"> <tr ng-if="!$ctrl.dataset">
<td colspan="9" class="text-center text-muted">Loading...</td> <td colspan="9" class="text-center text-muted">Loading...</td>
</tr> </tr>
@ -166,9 +182,7 @@
</table> </table>
</div> </div>
<div class="footer" ng-if="$ctrl.dataset"> <div class="footer" ng-if="$ctrl.dataset">
<div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> <div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> {{ $ctrl.state.selectedItemCount }} item(s) selected </div>
{{ $ctrl.state.selectedItemCount }} item(s) selected
</div>
<div class="paginationControls"> <div class="paginationControls">
<form class="form-inline"> <form class="form-inline">
<span class="limitSelector"> <span class="limitSelector">

4
app/docker/components/datatables/networks-datatable/networksDatatable.js
View File

@ -12,6 +12,6 @@ angular.module('portainer.docker').component('networksDatatable', {
showHostColumn: '<', showHostColumn: '<',
removeAction: '<', removeAction: '<',
offlineMode: '<', offlineMode: '<',
refreshCallback: '<' refreshCallback: '<',
} },
}); });

134
app/docker/components/datatables/networks-datatable/networksDatatableController.js
View File

@ -1,78 +1,80 @@
import _ from 'lodash-es'; import _ from 'lodash-es';
angular.module('portainer.docker') angular.module('portainer.docker').controller('NetworksDatatableController', [
.controller('NetworksDatatableController', ['$scope', '$controller', 'NetworkHelper', 'DatatableService', '$scope',
function ($scope, $controller, NetworkHelper, DatatableService) { '$controller',
'NetworkHelper',
'DatatableService',
function ($scope, $controller, NetworkHelper, DatatableService) {
angular.extend(this, $controller('GenericDatatableController', { $scope: $scope }));
angular.extend(this, $controller('GenericDatatableController', {$scope: $scope})); this.disableRemove = function (item) {
return NetworkHelper.isSystemNetwork(item);
};
this.disableRemove = function(item) { this.state = Object.assign(this.state, {
return NetworkHelper.isSystemNetwork(item); expandedItems: [],
}; });
this.state = Object.assign(this.state, { /**
expandedItems: [] * Do not allow system networks to be selected
}) */
this.allowSelection = function (item) {
return !this.disableRemove(item);
};
/** this.$onInit = function () {
* Do not allow system networks to be selected this.setDefaults();
*/ this.prepareTableFromDataset();
this.allowSelection = function(item) {
return !this.disableRemove(item); this.state.orderBy = this.orderBy;
var storedOrder = DatatableService.getDataTableOrder(this.tableKey);
if (storedOrder !== null) {
this.state.reverseOrder = storedOrder.reverse;
this.state.orderBy = storedOrder.orderBy;
} }
this.$onInit = function() { var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
this.setDefaults(); if (textFilter !== null) {
this.prepareTableFromDataset(); this.state.textFilter = textFilter;
this.onTextFilterChange();
this.state.orderBy = this.orderBy;
var storedOrder = DatatableService.getDataTableOrder(this.tableKey);
if (storedOrder !== null) {
this.state.reverseOrder = storedOrder.reverse;
this.state.orderBy = storedOrder.orderBy;
}
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
if (textFilter !== null) {
this.state.textFilter = textFilter;
this.onTextFilterChange();
}
var storedFilters = DatatableService.getDataTableFilters(this.tableKey);
if (storedFilters !== null) {
this.filters = storedFilters;
}
if (this.filters && this.filters.state) {
this.filters.state.open = false;
}
var storedSettings = DatatableService.getDataTableSettings(this.tableKey);
if (storedSettings !== null) {
this.settings = storedSettings;
this.settings.open = false;
}
this.onSettingsRepeaterChange();
};
this.expandItem = function(item, expanded) {
item.Expanded = expanded;
};
this.itemCanExpand = function(item) {
return item.Subs.length > 0;
} }
this.hasExpandableItems = function() { var storedFilters = DatatableService.getDataTableFilters(this.tableKey);
return _.filter(this.state.filteredDataSet, (item) => this.itemCanExpand(item)).length; if (storedFilters !== null) {
}; this.filters = storedFilters;
}
if (this.filters && this.filters.state) {
this.filters.state.open = false;
}
this.expandAll = function() { var storedSettings = DatatableService.getDataTableSettings(this.tableKey);
this.state.expandAll = !this.state.expandAll; if (storedSettings !== null) {
_.forEach(this.state.filteredDataSet, (item) => { this.settings = storedSettings;
if (this.itemCanExpand(item)) { this.settings.open = false;
this.expandItem(item, this.state.expandAll); }
} this.onSettingsRepeaterChange();
}); };
};
} this.expandItem = function (item, expanded) {
item.Expanded = expanded;
};
this.itemCanExpand = function (item) {
return item.Subs.length > 0;
};
this.hasExpandableItems = function () {
return _.filter(this.state.filteredDataSet, (item) => this.itemCanExpand(item)).length;
};
this.expandAll = function () {
this.state.expandAll = !this.state.expandAll;
_.forEach(this.state.filteredDataSet, (item) => {
if (this.itemCanExpand(item)) {
this.expandItem(item, this.state.expandAll);
}
});
};
},
]); ]);

27
app/docker/components/datatables/node-tasks-datatable/nodeTasksDatatable.html
View File

@ -2,13 +2,19 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
@ -52,9 +58,16 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
<td><a ui-sref="docker.tasks.task({id: item.Id})" class="monospaced">{{ item.Id }}</a></td> dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
<td><span class="label label-{{ item.Status.State | taskstatusbadge }}">{{ item.Status.State }}</span></td> ng-class="{ active: item.Checked }"
>
<td
><a ui-sref="docker.tasks.task({id: item.Id})" class="monospaced">{{ item.Id }}</a></td
>
<td
><span class="label label-{{ item.Status.State | taskstatusbadge }}">{{ item.Status.State }}</span></td
>
<td>{{ item.Slot ? item.Slot : '-' }}</td> <td>{{ item.Slot ? item.Slot : '-' }}</td>
<td>{{ item.Spec.ContainerSpec.Image | hideshasum }}</td> <td>{{ item.Spec.ContainerSpec.Image | hideshasum }}</td>
<td>{{ item.Updated | getisodate }}</td> <td>{{ item.Updated | getisodate }}</td>

4
app/docker/components/datatables/node-tasks-datatable/nodeTasksDatatable.js
View File

@ -7,6 +7,6 @@ angular.module('portainer.docker').component('nodeTasksDatatable', {
dataset: '<', dataset: '<',
tableKey: '@', tableKey: '@',
orderBy: '@', orderBy: '@',
reverseOrder: '<' reverseOrder: '<',
} },
}); });

29
app/docker/components/datatables/nodes-datatable/nodesDatatable.html
View File

@ -2,9 +2,7 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
<div class="settings"> <div class="settings">
<span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open"> <span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open">
<span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span> <span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span>
@ -16,7 +14,7 @@
<div class="menuContent"> <div class="menuContent">
<div> <div>
<div class="md-checkbox"> <div class="md-checkbox">
<input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()"/> <input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()" />
<label for="setting_auto_refresh">Auto refresh</label> <label for="setting_auto_refresh">Auto refresh</label>
</div> </div>
<div ng-if="$ctrl.settings.repeater.autoRefresh"> <div ng-if="$ctrl.settings.repeater.autoRefresh">
@ -46,7 +44,15 @@
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
@ -111,7 +117,10 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td> <td>
<a ui-sref="docker.nodes.node({id: item.Id})" ng-if="$ctrl.accessToNodeDetails">{{ item.Name || item.Hostname }}</a> <a ui-sref="docker.nodes.node({id: item.Id})" ng-if="$ctrl.accessToNodeDetails">{{ item.Name || item.Hostname }}</a>
<span ng-if="!$ctrl.accessToNodeDetails">{{ item.Name || item.Hostname }}</span> <span ng-if="!$ctrl.accessToNodeDetails">{{ item.Name || item.Hostname }}</span>
@ -121,8 +130,12 @@
<td>{{ item.Memory | humansize }}</td> <td>{{ item.Memory | humansize }}</td>
<td>{{ item.EngineVersion }}</td> <td>{{ item.EngineVersion }}</td>
<td ng-if="$ctrl.showIpAddressColumn">{{ item.Addr }}</td> <td ng-if="$ctrl.showIpAddressColumn">{{ item.Addr }}</td>
<td><span class="label label-{{ item.Status | nodestatusbadge }}">{{ item.Status }}</span></td> <td
<td><span class="label label-{{ item.Availability | dockerNodeAvailabilityBadge }}">{{ item.Availability }}</span></td> ><span class="label label-{{ item.Status | nodestatusbadge }}">{{ item.Status }}</span></td
>
<td
><span class="label label-{{ item.Availability | dockerNodeAvailabilityBadge }}">{{ item.Availability }}</span></td
>
</tr> </tr>
<tr ng-if="!$ctrl.dataset"> <tr ng-if="!$ctrl.dataset">
<td colspan="7" class="text-center text-muted">Loading...</td> <td colspan="7" class="text-center text-muted">Loading...</td>

4
app/docker/components/datatables/nodes-datatable/nodesDatatable.js
View File

@ -10,6 +10,6 @@ angular.module('portainer.docker').component('nodesDatatable', {
reverseOrder: '<', reverseOrder: '<',
showIpAddressColumn: '<', showIpAddressColumn: '<',
accessToNodeDetails: '<', accessToNodeDetails: '<',
refreshCallback: '<' refreshCallback: '<',
} },
}); });

36
app/docker/components/datatables/secrets-datatable/secretsDatatable.html
View File

@ -2,9 +2,7 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }} </div>
<i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px;"></i> {{ $ctrl.titleText }}
</div>
<div class="settings"> <div class="settings">
<span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open"> <span class="setting" ng-class="{ 'setting-active': $ctrl.settings.open }" uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.settings.open">
<span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span> <span uib-dropdown-toggle><i class="fa fa-cog" aria-hidden="true"></i> Settings</span>
@ -16,7 +14,7 @@
<div class="menuContent"> <div class="menuContent">
<div> <div>
<div class="md-checkbox"> <div class="md-checkbox">
<input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()"/> <input id="setting_auto_refresh" type="checkbox" ng-model="$ctrl.settings.repeater.autoRefresh" ng-change="$ctrl.onSettingsRepeaterChange()" />
<label for="setting_auto_refresh">Auto refresh</label> <label for="setting_auto_refresh">Auto refresh</label>
</div> </div>
<div ng-if="$ctrl.settings.repeater.autoRefresh"> <div ng-if="$ctrl.settings.repeater.autoRefresh">
@ -45,8 +43,13 @@
</div> </div>
</div> </div>
<div class="actionBar" authorization="DockerSecretDelete, DockerSecretCreate"> <div class="actionBar" authorization="DockerSecretDelete, DockerSecretCreate">
<button type="button" class="btn btn-sm btn-danger" authorization="DockerSecretDelete" <button
ng-disabled="$ctrl.state.selectedItemCount === 0" ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"> type="button"
class="btn btn-sm btn-danger"
authorization="DockerSecretDelete"
ng-disabled="$ctrl.state.selectedItemCount === 0"
ng-click="$ctrl.removeAction($ctrl.state.selectedItems)"
>
<i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove <i class="fa fa-trash-alt space-right" aria-hidden="true"></i>Remove
</button> </button>
<button type="button" class="btn btn-sm btn-primary" ui-sref="docker.secrets.new" authorization="DockerSecretCreate"> <button type="button" class="btn btn-sm btn-primary" ui-sref="docker.secrets.new" authorization="DockerSecretCreate">
@ -55,7 +58,15 @@
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <i class="fa fa-search searchIcon" aria-hidden="true"></i>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }"> <input
type="text"
class="searchInput"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
auto-focus
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
@ -89,10 +100,13 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))" ng-class="{active: item.Checked}"> <tr
dir-paginate="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter:$ctrl.state.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder | itemsPerPage: $ctrl.state.paginatedItemLimit))"
ng-class="{ active: item.Checked }"
>
<td> <td>
<span class="md-checkbox" authorization="DockerSecretDelete, DockerSecretCreate"> <span class="md-checkbox" authorization="DockerSecretDelete, DockerSecretCreate">
<input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)"/> <input id="select_{{ $index }}" type="checkbox" ng-model="item.Checked" ng-click="$ctrl.selectItem(item, $event)" />
<label for="select_{{ $index }}"></label> <label for="select_{{ $index }}"></label>
</span> </span>
<a ui-sref="docker.secrets.secret({id: item.Id})">{{ item.Name }}</a> <a ui-sref="docker.secrets.secret({id: item.Id})">{{ item.Name }}</a>
@ -115,9 +129,7 @@
</table> </table>
</div> </div>
<div class="footer" ng-if="$ctrl.dataset"> <div class="footer" ng-if="$ctrl.dataset">
<div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> <div class="infoBar" ng-if="$ctrl.state.selectedItemCount !== 0"> {{ $ctrl.state.selectedItemCount }} item(s) selected </div>
{{ $ctrl.state.selectedItemCount }} item(s) selected
</div>
<div class="paginationControls"> <div class="paginationControls">
<form class="form-inline"> <form class="form-inline">
<span class="limitSelector"> <span class="limitSelector">

4
app/docker/components/datatables/secrets-datatable/secretsDatatable.js
View File

@ -10,6 +10,6 @@ angular.module('portainer.docker').component('secretsDatatable', {
reverseOrder: '<', reverseOrder: '<',
showOwnershipColumn: '<', showOwnershipColumn: '<',
removeAction: '<', removeAction: '<',
refreshCallback: '<' refreshCallback: '<',
} },
}); });

30
app/docker/components/datatables/service-tasks-datatable/serviceTasksDatatable.html
View File

@ -1,6 +1,6 @@
<div style="background-color: #d5e8f3; padding: 2px"> <div style="background-color: #d5e8f3; padding: 2px;">
<table class="table table-condensed table-hover nowrap-cells"> <table class="table table-condensed table-hover nowrap-cells">
<thead style="background-color: #e7f6ff"> <thead style="background-color: #e7f6ff;">
<tr> <tr>
<th uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.filters.state.open" style="width: 10%;"> <th uib-dropdown dropdown-append-to-body auto-close="disabled" is-open="$ctrl.filters.state.open" style="width: 10%;">
<a ng-click="$ctrl.changeOrderBy('Status.State')"> <a ng-click="$ctrl.changeOrderBy('Status.State')">
@ -19,7 +19,7 @@
</div> </div>
<div class="menuContent"> <div class="menuContent">
<div class="md-checkbox" ng-repeat="filter in $ctrl.filters.state.values track by $index"> <div class="md-checkbox" ng-repeat="filter in $ctrl.filters.state.values track by $index">
<input id="filter_state_{{ $ctrl.serviceId }}_{{ $index }}" type="checkbox" ng-model="filter.display" ng-change="$ctrl.onStateFilterChange()"/> <input id="filter_state_{{ $ctrl.serviceId }}_{{ $index }}" type="checkbox" ng-model="filter.display" ng-change="$ctrl.onStateFilterChange()" />
<label for="filter_state_{{ $ctrl.serviceId }}_{{ $index }}">{{ filter.label }}</label> <label for="filter_state_{{ $ctrl.serviceId }}_{{ $index }}">{{ filter.label }}</label>
</div> </div>
</div> </div>
@ -55,17 +55,33 @@
</tr> </tr>
</thead> </thead>
<tbody style="background-color: #f1f9fd;"> <tbody style="background-color: #f1f9fd;">
<tr ng-repeat="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder))"> <tr
ng-repeat="item in ($ctrl.state.filteredDataSet = ($ctrl.dataset | filter: $ctrl.applyFilters | filter:$ctrl.textFilter | orderBy:$ctrl.state.orderBy:$ctrl.state.reverseOrder))"
>
<td class="text-center"> <td class="text-center">
<span class="label label-{{ item.Status.State | taskstatusbadge }} space-right">{{ item.Status.State }}</span> <span class="label label-{{ item.Status.State | taskstatusbadge }} space-right">{{ item.Status.State }}</span>
</td> </td>
<td> <td>
<a ng-if="!$ctrl.agentProxy || !item.Container" ui-sref="docker.tasks.task({id: item.Id})" class="monospaced">{{ item.Id }}</a> <a ng-if="!$ctrl.agentProxy || !item.Container" ui-sref="docker.tasks.task({id: item.Id})" class="monospaced">{{ item.Id }}</a>
<a ng-if="$ctrl.agentProxy && item.Container" ui-sref="docker.containers.container({ id: item.Container.Id, nodeName: item.Container.NodeName })" class="monospaced">{{ item.Id }}</a> <a ng-if="$ctrl.agentProxy && item.Container" ui-sref="docker.containers.container({ id: item.Container.Id, nodeName: item.Container.NodeName })" class="monospaced">{{
item.Id
}}</a>
</td> </td>
<td> <td>
<container-quick-actions ng-if="!$ctrl.agentProxy || !item.Container" container-id="item.ContainerId" task-id="item.Id" status="item.Status.State" state="$ctrl.state"></container-quick-actions> <container-quick-actions
<container-quick-actions ng-if="$ctrl.agentProxy && item.Container" container-id="item.Container.Id" node-name="item.Container.NodeName" status="item.Status.State" state="$ctrl.state"></container-quick-actions> ng-if="!$ctrl.agentProxy || !item.Container"
container-id="item.ContainerId"
task-id="item.Id"
status="item.Status.State"
state="$ctrl.state"
></container-quick-actions>
<container-quick-actions
ng-if="$ctrl.agentProxy && item.Container"
container-id="item.Container.Id"
node-name="item.Container.NodeName"
status="item.Status.State"
state="$ctrl.state"
></container-quick-actions>
</td> </td>
<td>{{ item.Slot ? item.Slot : '-' }}</td> <td>{{ item.Slot ? item.Slot : '-' }}</td>
<td>{{ item.NodeId | tasknodename: $ctrl.nodes }}</td> <td>{{ item.NodeId | tasknodename: $ctrl.nodes }}</td>

4
app/docker/components/datatables/service-tasks-datatable/serviceTasksDatatable.js
View File

@ -10,6 +10,6 @@ angular.module('portainer.docker').component('serviceTasksDatatable', {
nodes: '<', nodes: '<',
agentProxy: '<', agentProxy: '<',
textFilter: '=', textFilter: '=',
showTaskLogsButton: '<' showTaskLogsButton: '<',
} },
}); });

Some files were not shown because too many files have changed in this diff Show More