Fixed Permissions

Man kann nun pro Route mehrere permissions setzen.
This commit is contained in:
Tim Gröger 2020-10-31 17:33:09 +01:00
parent 555d2a871b
commit 09c6a806c9
7 changed files with 56 additions and 15 deletions

View File

@ -1,7 +1,7 @@
import { boot } from 'quasar/wrappers'; import { boot } from 'quasar/wrappers';
import { StateInterface } from 'src/store'; import { StateInterface } from 'src/store';
import { RouteRecord } from 'vue-router'; import { RouteRecord } from 'vue-router';
import { Store } from 'vuex'; import { Store } from 'vuex'
export default boot<Store<StateInterface>>(({ router, store }) => { export default boot<Store<StateInterface>>(({ router, store }) => {
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
@ -25,12 +25,16 @@ export default boot<Store<StateInterface>>(({ router, store }) => {
} }
if ( if (
to.matched.every((record: RouteRecord) => { to.matched.every((record: RouteRecord) => {
if (!('meta' in record) || !('permission' in record.meta)) if (!('meta' in record) || !('permissions' in record.meta))
return true; return true;
const test = record.meta.permissions.every((permission: string) => {
return permissions.includes( return permissions.includes(
(<{ permission: string }>record.meta).permission permission
); );
}) })
console.log('permissions', test)
return test
})
) { ) {
next(); next();
} else { } else {

View File

@ -76,7 +76,8 @@ function combineMainLinks(
title: sourcePluginChildLink.title, title: sourcePluginChildLink.title,
icon: sourcePluginChildLink.icon, icon: sourcePluginChildLink.icon,
link: sourcePluginChildLink.name, link: sourcePluginChildLink.name,
name: sourcePluginChildLink.name name: sourcePluginChildLink.name,
permissions: sourcePluginChildLink.meta?.permissions
}); });
} }
); );
@ -85,7 +86,8 @@ function combineMainLinks(
title: source.title, title: source.title,
icon: source.icon, icon: source.icon,
link: source.name, link: source.name,
name: source.name name: source.name,
permissions: source.meta?.permissions
}; };
source.children?.forEach(child => { source.children?.forEach(child => {
if (mainLink.children === undefined) { if (mainLink.children === undefined) {
@ -95,7 +97,8 @@ function combineMainLinks(
title: child.title, title: child.title,
icon: child.icon, icon: child.icon,
link: child.name, link: child.name,
name: child.name name: child.name,
permissions: child.meta?.permissions
}); });
}); });
target.push(mainLink); target.push(mainLink);
@ -111,7 +114,8 @@ function loadShortCuts(
if (route.shortcut) { if (route.shortcut) {
target.push(<FG_Plugin.ShortCutLink>{ target.push(<FG_Plugin.ShortCutLink>{
link: route.name, link: route.name,
icon: route.icon icon: route.icon,
permissions: route.meta?.permissions
}); });
} }
if (route.children) { if (route.children) {

View File

@ -28,6 +28,7 @@
:key="'shortcut' + index" :key="'shortcut' + index"
:link="shortcut.link" :link="shortcut.link"
:icon="shortcut.icon" :icon="shortcut.icon"
v-if="hasPermissions(shortcut.permissions)"
/> />
</div> </div>
<q-btn flat round dense icon="mdi-exit-to-app" @click="logout()" /> <q-btn flat round dense icon="mdi-exit-to-app" @click="logout()" />
@ -50,6 +51,7 @@
:title="link.title" :title="link.title"
:link="link.link" :link="link.link"
:icon="link.icon" :icon="link.icon"
v-if="hasPermissions(link.permissions)"
/> />
</q-list> </q-list>
<q-separator /> <q-separator />
@ -63,6 +65,7 @@
:title="link.title" :title="link.title"
:link="link.link" :link="link.link"
:icon="link.icon" :icon="link.icon"
v-if="hasPermissions(link.permissions)"
/> />
</q-list> </q-list>
@ -86,6 +89,7 @@
:title="link.title" :title="link.title"
:link="link.link" :link="link.link"
:icon="link.icon" :icon="link.icon"
v-if="hasPermissions(link.permissions)"
/> />
</q-drawer> </q-drawer>
@ -180,6 +184,15 @@ export default defineComponent({
}); });
} }
function hasPermissions(permissions: FG.Permission[] | undefined) {
if (permissions) {
return permissions.every(permission => {
return ctx.root.$store.getters['user/permissions'].includes(permission)
})
}
return true
}
return { return {
leftDrawerOpen, leftDrawerOpen,
leftDrawerMini, leftDrawerMini,
@ -187,7 +200,8 @@ export default defineComponent({
links, links,
pluginChildLinks, pluginChildLinks,
shortcuts, shortcuts,
logout logout,
hasPermissions
}; };
} }
}); });

