diff --git a/packages/canvas/src/components/container/CanvasMenu.vue b/packages/canvas/src/components/container/CanvasMenu.vue index c1f568dac..26ce7ce3a 100644 --- a/packages/canvas/src/components/container/CanvasMenu.vue +++ b/packages/canvas/src/components/container/CanvasMenu.vue @@ -4,9 +4,12 @@
  • {{ item.name }} @@ -98,7 +101,8 @@ export default { items: [ { name: '文字提示', code: 'wrap', value: 'TinyTooltip' }, { name: '弹出框', code: 'wrap', value: 'TinyPopover' } - ] + ], + code: 'addParent' }, { name: '删除', code: 'del' }, { name: '复制', code: 'copy' }, @@ -111,10 +115,10 @@ export default { const operations = { del() { - removeNodeById(getCurrent().schema.id) + removeNodeById(getCurrent().schema?.id) }, copy() { - copyNode(getCurrent().schema.id) + copyNode(getCurrent().schema?.id) }, config() { useLayout().activeSetting('props') @@ -128,17 +132,19 @@ export default { wrap({ value, name }) { const componentName = value || name const { schema, parent } = getCurrent() - const index = parent.children.indexOf(schema) - const wrapSchema = { - componentName, - id: null, - props: {}, - children: [schema] + if (schema && parent) { + const index = parent.children.indexOf(schema) + const wrapSchema = { + componentName, + id: null, + props: {}, + children: [schema] + } + + parent.children.splice(index, 1, wrapSchema) + + getController().addHistory() } - - parent.children.splice(index, 1, wrapSchema) - - getController().addHistory() }, createBlock() { if (useCanvas().isSaved()) { @@ -152,16 +158,25 @@ export default { } } + const actionDisabled = (actionItem) => { + const actions = ['del', 'copy', 'addParent'] + return actions.includes(actionItem.code) && !getCurrent().schema?.id + } + + const onShowChildrenMenu = (menuItem) => { + current.value = !actionDisabled(menuItem) ? menuItem : null + } + const close = () => { boxVisibility.value = false } const doOperation = (item) => { - if (item.check && !item.check?.()) { + if ((item.check && !item.check?.()) || actionDisabled(item)) { return } if (item?.code) { - operations[item.code](item) + operations[item.code]?.(item) closeMenu() } } @@ -173,7 +188,9 @@ export default { boxVisibility, close, current, - menuDom + menuDom, + actionDisabled, + onShowChildrenMenu } } } @@ -196,6 +213,10 @@ export default { .li-item { border-bottom: 1px solid var(--ti-lowcode-canvas-menu-border-color); } + .li-item-disabled { + cursor: not-allowed; + color: var(--ti-lowcode-canvas-menu-item-disabled-color); + } li { & > div { display: flex; diff --git a/packages/canvas/src/components/container/container.js b/packages/canvas/src/components/container/container.js index e65549fef..10fd4d341 100644 --- a/packages/canvas/src/components/container/container.js +++ b/packages/canvas/src/components/container/container.js @@ -249,6 +249,9 @@ export const addComponent = (data, position) => { } export const copyNode = (id) => { + if (!id) { + return + } const { node, parent } = getNode(id, true) inserAfter({ parent, node, data: copyObject(node) })