feat: 重构前端为企业 Admin 后台布局,引入 React Router 路由

- 引入 React Router v7 (Declarative mode) 实现 SPA 路由
- 重构 Layout 为 Header + 侧边栏 + 内容区的企业 Admin 布局
- 新增侧边栏菜单组件,支持折叠/展开,状态持久化到 localStorage
- 新增示例页面:仪表盘、用户管理、系统设置、404
- 菜单配置与路由统一为单一数据源 (menu.tsx)
- Vite code splitting 新增 vendor-router 组
- 更新 DEVELOPMENT.md 和 README.md 文档
This commit is contained in:
2026-05-20 19:06:14 +08:00
parent 5aed73523e
commit 4caf502908
32 changed files with 981 additions and 140 deletions

View File

@@ -1,7 +1,10 @@
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { render } from "@testing-library/react";
import { mock } from "bun:test";
import { createElement, StrictMode } from "react";
import { MemoryRouter } from "react-router";
// Note: jsdom and polyfills are now set up in tests/setup.ts
// This file only contains component-specific mocks
import { ErrorBoundary } from "../../src/web/components/ErrorBoundary";
// Mock recharts BEFORE any component imports
void mock.module("recharts", () => ({
@@ -15,6 +18,42 @@ void mock.module("recharts", () => ({
YAxis: () => null,
}));
export interface RenderWithProvidersOptions {
initialRoute?: string;
}
export function renderWithProviders(ui: React.ReactElement, options?: RenderWithProvidersOptions) {
const queryClient = createTestQueryClient();
const initialRoute = options?.initialRoute ?? "/";
return render(
createElement(
StrictMode,
null,
createElement(
ErrorBoundary,
null,
createElement(
QueryClientProvider,
{ client: queryClient },
createElement(MemoryRouter, { initialEntries: [initialRoute] }, ui),
),
),
),
);
}
function createTestQueryClient() {
return new QueryClient({
defaultOptions: {
queries: {
retry: false,
staleTime: 0,
},
},
});
}
// Custom test helpers (替代 jest-dom matchers)
export const testHelpers = {
toBeInTheDocument: (element: Element | null) => {