146 lines
5.3 KiB
Vue
146 lines
5.3 KiB
Vue
<template>
|
|
<v-navigation-drawer
|
|
stateless
|
|
absolute
|
|
value="true"
|
|
v-model="$store.state.sideMenu"
|
|
>
|
|
<v-list>
|
|
<v-list-tile>
|
|
<v-list-tile-action>
|
|
<v-icon>home</v-icon>
|
|
</v-list-tile-action>
|
|
<v-list-tile-title>Home</v-list-tile-title>
|
|
</v-list-tile>
|
|
|
|
<v-list-group
|
|
prepend-icon="account_circle"
|
|
value="true"
|
|
>
|
|
<template v-slot:activator>
|
|
<v-list-tile>
|
|
<v-list-tile-title>Users</v-list-tile-title>
|
|
</v-list-tile>
|
|
</template>
|
|
<v-list-group
|
|
no-action
|
|
sub-group
|
|
value="true"
|
|
>
|
|
<template v-slot:activator>
|
|
<v-list-tile>
|
|
<v-list-tile-title>Admin</v-list-tile-title>
|
|
</v-list-tile>
|
|
</template>
|
|
|
|
<v-list-tile
|
|
v-for="(admin, i) in admins"
|
|
:key="i"
|
|
@click=""
|
|
>
|
|
<v-list-tile-title v-text="admin[0]"></v-list-tile-title>
|
|
<v-list-tile-action>
|
|
<v-icon v-text="admin[1]"></v-icon>
|
|
</v-list-tile-action>
|
|
</v-list-tile>
|
|
</v-list-group>
|
|
|
|
<v-list-group
|
|
sub-group
|
|
no-action
|
|
>
|
|
<template v-slot:activator>
|
|
<v-list-tile>
|
|
<v-list-tile-title>Actions</v-list-tile-title>
|
|
</v-list-tile>
|
|
</template>
|
|
<v-list-tile
|
|
v-for="(crud, i) in cruds"
|
|
:key="i"
|
|
@click=""
|
|
>
|
|
<v-list-tile-title v-text="crud[0]"></v-list-tile-title>
|
|
<v-list-tile-action>
|
|
<v-icon v-text="crud[1]"></v-icon>
|
|
</v-list-tile-action>
|
|
</v-list-tile>
|
|
</v-list-group>
|
|
</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> |