Added home and login components

This commit is contained in:
kolaente 2018-09-06 19:46:38 +02:00
parent 6a15c61677
commit bb3991a3f5
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B
2 changed files with 89 additions and 0 deletions

30
src/components/Home.vue Normal file
View file

@ -0,0 +1,30 @@
<template>
<div>
<h3>Hiiiii</h3>
<span v-if="authenticated">Logged in</span>
</div>
</template>
<script>
import auth from '../auth'
import router from '../router'
export default {
name: "Home",
data() {
return {
authenticated: auth.user.authenticated
}
},
beforeMount() {
// Check if the user is already logged in, if so, redirect him to the homepage
if (!auth.user.authenticated) {
router.push({name: 'login'})
}
},
}
</script>
<style scoped>
</style>

59
src/components/Login.vue Normal file
View file

@ -0,0 +1,59 @@
<template>
<div>
<h2>
Login
</h2>
<form id="loginform" @submit.prevent="submit">
<input type="text" name="username" placeholder="Username" v-model="credentials.username" required>
<input type="password" name="password" placeholder="Password" v-model="credentials.password" required>
<button type="submit" class="ui fluid large blue submit button">Login</button>
<div class="ui info message" v-if="loading">
<icon name="refresh" spin></icon>&nbsp;&nbsp;
Loading...
</div>
<div class="ui error message" v-if="error" style="display: block;">
{{ error }}
</div>
</form>
</div>
</template>
<script>
import auth from '../auth'
import router from '../router'
export default {
data() {
return {
credentials: {
username: '',
password: ''
},
error: '',
loading: false
}
},
beforeMount() {
// Check if the user is already logged in, if so, redirect him to the homepage
if (auth.user.authenticated) {
router.push({name: 'home'})
}
},
methods: {
submit() {
this.loading = true
this.error = ''
let credentials = {
username: this.credentials.username,
password: this.credentials.password
}
auth.login(this, credentials, 'home')
}
}
}
</script>
<style scoped>
</style>