优化ErrorPage样式,补充了NotFoundPage
This commit is contained in:
@@ -1,15 +1,16 @@
|
||||
import React from 'react';
|
||||
import { useRouteError } from 'react-router';
|
||||
import { useRouteError, useNavigate } from 'react-router';
|
||||
import { Alert, Button } from 'antd';
|
||||
import { useTheme } from '../hooks_sys.tsx';
|
||||
|
||||
export const ErrorPage = () => {
|
||||
const navigate = useNavigate();
|
||||
const { isDark } = useTheme();
|
||||
const error = useRouteError() as any;
|
||||
const errorMessage = error?.statusText || error?.message || '未知错误';
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center min-h-screen p-4"
|
||||
<div className="flex flex-col items-center justify-center flex-grow p-4"
|
||||
style={{ color: isDark ? '#fff' : 'inherit' }}
|
||||
>
|
||||
<div className="max-w-3xl w-full">
|
||||
@@ -29,12 +30,12 @@ export const ErrorPage = () => {
|
||||
<div className="flex gap-4">
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => window.location.reload()}
|
||||
onClick={() => navigate(0)}
|
||||
>
|
||||
重新加载
|
||||
</Button>
|
||||
<Button
|
||||
onClick={() => window.location.href = '/admin'}
|
||||
onClick={() => navigate('/admin')}
|
||||
>
|
||||
返回首页
|
||||
</Button>
|
||||
|
||||
30
client/admin/components/NotFoundPage.tsx
Normal file
30
client/admin/components/NotFoundPage.tsx
Normal file
@@ -0,0 +1,30 @@
|
||||
import React from 'react';
|
||||
import { useNavigate } from 'react-router';
|
||||
import { Button } from 'antd';
|
||||
import { useTheme } from '../hooks_sys.tsx';
|
||||
|
||||
export const NotFoundPage = () => {
|
||||
const navigate = useNavigate();
|
||||
const { isDark } = useTheme();
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center flex-grow p-4"
|
||||
style={{ color: isDark ? '#fff' : 'inherit' }}
|
||||
>
|
||||
<div className="max-w-3xl w-full">
|
||||
<h1 className="text-2xl font-bold mb-4">404 - 页面未找到</h1>
|
||||
<p className="mb-6 text-gray-600 dark:text-gray-300">
|
||||
您访问的页面不存在或已被移除
|
||||
</p>
|
||||
<div className="flex gap-4">
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => navigate('/admin')}
|
||||
>
|
||||
返回首页
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user