52 lines
1.1 KiB
Vue
52 lines
1.1 KiB
Vue
|
<template>
|
||
|
<div id="app">
|
||
|
<link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
|
||
|
<div>
|
||
|
<router-link class="ui button" to="/">Home</router-link>
|
||
|
|
||
|
<router-link v-if="loggedIn" class="ui button" to="/notes">Notes</router-link>
|
||
|
<router-link v-if="!loggedIn" class="ui button" to="/login">Login</router-link>
|
||
|
<div v-if="loggedIn" v-on:click="destroyLoginToken" class="ui button">Logout</div>
|
||
|
</div>
|
||
|
<router-view/>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
|
||
|
//Attach event bus to main vue object, all components will inherit event bus
|
||
|
import EventBus from './EventBus'
|
||
|
|
||
|
import { mapGetters } from 'vuex'
|
||
|
|
||
|
export default {
|
||
|
|
||
|
data: function(){
|
||
|
return {
|
||
|
// loggedIn:
|
||
|
}
|
||
|
},
|
||
|
beforeCreate: function(){
|
||
|
|
||
|
//Puts token into state on page load
|
||
|
let token = localStorage.getItem('loginToken')
|
||
|
if(token){
|
||
|
this.$store.commit('setLoginToken', token)
|
||
|
}
|
||
|
},
|
||
|
mounted: function(){
|
||
|
// console.log(this.$bus)
|
||
|
},
|
||
|
computed: {
|
||
|
loggedIn () {
|
||
|
//Map logged in from state
|
||
|
return this.$store.getters.getLoggedIn
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
destroyLoginToken() {
|
||
|
this.$store.commit('destroyLoginToken')
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|