github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2025-12-12 19:25:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: refine nesting drawer

Browse Source
This commit is contained in:
zyy7259 2022-08-23 16:48:09 +08:00 committed by 刘菊萍(絮黎)
parent 64cc3283c1
commit 94a211e279
1 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
packages/editor-skeleton/src/components/popup/index.tsx
View File

@ -11,7 +11,10 @@ export class PopupPipe {
private currentId?: string; private currentId?: string;
create(props?: object): { send: (content: ReactNode, title: ReactNode) => void; show: (target: Element) => void } { create(props?: object): {
send: (content: ReactNode, title: ReactNode) => void;
show: (target: Element) => void;
} {
let sendContent: ReactNode = null; let sendContent: ReactNode = null;
let sendTitle: ReactNode = null; let sendTitle: ReactNode = null;
const id = uniqueId('popup'); const id = uniqueId('popup');
@ -60,26 +63,30 @@ export class PopupPipe {
} }
} }
export default class PopupService extends Component<{ popupPipe?: PopupPipe; actionKey?: string; safeId?: string }> { export default class PopupService extends Component<{
popupPipe?: PopupPipe;
actionKey?: string;
safeId?: string;
popupContainer?: string;
}> {
private popupPipe = this.props.popupPipe || new PopupPipe(); private popupPipe = this.props.popupPipe || new PopupPipe();
componentWillUnmount() { componentWillUnmount() {
this.popupPipe.purge(); this.popupPipe.purge();
} }
render() { render() {
const { children, actionKey, safeId } = this.props; const { children, actionKey, safeId, popupContainer } = this.props;
return ( return (
<PopupContext.Provider value={this.popupPipe}> <PopupContext.Provider value={this.popupPipe}>
{children} {children}
<PopupContent key={`pop${ actionKey}`} safeId={safeId} /> <PopupContent key={`pop${actionKey}`} safeId={safeId} popupContainer={popupContainer} />
</PopupContext.Provider> </PopupContext.Provider>
); );
} }
} }
export class PopupContent extends PureComponent<{ safeId?: string }> { export class PopupContent extends PureComponent<{ safeId?: string; popupContainer?: string }> {
static contextType = PopupContext; static contextType = PopupContext;
popupContainerId = uniqueId('popupContainer'); popupContainerId = uniqueId('popupContainer');
@ -143,11 +150,11 @@ export class PopupContent extends PureComponent<{ safeId?: string }> {
visible={visible} visible={visible}
offset={[offsetX, 0]} offset={[offsetX, 0]}
hasMask={false} hasMask={false}
onVisibleChange={(visible, type) => { onVisibleChange={(_visible, type) => {
if (avoidLaterHidden) { if (avoidLaterHidden) {
return; return;
} }
if (!visible && type === 'closeClick') { if (!_visible && type === 'closeClick') {
this.setState({ visible: false }); this.setState({ visible: false });
} }
}} }}
@ -159,10 +166,11 @@ export class PopupContent extends PureComponent<{ safeId?: string }> {
id={this.props.safeId} id={this.props.safeId}
safeNode={id} safeNode={id}
closeable closeable
container={this.props.popupContainer}
> >
<div className="lc-ballon-title">{title}</div> <div className="lc-ballon-title">{title}</div>
<div className="lc-ballon-content"> <div className="lc-ballon-content">
<PopupService actionKey={actionKey} safeId={id}> <PopupService actionKey={actionKey} safeId={id} popupContainer={this.popupContainerId}>
<ConfigProvider popupContainer={this.popupContainerId}> <ConfigProvider popupContainer={this.popupContainerId}>
{content} {content}
</ConfigProvider> </ConfigProvider>
@ -170,6 +178,7 @@ export class PopupContent extends PureComponent<{ safeId?: string }> {
</div> </div>
<div id={this.popupContainerId} /> <div id={this.popupContainerId} />
<div id="engine-variable-setter-dialog" /> <div id="engine-variable-setter-dialog" />
<div id="engine-popup-container" />
</Drawer> </Drawer>
); );
} }