xmtrock
发布于 2021-06-02 / 159 阅读
0

搭建vue-admin-template【3.11版本】

https://github.com/PanJiaChen/vue-element-admin
https://github.com/PanJiaChen/vue-admin-template
1、拉下来,放到vscode
2、打开终端,npm install让其慢慢生成依赖文件
3、启动 npm run dev
4、修改: // …(config.dev.useEslint ? [createLintingRule()] : []), useEslint: false,
修改登录端口模拟数据返回
store/modules/user.js

import { login, logout, getInfo } from '@/api/login'
import { getToken, setToken, removeToken } from '@/utils/auth'

const user = {
    state: {
        token: getToken(),
        name: '',
        avatar: '',
        roles: []
    },

    mutations: {
        SET_TOKEN: (state, token) => {
            state.token = token
        },
        SET_NAME: (state, name) => {
            state.name = name
        },
        SET_AVATAR: (state, avatar) => {
            state.avatar = avatar
        },
        SET_ROLES: (state, roles) => {
            state.roles = roles
        }
    },

    actions: {
        // 登录
        Login({ commit }, userInfo) {
            const data = { 'token': 'admin' }
            setToken(data.token)
            commit('SET_TOKEN', data.token)
        },

        // 获取用户信息
        GetInfo({ commit, state }) {
            const data = { 'roles': 'admin', 'name': 'admin', 'avatar': 'https://myblog-data-soulike.oss-cn-beijing.aliyuncs.com/headpic.jpg' }
            if (data.roles && data.roles.length > 0) {
                commit('SET_ROLES', data.roles)
            } else {
                reject('getInfo: roles must be a non-null array !')
            }
            commit('SET_NAME', data.name)
            commit('SET_AVATAR', data.avatar)
        },

        // 登出
        LogOut({ commit, state }) {
            commit('SET_TOKEN', '')
            commit('SET_ROLES', [])
            removeToken()
        },

        // 前端 登出
        FedLogOut({ commit }) {
            commit('SET_TOKEN', '')
            removeToken()
            resolve()
        }
    }
}

export default user

然后改util/request.js

// request拦截器
service.interceptors.request.use(
  config => {
    if (store.getters.token) {
      config.headers['token'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
    }
    return config
  },
  error => {
    // Do something with request error
    console.log(error) // for debug
    Promise.reject(error)
  }
)

使用request.js

import request from '@/utils/request'

const api_name = `/api/hosp/hospital`
export default {
    //查询医院的列表
    getPageList(page, limit, searchObj) {
        return request({
            url: api_name + `/findHospList/${page}/${limit}`,
            method: 'GET',
            params: searchObj
        })
    }
}