From 340eeb32d7620fcb58e2aa7b1ca9d8345630319b Mon Sep 17 00:00:00 2001
From: i33 <78162524@qq.com>
Date: Thu, 28 Jul 2022 13:47:54 +0800
Subject: [PATCH] =?UTF-8?q?fix(editor):=20=E5=B7=B2=E9=80=89=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E6=A0=91=E5=BD=A2=E6=8B=96=E6=94=BE=E6=97=B6,=20layou?=
 =?UTF-8?q?t=20=E6=A0=B9=E6=8D=AE=E7=88=B6=E7=AA=97=E5=8F=A3=E5=8A=A8?=
 =?UTF-8?q?=E6=80=81=E5=8F=98=E5=8C=96=20(#210)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix(editor): 已选组件树形拖放时, layout 根据父窗口动态变化

当拖拽到不同的父节点时, 自身节点的position不会根据父容器变化

* 修改代码格式

Co-authored-by: jia000 <398009049@qq.com>

Co-authored-by: jia000 <398009049@qq.com>
---
 packages/editor/src/layouts/sidebar/LayerPanel.vue | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/editor/src/layouts/sidebar/LayerPanel.vue b/packages/editor/src/layouts/sidebar/LayerPanel.vue
index ba5d635d..a6fda6a3 100644
--- a/packages/editor/src/layouts/sidebar/LayerPanel.vue
+++ b/packages/editor/src/layouts/sidebar/LayerPanel.vue
@@ -61,12 +61,14 @@ import type { ElTree } from 'element-plus';
 import { throttle } from 'lodash-es';
 
 import type { MNode, MPage } from '@tmagic/schema';
-import { NodeType } from '@tmagic/schema';
+import { MContainer, NodeType } from '@tmagic/schema';
 import StageCore from '@tmagic/stage';
 
 import type { EditorService } from '@editor/services/editor';
 import type { Services } from '@editor/type';
+import { Layout } from '@editor/type';
 
+import LayerMenu from './LayerMenu.vue';
 import LayerMenu from './LayerMenu.vue';
 
 const throttleTime = 150;
@@ -104,8 +106,16 @@ const useDrop = (tree: Ref<InstanceType<typeof ElTree> | undefined>, editorServi
     return false;
   },
 
-  handleDragEnd() {
+  async handleDragEnd(e: any) {
     if (!tree.value) return;
+    const { data: node } = e;
+    const parent = editorService?.getParentById(node.id, false) as MContainer;
+    const layout = await editorService?.getLayout(parent);
+    node.style.position = layout;
+    if (layout === Layout.RELATIVE) {
+      node.style.top = 0;
+      node.style.left = 0;
+    }
     const { data } = tree.value;
     const [page] = data as [MPage];
     editorService?.update(page);