Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <i18n>
- {
- "pl":{
- "email": "Adres email",
- "password": "Hasło",
- "send" : "Wyślij",
- "reset": "Resetuj"
- },
- "en":{
- "email": "Email address",
- "password": "Password",
- "send" : "Send",
- "reset": "Reset"
- }
- }
- </i18n>
- <template>
- <div id="login-wrapper">
- <el-row>
- <el-col :span="8" :offset="8">
- <h1>Bileteria</h1>
- <div class="has-error" v-if='errors'>
- Logowanie nie powiodło się
- </div>
- <el-form :model="loginForm">
- <el-form-item>
- <el-input :placeholder="$t('email')" v-model="loginForm.email" autocomplete="off"></el-input>
- </el-form-item>
- <el-form-item>
- <el-input :placeholder="$t('password')" type="password" v-model="loginForm.password" autocomplete="off"></el-input>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="login()">{{$t('send')}}</el-button>
- <el-button @click="resetForm('loginForm')">{{$t('reset')}}</el-button>
- </el-form-item>
- </el-form>
- </el-col>
- </el-row>
- </div>
- </template>
- <script>
- import {loginUrl, getHeader, apiDomain} from './../config'
- import {grantType, clientId, clientSecret} from './../.env'
- import Vue from 'vue'
- export default {
- components: {
- },
- data () {
- return {
- loginForm: {
- email: '',
- password: ''
- },
- errors: false
- }
- },
- created () {
- if (this.userIsLoggedIn()) {
- this.$router.push({name: 'dashboard'})
- }
- },
- methods: {
- login () {
- this.errors = false
- const postData = {
- grant_type: grantType,
- client_id: clientId,
- client_secret: clientSecret,
- username: this.loginForm.email,
- password: this.loginForm.password,
- scope: ''
- }
- this.$auth.login(postData).then(function (response) {
- // Execute application logic after successful login
- this.$router.push({name: 'dashboard'})
- })
- },
- userIsLoggedIn () {
- return window.localStorage.getItem('authUser')
- },
- resetForm () {
- this.loginForm = {
- email: '',
- password: ''
- };
- }
- },
- computed: {
- error () {
- console.log(this.errors.body.message)
- this.error = this.errors.body.message
- }
- }
- }
- </script>
- <style lang="css" scoped>
- #login-wrapper {
- height:100%;
- display:flex;
- justify-content: center;
- flex-direction: column;
- }
- h1 {
- color: #000;
- font-family: "Raleway", sans-serif;
- font-weight: 300;
- text-align: center;
- }
- .has-error {
- color:red;
- margin-bottom: 5px;
- }
- </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement