ruoyi/RuoYi-Vue3
1
0
Fork 0
mirror of https://github.com/yangzongzhuan/RuoYi-Vue3.git synced 2025-09-27 23:02:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

使用Pinia代替Vuex进行数据存储

Browse Source
This commit is contained in:
RuoYi
2022-05-29 21:40:32 +08:00
parent 6f359c1534
commit 44ad220cdd
30 changed files with 479 additions and 623 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/layout/index.vue
View File

@@ -19,13 +19,16 @@ import Sidebar from './components/Sidebar/index.vue'
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,
@@ -39,18 +42,18 @@ const WIDTH = 992; // refer to Bootstrap's responsive design
watchEffect(() => {
if (device.value === 'mobile' && sidebar.value.opened) {
store.dispatch('app/closeSideBar', { withoutAnimation: false })
useAppStore().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);