blackteay/nova-admin
1
0
Fork 0
mirror of https://github.com/chansee97/nova-admin.git synced 2025-04-06 03:57:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

build(build): 移除vite-plugin-html

Browse Source
This commit is contained in:
chen.home 2023-03-21 23:46:07 +08:00
parent 32be17e913
commit 4d0dcf1695
14 changed files with 202 additions and 194 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
build/plugins/html.ts
View File

@ -1,13 +0,0 @@
import { createHtmlPlugin } from 'vite-plugin-html'; // https://github.com/vbenjs/vite-plugin-html/blob/main/README.zh_CN.md
export default (env: ImportMetaEnv) => {
return createHtmlPlugin({
minify: true, // 压缩HTML
inject: {
// 注入数据
data: {
title: env.VITE_APP_TITLE,
},
},
});
};

3
build/plugins/index.ts
View File

@ -1,7 +1,6 @@
import type { PluginOption } from 'vite';
import vue from './vue';
import compress from './compress';
import html from './html';
import unocss from '@unocss/vite';
import visualizer from './visualizer';
import unplugin from './unplugin';
@ -13,7 +12,7 @@ import mock from './mock';
* @return {*}
*/
export function setVitePlugins(env: ImportMetaEnv) {
const plugins = [...vue, html(env), unocss(), ...unplugin, mock];
const plugins = [...vue, unocss(), ...unplugin, mock];
// 是否压缩
if (env.VITE_COMPRESS_OPEN === 'Y') {
plugins.push(compress(env));

2
index.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%= title %></title>
<title>%VITE_APP_TITLE%</title>
</head>
<body>
<div id="app"><div id="appLoading"></div></div>

30
mock/module/user.ts
View File

@ -246,7 +246,7 @@ const userRoutes = [
{
name: 'docments',
path: '/docments',
redirect: '/docments/not-found',
redirect: '/docments/vue',
meta: {
title: '外链文档',
requiresAuth: true,
@ -317,7 +317,7 @@ const userRoutes = [
{
name: 'error',
path: '/error',
redirect: '/error/not-found',
redirect: '/error/404',
meta: {
title: '异常页',
requiresAuth: true,
@ -326,17 +326,8 @@ const userRoutes = [
},
children: [
{
name: 'not-found',
path: '/error/not-found',
meta: {
title: '404页',
requiresAuth: true,
icon: 'icon-park-outline:error',
},
},
{
name: 'not-permission',
path: '/error/not-permission',
name: '403',
path: '/error/403',
meta: {
title: '403页',
requiresAuth: true,
@ -344,8 +335,17 @@ const userRoutes = [
},
},
{
name: 'service-error',
path: '/error/service-error',
name: '404',
path: '/error/404',
meta: {
title: '404页',
requiresAuth: true,
icon: 'icon-park-outline:error',
},
},
{
name: '500',
path: '/error/500',
meta: {
title: '500页',
requiresAuth: true,

5
package.json
View File

@ -75,12 +75,11 @@
"mockjs": "^1.1.0",
"naive-ui": "^2.34.3",
"rollup-plugin-visualizer": "^5.9.0",
"typescript": "^4.9.4",
"typescript": "^5.0.2",
"unplugin-icons": "^0.15.3",
"unplugin-vue-components": "^0.24.1",
"vite": "^4.1.4",
"vite": "^4.2.1",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-html": "^3.2.0",
"vite-plugin-mock": "^2.9.6",
"vite-plugin-svg-icons": "^2.0.1",
"vue-tsc": "^1.2.0"

67
src/layouts/components/tab/TabBar.vue
View File

@ -1,7 +1,18 @@
<template>
<div class="wh-full flex items-end">
<n-tabs type="card" size="small" :tabs-padding="15" :value="tabStore.currentTab" @close="handleClose">
<n-tab v-for="item in tabStore.inherentTab" :key="item.path" :name="item.name" @click="toRoot">
<n-tabs
type="card"
size="small"
:tabs-padding="15"
:value="tabStore.currentTab"
@close="handleClose"
>
<n-tab
v-for="item in tabStore.inherentTab"
:key="item.path"
:name="item.name"
@click="toRoot"
>
{{ item.title }}
</n-tab>
<n-tab
@ -12,7 +23,9 @@
@click="handleTab(item)"
@contextmenu="handleContextMenu($event, item)"
>
{{ item.meta.title }}
<div class="flex-x-center gap-2">
<e-icon :icon="item.meta.icon" /> {{ item.meta.title }}
</div>
</n-tab>
</n-tabs>
<n-dropdown
@ -29,24 +42,24 @@
</template>
<script setup lang="ts">
import { useTabStore, useAppStore } from '@/store';
import { useAppRouter } from '@/hooks';
import { RouteLocationNormalized } from 'vue-router';
import { ref, nextTick } from 'vue';
import { renderIcon } from '@/utils';
import { useTabStore, useAppStore } from '@/store';
import { useAppRouter } from '@/hooks';
import { RouteLocationNormalized } from 'vue-router';
import { ref, nextTick } from 'vue';
import { renderIcon } from '@/utils';
const tabStore = useTabStore();
const appStore = useAppStore();
const tabStore = useTabStore();
const appStore = useAppStore();
const { routerPush, toRoot } = useAppRouter();
const { routerPush, toRoot } = useAppRouter();
function handleTab(route: RouteLocationNormalized) {
function handleTab(route: RouteLocationNormalized) {
routerPush(route.path);
}
function handleClose(name: string) {
}
function handleClose(name: string) {
tabStore.closeTab(name);
}
const options = [
}
const options = [
{
label: '刷新',
key: 'reload',
@ -77,13 +90,13 @@ const options = [
key: 'closeAll',
icon: renderIcon('icon-park-outline:fullwidth'),
},
];
const showDropdown = ref(false);
const x = ref(0);
const y = ref(0);
const currentRoute = ref();
];
const showDropdown = ref(false);
const x = ref(0);
const y = ref(0);
const currentRoute = ref();
function handleSelect(key: string) {
function handleSelect(key: string) {
showDropdown.value = false;
type HandleFn = {
[key: string]: any;
@ -109,8 +122,8 @@ function handleSelect(key: string) {
},
};
handleFn[key]();
}
function handleContextMenu(e: MouseEvent, route: RouteLocationNormalized) {
}
function handleContextMenu(e: MouseEvent, route: RouteLocationNormalized) {
e.preventDefault();
currentRoute.value = route;
showDropdown.value = false;
@ -119,10 +132,10 @@ function handleContextMenu(e: MouseEvent, route: RouteLocationNormalized) {
x.value = e.clientX;
y.value = e.clientY;
});
}
function onClickoutside() {
}
function onClickoutside() {
showDropdown.value = false;
}
}
</script>
<style scoped></style>

19
src/router/guard/index.ts
View File

@ -1,11 +1,13 @@
import type { Router } from 'vue-router';
import { createPermissionGuard } from './permission';
import { useAppInfo } from '@/hooks';
import { useRouteStore, useTabStore } from '@/store';
const { title } = useAppInfo();
export function setupRouterGuard(router: Router) {
router.beforeEach(async (to, from) => {
router.beforeEach(async (to, from, next) => {
// 判断是否是外链，如果是直接打开网页并拦截跳转
if (to.meta.herf) {
window.open(to.meta.herf);
@ -14,9 +16,20 @@ export function setupRouterGuard(router: Router) {
// 开始 loadingBar
window.$loadingBar?.start();
// 权限操作
await createPermissionGuard(to, from);
await createPermissionGuard(to, from, next);
});
router.beforeResolve(async (to) => {
const routeStore = useRouteStore();
const tabStore = useTabStore();
// 设置菜单高亮
routeStore.setActiveMenu(to.meta.activeMenu ?? to.fullPath);
// 添加tabs
tabStore.addTab(to);
// 设置高亮标签;
tabStore.setCurrentTab(to.name as string);
})
router.afterEach((to) => {
// 修改网页标题
document.title = `${to.meta.title} - ${title}`;

52
src/router/guard/permission.ts
View File

@ -1,54 +1,50 @@
import { RouteLocationNormalized, NavigationGuardNext } from 'vue-router';
import { getToken } from '@/utils/auth';
import { useRouteStore, useTabStore } from '@/store';
import { useRouteStore } from '@/store';
export async function createPermissionGuard(
to: RouteLocationNormalized,
from: RouteLocationNormalized,
next: NavigationGuardNext
) {
console.log("🚀 ~ file: permission.ts:9 ~ to:", to)
const routeStore = useRouteStore();
const tabStore = useTabStore();
// 判断有无TOKEN,登录鉴权
const isLogin = Boolean(getToken());
if (!isLogin) {
const redirect = to.name === 'not-found' ? undefined : to.fullPath;
return { path: '/login', query: { redirect } };
if (to.name == 'login') {
next()
}
if (to.name !== 'login') {
const redirect = to.name === '404' ? undefined : to.fullPath;
next({ path: '/login', query: { redirect } });
}
return false
}
// 判断路由有无进行初始化
if (!routeStore.isInitAuthRoute) {
await routeStore.initAuthRoute();
}
// 动态路由加载完回到根路由
if (to.name === 'not-found' && to.redirectedFrom) {
if (to.name === '404' && to.redirectedFrom) {
// 等待权限路由加载好了，回到之前的路由,否则404
const path = to.redirectedFrom.fullPath;
return { path, replace: true, query: to.query, hash: to.hash };
const path = to.redirectedFrom?.fullPath;
next({ path, replace: true, query: to.query, hash: to.hash });
return false;
}
// 判断当前页是否在login,则定位去首页
if (to.name === 'login') {
return { path: '/appRoot' }
}
// 权限路由已经加载，仍然未找到，重定向到404
if (to.name === 'not-found') {
return { name: 'not-found', replace: true };
// if (to.name === '404') {
// next({ name: '404', replace: true });
// return false;
// }
// 判断当前页是否在login,则定位去首页
if (to.name === 'login') {
next({ path: '/appRoot' })
return false;
}
// 设置菜单高亮
if (to.meta.activeMenu) {
routeStore.setActiveMenu(to.meta.activeMenu);
} else {
routeStore.setActiveMenu(to.fullPath);
}
// 添加tabs
tabStore.addTab(to);
// 设置高亮标签;
tabStore.setCurrentTab(to.name as string);
next()
}

63
src/router/routes/index.ts
View File

@ -9,37 +9,6 @@ export const routes: RouteRecordRaw[] = [
redirect: '/appRoot',
component: BasicLayout,
children: [
{
path: '/not-found',
name: 'not-found',
component: () => import('@/views/error/not-found/index.vue'),
meta: {
title: '找不到页面',
icon: 'icon-park-outline:ghost',
},
},
{
path: '/not-permission',
name: 'not-permission',
component: () => import('@/views/error/not-permission/index.vue'),
meta: {
title: '用户无权限',
icon: 'icon-park-outline:error',
},
},
{
path: '/service-error',
name: 'service-error',
component: () => import('@/views/error/service-error/index.vue'),
meta: {
title: '服务器错误',
icon: 'icon-park-outline:close-wifi',
},
},
{
path: '/:pathMatch(.*)*',
redirect: '/not-found',
},
],
},
{
@ -50,4 +19,36 @@ export const routes: RouteRecordRaw[] = [
title: '登录',
},
},
{
path: '/403',
name: '403',
component: () => import('@/views/error/403/index.vue'),
meta: {
title: '用户无权限',
icon: 'icon-park-outline:error',
},
},
{
path: '/404',
name: '404',
component: () => import('@/views/error/404/index.vue'),
meta: {
title: '找不到页面',
icon: 'icon-park-outline:ghost',
},
},
{
path: '/500',
name: '500',
component: () => import('@/views/error/500/index.vue'),
meta: {
title: '服务器错误',
icon: 'icon-park-outline:close-wifi',
},
},
{
path: '/:pathMatch(.*)*',
redirect: '/404',
},
];

2
src/store/modules/route.ts
View File

@ -1,5 +1,5 @@
import { defineStore } from 'pinia';
import { renderIcon, getUserInfo ,isEmpty} from '@/utils';
import { renderIcon, getUserInfo} from '@/utils';
import { MenuOption } from 'naive-ui';
import { createDynamicRoutes } from '@/router/guard/dynamic';
import { router } from '@/router';

2
src/store/modules/tab.ts
View File

@ -23,7 +23,7 @@ export const useTabStore = defineStore('tab-store', {
},
],
tabs: [],
tabWhiteList: ['not-found', 'not-permission', 'service-error', 'login'],
tabWhiteList: ['404', '403', '500', 'login'],
currentTab: 'dashboard_workbench',
};
},

0
src/views/error/not-permission/index.vue → src/views/error/403/index.vue
View File

0
src/views/error/not-found/index.vue → src/views/error/404/index.vue
View File

0
src/views/error/service-error/index.vue → src/views/error/500/index.vue
View File