mirror of
https://github.com/SECTL/SecScore.git
synced 2026-07-21 13:59:03 +08:00
fix: 修复退出沉浸模式导航栏无过渡动画
This commit is contained in:
-30
@@ -7,8 +7,6 @@ import { ContentArea } from "./components/ContentArea"
|
|||||||
import { OOBE } from "./components/OOBE/OOBE"
|
import { OOBE } from "./components/OOBE/OOBE"
|
||||||
import { ThemeProvider, useTheme } from "./contexts/ThemeContext"
|
import { ThemeProvider, useTheme } from "./contexts/ThemeContext"
|
||||||
|
|
||||||
const IMMERSIVE_TRANSITION_MS = 260
|
|
||||||
|
|
||||||
function MainContent(): React.JSX.Element {
|
function MainContent(): React.JSX.Element {
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
@@ -17,8 +15,6 @@ function MainContent(): React.JSX.Element {
|
|||||||
const [messageApi, contextHolder] = message.useMessage()
|
const [messageApi, contextHolder] = message.useMessage()
|
||||||
const { isIosDevice, isAndroidDevice, defaultPortraitMode } = useMemo(getMobileDeviceInfo, [])
|
const { isIosDevice, isAndroidDevice, defaultPortraitMode } = useMemo(getMobileDeviceInfo, [])
|
||||||
const [immersiveMode, setImmersiveMode] = useState(false)
|
const [immersiveMode, setImmersiveMode] = useState(false)
|
||||||
const [sidebarVisible, setSidebarVisible] = useState(true)
|
|
||||||
const sidebarTransitionTimerRef = useRef<number | null>(null)
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const api = (window as any).api
|
const api = (window as any).api
|
||||||
@@ -354,30 +350,6 @@ function MainContent(): React.JSX.Element {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (sidebarTransitionTimerRef.current) {
|
|
||||||
window.clearTimeout(sidebarTransitionTimerRef.current)
|
|
||||||
sidebarTransitionTimerRef.current = null
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!immersiveMode) {
|
|
||||||
setSidebarVisible(true)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
sidebarTransitionTimerRef.current = window.setTimeout(() => {
|
|
||||||
setSidebarVisible(false)
|
|
||||||
sidebarTransitionTimerRef.current = null
|
|
||||||
}, IMMERSIVE_TRANSITION_MS)
|
|
||||||
|
|
||||||
return () => {
|
|
||||||
if (sidebarTransitionTimerRef.current) {
|
|
||||||
window.clearTimeout(sidebarTransitionTimerRef.current)
|
|
||||||
sidebarTransitionTimerRef.current = null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, [immersiveMode])
|
|
||||||
|
|
||||||
const isDark = currentTheme?.mode === "dark"
|
const isDark = currentTheme?.mode === "dark"
|
||||||
const brandColor = currentTheme?.config?.tdesign?.brandColor || "#0052D9"
|
const brandColor = currentTheme?.config?.tdesign?.brandColor || "#0052D9"
|
||||||
|
|
||||||
@@ -394,7 +366,6 @@ function MainContent(): React.JSX.Element {
|
|||||||
>
|
>
|
||||||
{contextHolder}
|
{contextHolder}
|
||||||
<Layout style={{ height: "100%", flexDirection: "row", overflow: "hidden" }}>
|
<Layout style={{ height: "100%", flexDirection: "row", overflow: "hidden" }}>
|
||||||
{sidebarVisible && (
|
|
||||||
<div
|
<div
|
||||||
className={`ss-immersive-sidebar ${immersiveMode ? "is-hidden" : "is-visible"}`}
|
className={`ss-immersive-sidebar ${immersiveMode ? "is-hidden" : "is-visible"}`}
|
||||||
style={
|
style={
|
||||||
@@ -413,7 +384,6 @@ function MainContent(): React.JSX.Element {
|
|||||||
onFloatingExpandedChange={setFloatingSidebarExpanded}
|
onFloatingExpandedChange={setFloatingSidebarExpanded}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
|
||||||
<ContentArea
|
<ContentArea
|
||||||
permission={permission}
|
permission={permission}
|
||||||
hasAnyPassword={hasAnyPassword}
|
hasAnyPassword={hasAnyPassword}
|
||||||
|
|||||||
Reference in New Issue
Block a user