fix: date-pick type error (#4499)
parent
70f9b02f51
commit
eda5362782
|
@ -7,214 +7,210 @@ import type { GenerateConfig } from '../../vc-picker/generate/index';
|
|||
import enUS from '../locale/en_US';
|
||||
import { useLocaleReceiver } from '../../locale-provider/LocaleReceiver';
|
||||
import { getRangePlaceholder } from '../util';
|
||||
import type { RangePickerProps } from '.';
|
||||
import { getTimeProps, Components } from '.';
|
||||
import { computed, defineComponent, ref } from 'vue';
|
||||
import useConfigInject from '../../_util/hooks/useConfigInject';
|
||||
import classNames from '../../_util/classNames';
|
||||
import type { ExtraRangePickerProps } from './props';
|
||||
import { commonProps, rangePickerProps } from './props';
|
||||
import type { PanelMode, RangeValue } from '../../vc-picker/interface';
|
||||
import type { RangePickerSharedProps } from '../../vc-picker/RangePicker';
|
||||
import devWarning from '../../vc-util/devWarning';
|
||||
|
||||
export default function generateRangePicker<DateType>(
|
||||
export default function generateRangePicker<DateType, ExtraProps extends {} = {}>(
|
||||
generateConfig: GenerateConfig<DateType>,
|
||||
extraProps: Record<string, any> = {},
|
||||
extraProps: ExtraProps,
|
||||
) {
|
||||
const RangePicker = defineComponent<RangePickerProps<DateType> & ExtraRangePickerProps<DateType>>(
|
||||
{
|
||||
name: 'ARangePicker',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
...commonProps<DateType>(),
|
||||
...rangePickerProps<DateType>(),
|
||||
...extraProps,
|
||||
} as any,
|
||||
slots: [
|
||||
'suffixIcon',
|
||||
// 'clearIcon',
|
||||
// 'prevIcon',
|
||||
// 'nextIcon',
|
||||
// 'superPrevIcon',
|
||||
// 'superNextIcon',
|
||||
// 'panelRender',
|
||||
'dateRender',
|
||||
'renderExtraFooter',
|
||||
// 'separator',
|
||||
],
|
||||
emits: [
|
||||
'change',
|
||||
'panelChange',
|
||||
'ok',
|
||||
'openChange',
|
||||
'update:value',
|
||||
'update:open',
|
||||
'calendarChange',
|
||||
'focus',
|
||||
'blur',
|
||||
],
|
||||
setup(props, { expose, slots, attrs, emit }) {
|
||||
devWarning(
|
||||
!(attrs as any).getCalendarContainer,
|
||||
'DatePicker',
|
||||
'`getCalendarContainer` is deprecated. Please use `getPopupContainer"` instead.',
|
||||
);
|
||||
const { prefixCls, direction, getPopupContainer, size, rootPrefixCls } = useConfigInject(
|
||||
'picker',
|
||||
props,
|
||||
);
|
||||
const pickerRef = ref();
|
||||
expose({
|
||||
focus: () => {
|
||||
pickerRef.value?.focus();
|
||||
},
|
||||
blur: () => {
|
||||
pickerRef.value?.blur();
|
||||
},
|
||||
});
|
||||
const maybeToStrings = (dates: DateType[]) => {
|
||||
return props.valueFormat ? generateConfig.toString(dates, props.valueFormat) : dates;
|
||||
};
|
||||
const onChange = (dates: [DateType, DateType], dateStrings: [string, string]) => {
|
||||
const values = maybeToStrings(dates);
|
||||
emit('update:value', values);
|
||||
emit('change', values, dateStrings);
|
||||
};
|
||||
const onOpenChange = (open: boolean) => {
|
||||
emit('update:open', open);
|
||||
emit('openChange', open);
|
||||
};
|
||||
const onFoucs = () => {
|
||||
emit('focus');
|
||||
};
|
||||
const onBlur = () => {
|
||||
emit('blur');
|
||||
};
|
||||
const onPanelChange = (dates: RangeValue<DateType>, modes: [PanelMode, PanelMode]) => {
|
||||
const values = maybeToStrings(dates);
|
||||
emit('panelChange', values, modes);
|
||||
};
|
||||
const onOk = (dates: DateType[]) => {
|
||||
const value = maybeToStrings(dates);
|
||||
emit('ok', value);
|
||||
};
|
||||
const onCalendarChange: RangePickerSharedProps<DateType>['onCalendarChange'] = (
|
||||
dates: [DateType, DateType],
|
||||
dateStrings: [string, string],
|
||||
info,
|
||||
) => {
|
||||
const values = maybeToStrings(dates);
|
||||
emit('calendarChange', values, dateStrings, info);
|
||||
};
|
||||
const [contextLocale] = useLocaleReceiver('DatePicker', enUS);
|
||||
|
||||
const value = computed(() => {
|
||||
if (props.value) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.value, props.valueFormat)
|
||||
: props.value;
|
||||
}
|
||||
return props.value;
|
||||
});
|
||||
const defaultValue = computed(() => {
|
||||
if (props.defaultValue) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.defaultValue, props.valueFormat)
|
||||
: props.defaultValue;
|
||||
}
|
||||
return props.defaultValue;
|
||||
});
|
||||
const defaultPickerValue = computed(() => {
|
||||
if (props.defaultPickerValue) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.defaultPickerValue, props.valueFormat)
|
||||
: props.defaultPickerValue;
|
||||
}
|
||||
return props.defaultPickerValue;
|
||||
});
|
||||
return () => {
|
||||
const locale = { ...contextLocale.value, ...props.locale };
|
||||
const p = { ...props, ...attrs } as RangePickerProps<DateType>;
|
||||
const {
|
||||
prefixCls: customizePrefixCls,
|
||||
bordered = true,
|
||||
placeholder,
|
||||
suffixIcon = slots.suffixIcon?.(),
|
||||
picker = 'date',
|
||||
transitionName,
|
||||
allowClear = true,
|
||||
dateRender = slots.dateRender,
|
||||
renderExtraFooter = slots.renderExtraFooter,
|
||||
separator = slots.separator?.(),
|
||||
clearIcon = slots.clearIcon?.(),
|
||||
...restProps
|
||||
} = p;
|
||||
const { format, showTime } = p as any;
|
||||
|
||||
let additionalOverrideProps: any = {};
|
||||
|
||||
additionalOverrideProps = {
|
||||
...additionalOverrideProps,
|
||||
...(showTime ? getTimeProps({ format, picker, ...showTime }) : {}),
|
||||
...(picker === 'time' ? getTimeProps({ format, ...restProps, picker }) : {}),
|
||||
};
|
||||
const pre = prefixCls.value;
|
||||
return (
|
||||
<VCRangePicker
|
||||
dateRender={dateRender}
|
||||
renderExtraFooter={renderExtraFooter}
|
||||
separator={
|
||||
separator || (
|
||||
<span aria-label="to" class={`${pre}-separator`}>
|
||||
<SwapRightOutlined />
|
||||
</span>
|
||||
)
|
||||
}
|
||||
ref={pickerRef}
|
||||
placeholder={getRangePlaceholder(picker, locale, placeholder)}
|
||||
suffixIcon={
|
||||
suffixIcon || (picker === 'time' ? <ClockCircleOutlined /> : <CalendarOutlined />)
|
||||
}
|
||||
clearIcon={clearIcon || <CloseCircleFilled />}
|
||||
allowClear={allowClear}
|
||||
transitionName={transitionName || `${rootPrefixCls.value}-slide-up`}
|
||||
{...restProps}
|
||||
{...additionalOverrideProps}
|
||||
value={value.value}
|
||||
defaultValue={defaultValue.value}
|
||||
defaultPickerValue={defaultPickerValue.value}
|
||||
picker={picker}
|
||||
class={classNames(
|
||||
{
|
||||
[`${pre}-${size.value}`]: size.value,
|
||||
[`${pre}-borderless`]: !bordered,
|
||||
},
|
||||
attrs.class,
|
||||
)}
|
||||
locale={locale!.lang}
|
||||
prefixCls={pre}
|
||||
getPopupContainer={attrs.getCalendarContainer || getPopupContainer.value}
|
||||
generateConfig={generateConfig}
|
||||
prevIcon={<span class={`${pre}-prev-icon`} />}
|
||||
nextIcon={<span class={`${pre}-next-icon`} />}
|
||||
superPrevIcon={<span class={`${pre}-super-prev-icon`} />}
|
||||
superNextIcon={<span class={`${pre}-super-next-icon`} />}
|
||||
components={Components}
|
||||
direction={direction.value}
|
||||
onChange={onChange}
|
||||
onOpenChange={onOpenChange}
|
||||
onFocus={onFoucs}
|
||||
onBlur={onBlur}
|
||||
onPanelChange={onPanelChange}
|
||||
onOk={onOk}
|
||||
onCalendarChange={onCalendarChange}
|
||||
/>
|
||||
);
|
||||
};
|
||||
},
|
||||
const RangePicker = defineComponent({
|
||||
name: 'ARangePicker',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
...commonProps<DateType>(),
|
||||
...rangePickerProps<DateType>(),
|
||||
...extraProps,
|
||||
},
|
||||
);
|
||||
slots: [
|
||||
'suffixIcon',
|
||||
// 'clearIcon',
|
||||
// 'prevIcon',
|
||||
// 'nextIcon',
|
||||
// 'superPrevIcon',
|
||||
// 'superNextIcon',
|
||||
// 'panelRender',
|
||||
'dateRender',
|
||||
'renderExtraFooter',
|
||||
// 'separator',
|
||||
],
|
||||
emits: [
|
||||
'change',
|
||||
'panelChange',
|
||||
'ok',
|
||||
'openChange',
|
||||
'update:value',
|
||||
'update:open',
|
||||
'calendarChange',
|
||||
'focus',
|
||||
'blur',
|
||||
],
|
||||
setup(props, { expose, slots, attrs, emit }) {
|
||||
devWarning(
|
||||
!attrs.getCalendarContainer,
|
||||
'DatePicker',
|
||||
'`getCalendarContainer` is deprecated. Please use `getPopupContainer"` instead.',
|
||||
);
|
||||
const { prefixCls, direction, getPopupContainer, size, rootPrefixCls } = useConfigInject(
|
||||
'picker',
|
||||
props,
|
||||
);
|
||||
const pickerRef = ref();
|
||||
expose({
|
||||
focus: () => {
|
||||
pickerRef.value?.focus();
|
||||
},
|
||||
blur: () => {
|
||||
pickerRef.value?.blur();
|
||||
},
|
||||
});
|
||||
const maybeToStrings = (dates: DateType[]) => {
|
||||
return props.valueFormat ? generateConfig.toString(dates, props.valueFormat) : dates;
|
||||
};
|
||||
const onChange = (dates: [DateType, DateType], dateStrings: [string, string]) => {
|
||||
const values = maybeToStrings(dates);
|
||||
emit('update:value', values);
|
||||
emit('change', values, dateStrings);
|
||||
};
|
||||
const onOpenChange = (open: boolean) => {
|
||||
emit('update:open', open);
|
||||
emit('openChange', open);
|
||||
};
|
||||
const onFocus = () => {
|
||||
emit('focus');
|
||||
};
|
||||
const onBlur = () => {
|
||||
emit('blur');
|
||||
};
|
||||
const onPanelChange = (dates: RangeValue<DateType>, modes: [PanelMode, PanelMode]) => {
|
||||
const values = maybeToStrings(dates);
|
||||
emit('panelChange', values, modes);
|
||||
};
|
||||
const onOk = (dates: DateType[]) => {
|
||||
const value = maybeToStrings(dates);
|
||||
emit('ok', value);
|
||||
};
|
||||
const onCalendarChange: RangePickerSharedProps<DateType>['onCalendarChange'] = (
|
||||
dates: [DateType, DateType],
|
||||
dateStrings: [string, string],
|
||||
info,
|
||||
) => {
|
||||
const values = maybeToStrings(dates);
|
||||
emit('calendarChange', values, dateStrings, info);
|
||||
};
|
||||
const [contextLocale] = useLocaleReceiver('DatePicker', enUS);
|
||||
|
||||
const value = computed(() => {
|
||||
if (props.value) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.value, props.valueFormat)
|
||||
: props.value;
|
||||
}
|
||||
return props.value;
|
||||
});
|
||||
const defaultValue = computed(() => {
|
||||
if (props.defaultValue) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.defaultValue, props.valueFormat)
|
||||
: props.defaultValue;
|
||||
}
|
||||
return props.defaultValue;
|
||||
});
|
||||
const defaultPickerValue = computed(() => {
|
||||
if (props.defaultPickerValue) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.defaultPickerValue, props.valueFormat)
|
||||
: props.defaultPickerValue;
|
||||
}
|
||||
return props.defaultPickerValue;
|
||||
});
|
||||
return () => {
|
||||
const locale = { ...contextLocale.value, ...props.locale };
|
||||
const p = { ...props, ...attrs };
|
||||
const {
|
||||
prefixCls: customizePrefixCls,
|
||||
bordered = true,
|
||||
placeholder,
|
||||
suffixIcon = slots.suffixIcon?.(),
|
||||
picker = 'date',
|
||||
transitionName,
|
||||
allowClear = true,
|
||||
dateRender = slots.dateRender,
|
||||
renderExtraFooter = slots.renderExtraFooter,
|
||||
separator = slots.separator?.(),
|
||||
clearIcon = slots.clearIcon?.(),
|
||||
...restProps
|
||||
} = p;
|
||||
const { format, showTime } = p as any;
|
||||
|
||||
let additionalOverrideProps: any = {};
|
||||
|
||||
additionalOverrideProps = {
|
||||
...additionalOverrideProps,
|
||||
...(showTime ? getTimeProps({ format, picker, ...showTime }) : {}),
|
||||
...(picker === 'time' ? getTimeProps({ format, ...restProps, picker }) : {}),
|
||||
};
|
||||
const pre = prefixCls.value;
|
||||
return (
|
||||
<VCRangePicker
|
||||
dateRender={dateRender}
|
||||
renderExtraFooter={renderExtraFooter}
|
||||
separator={
|
||||
separator || (
|
||||
<span aria-label="to" class={`${pre}-separator`}>
|
||||
<SwapRightOutlined />
|
||||
</span>
|
||||
)
|
||||
}
|
||||
ref={pickerRef}
|
||||
placeholder={getRangePlaceholder(picker, locale, placeholder as [string, string])}
|
||||
suffixIcon={
|
||||
suffixIcon || (picker === 'time' ? <ClockCircleOutlined /> : <CalendarOutlined />)
|
||||
}
|
||||
clearIcon={clearIcon || <CloseCircleFilled />}
|
||||
allowClear={allowClear}
|
||||
transitionName={transitionName || `${rootPrefixCls.value}-slide-up`}
|
||||
{...restProps}
|
||||
{...additionalOverrideProps}
|
||||
value={value.value}
|
||||
defaultValue={defaultValue.value}
|
||||
defaultPickerValue={defaultPickerValue.value}
|
||||
picker={picker}
|
||||
class={classNames(
|
||||
{
|
||||
[`${pre}-${size.value}`]: size.value,
|
||||
[`${pre}-borderless`]: !bordered,
|
||||
},
|
||||
attrs.class,
|
||||
)}
|
||||
locale={locale!.lang}
|
||||
prefixCls={pre}
|
||||
getPopupContainer={attrs.getCalendarContainer || getPopupContainer.value}
|
||||
generateConfig={generateConfig}
|
||||
prevIcon={<span class={`${pre}-prev-icon`} />}
|
||||
nextIcon={<span class={`${pre}-next-icon`} />}
|
||||
superPrevIcon={<span class={`${pre}-super-prev-icon`} />}
|
||||
superNextIcon={<span class={`${pre}-super-next-icon`} />}
|
||||
components={Components}
|
||||
direction={direction.value}
|
||||
onChange={onChange}
|
||||
onOpenChange={onOpenChange}
|
||||
onFocus={onFocus}
|
||||
onBlur={onBlur}
|
||||
onPanelChange={onPanelChange}
|
||||
onOk={onOk}
|
||||
onCalendarChange={onCalendarChange}
|
||||
/>
|
||||
);
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
return RangePicker;
|
||||
}
|
||||
|
|
|
@ -7,34 +7,26 @@ import type { GenerateConfig } from '../../vc-picker/generate/index';
|
|||
import enUS from '../locale/en_US';
|
||||
import { getPlaceholder } from '../util';
|
||||
import { useLocaleReceiver } from '../../locale-provider/LocaleReceiver';
|
||||
import type { PickerProps, PickerDateProps, PickerTimeProps } from '.';
|
||||
import { getTimeProps, Components } from '.';
|
||||
import type { DefineComponent } from 'vue';
|
||||
import { computed, defineComponent, ref } from 'vue';
|
||||
import useConfigInject from '../../_util/hooks/useConfigInject';
|
||||
import classNames from '../../_util/classNames';
|
||||
import type { ExtraDatePickerProps } from './props';
|
||||
import { commonProps, datePickerProps } from './props';
|
||||
import devWarning from '../../vc-util/devWarning';
|
||||
|
||||
export default function generateSinglePicker<DateType>(
|
||||
export default function generateSinglePicker<DateType, ExtraProps = {}>(
|
||||
generateConfig: GenerateConfig<DateType>,
|
||||
extraProps: Record<string, any> = {},
|
||||
extraProps: ExtraProps,
|
||||
) {
|
||||
type DatePickerProps = PickerProps<DateType> & ExtraDatePickerProps<DateType>;
|
||||
|
||||
function getPicker<InnerPickerProps extends DatePickerProps>(
|
||||
picker?: PickerMode,
|
||||
displayName?: string,
|
||||
): DefineComponent<InnerPickerProps> {
|
||||
return defineComponent<InnerPickerProps>({
|
||||
function getPicker(picker?: PickerMode, displayName?: string) {
|
||||
return defineComponent({
|
||||
name: displayName,
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
...commonProps<DateType>(),
|
||||
...datePickerProps<DateType>(),
|
||||
...extraProps,
|
||||
} as any,
|
||||
},
|
||||
slots: [
|
||||
'suffixIcon',
|
||||
// 'clearIcon',
|
||||
|
@ -59,13 +51,13 @@ export default function generateSinglePicker<DateType>(
|
|||
],
|
||||
setup(props, { slots, expose, attrs, emit }) {
|
||||
devWarning(
|
||||
!((props as any).monthCellContentRender || slots.monthCellContentRender),
|
||||
!(props.monthCellContentRender || slots.monthCellContentRender),
|
||||
'DatePicker',
|
||||
'`monthCellContentRender` is deprecated. Please use `monthCellRender"` instead.',
|
||||
);
|
||||
|
||||
devWarning(
|
||||
!(attrs as any).getCalendarContainer,
|
||||
!attrs.getCalendarContainer,
|
||||
'DatePicker',
|
||||
'`getCalendarContainer` is deprecated. Please use `getPopupContainer"` instead.',
|
||||
);
|
||||
|
@ -94,12 +86,6 @@ export default function generateSinglePicker<DateType>(
|
|||
emit('update:open', open);
|
||||
emit('openChange', open);
|
||||
};
|
||||
const onFoucs = () => {
|
||||
emit('focus');
|
||||
};
|
||||
const onBlur = () => {
|
||||
emit('blur');
|
||||
};
|
||||
const onPanelChange = (date: DateType, mode: PanelMode | null) => {
|
||||
const value = maybeToString(date);
|
||||
emit('panelChange', value, mode);
|
||||
|
@ -114,7 +100,7 @@ export default function generateSinglePicker<DateType>(
|
|||
const value = computed(() => {
|
||||
if (props.value) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.value, props.valueFormat)
|
||||
? generateConfig.toDate(props.value as string | DateType, props.valueFormat)
|
||||
: props.value;
|
||||
}
|
||||
return props.value;
|
||||
|
@ -122,7 +108,7 @@ export default function generateSinglePicker<DateType>(
|
|||
const defaultValue = computed(() => {
|
||||
if (props.defaultValue) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.defaultValue, props.valueFormat)
|
||||
? generateConfig.toDate(props.defaultValue as string | DateType, props.valueFormat)
|
||||
: props.defaultValue;
|
||||
}
|
||||
return props.defaultValue;
|
||||
|
@ -130,7 +116,10 @@ export default function generateSinglePicker<DateType>(
|
|||
const defaultPickerValue = computed(() => {
|
||||
if (props.defaultPickerValue) {
|
||||
return props.valueFormat
|
||||
? generateConfig.toDate(props.defaultPickerValue, props.valueFormat)
|
||||
? generateConfig.toDate(
|
||||
props.defaultPickerValue as string | DateType,
|
||||
props.valueFormat,
|
||||
)
|
||||
: props.defaultPickerValue;
|
||||
}
|
||||
return props.defaultPickerValue;
|
||||
|
@ -138,7 +127,7 @@ export default function generateSinglePicker<DateType>(
|
|||
|
||||
return () => {
|
||||
const locale = { ...contextLocale.value, ...props.locale };
|
||||
const p = { ...props, ...attrs } as InnerPickerProps;
|
||||
const p = { ...props, ...attrs };
|
||||
const {
|
||||
bordered = true,
|
||||
placeholder,
|
||||
|
@ -217,26 +206,23 @@ export default function generateSinglePicker<DateType>(
|
|||
direction={direction.value}
|
||||
onChange={onChange}
|
||||
onOpenChange={onOpenChange}
|
||||
onFocus={onFoucs}
|
||||
onBlur={onBlur}
|
||||
onFocus={props.onFocus}
|
||||
onBlur={props.onBlur}
|
||||
onPanelChange={onPanelChange}
|
||||
onOk={onOk}
|
||||
/>
|
||||
);
|
||||
};
|
||||
},
|
||||
}) as unknown as DefineComponent<InnerPickerProps>;
|
||||
});
|
||||
}
|
||||
|
||||
const DatePicker = getPicker<DatePickerProps>(undefined, 'ADatePicker');
|
||||
const WeekPicker = getPicker<Omit<PickerDateProps<DateType>, 'picker'>>('week', 'AWeekPicker');
|
||||
const MonthPicker = getPicker<Omit<PickerDateProps<DateType>, 'picker'>>('month', 'AMonthPicker');
|
||||
const YearPicker = getPicker<Omit<PickerDateProps<DateType>, 'picker'>>('year', 'AYearPicker');
|
||||
const TimePicker = getPicker<Omit<PickerTimeProps<DateType>, 'picker'>>('time', 'TimePicker'); // 给独立组件 TimePicker 使用,此处名称不用更改
|
||||
const QuarterPicker = getPicker<Omit<PickerTimeProps<DateType>, 'picker'>>(
|
||||
'quarter',
|
||||
'AQuarterPicker',
|
||||
);
|
||||
const DatePicker = getPicker(undefined, 'ADatePicker');
|
||||
const WeekPicker = getPicker('week', 'AWeekPicker');
|
||||
const MonthPicker = getPicker('month', 'AMonthPicker');
|
||||
const YearPicker = getPicker('year', 'AYearPicker');
|
||||
const TimePicker = getPicker('time', 'TimePicker'); // 给独立组件 TimePicker 使用,此处名称不用更改
|
||||
const QuarterPicker = getPicker('quarter', 'AQuarterPicker');
|
||||
|
||||
return {
|
||||
DatePicker,
|
||||
|
@ -245,12 +231,5 @@ export default function generateSinglePicker<DateType>(
|
|||
YearPicker,
|
||||
TimePicker,
|
||||
QuarterPicker,
|
||||
} as unknown as {
|
||||
DatePicker: DefineComponent<DatePickerProps>;
|
||||
WeekPicker: DefineComponent<Omit<PickerDateProps<DateType>, 'picker'>>;
|
||||
MonthPicker: DefineComponent<Omit<PickerDateProps<DateType>, 'picker'>>;
|
||||
YearPicker: DefineComponent<Omit<PickerDateProps<DateType>, 'picker'>>;
|
||||
TimePicker: DefineComponent<Omit<PickerTimeProps<DateType>, 'picker'>>;
|
||||
QuarterPicker: DefineComponent<Omit<PickerTimeProps<DateType>, 'picker'>>;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -17,8 +17,6 @@ import type { TimePickerLocale } from '../../time-picker';
|
|||
import generateSinglePicker from './generateSinglePicker';
|
||||
import generateRangePicker from './generateRangePicker';
|
||||
import type { SizeType } from '../../config-provider';
|
||||
import type { ExtraDatePickerProps, ExtraRangePickerProps } from './props';
|
||||
import type { DefineComponent } from 'vue';
|
||||
|
||||
export const Components = { button: PickerButton, rangeItem: PickerTag };
|
||||
|
||||
|
@ -127,20 +125,17 @@ export type RangePickerProps<DateType> =
|
|||
| RangePickerDateProps<DateType>
|
||||
| RangePickerTimeProps<DateType>;
|
||||
|
||||
function generatePicker<DateType>(
|
||||
function generatePicker<DateType, ExtraProps extends Record<string, any> = {}>(
|
||||
generateConfig: GenerateConfig<DateType>,
|
||||
extraProps: Record<string, any> = {},
|
||||
extraProps?: ExtraProps,
|
||||
) {
|
||||
type DatePickerProps = PickerProps<DateType> & ExtraDatePickerProps<DateType>;
|
||||
// =========================== Picker ===========================
|
||||
const { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker } =
|
||||
generateSinglePicker<DateType>(generateConfig, extraProps);
|
||||
generateSinglePicker<DateType, ExtraProps>(generateConfig, extraProps);
|
||||
|
||||
// ======================== Range Picker ========================
|
||||
const RangePicker = generateRangePicker<DateType>(generateConfig, extraProps);
|
||||
|
||||
// 类型过于复杂,使用 as 避免 TS7056 错误
|
||||
// error TS7056: The inferred type of this node exceeds the maximum length the compiler will serialize. An explicit type annotation is needed.
|
||||
return {
|
||||
DatePicker,
|
||||
WeekPicker,
|
||||
|
@ -149,14 +144,6 @@ function generatePicker<DateType>(
|
|||
TimePicker,
|
||||
QuarterPicker,
|
||||
RangePicker,
|
||||
} as unknown as {
|
||||
DatePicker: DefineComponent<DatePickerProps>;
|
||||
WeekPicker: DefineComponent<Omit<PickerDateProps<DateType>, 'picker'>>;
|
||||
MonthPicker: DefineComponent<Omit<PickerDateProps<DateType>, 'picker'>>;
|
||||
YearPicker: DefineComponent<Omit<PickerDateProps<DateType>, 'picker'>>;
|
||||
TimePicker: DefineComponent<Omit<PickerTimeProps<DateType>, 'picker'>>;
|
||||
QuarterPicker: DefineComponent<Omit<PickerTimeProps<DateType>, 'picker'>>;
|
||||
RangePicker: DefineComponent<RangePickerProps<DateType> & ExtraRangePickerProps<DateType>>;
|
||||
};
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue