Checkpoint: Tennis Training Hub v1.0 - 完整功能版本：用户名登录、AI训练计划生成、MediaPipe视频姿势识别、击球统计、挥拍速度分析、NTRP自动评分系统、训练进度追踪、视频库管理、AI矫正建议

client/src/App.tsx

@@ -4,32 +4,57 @@ import NotFound from "@/pages/NotFound";
 import { Route, Switch } from "wouter";
 import ErrorBoundary from "./components/ErrorBoundary";
 import { ThemeProvider } from "./contexts/ThemeContext";
+import DashboardLayout from "./components/DashboardLayout";
 import Home from "./pages/Home";
+import Login from "./pages/Login";
+import Dashboard from "./pages/Dashboard";
+import Training from "./pages/Training";
+import Analysis from "./pages/Analysis";
+import Videos from "./pages/Videos";
+import Progress from "./pages/Progress";
+import Rating from "./pages/Rating";
+
+function DashboardRoute({ component: Component }: { component: React.ComponentType }) {
+  return (
+    <DashboardLayout>
+      <Component />
+    </DashboardLayout>
+  );
+}
 
 function Router() {
-  // make sure to consider if you need authentication for certain routes
   return (
     <Switch>
-      <Route path={"/"} component={Home} />
-      <Route path={"/404"} component={NotFound} />
-      {/* Final fallback route */}
+      <Route path="/" component={Home} />
+      <Route path="/login" component={Login} />
+      <Route path="/dashboard">
+        <DashboardRoute component={Dashboard} />
+      </Route>
+      <Route path="/training">
+        <DashboardRoute component={Training} />
+      </Route>
+      <Route path="/analysis">
+        <DashboardRoute component={Analysis} />
+      </Route>
+      <Route path="/videos">
+        <DashboardRoute component={Videos} />
+      </Route>
+      <Route path="/progress">
+        <DashboardRoute component={Progress} />
+      </Route>
+      <Route path="/rating">
+        <DashboardRoute component={Rating} />
+      </Route>
+      <Route path="/404" component={NotFound} />
       <Route component={NotFound} />
     </Switch>
   );
 }
 
-// NOTE: About Theme
-// - First choose a default theme according to your design style (dark or light bg), than change color palette in index.css
-//   to keep consistent foreground/background color across components
-// - If you want to make theme switchable, pass `switchable` ThemeProvider and use `useTheme` hook
-
 function App() {
   return (
     <ErrorBoundary>
-      <ThemeProvider
-        defaultTheme="light"
-        // switchable
-      >
+      <ThemeProvider defaultTheme="light">
         <TooltipProvider>
           <Toaster />
           <Router />