diff --git a/app/components/liveMinWindow/index.vue b/app/components/liveMinWindow/index.vue index 351f057..569c31e 100644 --- a/app/components/liveMinWindow/index.vue +++ b/app/components/liveMinWindow/index.vue @@ -47,22 +47,18 @@ const props = defineProps({ const router = useRouter() const dragRef = shallowRef(null) -// 拖动相关状态 const isDragging = ref(false) const startX = ref(0) const startY = ref(0) const left = ref(0) const top = ref(0) -// 初始化位置 onMounted(() => { const rect = dragRef.value.getBoundingClientRect() - // 将 right 值转换为 left 值 left.value = window.innerWidth - rect.width - parseInt(props.initialPosition.right) top.value = parseInt(props.initialPosition.top) }) -// 计算样式 const style = computed(() => ({ left: left.value ? `${left.value}px` : 'auto', top: top.value ? `${top.value}px` : 'auto', @@ -70,19 +66,16 @@ const style = computed(() => ({ transition: isDragging.value ? 'none' : 'all 0.3s ease', })) -// 开始拖动 const handleDragStart = (event) => { event.stopPropagation() isDragging.value = true const point = event.touches ? event.touches[0] : event - // 获取元素当前位置 const rect = dragRef.value.getBoundingClientRect() left.value = rect.left top.value = rect.top - // 记录起始点击位置 startX.value = point.clientX - left.value startY.value = point.clientY - top.value @@ -95,7 +88,6 @@ const handleDragStart = (event) => { } } -// 拖动中 const handleDragMove = useThrottleFn((event) => { if (!isDragging.value) return @@ -111,7 +103,6 @@ const handleDragMove = useThrottleFn((event) => { top.value = Math.min(Math.max(0, point.clientY - startY.value), maxY) }, 16) -// 添加防抖处理边缘吸附 const handleEdgeSnap = useThrottleFn(() => { const rect = dragRef.value.getBoundingClientRect() const centerX = rect.left + rect.width / 2 @@ -121,7 +112,6 @@ const handleEdgeSnap = useThrottleFn(() => { : 16 }, 100) -// 结束拖动 const handleDragEnd = () => { if (!isDragging.value) return @@ -134,14 +124,12 @@ const handleDragEnd = () => { document.removeEventListener('touchend', handleDragEnd) } -// 处理点击事件 const handleClick = (event) => { event.stopPropagation() if (!isDragging.value) { handleReturnLive() } } - const handleReturnLive = () => { router.push('/') props.onClose() @@ -151,7 +139,6 @@ const handleClose = (event) => { event?.stopPropagation() props.onClose() } - onBeforeUnmount(() => { document.removeEventListener('mousemove', handleDragMove) document.removeEventListener('mouseup', handleDragEnd) @@ -159,17 +146,15 @@ onBeforeUnmount(() => { document.removeEventListener('touchend', handleDragEnd) }) -