多维表格
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

80 lines
2.2 KiB

import { acceptHMRUpdate, defineStore } from 'pinia'
import { MAX_WIDTH_FOR_MOBILE_MODE } from '~/lib'
export const useConfigStore = defineStore('configStore', () => {
const { isMobileMode: globalIsMobile } = useGlobal()
const { width } = useWindowSize()
const sidebarStore = useSidebarStore()
const viewsStore = useViewsStore()
const { activeViewTitleOrId } = storeToRefs(viewsStore)
const tablesStore = useTablesStore()
const { activeTableId } = storeToRefs(tablesStore)
const isViewPortMobile = () => width.value < MAX_WIDTH_FOR_MOBILE_MODE
const isMobileMode = ref(isViewPortMobile())
const projectPageTab = ref<'allTable' | 'collaborator' | 'data-source'>('allTable')
const onViewPortResize = () => {
isMobileMode.value = isViewPortMobile()
}
// Feature flag for create view all times
const showCreateViewAllTimes = ref(false)
window.addEventListener('DOMContentLoaded', onViewPortResize)
window.addEventListener('resize', onViewPortResize)
watch(
isMobileMode,
() => {
globalIsMobile.value = isMobileMode.value
// Change --topbar-height css variable
document.documentElement.style.setProperty('--topbar-height', isMobileMode.value ? '3.25rem' : '3.1rem')
// Set .mobile-mode class on body
if (isMobileMode.value) {
document.body.classList.add('mobile')
document.body.classList.remove('desktop')
} else {
document.body.classList.add('desktop')
document.body.classList.remove('mobile')
}
},
{
immediate: true,
},
)
const handleSidebarOpenOnMobileForNonViews = () => {
if (!isViewPortMobile()) return
if (!activeViewTitleOrId && !activeTableId) {
nextTick(() => {
sidebarStore.isLeftSidebarOpen = true
})
} else {
sidebarStore.isLeftSidebarOpen = false
}
}
watch([activeViewTitleOrId, activeTableId], () => {
handleSidebarOpenOnMobileForNonViews()
})
return {
isMobileMode,
isViewPortMobile,
handleSidebarOpenOnMobileForNonViews,
projectPageTab,
showCreateViewAllTimes,
}
})
if (import.meta.hot) {
import.meta.hot.accept(acceptHMRUpdate(useConfigStore as any, import.meta.hot))
}