gaoshp
2024-01-05 b5db49ce1e4c678ce4a7120928811a9621128b8e
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
import store from '@/store'
 
// const { body } = document
// const WIDTH = 1024
// const RATIO = 3
 
export default {
  watch: {
    $route(route) {
      if (this.device === 'mobile' && this.sidebar.opened) {
        store.dispatch('CloseSideBar', { withoutAnimation: false })
      }
    }
  },
  beforeMount() {
    window.addEventListener('resize', this.resizeHandler)
  },
  created() {
    this.resizeHandler()
  },
  methods: {
    isMobile() {
      // const rect = body.getBoundingClientRect()
      // return rect.width - RATIO < WIDTH
      return /(iPhone|iPad|iPod|iOS|Android)/i.test(navigator.userAgent)
    },
    resizeHandler() {
      if (!document.hidden) {
        const isMobile = this.isMobile()
        if (isMobile) {
          // 判断手机横竖屏状态
          if ('onorientationchange' in window) {
            if (window.orientation === 180 || window.orientation === 0) {
              // alert('竖屏状态!')
              store.dispatch('ToggleDevice', 'mobile')
            }
            if (window.orientation === 90 || window.orientation === -90) {
              // alert('横屏状态!');
              store.dispatch('ToggleDevice', 'desktop')
            }
          }
          store.dispatch('CloseSideBar', { withoutAnimation: true })
        } else {
          store.dispatch('ToggleDevice', 'desktop')
        }
      }
    }
  }
}