rico · February 11, 2018 14:42 · Feb 11, 2018 · Feb 11, 2018 · Feb 11, 2018 · Feb 11, 2018
diff --git a/router.js b/router.js
@@ -0,0 +1,36 @@
+// File: router/index.js
+
+import Vue from 'vue'
+import VueRouter from 'vue-router';
+import Login from '../pages/Login';
+import Dashboard from '../pages/Dashboard';
+import '../providers/authorize';
+
+Vue.use(VueRouter);
+
+const routes = [
+    {
+        path: '/',
+        component: Dashboard,
+        meta: {
+            permissions: {
+                roles: ['user'],
+                redirectTo: '/login'
+            }
+        }
+    },
+    {
+        path: '/login',
+        component: Login,
+        meta: {
+            permissions: {
+                roles: ['guest'],
+                redirectTo: '/'
+            }
+        }
+    },
+];
+
+export default new VueRouter({
+    routes // short for `routes: routes`
+});
diff --git a/authorize.js b/authorize.js
@@ -0,0 +1,47 @@
+// File: providers/authorize.js
+
+import Vue from "vue";
+import auth from './authenticate'
+import { VueAuthorize } from 'vue-authorize'
+
+import IsAuthorizedComponent from "vue-authorize/src/component";
+import IsAuthorizedDirective from "vue-authorize/src/directive";
+
+
+const authorize = new VueAuthorize(auth, {
+    roles: {
+        user: {
+            handler: function () {
+
+                console.log('authorize.js 10 => user');
+
+                return this.$auth.isAuthorized()
+            },
+            permissions: []
+        },
+        guest: {
+            handler: function () {
+
+                console.log('authorize.js 19 => guest');
+
+                return !this.$auth.isAuthorized()
+            },
+            permissions: []
+        }
+    },
+
+    permissions: {}
+});
+
+Vue.directive('isAuthorized', IsAuthorizedDirective);
+Vue.component('isAuthorized', IsAuthorizedComponent);
+
+Object.defineProperties(Vue.prototype, {
+    $authorize: {
+        get() {
+            return authorize
+        }
+    }
+});
+
+export default authorize;
diff --git a/Login.vue b/Login.vue
@@ -0,0 +1,31 @@
+// Component: Login.vue
+ data: () => ({
+            credentials: {
+                username: '',
+                password: '',
+            },
+            errors: {},
+            loading:false
+        }),
+methods : {
+            login: function () {
+
+                this.errors = {};
+                this.loading = true;
+                this.$store.dispatch('login', {credentials: this.credentials})
+                    .then(() => {
+                        this.loading = false;
+                        this.$router.push('/');
+                    })
+                    .catch((e) => {
+
+                        if (e.response.status == 422) {
+                            this.errors = e.response.data.errors;
+                        } else if (e.response.status == 401) {
+                            this.errors.message = 'Kein Benutzer mit diesen Angaben gefunden.'
+                        }
+
+                        this.loading = false;
+                    });
+            }
+        }
diff --git a/auth.js b/auth.js
@@ -0,0 +1,64 @@
+// File: store/modules/auth.js
+
+import authProvider from '../../providers/authenticate'
+import http from '../../providers/http'
+
+// You can use it as state property
+const state = {
+    isAuthenticated: false,
+    user: null
+};
+
+const getters = {
+    isAuthenticated () {
+        return authProvider.isAuthenticated()
+    },
+    user () {
+        return state.user
+    }
+};
+
+const mutations = {
+    isAuthenticated (state, payload) {
+        state.isAuthenticated = payload.isAuthenticated
+    },
+    user (state, payload) {
+        state.user = payload;
+    }
+};
+
+const actions = {
+
+    // Perform VueAuthenticate login using Vuex actions
+    login (context, payload) {
+
+        return new Promise((resolve, reject) => {
+            authProvider.login(payload.credentials).then((response) => {
+
+
+                    context.commit('isAuthenticated', {
+                        isAuthenticated: authProvider.isAuthenticated()
+                    });
+
+                    http.get('/auth/user')
+                        .then(function (response) {
+                            context.commit('user', response.data);
+
+                            resolve();
+                        });
+
+            })
+            .catch((err) => {
+                reject(err);
+            });
+        });
+
+    }
+};
+
+export default {
+    state,
+    getters,
+    actions,
+    mutations
+}
diff --git a/authenticate.js b/authenticate.js
@@ -0,0 +1,10 @@
+// File: providers/authenticate.js
+
+import Vue from 'vue'
+import { VueAuthenticate } from 'vue-authenticate'
+import http from "./http";
+
+export default new VueAuthenticate(Vue.prototype.$http, {
+    loginUrl: 'auth/user/login',
+    tokenName: 'access_token'
+});
diff --git a/https.js b/https.js
@@ -0,0 +1,10 @@
+// File: providers/http.js
+
+import Vue from "vue";
+import axios from "axios/index";
+import VueAxios from "vue-axios";
+
+Vue.use(VueAxios, axios);
+Vue.axios.defaults.baseURL = 'http://local.test';
+
+export default Vue.axios;
diff --git a/index.js b/index.js
@@ -0,0 +1,14 @@
+// File: store/index.js
+
+import Vue from 'vue'
+import Vuex from 'vuex'
+
+Vue.use(Vuex);
+
+import auth from './modules/auth'
+
+export default new Vuex.Store({
+    modules: {
+        auth
+    },
+});