mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2025-12-11 18:42:56 +00:00
feat: support PanelDock icon pointer cursor is always pointer
This commit is contained in:
parent
21f74f0cc1
commit
a645af7e0b
@ -95,7 +95,10 @@ function isDragEvent(e: any): e is DragEvent {
|
||||
return e?.type?.startsWith('drag');
|
||||
}
|
||||
|
||||
export interface IDragon extends IPublicModelDragon<INode> {
|
||||
export interface IDragon extends IPublicModelDragon<
|
||||
INode,
|
||||
ILocateEvent
|
||||
> {
|
||||
emitter: IEventBus;
|
||||
}
|
||||
|
||||
|
||||
@ -17,6 +17,7 @@ import {
|
||||
IPublicTypePluginMeta,
|
||||
IPublicTypePluginRegisterOptions,
|
||||
} from '@alilc/lowcode-types';
|
||||
import PluginContext from './plugin-context';
|
||||
|
||||
export type PluginPreference = Map<string, Record<string, IPublicTypePreferenceValueType>>;
|
||||
|
||||
@ -81,6 +82,7 @@ export interface ILowCodePluginManagerCore {
|
||||
delete(pluginName: string): any;
|
||||
setDisabled(pluginName: string, flag: boolean): void;
|
||||
dispose(): void;
|
||||
_getLowCodePluginContext (options: IPluginContextOptions): PluginContext;
|
||||
}
|
||||
|
||||
export type ILowCodePluginManager = ILowCodePluginManagerCore & ILowCodePluginManagerPluginAccessor;
|
||||
|
||||
@ -26,13 +26,11 @@ export class TipContainer extends Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
ReactDOM.createPortal(
|
||||
return ReactDOM.createPortal(
|
||||
<div className="lc-tips-container">
|
||||
<TipItem />
|
||||
</div>,
|
||||
document.querySelector('body')!,
|
||||
);
|
||||
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { Component, isValidElement, ReactNode } from 'react';
|
||||
import classNames from 'classnames';
|
||||
import { createIcon, isI18nData } from '@alilc/lowcode-utils';
|
||||
import { IPublicTypeTitleContent, IPublicTypeI18nData } from '@alilc/lowcode-types';
|
||||
import { createIcon, isI18nData, isTitleConfig } from '@alilc/lowcode-utils';
|
||||
import { IPublicTypeTitleContent, IPublicTypeI18nData, IPublicTypeTitleConfig } from '@alilc/lowcode-types';
|
||||
import { intl } from '../../intl';
|
||||
import { Tip } from '../tip';
|
||||
import './title.less';
|
||||
@ -88,7 +88,8 @@ export class Title extends Component<{
|
||||
|
||||
render() {
|
||||
// eslint-disable-next-line prefer-const
|
||||
let { title, className } = this.props;
|
||||
const { title, className } = this.props;
|
||||
let _title: IPublicTypeTitleConfig;
|
||||
if (title == null) {
|
||||
return null;
|
||||
}
|
||||
@ -96,34 +97,40 @@ export class Title extends Component<{
|
||||
return title;
|
||||
}
|
||||
if (typeof title === 'string' || isI18nData(title)) {
|
||||
title = { label: title };
|
||||
_title = { label: title };
|
||||
} else if (isTitleConfig(title)) {
|
||||
_title = title;
|
||||
} else {
|
||||
_title = {
|
||||
label: title,
|
||||
};
|
||||
}
|
||||
|
||||
const icon = title.icon ? createIcon(title.icon, { size: 20 }) : null;
|
||||
const icon = _title.icon ? createIcon(_title.icon, { size: 20 }) : null;
|
||||
|
||||
let tip: any = null;
|
||||
if (title.tip) {
|
||||
if (isValidElement(title.tip) && title.tip.type === Tip) {
|
||||
tip = title.tip;
|
||||
if (_title.tip) {
|
||||
if (isValidElement(_title.tip) && _title.tip.type === Tip) {
|
||||
tip = _title.tip;
|
||||
} else {
|
||||
const tipProps =
|
||||
typeof title.tip === 'object' && !(isValidElement(title.tip) || isI18nData(title.tip))
|
||||
? title.tip
|
||||
: { children: title.tip };
|
||||
typeof _title.tip === 'object' && !(isValidElement(_title.tip) || isI18nData(_title.tip))
|
||||
? _title.tip
|
||||
: { children: _title.tip };
|
||||
tip = <Tip {...tipProps} />;
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<span
|
||||
className={classNames('lc-title', className, title.className, {
|
||||
className={classNames('lc-title', className, _title.className, {
|
||||
'has-tip': !!tip,
|
||||
'only-icon': !title.label,
|
||||
'only-icon': !_title.label,
|
||||
})}
|
||||
onClick={this.handleClick}
|
||||
>
|
||||
{icon ? <b className="lc-title-icon">{icon}</b> : null}
|
||||
{this.renderLabel(title.label)}
|
||||
{this.renderLabel(_title.label)}
|
||||
{tip}
|
||||
</span>
|
||||
);
|
||||
|
||||
@ -47,6 +47,8 @@ function HelpTip({ tip }: any) {
|
||||
|
||||
@observer
|
||||
export class PanelDockView extends Component<DockProps & { dock: PanelDock }> {
|
||||
private lastActived = false;
|
||||
|
||||
componentDidMount() {
|
||||
this.checkActived();
|
||||
}
|
||||
@ -55,8 +57,6 @@ export class PanelDockView extends Component<DockProps & { dock: PanelDock }> {
|
||||
this.checkActived();
|
||||
}
|
||||
|
||||
private lastActived = false;
|
||||
|
||||
checkActived() {
|
||||
const { dock } = this.props;
|
||||
if (dock.actived !== this.lastActived) {
|
||||
@ -134,7 +134,7 @@ export class DraggableLineView extends Component<{ panel: Panel }> {
|
||||
// 默认 关闭,通过配置开启
|
||||
const enableDrag = this.props.panel.config.props?.enableDrag;
|
||||
const isRightArea = this.props.panel.config?.area === 'rightArea';
|
||||
if (isRightArea || !enableDrag || this.props.panel?.parent.name === 'leftFixedArea') {
|
||||
if (isRightArea || !enableDrag || this.props.panel?.parent?.name === 'leftFixedArea') {
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
@ -159,6 +159,8 @@ export class DraggableLineView extends Component<{ panel: Panel }> {
|
||||
|
||||
@observer
|
||||
export class TitledPanelView extends Component<{ panel: Panel; area?: string }> {
|
||||
private lastVisible = false;
|
||||
|
||||
componentDidMount() {
|
||||
this.checkVisible();
|
||||
}
|
||||
@ -167,8 +169,6 @@ export class TitledPanelView extends Component<{ panel: Panel; area?: string }>
|
||||
this.checkVisible();
|
||||
}
|
||||
|
||||
private lastVisible = false;
|
||||
|
||||
checkVisible() {
|
||||
const { panel } = this.props;
|
||||
const currentVisible = panel.inited && panel.visible;
|
||||
@ -218,6 +218,8 @@ export class PanelView extends Component<{
|
||||
hideOperationRow?: boolean;
|
||||
hideDragLine?: boolean;
|
||||
}> {
|
||||
private lastVisible = false;
|
||||
|
||||
componentDidMount() {
|
||||
this.checkVisible();
|
||||
}
|
||||
@ -226,8 +228,6 @@ export class PanelView extends Component<{
|
||||
this.checkVisible();
|
||||
}
|
||||
|
||||
private lastVisible = false;
|
||||
|
||||
checkVisible() {
|
||||
const { panel } = this.props;
|
||||
const currentVisible = panel.inited && panel.visible;
|
||||
@ -331,6 +331,9 @@ class PanelTitle extends Component<{ panel: Panel; className?: string }> {
|
||||
|
||||
@observer
|
||||
export class WidgetView extends Component<{ widget: IWidget }> {
|
||||
private lastVisible = false;
|
||||
private lastDisabled: boolean | undefined = false;
|
||||
|
||||
componentDidMount() {
|
||||
this.checkVisible();
|
||||
this.checkDisabled();
|
||||
@ -341,9 +344,6 @@ export class WidgetView extends Component<{ widget: IWidget }> {
|
||||
this.checkDisabled();
|
||||
}
|
||||
|
||||
private lastVisible = false;
|
||||
private lastDisabled = false;
|
||||
|
||||
checkVisible() {
|
||||
const { widget } = this.props;
|
||||
const currentVisible = widget.visible;
|
||||
|
||||
@ -323,10 +323,8 @@ body {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
|
||||
&.has-tip {
|
||||
cursor: pointer;
|
||||
}
|
||||
&.actived {
|
||||
color: #0079f2;
|
||||
}
|
||||
|
||||
@ -1,5 +1,7 @@
|
||||
import {
|
||||
IDragon,
|
||||
ILocateEvent as InnerLocateEvent,
|
||||
INode,
|
||||
} from '@alilc/lowcode-designer';
|
||||
import { dragonSymbol, nodeSymbol } from '../symbols';
|
||||
import LocateEvent from './locate-event';
|
||||
@ -11,18 +13,19 @@ import {
|
||||
IPublicModelDragObject,
|
||||
IPublicTypeDragNodeDataObject,
|
||||
IPublicModelNode,
|
||||
IPublicTypeDragObject,
|
||||
} from '@alilc/lowcode-types';
|
||||
|
||||
export const innerDragonSymbol = Symbol('innerDragonSymbol');
|
||||
|
||||
export class Dragon implements IPublicModelDragon {
|
||||
private readonly [innerDragonSymbol]: IPublicModelDragon;
|
||||
private readonly [innerDragonSymbol]: IDragon;
|
||||
|
||||
constructor(innerDragon: IPublicModelDragon, readonly workspaceMode: boolean) {
|
||||
constructor(innerDragon: IDragon, readonly workspaceMode: boolean) {
|
||||
this[innerDragonSymbol] = innerDragon;
|
||||
}
|
||||
|
||||
get [dragonSymbol](): any {
|
||||
get [dragonSymbol](): IDragon {
|
||||
if (this.workspaceMode) {
|
||||
return this[innerDragonSymbol];
|
||||
}
|
||||
@ -38,7 +41,7 @@ export class Dragon implements IPublicModelDragon {
|
||||
}
|
||||
|
||||
static create(
|
||||
dragon: IPublicModelDragon | null,
|
||||
dragon: IDragon | null,
|
||||
workspaceMode: boolean,
|
||||
): IPublicModelDragon | null {
|
||||
if (!dragon) {
|
||||
@ -102,11 +105,13 @@ export class Dragon implements IPublicModelDragon {
|
||||
* @param dragObject 拖拽对象
|
||||
* @param boostEvent 拖拽初始时事件
|
||||
*/
|
||||
boost(dragObject: DragObject, boostEvent: MouseEvent | DragEvent, fromRglNode?: Node | IPublicModelNode): void {
|
||||
boost(dragObject: IPublicTypeDragObject, boostEvent: MouseEvent | DragEvent, fromRglNode?: IPublicModelNode & {
|
||||
[nodeSymbol]: INode;
|
||||
}): void {
|
||||
return this[dragonSymbol].boost({
|
||||
...dragObject,
|
||||
nodes: dragObject.nodes.map((node: any) => node[nodeSymbol]),
|
||||
}, boostEvent, fromRglNode);
|
||||
}, boostEvent, fromRglNode?.[nodeSymbol]);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -1,16 +1,16 @@
|
||||
import { ILocateEvent as InnerLocateEvent } from '@alilc/lowcode-designer';
|
||||
import { ILocateEvent } from '@alilc/lowcode-designer';
|
||||
import { locateEventSymbol } from '../symbols';
|
||||
import { DragObject } from './drag-object';
|
||||
import { IPublicModelLocateEvent, IPublicModelDragObject } from '@alilc/lowcode-types';
|
||||
|
||||
export default class LocateEvent implements IPublicModelLocateEvent {
|
||||
private readonly [locateEventSymbol]: InnerLocateEvent;
|
||||
private readonly [locateEventSymbol]: ILocateEvent;
|
||||
|
||||
constructor(locateEvent: InnerLocateEvent) {
|
||||
constructor(locateEvent: ILocateEvent) {
|
||||
this[locateEventSymbol] = locateEvent;
|
||||
}
|
||||
|
||||
static create(locateEvent: InnerLocateEvent): IPublicModelLocateEvent | null {
|
||||
static create(locateEvent: ILocateEvent): IPublicModelLocateEvent | null {
|
||||
if (!locateEvent) {
|
||||
return null;
|
||||
}
|
||||
|
||||
@ -3,7 +3,8 @@ import { IPublicTypeDragNodeDataObject, IPublicTypeDragObject } from '../type';
|
||||
import { IPublicModelDragObject, IPublicModelLocateEvent, IPublicModelNode } from './';
|
||||
|
||||
export interface IPublicModelDragon<
|
||||
Node = IPublicModelNode
|
||||
Node = IPublicModelNode,
|
||||
LocateEvent = IPublicModelLocateEvent
|
||||
> {
|
||||
|
||||
/**
|
||||
@ -18,7 +19,7 @@ export interface IPublicModelDragon<
|
||||
* @param func
|
||||
* @returns
|
||||
*/
|
||||
onDragstart(func: (e: IPublicModelLocateEvent) => any): () => void;
|
||||
onDragstart(func: (e: LocateEvent) => any): () => void;
|
||||
|
||||
/**
|
||||
* 绑定 drag 事件
|
||||
@ -26,7 +27,7 @@ export interface IPublicModelDragon<
|
||||
* @param func
|
||||
* @returns
|
||||
*/
|
||||
onDrag(func: (e: IPublicModelLocateEvent) => any): () => void;
|
||||
onDrag(func: (e: LocateEvent) => any): () => void;
|
||||
|
||||
/**
|
||||
* 绑定 dragend 事件
|
||||
|
||||
@ -73,7 +73,9 @@ export class Resource implements IResource {
|
||||
|
||||
constructor(readonly resourceData: IPublicResourceData, readonly resourceType: IResourceType, readonly workspace: IWorkspace) {
|
||||
this.context = new BasicContext(workspace, `resource-${resourceData.resourceName || resourceType.name}`);
|
||||
this.resourceTypeInstance = resourceType.resourceTypeModel(this.context.innerPlugins._getLowCodePluginContext(), this.options);
|
||||
this.resourceTypeInstance = resourceType.resourceTypeModel(this.context.innerPlugins._getLowCodePluginContext({
|
||||
pluginName: '',
|
||||
}), this.options);
|
||||
this.init();
|
||||
if (this.resourceTypeInstance.editorViews) {
|
||||
this.resourceTypeInstance.editorViews.forEach((d: any) => {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user