JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-09-19 12:14:27 +08:00
Code Issues Projects Releases Wiki Activity

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

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

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

* 修改代码格式

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

Co-authored-by: jia000 <398009049@qq.com>
This commit is contained in:
i33 2022-07-28 13:47:54 +08:00 committed by GitHub
parent fff587d9eb
commit 340eeb32d7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/editor/src/layouts/sidebar/LayerPanel.vue
View File

@ -61,12 +61,14 @@ import type { ElTree } from 'element-plus';
import { throttle } from 'lodash-es'; import { throttle } from 'lodash-es';
import type { MNode, MPage } from '@tmagic/schema'; import type { MNode, MPage } from '@tmagic/schema';
import { NodeType } from '@tmagic/schema'; import { MContainer, NodeType } from '@tmagic/schema';
import StageCore from '@tmagic/stage'; import StageCore from '@tmagic/stage';
import type { EditorService } from '@editor/services/editor'; import type { EditorService } from '@editor/services/editor';
import type { Services } from '@editor/type'; import type { Services } from '@editor/type';
import { Layout } from '@editor/type';
import LayerMenu from './LayerMenu.vue';
import LayerMenu from './LayerMenu.vue'; import LayerMenu from './LayerMenu.vue';
const throttleTime = 150; const throttleTime = 150;
@ -104,8 +106,16 @@ const useDrop = (tree: Ref<InstanceType<typeof ElTree> | undefined>, editorServi
return false; return false;
}, },
handleDragEnd() { async handleDragEnd(e: any) {
if (!tree.value) return; 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 { data } = tree.value;
const [page] = data as [MPage]; const [page] = data as [MPage];
editorService?.update(page); editorService?.update(page);