Author: Not specified Language: javascript
Description: Not specified Timestamp: 2018-03-28 08:24:08 +0000
View raw paste Reply
  1. //Import libraries
  2. import Vue from 'vue/dist/vue.js'
  3. import Vuex from 'vuex'
  4. import VueRouter from 'vue-router'
  5. import VueResource from 'vue-resource'
  6.  
  7. //Import components
  8. import Login from './components/login'
  9. import Root from './components/root'
  10.  
  11. //Using libraries
  12. Vue.use(VueRouter);
  13. Vue.use(Vuex);
  14. Vue.use(VueResource);
  15.  
  16. //Handle csrf and auth
  17. Vue.http.interceptors.push(function(request) {
  18.   request.headers.set('X-CSRFToken', document.body.querySelector('input[name="csrfmiddlewaretoken"]').value);
  19.   if (localStorage.getItem("token")) {
  20.       request.headers.set('Authorization', 'JWT ' + localStorage.getItem("token"));
  21.   }
  22. });
  23.  
  24. //Defining router
  25. var router = new VueRouter({
  26.     mode: 'history',
  27.     routes: [
  28.         { path: '/', component: Root, name: 'root' },
  29.         { path: '/login', component: Login, name: 'login' },
  30.     ]
  31. });
  32.  
  33. //Handling login redirections
  34. router.beforeEach((to, from, next) => {
  35.     if (to.path != "/login" && !localStorage.getItem("token")) {
  36.         next("/login");
  37.     }
  38.     else {
  39.         next();
  40.     }
  41. });
  42.  
  43. //Defining vuex store
  44. var store = new Vuex.Store({
  45.     state: {
  46.         isLoggedIn: !!localStorage.getItem("token"),
  47.         data: {}
  48.     },
  49.     mutations: {
  50.         login (state) {
  51.             state.isLoggedIn = true;
  52.         },
  53.         logout (state) {
  54.             state.isLoggedIn = false;
  55.         },
  56.         set_initial_data(state, data) {
  57.             state.data = data;
  58.         }
  59.     },
  60.     actions: {
  61.         login({ commit }, payload) {
  62.             localStorage.setItem("token", payload["token"]);
  63.             localStorage.setItem("can_manage_users", payload["can_manage_users"]);
  64.             localStorage.setItem("can_manage_timezones", payload["can_manage_timezones"]);
  65.             commit("login");
  66.         },
  67.         logout({ commit }) {
  68.             localStorage.removeItem("token");
  69.             localStorage.removeItem("can_manage_users");
  70.             localStorage.removeItem("can_manage_timezones");
  71.             commit("logout");
  72.         },
  73.         set_initial_data({commit}, data) {
  74.             commit("set_initial_data", data);
  75.         }
  76.     },
  77.     getters: {
  78.         isLoggedIn: state => {
  79.             return state.isLoggedIn
  80.         },
  81.         data: state => {
  82.             return state.data
  83.         }
  84.     }
  85. });
  86.  
  87. //Starting the app
  88. var app = new Vue({
  89.     router,
  90.     store,
  91.     mounted: function() {
  92.         var that = this;
  93.         this.$http.get("/initial_data/", {}, function(data) {
  94.             that.$store.dispatch('set_initial_data', data);
  95.         });
  96.     }
  97. }).$mount('#app');
  98.  
View raw paste Reply