summaryrefslogtreecommitdiffstats
path: root/webapp
diff options
context:
space:
mode:
authorChristian Hofmaier2019-02-15 16:14:30 +0100
committerChristian Hofmaier2019-02-15 16:14:30 +0100
commit3b245c0998714c5f79defd0f756ae83002273c17 (patch)
tree31cfdfde706b62880a93812d1348a0513713c734 /webapp
parentImplement Middlware for Permission Manager (diff)
downloadbas-3b245c0998714c5f79defd0f756ae83002273c17.tar.gz
bas-3b245c0998714c5f79defd0f756ae83002273c17.tar.xz
bas-3b245c0998714c5f79defd0f756ae83002273c17.zip
[permissionmanager]Integrate new data-table + api format
Diffstat (limited to 'webapp')
-rw-r--r--webapp/src/components/PermissionModuleEdit.vue64
-rw-r--r--webapp/src/components/PermissionModuleGrantRevoke.vue27
-rw-r--r--webapp/src/components/PermissionModuleRoleList.vue40
-rw-r--r--webapp/src/components/PermissionModuleUserList.vue43
-rw-r--r--webapp/src/store/permissions.js4
5 files changed, 51 insertions, 127 deletions
diff --git a/webapp/src/components/PermissionModuleEdit.vue b/webapp/src/components/PermissionModuleEdit.vue
index 13a4b17..dd1e3e9 100644
--- a/webapp/src/components/PermissionModuleEdit.vue
+++ b/webapp/src/components/PermissionModuleEdit.vue
@@ -37,7 +37,7 @@
<v-dialog
:value="$store.state.permissions.edit"
@input="$store.commit('permissions/setEdit', $event)"
- max-width="800px"
+ max-width="1000px"
scrollable
persistent
>
@@ -111,22 +111,7 @@
</v-stepper-content>
<v-stepper-content step="2" class="stepper-padding-0">
- <component-search-table v-model="permissionsSelected" :headers="permissionHeaders" :items="permissions" select-all>
- <template slot="items" slot-scope="props">
- <tr :style="props.color" @click="props.data.selected = !props.data.selected">
- <td>
- <v-checkbox
- color="primary"
- v-model="props.data.selected"
- hide-details
- ></v-checkbox>
- </td>
- <td>{{ props.data.item.name }}</td>
- <td>{{ props.data.item.descr }}</td>
- <td>{{ props.data.item.groupdependent }}</td>
- </tr>
- </template>
- </component-search-table>
+ <data-table v-model="permissionsSelected" :headers="permissionHeaders" :items="permissions"/>
</v-stepper-content>
<v-stepper-content step="3" class="stepper-padding-0">
@@ -138,22 +123,7 @@
color="primary"
></v-switch>
</v-flex>
- <component-search-table v-model="groupsSelected" :headers="groupHeaders" :items="groups" select-all>
- <template slot="items" slot-scope="props">
- <tr :style="props.color" @click="props.data.selected = !props.data.selected">
- <td>
- <v-checkbox
- color="primary"
- v-model="props.data.selected"
- hide-details
- ></v-checkbox>
- </td>
- <td>{{ props.data.item.id }}</td>
- <td>{{ props.data.item.name }}</td>
- <td>{{ props.data.item.description }}</td>
- </tr>
- </template>
- </component-search-table>
+ <data-table v-model="groupsSelected" :headers="groupHeaders" :items="groups"/>
</v-stepper-content>
<v-stepper-content step="4">
@@ -233,13 +203,13 @@
<script>
import _arrayIncludes from 'lodash/_arrayIncludes'
-import ComponentSearchTable from '@/components/ComponentSearchTable'
+import DataTable from '@/components/DataTable'
export default {
name: 'PermissionModuleEdit',
props: ['roleId'],
components: {
- ComponentSearchTable
+ DataTable
},
data () {
return {
@@ -253,14 +223,14 @@ export default {
groupsSummary: [],
recursiveSwitch: false,
permissionHeaders: [
- { text: this.$t('name'), value: 'name' },
- { text: this.$t('description'), value: 'descr' },
- { text: this.$t('groupdependent'), value: 'groupdependent' }
+ { text: this.$t('name'), key: 'name' },
+ { text: this.$t('description'), key: 'descr' },
+ { text: this.$t('groupdependent'), key: 'groupdependent' }
],
groupHeaders: [
- { text: this.$t('id'), value: 'id' },
- { text: this.$t('name'), value: 'name' },
- { text: this.$t('description'), value: 'description' }
+ { text: this.$t('id'), key: 'id' },
+ { text: this.$t('name'), key: 'name' },
+ { text: this.$t('description'), key: 'description' }
],
roleName: '',
roleDescr: ''
@@ -271,7 +241,7 @@ export default {
if (this.$refs.form.validate()) {
const filteredPermissions = this.permissionsSelected.map(x => x.id)
const filteredGroups = this.groupsSelected.map(x => x.id)
- this.$http.post('/api/permissions/saveRole', {
+ this.$http.post('/api/roles' + (this.roleId === 0 ? '' : '/' + this.roleId), {
id: this.roleId,
name: this.roleName,
descr: this.roleDescr,
@@ -288,7 +258,7 @@ export default {
}
},
loadRole (roleId) {
- this.$http('/api/permissions/getRoleById/' + this.roleId).then(response => {
+ this.$http('/api/roles/' + this.roleId).then(response => {
this.roleName = response.data.name
this.roleDescr = response.data.descr
this.permissionsSelected = response.data.permissions
@@ -315,7 +285,7 @@ export default {
var self = this
// _arrayIncludes.js
this.groupsSelected.forEach(function (group) {
- promises.push(self.$http('/api/groups/getGroup?all=true&id=' + group.id).then(response => {
+ promises.push(self.$http('/api/groups/' + group.id + '&all').then(response => {
response.data.subgroups.forEach(function (subgroup) {
if (!(_arrayIncludes(self.groupsSelected, subgroup) || _arrayIncludes(childGroups, subgroup))) {
childGroups.push(subgroup)
@@ -336,12 +306,12 @@ export default {
this.stepCompleted = Math.max(3, this.stepCompleted)
},
loadGroups () {
- this.$http('/api/groups/getList').then(response => {
+ this.$http('/api/groups').then(response => {
this.groups = response.data
})
},
loadPermissions () {
- this.$http('/api/permissions/getPermissionList').then(response => {
+ this.$http('/api/permissions').then(response => {
this.permissions = response.data
})
}
@@ -381,7 +351,7 @@ export default {
<style scoped>
.table-container {
padding: 0;
- height: 700px;
+ max-height: 700px;
}
.stepper-padding-0 {
padding: 0;
diff --git a/webapp/src/components/PermissionModuleGrantRevoke.vue b/webapp/src/components/PermissionModuleGrantRevoke.vue
index f146a58..c885367 100644
--- a/webapp/src/components/PermissionModuleGrantRevoke.vue
+++ b/webapp/src/components/PermissionModuleGrantRevoke.vue
@@ -65,22 +65,7 @@
<v-stepper v-model="step" horizontal style="width: 100%; background: transparent" class="elevation-0">
<v-stepper-items>
<v-stepper-content step="1" class="stepper-padding-0">
- <component-search-table v-model="rolesSelected" :headers="roleHeaders" :items="roles" select-all>
- <template slot="items" slot-scope="props">
- <tr :style="props.color" @click="props.data.selected = !props.data.selected">
- <td>
- <v-checkbox
- color="primary"
- v-model="props.data.selected"
- hide-details
- ></v-checkbox>
- </td>
- <td>{{ props.data.item.id }}</td>
- <td>{{ props.data.item.name }}</td>
- <td>{{ props.data.item.descr }}</td>
- </tr>
- </template>
- </component-search-table>
+ <data-table v-model="rolesSelected" :headers="roleHeaders" :items="roles"/>
</v-stepper-content>
<v-stepper-content step="2">
<v-layout row wrap>
@@ -135,13 +120,13 @@
<script>
import { mapState } from 'vuex'
-import ComponentSearchTable from '@/components/ComponentSearchTable'
+import DataTable from '@/components/DataTable'
export default {
name: 'PermissionModuleGrantRevoke',
props: ['grant'],
components: {
- ComponentSearchTable
+ DataTable
},
data () {
return {
@@ -150,9 +135,9 @@ export default {
stepCompleted: 0,
rolesSelected: [],
roleHeaders: [
- { text: this.$t('id'), value: 'id' },
- { text: this.$t('name'), value: 'name' },
- { text: this.$t('description'), value: 'descr' }
+ { text: this.$t('id'), key: 'id' },
+ { text: this.$t('name'), key: 'name' },
+ { text: this.$t('description'), key: 'descr' }
]
}
},
diff --git a/webapp/src/components/PermissionModuleRoleList.vue b/webapp/src/components/PermissionModuleRoleList.vue
index 3eade73..5478060 100644
--- a/webapp/src/components/PermissionModuleRoleList.vue
+++ b/webapp/src/components/PermissionModuleRoleList.vue
@@ -20,29 +20,11 @@
<template>
<div>
<v-card>
- <component-search-table :value="selectedRoles" @input="$store.commit('permissions/setSelectedRoles', $event)" :headers="headers" :items="roles" select-all>
- <template slot="items" slot-scope="props">
- <tr :style="props.color" @click="props.data.selected = !props.data.selected">
- <td>
- <v-checkbox
- color="primary"
- v-model="props.data.selected"
- hide-details
- ></v-checkbox>
- </td>
- <td>{{ props.data.item.id }}</td>
- <td>{{ props.data.item.name }}</td>
- <td>{{ props.data.item.descr }}</td>
- <td>
- <v-layout>
- <v-btn flat icon color="primary" @click.stop="$store.commit('permissions/editRole', props.data.item.id)">
- <v-icon>edit</v-icon>
- </v-btn>
- </v-layout>
- </td>
- </tr>
- </template>
- </component-search-table>
+ <data-table :value="selectedRoles" @input="$store.commit('permissions/setSelectedRoles', $event)" :headers="headers" :items="roles">
+ <div slot="action" slot-scope="row">
+ <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">
<v-btn color="error" flat @click="$store.commit('permissions/setDialog', true )" :disabled="selectedRoles.length === 0">
@@ -57,20 +39,20 @@
<script>
import { mapState } from 'vuex'
-import ComponentSearchTable from '@/components/ComponentSearchTable'
+import DataTable from '@/components/DataTable'
export default {
name: 'PermissionModuleRoleList',
components: {
- ComponentSearchTable
+ DataTable
},
data () {
return {
headers: [
- { text: this.$t('id'), value: 'id' },
- { text: this.$t('name'), value: 'name' },
- { text: this.$t('description'), value: 'descr' },
- { sortable: false }
+ { text: this.$t('id'), key: 'id' },
+ { text: this.$t('name'), key: 'name' },
+ { text: this.$t('description'), key: 'descr' },
+ { sortable: false, key: 'action' }
]
}
},
diff --git a/webapp/src/components/PermissionModuleUserList.vue b/webapp/src/components/PermissionModuleUserList.vue
index 4222ba1..276b4af 100644
--- a/webapp/src/components/PermissionModuleUserList.vue
+++ b/webapp/src/components/PermissionModuleUserList.vue
@@ -20,29 +20,16 @@
<template>
<div>
<v-card>
- <component-search-table :value="selectedUsers" @input="$store.commit('permissions/setSelectedUsers', $event)" :headers="headers" :items="users" select-all>
- <template slot="items" slot-scope="props">
- <tr :style="props.color" @click="props.data.selected = !props.data.selected">
- <td>
- <v-checkbox
- color="primary"
- v-model="props.data.selected"
- hide-details
- ></v-checkbox>
- </td>
- <td>{{ props.data.item.username }}</td>
- <td>{{ props.data.item.name }}</td>
- <td>
- <template v-for="role in props.data.item.roles">
- <v-tooltip bottom :key="role.id">
- <v-chip small slot="activator">{{ role.name }}</v-chip>
- <span>{{ role.descr }}</span>
- </v-tooltip>
- </template>
- </td>
- </tr>
- </template>
- </component-search-table>
+ <data-table :value="selectedUsers" @input="$store.commit('permissions/setSelectedUsers', $event)" :headers="headers" :items="users">
+ <div slot="roles" slot-scope="row">
+ <template v-for="role in row.item.roles">
+ <v-tooltip bottom :key="role.id">
+ <v-chip small slot="activator">{{ role.name }}</v-chip>
+ <span>{{ role.descr }}</span>
+ </v-tooltip>
+ </template>
+ </div>
+ </data-table>
</v-card>
<div class="text-xs-right">
<v-btn color="error" flat @click="$store.commit('permissions/grantRevoke', { show: true, grant: false } )" :disabled="selectedUsers.length === 0">
@@ -57,19 +44,19 @@
<script>
import { mapState } from 'vuex'
-import ComponentSearchTable from '@/components/ComponentSearchTable'
+import DataTable from '@/components/DataTable'
export default {
name: 'PermissionModuleUserList',
components: {
- ComponentSearchTable
+ DataTable
},
data () {
return {
headers: [
- { text: this.$t('username'), value: 'username' },
- { text: this.$t('name'), value: 'name' },
- { text: this.$t('roles'), value: 'id' }
+ { text: this.$t('username'), key: 'username' },
+ { text: this.$t('name'), key: 'name' },
+ { text: this.$t('roles'), key: 'roles' }
]
}
},
diff --git a/webapp/src/store/permissions.js b/webapp/src/store/permissions.js
index 1366d6a..10b90b6 100644
--- a/webapp/src/store/permissions.js
+++ b/webapp/src/store/permissions.js
@@ -48,13 +48,13 @@ 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/permissions/deleteRoles', { id: filteredArray }).then(response => {
+ axios.post('/api/roles?delete', { id: filteredArray }).then(response => {
context.dispatch('loadData')
context.commit('setSelectedRoles', [])
})
},
loadRoleData (context) {
- axios.get('/api/permissions/getRoleList').then(response => {
+ axios.get('/api/roles').then(response => {
context.commit('setRoles', response.data)
})
},