2019-05-21 15:41:19 +00:00
|
|
|
<template>
|
2019-05-22 12:51:57 +00:00
|
|
|
<v-app v-scroll="handleScroll" v-if="$store.state.settingsLoaded">
|
|
|
|
<v-toolbar app :flat="flat" :prominent="big" :dense="!big" :color="bgcolor" clipped-left >
|
|
|
|
<v-toolbar-title class="headline text-uppercase" >
|
|
|
|
<span>{{ nameBig }}</span>
|
|
|
|
<span class="font-weight-light">{{ nameSmall }}</span>
|
|
|
|
</v-toolbar-title>
|
|
|
|
<v-spacer></v-spacer>
|
|
|
|
<v-toolbar-items class="hidden-sm-and-down">
|
|
|
|
<v-btn
|
|
|
|
v-for="item in menu"
|
|
|
|
:key="item.icon"
|
|
|
|
:to="item.link"
|
|
|
|
flat
|
|
|
|
>{{ item.title }}</v-btn>
|
|
|
|
</v-toolbar-items>
|
|
|
|
<v-menu class="hidden-md-and-up">
|
|
|
|
<v-toolbar-side-icon slot="activator"></v-toolbar-side-icon>
|
|
|
|
<v-list>
|
|
|
|
<v-list-tile v-for="item in menu" :key="item.icon">
|
|
|
|
<v-list-tile-content>
|
|
|
|
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
|
|
|
|
</v-list-tile-content>
|
|
|
|
</v-list-tile>
|
|
|
|
</v-list>
|
|
|
|
</v-menu>
|
|
|
|
|
|
|
|
</v-toolbar>
|
|
|
|
|
|
|
|
|
|
|
|
<v-content style="background-color: #fff;">
|
|
|
|
<Startpage/>
|
|
|
|
</v-content>
|
|
|
|
</v-app>
|
2019-05-21 15:41:19 +00:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2019-05-22 12:51:57 +00:00
|
|
|
import HelloWorld from './components/HelloWorld'
|
|
|
|
import Startpage from './components/Startpage'
|
2019-05-21 15:41:19 +00:00
|
|
|
|
|
|
|
export default {
|
2019-05-22 12:51:57 +00:00
|
|
|
name: 'App',
|
2019-05-21 15:41:19 +00:00
|
|
|
components: {
|
2019-05-22 12:51:57 +00:00
|
|
|
HelloWorld,
|
|
|
|
Startpage
|
|
|
|
},
|
|
|
|
data () {
|
|
|
|
return {
|
|
|
|
big: true,
|
|
|
|
bgcolor: "transparent",
|
|
|
|
flat: true,
|
|
|
|
nameBig: '',
|
|
|
|
nameSmall: '',
|
|
|
|
menu: [
|
|
|
|
{ icon: 'home', title: 'Login' },
|
|
|
|
{ icon: 'info', title: 'Invited' },
|
|
|
|
{ icon: 'warning', title: 'Register' }
|
|
|
|
],
|
|
|
|
menu2: [
|
|
|
|
{ icon: 'home', title: 'Apps' },
|
|
|
|
{ icon: 'info', title: 'Admin' },
|
|
|
|
{ icon: 'warning', title: 'Account' }
|
|
|
|
]
|
|
|
|
}
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
setting: (name) => {
|
|
|
|
//this.$store.getters.getSettingValue(this.$store.state, name);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
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.$store.dispatch('getSettings').then(() => {
|
|
|
|
this.nameBig = this.$store.getters.getSettingValue("name_big");
|
|
|
|
this.nameSmall = this.$store.getters.getSettingValue("name_small");
|
|
|
|
});
|
|
|
|
|
2019-05-21 15:41:19 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|