From ece2dfeb926d728b10db38038e4d12e9e9851c24 Mon Sep 17 00:00:00 2001 From: chenrui <1187576398@qq.com> Date: 星期五, 06 六月 2025 17:38:10 +0800 Subject: [PATCH] 分页修改 --- src/layout/index.vue | 46 ++++++++++++++++++++++++++++------------------ 1 files changed, 28 insertions(+), 18 deletions(-) diff --git a/src/layout/index.vue b/src/layout/index.vue index c44e3fb..67ac803 100644 --- a/src/layout/index.vue +++ b/src/layout/index.vue @@ -19,13 +19,16 @@ import { AppMain, Navbar, Settings, TagsView } from './components' import defaultSettings from '@/settings' -const store = useStore(); -const theme = computed(() => store.state.settings.theme); -const sideTheme = computed(() => store.state.settings.sideTheme); -const sidebar = computed(() => store.state.app.sidebar); -const device = computed(() => store.state.app.device); -const needTagsView = computed(() => store.state.settings.tagsView); -const fixedHeader = computed(() => store.state.settings.fixedHeader); +import useAppStore from '@/store/modules/app' +import useSettingsStore from '@/store/modules/settings' + +const settingsStore = useSettingsStore() +const theme = computed(() => settingsStore.theme) +const sideTheme = computed(() => settingsStore.sideTheme) +const sidebar = computed(() => useAppStore().sidebar) +const device = computed(() => useAppStore().device) +const needTagsView = computed(() => settingsStore.tagsView) +const fixedHeader = computed(() => settingsStore.fixedHeader) const classObj = computed(() => ({ hideSidebar: !sidebar.value.opened, @@ -34,28 +37,31 @@ mobile: device.value === 'mobile' })) -const { width, height } = useWindowSize(); -const WIDTH = 992; // refer to Bootstrap's responsive design +const { width, height } = useWindowSize() +const WIDTH = 992 // refer to Bootstrap's responsive design + +watch(() => device.value, () => { + if (device.value === 'mobile' && sidebar.value.opened) { + useAppStore().closeSideBar({ withoutAnimation: false }) + } +}) watchEffect(() => { - if (device.value === 'mobile' && sidebar.value.opened) { - store.dispatch('app/closeSideBar', { withoutAnimation: false }) - } if (width.value - 1 < WIDTH) { - store.dispatch('app/toggleDevice', 'mobile') - store.dispatch('app/closeSideBar', { withoutAnimation: true }) + useAppStore().toggleDevice('mobile') + useAppStore().closeSideBar({ withoutAnimation: true }) } else { - store.dispatch('app/toggleDevice', 'desktop') + useAppStore().toggleDevice('desktop') } }) function handleClickOutside() { - store.dispatch('app/closeSideBar', { withoutAnimation: false }) + useAppStore().closeSideBar({ withoutAnimation: false }) } -const settingRef = ref(null); +const settingRef = ref(null) function setLayout() { - settingRef.value.openSetting(); + settingRef.value.openSetting() } </script> @@ -98,6 +104,10 @@ width: calc(100% - 54px); } +.sidebarHide .fixed-header { + width: 100%; +} + .mobile .fixed-header { width: 100%; } -- Gitblit v1.9.3