v-container(fluid, grid-list-lg)
v-layout(row wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-social-group.svg', alt='Edit Group', style='width: 80px;')
.admin-header-title
.headline.blue--text.text--darken-2 Edit Group
.subheading.grey--text {{name}}
v-spacer
.caption.grey--text ID #[strong {{group.id}}]
v-divider.mx-3(vertical)
v-btn(color='indigo', large, outline, to='/groups')
v-icon arrow_back
v-dialog(v-model='deleteGroupDialog', max-width='500', v-if='!group.isSystem')
v-btn(color='red', large, outline, slot='activator')
v-icon(color='red') delete
v-card
.dialog-header.is-red Delete Group?
v-card-text Are you sure you want to delete group #[strong {{ name }}]? All users will be unassigned from this group.
v-card-actions
v-spacer
v-btn(flat, @click='deleteGroupDialog = false') Cancel
v-btn(color='red', dark, @click='deleteGroup') Delete
v-btn(color='primary', large, depressed, @click='updateGroup')
v-icon(left) check
span Update Group
v-card.mt-3
v-tabs(v-model='tab', :color='$vuetify.dark ? "primary" : "grey darken-2"', fixed-tabs, slider-color='white', show-arrows, dark)
v-tab(key='properties') Properties
v-tab(key='permissions') Permissions
v-tab(key='rules') Page Rules
v-tab(key='users') Users
v-tab-item(key='properties', :transition='false', :reverse-transition='false')
v-card
v-card-text
v-text-field(
outline
background-color='grey lighten-3'
v-model='name'
label='Group Name'
counter='255'
prepend-icon='people'
)
v-tab-item(key='permissions', :transition='false', :reverse-transition='false')
v-container.pa-3(fluid, grid-list-md)
v-layout(row, wrap)
v-flex(xs12, md6, lg4, v-for='pmGroup in permissions')
v-card.md2.grey(flat, :class='$vuetify.dark ? "darken-4" : "lighten-5"')
v-subheader {{pmGroup.category}}
v-card-text.pt-0
template(v-for='(pm, idx) in pmGroup.items')
v-checkbox.pt-0(
:key='pm.permission'
:label='pm.permission'
:hint='pm.hint'
persistent-hint
color='primary'
v-model='group.permissions'
:value='pm.permission'
:append-icon='pm.warning ? "warning" : null',
:disabled='(group.isSystem && pm.restrictedForSystem) || group.id === 1 || pm.disabled'
)
v-divider.mt-3(v-if='idx < pmGroup.items.length - 1')
v-tab-item(key='rules', :transition='false', :reverse-transition='false')
v-card
v-card-title.pb-0
v-spacer
v-btn(flat, outline)
v-icon(left) arrow_drop_down
| Load Preset
v-btn(flat, outline)
v-icon(left) vertical_align_bottom
| Import Rules
.pa-3.pl-4
criterias
v-tab-item(key='users', :transition='false', :reverse-transition='false')
v-card
v-card-title.pb-0
v-spacer
v-btn(color='primary', outline, flat, @click='searchUserDialog = true')
v-icon(left) assignment_ind
| Assign User
v-data-table(
:items='group.users',
:headers='headers',
:search='search',
:pagination.sync='pagination',
:rows-per-page-items='[15]'
hide-actions
)
template(slot='items', slot-scope='props')
tr(:active='props.selected')
td.text-xs-right {{ props.item.id }}
td {{ props.item.name }}
td {{ props.item.email }}
td
v-menu(bottom, right, min-width='200')
v-btn(icon, slot='activator'): v-icon.grey--text.text--darken-1 more_horiz
v-list
v-list-tile(@click='unassignUser(props.item.id)')
v-list-tile-action: v-icon(color='orange') highlight_off
v-list-tile-content
v-list-tile-title Unassign
template(slot='no-data')
v-alert.ma-3(icon='warning', :value='true', outline) No users to display.
.text-xs-center.py-2(v-if='users.length > 15')
v-pagination(v-model='pagination.page', :length='pages')
user-search(v-model='searchUserDialog', @select='assignUser')