feat: 路由改造
This commit is contained in:
zdl
168
src/App.js
168
src/App.js
@@ -26,6 +26,7 @@ import PageLoader from "components/Loading/PageLoader";
|
||||
import Admin from "layouts/Admin";
|
||||
import Auth from "layouts/Auth";
|
||||
import HomeLayout from "layouts/Home";
|
||||
import MainLayout from "layouts/MainLayout";
|
||||
|
||||
// ⚡ 使用 React.lazy() 实现路由懒加载
|
||||
// 首屏不需要的组件按需加载，大幅减少初始 JS 包大小
|
||||
@@ -48,95 +49,113 @@ import { AuthModalProvider } from "contexts/AuthModalContext";
|
||||
import ProtectedRoute from "components/ProtectedRoute";
|
||||
import ErrorBoundary from "components/ErrorBoundary";
|
||||
import AuthModalManager from "components/Auth/AuthModalManager";
|
||||
import ScrollToTop from "components/ScrollToTop";
|
||||
|
||||
function AppContent() {
|
||||
const { colorMode } = useColorMode();
|
||||
|
||||
return (
|
||||
<Box minH="100vh" bg={colorMode === 'dark' ? 'gray.800' : 'white'}>
|
||||
{/* ⚡ Suspense 边界：懒加载组件加载时显示 Loading */}
|
||||
<Suspense fallback={<PageLoader message="页面加载中..." />}>
|
||||
<Routes>
|
||||
{/* 首页路由 */}
|
||||
<Route path="home/*" element={<HomeLayout />} />
|
||||
{/* 路由切换时自动滚动到顶部 */}
|
||||
<ScrollToTop />
|
||||
<Routes>
|
||||
{/* 带导航栏的主布局 - 所有需要导航栏的页面都在这里 */}
|
||||
{/* MainLayout 内部有 Suspense，确保导航栏始终可见 */}
|
||||
<Route element={<MainLayout />}>
|
||||
{/* 首页路由 */}
|
||||
<Route path="home/*" element={<HomeLayout />} />
|
||||
|
||||
{/* Community页面路由 - 需要登录 */}
|
||||
<Route
|
||||
path="community"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<Community />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
<Route path="forecast-report" element={<ForecastReport />} />
|
||||
<Route path="Financial" element={<FinancialPanorama />} />
|
||||
<Route path="company" element={<CompanyIndex />} />
|
||||
<Route path="company/:code" element={<CompanyIndex />} />
|
||||
<Route path="market-data" element={<MarketDataView />} />
|
||||
{/* 概念中心路由 - 需要登录 */}
|
||||
<Route
|
||||
path="concepts"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<ConceptCenter />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
<Route
|
||||
path="concept"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<ConceptCenter />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
{/* 股票概览页面路由 - 需要登录 */}
|
||||
<Route
|
||||
path="stocks"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<StockOverview />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
<Route
|
||||
path="stock-overview"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<StockOverview />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
{/* Limit Analyse页面路由 - 需要登录 */}
|
||||
<Route
|
||||
path="limit-analyse"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<LimitAnalyse />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
{/* 事件详情独立页面路由（不经 Admin 布局） */}
|
||||
<Route path="event-detail/:eventId" element={<EventDetail />} />
|
||||
{/* Community页面路由 - 需要登录 */}
|
||||
<Route
|
||||
path="community"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<Community />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
|
||||
{/* 模拟盘交易系统路由 - 无需登录 */}
|
||||
<Route
|
||||
path="trading-simulation"
|
||||
element={<TradingSimulation />}
|
||||
/>
|
||||
{/* 概念中心路由 - 需要登录 */}
|
||||
<Route
|
||||
path="concepts"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<ConceptCenter />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
<Route
|
||||
path="concept"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<ConceptCenter />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
|
||||
{/* 管理后台路由 - 需要登录 */}
|
||||
{/* 股票概览页面路由 - 需要登录 */}
|
||||
<Route
|
||||
path="stocks"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<StockOverview />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
<Route
|
||||
path="stock-overview"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<StockOverview />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
|
||||
{/* Limit Analyse页面路由 - 需要登录 */}
|
||||
<Route
|
||||
path="limit-analyse"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<LimitAnalyse />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
|
||||
{/* 模拟盘交易系统路由 - 需要登录 */}
|
||||
<Route
|
||||
path="trading-simulation"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<TradingSimulation />
|
||||
</ProtectedRoute>
|
||||
}
|
||||
/>
|
||||
|
||||
{/* 事件详情独立页面路由 (不经 Admin 布局） */}
|
||||
<Route path="event-detail/:eventId" element={<EventDetail />} />
|
||||
|
||||
{/* 公司相关页面 */}
|
||||
<Route path="forecast-report" element={<ForecastReport />} />
|
||||
<Route path="Financial" element={<FinancialPanorama />} />
|
||||
<Route path="company" element={<CompanyIndex />} />
|
||||
<Route path="company/:code" element={<CompanyIndex />} />
|
||||
<Route path="market-data" element={<MarketDataView />} />
|
||||
</Route>
|
||||
|
||||
{/* 管理后台路由 - 需要登录，不使用 MainLayout */}
|
||||
{/* 这些路由有自己的加载状态处理 */}
|
||||
<Route
|
||||
path="admin/*"
|
||||
element={
|
||||
<ProtectedRoute>
|
||||
<Admin />
|
||||
</ProtectedRoute>
|
||||
<Suspense fallback={<PageLoader message="加载中..." />}>
|
||||
<ProtectedRoute>
|
||||
<Admin />
|
||||
</ProtectedRoute>
|
||||
</Suspense>
|
||||
}
|
||||
/>
|
||||
|
||||
{/* 认证页面路由 */}
|
||||
{/* 认证页面路由 - 不使用 MainLayout */}
|
||||
<Route path="auth/*" element={<Auth />} />
|
||||
|
||||
{/* 默认重定向到首页 */}
|
||||
@@ -145,7 +164,6 @@ function AppContent() {
|
||||
{/* 404 页面 */}
|
||||
<Route path="*" element={<Navigate to="/home" replace />} />
|
||||
</Routes>
|
||||
</Suspense>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user