Files
live-hub-py/web/frontend/src/App.tsx
T
yml2213andClaude Fable 5 4522421293 增加自动亮色/暗色主题切换 + 清理 pyc 文件
- 新建 store/theme.tsx: 亮色/暗色/跟随系统三种模式
- App.tsx: ThemeProvider + ConfigProvider 暗色算法
- MainLayout: 侧边栏主题切换按钮,Sider/Content 随主题变化
- 所有页面硬编码颜色替换为 antd token
- AssignmentsPage: Tag 用预设颜色名适配暗色,未选中背景用 colorBgContainer
- LoginPage: 暗色深色渐变背景
- 从 git 移除所有 __pycache__/*.pyc 文件

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-06-22 20:09:57 +08:00

65 lines
2.2 KiB
TypeScript

import { useState, useCallback } from 'react';
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
import { ConfigProvider, theme } from 'antd';
import zhCN from 'antd/locale/zh_CN';
import LoginPage from './pages/LoginPage';
import MainLayout from './layouts/MainLayout';
import DashboardPage from './pages/DashboardPage';
import AccountsPage from './pages/AccountsPage';
import AssignmentsPage from './pages/AssignmentsPage';
import LoginTasksPage from './pages/LoginTasksPage';
import ProxyPage from './pages/ProxyPage';
import UsersPage from './pages/UsersPage';
import CookiePage from './pages/CookiePage';
import { getToken } from './store/auth';
import { ThemeProvider, useTheme } from './store/theme';
function AppContent() {
// 用 state 驱动重渲染,登录/登出时调 refreshAuth()
const [authVersion, setAuthVersion] = useState(0);
const refreshAuth = useCallback(() => setAuthVersion((v) => v + 1), []);
const isLoggedIn = !!getToken();
const { isDark } = useTheme();
return (
<ConfigProvider
locale={zhCN}
theme={{
algorithm: isDark ? theme.darkAlgorithm : theme.defaultAlgorithm,
token: {
borderRadius: 6,
},
}}
>
<BrowserRouter>
<Routes>
<Route path="/login" element={<LoginPage onLogin={refreshAuth} />} />
<Route
path="/"
element={isLoggedIn ? <MainLayout key={authVersion} onLogout={refreshAuth} /> : <Navigate to="/login" replace />}
>
<Route index element={<DashboardPage />} />
<Route path="accounts" element={<AccountsPage />} />
<Route path="assignments" element={<AssignmentsPage />} />
<Route path="login-tasks" element={<LoginTasksPage />} />
<Route path="cookies" element={<CookiePage />} />
<Route path="proxy" element={<ProxyPage />} />
<Route path="users" element={<UsersPage />} />
</Route>
<Route path="*" element={<Navigate to="/" replace />} />
</Routes>
</BrowserRouter>
</ConfigProvider>
);
}
function App() {
return (
<ThemeProvider>
<AppContent />
</ThemeProvider>
);
}
export default App;