From 40a9c23e3743b306f42ce4134c51ad5c8929c190 Mon Sep 17 00:00:00 2001
From: pipipi-pikachu <pipipi_pikachu@163.com>
Date: Tue, 18 Jan 2022 23:45:32 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=9B=BE=E7=89=87=E6=97=8B=E8=BD=AC?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E4=B8=8B=E8=A3=81=E5=89=AA=E5=90=8E=E4=BD=8D?=
 =?UTF-8?q?=E7=BD=AE=E4=B8=8D=E6=AD=A3=E7=A1=AE=EF=BC=88#76=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/element/ImageElement/index.vue | 31 ++++++++++++++++---
 1 file changed, 26 insertions(+), 5 deletions(-)

diff --git a/src/views/components/element/ImageElement/index.vue b/src/views/components/element/ImageElement/index.vue
index 250b7d43..2f5e4301 100644
--- a/src/views/components/element/ImageElement/index.vue
+++ b/src/views/components/element/ImageElement/index.vue
@@ -126,13 +126,34 @@ export default defineComponent({
 
       const { range, position } = data
       const originClip: ImageElementClip = props.elementInfo.clip || { shape: 'rect', range: [[0, 0], [100, 100]] }
-      
+
+      const left = props.elementInfo.left + position.left
+      const top = props.elementInfo.top + position.top
+      const width = props.elementInfo.width + position.width
+      const height = props.elementInfo.height + position.height
+
+      let centerOffsetX = 0
+      let centerOffsetY = 0
+
+      if (props.elementInfo.rotate) {
+        const centerX = (left + width / 2) - (props.elementInfo.left + props.elementInfo.width / 2)
+        const centerY = -((top + height / 2) - (props.elementInfo.top + props.elementInfo.height / 2))
+
+        const radian = -props.elementInfo.rotate * Math.PI / 180
+
+        const rotatedCenterX = centerX * Math.cos(radian) - centerY * Math.sin(radian)
+        const rotatedCenterY = centerX * Math.sin(radian) + centerY * Math.cos(radian)
+
+        centerOffsetX = rotatedCenterX - centerX
+        centerOffsetY = -(rotatedCenterY - centerY)
+      }
+
       const _props = {
         clip: { ...originClip, range },
-        left: props.elementInfo.left + position.left,
-        top: props.elementInfo.top + position.top,
-        width: props.elementInfo.width + position.width,
-        height: props.elementInfo.height + position.height,
+        left: left + centerOffsetX,
+        top: top + centerOffsetY,
+        width,
+        height,
       }
       slidesStore.updateElement({ id: props.elementInfo.id, props: _props })