sweep menü
This commit is contained in:
parent
40f4da2386
commit
4162e6ed2a
@ -76,4 +76,4 @@
|
|||||||
1767345728- 93:01
|
1767345728- 93:01
|
||||||
1767373107- 6:35
|
1767373107- 6:35
|
||||||
1767376587- 12:56
|
1767376587- 12:56
|
||||||
1767377746- 3:22
|
1767377746- 5:52
|
||||||
|
|||||||
@ -65,13 +65,54 @@ const auth = useAuthStore()
|
|||||||
const config = useMyConfigStore()
|
const config = useMyConfigStore()
|
||||||
|
|
||||||
const token = useCookie('_auth')
|
const token = useCookie('_auth')
|
||||||
const menuShow = ref()
|
const menuShow = ref(false)
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const isHome = computed(()=>{
|
const isHome = computed(()=>{
|
||||||
return (route.fullPath === '/')
|
return (route.fullPath === '/')
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// Swipe gesture handling
|
||||||
|
const touchStartX = ref(0)
|
||||||
|
const touchEndX = ref(0)
|
||||||
|
const minSwipeDistance = 50
|
||||||
|
|
||||||
|
function handleTouchStart(e: TouchEvent) {
|
||||||
|
touchStartX.value = e.touches[0].clientX
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleTouchEnd(e: TouchEvent) {
|
||||||
|
touchEndX.value = e.changedTouches[0].clientX
|
||||||
|
handleSwipe()
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSwipe() {
|
||||||
|
const swipeDistance = touchEndX.value - touchStartX.value
|
||||||
|
const screenWidth = window.innerWidth
|
||||||
|
|
||||||
|
// Swipe left (from right edge) -> open menu
|
||||||
|
if (swipeDistance < -minSwipeDistance && touchStartX.value > screenWidth - 50) {
|
||||||
|
if (props.menu) {
|
||||||
|
menuShow.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Swipe right -> close menu (if open)
|
||||||
|
if (swipeDistance > minSwipeDistance && menuShow.value) {
|
||||||
|
menuShow.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
document.addEventListener('touchstart', handleTouchStart, { passive: true })
|
||||||
|
document.addEventListener('touchend', handleTouchEnd, { passive: true })
|
||||||
|
})
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
document.removeEventListener('touchstart', handleTouchStart)
|
||||||
|
document.removeEventListener('touchend', handleTouchEnd)
|
||||||
|
})
|
||||||
|
|
||||||
function logOut(){
|
function logOut(){
|
||||||
token.value = null
|
token.value = null
|
||||||
auth.user = null
|
auth.user = null
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user