提交 02d6a394 作者: nebv

fix: fix missing cache of refresh page

上级 bbfb06f0
import type { AppRouteRecordRaw } from '/@/router/types.d';
import { useTimeout } from '/@/hooks/core/useTimeout'; import { useTimeout } from '/@/hooks/core/useTimeout';
import { PageEnum } from '/@/enums/pageEnum'; import { PageEnum } from '/@/enums/pageEnum';
import { TabItem, tabStore } from '/@/store/modules/tab'; import { TabItem, tabStore } from '/@/store/modules/tab';
...@@ -64,6 +65,18 @@ export function useTabs() { ...@@ -64,6 +65,18 @@ export function useTabs() {
} }
return !!show; 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 { return {
initTabFn, initTabFn,
refreshPage: () => canIUseFn() && refreshPage(tabStore.getCurrentTab), refreshPage: () => canIUseFn() && refreshPage(tabStore.getCurrentTab),
...@@ -74,11 +87,13 @@ export function useTabs() { ...@@ -74,11 +87,13 @@ export function useTabs() {
closeCurrent: () => canIUseFn() && closeCurrent(tabStore.getCurrentTab), closeCurrent: () => canIUseFn() && closeCurrent(tabStore.getCurrentTab),
resetCache: () => canIUseFn() && resetCache(), resetCache: () => canIUseFn() && resetCache(),
addTab: (path: PageEnum, goTo = false, replace = false) => { addTab: (path: PageEnum, goTo = false, replace = false) => {
const to = getTo(path);
if (!to) return;
useTimeout(() => { useTimeout(() => {
tabStore.addTabByPathAction(path); tabStore.addTabByPathAction((to as unknown) as AppRouteRecordRaw);
}, 0); }, 0);
activeKeyRef.value = path; activeKeyRef.value = to.path;
goTo && replace ? router.replace : router.push(path); goTo && replace ? router.replace : router.push(to.path);
}, },
activeKeyRef, activeKeyRef,
}; };
......
@import (reference) '../../design/index.less'; @import (reference) '../../design/index.less';
.default-layout { .default-layout {
.ant-menu-submenu .ant-menu-sub { // .ant-menu-submenu .ant-menu-sub {
transition: none !important; // transition: none !important;
// transition: background 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s, // // 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; // // padding 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s !important;
} // }
&__content { &__content {
position: relative; position: relative;
...@@ -102,10 +102,12 @@ ...@@ -102,10 +102,12 @@
.setting-button { .setting-button {
top: 45%; top: 45%;
right: 0; right: 0;
border-radius: 10px 0 0 10px; padding: 14px;
border-radius: 6px 0 0 6px;
.svg { svg {
width: 2em; width: 1.2em;
height: 1.2em;
} }
} }
......
...@@ -10,7 +10,8 @@ import { PermissionModeEnum } from '/@/enums/appEnum'; ...@@ -10,7 +10,8 @@ import { PermissionModeEnum } from '/@/enums/appEnum';
// =========================== // ===========================
// ==========module import==== // ==========module import====
// =========================== // ===========================
import dashboardDemo from './modules/demo/dashboard'; import dashboard from './modules/dashboard';
import exceptionDemo from './modules/demo/exception'; import exceptionDemo from './modules/demo/exception';
import iframeDemo from './modules/demo/iframe'; import iframeDemo from './modules/demo/iframe';
import compDemo from './modules/demo/comp'; import compDemo from './modules/demo/comp';
...@@ -22,7 +23,7 @@ import formDemo from './modules/demo/form'; ...@@ -22,7 +23,7 @@ import formDemo from './modules/demo/form';
import treeDemo from './modules/demo/tree'; import treeDemo from './modules/demo/tree';
const menuModules = [ const menuModules = [
dashboardDemo, dashboard,
featDemo, featDemo,
exceptionDemo, exceptionDemo,
iframeDemo, iframeDemo,
......
...@@ -6,6 +6,10 @@ const menu: MenuModule = { ...@@ -6,6 +6,10 @@ const menu: MenuModule = {
path: '/charts', path: '/charts',
children: [ children: [
{ {
path: '/apexChart',
name: 'ApexChart',
},
{
path: '/echarts', path: '/echarts',
name: 'Echarts', name: 'Echarts',
children: [ children: [
...@@ -23,10 +27,6 @@ const menu: MenuModule = { ...@@ -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 ' ...@@ -4,9 +4,11 @@ import { DEFAULT_LAYOUT_COMPONENT, PAGE_NOT_FOUND_ROUTE, REDIRECT_ROUTE } from '
import { genRouteModule } from '/@/utils/helper/routeHelper'; import { genRouteModule } from '/@/utils/helper/routeHelper';
import LoginRoute from './modules/sys'; import LoginRoute from './modules/sys';
import dashboard from './modules/dashboard';
// demo // demo
import exceptionDemo from './modules/demo/exception'; import exceptionDemo from './modules/demo/exception';
import dashboardDemo from './modules/demo/dashboard';
import iframeDemo from './modules/demo/iframe'; import iframeDemo from './modules/demo/iframe';
import compDemo from './modules/demo/comp'; import compDemo from './modules/demo/comp';
import permissionDemo from './modules/demo/permission'; import permissionDemo from './modules/demo/permission';
...@@ -18,7 +20,7 @@ import treeDemo from './modules/demo/tree'; ...@@ -18,7 +20,7 @@ import treeDemo from './modules/demo/tree';
const routeModuleList: AppRouteModule[] = [ const routeModuleList: AppRouteModule[] = [
exceptionDemo, exceptionDemo,
dashboardDemo, dashboard,
iframeDemo, iframeDemo,
compDemo, compDemo,
featDemo, featDemo,
......
...@@ -7,7 +7,7 @@ export default { ...@@ -7,7 +7,7 @@ export default {
path: '/charts', path: '/charts',
name: 'Charts', name: 'Charts',
component: PAGE_LAYOUT_COMPONENT, component: PAGE_LAYOUT_COMPONENT,
redirect: '/charts/welcome', redirect: '/charts/apexChart',
meta: { meta: {
icon: 'ant-design:area-chart-outlined', icon: 'ant-design:area-chart-outlined',
title: '图表库', title: '图表库',
......
...@@ -7,7 +7,7 @@ export default { ...@@ -7,7 +7,7 @@ export default {
path: '/feat', path: '/feat',
name: 'FeatDemo', name: 'FeatDemo',
component: PAGE_LAYOUT_COMPONENT, component: PAGE_LAYOUT_COMPONENT,
redirect: '/feat/tabs', redirect: '/feat/icon',
meta: { meta: {
icon: 'ic:outline-featured-play-list', icon: 'ic:outline-featured-play-list',
title: 'Feat', title: 'Feat',
...@@ -16,14 +16,6 @@ export default { ...@@ -16,14 +16,6 @@ export default {
routes: [ routes: [
{ {
path: '/tabs',
name: 'TabsDemo',
component: () => import('/@/views/demo/feat/tabs/index.vue'),
meta: {
title: '标签页操作',
},
},
{
path: '/icon', path: '/icon',
name: 'IconDemo', name: 'IconDemo',
component: () => import('/@/views/demo/comp/icon/index.vue'), component: () => import('/@/views/demo/comp/icon/index.vue'),
...@@ -32,6 +24,15 @@ export default { ...@@ -32,6 +24,15 @@ export default {
}, },
}, },
{ {
path: '/tabs',
name: 'TabsDemo',
component: () => import('/@/views/demo/feat/tabs/index.vue'),
meta: {
title: '标签页操作',
},
},
{
path: '/context-menu', path: '/context-menu',
name: 'ContextMenuDemo', name: 'ContextMenuDemo',
component: () => import('/@/views/demo/feat/context-menu/index.vue'), component: () => import('/@/views/demo/feat/context-menu/index.vue'),
......
...@@ -61,7 +61,7 @@ const setting: ProjectConfig = { ...@@ -61,7 +61,7 @@ const setting: ProjectConfig = {
// 分割菜单 // 分割菜单
split: false, split: false,
// 顶部菜单布局 // 顶部菜单布局
topMenuAlign: 'center', topMenuAlign: 'start',
}, },
// 消息配置 // 消息配置
messageSetting: { messageSetting: {
......
...@@ -181,10 +181,7 @@ class Tab extends VuexModule { ...@@ -181,10 +181,7 @@ class Tab extends VuexModule {
} }
@Action @Action
addTabByPathAction(path: string): void { addTabByPathAction(to: AppRouteRecordRaw): void {
if (!path) return;
const routes = router.getRoutes();
const to = routes.find((item) => item.path === path);
to && this.commitAddTab((to as unknown) as AppRouteRecordRaw); to && this.commitAddTab((to as unknown) as AppRouteRecordRaw);
} }
......
import { isDevMode, getEnv } from '/@/utils/env'; import { getEnv } from '/@/utils/env';
import { useSetting } from '/@/hooks/core/useSetting'; import { useSetting } from '/@/hooks/core/useSetting';
import moment from 'moment';
import pkg from '../../../package.json'; import pkg from '../../../package.json';
const { globSetting } = useSetting(); const { globSetting } = useSetting();
// Generate cache key according to version // Generate cache key according to version
export const getStorageShortName = () => { export const getStorageShortName = () => {
const shortTime = moment().format('MMDDHHmmss'); return `${globSetting.shortName}__${getEnv()}${`__${pkg.version}`}__`.toUpperCase();
return `${globSetting.shortName}__${getEnv()}${
`__${pkg.version}` + (isDevMode() ? '' : `__${shortTime}`)
}__`.toUpperCase();
}; };
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论