77 lines
1.4 KiB
Vue
77 lines
1.4 KiB
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<h3>{{getRudeMessage}}</h3>
|
||
|
|
<p>Login</p>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="ui segment" v-on:keyup.enter="submit">
|
||
|
|
<div class="field">
|
||
|
|
<div class="ui input">
|
||
|
|
<input v-model="username" type="text" name="email" placeholder="E-mail address" autofocus>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="field">
|
||
|
|
<div class="ui input">
|
||
|
|
<input v-model="password" type="password" name="password" placeholder="Password">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-on:click="submit" class="ui teal submit button">Login</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
|
||
|
|
//ajax calls
|
||
|
|
import axios from 'axios';
|
||
|
|
import { mapGetters } from 'vuex'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'Login',
|
||
|
|
data () {
|
||
|
|
return {
|
||
|
|
message: 'Login stuff',
|
||
|
|
enabled: false,
|
||
|
|
username: '',
|
||
|
|
password: ''
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
validate(){
|
||
|
|
console.log('Validate this bitch')
|
||
|
|
},
|
||
|
|
submit(){
|
||
|
|
|
||
|
|
let vm = this
|
||
|
|
|
||
|
|
let data = {
|
||
|
|
username: this.username,
|
||
|
|
password: this.password
|
||
|
|
}
|
||
|
|
|
||
|
|
axios.post('/api/user/login', data)
|
||
|
|
.then(response => {
|
||
|
|
console.log(response)
|
||
|
|
if(response.data.success){
|
||
|
|
|
||
|
|
const token = response.data.token
|
||
|
|
vm.$store.commit('setLoginToken', token)
|
||
|
|
|
||
|
|
//Redirect user to notes section after login
|
||
|
|
this.$router.push('/notes')
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.catch(error => {
|
||
|
|
console.log('There was an error with log in request')
|
||
|
|
})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapGetters([
|
||
|
|
'getRudeMessage'
|
||
|
|
])
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|