Separates inherited roles and editable roles on capabilities list.
This commit is contained in:
Mateus Machado Luna
parent
ca612638f4
commit
6c2c2fd5f1
|
|
@ -14,7 +14,7 @@
|
|||
</th>
|
||||
<!-- Capability date -->
|
||||
<th>
|
||||
<div class="th-wrap">{{ $i18n.get('label_associated_roles') }}</div>
|
||||
<div class="th-wrap">{{ $i18n.get('label_user_roles') }}</div>
|
||||
</th>
|
||||
<!-- Actions -->
|
||||
<th class="actions-header">
|
||||
|
|
@ -37,7 +37,7 @@
|
|||
v-tooltip="{
|
||||
delay: {
|
||||
show: 500,
|
||||
hide: 300,
|
||||
hide: 120,
|
||||
},
|
||||
content: capability.display_name,
|
||||
autoHide: false,
|
||||
|
|
@ -56,7 +56,7 @@
|
|||
v-tooltip="{
|
||||
delay: {
|
||||
show: 500,
|
||||
hide: 300,
|
||||
hide: 120,
|
||||
},
|
||||
content: capability.description,
|
||||
autoHide: false,
|
||||
|
|
@ -78,7 +78,7 @@
|
|||
v-tooltip="{
|
||||
delay: {
|
||||
show: 500,
|
||||
hide: 300,
|
||||
hide: 120,
|
||||
},
|
||||
content: props['complete-roles-list'],
|
||||
autoHide: false,
|
||||
|
|
@ -116,38 +116,69 @@
|
|||
<tr
|
||||
:key="index"
|
||||
class="capabilities-edit-form">
|
||||
<transition name="form-collapse">
|
||||
<transition name="form-capabilities">
|
||||
<td
|
||||
v-if="index == editingCapability"
|
||||
class="tainacan-form"
|
||||
colspan="4">
|
||||
<template v-if="existingRoles && Object.values(existingRoles).length && capability.roles">
|
||||
<b-field :addons="false">
|
||||
<label class="label is-inline-block">
|
||||
{{ $i18n.get('label_associated_roles') }}
|
||||
<help-button
|
||||
:title="$i18n.get('label_associated_roles')"
|
||||
:message="$i18n.get('info_associated_roles')"/>
|
||||
</label>
|
||||
<div class="roles-list">
|
||||
<b-checkbox
|
||||
v-for="(role, roleIndex) of existingRoles"
|
||||
:key="roleIndex"
|
||||
size="is-small"
|
||||
:value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
|
||||
@input="($event) => updateRole(role.slug, index, $event)"
|
||||
name="roles"
|
||||
:disabled="capability.roles_inherited[role.slug]">
|
||||
{{ role.name }}
|
||||
</b-checkbox>
|
||||
</div>
|
||||
</b-field>
|
||||
</template>
|
||||
<p
|
||||
v-else
|
||||
class="is-italic has-text-gray">
|
||||
{{ $i18n.get('info_no_role_associated_capability') }}
|
||||
</p>
|
||||
<div>
|
||||
<template v-if="existingRoles && Object.values(existingRoles).length && capability.roles">
|
||||
<b-field :addons="false">
|
||||
<label class="label is-inline-block">
|
||||
{{ $i18n.get('label_inherited_roles') }}
|
||||
<help-button
|
||||
:title="$i18n.get('label_inherited_roles')"
|
||||
:message="$i18n.get('info_inherited_roles')"/>
|
||||
</label>
|
||||
<div class="roles-list">
|
||||
<b-checkbox
|
||||
v-if="capability.roles_inherited[role.slug]"
|
||||
v-for="(role, roleIndex) of existingRoles"
|
||||
:key="roleIndex"
|
||||
size="is-small"
|
||||
:value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
|
||||
name="roles_inherited"
|
||||
disabled>
|
||||
{{ role.name }}
|
||||
</b-checkbox>
|
||||
</div>
|
||||
</b-field>
|
||||
</template>
|
||||
<p
|
||||
v-else
|
||||
class="is-italic has-text-gray">
|
||||
{{ $i18n.get('info_no_role_associated_capability') }}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<template v-if="existingRoles && Object.values(existingRoles).length && capability.roles">
|
||||
<b-field :addons="false">
|
||||
<label class="label is-inline-block">
|
||||
{{ $i18n.get('label_associated_roles') }}
|
||||
<help-button
|
||||
:title="$i18n.get('label_associated_roles')"
|
||||
:message="$i18n.get('info_associated_roles')"/>
|
||||
</label>
|
||||
<div class="roles-list">
|
||||
<b-checkbox
|
||||
v-if="!capability.roles_inherited[role.slug]"
|
||||
v-for="(role, roleIndex) of existingRoles"
|
||||
:key="roleIndex"
|
||||
size="is-small"
|
||||
:value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
|
||||
@input="($event) => updateRole(role.slug, index, $event)"
|
||||
name="roles">
|
||||
{{ role.name }}
|
||||
</b-checkbox>
|
||||
</div>
|
||||
</b-field>
|
||||
</template>
|
||||
<p
|
||||
v-else
|
||||
class="is-italic has-text-gray">
|
||||
{{ $i18n.get('info_no_role_associated_capability') }}
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
</transition>
|
||||
</tr>
|
||||
|
|
@ -232,28 +263,45 @@
|
|||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.table-container .table-wrapper table.tainacan-table tbody tr {
|
||||
cursor: default;
|
||||
|
||||
&.capabilities-edit-form td{
|
||||
min-height: 300px;
|
||||
height: 300px;
|
||||
padding: 16px 24px;
|
||||
&.capabilities-edit-form td {
|
||||
min-height: 120px;
|
||||
padding: 12px 24px;
|
||||
background-color: #f6f6f6;
|
||||
vertical-align: top;
|
||||
|
||||
&>div {
|
||||
display: table-cell;
|
||||
padding: 12px 24px;
|
||||
|
||||
&:last-of-type {
|
||||
border-left: 1px solid #cbcbcb;
|
||||
}
|
||||
}
|
||||
.roles-list {
|
||||
margin-top: 12px;
|
||||
column-count: 3;
|
||||
break-inside: avoid;
|
||||
|
||||
label {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
}
|
||||
@media screen and (max-width: 1280px) {
|
||||
.roles-list {
|
||||
column-count: 2;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1024px) {
|
||||
.roles-list {
|
||||
column-count: 1;
|
||||
}
|
||||
&>div:last-of-type {
|
||||
border-left: 0px solid #cbcbcb;
|
||||
border-top: 0px solid #cbcbcb;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.capabilities-edit-form:hover {
|
||||
|
|
|
|||
|
|
@ -386,6 +386,62 @@ $modal-z: 9999999;
|
|||
animation-timing-function: ease;
|
||||
}
|
||||
|
||||
// Capababilities Form Collapse
|
||||
@keyframes form-capabilities-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
height: 0px;
|
||||
max-height: 0px;
|
||||
min-height: 0px;
|
||||
// -ms-transform: translate(0%, -30%); /* IE 9 */
|
||||
// -webkit-transform: translate(0%, -30%); /* Safari */
|
||||
// transform: translate(0%, -30%);
|
||||
}
|
||||
to {
|
||||
height: 120px;
|
||||
max-height: 120px;
|
||||
min-height: 120px;
|
||||
opacity: 1;
|
||||
// -ms-transform: translate(0, 0); /* IE 9 */
|
||||
// -webkit-transform: translate(0, 0); /* Safari */
|
||||
// transform: translate(0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes form-capabilities-out {
|
||||
from {
|
||||
height: 120px;
|
||||
max-height: 120px;
|
||||
min-height: 120px;
|
||||
//opacity: 1;
|
||||
// -ms-transform: translate(0, 0); /* IE 9 */
|
||||
// -webkit-transform: translate(0, 0); /* Safari */
|
||||
// transform: translate(0, 0);
|
||||
}
|
||||
to {
|
||||
height: 0px;
|
||||
max-height: 0px;
|
||||
min-height: 0px;
|
||||
//opacity: 0;
|
||||
// -ms-transform: translate(0%, -30%); /* IE 9 */
|
||||
// -webkit-transform: translate(0%, -30%); /* Safari */
|
||||
// transform: translate(0%, -30%);
|
||||
}
|
||||
}
|
||||
|
||||
.form-capabilities-enter-active {
|
||||
overflow: hidden;
|
||||
animation-name: form-capabilities-in;
|
||||
animation-duration: 0.2s;
|
||||
animation-timing-function: ease;
|
||||
}
|
||||
.form-capabilities-leave-active {
|
||||
overflow: hidden;
|
||||
animation-name: form-capabilities-out;
|
||||
animation-duration: 0.15s;
|
||||
animation-timing-function: ease;
|
||||
}
|
||||
|
||||
// Filters menu
|
||||
@keyframes filters-menu-in {
|
||||
from {
|
||||
|
|
|
|||
|
|
@ -439,7 +439,10 @@ return apply_filters( 'tainacan-admin-i18n', [
|
|||
'label_month' => __( 'Month', 'tainacan' ),
|
||||
'label_year' => __( 'Year', 'tainacan' ),
|
||||
'label_related_to' => __( 'Related to', 'tainacan' ),
|
||||
'label_user_roles' => __( 'User roles', 'tainacan' ),
|
||||
'label_associated_roles' => __( 'Associated roles', 'tainacan' ),
|
||||
'label_inherited_roles' => __( 'Inherited roles', 'tainacan' ),
|
||||
|
||||
// Instructions. More complex sentences to guide user and placeholders
|
||||
'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),
|
||||
'instruction_delete_selected_items' => __( 'Delete selected items', 'tainacan' ),
|
||||
|
|
@ -573,7 +576,8 @@ return apply_filters( 'tainacan-admin-i18n', [
|
|||
'info_showing_capabilities' => __( 'Showing capabilities ', 'tainacan' ),
|
||||
'info_no_capabilities_found' => __( 'No capabilities found.', 'tainacan' ),
|
||||
'info_no_role_associated_capability' => __( 'No role associated to this capability', 'tainacan' ),
|
||||
'info_associated_roles' => __( 'These are the roles that have this capability.', 'tainacan' ),
|
||||
'info_associated_roles' => __( 'These are the roles that have this capability set. You may add or remove the capability to customize the role.', 'tainacan' ),
|
||||
'info_inherited_roles' => __( 'These are the roles that have greater capabilities, which inherit this one. You can not edit this as it will not have precendece over the greater capability.', 'tainacan' ),
|
||||
'info_warning_remove_from_trash_first' => __( 'Remove this item from trash first' ),
|
||||
'info_to' => __( ' to ', 'tainacan' ),
|
||||
'info_of' => __( ' of ', 'tainacan' ),
|
||||
|
|
|
|||
Loading…
Reference in New Issue