优化登录显示
This commit is contained in:
@@ -55,7 +55,16 @@ request.interceptors.response.use(
|
||||
break;
|
||||
case 401:
|
||||
console.error('未授权,请重新登录', data);
|
||||
// 可以在这里处理登录跳转
|
||||
// 清除本地存储的 token 和用户信息
|
||||
if (typeof window !== 'undefined') {
|
||||
localStorage.removeItem('accessToken');
|
||||
localStorage.removeItem('refreshToken');
|
||||
localStorage.removeItem('operatorId');
|
||||
localStorage.removeItem('operatorName');
|
||||
localStorage.removeItem('operatorUsername');
|
||||
// 跳转到首页并添加登录参数
|
||||
window.location.href = '/home?login=true';
|
||||
}
|
||||
break;
|
||||
case 403:
|
||||
console.error('拒绝访问', data);
|
||||
|
||||
@@ -89,6 +89,10 @@ export const HomeSection = () => {
|
||||
}, [currencyFormatter]);
|
||||
|
||||
useEffect(() => {
|
||||
const token = localStorage.getItem('accessToken');
|
||||
if (!token) {
|
||||
return;
|
||||
}
|
||||
getUserOwnedMenus({ app_id: APP_ID })
|
||||
.then((res) => {
|
||||
console.log('获取用户菜单权限返回内容:', res);
|
||||
@@ -275,6 +279,8 @@ export const HomeSection = () => {
|
||||
localStorage.setItem('operatorId', payload.userId);
|
||||
localStorage.setItem('operatorName', payload.userName || payload.username);
|
||||
localStorage.setItem('operatorUsername', payload.username);
|
||||
// 触发自定义事件,通知 MainLayout 更新状态
|
||||
window.dispatchEvent(new Event('localStorageChange'));
|
||||
setShowLoginModal(false);
|
||||
}}
|
||||
/>
|
||||
|
||||
@@ -64,6 +64,8 @@ export const MainLayout = () => {
|
||||
localStorage.setItem('operatorUsername', info.username || '');
|
||||
localStorage.setItem('accessToken', info.accessToken || '');
|
||||
localStorage.setItem('refreshToken', info.refreshToken || '');
|
||||
// 触发自定义事件,通知其他组件更新状态
|
||||
window.dispatchEvent(new Event('localStorageChange'));
|
||||
};
|
||||
|
||||
// 初始化时检查是否有已登录的操作员
|
||||
@@ -74,6 +76,52 @@ export const MainLayout = () => {
|
||||
}
|
||||
}, []);
|
||||
|
||||
// 监听 localStorage 变化,更新操作员名称
|
||||
useEffect(() => {
|
||||
const handleStorageChange = (e: StorageEvent) => {
|
||||
if (e.key === 'operatorName') {
|
||||
setOperatorName(e.newValue || '');
|
||||
}
|
||||
};
|
||||
|
||||
// 监听 storage 事件(跨标签页)
|
||||
window.addEventListener('storage', handleStorageChange);
|
||||
|
||||
// 监听自定义事件(同标签页内)
|
||||
const handleCustomStorageChange = () => {
|
||||
const savedName = localStorage.getItem('operatorName');
|
||||
if (savedName) {
|
||||
setOperatorName(savedName);
|
||||
}
|
||||
};
|
||||
window.addEventListener('localStorageChange', handleCustomStorageChange);
|
||||
|
||||
return () => {
|
||||
window.removeEventListener('storage', handleStorageChange);
|
||||
window.removeEventListener('localStorageChange', handleCustomStorageChange);
|
||||
};
|
||||
}, []);
|
||||
|
||||
// 当登录弹窗关闭时,重新读取操作员名称
|
||||
useEffect(() => {
|
||||
if (!loginModalOpen) {
|
||||
const savedName = localStorage.getItem('operatorName');
|
||||
if (savedName) {
|
||||
setOperatorName(savedName);
|
||||
}
|
||||
}
|
||||
}, [loginModalOpen]);
|
||||
|
||||
// 检查 URL 参数,如果包含 login=true,则打开登录弹窗
|
||||
useEffect(() => {
|
||||
const searchParams = new URLSearchParams(location.search);
|
||||
if (searchParams.get('login') === 'true') {
|
||||
setLoginModalOpen(true);
|
||||
// 清除 URL 参数,避免刷新后再次打开
|
||||
navigate(location.pathname, { replace: true });
|
||||
}
|
||||
}, [location.search, location.pathname, navigate]);
|
||||
|
||||
return (
|
||||
<div className='h-screen bg-gray-50 text-gray-900 grid grid-cols-[240px_1fr] overflow-hidden'>
|
||||
<Sidebar active={activeSection} onNavigate={handleNavigate} onQuickAction={setQuickAction} />
|
||||
|
||||
Reference in New Issue
Block a user