You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
ant-design-vue/components/modal/useModal/HookModal.tsx

74 lines
2.3 KiB

import type { PropType } from 'vue';
import { computed, defineComponent } from 'vue';
import { useConfigContextInject } from '../../config-provider/context';
import { useLocaleReceiver } from '../../locale-provider/LocaleReceiver';
import defaultLocale from '../../locale/en_US';
import ConfirmDialog from '../ConfirmDialog';
import type { ModalFuncProps } from '../Modal';
import initDefaultProps from '../../_util/props-util/initDefaultProps';
export interface HookModalProps {
afterClose: () => void;
config: ModalFuncProps;
destroyAction: (...args: any[]) => void;
open: boolean;
}
export interface HookModalRef {
destroy: () => void;
update: (config: ModalFuncProps) => void;
}
const comfirmFuncProps = () => ({
config: Object as PropType<ModalFuncProps>,
afterClose: Function as PropType<() => void>,
destroyAction: Function as PropType<(e: any) => void>,
open: Boolean,
});
export default defineComponent({
name: 'HookModal',
inheritAttrs: false,
props: initDefaultProps(comfirmFuncProps(), {
config: {
width: 520,
okType: 'primary',
},
}),
setup(props: HookModalProps, { expose }) {
const open = computed(() => props.open);
const innerConfig = computed(() => props.config);
const { direction, getPrefixCls } = useConfigContextInject();
const prefixCls = getPrefixCls('modal');
const rootPrefixCls = getPrefixCls();
const afterClose = () => {
props?.afterClose();
innerConfig.value.afterClose?.();
};
const close = (...args: any[]) => {
props.destroyAction(...args);
};
expose({ destroy: close });
const mergedOkCancel = innerConfig.value.okCancel ?? innerConfig.value.type === 'confirm';
const [contextLocale] = useLocaleReceiver('Modal', defaultLocale.Modal);
return () => (
<ConfirmDialog
prefixCls={prefixCls}
rootPrefixCls={rootPrefixCls}
{...innerConfig.value}
close={close}
open={open.value}
afterClose={afterClose}
okText={
innerConfig.value.okText ||
(mergedOkCancel ? contextLocale?.value.okText : contextLocale?.value.justOkText)
}
direction={innerConfig.value.direction || direction.value}
cancelText={innerConfig.value.cancelText || contextLocale?.value.cancelText}
/>
);
},
});