From e76c918ef772b19e9eb52c2c492b6e8da6ac525a Mon Sep 17 00:00:00 2001
From: yourname <yourname@email.com>
Date: Wed, 14 May 2025 12:30:15 +0000
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96ErrorPage=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=EF=BC=8C=E8=A1=A5=E5=85=85=E4=BA=86NotFoundPage?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 HISTORY.md                               |  1 +
 client/admin/components/ErrorPage.tsx    |  9 +++----
 client/admin/components/NotFoundPage.tsx | 30 ++++++++++++++++++++++++
 client/admin/routes.tsx                  |  6 +++++
 4 files changed, 42 insertions(+), 4 deletions(-)
 create mode 100644 client/admin/components/NotFoundPage.tsx

diff --git a/HISTORY.md b/HISTORY.md
index b2be49a..84f581f 100644
--- a/HISTORY.md
+++ b/HISTORY.md
@@ -3,6 +3,7 @@
 迁移管理页面，在正式环境中，需要验证env中配置的密码参数才能打开
 
 2025.05.14 0.1.5
+优化ErrorPage样式，补充了NotFoundPage
 deno.json中去掉 没用的 @testing-library，jsDom
 
 2025.05.14 0.1.4
diff --git a/client/admin/components/ErrorPage.tsx b/client/admin/components/ErrorPage.tsx
index fe2ff51..6f7da64 100644
--- a/client/admin/components/ErrorPage.tsx
+++ b/client/admin/components/ErrorPage.tsx
@@ -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>
diff --git a/client/admin/components/NotFoundPage.tsx b/client/admin/components/NotFoundPage.tsx
new file mode 100644
index 0000000..7392ffb
--- /dev/null
+++ b/client/admin/components/NotFoundPage.tsx
@@ -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>
+  );
+};
\ No newline at end of file
diff --git a/client/admin/routes.tsx b/client/admin/routes.tsx
index d603e58..f29d9e9 100644
--- a/client/admin/routes.tsx
+++ b/client/admin/routes.tsx
@@ -3,6 +3,7 @@ import { createBrowserRouter, Navigate } from 'react-router';
 import { ProtectedRoute } from './components_protected_route.tsx';
 import { MainLayout } from './layouts/MainLayout.tsx';
 import { ErrorPage } from './components/ErrorPage.tsx';
+import { NotFoundPage } from './components/NotFoundPage.tsx';
 import { DashboardPage } from './pages_dashboard.tsx';
 import { UsersPage } from './pages_users.tsx';
 import { FileLibraryPage } from './pages_file_library.tsx';
@@ -80,6 +81,11 @@ export const router = createBrowserRouter([
         element: <MessagesPage />,
         errorElement: <ErrorPage />
       },
+      {
+        path: '*',
+        element: <NotFoundPage />,
+        errorElement: <ErrorPage />
+      },
     ],
   },
 ]);
\ No newline at end of file