add easy-mock
This commit is contained in:
		@@ -2,5 +2,6 @@ var merge = require('webpack-merge')
 | 
			
		||||
var prodEnv = require('./prod.env')
 | 
			
		||||
 | 
			
		||||
module.exports = merge(prodEnv, {
 | 
			
		||||
  NODE_ENV: '"development"'
 | 
			
		||||
  NODE_ENV: '"development"',
 | 
			
		||||
  BASE_API: '"https://easy-mock.com/mock/5950a2419adc231f356a6636/vue-admin"',
 | 
			
		||||
})
 | 
			
		||||
 
 | 
			
		||||
@@ -1,3 +1,4 @@
 | 
			
		||||
module.exports = {
 | 
			
		||||
  NODE_ENV: '"production"'
 | 
			
		||||
  NODE_ENV: '"production"',
 | 
			
		||||
  BASE_API: '"https://easy-mock.com/mock/5950a2419adc231f356a6636/vue-admin"',
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -1,21 +1,13 @@
 | 
			
		||||
import fetch from '@/utils/fetch';
 | 
			
		||||
 | 
			
		||||
export function loginByEmail(email, password) {
 | 
			
		||||
  const data = {
 | 
			
		||||
    email,
 | 
			
		||||
    password
 | 
			
		||||
  };
 | 
			
		||||
export function login(email, password) {
 | 
			
		||||
  return fetch({
 | 
			
		||||
    url: '/login/loginbyemail',
 | 
			
		||||
    url: '/user/login',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function logout() {
 | 
			
		||||
  return fetch({
 | 
			
		||||
    url: '/login/logout',
 | 
			
		||||
    method: 'post'
 | 
			
		||||
    data: {
 | 
			
		||||
      email,
 | 
			
		||||
      password
 | 
			
		||||
    }
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@@ -27,3 +19,12 @@ export function getInfo(token) {
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function logout() {
 | 
			
		||||
  return fetch({
 | 
			
		||||
    url: '/user/logout',
 | 
			
		||||
    method: 'post'
 | 
			
		||||
  });
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										72
									
								
								src/main.js
									
									
									
									
									
								
							
							
						
						
									
										72
									
								
								src/main.js
									
									
									
									
									
								
							@@ -15,47 +15,41 @@ Vue.config.productionTip = false
 | 
			
		||||
 | 
			
		||||
Vue.use(ElementUI);
 | 
			
		||||
 | 
			
		||||
router.afterEach(() => {
 | 
			
		||||
  NProgress.done(); // 结束Progress
 | 
			
		||||
 | 
			
		||||
const whiteList = ['/login'];// 不重定向白名单
 | 
			
		||||
router.beforeEach((to, from, next) => {
 | 
			
		||||
  NProgress.start(); // 开启Progress
 | 
			
		||||
  if (store.getters.token) { // 判断是否有token
 | 
			
		||||
    if (to.path === '/login') {
 | 
			
		||||
      next({ path: '/' });
 | 
			
		||||
    } else {
 | 
			
		||||
      if (store.getters.roles.length === 0) { // 判断当前用户是否已拉取完user_info信息
 | 
			
		||||
        store.dispatch('GetInfo').then(res => { // 拉取user_info
 | 
			
		||||
          const roles = res.data.role;
 | 
			
		||||
          store.dispatch('GenerateRoutes', { roles }).then(() => { // 生成可访问的路由表
 | 
			
		||||
            router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
 | 
			
		||||
            next(to.path); // hack方法 确保addRoutes已完成
 | 
			
		||||
          })
 | 
			
		||||
        }).catch(err => {
 | 
			
		||||
          console.log(err);
 | 
			
		||||
        });
 | 
			
		||||
      } else {
 | 
			
		||||
        next();
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  } else {
 | 
			
		||||
    if (whiteList.indexOf(to.path) !== -1) { // 在免登录白名单,直接进入
 | 
			
		||||
      next()
 | 
			
		||||
    } else {
 | 
			
		||||
      next('/login'); // 否则全部重定向到登录页
 | 
			
		||||
      NProgress.done();
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
// const whiteList = ['/login', '/authredirect', '/reset', '/sendpwd'];// 不重定向白名单
 | 
			
		||||
// router.beforeEach((to, from, next) => {
 | 
			
		||||
//   NProgress.start(); // 开启Progress
 | 
			
		||||
//   if (store.getters.token) { // 判断是否有token
 | 
			
		||||
//     if (to.path === '/login') {
 | 
			
		||||
//       next({ path: '/' });
 | 
			
		||||
//     } else {
 | 
			
		||||
//       if (store.getters.roles.length === 0) { // 判断当前用户是否已拉取完user_info信息
 | 
			
		||||
//         store.dispatch('GetInfo').then(res => { // 拉取user_info
 | 
			
		||||
//           const roles = res.data.role;
 | 
			
		||||
//           store.dispatch('GenerateRoutes', { roles }).then(() => { // 生成可访问的路由表
 | 
			
		||||
//             router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
 | 
			
		||||
//             next(to.path); // hack方法 确保addRoutes已完成
 | 
			
		||||
//           })
 | 
			
		||||
//         }).catch(err => {
 | 
			
		||||
//           console.log(err);
 | 
			
		||||
//         });
 | 
			
		||||
//       } else {
 | 
			
		||||
//         // 没有动态改变权限的需求可直接next() 删除下方权限判断 ↓
 | 
			
		||||
//         if (hasPermission(store.getters.roles, to.meta.role)) {
 | 
			
		||||
//           next();//
 | 
			
		||||
//         } else {
 | 
			
		||||
//           next({ path: '/401', query: { noGoBack: true } });
 | 
			
		||||
//         }
 | 
			
		||||
//         // 可删 ↑
 | 
			
		||||
//       }
 | 
			
		||||
//     }
 | 
			
		||||
//   } else {
 | 
			
		||||
//     if (whiteList.indexOf(to.path) !== -1) { // 在免登录白名单,直接进入
 | 
			
		||||
//       next()
 | 
			
		||||
//     } else {
 | 
			
		||||
//       next('/login'); // 否则全部重定向到登录页
 | 
			
		||||
//       NProgress.done(); // 在hash模式下 改变手动改变hash 重定向回来 不会触发afterEach 暂时hack方案 ps:history模式下无问题,可删除该行!
 | 
			
		||||
//     }
 | 
			
		||||
//   }
 | 
			
		||||
// });
 | 
			
		||||
router.afterEach(() => {
 | 
			
		||||
  NProgress.done();
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
new Vue({
 | 
			
		||||
  el: '#app',
 | 
			
		||||
 
 | 
			
		||||
@@ -28,6 +28,7 @@ Vue.use(Router);
 | 
			
		||||
  * meta : { role: ['admin'] }  will control the page role
 | 
			
		||||
  **/
 | 
			
		||||
export const constantRouterMap = [
 | 
			
		||||
  { path: '/login', component: Login, hidden: true },
 | 
			
		||||
  { path: '/404', component: Err404, hidden: true },
 | 
			
		||||
  {
 | 
			
		||||
    path: '/',
 | 
			
		||||
 
 | 
			
		||||
@@ -1,49 +1,18 @@
 | 
			
		||||
import { loginByEmail, logout, getInfo } from '@/api/login';
 | 
			
		||||
import { login, logout, getInfo } from '@/api/login';
 | 
			
		||||
import Cookies from 'js-cookie';
 | 
			
		||||
 | 
			
		||||
const user = {
 | 
			
		||||
  state: {
 | 
			
		||||
    user: '',
 | 
			
		||||
    status: '',
 | 
			
		||||
    email: '',
 | 
			
		||||
    code: '',
 | 
			
		||||
    uid: undefined,
 | 
			
		||||
    auth_type: '',
 | 
			
		||||
    token: Cookies.get('Admin-Token'),
 | 
			
		||||
    name: '',
 | 
			
		||||
    avatar: '',
 | 
			
		||||
    introduction: '',
 | 
			
		||||
    roles: [],
 | 
			
		||||
    setting: {
 | 
			
		||||
      articlePlatform: []
 | 
			
		||||
    }
 | 
			
		||||
    roles: []
 | 
			
		||||
  },
 | 
			
		||||
 | 
			
		||||
  mutations: {
 | 
			
		||||
    SET_AUTH_TYPE: (state, type) => {
 | 
			
		||||
      state.auth_type = type;
 | 
			
		||||
    },
 | 
			
		||||
    SET_CODE: (state, code) => {
 | 
			
		||||
      state.code = code;
 | 
			
		||||
    },
 | 
			
		||||
    SET_TOKEN: (state, token) => {
 | 
			
		||||
      state.token = token;
 | 
			
		||||
    },
 | 
			
		||||
    SET_UID: (state, uid) => {
 | 
			
		||||
      state.uid = uid;
 | 
			
		||||
    },
 | 
			
		||||
    SET_EMAIL: (state, email) => {
 | 
			
		||||
      state.email = email;
 | 
			
		||||
    },
 | 
			
		||||
    SET_INTRODUCTION: (state, introduction) => {
 | 
			
		||||
      state.introduction = introduction;
 | 
			
		||||
    },
 | 
			
		||||
    SET_SETTING: (state, setting) => {
 | 
			
		||||
      state.setting = setting;
 | 
			
		||||
    },
 | 
			
		||||
    SET_STATUS: (state, status) => {
 | 
			
		||||
      state.status = status;
 | 
			
		||||
    },
 | 
			
		||||
    SET_NAME: (state, name) => {
 | 
			
		||||
      state.name = name;
 | 
			
		||||
    },
 | 
			
		||||
@@ -52,25 +21,18 @@ const user = {
 | 
			
		||||
    },
 | 
			
		||||
    SET_ROLES: (state, roles) => {
 | 
			
		||||
      state.roles = roles;
 | 
			
		||||
    },
 | 
			
		||||
    LOGIN_SUCCESS: () => {
 | 
			
		||||
      console.log('login success')
 | 
			
		||||
    },
 | 
			
		||||
    LOGOUT_USER: state => {
 | 
			
		||||
      state.user = '';
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
 | 
			
		||||
  actions: {
 | 
			
		||||
    // 邮箱登录
 | 
			
		||||
    LoginByEmail({ commit }, userInfo) {
 | 
			
		||||
    // 登录
 | 
			
		||||
    Login({ commit }, userInfo) {
 | 
			
		||||
      const email = userInfo.email.trim();
 | 
			
		||||
      return new Promise((resolve, reject) => {
 | 
			
		||||
        loginByEmail(email, userInfo.password).then(response => {
 | 
			
		||||
        login(email, userInfo.password).then(response => {
 | 
			
		||||
          const data = response.data;
 | 
			
		||||
          Cookies.set('Admin-Token', response.data.token);
 | 
			
		||||
          Cookies.set('Admin-Token', data.token);
 | 
			
		||||
          commit('SET_TOKEN', data.token);
 | 
			
		||||
          commit('SET_EMAIL', email);
 | 
			
		||||
          resolve();
 | 
			
		||||
        }).catch(error => {
 | 
			
		||||
          reject(error);
 | 
			
		||||
@@ -87,8 +49,6 @@ const user = {
 | 
			
		||||
          commit('SET_ROLES', data.role);
 | 
			
		||||
          commit('SET_NAME', data.name);
 | 
			
		||||
          commit('SET_AVATAR', data.avatar);
 | 
			
		||||
          commit('SET_UID', data.uid);
 | 
			
		||||
          commit('SET_INTRODUCTION', data.introduction);
 | 
			
		||||
          resolve(response);
 | 
			
		||||
        }).catch(error => {
 | 
			
		||||
          reject(error);
 | 
			
		||||
 
 | 
			
		||||
@@ -24,34 +24,35 @@ service.interceptors.request.use(config => {
 | 
			
		||||
 | 
			
		||||
// respone拦截器
 | 
			
		||||
service.interceptors.response.use(
 | 
			
		||||
  response => response,
 | 
			
		||||
  response => {
 | 
			
		||||
  /**
 | 
			
		||||
  * 下面的注释为通过response自定义code来标示请求状态,当code返回如下情况为权限有问题,登出并返回到登录页
 | 
			
		||||
  * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
 | 
			
		||||
  */
 | 
			
		||||
//  const res = response.data;
 | 
			
		||||
//     if (res.code !== 20000) {
 | 
			
		||||
//       Message({
 | 
			
		||||
//         message: res.message,
 | 
			
		||||
//         type: 'error',
 | 
			
		||||
//         duration: 5 * 1000
 | 
			
		||||
//       });
 | 
			
		||||
//       // 50008:非法的token; 50012:其他客户端登录了;  50014:Token 过期了;
 | 
			
		||||
//       if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
 | 
			
		||||
//         MessageBox.confirm('你已被登出,可以取消继续留在该页面,或者重新登录', '确定登出', {
 | 
			
		||||
//           confirmButtonText: '重新登录',
 | 
			
		||||
//           cancelButtonText: '取消',
 | 
			
		||||
//           type: 'warning'
 | 
			
		||||
//         }).then(() => {
 | 
			
		||||
//           store.dispatch('FedLogOut').then(() => {
 | 
			
		||||
//             location.reload();// 为了重新实例化vue-router对象 避免bug
 | 
			
		||||
//           });
 | 
			
		||||
//         })
 | 
			
		||||
//       }
 | 
			
		||||
//       return Promise.reject(error);
 | 
			
		||||
//     } else {
 | 
			
		||||
//       return response.data;
 | 
			
		||||
//     }
 | 
			
		||||
    const res = response.data;
 | 
			
		||||
    if (res.code !== 20000) {
 | 
			
		||||
      Message({
 | 
			
		||||
        message: res.data,
 | 
			
		||||
        type: 'error',
 | 
			
		||||
        duration: 5 * 1000
 | 
			
		||||
      });
 | 
			
		||||
      // 50008:非法的token; 50012:其他客户端登录了;  50014:Token 过期了;
 | 
			
		||||
      if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
 | 
			
		||||
        MessageBox.confirm('你已被登出,可以取消继续留在该页面,或者重新登录', '确定登出', {
 | 
			
		||||
          confirmButtonText: '重新登录',
 | 
			
		||||
          cancelButtonText: '取消',
 | 
			
		||||
          type: 'warning'
 | 
			
		||||
        }).then(() => {
 | 
			
		||||
          store.dispatch('FedLogOut').then(() => {
 | 
			
		||||
            location.reload();// 为了重新实例化vue-router对象 避免bug
 | 
			
		||||
          });
 | 
			
		||||
        })
 | 
			
		||||
      }
 | 
			
		||||
      return Promise.reject(error);
 | 
			
		||||
    } else {
 | 
			
		||||
      return response.data;
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  error => {
 | 
			
		||||
    console.log('err' + error);// for debug
 | 
			
		||||
    Message({
 | 
			
		||||
 
 | 
			
		||||
@@ -23,8 +23,8 @@
 | 
			
		||||
 import img_404_cloud from '@/assets/404_images/404_cloud.png'
 | 
			
		||||
 | 
			
		||||
 export default {
 | 
			
		||||
   data: {
 | 
			
		||||
     return: {
 | 
			
		||||
   data() {
 | 
			
		||||
     return {
 | 
			
		||||
       img_404,
 | 
			
		||||
       img_404_cloud
 | 
			
		||||
     }
 | 
			
		||||
 
 | 
			
		||||
@@ -1,5 +0,0 @@
 | 
			
		||||
<template>
 | 
			
		||||
    <div class="dashboard-editor-container">
 | 
			
		||||
        dashboard
 | 
			
		||||
    </div>
 | 
			
		||||
</template>
 | 
			
		||||
@@ -1,38 +1,18 @@
 | 
			
		||||
<template>
 | 
			
		||||
    <div class="dashboard-container">
 | 
			
		||||
        <component v-bind:is="currentRole"> </component>
 | 
			
		||||
      {{name}}
 | 
			
		||||
    </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
    import { mapGetters } from 'vuex';
 | 
			
		||||
    import DefaultDashboard from './default/index';
 | 
			
		||||
    export default {
 | 
			
		||||
      name: 'dashboard',
 | 
			
		||||
      components: { DefaultDashboard },
 | 
			
		||||
      data() {
 | 
			
		||||
        return {
 | 
			
		||||
          currentRole: 'DefaultDashboard'
 | 
			
		||||
        }
 | 
			
		||||
      },
 | 
			
		||||
      computed: {
 | 
			
		||||
        ...mapGetters([
 | 
			
		||||
          'name',
 | 
			
		||||
          'avatar',
 | 
			
		||||
          'email',
 | 
			
		||||
          'introduction',
 | 
			
		||||
          'roles'
 | 
			
		||||
        ])
 | 
			
		||||
      },
 | 
			
		||||
      created() {
 | 
			
		||||
        if (this.roles.indexOf('admin') >= 0) {
 | 
			
		||||
          return;
 | 
			
		||||
        }
 | 
			
		||||
        // const isEditor = this.roles.some(v => v.indexOf('editor') >= 0)
 | 
			
		||||
        // if (!isEditor) {
 | 
			
		||||
        //   this.currentRole = 'DefaultDashboard';
 | 
			
		||||
        // }
 | 
			
		||||
        this.currentRole = 'DefaultDashboard';
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
</script>
 | 
			
		||||
 
 | 
			
		||||
@@ -76,12 +76,11 @@
 | 
			
		||||
          this.$refs.loginForm.validate(valid => {
 | 
			
		||||
            if (valid) {
 | 
			
		||||
              this.loading = true;
 | 
			
		||||
              this.$store.dispatch('LoginByEmail', this.loginForm).then(() => {
 | 
			
		||||
              this.$store.dispatch('Login', this.loginForm).then(() => {
 | 
			
		||||
                this.loading = false;
 | 
			
		||||
                this.$router.push({ path: '/' });
 | 
			
		||||
                // this.showDialog = true;
 | 
			
		||||
              }).catch(err => {
 | 
			
		||||
                this.$message.error(err);
 | 
			
		||||
              }).catch(() => {
 | 
			
		||||
                this.loading = false;
 | 
			
		||||
              });
 | 
			
		||||
            } else {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user