mirror of
https://github.com/ansible/awx.git
synced 2024-11-01 08:21:15 +03:00
Reorganize awx/ui/client/src/access module structure
addPermissions module => add-rbac-resource module addPermissionsList module => rbac-multiselect-list module roleSelect module => rbac-multiselect-role module roleList module => rbac-role-column module Use isolate scope in rbac-multiselect-role module Move shared styles to module root
This commit is contained in:
parent
f77949b4b0
commit
fed9806313
12
awx/ui/client/src/access/add-rbac-resource/main.js
Normal file
12
awx/ui/client/src/access/add-rbac-resource/main.js
Normal file
@ -0,0 +1,12 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2015 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
import addRbacResourceDirective from './rbac-resource.directive';
|
||||
import rbacMultiselect from '../rbac-multiselect/main';
|
||||
|
||||
export default
|
||||
angular.module('AddRbacResourceModule', [rbacMultiselect.name])
|
||||
.directive('addRbacResource', addRbacResourceDirective);
|
@ -18,16 +18,7 @@ export default ['$rootScope', '$scope', 'GetBasePath', 'Rest', '$q', 'Wait', 'Pr
|
||||
// the object permissions are being added to
|
||||
scope.object = scope.resourceData.data;
|
||||
// array for all possible roles for the object
|
||||
scope.roles = Object
|
||||
.keys(scope.object.summary_fields.object_roles)
|
||||
.map(function(key) {
|
||||
return {
|
||||
value: scope.object.summary_fields
|
||||
.object_roles[key].id,
|
||||
label: scope.object.summary_fields
|
||||
.object_roles[key].name
|
||||
};
|
||||
});
|
||||
scope.roles = scope.object.summary_fields.object_roles;
|
||||
|
||||
// TODO: get working with api
|
||||
// array w roles and descriptions for key
|
||||
@ -44,6 +35,11 @@ export default ['$rootScope', '$scope', 'GetBasePath', 'Rest', '$q', 'Wait', 'Pr
|
||||
|
||||
scope.showKeyPane = false;
|
||||
|
||||
scope.removeObject = function(obj){
|
||||
_.remove(scope.allSelected, {id: obj.id});
|
||||
obj.isSelected = false;
|
||||
};
|
||||
|
||||
scope.toggleKeyPane = function() {
|
||||
scope.showKeyPane = !scope.showKeyPane;
|
||||
};
|
@ -3,7 +3,7 @@
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
import addPermissionsController from './addPermissions.controller';
|
||||
import controller from './rbac-resource.controller';
|
||||
|
||||
/* jshint unused: vars */
|
||||
export default ['templateUrl', '$state',
|
||||
@ -16,8 +16,8 @@ export default ['templateUrl', '$state',
|
||||
teamsDataset: '=',
|
||||
resourceData: '=',
|
||||
},
|
||||
controller: addPermissionsController,
|
||||
templateUrl: templateUrl('access/addPermissions/addPermissions'),
|
||||
controller: controller,
|
||||
templateUrl: templateUrl('access/add-rbac-resource/rbac-resource'),
|
||||
link: function(scope, element, attrs) {
|
||||
scope.toggleFormTabs('users');
|
||||
$('#add-permissions-modal').modal('show');
|
@ -46,10 +46,10 @@
|
||||
</div>
|
||||
|
||||
<div id="AddPermissions-users" class="AddPermissions-list" ng-show="usersSelected">
|
||||
<add-permissions-list view="Users" all-selected="allSelected" dataset="usersDataset"></add-permissions-list>
|
||||
<rbac-multiselect-list view="Users" all-selected="allSelected" dataset="usersDataset"></rbac-multiselect-list>
|
||||
</div>
|
||||
<div id="AddPermissions-teams" class="AddPermissions-list" ng-show="teamsSelected">
|
||||
<add-permissions-list view="Teams" all-selected="allSelected" dataset="teamsDataset"></add-permissions-list>
|
||||
<rbac-multiselect-list view="Teams" all-selected="allSelected" dataset="teamsDataset"></rbac-multiselect-list>
|
||||
</div>
|
||||
|
||||
<div class="AddPermissions-separator"
|
||||
@ -61,7 +61,7 @@
|
||||
2
|
||||
</span>
|
||||
Please assign roles to the selected users/teams
|
||||
<div class="AddPermissions-keyToggle"
|
||||
<div class="AddPermissions-keyToggle btn"
|
||||
ng-class="{'is-active': showKeyPane}"
|
||||
ng-click="toggleKeyPane()">
|
||||
Key
|
||||
@ -91,8 +91,8 @@
|
||||
{{ obj.type }}
|
||||
</span>
|
||||
</div>
|
||||
<role-select class="AddPermissions-roleSelect">
|
||||
</role-select>
|
||||
<rbac-multiselect-role class="AddPermissions-roleSelect" roles="roles" model="obj.roles">
|
||||
</rbac-multiselect-role>
|
||||
<button class="AddPermissions-roleRemove"
|
||||
ng-click="removeObject(obj)">
|
||||
<i class="fa fa-times"></i>
|
@ -1,4 +1,4 @@
|
||||
@import "../../shared/branding/colors.default.less";
|
||||
@import "../shared/branding/colors.default.less";
|
||||
|
||||
/** @define AddPermissions */
|
||||
|
||||
@ -168,13 +168,14 @@
|
||||
.AddPermissions-keyToggle {
|
||||
margin-left: auto;
|
||||
text-transform: uppercase;
|
||||
padding: 3px 9px;
|
||||
font-size: 12px;
|
||||
background-color: @default-bg;
|
||||
border-radius: 5px;
|
||||
color: @default-interface-txt;
|
||||
border: 1px solid @d7grey;
|
||||
cursor: pointer;
|
||||
width: 70px;
|
||||
height: 34px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.AddPermissions-keyToggle:hover {
|
||||
@ -185,6 +186,9 @@
|
||||
background-color: @default-link;
|
||||
border-color: @default-link;
|
||||
color: @default-bg;
|
||||
&:hover{
|
||||
background-color: @default-link-hov;
|
||||
}
|
||||
}
|
||||
|
||||
.AddPermissions-keyPane {
|
@ -1,47 +0,0 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2015 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
/* jshint unused: vars */
|
||||
export default ['addPermissionsTeamsList', 'addPermissionsUsersList', '$compile', 'generateList', 'GetBasePath', 'SelectionInit', function(addPermissionsTeamsList,
|
||||
addPermissionsUsersList, $compile, generateList,
|
||||
GetBasePath, SelectionInit) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
allSelected: '=',
|
||||
view: '@',
|
||||
dataset: '='
|
||||
},
|
||||
template: "<div class='addPermissionsList-inner'></div>",
|
||||
link: function(scope, element, attrs, ctrl) {
|
||||
let listMap, list, list_html;
|
||||
|
||||
listMap = {Teams: addPermissionsTeamsList, Users: addPermissionsUsersList};
|
||||
list = listMap[scope.view];
|
||||
list_html = generateList.build({
|
||||
mode: 'edit',
|
||||
list: list
|
||||
});
|
||||
|
||||
scope.list = listMap[scope.view];
|
||||
scope[`${list.iterator}_dataset`] = scope.dataset.data;
|
||||
scope[`${list.name}`] = scope[`${list.iterator}_dataset`].results;
|
||||
|
||||
scope.$watch(list.name, function(){
|
||||
_.forEach(scope[`${list.name}`], isSelected);
|
||||
});
|
||||
|
||||
function isSelected(item){
|
||||
if(_.find(scope.allSelected, {id: item.id})){
|
||||
item.isSelected = true;
|
||||
}
|
||||
return item;
|
||||
}
|
||||
element.append(list_html);
|
||||
$compile(element.contents())(scope);
|
||||
}
|
||||
};
|
||||
}];
|
@ -1,14 +0,0 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2015 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
import addPermissionsDirective from './addPermissions.directive';
|
||||
import roleSelect from './roleSelect.directive';
|
||||
import addPermissionsList from './addPermissionsList/main';
|
||||
|
||||
export default
|
||||
angular.module('AddPermissions', [addPermissionsList.name])
|
||||
.directive('addPermissions', addPermissionsDirective)
|
||||
.directive('roleSelect', roleSelect);
|
@ -4,9 +4,13 @@
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
import roleList from './roleList.directive';
|
||||
import addPermissions from './addPermissions/main';
|
||||
import roleList from './rbac-role-column/roleList.directive';
|
||||
import addRbacResource from './add-rbac-resource/main';
|
||||
import addRbacUserTeam from './add-rbac-user-team/main';
|
||||
|
||||
export default
|
||||
angular.module('access', [addPermissions.name])
|
||||
angular.module('RbacModule', [
|
||||
addRbacResource.name,
|
||||
addRbacUserTeam.name
|
||||
])
|
||||
.directive('roleList', roleList);
|
||||
|
@ -4,12 +4,14 @@
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
import addPermissionsListDirective from './addPermissionsList.directive';
|
||||
import rbacMultiselectList from './rbac-multiselect-list.directive';
|
||||
import rbacMultiselectRole from './rbac-multiselect-role.directive';
|
||||
import teamsList from './permissionsTeams.list';
|
||||
import usersList from './permissionsUsers.list';
|
||||
|
||||
export default
|
||||
angular.module('addPermissionsListModule', [])
|
||||
.directive('addPermissionsList', addPermissionsListDirective)
|
||||
angular.module('rbacMultiselectModule', [])
|
||||
.directive('rbacMultiselectList', rbacMultiselectList)
|
||||
.directive('rbacMultiselectRole', rbacMultiselectRole)
|
||||
.factory('addPermissionsTeamsList', teamsList)
|
||||
.factory('addPermissionsUsersList', usersList);
|
@ -0,0 +1,80 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2015 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
/* jshint unused: vars */
|
||||
export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateList', 'ProjectList',
|
||||
'InventoryList', 'CredentialList', '$compile', 'generateList', 'GetBasePath', 'SelectionInit',
|
||||
function(addPermissionsTeamsList, addPermissionsUsersList, TemplateList, ProjectList,
|
||||
InventoryList, CredentialList, $compile, generateList, GetBasePath, SelectionInit) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
allSelected: '=',
|
||||
view: '@',
|
||||
dataset: '='
|
||||
},
|
||||
template: "<div class='addPermissionsList-inner'></div>",
|
||||
link: function(scope, element, attrs, ctrl) {
|
||||
let listMap, list, list_html;
|
||||
|
||||
listMap = {
|
||||
Teams: addPermissionsTeamsList,
|
||||
Users: addPermissionsUsersList,
|
||||
Projects: ProjectList,
|
||||
Templates: TemplateList,
|
||||
Inventories: InventoryList,
|
||||
Credentials: CredentialList
|
||||
};
|
||||
list = _.cloneDeep(listMap[scope.view]);
|
||||
list.multiSelect = true;
|
||||
list.multiSelectExtended = true;
|
||||
list.listTitleBadge = false;
|
||||
delete list.actions;
|
||||
delete list.fieldActions;
|
||||
|
||||
if (scope.view !== 'Users' && scope.view !== 'Teams' && scope.view !=='Projects' && scope.view !== 'Inventories'){
|
||||
list.fields = {
|
||||
name: list.fields.name,
|
||||
description: list.fields.description
|
||||
};
|
||||
} else if (scope.view === 'Projects'){
|
||||
list.fields = {
|
||||
name: list.fields.name,
|
||||
scm_type: list.fields.scm_type
|
||||
};
|
||||
} else if (scope.view === 'Inventories'){
|
||||
list.fieds = {
|
||||
name: list.fields.name,
|
||||
organization: list.fields.organization
|
||||
};
|
||||
}
|
||||
|
||||
list_html = generateList.build({
|
||||
mode: 'edit',
|
||||
list: list,
|
||||
related: false,
|
||||
title: false
|
||||
});
|
||||
|
||||
scope.list = list;
|
||||
scope[`${list.iterator}_dataset`] = scope.dataset.data;
|
||||
scope[`${list.name}`] = scope[`${list.iterator}_dataset`].results;
|
||||
|
||||
scope.$watch(list.name, function(){
|
||||
_.forEach(scope[`${list.name}`], isSelected);
|
||||
});
|
||||
|
||||
function isSelected(item){
|
||||
if(_.find(scope.allSelected, {id: item.id})){
|
||||
item.isSelected = true;
|
||||
}
|
||||
return item;
|
||||
}
|
||||
element.append(list_html);
|
||||
$compile(element.contents())(scope);
|
||||
}
|
||||
};
|
||||
}];
|
@ -11,8 +11,12 @@ export default
|
||||
function(CreateSelect2) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: false,
|
||||
template: '<select ng-cloak class="AddPermissions-selectHide roleSelect2 form-control" ng-model="obj.roles" ng-options="role.label for role in roles | filter:{label: \'!Read\'} track by role.value" multiple required></select>',
|
||||
scope: {
|
||||
roles: '=',
|
||||
model: '='
|
||||
},
|
||||
// @issue why is the read-only role ommited from this selection?
|
||||
template: '<select ng-cloak class="AddPermissions-selectHide roleSelect2 form-control" ng-model="model" ng-options="role.name for role in roles track by role.id" multiple required></select>',
|
||||
link: function(scope, element, attrs, ctrl) {
|
||||
CreateSelect2({
|
||||
element: '.roleSelect2',
|
@ -1,5 +1,5 @@
|
||||
/** @define RoleList */
|
||||
@import "../shared/branding/colors.default.less";
|
||||
@import "../../shared/branding/colors.default.less";
|
||||
|
||||
.RoleList {
|
||||
display: flex;
|
@ -5,7 +5,7 @@ export default
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: true,
|
||||
templateUrl: templateUrl('access/roleList'),
|
||||
templateUrl: templateUrl('access/rbac-role-list/roleList'),
|
||||
link: function(scope, element, attrs) {
|
||||
// given a list of roles (things like "project
|
||||
// auditor") which are pulled from two different
|
Loading…
Reference in New Issue
Block a user