web_app.tsx 模块化拆分路由、菜单、布局

client/admin/components/ErrorPage.tsx

@@ -0,0 +1,45 @@
+import React from 'react';
+import { useRouteError } from 'react-router';
+import { Alert, Button } from 'antd';
+import { useTheme } from '../hooks_sys.tsx';
+
+export const ErrorPage = () => {
+  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"
+      style={{ color: isDark ? '#fff' : 'inherit' }}
+    >
+      <div className="max-w-3xl w-full">
+        <h1 className="text-2xl font-bold mb-4">发生错误</h1>
+        <Alert 
+          type="error"
+          message={error?.message || '未知错误'}
+          description={
+            error?.stack ? (
+              <pre className="text-xs overflow-auto p-2 bg-gray-100 dark:bg-gray-800 rounded">
+                {error.stack}
+              </pre>
+            ) : null
+          }
+          className="mb-4"
+        />
+        <div className="flex gap-4">
+          <Button 
+            type="primary" 
+            onClick={() => window.location.reload()}
+          >
+            重新加载
+          </Button>
+          <Button 
+            onClick={() => window.location.href = '/admin'}
+          >
+            返回首页
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+};