'admin-21.02.22:增加axios、后端控制路由等'

This commit is contained in:
lyt-Top 2021-02-22 21:56:45 +08:00
parent 1e5fa09e85
commit 38b9f430ce
12 changed files with 164 additions and 16 deletions

2
.env
View File

@ -5,4 +5,4 @@ VITE_PORT = 10000
VITE_OPEN = false
# public path 配置线上环境路径
VITE_PUBLIC_PATH = /vue-admin-wonderful-next-preview/
VITE_PUBLIC_PATH = /vue-admin-wonderful-next-preview/

View File

@ -1,2 +0,0 @@
# public path
VITE_PUBLIC_PATH = 'http://localhost:8080/'

View File

@ -1,2 +0,0 @@
# public path
VITE_PUBLIC_PATH = /vue-admin-wonderful-next-preview/

View File

@ -1,9 +1,10 @@
// vite 打包相关
import dotenv from 'dotenv'
export interface ViteEnv {
VITE_PORT: number
VITE_OPEN: boolean
VITE_PUBLIC_PATH: string
VITE_PORT: number,
VITE_OPEN: boolean,
VITE_PUBLIC_PATH: string,
VITE_LOCAL_PATH: string
}
export function loadEnv(): ViteEnv {
@ -12,6 +13,7 @@ export function loadEnv(): ViteEnv {
const envList = [`.env.${env}.local`, `.env.${env}`, '.env.local', '.env', ,]
envList.forEach((e) => { dotenv.config({ path: e }) })
for (const envName of Object.keys(process.env)) {
console.log(envName)
let realName = (process.env as any)[envName].replace(/\\n/g, '\n')
realName = realName === 'true' ? true : realName === 'false' ? false : realName
if (envName === 'VITE_PORT') realName = Number(realName)

View File

@ -6,6 +6,7 @@
"build": "vite build"
},
"dependencies": {
"axios": "^0.21.1",
"clipboard": "^2.0.6",
"echarts": "^5.0.2",
"echarts-wordcloud": "^2.0.0",
@ -19,16 +20,17 @@
"vuex": "^4.0.0-rc.2"
},
"devDependencies": {
"@types/axios": "^0.14.0",
"@types/clipboard": "^2.0.1",
"@types/node": "^14.14.27",
"@types/node": "^14.14.31",
"@types/nprogress": "^0.2.0",
"@types/sortablejs": "^1.10.6",
"@vitejs/plugin-vue": "^1.1.4",
"@vue/compiler-sfc": "^3.0.5",
"dotenv": "^8.2.0",
"sass": "^1.32.7",
"sass": "^1.32.8",
"sass-loader": "^11.0.1",
"typescript": "^4.1.5",
"vite": "^2.0.0-beta.69"
"vite": "^2.0.1"
}
}

19
src/api/login/index.ts Normal file
View File

@ -0,0 +1,19 @@
import request from '/@/utils/request.ts'
// 用户登录
export function signIn(params: object) {
return request({
url: '/user/signIn',
method: 'post',
data: params
})
}
// 用户退出登录
export function signOut(params: object) {
return request({
url: '/user/signOut',
method: 'post',
data: params
})
}

40
src/api/menu/index.ts Normal file
View File

@ -0,0 +1,40 @@
import request from '/@/utils/request.ts'
/**
* webpack nginx
*
*
* 线 `json`
*
*/
// 获取后端动态路由菜单(超级管理)
export function getMenuAdmin(params?: object) {
if (process.env.NODE_ENV === 'development') {
return request({
url: '/gitee/lyt-top/vue-admin-wonderful-images/raw/master/menu/menuAdmin.json',
method: 'get',
params,
});
} else {
return request({
url: './menuAdmin.json',
method: 'get'
})
}
}
// 获取后端动态路由菜单(普通用户)
export function getMenuOrdinary(params?: object) {
if (process.env.NODE_ENV === 'development') {
return request({
url: '/gitee/lyt-top/vue-admin-wonderful-images/raw/master/menu/menuOrdinary.json',
method: 'get',
params,
});
} else {
return request({
url: './menuOrdinary.json',
method: 'get'
})
}
}

View File

@ -3,6 +3,7 @@ import NProgress from 'nprogress';
import 'nprogress/nprogress.css';
import { store } from "/@/store/index.ts"
import { getSession, clearSession } from "/@/utils/storage.ts"
import { getMenuAdmin } from '/@/api/menu/index.ts'
// 定义动态路由
export const dynamicRoutes = [
@ -467,6 +468,16 @@ const router = createRouter({
routes: staticRoutes
})
// 后端控制路由isRequestRoutes 为 true则开启后端控制路由
// console.log(store)
// console.log(dynamicRoutes)
// store.dispatch('setBackEndControlRoutes', 'admin')
export function getBackEndControlRoutes() {
getMenuAdmin().then((res: any) => {
console.log(res);
});
}
// 多级嵌套数组处理成一维数组
export function formatFlatteningRoutes(arr: any) {
if (arr.length < 0) return false
@ -577,7 +588,9 @@ export function initAllFun() {
}
// 初始化方法执行
initAllFun()
if (!store.state.themeConfig.isRequestRoutes) initAllFun()
// 后端控制路由isRequestRoutes 为 true则开启后端控制路由
if (store.state.themeConfig.isRequestRoutes) getBackEndControlRoutes()
// 路由加载前
router.beforeEach((to, from, next) => {

View File

@ -42,7 +42,8 @@ export interface RootStateTypes {
tagsStyle: string,
animation: string,
columnsAsideStyle: string,
layout: string
layout: string,
isRequestRoutes: boolean
},
routes: Array<object>,
keepAliveNames: Array<string>,
@ -107,6 +108,12 @@ export const store = createStore<RootStateTypes>({
if (getSession('userInfo')) commit('getUserInfos', getSession('userInfo'))
}
},
// 后端控制路由
async setBackEndControlRoutes({ commit }, query: string) {
if (query === 'admin') {
} else { }
}
}
})

60
src/utils/request.ts Normal file
View File

@ -0,0 +1,60 @@
import axios from "axios";
import { ElMessage, ElMessageBox } from "element-plus";
import { clearSession, getSession } from "/@/utils/storage.ts";
import router, { resetRoute } from "/@/router/index.ts";
// 配置新建一个 axios 实例
const service = axios.create({
baseURL: 'http://localhost:10000/',
timeout: 50000,
headers: { "Content-Type": "application/json" }
});
// 添加请求拦截器
service.interceptors.request.use(
(config) => {
// 在发送请求之前做些什么 token
if (getSession("token")) {
config.headers.common["Authorization"] = `${getSession("token")}`;
}
return config;
},
(error) => {
// 对请求错误做些什么
return Promise.reject(error);
}
);
// 添加响应拦截器
service.interceptors.response.use(
(response) => {
// 对响应数据做点什么
const res = response.data;
if (res.code && res.code !== 0) {
// `token` 过期或者账号已在别处登录
if (res.code === 401 || res.code === 4001) {
clearSession(); // 清除浏览器全部临时缓存
router.push("/login"); // 去登录页面
resetRoute() // 删除/重置路由
ElMessageBox.alert('你已被登出,请重新登录', '提示', {}).then(() => { }).catch(() => { });
}
return Promise.reject(service.interceptors.response);
} else {
return response.data;
}
},
(error) => {
// 对响应错误做点什么
if (error.message.indexOf("timeout") != -1) {
ElMessage.error("网络超时");
} else if (error.message == "Network Error") {
ElMessage.error("网络连接错误");
} else {
if (error.response.data) ElMessage.error(error.response.data.message)
else ElMessage.error('接口路径找不到')
}
return Promise.reject(error);
}
);
export default service;

View File

@ -38,5 +38,6 @@ export default {
tagsStyle: 'tagsStyleOne',
animation: 'slideRight',
columnsAsideStyle: 'columnsRound',
layout: 'defaults'
layout: 'defaults',
isRequestRoutes: true
}

View File

@ -2,7 +2,7 @@ import vue from '@vitejs/plugin-vue'
import type { UserConfig } from 'vite'
import { loadEnv } from './build/utils'
const { VITE_PORT, VITE_PUBLIC_PATH, VITE_OPEN } = loadEnv()
const { VITE_PORT, VITE_OPEN, VITE_PUBLIC_PATH } = loadEnv()
const viteConfig: UserConfig = {
plugins: [vue()],
@ -21,7 +21,15 @@ const viteConfig: UserConfig = {
},
server: {
port: VITE_PORT,
open: VITE_OPEN
open: VITE_OPEN,
proxy: {
'/gitee': {
target: 'https://gitee.com',
ws: true,
changeOrigin: true,
rewrite: (path) => path.replace(/^\/gitee/, ''),
}
}
},
build: {
outDir: 'dist',