diff --git a/vue/src/layout/components/Sidebar/index.vue b/vue/src/layout/components/Sidebar/index.vue index 04d513b..1a4a582 100644 --- a/vue/src/layout/components/Sidebar/index.vue +++ b/vue/src/layout/components/Sidebar/index.vue @@ -92,6 +92,8 @@ this.$nextTick(() => this.$router.replace({path: '/redirect' + this.$route.fullPath})) } else this.$router.push(index) + //mobile时激活隐藏侧边栏 + this.device === 'mobile' && this.$store.commit('setting/sidebarCollapse', true) } }, mounted() { diff --git a/vue/src/layout/mixin/ResizeHandler.js b/vue/src/layout/mixin/ResizeHandler.js index bbb0d4e..580853d 100644 --- a/vue/src/layout/mixin/ResizeHandler.js +++ b/vue/src/layout/mixin/ResizeHandler.js @@ -1,20 +1,13 @@ import {debounce} from '@/utils' - -const {body} = document -const WIDTH = 768 - -function $_isMobile() { - const rect = body.getBoundingClientRect() - return rect.width - 1 < WIDTH -} +import {isMobile} from "@/utils/browser" export default { methods: { $_resizeHandler() { if (!document.hidden) { - const isMobile = $_isMobile() - this.$store.commit('app/device', isMobile ? 'mobile' : 'pc') - isMobile && this.$store.commit('setting/sidebarCollapse', true) + const mobile = isMobile() + this.$store.commit('app/device', mobile ? 'mobile' : 'pc') + mobile && this.$store.commit('setting/sidebarCollapse', true) } } }, diff --git a/vue/src/store/modules/app.js b/vue/src/store/modules/app.js index 1ba0576..627bbfe 100644 --- a/vue/src/store/modules/app.js +++ b/vue/src/store/modules/app.js @@ -1,11 +1,12 @@ import {getLocalPersonalSettings} from "@/utils/localStorage" import {createMutations} from "@/utils" +import {isMobile} from "@/utils/browser" const localSettings = getLocalPersonalSettings() const state = { //区分pc和移动端(mobile) - device: 'pc', + device: isMobile() ? 'mobile' : 'pc', //登陆页背景动画 loginPageBackgroundAnimation: 'firework', //注册页背景动画 diff --git a/vue/src/utils/browser.js b/vue/src/utils/browser.js new file mode 100644 index 0000000..e7c6c24 --- /dev/null +++ b/vue/src/utils/browser.js @@ -0,0 +1,7 @@ +const {body} = document +const WIDTH = 768 + +export function isMobile() { + const rect = body.getBoundingClientRect() + return rect.width - 1 < WIDTH +} diff --git a/vue/src/views/app/login.vue b/vue/src/views/app/login.vue index f034372..7aeaa12 100644 --- a/vue/src/views/app/login.vue +++ b/vue/src/views/app/login.vue @@ -62,8 +62,9 @@