From 84e3fea2bb519fce596a731d9ca2818ee82c22e8 Mon Sep 17 00:00:00 2001
From: LeonspaceX <xiezhengyang112022@163.com>
Date: Fri, 30 Jan 2026 19:14:26 +0800
Subject: [PATCH] =?UTF-8?q?AI=E6=B2=A1=E5=B8=AE=E6=88=91=E6=8F=90=E4=BA=A4?=
 =?UTF-8?q?=E8=BF=99=E4=BA=9B=EF=BC=8C=E6=88=91=E6=89=8B=E5=8A=A8=E6=8F=90?=
 =?UTF-8?q?=E4=BA=A4=E4=B8=80=E4=B8=8B=E5=90=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 front/src/App.tsx                        |  2 +
 front/src/components/Panel.tsx           | 56 ++++++++++++++++++++++++
 front/src/layouts/components/Sidebar.tsx |  2 +-
 3 files changed, 59 insertions(+), 1 deletion(-)
 create mode 100644 front/src/components/Panel.tsx

diff --git a/front/src/App.tsx b/front/src/App.tsx
index 9d4ff19..65f465a 100644
--- a/front/src/App.tsx
+++ b/front/src/App.tsx
@@ -6,6 +6,7 @@ import About from './components/About';
 import CreatePost from './components/CreatePost';
 import PostCard from './components/PostCard';
 import ImageViewer from './components/ImageViewer';
+import Panel from './components/Panel';
 import { fetchArticles, reset_identity_token, getSiteNotice, type Article } from './api';
 import { useLayout } from './context/LayoutContext';
 import './App.css';
@@ -313,6 +314,7 @@ function App() {
         >
           <Route index element={<Home onPreviewImage={openImageViewer} />} />
           <Route path="create" element={<CreatePost />} />
+          <Route path="panel" element={<Panel />} />
           <Route path="about" element={<About />} />
           <Route path="*" element={<NotFound />} />
         </Route>
diff --git a/front/src/components/Panel.tsx b/front/src/components/Panel.tsx
new file mode 100644
index 0000000..63829e8
--- /dev/null
+++ b/front/src/components/Panel.tsx
@@ -0,0 +1,56 @@
+import React from 'react';
+import { makeStyles, tokens, Tab, TabList, Text } from '@fluentui/react-components';
+
+const useStyles = makeStyles({
+  container: {
+    width: '100%',
+    maxWidth: '1200px',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: tokens.spacingVerticalL,
+  },
+  tabs: {
+    borderBottom: `1px solid ${tokens.colorNeutralStroke1}`,
+    paddingBottom: tokens.spacingVerticalS,
+  },
+  section: {
+    paddingTop: tokens.spacingVerticalM,
+  },
+  placeholder: {
+    color: tokens.colorNeutralForeground3,
+  },
+});
+
+const Panel: React.FC = () => {
+  const styles = useStyles();
+  const [tab, setTab] = React.useState<'posts' | 'comments' | 'drive' | 'settings'>('posts');
+
+  const titleMap: Record<'posts' | 'comments' | 'drive' | 'settings', string> = {
+    posts: '投稿',
+    comments: '评论',
+    drive: '网盘',
+    settings: '设置',
+  };
+
+  return (
+    <div className={styles.container}>
+      <TabList
+        className={styles.tabs}
+        selectedValue={tab}
+        onTabSelect={(_, data) => setTab(data.value as typeof tab)}
+      >
+        <Tab value="posts">投稿</Tab>
+        <Tab value="comments">评论</Tab>
+        <Tab value="drive">网盘</Tab>
+        <Tab value="settings">设置</Tab>
+      </TabList>
+
+      <div className={styles.section}>
+        <Text weight="semibold">{titleMap[tab]}</Text>
+        <Text className={styles.placeholder}>这里是 {titleMap[tab]} 的占位内容</Text>
+      </div>
+    </div>
+  );
+};
+
+export default Panel;
diff --git a/front/src/layouts/components/Sidebar.tsx b/front/src/layouts/components/Sidebar.tsx
index 1156c67..dd6a40a 100644
--- a/front/src/layouts/components/Sidebar.tsx
+++ b/front/src/layouts/components/Sidebar.tsx
@@ -89,7 +89,7 @@ const useStyles = makeStyles({
 const menuItems = [
   { path: '/', icon: Home24Regular, label: '主页' },
   { path: '/create', icon: Add24Regular, label: '投稿' },
-  { path: '/dashboard', icon: Person24Regular, label: '用户设置' },
+  { path: '/panel', icon: Person24Regular, label: '用户设置' },
   { path: '/admin', icon: Settings24Regular, label: '管理面板' },
   { path: '/about', icon: Info24Regular, label: '关于' },
 ];