|
|
|
import Dialog from './Dialog';
|
|
|
|
import ContainerRender from '../_util/ContainerRender';
|
|
|
|
import getDialogPropTypes from './IDialogPropTypes';
|
|
|
|
import { getStyle, getClass } from '../_util/props-util';
|
|
|
|
const IDialogPropTypes = getDialogPropTypes();
|
|
|
|
const DialogWrap = {
|
|
|
|
props: {
|
|
|
|
...IDialogPropTypes,
|
|
|
|
visible: IDialogPropTypes.visible.def(false),
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
this.renderComponent = () => {};
|
|
|
|
this.removeContainer = () => {};
|
|
|
|
return {};
|
|
|
|
},
|
|
|
|
|
|
|
|
beforeDestroy() {
|
|
|
|
if (this.visible) {
|
|
|
|
this.renderComponent({
|
|
|
|
afterClose: this.removeContainer,
|
|
|
|
visible: false,
|
|
|
|
on: {
|
|
|
|
close() {},
|
|
|
|
},
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
this.removeContainer();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
getComponent(extra = {}) {
|
|
|
|
const { $attrs, $listeners, $props, $slots } = this;
|
|
|
|
const { on, ...otherProps } = extra;
|
|
|
|
const dialogProps = {
|
|
|
|
props: {
|
|
|
|
...$props,
|
|
|
|
dialogClass: getClass(this),
|
|
|
|
dialogStyle: getStyle(this),
|
|
|
|
...otherProps,
|
|
|
|
},
|
|
|
|
attrs: $attrs,
|
|
|
|
ref: '_component',
|
|
|
|
key: 'dialog',
|
|
|
|
on: {
|
|
|
|
...$listeners,
|
|
|
|
...on,
|
|
|
|
},
|
|
|
|
};
|
|
|
|
return <Dialog {...dialogProps}>{$slots.default}</Dialog>;
|
|
|
|
},
|
|
|
|
|
|
|
|
getContainer2() {
|
|
|
|
const container = document.createElement('div');
|
|
|
|
if (this.getContainer) {
|
|
|
|
this.getContainer().appendChild(container);
|
|
|
|
} else {
|
|
|
|
document.body.appendChild(container);
|
|
|
|
}
|
|
|
|
return container;
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
render() {
|
|
|
|
const { visible } = this;
|
|
|
|
return (
|
|
|
|
<ContainerRender
|
|
|
|
parent={this}
|
|
|
|
visible={visible}
|
|
|
|
autoDestroy={false}
|
|
|
|
getComponent={this.getComponent}
|
|
|
|
getContainer={this.getContainer2}
|
|
|
|
children={({ renderComponent, removeContainer }) => {
|
|
|
|
this.renderComponent = renderComponent;
|
|
|
|
this.removeContainer = removeContainer;
|
|
|
|
return null;
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
export default DialogWrap;
|