forked from github/dataease
fix: 修复鼠标滚轮影响大屏画布放大问题
This commit is contained in:
parent
6314e75397
commit
f1cdab14f6
@ -42,20 +42,26 @@ const reposition = () => {
|
|||||||
let lastWheelNum = 0
|
let lastWheelNum = 0
|
||||||
|
|
||||||
const handleMouseWheel = e => {
|
const handleMouseWheel = e => {
|
||||||
const delta = e.wheelDelta ? e.wheelDelta : -e.detail
|
let dvMain = document.getElementById('dv-main-center')
|
||||||
if (lastWheelNum === 240 && delta === 240) {
|
let dvMainLeftSlide = document.getElementById('dv-main-left-sidebar')
|
||||||
//放大
|
let areaLeftWidth = dvMainLeftSlide.clientWidth
|
||||||
scaleIncrease(3)
|
let areaRight = dvMain.clientWidth + areaLeftWidth
|
||||||
} else if (lastWheelNum === -240 && delta === -240) {
|
if (areaLeftWidth < e.clientX && e.clientX < areaRight) {
|
||||||
// 缩小
|
const delta = e.wheelDelta ? e.wheelDelta : -e.detail
|
||||||
scaleDecrease(3)
|
if (lastWheelNum === 240 && delta === 240) {
|
||||||
}
|
//放大
|
||||||
|
scaleIncrease(3)
|
||||||
|
} else if (lastWheelNum === -240 && delta === -240) {
|
||||||
|
// 缩小
|
||||||
|
scaleDecrease(3)
|
||||||
|
}
|
||||||
|
|
||||||
if (delta === 240 || delta === -240) {
|
if (delta === 240 || delta === -240) {
|
||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
|
}
|
||||||
|
lastWheelNum = delta
|
||||||
}
|
}
|
||||||
lastWheelNum = delta
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
@ -227,7 +227,7 @@ onMounted(() => {
|
|||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div class="mark-line">
|
<div class="mark-line" id="canvas-mark-line">
|
||||||
<div
|
<div
|
||||||
v-for="line in lines"
|
v-for="line in lines"
|
||||||
v-show="lineStatus[line] || false"
|
v-show="lineStatus[line] || false"
|
||||||
|
@ -236,14 +236,16 @@ eventBus.on('handleNew', handleNew)
|
|||||||
:aside-position="'left'"
|
:aside-position="'left'"
|
||||||
:side-name="'realTimeComponent'"
|
:side-name="'realTimeComponent'"
|
||||||
class="left-sidebar"
|
class="left-sidebar"
|
||||||
|
id="dv-main-left-sidebar"
|
||||||
:class="{ 'preview-aside': previewStatus }"
|
:class="{ 'preview-aside': previewStatus }"
|
||||||
>
|
>
|
||||||
<RealTimeComponentList />
|
<RealTimeComponentList />
|
||||||
</dv-sidebar>
|
</dv-sidebar>
|
||||||
<!-- 中间画布 -->
|
<!-- 中间画布 -->
|
||||||
<main class="center" ref="canvasCenterRef">
|
<main id="dv-main-center" class="center" ref="canvasCenterRef">
|
||||||
<el-scrollbar ref="canvasOut" class="content" :class="{ 'preview-content': previewStatus }">
|
<el-scrollbar ref="canvasOut" class="content" :class="{ 'preview-content': previewStatus }">
|
||||||
<div
|
<div
|
||||||
|
id="canvas-dv-outer"
|
||||||
ref="canvasInner"
|
ref="canvasInner"
|
||||||
:style="contentStyle"
|
:style="contentStyle"
|
||||||
@drop="handleDrop"
|
@drop="handleDrop"
|
||||||
|
Loading…
Reference in New Issue
Block a user