mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2025-04-06 03:57:56 +08:00
fix(editor): 组件树右键菜单子菜单出不来
This commit is contained in:
parent
faa6c6d9fe
commit
be4df0fc9b
@ -3,8 +3,8 @@
|
|||||||
<div
|
<div
|
||||||
v-if="node.items"
|
v-if="node.items"
|
||||||
class="magic-editor-content-menu-item"
|
class="magic-editor-content-menu-item"
|
||||||
@mouseenter="setSubVisiable(true)"
|
@mouseenter="setSubVisitable(true)"
|
||||||
@mouseleave="setSubVisiable(false)"
|
@mouseleave="setSubVisitable(false)"
|
||||||
>
|
>
|
||||||
新增
|
新增
|
||||||
</div>
|
</div>
|
||||||
@ -16,7 +16,7 @@
|
|||||||
>
|
>
|
||||||
删除
|
删除
|
||||||
</div>
|
</div>
|
||||||
<div class="subMenu" v-show="subVisible" @mouseenter="setSubVisiable(true)" @mouseleave="setSubVisiable(false)">
|
<div class="subMenu" v-show="subVisible" @mouseenter="setSubVisitable(true)" @mouseleave="setSubVisitable(false)">
|
||||||
<el-scrollbar>
|
<el-scrollbar>
|
||||||
<template v-if="node.type === 'tabs'">
|
<template v-if="node.type === 'tabs'">
|
||||||
<div
|
<div
|
||||||
@ -31,20 +31,8 @@
|
|||||||
标签
|
标签
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template v-else-if="node.type === 'app'">
|
|
||||||
<div
|
|
||||||
class="magic-editor-content-menu-item"
|
|
||||||
v-for="item in menu.app"
|
|
||||||
:key="item.type"
|
|
||||||
@click="() => append(item)"
|
|
||||||
>
|
|
||||||
{{ item.text }}
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-else-if="node.items">
|
<template v-else-if="node.items">
|
||||||
<div v-for="list in menu.component" :key="list.title">
|
<div v-for="list in componentGroupList" :key="list.title">
|
||||||
<template v-for="item in list.items">
|
<template v-for="item in list.items">
|
||||||
<div class="magic-editor-content-menu-item" v-if="item" :key="item.type" @click="() => append(item)">
|
<div class="magic-editor-content-menu-item" v-if="item" :key="item.type" @click="() => append(item)">
|
||||||
{{ item.text }}
|
{{ item.text }}
|
||||||
@ -59,21 +47,16 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, defineComponent, inject, PropType, ref } from 'vue';
|
import { computed, defineComponent, inject, ref } from 'vue';
|
||||||
|
|
||||||
import type { ComponentGroup, Services } from '@editor/type';
|
import type { MNode } from '@tmagic/schema';
|
||||||
|
|
||||||
|
import type { AddMNode, Services } from '@editor/type';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'magic-editor-content-menu',
|
name: 'magic-editor-content-menu',
|
||||||
|
|
||||||
props: {
|
setup() {
|
||||||
componentGroupList: {
|
|
||||||
type: Array as PropType<ComponentGroup[]>,
|
|
||||||
default: () => [],
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
setup(props) {
|
|
||||||
const services = inject<Services>('services');
|
const services = inject<Services>('services');
|
||||||
const subVisible = ref(false);
|
const subVisible = ref(false);
|
||||||
const node = computed(() => services?.editorService.get('node'));
|
const node = computed(() => services?.editorService.get('node'));
|
||||||
@ -83,17 +66,9 @@ export default defineComponent({
|
|||||||
|
|
||||||
node,
|
node,
|
||||||
|
|
||||||
menu: computed(() => ({
|
componentGroupList: computed(() => services?.componentListService.getList()),
|
||||||
app: [
|
|
||||||
{
|
|
||||||
type: 'page',
|
|
||||||
text: '页面',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
component: props.componentGroupList,
|
|
||||||
})),
|
|
||||||
|
|
||||||
append(config: any) {
|
append(config: AddMNode) {
|
||||||
services?.editorService.add({
|
services?.editorService.add({
|
||||||
name: config.text,
|
name: config.text,
|
||||||
type: config.type,
|
type: config.type,
|
||||||
@ -104,11 +79,11 @@ export default defineComponent({
|
|||||||
node.value && services?.editorService.remove(node.value);
|
node.value && services?.editorService.remove(node.value);
|
||||||
},
|
},
|
||||||
|
|
||||||
copy(node: any) {
|
copy(node?: MNode) {
|
||||||
services?.editorService.copy(node);
|
node && services?.editorService.copy(node);
|
||||||
},
|
},
|
||||||
|
|
||||||
setSubVisiable(v: any) {
|
setSubVisitable(v: boolean) {
|
||||||
subVisible.value = v;
|
subVisible.value = v;
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
Loading…
x
Reference in New Issue
Block a user