3
0

Make sidebar mobile mode reactive

This commit is contained in:
Jože Fortun
2023-03-23 14:46:20 +01:00
parent 459742adbb
commit a04f5400a5

View File

@@ -188,7 +188,8 @@ export default {
data () {
return {
sidebar_settings : {}
sidebarSettings : {},
isMobile: false,
}
},
@@ -212,21 +213,21 @@ export default {
this.$emit('update:pinned', pinned)
},
},
isMobile () {
return window.innerWidth < 1024 || /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
},
},
created () {
this.checkIfMobile()
this.$root.$on('close-sidebar', () => {
this.isExpanded = false
this.isPinned = false
})
window.addEventListener('resize', this.checkIfMobile)
},
beforeDestroy () {
this.$root.$off('close-sidebar')
window.removeEventListener('resize', this.checkIfMobile)
},
watch: {
@@ -239,6 +240,10 @@ export default {
},
methods: {
checkIfMobile: throttle(function () {
this.isMobile = window.innerWidth < 1024 || /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
}, 500),
checkSidebar () {
// If sidebar should be disabled on route, close and unpin when navigating to route
if (this.disabledRoutes.includes(this.$route.name)) {
@@ -263,9 +268,9 @@ export default {
},
defaultSidebarAppearance () {
const localstorage_settings = JSON.parse(window.localStorage.getItem('sidebar_settings'))
const localstorage_settings = JSON.parse(window.localStorage.getItem('sidebarSettings'))
if (localstorage_settings) {
this.sidebar_settings = localstorage_settings
this.sidebarSettings = localstorage_settings
}
const app_sidebar = (localstorage_settings || {})[this.$root.$options.name]
if (!this.isMobile) {
@@ -281,12 +286,12 @@ export default {
},
saveSettings (pinned) {
if (this.sidebar_settings[this.$root.$options.name]) {
this.sidebar_settings[this.$root.$options.name].pinned = pinned
if (this.sidebarSettings[this.$root.$options.name]) {
this.sidebarSettings[this.$root.$options.name].pinned = pinned
} else {
this.sidebar_settings[this.$root.$options.name] = { pinned: pinned }
this.sidebarSettings[this.$root.$options.name] = { pinned: pinned }
}
window.localStorage.setItem('sidebar_settings', JSON.stringify(this.sidebar_settings))
window.localStorage.setItem('sidebarSettings', JSON.stringify(this.sidebarSettings))
},
openSidebar () {