1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-23 15:19:42 +02:00

[WIP] space permissions UX

This commit is contained in:
Harvey Kandola 2017-11-24 12:50:06 +00:00
parent e10313b7cc
commit 1c08a7fbcf
8 changed files with 121 additions and 102 deletions

View file

@ -109,11 +109,6 @@ export default Component.extend(NotifierMixin, {
} }
}); });
this.get('folderService').savePermissions(folder.get('id'), payload).then(() => {
this.showNotification('Saved permissions');
this.get('router').transitionTo('folder', folder.get('id'), folder.get('slug'));
});
if (is.not.undefined(hasEveryone)) { if (is.not.undefined(hasEveryone)) {
folder.markAsPublic(); folder.markAsPublic();
this.showNotification('Marked space as public'); this.showNotification('Marked space as public');
@ -126,6 +121,12 @@ export default Component.extend(NotifierMixin, {
this.showNotification('Marked space as private'); this.showNotification('Marked space as private');
} }
} }
this.get('folderService').savePermissions(folder.get('id'), payload).then(() => {
this.showNotification('Saved permissions');
$('#space-permission-modal').modal('hide');
$('#space-permission-modal').modal('dispose');
});
} }
} }
}); });

View file

@ -19,6 +19,7 @@ export default Component.extend({
title: 'Confirm', title: 'Confirm',
show: false, show: false,
buttonType: 'btn-secondary', buttonType: 'btn-secondary',
size: '', // modal-lg, modal-sm
didInsertElement() { didInsertElement() {
this._super(...arguments); this._super(...arguments);

View file

@ -98,5 +98,11 @@ $link-hover-decoration: none;
@import "node_modules/bootstrap/scss/utilities"; @import "node_modules/bootstrap/scss/utilities";
@import "node_modules/bootstrap/scss/popover"; @import "node_modules/bootstrap/scss/popover";
@import "node_modules/bootstrap/scss/tooltip"; @import "node_modules/bootstrap/scss/tooltip";
// @import "node_modules/bootstrap/scss/images"; @import "node_modules/bootstrap/scss/tables";
// @import "node_modules/bootstrap/scss/navbar"; // @import "node_modules/bootstrap/scss/navbar";
// @import "node_modules/bootstrap/scss/images";
.modal-80 {
max-width: 80% !important;
}

View file

@ -1,48 +1,4 @@
.space-settings { .space-settings {
> .panel {
@include content-container();
@include ease-in();
@extend .transition-all;
margin: 0 0 30px 0;
}
.permissions-table {
padding: 0;
margin: 0 auto;
width: 90%;
> .row {
padding: 8px 0;
> .permission-name-cell {
font-size: 1.1rem;
background-color: $color-off-white;
padding: 10px 10px;
}
> .permission-roles-cell {
margin: 15px 0 20px 40px;
> .role-container {
white-space: nowrap;
display: inline-block;
margin-bottom: 10px;
> .role-category {
color: $color-gray;
font-weight: bold;
display: inline-block;
}
}
> label {
color: $color-gray;
font-weight: normal;
}
}
}
}
.category-table { .category-table {
padding: 0; padding: 0;
margin: 0 0 0 20px; margin: 0 0 0 20px;

View file

@ -118,4 +118,37 @@
} }
} }
.space-admin {
> .permission-table {
// width: 100%;
// overflow-x: auto;
> tbody, > thead {
> tr, > th {
> td, > th {
margin: 0;
padding: 10px 15px;
text-align: center;
}
> td:first-child {
text-align: left;
}
}
}
> thead {
> tr {
> th {
background-color: $color-off-white;
color: $color-gray;
}
> th:first-child {
background-color: $color-white !important;
border: none !important;
}
}
}
}
}

View file

@ -1,49 +1,71 @@
<div class="space-settings"> <div id="space-permission-modal" class="modal" tabindex="-1" role="dialog">
<div class="panel"> <div class="modal-dialog modal-80">
<div class="form-header-sticky"> <div class="modal-content">
<div class="left-zone"> <div class="modal-header">Space Permissions</div>
<div class="title">Permissions</div> <div class="modal-body" style="overflow-x: auto;">
<div class="tip">Define who can do what in this space</div>
<div class="space-admin">
<table class="table table-hover table-responsive permission-table">
<thead>
<tr>
<th></th>
<th colspan="3">Spaces</th>
<th colspan="6" class="text-info">Documents</th>
</tr>
<tr>
<th></th>
<th>View</th>
<th>Manage</th>
<th>Owner</th>
<th class="text-info">Create</th>
<th class="text-info">Edit</th>
<th class="text-info">Delete</th>
<th class="text-info">Move</th>
<th class="text-info">Copy</th>
<th class="text-info">Templates</th>
</tr>
</thead>
<tbody>
{{#each permissions as |permission|}}
<tr>
<td>{{permission.fullname}} {{if (eq permission.userId session.user.id) '(you)'}}</td>
<td>
{{input type="checkbox" id=(concat 'space-role-view-' permission.userId) checked=permission.spaceView}}
</td>
<td>
{{input type="checkbox" id=(concat 'space-role-manage-' permission.userId) checked=permission.spaceManage}}
</td>
<td>
{{input type="checkbox" id=(concat 'space-role-owner-' permission.userId) checked=permission.spaceOwner}}
</td>
<td>
{{input type="checkbox" id=(concat 'doc-role-add-' permission.userId) checked=permission.documentAdd}}
</td>
<td>
{{input type="checkbox" id=(concat 'doc-role-edit-' permission.userId) checked=permission.documentEdit}}
</td>
<td>
{{input type="checkbox" id=(concat 'doc-role-delete-' permission.userId) checked=permission.documentDelete}}
</td>
<td>
{{input type="checkbox" id=(concat 'doc-role-move-' permission.userId) checked=permission.documentMove}}
</td>
<td>
{{input type="checkbox" id=(concat 'doc-role-copy-' permission.userId) checked=permission.documentCopy}}
</td>
<td>
{{input type="checkbox" id=(concat 'doc-role-template-' permission.userId) checked=permission.documentTemplate}}
</td>
</tr>
{{/each}}
</tbody>
</table>
</div>
</div> </div>
<div class="right-zone"> <div class="modal-footer">
<div class="regular-button button-blue" {{action 'setPermissions'}}>GRANT</div> <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
</div> <button type="button" class="btn btn-outline-success" onclick={{action 'setPermissions'}}>Save</button>
</div>
<div class="clearfix" />
<div class="input-control">
<div class="permissions-table">
{{#each permissions as |permission|}}
<div class="row">
<div class="permission-name-cell">{{permission.fullname}} {{if (eq permission.userId session.user.id) '(you)'}}</div>
<div class="permission-roles-cell">
<div class="role-container">
<span class="role-category">Space:&nbsp;</span>
{{input type="checkbox" id=(concat 'space-role-view-' permission.userId) checked=permission.spaceView}}
<label for="space-role-view-{{permission.userId}}">view</label>&nbsp;&nbsp;
{{input type="checkbox" id=(concat 'space-role-manage-' permission.userId) checked=permission.spaceManage}}
<label for="space-role-manage-{{permission.userId}}">manage</label>&nbsp;&nbsp;
{{input type="checkbox" id=(concat 'space-role-owner-' permission.userId) checked=permission.spaceOwner}}
<label for="space-role-owner-{{permission.userId}}">owner</label>&nbsp;&nbsp;
</div>
&nbsp;&nbsp;&nbsp;&nbsp;
<div class="role-container">
<span class="role-category">Document:&nbsp;</span>
{{input type="checkbox" id=(concat 'doc-role-add-' permission.userId) checked=permission.documentAdd}}
<label for="doc-role-add-{{permission.userId}}">create</label>&nbsp;&nbsp;
{{input type="checkbox" id=(concat 'doc-role-edit-' permission.userId) checked=permission.documentEdit}}
<label for="doc-role-edit-{{permission.userId}}">edit</label>&nbsp;&nbsp;
{{input type="checkbox" id=(concat 'doc-role-delete-' permission.userId) checked=permission.documentDelete}}
<label for="doc-role-delete-{{permission.userId}}">delete</label>&nbsp;&nbsp;
{{input type="checkbox" id=(concat 'doc-role-move-' permission.userId) checked=permission.documentMove}}
<label for="doc-role-move-{{permission.userId}}">move</label>&nbsp;&nbsp;
{{input type="checkbox" id=(concat 'doc-role-copy-' permission.userId) checked=permission.documentCopy}}
<label for="doc-role-copy-{{permission.userId}}">copy</label>&nbsp;&nbsp;
{{input type="checkbox" id=(concat 'doc-role-template-' permission.userId) checked=permission.documentTemplate}}
<label for="doc-role-template-{{permission.userId}}">templates</label>&nbsp;&nbsp;
</div>
</div>
</div>
{{/each}}
</div> </div>
</div> </div>
</div> </div>

View file

@ -16,12 +16,10 @@
{{/if}} {{/if}}
{{#if spaceSettings}} {{#if spaceSettings}}
{{#link-to 'folder.settings' space.id space.slug}} <div id="space-settings-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="Set permissions">
<div id="space-settings-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="User permissions"> <i class="material-icons" data-toggle="modal" data-target="#space-permission-modal" data-backdrop="static">security</i>
<i class="material-icons">security</i> </div>
</div> <div class="button-icon-gap" />
<div class="button-icon-gap" />
{{/link-to}}
<div id="space-invite-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="Invite to space"> <div id="space-invite-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="Invite to space">
<i class="material-icons" data-toggle="modal" data-target="#space-invite-modal" data-backdrop="static">person_add</i> <i class="material-icons" data-toggle="modal" data-target="#space-invite-modal" data-backdrop="static">person_add</i>
@ -104,3 +102,5 @@
{{/toolbar/t-actions}} {{/toolbar/t-actions}}
{{/toolbar/t-toolbar}} {{/toolbar/t-toolbar}}
{{folder/permission-admin folders=spaces folder=space}}

View file

@ -1,5 +1,5 @@
<div id="{{contentId}}" class="modal" tabindex="-1" role="dialog"> <div id="{{contentId}}" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog {{size}}" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header">{{title}}</div> <div class="modal-header">{{title}}</div>
<div class="modal-body"> <div class="modal-body">