42 lines
984 B
Vue
42 lines
984 B
Vue
<template>
|
|
<div>
|
|
<ion-header>
|
|
<ion-toolbar color="primary">
|
|
<div class="d-flex">
|
|
<div class="header-item text-left">
|
|
<v-btn @click="openLeftMenu" class="ma-2" icon color="white">
|
|
<v-icon>mdi-menu</v-icon>
|
|
</v-btn>
|
|
</div>
|
|
<div class="header-item d-flex align-center justify-center">{{ headerTitle }}</div>
|
|
<div class="header-item"></div>
|
|
</div>
|
|
</ion-toolbar>
|
|
</ion-header>
|
|
<router-view />
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { Component, Vue } from 'vue-property-decorator';
|
|
import { namespace } from 'vuex-class';
|
|
|
|
const GlobalStore = namespace('global');
|
|
|
|
@Component
|
|
export default class HomeView extends Vue {
|
|
@GlobalStore.Getter('headerTitle')
|
|
public headerTitle!: string;
|
|
|
|
public openLeftMenu() {
|
|
document.querySelector('ion-menu-controller')!.open('start');
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.header-item {
|
|
flex-basis: 100%;
|
|
}
|
|
</style>
|