select collections on group add/edit

This commit is contained in:
Kyle Spearrin 2017-05-08 22:13:31 -04:00
parent 9c706f07f0
commit cd5ad9f85b
5 changed files with 191 additions and 22 deletions

View File

@ -1,14 +1,60 @@
angular
.module('bit.organization')
.controller('organizationGroupsAddController', function ($scope, $state, $uibModalInstance, apiService,
.controller('organizationGroupsAddController', function ($scope, $state, $uibModalInstance, apiService, cipherService,
$analytics) {
$analytics.eventTrack('organizationGroupsAddController', { category: 'Modal' });
$scope.collections = [];
$scope.selectedCollections = {};
$scope.loading = true;
$uibModalInstance.opened.then(function () {
return apiService.collections.listOrganization({ orgId: $state.params.orgId }).$promise;
}).then(function (collections) {
$scope.collections = cipherService.decryptCollections(collections.Data, $state.params.orgId, true);
$scope.loading = false;
});
$scope.toggleCollectionSelectionAll = function ($event) {
var collections = {};
if ($event.target.checked) {
for (var i = 0; i < $scope.collections.length; i++) {
collections[$scope.collections[i].id] = true;
}
}
$scope.selectedCollections = collections;
};
$scope.toggleCollectionSelection = function (id) {
if (id in $scope.selectedCollections) {
delete $scope.selectedCollections[id];
}
else {
$scope.selectedCollections[id] = true;
}
};
$scope.collectionSelected = function (collection) {
return collection.id in $scope.selectedCollections;
};
$scope.allSelected = function () {
return Object.keys($scope.selectedCollections).length === $scope.collections.length;
};
$scope.submit = function (model) {
var group = {
name: model.name
name: model.name,
collectionIds: []
};
for (var id in $scope.selectedCollections) {
if ($scope.selectedCollections.hasOwnProperty(id)) {
group.collectionIds.push(id);
}
}
$scope.submitPromise = apiService.groups.post({ orgId: $state.params.orgId }, group, function (response) {
$analytics.eventTrack('Created Group');
$uibModalInstance.close({

View File

@ -1,22 +1,73 @@
angular
.module('bit.organization')
.controller('organizationGroupsEditController', function ($scope, $state, $uibModalInstance, apiService,
.controller('organizationGroupsEditController', function ($scope, $state, $uibModalInstance, apiService, cipherService,
$analytics, id) {
$analytics.eventTrack('organizationGroupsEditController', { category: 'Modal' });
$scope.collection = {};
$scope.collections = [];
$scope.selectedCollections = {};
$scope.loading = true;
$uibModalInstance.opened.then(function () {
apiService.groups.get({ orgId: $state.params.orgId, id: id }, function (group) {
return apiService.groups.getDetails({ orgId: $state.params.orgId, id: id }).$promise;
}).then(function (group) {
$scope.group = {
id: id,
name: group.Name
};
});
var collections = {};
if (group.CollectionIds) {
for (var i = 0; i < group.CollectionIds.length; i++) {
collections[group.CollectionIds[i]] = true;
}
}
$scope.selectedCollections = collections;
return apiService.collections.listOrganization({ orgId: $state.params.orgId }).$promise;
}).then(function (collections) {
$scope.collections = cipherService.decryptCollections(collections.Data, $state.params.orgId, true);
$scope.loading = false;
});
$scope.toggleCollectionSelectionAll = function ($event) {
var collections = {};
if ($event.target.checked) {
for (var i = 0; i < $scope.collections.length; i++) {
collections[$scope.collections[i].id] = true;
}
}
$scope.selectedCollections = collections;
};
$scope.toggleCollectionSelection = function (id) {
if (id in $scope.selectedCollections) {
delete $scope.selectedCollections[id];
}
else {
$scope.selectedCollections[id] = true;
}
};
$scope.collectionSelected = function (collection) {
return collection.id in $scope.selectedCollections;
};
$scope.allSelected = function () {
return Object.keys($scope.selectedCollections).length === $scope.collections.length;
};
$scope.submit = function () {
$scope.submitPromise = apiService.groups.put({ orgId: $state.params.orgId }, $scope.group, function (response) {
var group = $scope.group;
group.collectionIds = [];
for (var id in $scope.selectedCollections) {
if ($scope.selectedCollections.hasOwnProperty(id)) {
group.collectionIds.push(id);
}
}
$scope.submitPromise = apiService.groups.put({ orgId: $state.params.orgId }, group, function (response) {
$analytics.eventTrack('Edited Group');
$uibModalInstance.close({
id: response.Id,

View File

@ -4,6 +4,13 @@
</div>
<form name="form" ng-submit="form.$valid && submit(model)" api-form="submitPromise">
<div class="modal-body">
<div class="callout callout-default">
<h4><i class="fa fa-info-circle"></i> Note</h4>
<p>
After creating the group, you can associate a user to it by selecting the "Groups" option for a specific user
on the "People" page.
</p>
</div>
<div class="callout callout-danger validation-errors" ng-show="form.$errors">
<h4>Errors have occured</h4>
<ul>
@ -14,11 +21,40 @@
<label for="email">Name</label>
<input type="text" id="name" name="Name" ng-model="model.name" class="form-control" required api-field />
</div>
<div class="callout callout-default">
<h4><i class="fa fa-info-circle"></i> Note</h4>
<p>
After creating the group, you can associate a user to it by selecting a specific user on the "People" page.
</p>
<h4>Collections</h4>
<div ng-show="loading && !collections.length">
Loading collections...
</div>
<div ng-show="!loading && !collections.length">
<p>No collections for your organization.</p>
</div>
<div class="table-responsive" ng-show="collections.length" style="margin: 0;">
<table class="table table-striped table-hover" style="margin: 0;">
<thead>
<tr>
<th style="width: 40px;">
<input type="checkbox"
ng-checked="allSelected()"
ng-click="toggleCollectionSelectionAll($event)">
</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="collection in collections | orderBy: ['name']">
<td valign="middle">
<input type="checkbox"
name="selectedCollections[]"
value="{{collection.id}}"
ng-checked="collectionSelected(collection)"
ng-click="toggleCollectionSelection(collection.id)">
</td>
<td valign="middle">
{{collection.name}}
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="modal-footer">

View File

@ -4,6 +4,13 @@
</div>
<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
<div class="modal-body">
<div class="callout callout-default">
<h4><i class="fa fa-info-circle"></i> Note</h4>
<p>
Select "Users" from the listing options to manage existing users for this group. Associate new users by
selecting "Groups" the "People" page for a specific user.
</p>
</div>
<div class="callout callout-danger validation-errors" ng-show="form.$errors">
<h4>Errors have occured</h4>
<ul>
@ -14,12 +21,40 @@
<label for="email">Name</label>
<input type="text" id="name" name="Name" ng-model="group.name" class="form-control" required api-field />
</div>
<div class="callout callout-default">
<h4><i class="fa fa-info-circle"></i> Note</h4>
<p>
Select "Users" from the listing options to manage existing users for this collection. Associate new users by
editing the user's access on the "People" page.
</p>
<h4>Collections</h4>
<div ng-show="loading && !collections.length">
Loading collections...
</div>
<div ng-show="!loading && !collections.length">
<p>No collections for your organization.</p>
</div>
<div class="table-responsive" ng-show="collections.length" style="margin: 0;">
<table class="table table-striped table-hover" style="margin: 0;">
<thead>
<tr>
<th style="width: 40px;">
<input type="checkbox"
ng-checked="allSelected()"
ng-click="toggleCollectionSelectionAll($event)">
</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="collection in collections | orderBy: ['name']">
<td valign="middle">
<input type="checkbox"
name="selectedCollections[]"
value="{{collection.id}}"
ng-checked="collectionSelected(collection)"
ng-click="toggleCollectionSelection(collection.id)">
</td>
<td valign="middle">
{{collection.name}}
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="modal-footer">

View File

@ -83,6 +83,7 @@
_service.groups = $resource(_apiUri + '/organizations/:orgId/groups/:id', {}, {
get: { method: 'GET', params: { id: '@id', orgId: '@orgId' } },
getDetails: { url: _apiUri + '/organizations/:orgId/groups/:id/details', method: 'GET', params: { id: '@id', orgId: '@orgId' } },
listOrganization: { method: 'GET', params: { orgId: '@orgId' } },
post: { method: 'POST', params: { orgId: '@orgId' } },
put: { method: 'POST', params: { id: '@id', orgId: '@orgId' } },