diff --git a/packages/editor/src/Editor.vue b/packages/editor/src/Editor.vue index d843fe27..6fc125f6 100644 --- a/packages/editor/src/Editor.vue +++ b/packages/editor/src/Editor.vue @@ -218,6 +218,10 @@ export default defineComponent({ updateDragEl: { type: Function as PropType, }, + + disabledDragStart: { + type: Boolean, + }, }, emits: ['props-panel-mounted', 'update:modelValue'], @@ -351,6 +355,7 @@ export default defineComponent({ containerHighlightClassName: props.containerHighlightClassName, containerHighlightDuration: props.containerHighlightDuration, containerHighlightType: props.containerHighlightType, + disabledDragStart: props.disabledDragStart, }), ); diff --git a/packages/editor/src/type.ts b/packages/editor/src/type.ts index c3918736..d11e98fc 100644 --- a/packages/editor/src/type.ts +++ b/packages/editor/src/type.ts @@ -62,6 +62,7 @@ export interface StageOptions { containerHighlightClassName: string; containerHighlightDuration: number; containerHighlightType: ContainerHighlightType; + disabledDragStart?: boolean; render: (stage: StageCore) => HTMLDivElement | Promise; moveableOptions: MoveableOptions | ((config?: CustomizeMoveableOptionsCallbackConfig) => MoveableOptions); canSelect: (el: HTMLElement) => boolean | Promise; diff --git a/packages/editor/src/utils/stage.ts b/packages/editor/src/utils/stage.ts index 7ea2f295..20a12b44 100644 --- a/packages/editor/src/utils/stage.ts +++ b/packages/editor/src/utils/stage.ts @@ -26,6 +26,7 @@ export const useStage = (stageOptions: StageOptions) => { containerHighlightClassName: stageOptions.containerHighlightClassName, containerHighlightDuration: stageOptions.containerHighlightDuration, containerHighlightType: stageOptions.containerHighlightType, + disabledDragStart: stageOptions.disabledDragStart, canSelect: (el, event, stop) => { const elCanSelect = stageOptions.canSelect(el); // 在组件联动过程中不能再往下选择,返回并触发 ui-select diff --git a/packages/stage/src/ActionManager.ts b/packages/stage/src/ActionManager.ts index bf8a606c..4f0b3547 100644 --- a/packages/stage/src/ActionManager.ts +++ b/packages/stage/src/ActionManager.ts @@ -102,6 +102,7 @@ export default class ActionManager extends EventEmitter { this.dr = new StageDragResize({ container: config.container, + disabledDragStart: config.disabledDragStart, getRootContainer: config.getRootContainer, getRenderDocument: config.getRenderDocument, updateDragEl: config.updateDragEl, diff --git a/packages/stage/src/StageCore.ts b/packages/stage/src/StageCore.ts index feac9806..56ddc6ce 100644 --- a/packages/stage/src/StageCore.ts +++ b/packages/stage/src/StageCore.ts @@ -241,6 +241,7 @@ export default class StageCore extends EventEmitter { moveableOptions: config.moveableOptions, multiMoveableOptions: config.multiMoveableOptions, container: this.mask.content, + disabledDragStart: config.disabledDragStart, canSelect: config.canSelect, isContainer: config.isContainer, updateDragEl: config.updateDragEl, diff --git a/packages/stage/src/StageDragResize.ts b/packages/stage/src/StageDragResize.ts index 6800b04c..cd7b051b 100644 --- a/packages/stage/src/StageDragResize.ts +++ b/packages/stage/src/StageDragResize.ts @@ -38,6 +38,7 @@ export default class StageDragResize extends MoveableOptionsManager { /** 拖动状态 */ private dragStatus: StageDragStatus = StageDragStatus.END; private dragResizeHelper: DragResizeHelper; + private disabledDragStart?: boolean; private getRenderDocument: GetRenderDocument; private markContainerEnd: MarkContainerEnd; private delayedMarkContainer: DelayedMarkContainer; @@ -48,6 +49,7 @@ export default class StageDragResize extends MoveableOptionsManager { this.getRenderDocument = config.getRenderDocument; this.markContainerEnd = config.markContainerEnd; this.delayedMarkContainer = config.delayedMarkContainer; + this.disabledDragStart = config.disabledDragStart; this.dragResizeHelper = new DragResizeHelper({ container: config.container, @@ -75,7 +77,7 @@ export default class StageDragResize extends MoveableOptionsManager { this.updateMoveable(el); } - if (event) { + if (event && !this.disabledDragStart) { this.moveable?.dragStart(event); } } diff --git a/packages/stage/src/types.ts b/packages/stage/src/types.ts index b1c9d7d1..7b729e8e 100644 --- a/packages/stage/src/types.ts +++ b/packages/stage/src/types.ts @@ -70,6 +70,7 @@ export interface StageCoreConfig { render?: (renderer: StageCore) => Promise | HTMLElement; autoScrollIntoView?: boolean; updateDragEl?: UpdateDragEl; + disabledDragStart?: boolean; } export interface ActionManagerConfig { @@ -79,6 +80,7 @@ export interface ActionManagerConfig { containerHighlightType?: ContainerHighlightType; moveableOptions?: CustomizeMoveableOptions; multiMoveableOptions?: CustomizeMoveableOptions; + disabledDragStart?: boolean; canSelect?: CanSelect; isContainer: IsContainer; getRootContainer: GetRootContainer; @@ -111,6 +113,7 @@ export interface StageMaskConfig { export interface StageDragResizeConfig { container: HTMLElement; moveableOptions?: CustomizeMoveableOptions; + disabledDragStart?: boolean; getRootContainer: GetRootContainer; getRenderDocument: GetRenderDocument; markContainerEnd: MarkContainerEnd;