diff --git a/frontend/src/components/MainLayout/MainLayout.jsx b/frontend/src/components/MainLayout/MainLayout.jsx index 1d26601..1685edd 100644 --- a/frontend/src/components/MainLayout/MainLayout.jsx +++ b/frontend/src/components/MainLayout/MainLayout.jsx @@ -1,13 +1,27 @@ -import { useState } from 'react' +import { useState, useEffect } from 'react' import { Layout } from 'antd' +import { useLocation } from 'react-router-dom' import AppSider from './AppSider' import AppHeader from './AppHeader' import './MainLayout.css' const { Content } = Layout +// 项目详情页路由(浏览 / 编辑) +const isProjectDetailPath = (pathname) => { + return /^\/projects\/[^/]+\/(docs|editor)(\/|$)/.test(pathname) +} + function MainLayout({ children }) { const [collapsed, setCollapsed] = useState(true) + const location = useLocation() + + // 进入项目详情页时,若左侧主菜单栏处于展开状态则自动收起 + useEffect(() => { + if (isProjectDetailPath(location.pathname)) { + setCollapsed(true) + } + }, [location.pathname]) const toggleCollapsed = () => { setCollapsed(!collapsed) diff --git a/frontend/src/pages/Document/DocumentPage.css b/frontend/src/pages/Document/DocumentPage.css index 67098af..f39f45c 100644 --- a/frontend/src/pages/Document/DocumentPage.css +++ b/frontend/src/pages/Document/DocumentPage.css @@ -28,33 +28,6 @@ height: 100%; } -/* 侧栏收起时:左侧悬浮展开按钮 */ -.docs-sider-expand-btn { - position: fixed; - left: 12px; - top: 50%; - transform: translateY(-50%); - z-index: 30; - width: 32px; - height: 48px; - border-radius: 8px; - border: 1px solid var(--border-color); - background: var(--header-bg); - color: var(--text-color-secondary); - font-size: 16px; - cursor: pointer; - display: flex; - align-items: center; - justify-content: center; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12); - transition: color 0.2s ease, border-color 0.2s ease; -} - -.docs-sider-expand-btn:hover { - color: var(--link-color); - border-color: var(--link-color); -} - .docs-sider-header { padding: 12px 10px 12px; border-bottom: 1px solid var(--border-color); diff --git a/frontend/src/pages/Document/DocumentPage.jsx b/frontend/src/pages/Document/DocumentPage.jsx index 4e2bf77..7202e08 100644 --- a/frontend/src/pages/Document/DocumentPage.jsx +++ b/frontend/src/pages/Document/DocumentPage.jsx @@ -1,7 +1,7 @@ import { useState, useEffect, useRef, useMemo } from 'react' import { useParams, useNavigate, useSearchParams } from 'react-router-dom' import { Layout, Spin, Button, Tooltip, Modal, Input, Space, Dropdown, Empty, Switch, Select, TreeSelect, Radio, Alert } from 'antd' -import { ShareAltOutlined, FileTextOutlined, FolderOutlined, FolderOpenOutlined, FilePdfOutlined, CopyOutlined, CloudDownloadOutlined, CloudUploadOutlined, ArrowLeftOutlined, ReloadOutlined, VerticalAlignTopOutlined, MenuUnfoldOutlined } from '@ant-design/icons' +import { ShareAltOutlined, FileTextOutlined, FolderOutlined, FolderOpenOutlined, FilePdfOutlined, CopyOutlined, CloudDownloadOutlined, CloudUploadOutlined, ArrowLeftOutlined, ReloadOutlined, VerticalAlignTopOutlined } from '@ant-design/icons' import ReactMarkdown from 'react-markdown' import remarkGfm from 'remark-gfm' import rehypeRaw from 'rehype-raw' @@ -61,7 +61,6 @@ function DocumentPage() { const [pdfUrl, setPdfUrl] = useState('') const [pdfFilename, setPdfFilename] = useState('') const [viewMode, setViewMode] = useState('markdown') - const [siderCollapsed, setSiderCollapsed] = useState(false) const [gitRepos, setGitRepos] = useState([]) // Git 同步范围弹窗状态 const [gitSyncModalVisible, setGitSyncModalVisible] = useState(false) @@ -132,7 +131,6 @@ function DocumentPage() { setMarkdownContent('') setTocItems([]) setViewMode('folder') - setSiderCollapsed(true) expandParentFolders(`${folderPath}/placeholder`) // 从内容区点击进入子文件夹时,同时展开自身,保证与左侧文件树同步 @@ -151,7 +149,6 @@ function DocumentPage() { setMarkdownContent('') setTocItems([]) setViewMode('folder') - setSiderCollapsed(true) setOpenKeys([]) if (syncUrl) { @@ -1262,7 +1259,7 @@ function DocumentPage() {