diff --git a/src/components/SimpleProcessDesignerV2/src/SimpleProcessModel.vue b/src/components/SimpleProcessDesignerV2/src/SimpleProcessModel.vue index 8f0a2916..bab336dc 100644 --- a/src/components/SimpleProcessDesignerV2/src/SimpleProcessModel.vue +++ b/src/components/SimpleProcessDesignerV2/src/SimpleProcessModel.vue @@ -26,7 +26,15 @@ -
+
@@ -80,24 +88,41 @@ let scaleValue = ref(100) const MAX_SCALE_VALUE = 200 const MIN_SCALE_VALUE = 50 -// 放大 -const zoomIn = () => { - if (scaleValue.value == MAX_SCALE_VALUE) { - return - } - scaleValue.value += 10 +const isDragging = ref(false) +const startX = ref(0) +const startY = ref(0) +const currentX = ref(0) +const currentY = ref(0) + +const setGrabCursor = () => { + document.body.style.cursor = 'grab'; } -// 缩小 -const zoomOut = () => { - if (scaleValue.value == MIN_SCALE_VALUE) { - return - } - scaleValue.value -= 10 +const resetCursor = () => { + document.body.style.cursor = 'default'; } -const processReZoom = () => { - scaleValue.value = 100 +const startDrag = (e: MouseEvent) => { + isDragging.value = true; + startX.value = e.clientX - currentX.value; + startY.value = e.clientY - currentY.value; + setGrabCursor(); // 设置小手光标 +} + +const onDrag = (e: MouseEvent) => { + if (!isDragging.value) return; + e.preventDefault(); + + // 使用 requestAnimationFrame 优化性能 + requestAnimationFrame(() => { + currentX.value = e.clientX - startX.value; + currentY.value = e.clientY - startY.value; + }); +} + +const stopDrag = () => { + isDragging.value = false; + resetCursor(); // 重置光标 } const errorDialogVisible = ref(false) @@ -193,6 +218,39 @@ const importLocalFile = () => { } } } + +// 放大 +const zoomIn = () => { + if (scaleValue.value == MAX_SCALE_VALUE) { + return + } + scaleValue.value += 10 +} + +// 缩小 +const zoomOut = () => { + if (scaleValue.value == MIN_SCALE_VALUE) { + return + } + scaleValue.value -= 10 +} + +const processReZoom = () => { + scaleValue.value = 100 +} - + diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue index afb152da..8d1d3fc6 100644 --- a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue +++ b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue @@ -1,19 +1,10 @@