mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2025-09-22 23:20:00 +08:00
feat(editor): 缓存可选组件菜单置于顶层状态
This commit is contained in:
parent
1c3f8abaf4
commit
263533f09a
@ -126,17 +126,13 @@ const setPosition = (e: { clientY: number; clientX: number }) => {
|
|||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
const show = (e?: MouseEvent) => {
|
const show = (e?: { clientY: number; clientX: number }) => {
|
||||||
// 加settimeout是以为,如果菜单中的按钮监听的是mouseup,那么菜单显示出来时鼠标如果正好在菜单上就会马上触发按钮的mouseup
|
// 加settimeout是以为,如果菜单中的按钮监听的是mouseup,那么菜单显示出来时鼠标如果正好在菜单上就会马上触发按钮的mouseup
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
visible.value = true;
|
visible.value = true;
|
||||||
|
|
||||||
if (!e) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
setPosition(e);
|
e && setPosition(e);
|
||||||
|
|
||||||
emit('show');
|
emit('show');
|
||||||
});
|
});
|
||||||
|
@ -26,11 +26,15 @@ import ContentMenu from '@editor/components/ContentMenu.vue';
|
|||||||
import type { ComponentItem, MenuButton, Services } from '@editor/type';
|
import type { ComponentItem, MenuButton, Services } from '@editor/type';
|
||||||
|
|
||||||
import NodeListMenuTitle from './NodeListMenuTitle.vue';
|
import NodeListMenuTitle from './NodeListMenuTitle.vue';
|
||||||
|
|
||||||
|
const PINNED_STATUE_CACHE_KEY = 'tmagic-pinned-node-list-pinned-status';
|
||||||
|
|
||||||
const props = defineProps<{ isMultiSelect?: boolean }>();
|
const props = defineProps<{ isMultiSelect?: boolean }>();
|
||||||
|
|
||||||
const menu = ref<InstanceType<typeof ContentMenu>>();
|
const menu = ref<InstanceType<typeof ContentMenu>>();
|
||||||
const nodeList = ref<MNode[]>([]);
|
const nodeList = ref<MNode[]>([]);
|
||||||
const pinned = ref(false);
|
const pinned = ref(Boolean(globalThis.localStorage.getItem(PINNED_STATUE_CACHE_KEY)));
|
||||||
|
const firstShow = ref(true);
|
||||||
|
|
||||||
const services = inject<Services>('services');
|
const services = inject<Services>('services');
|
||||||
const editorService = services?.editorService;
|
const editorService = services?.editorService;
|
||||||
@ -94,7 +98,8 @@ const unWatch = watch(
|
|||||||
nodeList.value = nodes;
|
nodeList.value = nodes;
|
||||||
|
|
||||||
if (nodeList.value.length > 1) {
|
if (nodeList.value.length > 1) {
|
||||||
menu.value?.show(pinned.value ? undefined : event);
|
menu.value?.show(pinned.value && !firstShow.value ? undefined : event);
|
||||||
|
firstShow.value = false;
|
||||||
}
|
}
|
||||||
}, 1500);
|
}, 1500);
|
||||||
});
|
});
|
||||||
@ -163,4 +168,8 @@ const dragMenuHandler = ({ deltaY, deltaX }: OnDrag) => {
|
|||||||
const closeHandler = () => {
|
const closeHandler = () => {
|
||||||
menu.value?.hide();
|
menu.value?.hide();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
watch(pinned, () => {
|
||||||
|
globalThis.localStorage.setItem(PINNED_STATUE_CACHE_KEY, pinned.value.toString());
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user