修复Area组件拖拽四角调整大小功能:修正位置计算逻辑
This commit is contained in:
@@ -307,39 +307,39 @@ const onResizeStart = (direction, e) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 调整大小移动
|
// 调整大小移动
|
||||||
const onResizeMove = (e) => {
|
const onResizeMove = (e) => {
|
||||||
if (!isResizing.value) return
|
if (!isResizing.value) return
|
||||||
|
|
||||||
const deltaX = e.clientX - resizeStartPos.value.x
|
const deltaX = e.clientX - resizeStartPos.value.x
|
||||||
const deltaY = e.clientY - resizeStartPos.value.y
|
const deltaY = e.clientY - resizeStartPos.value.y
|
||||||
|
|
||||||
let newWidth = resizeStartSize.value.width
|
let newWidth = resizeStartSize.value.width
|
||||||
let newHeight = resizeStartSize.value.height
|
let newHeight = resizeStartSize.value.height
|
||||||
let newLeft = resizeStartAreaPos.value.left
|
let newLeft = resizeStartAreaPos.value.left
|
||||||
let newTop = resizeStartAreaPos.value.top
|
let newTop = resizeStartAreaPos.value.top
|
||||||
|
|
||||||
// 根据方向调整大小
|
// 根据方向调整大小
|
||||||
switch (resizeDirection.value) {
|
switch (resizeDirection.value) {
|
||||||
case 'nw':
|
case 'nw':
|
||||||
newWidth = Math.max(200, resizeStartSize.value.width - deltaX)
|
newWidth = Math.max(200, resizeStartSize.value.width - deltaX)
|
||||||
newHeight = Math.max(150, resizeStartSize.value.height - deltaY)
|
newHeight = Math.max(150, resizeStartSize.value.height - deltaY)
|
||||||
newLeft = resizeStartPos.value.left + deltaX
|
newLeft = resizeStartAreaPos.value.left + deltaX
|
||||||
newTop = resizeStartPos.value.top + deltaY
|
newTop = resizeStartAreaPos.value.top + deltaY
|
||||||
break
|
break
|
||||||
case 'ne':
|
case 'ne':
|
||||||
newWidth = Math.max(200, resizeStartSize.value.width + deltaX)
|
newWidth = Math.max(200, resizeStartSize.value.width + deltaX)
|
||||||
newHeight = Math.max(150, resizeStartSize.value.height - deltaY)
|
newHeight = Math.max(150, resizeStartSize.value.height - deltaY)
|
||||||
newTop = resizeStartPos.value.top + deltaY
|
newTop = resizeStartAreaPos.value.top + deltaY
|
||||||
break
|
break
|
||||||
case 'sw':
|
case 'sw':
|
||||||
newWidth = Math.max(200, resizeStartSize.value.width - deltaX)
|
newWidth = Math.max(200, resizeStartSize.value.width - deltaX)
|
||||||
newHeight = Math.max(150, resizeStartSize.value.height + deltaY)
|
newHeight = Math.max(150, resizeStartSize.value.height + deltaY)
|
||||||
newLeft = resizeStartPos.value.left + deltaX
|
newLeft = resizeStartAreaPos.value.left + deltaX
|
||||||
break
|
break
|
||||||
case 'se':
|
case 'se':
|
||||||
newWidth = Math.max(200, resizeStartSize.value.width + deltaX)
|
newWidth = Math.max(200, resizeStartSize.value.width + deltaX)
|
||||||
newHeight = Math.max(150, resizeStartSize.value.height + deltaY)
|
newHeight = Math.max(150, resizeStartSize.value.height + deltaY)
|
||||||
break
|
break
|
||||||
case 'n':
|
case 'n':
|
||||||
// 拖动上边框时,Area向上边扩展
|
// 拖动上边框时,Area向上边扩展
|
||||||
newHeight = Math.max(150, resizeStartSize.value.height - deltaY)
|
newHeight = Math.max(150, resizeStartSize.value.height - deltaY)
|
||||||
|
|||||||
Reference in New Issue
Block a user