mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-08-25 16:16:20 +08:00
fix: fix missing cache of refresh page
This commit is contained in:
@@ -1,3 +1,4 @@
|
||||
import type { AppRouteRecordRaw } from '/@/router/types.d';
|
||||
import { useTimeout } from '/@/hooks/core/useTimeout';
|
||||
import { PageEnum } from '/@/enums/pageEnum';
|
||||
import { TabItem, tabStore } from '/@/store/modules/tab';
|
||||
@@ -64,6 +65,18 @@ export function useTabs() {
|
||||
}
|
||||
return !!show;
|
||||
}
|
||||
function getTo(path: string): any {
|
||||
const routes = router.getRoutes();
|
||||
const fn = (p: string): any => {
|
||||
const to = routes.find((item) => item.path === p);
|
||||
if (!to) return '';
|
||||
if (!to.redirect) return to;
|
||||
if (to.redirect) {
|
||||
return getTo(to.redirect as string);
|
||||
}
|
||||
};
|
||||
return fn(path);
|
||||
}
|
||||
return {
|
||||
initTabFn,
|
||||
refreshPage: () => canIUseFn() && refreshPage(tabStore.getCurrentTab),
|
||||
@@ -74,11 +87,13 @@ export function useTabs() {
|
||||
closeCurrent: () => canIUseFn() && closeCurrent(tabStore.getCurrentTab),
|
||||
resetCache: () => canIUseFn() && resetCache(),
|
||||
addTab: (path: PageEnum, goTo = false, replace = false) => {
|
||||
const to = getTo(path);
|
||||
if (!to) return;
|
||||
useTimeout(() => {
|
||||
tabStore.addTabByPathAction(path);
|
||||
tabStore.addTabByPathAction((to as unknown) as AppRouteRecordRaw);
|
||||
}, 0);
|
||||
activeKeyRef.value = path;
|
||||
goTo && replace ? router.replace : router.push(path);
|
||||
activeKeyRef.value = to.path;
|
||||
goTo && replace ? router.replace : router.push(to.path);
|
||||
},
|
||||
activeKeyRef,
|
||||
};
|
||||
|
@@ -1,11 +1,11 @@
|
||||
@import (reference) '../../design/index.less';
|
||||
|
||||
.default-layout {
|
||||
.ant-menu-submenu .ant-menu-sub {
|
||||
transition: none !important;
|
||||
// transition: background 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s,
|
||||
// padding 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s !important;
|
||||
}
|
||||
// .ant-menu-submenu .ant-menu-sub {
|
||||
// transition: none !important;
|
||||
// // transition: background 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s,
|
||||
// // padding 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s !important;
|
||||
// }
|
||||
|
||||
&__content {
|
||||
position: relative;
|
||||
@@ -102,10 +102,12 @@
|
||||
.setting-button {
|
||||
top: 45%;
|
||||
right: 0;
|
||||
border-radius: 10px 0 0 10px;
|
||||
padding: 14px;
|
||||
border-radius: 6px 0 0 6px;
|
||||
|
||||
.svg {
|
||||
width: 2em;
|
||||
svg {
|
||||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -10,7 +10,8 @@ import { PermissionModeEnum } from '/@/enums/appEnum';
|
||||
// ===========================
|
||||
// ==========module import====
|
||||
// ===========================
|
||||
import dashboardDemo from './modules/demo/dashboard';
|
||||
import dashboard from './modules/dashboard';
|
||||
|
||||
import exceptionDemo from './modules/demo/exception';
|
||||
import iframeDemo from './modules/demo/iframe';
|
||||
import compDemo from './modules/demo/comp';
|
||||
@@ -22,7 +23,7 @@ import formDemo from './modules/demo/form';
|
||||
import treeDemo from './modules/demo/tree';
|
||||
|
||||
const menuModules = [
|
||||
dashboardDemo,
|
||||
dashboard,
|
||||
featDemo,
|
||||
exceptionDemo,
|
||||
iframeDemo,
|
||||
|
@@ -5,6 +5,10 @@ const menu: MenuModule = {
|
||||
name: '图表',
|
||||
path: '/charts',
|
||||
children: [
|
||||
{
|
||||
path: '/apexChart',
|
||||
name: 'ApexChart',
|
||||
},
|
||||
{
|
||||
path: '/echarts',
|
||||
name: 'Echarts',
|
||||
@@ -23,10 +27,6 @@ const menu: MenuModule = {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/apexChart',
|
||||
name: 'ApexChart',
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
|
@@ -4,9 +4,11 @@ import { DEFAULT_LAYOUT_COMPONENT, PAGE_NOT_FOUND_ROUTE, REDIRECT_ROUTE } from '
|
||||
import { genRouteModule } from '/@/utils/helper/routeHelper';
|
||||
|
||||
import LoginRoute from './modules/sys';
|
||||
|
||||
import dashboard from './modules/dashboard';
|
||||
|
||||
// demo
|
||||
import exceptionDemo from './modules/demo/exception';
|
||||
import dashboardDemo from './modules/demo/dashboard';
|
||||
import iframeDemo from './modules/demo/iframe';
|
||||
import compDemo from './modules/demo/comp';
|
||||
import permissionDemo from './modules/demo/permission';
|
||||
@@ -18,7 +20,7 @@ import treeDemo from './modules/demo/tree';
|
||||
|
||||
const routeModuleList: AppRouteModule[] = [
|
||||
exceptionDemo,
|
||||
dashboardDemo,
|
||||
dashboard,
|
||||
iframeDemo,
|
||||
compDemo,
|
||||
featDemo,
|
||||
|
@@ -7,7 +7,7 @@ export default {
|
||||
path: '/charts',
|
||||
name: 'Charts',
|
||||
component: PAGE_LAYOUT_COMPONENT,
|
||||
redirect: '/charts/welcome',
|
||||
redirect: '/charts/apexChart',
|
||||
meta: {
|
||||
icon: 'ant-design:area-chart-outlined',
|
||||
title: '图表库',
|
||||
|
@@ -7,7 +7,7 @@ export default {
|
||||
path: '/feat',
|
||||
name: 'FeatDemo',
|
||||
component: PAGE_LAYOUT_COMPONENT,
|
||||
redirect: '/feat/tabs',
|
||||
redirect: '/feat/icon',
|
||||
meta: {
|
||||
icon: 'ic:outline-featured-play-list',
|
||||
title: 'Feat',
|
||||
@@ -15,14 +15,6 @@ export default {
|
||||
},
|
||||
|
||||
routes: [
|
||||
{
|
||||
path: '/tabs',
|
||||
name: 'TabsDemo',
|
||||
component: () => import('/@/views/demo/feat/tabs/index.vue'),
|
||||
meta: {
|
||||
title: '标签页操作',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/icon',
|
||||
name: 'IconDemo',
|
||||
@@ -31,6 +23,15 @@ export default {
|
||||
title: '图标',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/tabs',
|
||||
name: 'TabsDemo',
|
||||
component: () => import('/@/views/demo/feat/tabs/index.vue'),
|
||||
meta: {
|
||||
title: '标签页操作',
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
path: '/context-menu',
|
||||
name: 'ContextMenuDemo',
|
||||
|
@@ -61,7 +61,7 @@ const setting: ProjectConfig = {
|
||||
// 分割菜单
|
||||
split: false,
|
||||
// 顶部菜单布局
|
||||
topMenuAlign: 'center',
|
||||
topMenuAlign: 'start',
|
||||
},
|
||||
// 消息配置
|
||||
messageSetting: {
|
||||
|
@@ -181,10 +181,7 @@ class Tab extends VuexModule {
|
||||
}
|
||||
|
||||
@Action
|
||||
addTabByPathAction(path: string): void {
|
||||
if (!path) return;
|
||||
const routes = router.getRoutes();
|
||||
const to = routes.find((item) => item.path === path);
|
||||
addTabByPathAction(to: AppRouteRecordRaw): void {
|
||||
to && this.commitAddTab((to as unknown) as AppRouteRecordRaw);
|
||||
}
|
||||
|
||||
|
@@ -1,13 +1,9 @@
|
||||
import { isDevMode, getEnv } from '/@/utils/env';
|
||||
import { getEnv } from '/@/utils/env';
|
||||
import { useSetting } from '/@/hooks/core/useSetting';
|
||||
import moment from 'moment';
|
||||
import pkg from '../../../package.json';
|
||||
const { globSetting } = useSetting();
|
||||
|
||||
// Generate cache key according to version
|
||||
export const getStorageShortName = () => {
|
||||
const shortTime = moment().format('MMDDHHmmss');
|
||||
return `${globSetting.shortName}__${getEnv()}${
|
||||
`__${pkg.version}` + (isDevMode() ? '' : `__${shortTime}`)
|
||||
}__`.toUpperCase();
|
||||
return `${globSetting.shortName}__${getEnv()}${`__${pkg.version}`}__`.toUpperCase();
|
||||
};
|
||||
|
Reference in New Issue
Block a user