mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-08-26 16:46:19 +08:00
fix: fix missing page refresh parameters
This commit is contained in:
@@ -37,7 +37,7 @@
|
|||||||
.breadcrumb {
|
.breadcrumb {
|
||||||
height: @header-height;
|
height: @header-height;
|
||||||
padding-right: 20px;
|
padding-right: 20px;
|
||||||
font-size: 14px;
|
font-size: 12px;
|
||||||
line-height: @header-height;
|
line-height: @header-height;
|
||||||
// line-height: 1;
|
// line-height: 1;
|
||||||
|
|
||||||
|
@@ -74,7 +74,7 @@
|
|||||||
|
|
||||||
const getMergePropsRef = computed(
|
const getMergePropsRef = computed(
|
||||||
(): FormProps => {
|
(): FormProps => {
|
||||||
return deepMerge(props, unref(propsRef));
|
return deepMerge(cloneDeep(props), unref(propsRef));
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
// 获取表单基本配置
|
// 获取表单基本配置
|
||||||
|
@@ -118,7 +118,7 @@
|
|||||||
.ant-menu-submenu-open,
|
.ant-menu-submenu-open,
|
||||||
.ant-menu-item-selected,
|
.ant-menu-item-selected,
|
||||||
.ant-menu-submenu-selected {
|
.ant-menu-submenu-selected {
|
||||||
color: @white !important;
|
color: @primary-color !important;
|
||||||
border-bottom: 3px solid @primary-color;
|
border-bottom: 3px solid @primary-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -127,7 +127,7 @@
|
|||||||
.ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
|
.ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
|
||||||
.ant-menu-submenu-active,
|
.ant-menu-submenu-active,
|
||||||
.ant-menu-submenu-title:hover {
|
.ant-menu-submenu-title:hover {
|
||||||
color: @white !important;
|
color: @primary-color !important;
|
||||||
border-bottom: 3px solid @primary-color;
|
border-bottom: 3px solid @primary-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -6,7 +6,7 @@
|
|||||||
@multiple-height: 36px;
|
@multiple-height: 36px;
|
||||||
|
|
||||||
// headers
|
// headers
|
||||||
@header-height: 42px;
|
@header-height: 36px;
|
||||||
|
|
||||||
// logo width
|
// logo width
|
||||||
@logo-width: 40px;
|
@logo-width: 40px;
|
||||||
|
@@ -90,15 +90,25 @@ export function useTabs() {
|
|||||||
closeOther: () => canIUseFn() && closeOther(tabStore.getCurrentTab),
|
closeOther: () => canIUseFn() && closeOther(tabStore.getCurrentTab),
|
||||||
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 | string,
|
||||||
|
goTo = false,
|
||||||
|
opt?: { replace?: boolean; query?: any; params?: any }
|
||||||
|
) => {
|
||||||
const to = getTo(path);
|
const to = getTo(path);
|
||||||
|
|
||||||
if (!to) return;
|
if (!to) return;
|
||||||
useTimeout(() => {
|
useTimeout(() => {
|
||||||
tabStore.addTabByPathAction();
|
tabStore.addTabByPathAction();
|
||||||
}, 0);
|
}, 0);
|
||||||
|
const { replace, query = {}, params = {} } = opt || {};
|
||||||
activeKeyRef.value = path;
|
activeKeyRef.value = path;
|
||||||
goTo && replace ? router.replace : router.push(path);
|
const data = {
|
||||||
|
path,
|
||||||
|
query,
|
||||||
|
params,
|
||||||
|
};
|
||||||
|
goTo && replace ? router.replace(data) : router.push(data);
|
||||||
},
|
},
|
||||||
activeKeyRef,
|
activeKeyRef,
|
||||||
};
|
};
|
||||||
|
@@ -20,7 +20,6 @@ import { GITHUB_URL } from '/@/settings/siteSetting';
|
|||||||
import LockAction from './actions/LockActionItem';
|
import LockAction from './actions/LockActionItem';
|
||||||
import { useModal } from '/@/components/Modal/index';
|
import { useModal } from '/@/components/Modal/index';
|
||||||
import { errorStore } from '/@/store/modules/error';
|
import { errorStore } from '/@/store/modules/error';
|
||||||
import { useGo } from '/@/hooks/web/usePage';
|
|
||||||
import { useWindowSizeFn } from '/@/hooks/event/useWindowSize';
|
import { useWindowSizeFn } from '/@/hooks/event/useWindowSize';
|
||||||
import NoticeAction from './actions/notice/NoticeActionItem.vue';
|
import NoticeAction from './actions/notice/NoticeActionItem.vue';
|
||||||
|
|
||||||
@@ -28,11 +27,10 @@ export default defineComponent({
|
|||||||
name: 'DefaultLayoutHeader',
|
name: 'DefaultLayoutHeader',
|
||||||
setup() {
|
setup() {
|
||||||
const widthRef = ref(200);
|
const widthRef = ref(200);
|
||||||
const { refreshPage } = useTabs();
|
const { refreshPage, addTab } = useTabs();
|
||||||
const [register, { openModal }] = useModal();
|
const [register, { openModal }] = useModal();
|
||||||
const { toggleFullscreen, isFullscreenRef } = useFullscreen();
|
const { toggleFullscreen, isFullscreenRef } = useFullscreen();
|
||||||
|
|
||||||
const go = useGo();
|
|
||||||
const getProjectConfigRef = computed(() => {
|
const getProjectConfigRef = computed(() => {
|
||||||
return appStore.getProjectConfig;
|
return appStore.getProjectConfig;
|
||||||
});
|
});
|
||||||
@@ -72,7 +70,7 @@ export default defineComponent({
|
|||||||
|
|
||||||
function handleToErrorList() {
|
function handleToErrorList() {
|
||||||
errorStore.commitErrorListCountState(0);
|
errorStore.commitErrorListCountState(0);
|
||||||
go('/exception/error-log');
|
addTab('/exception/error-log', true);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -175,12 +173,8 @@ export default defineComponent({
|
|||||||
<div>
|
<div>
|
||||||
<Tooltip>
|
<Tooltip>
|
||||||
{{
|
{{
|
||||||
title: () => '消息中心',
|
title: () => '消息通知',
|
||||||
default: () => (
|
default: () => <NoticeAction />,
|
||||||
<div class={`layout-header__action-item`}>
|
|
||||||
<NoticeAction />
|
|
||||||
</div>
|
|
||||||
),
|
|
||||||
}}
|
}}
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</div>
|
</div>
|
||||||
|
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="layout-header__action-item notify-action">
|
||||||
<Popover title="" trigger="click">
|
<Popover title="" trigger="click">
|
||||||
<Badge :count="count" :numberStyle="numberStyle">
|
<Badge :count="count" :numberStyle="numberStyle">
|
||||||
<BellOutlined class="layout-header__action-icon" />
|
<BellOutlined class="layout-header__action-icon" />
|
||||||
@@ -43,22 +43,25 @@
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less">
|
||||||
/deep/ .ant-tabs-tab {
|
.notify-action {
|
||||||
padding-top: 8px;
|
padding-top: 2px;
|
||||||
margin-right: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/deep/ .ant-tabs-content {
|
.ant-tabs-content {
|
||||||
width: 300px;
|
width: 300px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/deep/ .ant-badge {
|
.ant-badge {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
|
|
||||||
.ant-badge-multiple-words {
|
.ant-badge-multiple-words {
|
||||||
padding: 0 4px;
|
padding: 0 4px;
|
||||||
transform: translate(26%, -48%);
|
transform: translate(26%, -40%);
|
||||||
|
}
|
||||||
|
|
||||||
|
svg {
|
||||||
|
width: 0.9em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@@ -194,6 +194,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ant-layout-header {
|
||||||
|
height: @header-height;
|
||||||
|
line-height: @header-height;
|
||||||
|
}
|
||||||
|
|
||||||
.layout-header {
|
.layout-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
height: @header-height;
|
height: @header-height;
|
||||||
@@ -336,12 +341,12 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
height: @header-height;
|
height: @header-height;
|
||||||
font-size: 1.3em;
|
font-size: 1.1em;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-icon {
|
&-icon {
|
||||||
padding: 0 12px;
|
padding: 0 8px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -362,13 +367,14 @@
|
|||||||
.user-dropdown {
|
.user-dropdown {
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
font-size: 12px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
width: 32px;
|
width: 26px;
|
||||||
height: 32px;
|
height: 26px;
|
||||||
margin-right: 24px;
|
margin-right: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__header {
|
&__header {
|
||||||
@@ -404,7 +410,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&__name {
|
&__name {
|
||||||
font-size: 14px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__desc {
|
&__desc {
|
||||||
|
@@ -7,6 +7,19 @@
|
|||||||
height: @multiple-height;
|
height: @multiple-height;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// .ant-tabs:not(.ant-tabs-card) {
|
||||||
|
// .ant-tabs-nav-container {
|
||||||
|
// height: @multiple-height;
|
||||||
|
// background: @white;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .ant-tabs-tab {
|
||||||
|
// font-size: 14px;
|
||||||
|
// line-height: 1.5515;
|
||||||
|
// background: @white;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
.ant-tabs.ant-tabs-card {
|
.ant-tabs.ant-tabs-card {
|
||||||
.ant-tabs-card-bar {
|
.ant-tabs-card-bar {
|
||||||
height: @multiple-height;
|
height: @multiple-height;
|
||||||
@@ -114,6 +127,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ant-tabs-extra-content {
|
||||||
|
line-height: @multiple-height;
|
||||||
|
}
|
||||||
|
|
||||||
.multiple-tabs-content {
|
.multiple-tabs-content {
|
||||||
&__extra {
|
&__extra {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
@@ -35,7 +35,11 @@ export default defineComponent({
|
|||||||
const { currentRoute } = useRouter();
|
const { currentRoute } = useRouter();
|
||||||
const { addTab, activeKeyRef } = useTabs();
|
const { addTab, activeKeyRef } = useTabs();
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
addTab(unref(currentRoute).path as PageEnum);
|
const route = unref(currentRoute);
|
||||||
|
addTab(unref(currentRoute).path as PageEnum, false, {
|
||||||
|
query: route.query,
|
||||||
|
params: route.params,
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// 当前激活tab
|
// 当前激活tab
|
||||||
@@ -60,6 +64,14 @@ export default defineComponent({
|
|||||||
// 监听路由的话虽然可以,但是路由切换的时间会造成卡顿现象?
|
// 监听路由的话虽然可以,但是路由切换的时间会造成卡顿现象?
|
||||||
// 使用useTab的addTab的话,当用户手动调转,需要自行调用addTab
|
// 使用useTab的addTab的话,当用户手动调转,需要自行调用addTab
|
||||||
// tabStore.commitAddTab((unref(currentRoute) as unknown) as AppRouteRecordRaw);
|
// tabStore.commitAddTab((unref(currentRoute) as unknown) as AppRouteRecordRaw);
|
||||||
|
// const { affix } = currentRoute.value.meta || {};
|
||||||
|
// if (affix) return;
|
||||||
|
// const hasInTab = tabStore.getTabsState.some(
|
||||||
|
// (item) => item.fullPath === currentRoute.value.fullPath
|
||||||
|
// );
|
||||||
|
// if (!hasInTab) {
|
||||||
|
// tabStore.commitAddTab((unref(currentRoute) as unknown) as AppRouteRecordRaw);
|
||||||
|
// }
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
immediate: true,
|
immediate: true,
|
||||||
|
@@ -96,7 +96,7 @@ const setting: ProjectConfig = {
|
|||||||
showBreadCrumb: true,
|
showBreadCrumb: true,
|
||||||
|
|
||||||
// 使用error-handler-plugin
|
// 使用error-handler-plugin
|
||||||
useErrorHandle: isProdMode(),
|
useErrorHandle: true,
|
||||||
|
|
||||||
// 开启页面切换动画
|
// 开启页面切换动画
|
||||||
openRouterTransition: true,
|
openRouterTransition: true,
|
||||||
|
Reference in New Issue
Block a user