refine login

Author: PanJiaChen

package.json

@@ -52,7 +52,7 @@
     "eslint-config-airbnb-base": "11.0.1",
     "eslint-friendly-formatter": "2.0.7",
     "eslint-import-resolver-webpack": "0.8.1",
-    "eslint-loader": "1.6.1",
+    "eslint-loader": "1.6.3",
     "eslint-plugin-html": "2.0.0",
     "eslint-plugin-import": "2.2.0",
     "eventsource-polyfill": "0.9.6",

src/api/login.js

@@ -0,0 +1,30 @@
+import { fetch } from 'utils/fetch';
+
+export function loginByEmail(email, password) {
+  const data = {
+    email,
+    password
+  };
+  return fetch({
+    url: '/login/loginbyemail',
+    method: 'post',
+    params: data
+  });
+}
+
+export function logout() {
+  return fetch({
+    url: '/login/logout',
+    method: 'post'
+  });
+}
+
+
+export function getInfo(token) {
+  return fetch({
+    url: '/user/info',
+    method: 'get',
+    params: { token }
+  });
+}
+

src/main.js

@@ -49,7 +49,6 @@ router.beforeEach((to, from, next) => {
     if (to.path === '/login') {
       next({ path: '/' });
     } else {
-      console.log('a')
       if (to.meta && to.meta.role) {
         if (hasPermission(store.getters.roles, to.meta.role)) {
           next();

src/mock/index.js

@@ -1,18 +1,25 @@
 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
+import loginAPI from './login';
 import articleAPI from './article';
 import article_tableAPI from './article_table';
 import remoteSearchAPI from './remoteSearch';
 const mock = new MockAdapter(axios);
 
+// 登录相关
+mock.onPost('/login/loginbyemail').reply(loginAPI.loginByEmail);
+mock.onPost('/login/logout').reply(loginAPI.logout);
+mock.onGet('/user/info').reply(loginAPI.getInfo);
 
+// 文章相关
 mock.onGet('/article/list').reply(articleAPI.getList);
 mock.onGet('/article/detail').reply(articleAPI.getArticle);
 
+// table example相关
 mock.onGet('/article_table/list').reply(article_tableAPI.getList);
 mock.onGet('/article_table/pv').reply(article_tableAPI.getPv);
 
-
+// 搜索相关
 mock.onGet('/search/user').reply(remoteSearchAPI.searchUser);
 
 

src/mock/login.js

@@ -22,4 +22,32 @@ const userMap = {
     name: '工程师小王'
   }
 }
-export default userMap
+
+export default {
+  loginByEmail: config => {
+    const { email } = config.params;
+    return new Promise(resolve => {
+      setTimeout(() => {
+        resolve([200, {
+          data: userMap[email.split('@')[0]]
+        }]);
+      }, 500);
+    })
+  },
+  getInfo: config => {
+    const { token } = config.params;
+    console.log(userMap[token])
+    return new Promise(resolve => {
+      setTimeout(() => {
+        resolve([200, {
+          data: userMap[token]
+        }]);
+      }, 100);
+    })
+  },
+  logout: () => new Promise(resolve => {
+    setTimeout(() => {
+      resolve([200, { data: 'success' }]);
+    }, 100);
+  })
+};

src/store/modules/user.js

@@ -1,7 +1,5 @@
-// import { loginByEmail, loginByThirdparty } from 'api/login';
-// import { userInfo, userLogout } from 'api/adminUser';
+import { loginByEmail, logout, getInfo } from 'api/login';
 import Cookies from 'js-cookie';
-import userMap from 'mock/login';
 
 const user = {
   state: {
@@ -64,21 +62,39 @@ const user = {
   },
 
   actions: {
-        // 邮箱登录
+    // 邮箱登录
     LoginByEmail({ commit }, userInfo) {
       return new Promise((resolve, reject) => {
-        const email = userInfo.email.split('@')[0];
-        if (userMap[email]) {
-          commit('SET_ROLES', userMap[email].role);
-          commit('SET_TOKEN', userMap[email].token);
-          Cookies.set('X-Ivanka-Token', userMap[email].token);
+        loginByEmail(userInfo.email, userInfo.password).then(response => {
+          const data = response.data;
+          Cookies.set('X-Ivanka-Token', response.data.token);
+          commit('SET_TOKEN', data.token);
+          commit('SET_EMAIL', userInfo.email);
           resolve();
-        } else {
-          reject('账号不正确');
-        }
+        }).catch(error => {
+          reject(error);
+        });
       });
     },
-        // 第三方验证登录
+
+
+     // 获取用户信息
+    GetInfo({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        getInfo(state.token).then(response => {
+          const data = response.data;
+          commit('SET_ROLES', data.role);
+          commit('SET_NAME', data.name);
+          commit('SET_AVATAR', data.avatar);
+          commit('SET_INTRODUCTION', data.introduction);
+          resolve(response);
+        }).catch(error => {
+          reject(error);
+        });
+      });
+    },
+
+    // 第三方验证登录
     LoginByThirdparty({ commit, state }, code) {
       return new Promise((resolve, reject) => {
         commit('SET_CODE', code);
@@ -91,21 +107,12 @@ const user = {
         });
       });
     },
-        // 获取用户信息
-    GetInfo({ commit, state }) {
-      return new Promise(resolve => {
-        const token = state.token;
-        commit('SET_ROLES', userMap[token].role);
-        commit('SET_NAME', userMap[token].name);
-        commit('SET_AVATAR', userMap[token].avatar);
-        commit('SET_INTRODUCTION', userMap[token].introduction);
-        resolve();
-      });
-    },
-        // 登出
+
+
+    // 登出
     LogOut({ commit, state }) {
       return new Promise((resolve, reject) => {
-        userLogout(state.token).then(() => {
+        logout(state.token).then(() => {
           commit('SET_TOKEN', '');
           Cookies.remove('X-Ivanka-Token');
           resolve();

src/views/dashboard/editor/index.vue

@@ -121,7 +121,6 @@
       methods: {
         fetchData() {
           getList(this.listQuery).then(response => {
-            console.log(response.data)
             this.list = response.data;
           })
         }

src/views/layout/Layout.vue

@@ -30,12 +30,12 @@
         }
       },
       beforeRouteEnter: (to, from, next) => {
-        console.log('b')
         const roles = store.getters.roles;
         if (roles.length !== 0) {
           next();
           return
         }
+
         // loadingInstance = Loading.service({ fullscreen: true, text: '玩命加载中' });
         store.dispatch('GetInfo').then(() => {
           permission.init({

src/views/layout/Sidebar.vue

@@ -27,7 +27,6 @@
 
 <script>
     import permissionRoutes from 'store/permission';
-
     export default {
       name: 'Sidebar',
       data() {

src/views/login/index.vue

@@ -61,10 +61,10 @@
           },
           loginRules: {
             email: [
-                        { required: true, trigger: 'blur', validator: validateEmail }
+                { required: true, trigger: 'blur', validator: validateEmail }
             ],
             password: [
-                        { required: true, trigger: 'blur', validator: validatePass }
+                { required: true, trigger: 'blur', validator: validatePass }
             ]
           },
           loading: false,
@@ -73,7 +73,6 @@
       },
       computed: {
         ...mapGetters([
-          'status',
           'auth_type'
         ])
       },