161 lines
5.4 KiB
Vue
161 lines
5.4 KiB
Vue
<template>
|
|
<v-navigation-drawer
|
|
absolute
|
|
temporary
|
|
v-model="$store.state.sideMenu"
|
|
>
|
|
<v-list>
|
|
<v-list-item>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title>Keks Account</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
|
|
<v-divider></v-divider>
|
|
|
|
<v-list-item
|
|
link
|
|
:to="{path: '/dashboard'}"
|
|
>
|
|
<v-list-item-icon>
|
|
<v-icon>mdi-view-dashboard</v-icon>
|
|
</v-list-item-icon>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title>Dashboard</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
|
|
<v-list-item
|
|
link
|
|
:to="{path: '/apps'}"
|
|
>
|
|
<v-list-item-icon>
|
|
<v-icon>mdi-code-tags</v-icon>
|
|
</v-list-item-icon>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title>Developer</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
|
|
<v-list-group
|
|
no-action
|
|
>
|
|
<template v-slot:activator>
|
|
<v-list-item-icon>
|
|
<v-icon>mdi-account</v-icon>
|
|
</v-list-item-icon>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title>Kekskurse</v-list-item-title>
|
|
</v-list-item-content>
|
|
</template>
|
|
|
|
<v-list-item
|
|
link
|
|
:to="{path: '/profile'}"
|
|
>
|
|
<v-list-item-content>
|
|
<v-list-item-title>Profile</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
<v-list-item
|
|
link
|
|
:to="{path: '/access'}"
|
|
>
|
|
<v-list-item-content>
|
|
<v-list-item-title>App Access</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
<v-list-item
|
|
link
|
|
:to="{path: '/logout'}"
|
|
>
|
|
<v-list-item-content>
|
|
<v-list-item-title>Logout</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
</v-list-group>
|
|
|
|
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
name: 'MenuMobile',
|
|
components: {
|
|
},
|
|
data () {
|
|
return {
|
|
big: true,
|
|
bgcolor: "transparent",
|
|
flat: true,
|
|
nameBig: '',
|
|
nameSmall: '',
|
|
sideMenu: this.$store.state.sideMenu,
|
|
menu: [
|
|
{ icon: 'home', title: 'Login' , link: "Login" },
|
|
{ icon: 'info', title: 'Invited' },
|
|
{ icon: 'warning', title: 'Register' }
|
|
],
|
|
menu2: [
|
|
{ icon: 'home', title: 'Apps' },
|
|
{ icon: 'info', title: 'Admin' },
|
|
{ icon: 'warning', title: 'Account' }
|
|
],
|
|
menu3: []
|
|
}
|
|
},
|
|
computed: {
|
|
setting: (name) => {
|
|
//this.$store.getters.getSettingValue(this.$store.state, name);
|
|
}
|
|
},
|
|
methods: {
|
|
generateMenu: function () {
|
|
this.menu = [];
|
|
if(!this.$store.state.loggedIn) {
|
|
this.menu.push({ icon: 'home', title: 'Login' , link: "Login" });
|
|
if(this.$store.getters.getSettingValue("invites")) {
|
|
this.menu.push({ icon: 'home', title: 'Invited' , link: "Invited" });
|
|
}
|
|
if(this.$store.getters.getSettingValue("registration_possible")) {
|
|
this.menu.push({ icon: 'home', title: 'Register' , link: "Register" });
|
|
}
|
|
} else {
|
|
if(this.$store.getters.getMe.developer) {
|
|
this.menu.push({ icon: 'home', title: 'Apps' , link: "Apps" });
|
|
}
|
|
if(this.$store.getters.getMe.admin) {
|
|
this.menu.push({ icon: 'home', title: 'Admin' , link: "Admin" });
|
|
}
|
|
this.menu.push({ icon: 'home', title: 'Profile' , link: "profile", submenu: true, menu: [
|
|
{ icon: 'home', title: 'Logout' , link: "Logout" }
|
|
] });
|
|
}
|
|
},
|
|
handleScroll: function (evt, el) {
|
|
if(evt.pageY > 100) {
|
|
this.big = false;
|
|
this.bgcolor = "#fff";
|
|
this.flat = false;
|
|
} else {
|
|
this.big = true;
|
|
this.bgcolor = "transparent";
|
|
this.flat = true;
|
|
}
|
|
}
|
|
},
|
|
mounted: function () {
|
|
this.nameBig = this.$store.getters.getSettingValue("name_big");
|
|
this.nameSmall = this.$store.getters.getSettingValue("name_small");
|
|
this.generateMenu();
|
|
}
|
|
}
|
|
</script>
|