add authentication requirement

and a mock auth helper
This commit is contained in:
2017-02-14 19:44:30 -07:00
parent 3631f98b58
commit 0996117565
3 changed files with 44 additions and 7 deletions

View File

@@ -0,0 +1,3 @@
export function getUser() {
return Promise.resolve(null);
}

View File

@@ -1,11 +1,21 @@
<template>
<section class="section">
<div class="container">
<div class="notification">
Login Here
<div id="login" class="container">
<nav class="nav has-shadow">
<div class="nav-left">
<div class="nav-item is-brand">
<router-link class="nav-item is-brand" to="/">Customer Management</router-link>
</div>
</div>
</div>
</section>
</nav>
<section class="section">
<div class="container">
<div class="notification">
Login Here
</div>
</div>
</section>
</div>
</template>
<script>

View File

@@ -3,19 +3,26 @@ import VueRouter from 'vue-router';
import App from './App.vue';
import Login from './pages/Login.vue';
import Customers from './pages/Customers.vue';
import Orders from './pages/Orders.vue';
import About from './pages/About.vue';
import { getUser } from './lib/authentication';
Vue.use(VueRouter);
const routes = [{
path: '/login',
name: 'login',
component: Login,
}, {
path: '/',
name: 'app',
component: App,
meta: {
requiresAuthentication: true,
},
children: [
{
path: 'customers',
@@ -41,4 +48,21 @@ const router = new VueRouter({
routes,
});
router.beforeEach((to, from, next) => {
// check if any of the matched routes require authentication
if (to.matched.some(record => record.meta.requiresAuthentication)) {
return getUser().then((user) => {
// if user is authenticated, continue
if (user) return next();
// otherwise, redirect to login, preserving the requested route
const { name, fullPath } = to;
const query = (name !== undefined) ? { redirect: name } : { prev: fullPath };
return next({ name: 'login', query });
});
}
return next();
});
export default router;