summaryrefslogtreecommitdiffstats
path: root/webapp
diff options
context:
space:
mode:
authorJannik Schönartz2019-02-25 07:53:21 +0100
committerJannik Schönartz2019-02-25 07:53:21 +0100
commitc3f06a43fb1286f211c1475a87dc8b4f6d88948b (patch)
tree8505d2dad3e450b22577408cd678a555beef5be6 /webapp
parent[webapp/user] Add user management module for creating / deleting user accounts (diff)
parent[permissionmanager] rework for blacklist system (diff)
downloadbas-c3f06a43fb1286f211c1475a87dc8b4f6d88948b.tar.gz
bas-c3f06a43fb1286f211c1475a87dc8b4f6d88948b.tar.xz
bas-c3f06a43fb1286f211c1475a87dc8b4f6d88948b.zip
Merge
Diffstat (limited to 'webapp')
-rw-r--r--webapp/src/components/ConfiguratorModuleDelete.vue2
-rw-r--r--webapp/src/components/DataTable.vue62
-rw-r--r--webapp/src/components/GroupModuleClientView.vue4
-rw-r--r--webapp/src/components/GroupModuleDialog.vue2
-rw-r--r--webapp/src/components/GroupModuleGroupView.vue4
-rw-r--r--webapp/src/components/NoPermissionError.vue34
-rw-r--r--webapp/src/components/PermissionModule.vue56
-rw-r--r--webapp/src/components/PermissionModuleEdit.vue129
-rw-r--r--webapp/src/components/PermissionModuleGrantRevoke.vue14
-rw-r--r--webapp/src/components/PermissionModuleRoleList.vue11
-rw-r--r--webapp/src/components/PermissionModuleUserList.vue9
-rw-r--r--webapp/src/components/RegistrationModuleEdit.vue4
-rw-r--r--webapp/src/store/permissions.js22
13 files changed, 230 insertions, 123 deletions
diff --git a/webapp/src/components/ConfiguratorModuleDelete.vue b/webapp/src/components/ConfiguratorModuleDelete.vue
index d630524..4ef59ec 100644
--- a/webapp/src/components/ConfiguratorModuleDelete.vue
+++ b/webapp/src/components/ConfiguratorModuleDelete.vue
@@ -14,7 +14,7 @@
<v-card-title primary-title class="dialog-title elevation-3">
<div class="headline">{{ $tc('title', dialog.info.selected.length, [dialog.info.selected.length]) }}</div>
</v-card-title>
- <v-card-text>
+ <v-card-text style="height: 100%">
<div v-for="item in dialog.info.selected" class="grey--text" :key="item.id">[{{ item.id }}] {{ item.name }}</div>
</v-card-text>
<v-divider></v-divider>
diff --git a/webapp/src/components/DataTable.vue b/webapp/src/components/DataTable.vue
index 94631ff..d87cbc7 100644
--- a/webapp/src/components/DataTable.vue
+++ b/webapp/src/components/DataTable.vue
@@ -27,8 +27,8 @@
<template>
<div>
- <v-layout wrap>
- <v-flex xs12 :md6="!menuMode" class="d-flex align-center search-wrapper" :class="{ 'menu-mode-search-wrapper': menuMode }">
+ <v-layout wrap :class="{ 'd-block': slim }">
+ <v-flex xs12 :md6="!slim" class="d-flex align-center search-wrapper" :class="{ 'slim-search-wrapper': slim }">
<div class="search-field-wrapper">
<div v-for="(s, index) in search" :key="index">
<v-text-field
@@ -44,6 +44,7 @@
clearable
></v-text-field>
<v-select
+ v-if="!slim"
solo flat
class="column-select"
v-model="s.key"
@@ -57,14 +58,16 @@
left: true
}"
></v-select>
- <v-btn v-if="index === 0" icon @click="newSearchField"><v-icon>add</v-icon></v-btn>
- <v-btn v-else icon @click="removeSearchField(s)"><v-icon>remove</v-icon></v-btn>
+ <template v-if="!slim">
+ <v-btn v-if="index === 0" icon @click="newSearchField"><v-icon>add</v-icon></v-btn>
+ <v-btn v-else icon @click="removeSearchField(s)"><v-icon>remove</v-icon></v-btn>
+ </template>
</div>
</div>
- <v-divider :class="{ 'hidden-md-and-up': !menuMode }"></v-divider>
- <v-divider v-if="!menuMode" vertical class="hidden-sm-and-down"></v-divider>
+ <v-divider :class="{ 'hidden-md-and-up': !slim }"></v-divider>
+ <v-divider v-if="!slim" vertical class="hidden-sm-and-down"></v-divider>
</v-flex>
- <v-flex style="padding: 6px 16px" class="non-selectable" xs12 :md6="!menuMode">
+ <v-flex style="padding: 6px 16px" class="non-selectable" xs12 :md6="!slim">
<div class="d-flex align-center" style="font-size: 12px">
<div class="nowrap">
<v-tooltip top open-delay="800">
@@ -87,19 +90,19 @@
</v-tooltip>
</div>
- <div :class="{ 'text-xs-center': !pageMode && !menuMode, 'text-xs-right': pageMode || menuMode }">
+ <div :class="{ 'text-xs-center': rowCount === undefined, 'text-xs-right': rowCount !== undefined }">
<span class="nowrap">{{ filteredRows.length + ' ' + $t('entries') }}</span>
<span class="nowrap">{{ '(' + selected.length + ' ' + $t('selected') + ')' }}</span>
</div>
- <div v-if="!pageMode && !menuMode" class="text-xs-right hidden-xs-only">
+ <div v-if="rowCount === undefined" class="text-xs-right hidden-xs-only">
{{ $t('height') }}:
</div>
<v-select
- v-if="!pageMode && !menuMode"
+ v-if="rowCount === undefined"
solo flat
class="rowcount-select"
- v-model="rowCount"
+ v-model="internalRowCount"
:items="[ 5, 10, 20, 50, 100, { text: $t('all'), value: '-1' }]"
color="primary"
hide-details
@@ -121,11 +124,11 @@
:style="scrollerStyle"
:items="filteredRows"
:item-height="48"
- :page-mode="(rowCount <= 0 || pageMode) && !menuMode"
+ :page-mode="computedRowCount <= 0"
@click.native.capture.passive="setShiftState"
>
<template slot="before-container">
- <div class="table-head-wrapper non-selectable" :style="{ 'min-width': minWidth }">
+ <div class="table-head-wrapper non-selectable" :style="{ 'min-width': computedMinWidth }">
<div class="table-head">
<div class="non-selectable header-cell">
<v-icon @click="toggleSelectAll">
@@ -190,27 +193,21 @@ export default {
default: () => []
},
minWidth: {
- type: String,
- default: '600px'
+ type: String
},
- pageMode: {
+ slim: {
type: Boolean,
default: false
},
- menuMode: {
- type: Boolean,
- default: false
- },
- menuModeRowCount: {
- type: Number,
- default: 6
+ rowCount: {
+ type: Number
}
},
data () {
return {
selected: [],
search: [{ text: { raw: '', upper: '', regex: new RegExp(), regexCI: new RegExp() }, key: null }],
- rowCount: 10,
+ internalRowCount: 10,
selectState: 0,
headerSortState: {},
regex: false,
@@ -226,12 +223,17 @@ export default {
searchableHeaders () {
return this.headers.filter(h => h.text !== undefined)
},
+ computedMinWidth () {
+ if (this.minWidth) return this.minWidth
+ if (this.slim) return '200px'
+ return '600px'
+ },
+ computedRowCount () {
+ return this.rowCount === undefined ? this.internalRowCount : this.rowCount
+ },
scrollerStyle () {
- const style = { '--min-table-width': this.minWidth }
- var rowCount = this.rowCount
- if (this.pageMode) rowCount = -1
- else if (this.menuMode) rowCount = this.menuModeRowCount
- if (rowCount > 0) style.height = (Math.max(Math.min(rowCount, this.filteredRows.length), 1) * 48 + 58) + 'px'
+ const style = { '--min-table-width': this.computedMinWidth }
+ if (this.computedRowCount > 0) style.height = (Math.max(Math.min(this.computedRowCount, this.filteredRows.length), 1) * 48 + 58) + 'px'
return style
},
dataKeys () { return this.headers.map(x => x.key) },
@@ -476,7 +478,7 @@ export default {
}
}
-.menu-mode-search-wrapper {
+.slim-search-wrapper {
flex-direction: column;
align-items: stretch;
}
diff --git a/webapp/src/components/GroupModuleClientView.vue b/webapp/src/components/GroupModuleClientView.vue
index c9e7355..68298c4 100644
--- a/webapp/src/components/GroupModuleClientView.vue
+++ b/webapp/src/components/GroupModuleClientView.vue
@@ -42,10 +42,10 @@
<div class="info-box">
<div class="body-2 info-heading">
<v-icon>device_hub</v-icon><span>{{ $t('groups') }}</span>
- <v-menu v-if="editMode" offset-y :close-on-content-click="false" :max-width="400" lazy>
+ <v-menu v-if="editMode" offset-y :close-on-content-click="false" lazy>
<v-btn slot="activator" small icon class="info-heading-button"><v-icon>edit</v-icon></v-btn>
<v-card>
- <data-table ref="datatable" v-model="groups" :headers="headers" :items="groupList" menu-mode></data-table>
+ <data-table ref="datatable" v-model="groups" :headers="headers" :items="groupList" slim :row-count="6"></data-table>
</v-card>
</v-menu>
</div>
diff --git a/webapp/src/components/GroupModuleDialog.vue b/webapp/src/components/GroupModuleDialog.vue
index 5dcab77..1cf89e3 100644
--- a/webapp/src/components/GroupModuleDialog.vue
+++ b/webapp/src/components/GroupModuleDialog.vue
@@ -108,7 +108,7 @@
</v-card-title>
<v-card-text v-if="action === 'add' || action === 'select'" class="table-container">
- <data-table ref="datatable" v-model="selected" :headers="headers" :items="items" :page-mode="$vuetify.breakpoint.smAndDown"></data-table>
+ <data-table ref="datatable" v-model="selected" :headers="headers" :items="items" :row-count="$vuetify.breakpoint.smAndDown ? -1 : undefined"></data-table>
</v-card-text>
<v-card-text v-else-if="action === 'remove' || action === 'delete'" class="selected-list">
<v-checkbox
diff --git a/webapp/src/components/GroupModuleGroupView.vue b/webapp/src/components/GroupModuleGroupView.vue
index b53abeb..f7a0151 100644
--- a/webapp/src/components/GroupModuleGroupView.vue
+++ b/webapp/src/components/GroupModuleGroupView.vue
@@ -54,10 +54,10 @@
<div class="info-box">
<div class="body-2 info-heading">
<v-icon>device_hub</v-icon><span>{{ $t('parents') }}</span>
- <v-menu v-if="editMode" offset-y :close-on-content-click="false" :max-width="400" lazy>
+ <v-menu v-if="editMode" offset-y :close-on-content-click="false" lazy>
<v-btn slot="activator" small icon class="info-heading-button"><v-icon>edit</v-icon></v-btn>
<v-card>
- <data-table v-model="parents" :headers="headers" :items="groupList" menu-mode min-width="200px"></data-table>
+ <data-table v-model="parents" :headers="headers" :items="groupList" slim :row-count="6"></data-table>
</v-card>
</v-menu>
</div>
diff --git a/webapp/src/components/NoPermissionError.vue b/webapp/src/components/NoPermissionError.vue
new file mode 100644
index 0000000..031ab78
--- /dev/null
+++ b/webapp/src/components/NoPermissionError.vue
@@ -0,0 +1,34 @@
+<i18n>
+{
+ "en": {
+ "noPermission": "You don't have permission for this."
+ },
+ "de": {
+ "noPermission": "Sie haben keine Berechtigung hierfür."
+ }
+}
+</i18n>
+
+<template>
+ <div>
+ {{ $t('noPermission') }}
+ </div>
+</template>
+
+<script>
+
+export default {
+ name: 'NoPermissionError',
+ data () {
+ return {
+ }
+ },
+ methods: {
+ }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+
+</style>
diff --git a/webapp/src/components/PermissionModule.vue b/webapp/src/components/PermissionModule.vue
index 26d4792..b80dbaa 100644
--- a/webapp/src/components/PermissionModule.vue
+++ b/webapp/src/components/PermissionModule.vue
@@ -21,25 +21,28 @@
<v-container fill-height>
<v-layout>
<v-flex class="tabs-wrapper" xl10 offset-xl1 lg12>
- <v-card>
- <v-tabs :dark="tabsDark" :color="tabsColor" :slider-color="tabsSliderColor"
- centered
- v-model="tab"
- >
- <v-tab>{{ $t('roles') }}</v-tab>
- <v-tab>{{ $t('users') }}</v-tab>
- </v-tabs>
- </v-card>
- <v-tabs-items v-model="tab">
- <v-tab-item>
- <v-subheader>{{ $t('roles') }}</v-subheader>
- <permission-module-role-list/>
- </v-tab-item>
- <v-tab-item>
- <v-subheader>{{ $t('users') }}</v-subheader>
- <permission-module-user-list/>
- </v-tab-item>
- </v-tabs-items>
+ <v-card>
+ <v-tabs :dark="tabsDark" :color="tabsColor" :slider-color="tabsSliderColor"
+ centered
+ v-model="tab"
+ >
+ <v-tab>{{ $t('roles') }}</v-tab>
+ <v-tab>{{ $t('users') }}</v-tab>
+ </v-tabs>
+ </v-card>
+ <v-tabs-items v-model="tab" v-if="canView">
+ <v-tab-item>
+ <v-subheader>{{ $t('roles') }}</v-subheader>
+ <permission-module-role-list/>
+ </v-tab-item>
+ <v-tab-item>
+ <v-subheader>{{ $t('users') }}</v-subheader>
+ <permission-module-user-list/>
+ </v-tab-item>
+ </v-tabs-items>
+ <v-tabs-items v-model="tab" v-else>
+ <no-permission-error/>
+ </v-tabs-items>
</v-flex>
</v-layout>
@@ -82,6 +85,7 @@ import PermissionModuleRoleList from '@/components/PermissionModuleRoleList'
import PermissionModuleUserList from '@/components/PermissionModuleUserList'
import PermissionModuleGrantRevoke from '@/components/PermissionModuleGrantRevoke'
import PermissionModuleEdit from '@/components/PermissionModuleEdit'
+import NoPermissionError from '@/components/NoPermissionError'
import { mapState, mapGetters } from 'vuex'
export default {
@@ -90,12 +94,14 @@ export default {
PermissionModuleRoleList,
PermissionModuleUserList,
PermissionModuleGrantRevoke,
- PermissionModuleEdit
+ PermissionModuleEdit,
+ NoPermissionError
},
data () {
return {
- components: ['PermissionModuleRoleList', 'PermissionModuleUserList'],
- tab: 0
+ components: ['PermissionModuleRoleList', 'PermissionModuleUserList', 'NoPermissionError'],
+ tab: 0,
+ canView: false
}
},
computed: {
@@ -103,6 +109,12 @@ export default {
...mapState('permissions', ['selectedRoles', 'selectedUsers'])
},
methods: {
+ },
+ created () {
+ this.$http.get('/api/permissions/permissions.*').then(response => {
+ this.canView = response.data
+ })
+ this.$store.dispatch('permissions/loadData')
}
}
</script>
diff --git a/webapp/src/components/PermissionModuleEdit.vue b/webapp/src/components/PermissionModuleEdit.vue
index fc66e62..4f78c14 100644
--- a/webapp/src/components/PermissionModuleEdit.vue
+++ b/webapp/src/components/PermissionModuleEdit.vue
@@ -1,13 +1,13 @@
<i18n>
{
"en": {
+ "blacklist": "Blacklist",
"description": "Description",
"groupdependent": "Groupdependent",
"groups": "Groups",
"id": "ID",
"name": "Name",
"permissions": "Permissions",
- "recursiveMode": "Select Groups recursive",
"role": "Role",
"roleName": "Role Name",
"roleNameEmptyError": "Role Name can't be empty.",
@@ -17,13 +17,13 @@
"summary": "Summary"
},
"de": {
+ "blacklist": "Blacklist",
"description": "Beschreibung",
"groupdependent": "Gruppengebunden",
"groups": "Gruppen",
"id": "ID",
"name": "Name",
"permissions": "Rechte",
- "recursiveMode": "Gruppen rekursiv auswählen",
"role": "Rolle",
"roleName": "Rollenname",
"roleNameEmptyError": "Rollenname kann nicht leer sein.",
@@ -80,6 +80,15 @@
:editable="stepCompleted >= 3"
edit-icon="check"
>
+ {{ $t('blacklist') }}
+ </v-stepper-step>
+ <v-divider></v-divider>
+ <v-stepper-step
+ :complete="stepCompleted >= 5"
+ step="5"
+ :editable="stepCompleted >= 4"
+ edit-icon="check"
+ >
{{ $t('summary') }}
</v-stepper-step>
</v-stepper-header>
@@ -117,17 +126,14 @@
</v-stepper-content>
<v-stepper-content step="3" class="stepper-padding-0">
- <data-table v-model="groupsSelected" :headers="groupHeaders" :items="groups">
- <div slot="actions" slot-scope="row" style="text-align: right">
- <v-tooltip top :key="row.item" open-delay="800">
- <v-btn slot="activator" :loading="row.item.loadingSubgroups" icon @click.stop @mousedown="loadChilds(row.item)" style="margin: 0"><v-icon>device_hub</v-icon></v-btn>
- <span>{{ $t('selectChildGroups') }}</span>
- </v-tooltip>
- </div>
- </data-table>
+ <data-table v-model="whitelist" :headers="groupHeaders" :items="groups" logging/>
+ </v-stepper-content>
+
+ <v-stepper-content step="4" class="stepper-padding-0">
+ <data-table v-model="blacklist" :headers="groupHeaders" :items="blacklistGroups"/>
</v-stepper-content>
- <v-stepper-content step="4">
+ <v-stepper-content step="5">
<v-text-field
v-model="roleName"
:label="$t('roleName')"
@@ -171,7 +177,23 @@
<v-subheader inset>{{ $t('groups') }}</v-subheader>
<v-divider class="list-header-margin"></v-divider>
<RecycleScroller
- :items="groupsSelected"
+ :items="whitelist"
+ :item-height="48"
+ page-mode
+ >
+ <div slot-scope="{ item }" class="list-item">
+ <div class="list-item-header">{{ item.id }} {{ item.name }}</div>
+ <div class="list-item-subheader">{{ item.description }}</div>
+ </div>
+ </RecycleScroller>
+ </div>
+ </v-flex>
+ <v-flex xs12 sm6>
+ <div>
+ <v-subheader inset>{{ $t('blacklist') }}</v-subheader>
+ <v-divider class="list-header-margin"></v-divider>
+ <RecycleScroller
+ :items="blacklist"
:item-height="48"
page-mode
>
@@ -196,7 +218,8 @@
<v-btn color="primary" v-show="step == 1" @click.native="completeStepOne()">{{ $t('continue') }}</v-btn>
<v-btn color="primary" v-show="step == 2" @click.native="completeStepTwo()">{{ $t('continue') }}</v-btn>
<v-btn color="primary" v-show="step == 3" @click.native="completeStepThree()">{{ $t('continue') }}</v-btn>
- <v-btn class="success" v-show="step == 4" @click="submit" type="submit">{{ $t('submit') }}</v-btn>
+ <v-btn color="primary" v-show="step == 4" @click.native="completeStepFour()">{{ $t('continue') }}</v-btn>
+ <v-btn class="success" v-show="step == 5" @click="submit" type="submit">{{ $t('submit') }}</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
@@ -204,6 +227,7 @@
<script>
import DataTable from '@/components/DataTable'
+import { mapState } from 'vuex'
export default {
name: 'PermissionModuleEdit',
@@ -216,12 +240,10 @@ export default {
valid: true,
step: 1,
stepCompleted: 0,
- permissions: [],
- groups: [],
+ blacklistGroups: [],
permissionsSelected: [],
- groupsSelected: [],
- groupsSummary: [],
- recursiveSwitch: false,
+ whitelist: [],
+ blacklist: [],
permissionHeaders: [
{ text: this.$t('name'), key: 'name' },
{ text: this.$t('description'), key: 'descr' },
@@ -230,8 +252,7 @@ export default {
groupHeaders: [
{ text: this.$t('id'), key: 'id' },
{ text: this.$t('name'), key: 'name' },
- { text: this.$t('description'), key: 'description' },
- { key: 'actions', width: '60px' }
+ { text: this.$t('description'), key: 'description' }
],
roleName: '',
roleDescr: ''
@@ -241,16 +262,17 @@ export default {
submit (event) {
if (this.$refs.form.validate()) {
const filteredPermissions = this.permissionsSelected.map(x => x.id)
- const filteredGroups = this.groupsSelected.map(x => x.id)
+ const filteredGroups = this.whitelist.map(x => x.id)
+ const filteredBlacklist = this.blacklist.map(x => x.id)
this.$http.post('/api/roles' + (this.roleId === 0 ? '' : '/' + this.roleId), {
id: this.roleId,
name: this.roleName,
descr: this.roleDescr,
permissions: filteredPermissions,
groups: filteredGroups,
- recursiveMode: this.recursiveSwitch
+ blacklist: filteredBlacklist
}).then(response => {
- this.$store.commit('newSnackbar', this.$t('roleSavedSuccess'))
+ this.$snackbar({ color: 'success', text: this.$t('roleSavedSuccess'), timeout: 15000 })
this.$store.dispatch('permissions/loadRoleData')
this.$store.commit('permissions/setEdit', false)
}).catch(error => {
@@ -258,13 +280,23 @@ export default {
})
}
},
- loadRole (roleId) {
- this.$http('/api/roles/' + this.roleId).then(response => {
- this.roleName = response.data.name
- this.roleDescr = response.data.descr
- this.permissionsSelected = response.data.permissions
- this.groupsSelected = response.data.groups
- this.recursiveSwitch = response.data.recursiveGroups
+ async loadRole (roleId) {
+ const response = await this.$http('/api/roles/' + this.roleId)
+ this.roleName = response.data.name
+ this.roleDescr = response.data.descr
+ this.permissionsSelected = response.data.permissions
+
+ var blacklistPush = []
+ for (let i = 0; i < response.data.groups.length; i++) {
+ if (response.data.groups[i].role_x_group.blacklist) {
+ blacklistPush.push(response.data.groups[i])
+ } else {
+ this.whitelist.push(response.data.groups[i])
+ }
+ }
+
+ this.loadChilds().then(() => {
+ this.blacklist = this.blacklist.concat(blacklistPush)
})
},
completeStepOne () {
@@ -282,27 +314,26 @@ export default {
completeStepThree () {
this.step = 4
this.stepCompleted = Math.max(3, this.stepCompleted)
+ this.loadChilds()
},
- loadGroups () {
- this.$http('/api/groups').then(response => {
- this.groups = response.data
- })
- },
- loadPermissions () {
- this.$http('/api/permissions').then(response => {
- this.permissions = response.data
- })
+ completeStepFour () {
+ this.step = 5
+ this.stepCompleted = Math.max(4, this.stepCompleted)
},
- loadChilds (group) {
- group.loadingSubgroups = true
- this.groupsSelected.push(group)
- this.$http('/api/groups/' + group.id + '?all').then(response => {
- this.groupsSelected = this.groupsSelected.concat(response.data.subgroups)
- group.loadingSubgroups = false
+ async loadChilds () {
+ this.blacklistGroups = []
+ var promises = []
+ this.whitelist.forEach(group => {
+ promises.push(
+ this.$http('/api/groups/' + group.id + '?all').then(response => {
+ this.blacklistGroups = this.blacklistGroups.concat(response.data.subgroups)
+ }))
})
+ await Promise.all(promises)
}
},
computed: {
+ ...mapState('permissions', ['permissions', 'groups']),
edit: function () {
return this.$store.state.permissions.edit
}
@@ -310,17 +341,15 @@ export default {
watch: {
edit: function (value) {
if (value) {
- this.loadGroups()
- this.loadPermissions()
this.$refs.form.resetValidation()
this.permissionsSelected = []
- this.groupsSelected = []
+ this.whitelist = []
+ this.blacklist = []
this.step = 1
if (this.roleId !== 0) {
this.loadRole(this.roleId)
- this.stepCompleted = 4
+ this.stepCompleted = 5
} else {
- this.recursiveSwitch = true
this.roleName = ''
this.roleDescr = ''
this.stepCompleted = 0
diff --git a/webapp/src/components/PermissionModuleGrantRevoke.vue b/webapp/src/components/PermissionModuleGrantRevoke.vue
index 559fdfc..81afece 100644
--- a/webapp/src/components/PermissionModuleGrantRevoke.vue
+++ b/webapp/src/components/PermissionModuleGrantRevoke.vue
@@ -143,11 +143,15 @@ export default {
methods: {
async submit (event) {
const roleIds = this.selectedRoles.map(x => x.id)
- this.selectedUsers.forEach(user => {
- this.$http.post('/api/users/' + user.id + '/roles' + (this.grant ? '' : '/?delete'), { ids: roleIds })
- })
- this.$store.commit('newSnackbar', this.$t(this.grant ? 'roleGrantedSuccess' : 'roleRevokedSuccess'))
- this.$store.dispatch('permissions/loadData')
+ for (let i = 0; i < this.selectedUsers.length; i++) {
+ await this.$http.post('/api/users/' + this.selectedUsers[i].id + '/roles' + (this.grant ? '' : '/?delete'), { ids: roleIds })
+ }
+ if (this.grant) {
+ this.$snackbar({ color: 'success', text: this.$t('roleGrantedSuccess'), timeout: 15000 })
+ } else {
+ this.$snackbar({ color: 'success', text: this.$t('roleRevokedSuccess'), timeout: 15000 })
+ }
+ this.$store.dispatch('permissions/loadUserData')
this.$store.commit('permissions/setGrantRevoke', false)
this.$store.commit('permissions/setSelectedUsers', [])
},
diff --git a/webapp/src/components/PermissionModuleRoleList.vue b/webapp/src/components/PermissionModuleRoleList.vue
index 5478060..15f0525 100644
--- a/webapp/src/components/PermissionModuleRoleList.vue
+++ b/webapp/src/components/PermissionModuleRoleList.vue
@@ -21,12 +21,12 @@
<div>
<v-card>
<data-table :value="selectedRoles" @input="$store.commit('permissions/setSelectedRoles', $event)" :headers="headers" :items="roles">
- <div slot="action" slot-scope="row">
+ <div slot="action" slot-scope="row" v-if="canEdit">
<v-btn flat icon color="primary" @click.stop="$store.commit('permissions/editRole', row.item.id)"><v-icon>edit</v-icon></v-btn>
</div>
</data-table>
</v-card>
- <div class="text-xs-right">
+ <div class="text-xs-right" v-if="canEdit">
<v-btn color="error" flat @click="$store.commit('permissions/setDialog', true )" :disabled="selectedRoles.length === 0">
<v-icon left>remove_circle_outline</v-icon>{{ $tc('delete-role', selectedRoles.length, [selectedRoles.length]) }}
</v-btn>
@@ -53,7 +53,8 @@ export default {
{ text: this.$t('name'), key: 'name' },
{ text: this.$t('description'), key: 'descr' },
{ sortable: false, key: 'action' }
- ]
+ ],
+ canEdit: false
}
},
computed: {
@@ -62,7 +63,9 @@ export default {
methods: {
},
created () {
- this.$store.dispatch('permissions/loadRoleData')
+ this.$http.get('/api/permissions/permissions.editrole').then(response => {
+ this.canEdit = response.data
+ })
}
}
</script>
diff --git a/webapp/src/components/PermissionModuleUserList.vue b/webapp/src/components/PermissionModuleUserList.vue
index 15f003b..609ab37 100644
--- a/webapp/src/components/PermissionModuleUserList.vue
+++ b/webapp/src/components/PermissionModuleUserList.vue
@@ -31,7 +31,7 @@
</div>
</data-table>
</v-card>
- <div class="text-xs-right">
+ <div class="text-xs-right" v-if="canGrant">
<v-btn color="error" flat @click="$store.commit('permissions/grantRevoke', { show: true, grant: false } )" :disabled="selectedUsers.length === 0">
<v-icon left>remove_circle_outline</v-icon>{{ $t('revoke-role') }}
</v-btn>
@@ -57,7 +57,8 @@ export default {
{ text: this.$t('username'), key: 'username' },
{ text: this.$t('name'), key: 'name' },
{ text: this.$t('roles'), key: 'roles' }
- ]
+ ],
+ canGrant: false
}
},
computed: {
@@ -66,7 +67,9 @@ export default {
methods: {
},
created () {
- this.$store.dispatch('permissions/loadUserData')
+ this.$http.get('/api/permissions/permissions.grantrevoke').then(response => {
+ this.canGrant = response.data
+ })
}
}
</script>
diff --git a/webapp/src/components/RegistrationModuleEdit.vue b/webapp/src/components/RegistrationModuleEdit.vue
index 4822dc9..f90295a 100644
--- a/webapp/src/components/RegistrationModuleEdit.vue
+++ b/webapp/src/components/RegistrationModuleEdit.vue
@@ -35,12 +35,12 @@
</v-flex>
<v-flex xs12 sm2 offset-sm1 style="display: flex; justify-content: center">
<v-tooltip top open-delay="800">
- <v-menu offset-y left :close-on-content-click="false" :max-width="400" lazy slot="activator">
+ <v-menu offset-y left :close-on-content-click="false" lazy slot="activator">
<v-btn slot="activator" class="info-heading-button">
<v-icon :left="groups.length > 0">device_hub</v-icon>{{ groups.length > 0 ? groups.length : '' }}
</v-btn>
<v-card>
- <data-table v-model="groups" :headers="headers" :items="groupList" menu-mode min-width="200px"></data-table>
+ <data-table v-model="groups" :headers="headers" :items="groupList" slim :row-count="6"></data-table>
</v-card>
</v-menu>
<span>{{ $t('groupRestricted') }}</span>
diff --git a/webapp/src/store/permissions.js b/webapp/src/store/permissions.js
index b15b0d1..7ec454c 100644
--- a/webapp/src/store/permissions.js
+++ b/webapp/src/store/permissions.js
@@ -5,6 +5,8 @@ export default {
state: {
roles: [],
users: [],
+ groups: [],
+ permissions: [],
selectedRoles: [],
selectedUsers: [],
roleId: '',
@@ -23,6 +25,12 @@ export default {
setUsers (state, value) {
state.users = value
},
+ setGroups (state, value) {
+ state.groups = value
+ },
+ setPermissions (state, value) {
+ state.permissions = value
+ },
setSelectedRoles (state, value) {
state.selectedRoles = value
},
@@ -48,7 +56,7 @@ export default {
deleteSelectedRoles (context) {
// Filter selected array to get a list of ids.
const filteredArray = context.state.selectedRoles.map(x => x.id)
- axios.post('/api/roles?delete', { id: filteredArray }).then(response => {
+ axios.post('/api/roles?delete', { ids: filteredArray }).then(response => {
context.dispatch('loadData')
context.commit('setSelectedRoles', [])
})
@@ -63,9 +71,21 @@ export default {
context.commit('setUsers', response.data)
})
},
+ loadGroupData (context) {
+ axios.get('/api/groups').then(response => {
+ context.commit('setGroups', response.data)
+ })
+ },
+ loadPermissionData (context) {
+ axios.get('/api/permissions').then(response => {
+ context.commit('setPermissions', response.data)
+ })
+ },
loadData (context) {
context.dispatch('loadRoleData')
context.dispatch('loadUserData')
+ context.dispatch('loadGroupData')
+ context.dispatch('loadPermissionData')
}
}
}