mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-05 07:28:37 +08:00
将 useDialogScrollLock 替换为 useScrollLock
This commit is contained in:
@@ -6,7 +6,7 @@
|
|||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, watch, onBeforeUnmount } from 'vue'
|
import { computed, watch, onBeforeUnmount } from 'vue'
|
||||||
import { useDialogScrollLockWithWatch } from '@/composables/useDialogScrollLock'
|
import { useScrollLockWithWatch } from '@/composables/useScrollLock'
|
||||||
|
|
||||||
// Props
|
// Props
|
||||||
interface Props {
|
interface Props {
|
||||||
@@ -35,7 +35,7 @@ const dialogModel = computed({
|
|||||||
})
|
})
|
||||||
|
|
||||||
// 使用滚动锁定
|
// 使用滚动锁定
|
||||||
const { isLocked, lockScroll, restoreScroll } = useDialogScrollLockWithWatch(dialogModel, {
|
const { isLocked, lockScroll, restoreScroll } = useScrollLockWithWatch(dialogModel, {
|
||||||
autoRestore: true,
|
autoRestore: true,
|
||||||
preserveScrollPosition: props.preserveScrollPosition,
|
preserveScrollPosition: props.preserveScrollPosition,
|
||||||
preventTouchScroll: props.preventTouchScroll,
|
preventTouchScroll: props.preventTouchScroll,
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { ref, watch, onBeforeUnmount, readonly } from 'vue'
|
import { ref, watch, onBeforeUnmount, readonly } from 'vue'
|
||||||
|
|
||||||
// 弹窗滚动锁定配置
|
// 滚动锁定配置
|
||||||
export interface DialogScrollLockOptions {
|
export interface ScrollLockOptions {
|
||||||
// 是否在组件卸载时自动恢复滚动
|
// 是否在组件卸载时自动恢复滚动
|
||||||
autoRestore?: boolean
|
autoRestore?: boolean
|
||||||
// 是否保存和恢复滚动位置
|
// 是否保存和恢复滚动位置
|
||||||
@@ -17,7 +17,7 @@ export interface DialogScrollLockOptions {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 默认配置
|
// 默认配置
|
||||||
const DEFAULT_OPTIONS: Required<DialogScrollLockOptions> = {
|
const DEFAULT_OPTIONS: Required<ScrollLockOptions> = {
|
||||||
autoRestore: true,
|
autoRestore: true,
|
||||||
preserveScrollPosition: true,
|
preserveScrollPosition: true,
|
||||||
preventTouchScroll: true,
|
preventTouchScroll: true,
|
||||||
@@ -28,7 +28,7 @@ const DEFAULT_OPTIONS: Required<DialogScrollLockOptions> = {
|
|||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
export function useDialogScrollLock(options: DialogScrollLockOptions = {}) {
|
export function useScrollLock(options: ScrollLockOptions = {}) {
|
||||||
const config = { ...DEFAULT_OPTIONS, ...options }
|
const config = { ...DEFAULT_OPTIONS, ...options }
|
||||||
|
|
||||||
// 状态管理
|
// 状态管理
|
||||||
@@ -189,8 +189,8 @@ export function useDialogScrollLock(options: DialogScrollLockOptions = {}) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 便捷的自动监听版本
|
// 便捷的自动监听版本
|
||||||
export function useDialogScrollLockWithWatch(target: any, options: DialogScrollLockOptions = {}) {
|
export function useScrollLockWithWatch(target: any, options: ScrollLockOptions = {}) {
|
||||||
const scrollLock = useDialogScrollLock(options)
|
const scrollLock = useScrollLock(options)
|
||||||
|
|
||||||
// 自动监听目标值的变化
|
// 自动监听目标值的变化
|
||||||
const stopWatcher = scrollLock.watchTarget(target)
|
const stopWatcher = scrollLock.watchTarget(target)
|
||||||
@@ -18,7 +18,7 @@ import { useRoute } from 'vue-router'
|
|||||||
import { filterMenusByPermission } from '@/utils/permission'
|
import { filterMenusByPermission } from '@/utils/permission'
|
||||||
import { onUnreadMessage } from '@/utils/badge'
|
import { onUnreadMessage } from '@/utils/badge'
|
||||||
import { usePullDownGesture } from '@/composables/usePullDownGesture'
|
import { usePullDownGesture } from '@/composables/usePullDownGesture'
|
||||||
import { useDialogScrollLockWithWatch } from '@/composables/useDialogScrollLock'
|
import { useScrollLockWithWatch } from '@/composables/useScrollLock'
|
||||||
import { usePWA } from '@/composables/usePWA'
|
import { usePWA } from '@/composables/usePWA'
|
||||||
import OfflinePage from '@/layouts/components/OfflinePage.vue'
|
import OfflinePage from '@/layouts/components/OfflinePage.vue'
|
||||||
import { useGlobalOfflineStatus } from '@/composables/useOfflineStatus'
|
import { useGlobalOfflineStatus } from '@/composables/useOfflineStatus'
|
||||||
@@ -164,7 +164,7 @@ const handleServiceWorkerMessage = (event: MessageEvent) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 使用滚动锁定 composable(自动监听showPluginQuickAccess的变化)
|
// 使用滚动锁定 composable(自动监听showPluginQuickAccess的变化)
|
||||||
useDialogScrollLockWithWatch(showPluginQuickAccess)
|
useScrollLockWithWatch(showPluginQuickAccess)
|
||||||
|
|
||||||
// 检查是否可以使用下拉手势
|
// 检查是否可以使用下拉手势
|
||||||
const canUsePullGesture = () => {
|
const canUsePullGesture = () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user