3
src/plugins.d.ts vendored
View File

@ -5,6 +5,7 @@ declare namespace FG_Plugin {
interface ShortCutLink { interface ShortCutLink {
link: string; link: string;
icon: string; icon: string;
permissions?: string[];
} }
interface PluginRouteConfig extends RouteConfig { interface PluginRouteConfig extends RouteConfig {
@ -12,6 +13,7 @@ declare namespace FG_Plugin {
title: string; title: string;
icon: string; icon: string;
children?: PluginRouteConfig[]; children?: PluginRouteConfig[];
meta?: {permissions?: string[]}
} }
interface Plugin { interface Plugin {
@ -32,6 +34,7 @@ declare namespace FG_Plugin {
title: string; title: string;
link: string; link: string;
icon: string; icon: string;
permissions?: string[]
} }
interface LoadedPlugin { interface LoadedPlugin {

View File

@ -13,6 +13,7 @@
:title="route.title" :title="route.title"
:icon="route.icon" :icon="route.icon"
:link="route.name" :link="route.name"
v-if="hasPermissions(route.permissions)"
/> />
</q-list> </q-list>
</q-card-section> </q-card-section>
@ -33,7 +34,15 @@ export default defineComponent({
const checkMain = computed(() => { const checkMain = computed(() => {
return root.$route.matched.length == 2; return root.$route.matched.length == 2;
}); });
return { checkMain, mainRoutes }; function hasPermissions(permissions: FG.Permission[] | undefined) {
if (permissions) {
return permissions.every(permission => {
return root.$store.getters['user/permissions'].includes(permission)
})
}
return true
}
return { checkMain, mainRoutes, hasPermissions};
} }
}); });
</script> </script>

View File

@ -6,7 +6,7 @@ const mainRoutes: FG_Plugin.PluginRouteConfig[] = [
path: 'user', path: 'user',
name: 'user', name: 'user',
component: () => import('../pages/MainPage.vue'), component: () => import('../pages/MainPage.vue'),
meta: { permission: 'user' }, meta: { permissions: ['user'] },
children: [ children: [
{ {
title: 'Hauptkanal', title: 'Hauptkanal',
@ -14,7 +14,7 @@ const mainRoutes: FG_Plugin.PluginRouteConfig[] = [
path: 'user-main', path: 'user-main',
name: 'user-main', name: 'user-main',
shortcut: false, shortcut: false,
meta: { permission: 'user' }, meta: { permissions: ['user'] },
component: () => import('../pages/User.vue') component: () => import('../pages/User.vue')
}, },
{ {
@ -23,7 +23,7 @@ const mainRoutes: FG_Plugin.PluginRouteConfig[] = [
path: 'settings', path: 'settings',
name: 'user-settings', name: 'user-settings',
shortcut: true, shortcut: true,
meta: { permission: 'user' }, meta: { permissions: ['user'] },
component: () => import('../pages/Settings.vue') component: () => import('../pages/Settings.vue')
} }
] ]

View File

@ -166,6 +166,13 @@ const getters: GetterTree<UserStateInterface, StateInterface> = {
}, },
loading({ updateUserLoading, getUserLoading }) { loading({ updateUserLoading, getUserLoading }) {
return updateUserLoading || getUserLoading; return updateUserLoading || getUserLoading;
},
permissions({user}) {
let permissions: string[] = []
user.roles.forEach(role => {
permissions = permissions.concat(role.permissions);
});
return permissions
} }
}; };