refactor: popconfirm to ts

feat-dayjs^2
Amour1688 2020-10-20 10:00:56 +08:00
parent eb0688398f
commit ab9ab87242
2 changed files with 11 additions and 10 deletions

View File

@ -1,5 +1,5 @@
import omit from 'omit.js'; import omit from 'omit.js';
import { inject } from 'vue'; import { App, defineComponent, inject } from 'vue';
import Tooltip from '../tooltip'; import Tooltip from '../tooltip';
import abstractTooltipProps from '../tooltip/abstractTooltipProps'; import abstractTooltipProps from '../tooltip/abstractTooltipProps';
import PropTypes from '../_util/vue-types'; import PropTypes from '../_util/vue-types';
@ -14,7 +14,8 @@ import { defaultConfigProvider } from '../config-provider';
const tooltipProps = abstractTooltipProps(); const tooltipProps = abstractTooltipProps();
const btnProps = buttonTypes(); const btnProps = buttonTypes();
const Popconfirm = {
const Popconfirm = defineComponent({
name: 'APopconfirm', name: 'APopconfirm',
props: { props: {
...tooltipProps, ...tooltipProps,
@ -33,9 +34,9 @@ const Popconfirm = {
onConfirm: PropTypes.func, onConfirm: PropTypes.func,
onCancel: PropTypes.func, onCancel: PropTypes.func,
onVisibleChange: PropTypes.func, onVisibleChange: PropTypes.func,
'onUpdate:visible': PropTypes.func,
}, },
mixins: [BaseMixin], mixins: [BaseMixin],
emits: ['update:visible', 'confirm', 'cancel', 'visibleChange'],
watch: { watch: {
visible(val) { visible(val) {
this.sVisible = val; this.sVisible = val;
@ -47,7 +48,7 @@ const Popconfirm = {
}; };
}, },
data() { data() {
const props = getOptionProps(this); const props = getOptionProps(this) as any;
const state = { sVisible: false }; const state = { sVisible: false };
if ('visible' in props) { if ('visible' in props) {
state.sVisible = props.visible; state.sVisible = props.visible;
@ -76,7 +77,7 @@ const Popconfirm = {
this.setVisible(sVisible); this.setVisible(sVisible);
}, },
setVisible(sVisible, e) { setVisible(sVisible: boolean, e?: Event) {
if (!hasProp(this, 'visible')) { if (!hasProp(this, 'visible')) {
this.setState({ sVisible }); this.setState({ sVisible });
} }
@ -84,9 +85,9 @@ const Popconfirm = {
this.$emit('visibleChange', sVisible, e); this.$emit('visibleChange', sVisible, e);
}, },
getPopupDomNode() { getPopupDomNode() {
return this.$refs.tooltip.getPopupDomNode(); return (this.$refs.tooltip as any).getPopupDomNode();
}, },
renderOverlay(prefixCls, popconfirmLocale) { renderOverlay(prefixCls: string, popconfirmLocale) {
const { okType, okButtonProps, cancelButtonProps } = this; const { okType, okButtonProps, cancelButtonProps } = this;
const icon = getComponent(this, 'icon') || <ExclamationCircleFilled />; const icon = getComponent(this, 'icon') || <ExclamationCircleFilled />;
const cancelBtnProps = mergeProps({ const cancelBtnProps = mergeProps({
@ -121,7 +122,7 @@ const Popconfirm = {
render() { render() {
const props = getOptionProps(this); const props = getOptionProps(this);
const { prefixCls: customizePrefixCls } = props; const { prefixCls: customizePrefixCls } = props;
const getPrefixCls = this.configProvider.getPrefixCls; const { getPrefixCls } = this.configProvider;
const prefixCls = getPrefixCls('popover', customizePrefixCls); const prefixCls = getPrefixCls('popover', customizePrefixCls);
const otherProps = omit(props, [ const otherProps = omit(props, [
@ -148,10 +149,10 @@ const Popconfirm = {
}; };
return <Tooltip {...tooltipProps}>{this.$slots?.default()}</Tooltip>; return <Tooltip {...tooltipProps}>{this.$slots?.default()}</Tooltip>;
}, },
}; });
/* istanbul ignore next */ /* istanbul ignore next */
Popconfirm.install = function(app) { Popconfirm.install = function(app: App) {
app.component(Popconfirm.name, Popconfirm); app.component(Popconfirm.name, Popconfirm);
return app; return app;
}; };