This commit is contained in:
@@ -1,180 +1,36 @@
|
||||
<template>
|
||||
<v-app>
|
||||
<v-navigation-drawer v-if="isAuthenticated" v-model="drawer" app>
|
||||
<v-list dense>
|
||||
<v-list-item
|
||||
v-for="item in navItems"
|
||||
:key="item.route"
|
||||
:to="item.route"
|
||||
>
|
||||
<v-list-item-action>
|
||||
<v-icon>{{ "fa-" + item.icon }}</v-icon>
|
||||
</v-list-item-action>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title>{{ item.title }}</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-navigation-drawer>
|
||||
<v-app-bar
|
||||
v-if="isAuthenticated"
|
||||
:color="appBar.isMain ? 'primary' : 'secondary'"
|
||||
dark
|
||||
fixed
|
||||
app
|
||||
>
|
||||
<v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
|
||||
<v-toolbar-title style="width: 300px" class="ml-0 pl-4">
|
||||
<v-icon>{{ appBar.icon }}</v-icon
|
||||
>
|
||||
<span>{{ appBar.title }}</span>
|
||||
<v-app-bar app>
|
||||
<v-toolbar-title class="headline text-uppercase">
|
||||
<span>Vuetify</span>
|
||||
<span class="font-weight-light">MATERIAL DESIGN</span>
|
||||
</v-toolbar-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-toolbar-items>
|
||||
<template v-for="item in appBar.menuItems">
|
||||
<v-btn
|
||||
class="hidden-xs-only"
|
||||
icon
|
||||
v-if="item.surface"
|
||||
:key="item.key"
|
||||
:disabled="item.disabled"
|
||||
@click="clickMenuItem(item)"
|
||||
>
|
||||
<v-icon :color="item.color ? item.color : ''">
|
||||
{{ "fa-" + item.icon }}
|
||||
</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-spacer></v-spacer>
|
||||
<v-menu bottom float-left>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn text icon v-on="on">
|
||||
<v-icon>fa-ellipsis-v</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-list>
|
||||
<template v-for="(item, index) in appBar.menuItems">
|
||||
<v-subheader v-if="item.header" :key="index">
|
||||
{{ item.header }}
|
||||
</v-subheader>
|
||||
<v-divider
|
||||
v-else-if="item.divider"
|
||||
:key="index"
|
||||
:inset="item.inset"
|
||||
></v-divider>
|
||||
<v-list-item
|
||||
v-else
|
||||
:key="item.key"
|
||||
:disabled="item.disabled"
|
||||
@click="clickMenuItem(item)"
|
||||
v-bind:class="{ 'hidden-sm-and-up': item.surface }"
|
||||
>
|
||||
<v-list-item-action>
|
||||
<v-icon
|
||||
v-if="item.icon"
|
||||
:color="item.color ? item.color : ''"
|
||||
>{{ "fa-" + item.icon }}</v-icon
|
||||
>
|
||||
</v-list-item-action>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title>
|
||||
<span>{{ item.title }}</span>
|
||||
</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
</template>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
</v-toolbar-items>
|
||||
<v-btn
|
||||
text
|
||||
href="https://github.com/vuetifyjs/vuetify/releases/latest"
|
||||
target="_blank"
|
||||
>
|
||||
<span class="mr-2">Latest Release</span>
|
||||
</v-btn>
|
||||
</v-app-bar>
|
||||
|
||||
<v-content>
|
||||
<v-container fluid fill-height>
|
||||
<v-row justify-center>
|
||||
<transition name="fade" mode="out-in" @after-leave="afterLeave">
|
||||
<router-view class="view"></router-view>
|
||||
</transition>
|
||||
</v-row>
|
||||
</v-container>
|
||||
<HelloWorld />
|
||||
</v-content>
|
||||
<v-footer color="primary" padless v-if="!isAuthenticated">
|
||||
<div>
|
||||
<a
|
||||
href="https://ayanova.com"
|
||||
target="_blank"
|
||||
style="text-decoration:none"
|
||||
class="white--text caption"
|
||||
>
|
||||
<span>AyaNova ({{ version }}) {{ copyright }}</span>
|
||||
</a>
|
||||
</div>
|
||||
</v-footer>
|
||||
</v-app>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* xeslint-disable */
|
||||
import aboutInfo from "./api/aboutinfo";
|
||||
import HelloWorld from "./components/HelloWorld";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
drawer: null,
|
||||
appBar: {
|
||||
isMain: true,
|
||||
icon: "",
|
||||
title: "",
|
||||
helpUrl: "index.html",
|
||||
menuItems: []
|
||||
}
|
||||
};
|
||||
name: "App",
|
||||
components: {
|
||||
HelloWorld
|
||||
},
|
||||
created() {
|
||||
//////////////////////////////////
|
||||
// WIRE UP
|
||||
// MENU and DIALOG EVENT HANDLERS
|
||||
// ON GZEVENTBUS
|
||||
data: () => ({
|
||||
//
|
||||
//
|
||||
window.$gz.menu.wireUpEventHandlers(this);
|
||||
window.$gz.dialog.wireUpEventHandlers(this);
|
||||
},
|
||||
beforeDestroy() {
|
||||
//UNWIRE ALL EVENT HANDLERS FROM GZEVENTBUS
|
||||
window.$gz.eventBus.$off();
|
||||
},
|
||||
mounted() {
|
||||
//redirect to login if not authenticated
|
||||
if (!this.$store.state.authenticated) {
|
||||
this.$router.push({ name: "login" });
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isAuthenticated() {
|
||||
return this.$store.state.authenticated === true;
|
||||
},
|
||||
navItems() {
|
||||
return this.$store.state.navItems;
|
||||
},
|
||||
copyright() {
|
||||
return aboutInfo.copyright;
|
||||
},
|
||||
version() {
|
||||
return aboutInfo.version;
|
||||
},
|
||||
helpUrl() {
|
||||
return this.$store.state.helpUrl;
|
||||
}
|
||||
},
|
||||
props: {
|
||||
source: String
|
||||
},
|
||||
methods: {
|
||||
afterLeave() {
|
||||
this.$root.$emit("triggerScroll");
|
||||
},
|
||||
clickMenuItem(item) {
|
||||
window.$gz.eventBus.$emit("menu-click", item);
|
||||
}
|
||||
}
|
||||
})
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user