fix: 修复画布设置成自由布局后无法拖动drag-resize改变宽高的问题 (#393)

This commit is contained in:
Gene 2024-04-18 04:23:26 -07:00 committed by GitHub
parent e54edca915
commit a69082f518
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 40 additions and 8 deletions

View File

@ -27,14 +27,46 @@
</div> </div>
<!-- 绝对定位画布时调节元素大小 --> <!-- 绝对定位画布时调节元素大小 -->
<template v-else> <template v-else>
<div class="drag-resize resize-top" @mousedown.stop="onMousedown($event, 'center', 'start')"></div> <div
<div class="drag-resize resize-bottom" @mousedown.stop="onMousedown($event, 'center', 'end')"></div> class="drag-resize resize-top"
<div class="drag-resize resize-left" @mousedown.stop="onMousedown($event, 'start', 'center')"></div> draggable="true"
<div class="drag-resize resize-right" @mousedown.stop="onMousedown($event, 'end', 'center')"></div> @mousedown.stop="onMousedown($event, 'center', 'start')"
<div class="drag-resize resize-top-left" @mousedown.stop="onMousedown($event, 'start', 'start')"></div> ></div>
<div class="drag-resize resize-top-right" @mousedown.stop="onMousedown($event, 'end', 'start')"></div> <div
<div class="drag-resize resize-bottom-left" @mousedown.stop="onMousedown($event, 'start', 'end')"></div> class="drag-resize resize-bottom"
<div class="drag-resize resize-bottom-right" @mousedown.stop="onMousedown($event, 'end', 'end')"></div> draggable="true"
@mousedown.stop="onMousedown($event, 'center', 'end')"
></div>
<div
class="drag-resize resize-left"
draggable="true"
@mousedown.stop="onMousedown($event, 'start', 'center')"
></div>
<div
class="drag-resize resize-right"
draggable="true"
@mousedown.stop="onMousedown($event, 'end', 'center')"
></div>
<div
class="drag-resize resize-top-left"
draggable="true"
@mousedown.stop="onMousedown($event, 'start', 'start')"
></div>
<div
class="drag-resize resize-top-right"
draggable="true"
@mousedown.stop="onMousedown($event, 'end', 'start')"
></div>
<div
class="drag-resize resize-bottom-left"
draggable="true"
@mousedown.stop="onMousedown($event, 'start', 'end')"
></div>
<div
class="drag-resize resize-bottom-right"
draggable="true"
@mousedown.stop="onMousedown($event, 'end', 'end')"
></div>
</template> </template>
<div v-if="showAction" ref="optionRef" class="corner-mark-right" :style="fixStyle"> <div v-if="showAction" ref="optionRef" class="corner-mark-right" :style="fixStyle">
<template v-if="!isModal"> <template v-if="!isModal">