2
0
yourname 5 месяцев назад
Родитель
Сommit
1f66526f81

+ 1 - 0
package.json

@@ -8,6 +8,7 @@
     "start": "export NODE_ENV='production' && node dist-server/index.js"
   },
   "dependencies": {
+    "@ant-design/icons": "^6.0.0",
     "@emotion/react": "^11.14.0",
     "@heroicons/react": "^2.2.0",
     "@hono/node-server": "^1.14.3",

+ 19 - 0
pnpm-lock.yaml

@@ -8,6 +8,9 @@ importers:
 
   .:
     dependencies:
+      '@ant-design/icons':
+        specifier: ^6.0.0
+        version: 6.0.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
       '@emotion/react':
         specifier: ^11.14.0
         version: 11.14.0(@types/react@19.1.8)(react@19.1.0)
@@ -174,6 +177,13 @@ packages:
       react: '>=16.0.0'
       react-dom: '>=16.0.0'
 
+  '@ant-design/icons@6.0.0':
+    resolution: {integrity: sha512-o0aCCAlHc1o4CQcapAwWzHeaW2x9F49g7P3IDtvtNXgHowtRWYb7kiubt8sQPFvfVIVU/jLw2hzeSlNt0FU+Uw==}
+    engines: {node: '>=8'}
+    peerDependencies:
+      react: '>=16.0.0'
+      react-dom: '>=16.0.0'
+
   '@ant-design/react-slick@1.1.2':
     resolution: {integrity: sha512-EzlvzE6xQUBrZuuhSAFTdsr4P2bBBHGZwKFemEfq8gIGyIQCxalYfZW/T2ORbtQx5rU69o+WycP3exY/7T1hGA==}
     peerDependencies:
@@ -2942,6 +2952,15 @@ snapshots:
       react: 19.1.0
       react-dom: 19.1.0(react@19.1.0)
 
+  '@ant-design/icons@6.0.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0)':
+    dependencies:
+      '@ant-design/colors': 8.0.0
+      '@ant-design/icons-svg': 4.4.2
+      '@rc-component/util': 1.2.1(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      classnames: 2.5.1
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+
   '@ant-design/react-slick@1.1.2(react@19.1.0)':
     dependencies:
       '@babel/runtime': 7.27.6

+ 0 - 3
src/client/admin/components/ErrorPage.tsx

@@ -1,17 +1,14 @@
 import React from 'react';
 import { useRouteError, useNavigate } from 'react-router';
 import { Alert, Button } from 'antd';
-import { useTheme } from '../hooks/ThemeProvider';
 
 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 flex-grow p-4"
-      style={{ color: isDark ? '#fff' : 'inherit' }}
     >
       <div className="max-w-3xl w-full">
         <h1 className="text-2xl font-bold mb-4">发生错误</h1>

+ 1 - 5
src/client/admin/components/NotFoundPage.tsx

@@ -1,16 +1,12 @@
 import React from 'react';
 import { useNavigate } from 'react-router';
 import { Button } from 'antd';
-import { useTheme } from '../hooks/ThemeProvider';
 
 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="flex flex-col items-center justify-center flex-grow p-4">
       <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">

+ 12 - 12
src/client/admin/layouts/MainLayout.tsx

@@ -108,12 +108,13 @@ export const MainLayout = () => {
   
   return (
     <Layout style={{ minHeight: '100vh' }}>
-      <Sider 
-        trigger={null} 
-        collapsible 
+      <Sider
+        trigger={null}
+        collapsible
         collapsed={collapsed}
         width={240}
         className="custom-sider"
+        theme='light'
         style={{
           overflow: 'auto',
           height: '100vh',
@@ -122,6 +123,8 @@ export const MainLayout = () => {
           top: 0,
           bottom: 0,
           zIndex: 100,
+          transition: 'all 0.2s ease',
+          boxShadow: '2px 0 8px 0 rgba(29, 35, 41, 0.05)',
         }}
       >
         <div className="p-4">
@@ -156,12 +159,9 @@ export const MainLayout = () => {
       </Sider>
       
       <Layout style={{ marginLeft: collapsed ? 80 : 240, transition: 'margin-left 0.2s' }}>
-        <Header className="p-0 flex justify-between items-center" 
-          style={{ 
-            position: 'sticky', 
-            top: 0, 
-            zIndex: 99, 
-            boxShadow: '0 1px 4px rgba(0,21,41,0.08)',
+        <div className="sticky top-0 z-50 bg-white shadow-sm transition-all duration-200 h-16 flex items-center justify-between pl-2"
+          style={{
+            boxShadow: '0 1px 4px rgba(0,21,41,0.08)'
           }}
         >
           <Button
@@ -191,10 +191,10 @@ export const MainLayout = () => {
               </Space>
             </Dropdown>
           </Space>
-        </Header>
+        </div>
         
-        <Content className="m-6" style={{ overflow: 'initial' }}>
-          <div className="site-layout-content p-6 rounded-lg">
+        <Content className="m-6" style={{ overflow: 'initial', transition: 'all 0.2s ease' }}>
+          <div className="site-layout-content p-6 rounded-lg bg-white shadow-sm">
             <Outlet />
           </div>
           

+ 3 - 2
src/client/admin/pages/Login.tsx

@@ -4,7 +4,7 @@ import {
   Input,
   Button,
   Card,
-  message,
+  App,
 } from 'antd';
 import {
   UserOutlined,
@@ -17,6 +17,7 @@ import {
 
 // 登录页面
 export const LoginPage = () => {
+  const { message } = App.useApp();
   const { login } = useAuth();
   const [form] = Form.useForm();
   const [loading, setLoading] = useState(false);
@@ -46,7 +47,7 @@ export const LoginPage = () => {
       // 登录成功后跳转到管理后台首页
       navigate('/admin/dashboard');
     } catch (error: any) {
-      message.error(error.response?.data?.error || '登录失败');
+      message.error(error instanceof Error ? error.message : '登录失败');
     } finally {
       setLoading(false);
     }

+ 6 - 7
src/client/home/index.tsx

@@ -1,4 +1,3 @@
-import { Link } from 'react-router-dom'
 import { createRoot } from 'react-dom/client'
 import { getGlobalConfig } from '../utils/utils'
 
@@ -22,20 +21,20 @@ const Home = () => {
 
       {/* 管理入口按钮 */}
       <div className="space-y-4">
-        <Link
-          to="/admin"
+        <a
+          href="/admin"
           className="w-full flex justify-center py-3 px-4 border border-transparent rounded-md shadow-sm text-lg font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
         >
           进入管理后台
-        </Link>
+        </a>
         
         {/* 移动端入口按钮 */}
-        <Link
-          to="/mobile"
+        <a
+          href="/mobile"
           className="w-full flex justify-center py-3 px-4 border border-blue-600 rounded-md shadow-sm text-lg font-medium text-blue-600 bg-white hover:bg-blue-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
         >
           进入移动端
-        </Link>
+        </a>
         
       </div>
     </div>

+ 1 - 1
src/server/data-source.ts

@@ -17,6 +17,6 @@ export const AppDataSource = new DataSource({
     User, Role
   ],
   migrations: [],
-  synchronize: process.env.DB_SYNCHRONIZE === "true",
+  synchronize: process.env.DB_SYNCHRONIZE !== "false",
   logging: process.env.DB_LOGGING === "true",
 });

+ 54 - 0
src/style.css

@@ -1 +1,55 @@
 @import 'tailwindcss';
+
+/* 全局滚动条样式 */
+::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 3px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: #c1c1c1;
+  border-radius: 3px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: #a8a8a8;
+}
+
+/* 响应式断点 */
+@media (max-width: 768px) {
+  .custom-sider {
+    width: 100% !important;
+    max-width: 100% !important;
+  }
+  
+  .site-layout-content {
+    padding: 1rem !important;
+  }
+}
+
+/* 全局过渡效果 */
+.transition-all {
+  transition-property: all;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+/* 内容区域阴影优化 */
+.shadow-sm {
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+}
+
+/* 按钮悬停效果 */
+.ant-btn:hover {
+  transform: translateY(-1px);
+}
+
+/* 卡片样式优化 */
+.ant-card {
+  border-radius: 8px;
+}