arturo guerrero
87 lines
2.3 KiB
Vue
87 lines
2.3 KiB
Vue
<template lang="pug">
|
|
main
|
|
nav.navbar.is-u-blue
|
|
div.navbar-brand
|
|
a.navbar-item
|
|
b PC PUMA
|
|
.container
|
|
.columns
|
|
.column.is-4.is-offset-4.has-text-centered
|
|
br
|
|
img(src="../assets/pcpuma.jpg" width="300px")
|
|
br
|
|
un-notification(v-if='this.status' v-bind:msj='this.err' status=true)
|
|
br
|
|
form
|
|
.field
|
|
.select
|
|
select(v-model="kiosko" require)
|
|
option(disabled) selecciona el kiosko
|
|
option(selected) 1
|
|
option 2
|
|
.field
|
|
p.control.has-icons-left
|
|
input.input.is-link(placeholder="Usuario" v-model="user")
|
|
span.icon.is-small.is-left
|
|
i
|
|
font-awesome-icon(icon="user")
|
|
.field
|
|
p.control.has-icons-left
|
|
input.input.is-link(placeholder="Contraseña" v-model="pass" type="password")
|
|
span.icon.is-small.is-left
|
|
i
|
|
font-awesome-icon(icon="lock")
|
|
.field.has-text-centered
|
|
input.button.is-u-blue(type="submit" v-on:click="Login($event)" value="Iniciar sesión")
|
|
</template>
|
|
|
|
<script>
|
|
import UnNotification from '../components/general/Notificacion.vue'
|
|
import api from '../api'
|
|
const axios = require('axios')
|
|
export default {
|
|
components: {
|
|
UnNotification
|
|
},
|
|
data () {
|
|
return {
|
|
user: '',
|
|
pass: '',
|
|
err: '',
|
|
status: false,
|
|
kiosko: ''
|
|
}
|
|
},
|
|
methods: {
|
|
Login: function (event) {
|
|
if (event) event.preventDefault()
|
|
axios({
|
|
method: 'post',
|
|
url: api.url + '/login',
|
|
data: {
|
|
usuario: this.user,
|
|
pass: this.pass
|
|
}
|
|
})
|
|
.then(response => {
|
|
console.log(response.data)
|
|
this.$store.commit('login', response.data)
|
|
this.$store.commit('kiosko', this.kiosko)
|
|
this.$router.push('/')
|
|
})
|
|
.catch(error => {
|
|
this.err = error.response.data.err
|
|
this.status = !error.response.data.status
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="css" scoped>
|
|
.navbar{
|
|
border-bottom: #B08100 solid 5px;
|
|
box-shadow: 0px 13px 21px 2px rgba(0,0,0,0.21);
|
|
}
|
|
</style>
|