mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-03-10 18:06:02 +00:00
feat: 支持绝对布局容器中不显示 dragHost
This commit is contained in:
parent
4670a38666
commit
6eb94361b1
@ -1,5 +1,5 @@
|
|||||||
import { obx, autorun, computed, getPublicPath, hotkey, focusTracker } from '@ali/lowcode-editor-core';
|
import { obx, autorun, computed, getPublicPath, hotkey, focusTracker } from '@ali/lowcode-editor-core';
|
||||||
import { ISimulatorHost, Component, NodeInstance, ComponentInstance } from '../simulator';
|
import { ISimulatorHost, Component, NodeInstance, ComponentInstance, DropContainer } from '../simulator';
|
||||||
import Viewport from './viewport';
|
import Viewport from './viewport';
|
||||||
import { createSimulator } from './create-simulator';
|
import { createSimulator } from './create-simulator';
|
||||||
import { Node, ParentalNode, isNode, contains, isRootNode } from '../document';
|
import { Node, ParentalNode, isNode, contains, isRootNode } from '../document';
|
||||||
@ -1085,7 +1085,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
|
|||||||
/**
|
/**
|
||||||
* 查找合适的投放容器
|
* 查找合适的投放容器
|
||||||
*/
|
*/
|
||||||
getDropContainer(e: LocateEvent): DropContainer | LocationData | null {
|
getDropContainer(e: LocateEvent): DropContainer | null {
|
||||||
const { target, dragObject } = e;
|
const { target, dragObject } = e;
|
||||||
const isAny = isDragAnyObject(dragObject);
|
const isAny = isDragAnyObject(dragObject);
|
||||||
const document = this.project.currentDocument!;
|
const document = this.project.currentDocument!;
|
||||||
@ -1156,9 +1156,9 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
|
|||||||
let upward: DropContainer | null = null;
|
let upward: DropContainer | null = null;
|
||||||
while (container) {
|
while (container) {
|
||||||
res = this.handleAccept(dropContainer, e);
|
res = this.handleAccept(dropContainer, e);
|
||||||
if (isLocationData(res)) {
|
// if (isLocationData(res)) {
|
||||||
return res;
|
// return res;
|
||||||
}
|
// }
|
||||||
if (res === true) {
|
if (res === true) {
|
||||||
return dropContainer;
|
return dropContainer;
|
||||||
}
|
}
|
||||||
@ -1214,7 +1214,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
|
|||||||
/**
|
/**
|
||||||
* 控制接受
|
* 控制接受
|
||||||
*/
|
*/
|
||||||
handleAccept({ container, instance }: DropContainer, e: LocateEvent) {
|
handleAccept({ container, instance }: DropContainer, e: LocateEvent): boolean {
|
||||||
const { dragObject } = e;
|
const { dragObject } = e;
|
||||||
const document = this.currentDocument!;
|
const document = this.currentDocument!;
|
||||||
if (isRootNode(container)) {
|
if (isRootNode(container)) {
|
||||||
@ -1392,8 +1392,3 @@ function getMatched(elements: Array<Element | Text>, selector: string): Element
|
|||||||
}
|
}
|
||||||
return firstQueried;
|
return firstQueried;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface DropContainer {
|
|
||||||
container: ParentalNode;
|
|
||||||
instance: ComponentInstance;
|
|
||||||
}
|
|
||||||
|
|||||||
@ -2,6 +2,7 @@ import { Component } from 'react';
|
|||||||
import { observer, obx, Title } from '@ali/lowcode-editor-core';
|
import { observer, obx, Title } from '@ali/lowcode-editor-core';
|
||||||
import { Designer } from '../designer';
|
import { Designer } from '../designer';
|
||||||
import { DragObject, isDragNodeObject, isDragNodeDataObject } from '../dragon';
|
import { DragObject, isDragNodeObject, isDragNodeDataObject } from '../dragon';
|
||||||
|
import { isSimulatorHost } from '../../simulator';
|
||||||
import './ghost.less';
|
import './ghost.less';
|
||||||
|
|
||||||
type offBinding = () => any;
|
type offBinding = () => any;
|
||||||
@ -16,6 +17,8 @@ export default class DragGhost extends Component<{ designer: Designer }> {
|
|||||||
|
|
||||||
@obx.ref private y = 0;
|
@obx.ref private y = 0;
|
||||||
|
|
||||||
|
@obx private isAbsoluteLayoutContainer = false;
|
||||||
|
|
||||||
private dragon = this.props.designer.dragon;
|
private dragon = this.props.designer.dragon;
|
||||||
|
|
||||||
constructor(props: any) {
|
constructor(props: any) {
|
||||||
@ -32,6 +35,14 @@ export default class DragGhost extends Component<{ designer: Designer }> {
|
|||||||
this.dragon.onDrag(e => {
|
this.dragon.onDrag(e => {
|
||||||
this.x = e.globalX;
|
this.x = e.globalX;
|
||||||
this.y = e.globalY;
|
this.y = e.globalY;
|
||||||
|
if (isSimulatorHost(e.sensor)) {
|
||||||
|
const container = e.sensor.getDropContainer(e);
|
||||||
|
if (container.container.componentMeta.getMetadata().experimental?.isAbsoluteLayoutContainer) {
|
||||||
|
this.isAbsoluteLayoutContainer = true;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.isAbsoluteLayoutContainer = false;
|
||||||
}),
|
}),
|
||||||
this.dragon.onDragend(() => {
|
this.dragon.onDragend(() => {
|
||||||
this.dragObject = null;
|
this.dragObject = null;
|
||||||
@ -84,6 +95,10 @@ export default class DragGhost extends Component<{ designer: Designer }> {
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (this.isAbsoluteLayoutContainer) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="lc-ghost-group"
|
className="lc-ghost-group"
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import { Component as ReactComponent, ComponentType } from 'react';
|
import { Component as ReactComponent, ComponentType } from 'react';
|
||||||
import { ComponentMetadata, NodeSchema } from '@ali/lowcode-types';
|
import { ComponentMetadata, NodeSchema } from '@ali/lowcode-types';
|
||||||
import { ISensor, Point, ScrollTarget, IScrollable } from './designer';
|
import { ISensor, Point, ScrollTarget, IScrollable, LocateEvent, LocationData } from './designer';
|
||||||
import { Node } from './document';
|
import { Node, ParentalNode } from './document';
|
||||||
|
|
||||||
export type AutoFit = '100%';
|
export type AutoFit = '100%';
|
||||||
export const AutoFit = '100%';
|
export const AutoFit = '100%';
|
||||||
@ -60,6 +60,11 @@ export interface IViewport extends IScrollable {
|
|||||||
toGlobalPoint(point: Point): Point;
|
toGlobalPoint(point: Point): Point;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface DropContainer {
|
||||||
|
container: ParentalNode;
|
||||||
|
instance: ComponentInstance;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 模拟器控制进程协议
|
* 模拟器控制进程协议
|
||||||
*/
|
*/
|
||||||
@ -143,6 +148,8 @@ export interface ISimulatorHost<P = object> extends ISensor {
|
|||||||
|
|
||||||
findDOMNodes(instance: ComponentInstance, selector?: string): Array<Element | Text> | null;
|
findDOMNodes(instance: ComponentInstance, selector?: string): Array<Element | Text> | null;
|
||||||
|
|
||||||
|
getDropContainer(e: LocateEvent): DropContainer | null;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 销毁
|
* 销毁
|
||||||
*/
|
*/
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user