fix(editor): 多选后拖动,组件树会收缩

This commit is contained in:
roymondchen 2022-10-14 15:51:56 +08:00 committed by jia000
parent a6ecbb66d1
commit 40410292d7
4 changed files with 22 additions and 25 deletions

View File

@ -33,7 +33,7 @@
</slot> </slot>
</template> </template>
<template v-if="pageLength > 0" #right> <template v-if="pageLength > 0 && nodes.length === 1" #right>
<TMagicScrollbar> <TMagicScrollbar>
<slot name="props-panel"></slot> <slot name="props-panel"></slot>
</TMagicScrollbar> </TMagicScrollbar>
@ -68,6 +68,7 @@ withDefaults(
const { editorService, uiService } = inject<Services>('services') || {}; const { editorService, uiService } = inject<Services>('services') || {};
const root = computed(() => editorService?.get<MApp>('root')); const root = computed(() => editorService?.get<MApp>('root'));
const nodes = computed(() => editorService?.get<Node[]>('nodes') || []);
const pageLength = computed(() => editorService?.get<number>('pageLength') || 0); const pageLength = computed(() => editorService?.get<number>('pageLength') || 0);
const showSrc = computed(() => uiService?.get<boolean>('showSrc')); const showSrc = computed(() => uiService?.get<boolean>('showSrc'));

View File

@ -215,12 +215,8 @@ const expandNodes = () => {
}); });
}; };
watch( watch([() => editorService?.get('nodes'), tree], ([nodes]) => {
() => editorService?.get('nodes'), if (!tree.value || !editorService || !nodes) return;
(nodes) => {
if (!tree.value) return;
if (!editorService) return;
if (!nodes) return;
selectedNodes.value = nodes as unknown as MNode[]; selectedNodes.value = nodes as unknown as MNode[];
const parent = editorService.get('parent'); const parent = editorService.get('parent');
@ -238,8 +234,7 @@ watch(
}); });
expandNodes(); expandNodes();
}); });
}, });
);
// //
const setTreeKeyStatus = () => { const setTreeKeyStatus = () => {

View File

@ -484,10 +484,10 @@ class Editor extends BaseService {
parentNodeItems[index] = newConfig; parentNodeItems[index] = newConfig;
// 将update后的配置更新到nodes中 // 将update后的配置更新到nodes中
const nodes = this.get('nodes'); const nodes = this.get<MNode[]>('nodes') || [];
const targetIndex = nodes.findIndex((nodeItem: MNode) => `${nodeItem.id}` === `${newConfig.id}`); const targetIndex = nodes.findIndex((nodeItem: MNode) => `${nodeItem.id}` === `${newConfig.id}`);
nodes.splice(targetIndex, 1, newConfig); nodes.splice(targetIndex, 1, newConfig);
this.set('nodes', nodes); this.set('nodes', [...nodes]);
this.get<StageCore | null>('stage')?.update({ this.get<StageCore | null>('stage')?.update({
config: cloneDeep(newConfig), config: cloneDeep(newConfig),

View File

@ -46,6 +46,7 @@ export const useStage = (stageOptions: StageOptions) => {
]); ]);
stage.on('select', (el: HTMLElement) => { stage.on('select', (el: HTMLElement) => {
if (`${editorService.get('node')?.id}` === el.id) return;
editorService.select(el.id); editorService.select(el.id);
}); });