feat: 优化导航链接的点击处理和类型定义

This commit is contained in:
2026-02-26 01:49:36 +08:00
parent 60a7328889
commit 9e8c658159
2 changed files with 28 additions and 23 deletions

View File

@@ -51,18 +51,27 @@ export const BaseHeader = (props: { main?: React.ComponentType | null }) => {
return ( return (
<> <>
<div className="flex gap-2 text-lg w-full h-12 items-center justify-between bg-gray-200"> <div className="flex gap-2 text-lg w-full h-12 items-center justify-between bg-gray-200">
<div className='px-2'> <div className='px-2 flex items-center gap-1'>
{ {
store.links.map(link => ( store.links.map(link => (
<Link <div key={link.key || link.title}
key={link.key || link.title} className="cursor-pointer flex items-center justify-center gap-1 p-2 text-sm text-gray-600 hover:text-gray-900 hover:bg-gray-100 rounded-lg transition-colors"
to={link.href} onClick={() => {
className="px-3 py-1.5 text-sm text-gray-600 hover:text-gray-900 hover:bg-gray-100 rounded-lg transition-colors" if (!link.href) return;
if (link.href.startsWith('http') || link.isRoot) {
window.open(link.href, '_blank');
return;
}
navigate({
to: link.href
})
}}
> >
{link.key === 'home' && <Home className="w-4 h-4 mr-1" />} {link.key === 'home' && <Home className="w-4 h-4" />}
{link.icon && <span className="mr-1">{link.icon}</span>} {link.icon && <>{link.icon}</>}
{link.title} {!link.icon && link.title}
</Link> </div>
)) ))
} }
</div> </div>

View File

@@ -34,13 +34,15 @@ export type LayoutStore = {
}; };
setLoginPageConfig: (config: Partial<LayoutStore['loginPageConfig']>) => void; setLoginPageConfig: (config: Partial<LayoutStore['loginPageConfig']>) => void;
links: HeaderLink[]; links: HeaderLink[];
setLinks: (links: HeaderLink[]) => void;
}; };
type HeaderLink = { type HeaderLink = {
title: string; title?: string;
href: string; href: string;
description?: string; description?: string;
icon?: React.ReactNode; icon?: React.ReactNode;
key?: string; key?: string;
isRoot?: boolean;
}; };
export const useLayoutStore = create<LayoutStore>((set, get) => ({ export const useLayoutStore = create<LayoutStore>((set, get) => ({
@@ -78,19 +80,12 @@ export const useLayoutStore = create<LayoutStore>((set, get) => ({
const token = await queryLogin.getToken(); const token = await queryLogin.getToken();
if (token) { if (token) {
set({ me: {} }) set({ me: {} })
let me: UserInfo | undefined = undefined; const me = await queryLogin.getMe();
// const user = await queryLogin.checkLocalUser() as UserInfo;
const _user = await queryLogin.checkLocalUser() as UserInfo; const user = me.code === 200 ? me.data : undefined;
if (_user) { if (user) {
me = _user; set({ me: user });
} set({ isAdmin: user.orgs?.includes?.('admin') || false });
if (!me) {
const res = await queryLogin.getMe();
me = res.code === 200 ? res.data : undefined;
}
if (me) {
set({ me: me });
set({ isAdmin: me.orgs?.includes?.('admin') || false });
} else { } else {
set({ me: undefined, isAdmin: false }); set({ me: undefined, isAdmin: false });
} }
@@ -107,4 +102,5 @@ export const useLayoutStore = create<LayoutStore>((set, get) => ({
loginPageConfig: { ...state.loginPageConfig, ...config }, loginPageConfig: { ...state.loginPageConfig, ...config },
})), })),
links: [{ title: '', href: '/', key: 'home' }], links: [{ title: '', href: '/', key: 'home' }],
setLinks: (links) => set({ links }),
})); }));