@@ -32,6 +32,10 @@ const Header = () => { | |||||
const logout = async () => { | const logout = async () => { | ||||
const [error] = await runAsync(); | const [error] = await runAsync(); | ||||
if (error) return; | if (error) return; | ||||
useGlobalStore.setState({ | |||||
token: '', | |||||
refreshToken: '' | |||||
}); | |||||
} | } | ||||
return ( | return ( | ||||
@@ -15,7 +15,7 @@ import Result404 from './404'; | |||||
import './index.css' | import './index.css' | ||||
import TabsLayout from './tabs-layout'; | import TabsLayout from './tabs-layout'; | ||||
import Content from './content'; | import Content from './content'; | ||||
import homeService from '@/request/service/home'; | |||||
import userService from '@/request/service/user'; | |||||
import { useRequest } from "@/hooks/use-request"; | import { useRequest } from "@/hooks/use-request"; | ||||
import menuData from '../../mock/menu.json' | import menuData from '../../mock/menu.json' | ||||
@@ -23,14 +23,19 @@ const BasicLayout: React.FC = () => { | |||||
const [loading, setLoading] = useState(true); | const [loading, setLoading] = useState(true); | ||||
const { lang } = useGlobalStore(); | |||||
const { currentUser } = useUserStore(); | |||||
const { refreshToken, lang, token } = useGlobalStore(); | |||||
const { currentUser, setCurrentUser } = useUserStore(); | |||||
const { setMenus } = useMenusStore(); | const { setMenus } = useMenusStore(); | ||||
const navigate = useNavigate(); | const navigate = useNavigate(); | ||||
const location = useLocation(); | const location = useLocation(); | ||||
// const { setLatestMessage } = useMessageStore(); | |||||
const { runAsync: getAnnouncement } = useRequest(homeService.getAnnouncement, { manual: true }); | |||||
const { | |||||
data: currentUserProfile, | |||||
run: getCurrentUserProfile, | |||||
} = useRequest( | |||||
userService.getProfile, | |||||
{ manual: true } | |||||
); | |||||
const formatMenus = ( | const formatMenus = ( | ||||
menus: Menu[], | menus: Menu[], | ||||
@@ -59,6 +64,15 @@ const BasicLayout: React.FC = () => { | |||||
} | } | ||||
useEffect(() => { | useEffect(() => { | ||||
if (!refreshToken) { | |||||
navigate('/login'); | |||||
return; | |||||
} | |||||
getCurrentUserProfile(); | |||||
}, [refreshToken, getCurrentUserProfile, navigate]); | |||||
useEffect(() => { | |||||
if (!currentUserProfile) return; | |||||
const menus:Array<Menu> = menuData as Array<Menu> ; | const menus:Array<Menu> = menuData as Array<Menu> ; | ||||
console.log(menus); | console.log(menus); | ||||
@@ -112,12 +126,12 @@ const BasicLayout: React.FC = () => { | |||||
}, | }, | ||||
} | } | ||||
]); | ]); | ||||
setCurrentUser(currentUserProfile!!.data); | |||||
setLoading(false); | setLoading(false); | ||||
// replace一下当前路由,为了触发路由匹配 | // replace一下当前路由,为了触发路由匹配 | ||||
router.navigate(`${location.pathname}${location.search}`, { replace: true }); | router.navigate(`${location.pathname}${location.search}`, { replace: true }); | ||||
}, [ currentUser ]); | |||||
}, [ currentUserProfile, setCurrentUser ]); | |||||
useEffect(() => { | useEffect(() => { | ||||
function storageChange(e: StorageEvent) { | function storageChange(e: StorageEvent) { | ||||
if (e.key === useGlobalStore.persist.getOptions().name) { | if (e.key === useGlobalStore.persist.getOptions().name) { | ||||
@@ -132,7 +146,7 @@ const BasicLayout: React.FC = () => { | |||||
} | } | ||||
}, []); | }, []); | ||||
if (loading) { | |||||
if (loading || !currentUser) { | |||||
return ( | return ( | ||||
<GloablLoading /> | <GloablLoading /> | ||||
) | ) | ||||
@@ -29,10 +29,10 @@ const Login = () => { | |||||
// data.data.avatarUrl = 'https://test.vogocm.com:9010/eshop/eshop_img/2023/5/24/43853633d16749bfb291f81bebb73451_20230524150631A001.jpg'; | // data.data.avatarUrl = 'https://test.vogocm.com:9010/eshop/eshop_img/2023/5/24/43853633d16749bfb291f81bebb73451_20230524150631A001.jpg'; | ||||
setRefreshToken(data.refreshToken); | setRefreshToken(data.refreshToken); | ||||
setToken(data.accessToken); | setToken(data.accessToken); | ||||
const [ _, { data: menus } ] = await listMenus(); | |||||
const [err, {data: profile}] = await getProfile(); | |||||
const [ error, {data: tokenData}] = await rerefshToken(data.refreshToken) | |||||
setCurrentUser(profile) | |||||
// const [ _, { data: menus } ] = await listMenus(); | |||||
// const [err, {data: profile}] = await getProfile(); | |||||
// const [ error, {data: tokenData}] = await rerefshToken(data.refreshToken) | |||||
// setCurrentUser(profile) | |||||
navigate('/'); | navigate('/'); | ||||
}; | }; | ||||
@@ -14,7 +14,7 @@ import { ResponseDTO } from '@/models'; | |||||
const { apiUrl = '' } = useGlobSetting(); | const { apiUrl = '' } = useGlobSetting(); | ||||
const loginUrl = '/auth/login'; | const loginUrl = '/auth/login'; | ||||
const refreshTokenUrl = '/app-api/member/auth/refresh-token'; | |||||
const refreshTokenUrl = '/app-api/system/auth/refresh-token'; | |||||
export type Response<T> = Promise<[boolean, T, AxiosResponse<T>]>; | export type Response<T> = Promise<[boolean, T, AxiosResponse<T>]>; | ||||
@@ -52,7 +52,8 @@ class Request { | |||||
private async requestInterceptor( | private async requestInterceptor( | ||||
axiosConfig: InternalAxiosRequestConfig | axiosConfig: InternalAxiosRequestConfig | ||||
): Promise<any> { | ): Promise<any> { | ||||
if ([refreshTokenUrl].includes(axiosConfig.url || '')) { | |||||
axiosConfig.headers['tenant-id'] = '1'; | |||||
if ((axiosConfig.url || '').startsWith(refreshTokenUrl)) { | |||||
return Promise.resolve(axiosConfig); | return Promise.resolve(axiosConfig); | ||||
} | } | ||||
@@ -73,7 +74,6 @@ class Request { | |||||
if (token && !axiosConfig.url?.endsWith(loginUrl)) { | if (token && !axiosConfig.url?.endsWith(loginUrl)) { | ||||
axiosConfig.headers.Authorization = `Bearer ${token}`; | axiosConfig.headers.Authorization = `Bearer ${token}`; | ||||
} | } | ||||
axiosConfig.headers['tenant-id'] = '1'; | |||||
return Promise.resolve(axiosConfig); | return Promise.resolve(axiosConfig); | ||||
} | } | ||||
@@ -8,9 +8,9 @@ export default { | |||||
}, | }, | ||||
logout: () => { | logout: () => { | ||||
return request.post<any>('/app-api/member/auth/logout'); | |||||
return request.post<any>('/admin-api/system/auth/logout'); | |||||
}, | }, | ||||
rerefshToken: (refreshToken: string) => { | rerefshToken: (refreshToken: string) => { | ||||
return request.post<TokenDTO>(`/app-api/member/auth/refresh-token?refreshToken=${refreshToken}`, { refreshToken }); | |||||
return request.post<TokenDTO>(`/admin-api/system/auth/refresh-token?refreshToken=${refreshToken}`); | |||||
} | } | ||||
}; | }; |