github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: time-picker type error #5109

refactor-modal
tangjinzhou 2022-01-01 16:41:34 +08:00
parent ad76bb678d
commit b13756ffbe
20 changed files with 197 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
components/calendar/generateCalendar.tsx
View File

@ -60,6 +60,7 @@ export interface CalendarProps<DateType> {
mode?: CalendarMode;
fullscreen?: boolean;
onChange?: (date: DateType | string) => void;
'onUpdate:value'?: (date: DateType | string) => void;
onPanelChange?: (date: DateType | string, mode: CalendarMode) => void;
onSelect?: (date: DateType | string) => void;
valueFormat?: string;
@ -88,7 +89,25 @@ function generateCalendar<
const Calendar = defineComponent<Props>({
name: 'ACalendar',
inheritAttrs: false,
emits: ['change', 'panelChange', 'select', 'update:value'],
props: [
'prefixCls',
'locale',
'validRange',
'disabledDate',
'dateFullCellRender',
'dateCellRender',
'monthFullCellRender',
'monthCellRender',
'headerRender',
'value',
'defaultValue',
'mode',
'fullscreen',
'onChange',
'onPanelChange',
'onSelect',
'valueFormat',
] as any,
slots: [
'dateFullCellRender',
'dateCellRender',
@ -306,26 +325,6 @@ function generateCalendar<
},
});
Calendar.props = [
'prefixCls',
'locale',
'validRange',
'disabledDate',
'dateFullCellRender',
'dateCellRender',
'monthFullCellRender',
'monthCellRender',
'headerRender',
'value',
'defaultValue',
'mode',
'fullscreen',
'onChange',
'onPanelChange',
'onSelect',
'valueFormat',
];
Calendar.install = function (app: App) {
app.component(Calendar.name, Calendar);
return app;

2
components/carousel/__tests__/__snapshots__/demo.test.js.snap
View File

@ -167,7 +167,7 @@ exports[`renders ./components/carousel/demo/basic.vue correctly 1`] = `
exports[`renders ./components/carousel/demo/customArrows.vue correctly 1`] = `
<div class="ant-carousel">
<div class="slick-slider slick-initialized">
<div class="custom-slick-arrow slick-arrow slick-prev" style="left: 10px; display: block;"><span role="img" aria-label="left-circle" class="anticon anticon-left-circle"><svg focusable="false" class="" data-icon="left-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M603.3 327.5l-246 178a7.95 7.95 0 000 12.9l246 178c5.3 3.8 12.7 0 12.7-6.5V643c0-10.2-4.9-19.9-13.2-25.9L457.4 512l145.4-105.2c8.3-6 13.2-15.6 13.2-25.9V334c0-6.5-7.4-10.3-12.7-6.5z"></path><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path></svg></span></div>
<div class="custom-slick-arrow slick-arrow slick-prev" style="left: 10px; z-index: 1; display: block;"><span role="img" aria-label="left-circle" class="anticon anticon-left-circle"><svg focusable="false" class="" data-icon="left-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M603.3 327.5l-246 178a7.95 7.95 0 000 12.9l246 178c5.3 3.8 12.7 0 12.7-6.5V643c0-10.2-4.9-19.9-13.2-25.9L457.4 512l145.4-105.2c8.3-6 13.2-15.6 13.2-25.9V334c0-6.5-7.4-10.3-12.7-6.5z"></path><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path></svg></span></div>
<div class="slick-list">
<div class="slick-track" style="opacity: 1; transform: translate3d(0px, 0px, 0px);">
<div class="slick-slide slick-cloned" tabindex="-1" data-index="-1" aria-hidden="true" style="width: 0px;">

2
components/date-picker/demo/date-render.vue
View File

@ -51,7 +51,7 @@ export default defineComponent({
};
return {
value1: ref<Dayjs>(),
value2: ref<Dayjs[]>([]),
value2: ref<[Dayjs, Dayjs]>(),
value3: ref<Dayjs>(),
getCurrentStyle,
};

6
components/date-picker/demo/disabled-date.vue
View File

@ -68,7 +68,7 @@ export default defineComponent({
};
};
const disabledRangeTime = (_: Dayjs[], type: 'start' | 'end') => {
const disabledRangeTime = (_: Dayjs, type: 'start' | 'end') => {
if (type === 'start') {
return {
disabledHours: () => range(0, 60).splice(4, 20),
@ -87,8 +87,8 @@ export default defineComponent({
dayjs,
value1: ref<Dayjs>(),
value2: ref<Dayjs>(),
value3: ref<Dayjs[]>([]),
value4: ref<Dayjs[]>([]),
value3: ref<[Dayjs, Dayjs]>(),
value4: ref<[Dayjs, Dayjs]>(),
disabledDate,
disabledDateTime,
disabledRangeTime,

10
components/date-picker/demo/disabled.vue
View File

@ -33,8 +33,14 @@ export default defineComponent({
return {
value1: ref<Dayjs>(dayjs('2015-06-06', dateFormat)),
value2: ref<Dayjs>(dayjs('2015-06', 'YYYY-MM')),
value3: ref<Dayjs[]>([dayjs('2015-06-06', dateFormat), dayjs('2015-06-06', dateFormat)]),
value4: ref<Dayjs[]>([dayjs('2019-09-03', dateFormat), dayjs('2019-11-22', dateFormat)]),
value3: ref<[Dayjs, Dayjs]>([
dayjs('2015-06-06', dateFormat),
dayjs('2015-06-06', dateFormat),
]),
value4: ref<[Dayjs, Dayjs]>([
dayjs('2019-09-03', dateFormat),
dayjs('2019-11-22', dateFormat),
]),
};
},
});

5
components/date-picker/demo/format.vue
View File

@ -37,7 +37,10 @@ export default defineComponent({
value1: ref<Dayjs>(dayjs('2015/01/01', dateFormat)),
value2: ref<Dayjs>(dayjs('01/01/2015', dateFormatList[0])),
value3: ref<Dayjs>(dayjs('2015/01', monthFormat)),
value4: ref<Dayjs[]>([dayjs('2015/01/01', dateFormat), dayjs('2015/01/01', dateFormat)]),
value4: ref<[Dayjs, Dayjs]>([
dayjs('2015/01/01', dateFormat),
dayjs('2015/01/01', dateFormat),
]),
value5: ref<Dayjs>(dayjs('2015/01/01', dateFormat)),
dateFormat,
monthFormat,

12
components/date-picker/demo/mode.vue
View File

@ -39,9 +39,9 @@ import { Dayjs } from 'dayjs';
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const mode1 = ref<string>('time');
const mode2 = ref<string[]>(['month', 'month']);
const value = ref<Dayjs[]>([]);
const mode1 = ref<any>('time');
const mode2 = ref<any>(['month', 'month']);
const value = ref<[Dayjs, Dayjs]>();
const handleOpenChange1 = (open: boolean) => {
if (open) {
@ -49,15 +49,15 @@ export default defineComponent({
}
};
const handleChange = (val: Dayjs[]) => {
const handleChange = (val: [Dayjs, Dayjs]) => {
value.value = val;
};
const handlePanelChange1 = (_val: Dayjs[], mode: string) => {
const handlePanelChange1 = (_val: [Dayjs, Dayjs], mode: any) => {
mode1.value = mode;
};
const handlePanelChange2 = (val: Dayjs[], mode: string[]) => {
const handlePanelChange2 = (val: [Dayjs, Dayjs], mode: any[]) => {
value.value = val;
mode2.value = [
mode[0] === 'date' ? 'month' : mode[0],

10
components/date-picker/demo/presetted-ranges.vue
View File

@ -31,12 +31,16 @@ We can set presetted ranges to RangePicker to improve user experience.
<script lang="ts">
import dayjs, { Dayjs } from 'dayjs';
import { defineComponent, ref } from 'vue';
type RangeValue = [Dayjs, Dayjs];
export default defineComponent({
setup() {
return {
value1: ref<Dayjs[]>([]),
value2: ref<Dayjs[]>([]),
ranges: { Today: [dayjs(), dayjs()], 'This Month': [dayjs(), dayjs().endOf('month')] },
value1: ref<RangeValue>(),
value2: ref<RangeValue>(),
ranges: {
Today: [dayjs(), dayjs()] as RangeValue,
'This Month': [dayjs(), dayjs().endOf('month')] as RangeValue,
},
};
},
});

11
components/date-picker/demo/range-picker.vue
View File

@ -28,14 +28,15 @@ Set range picker type by `picker` prop.
<script lang="ts">
import { defineComponent, ref } from 'vue';
import type { Dayjs } from 'dayjs';
type RangeValue = [Dayjs, Dayjs];
export default defineComponent({
setup() {
return {
value1: ref<Dayjs[]>([]),
value2: ref<Dayjs[]>([]),
value3: ref<Dayjs[]>([]),
value4: ref<Dayjs[]>([]),
value5: ref<Dayjs[]>([]),
value1: ref<RangeValue>(),
value2: ref<RangeValue>(),
value3: ref<RangeValue>(),
value4: ref<RangeValue>(),
value5: ref<RangeValue>(),
};
},
});

17
components/date-picker/demo/select-in-range.vue
View File

@ -27,14 +27,15 @@ A example shows how to select a dynamic range by using `onCalendarChange` and `d
<script lang="ts">
import { Dayjs } from 'dayjs';
import { defineComponent, ref } from 'vue';
type RangeValue = [Dayjs, Dayjs];
export default defineComponent({
setup() {
const dates = ref<Dayjs[]>([]);
const value = ref<Dayjs[]>();
const hackValue = ref<Dayjs[]>();
const dates = ref<RangeValue>();
const value = ref<RangeValue>();
const hackValue = ref<RangeValue>();
const disabledDate = (current: Dayjs) => {
if (!dates.value || dates.value.length === 0) {
if (!dates.value) {
return false;
}
const tooLate = dates.value[0] && current.diff(dates.value[0], 'days') > 7;
@ -44,18 +45,18 @@ export default defineComponent({
const onOpenChange = (open: boolean) => {
if (open) {
dates.value = [];
hackValue.value = [];
dates.value = null;
hackValue.value = null;
} else {
hackValue.value = undefined;
}
};
const onChange = (val: Dayjs[]) => {
const onChange = (val: RangeValue) => {
value.value = val;
};
const onCalendarChange = (val: Dayjs[]) => {
const onCalendarChange = (val: RangeValue) => {
dates.value = val;
};

2
components/date-picker/demo/size.vue
View File

@ -34,7 +34,7 @@ import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
return {
size: ref<string>('default'),
size: ref<any>('default'),
};
},
});

2
components/date-picker/demo/start-end.vue
View File

@ -46,7 +46,7 @@ import { Dayjs } from 'dayjs';
import { defineComponent, ref, watch } from 'vue';
export default defineComponent({
setup() {
const startValue = ref<Dayjs | undefined>();
const startValue = ref<Dayjs>();
const endValue = ref<Dayjs>();
const endOpen = ref<boolean>(false);

10
components/date-picker/demo/suffix.vue
View File

@ -28,7 +28,7 @@ Customize the suffix icon through `suffixIcon`
<SmileOutlined />
</template>
</a-date-picker>
<a-range-picker @change="onChange">
<a-range-picker @change="onRangeChange">
<template #suffixIcon>
<SmileOutlined />
</template>
@ -40,7 +40,7 @@ Customize the suffix icon through `suffixIcon`
</a-date-picker>
<a-date-picker suffix-icon="ab" @change="onChange" />
<a-date-picker suffix-icon="ab" placeholder="Select month" picker="month" @change="onChange" />
<a-range-picker suffix-icon="ab" @change="onChange" />
<a-range-picker suffix-icon="ab" @change="onRangeChange" />
<a-date-picker suffix-icon="ab" placeholder="Select week" picker="week" @change="onChange" />
</a-space>
</template>
@ -53,12 +53,16 @@ export default defineComponent({
SmileOutlined,
},
setup() {
const onChange = (date: Dayjs, dateString: string[]) => {
const onChange = (date: Dayjs | string, dateString: string) => {
console.log(date, dateString);
};
const onRangeChange = (date: [Dayjs, Dayjs], dateString: [string, string]) => {
console.log(date, dateString);
};
return {
onChange,
onRangeChange,
};
},
});

2
components/date-picker/demo/switchable.vue
View File

@ -37,7 +37,7 @@ import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
return {
type: ref('time'),
type: ref<any>('time'),
};
},
});

2
components/date-picker/demo/text.vue
View File

@ -34,7 +34,7 @@ import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const time1 = ref<Dayjs>();
const time2 = ref<Dayjs>();
const time2 = ref<[Dayjs, Dayjs]>();
const onOk = (value: Dayjs) => {
console.log('onOk: ', value);

19
components/date-picker/demo/time.vue
View File

@ -23,8 +23,8 @@ This property provide an additional time selection. When `showTime` is an Object
:show-time="{ format: 'HH:mm' }"
format="YYYY-MM-DD HH:mm"
:placeholder="['Start Time', 'End Time']"
@change="onChange"
@ok="onOk"
@change="onRangeChange"
@ok="onRangeOk"
/>
</a-space>
</template>
@ -33,18 +33,29 @@ import { Dayjs } from 'dayjs';
import { defineComponent } from 'vue';
export default defineComponent({
setup() {
const onChange = (value: Dayjs[], dateString: string[]) => {
const onChange = (value: Dayjs, dateString: string) => {
console.log('Selected Time: ', value);
console.log('Formatted Selected Time: ', dateString);
};
const onOk = (value: Dayjs[]) => {
const onOk = (value: Dayjs) => {
console.log('onOk: ', value);
};
const onRangeChange = (value: [Dayjs, Dayjs], dateString: [string, string]) => {
console.log('Selected Time: ', value);
console.log('Formatted Selected Time: ', dateString);
};
const onRangeOk = (value: [Dayjs, Dayjs]) => {
console.log('onOk: ', value);
};
return {
onChange,
onOk,
onRangeChange,
onRangeOk,
};
},
});

13
components/date-picker/generatePicker/generateRangePicker.tsx
View File

@ -41,17 +41,6 @@ export default function generateRangePicker<DateType, ExtraProps = {}>(
'renderExtraFooter',
// 'separator',
],
emits: [
'change',
'panelChange',
'ok',
'openChange',
'update:value',
'update:open',
'calendarChange',
'focus',
'blur',
],
setup(props, { expose, slots, attrs, emit }) {
const formItemContext = useInjectFormItemContext();
devWarning(
@ -161,6 +150,8 @@ export default function generateRangePicker<DateType, ExtraProps = {}>(
id = formItemContext.id.value,
...restProps
} = p;
delete restProps['onUpdate:value'];
delete restProps['onUpdate:open'];
const { format, showTime } = p as any;
let additionalOverrideProps: any = {};

10
components/date-picker/generatePicker/generateSinglePicker.tsx
View File

@ -41,16 +41,6 @@ export default function generateSinglePicker<DateType, ExtraProps = {}>(
'renderExtraFooter',
'monthCellRender',
],
emits: [
'change',
'openChange',
'focus',
'blur',
'panelChange',
'ok',
'update:value',
'update:open',
],
setup(props, { slots, expose, attrs, emit }) {
const formItemContext = useInjectFormItemContext();
devWarning(

107
components/date-picker/generatePicker/props.ts
View File

@ -1,3 +1,4 @@
import type { FocusEventHandler, MouseEventHandler } from '../../_util/EventInterface';
import type { CSSProperties, PropType } from 'vue';
import type { PickerLocale } from '.';
import type { SizeType } from '../../config-provider';
@ -14,7 +15,7 @@ import type {
import type { DateRender } from '../../vc-picker/panels/DatePanel/DateBody';
import type { MonthCellRender } from '../../vc-picker/panels/MonthPanel/MonthBody';
import type { SharedTimeProps } from '../../vc-picker/panels/TimePanel';
import type { RangeDateRender, RangeType } from '../../vc-picker/RangePicker';
import type { RangeDateRender, RangeInfo, RangeType } from '../../vc-picker/RangePicker';
import type { VueNode } from '../../_util/type';
function commonProps<DateType>() {
@ -45,17 +46,24 @@ function commonProps<DateType>() {
getPopupContainer: { type: Function as PropType<(node: HTMLElement) => HTMLElement> },
panelRender: { type: Function as PropType<(originPanel: VueNode) => VueNode> },
// // Events
// onChange?: (value: DateType | null, dateString: string) => void;
// onOpenChange?: (open: boolean) => void;
// onFocus?: FocusEventHandler;
// onBlur?: FocusEventHandler;
// onMousedown?: MouseEventHandler;
// onMouseup?: MouseEventHandler;
// onMouseenter?: MouseEventHandler;
// onMouseleave?: MouseEventHandler;
// onClick?: MouseEventHandler;
// onContextmenu?: MouseEventHandler;
// onKeydown?: (event: KeyboardEvent, preventDefault: () => void) => void;
onChange: {
type: Function as PropType<(value: DateType | string | null, dateString: string) => void>,
},
'onUpdate:value': { type: Function as PropType<(value: DateType | string | null) => void> },
onOk: { type: Function as PropType<(value: DateType | string | null) => void> },
onOpenChange: { type: Function as PropType<(open: boolean) => void> },
'onUpdate:open': { type: Function as PropType<(open: boolean) => void> },
onFocus: { type: Function as PropType<FocusEventHandler> },
onBlur: { type: Function as PropType<FocusEventHandler> },
onMousedown: { type: Function as PropType<MouseEventHandler> },
onMouseup: { type: Function as PropType<MouseEventHandler> },
onMouseenter: { type: Function as PropType<MouseEventHandler> },
onMouseleave: { type: Function as PropType<MouseEventHandler> },
onClick: { type: Function as PropType<MouseEventHandler> },
onContextmenu: { type: Function as PropType<MouseEventHandler> },
onKeydown: {
type: Function as PropType<(event: KeyboardEvent, preventDefault: () => void) => void>,
},
// WAI-ARIA
role: String,
name: String,
@ -100,6 +108,20 @@ export interface CommonProps<DateType> {
superNextIcon?: VueNode;
getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
panelRender?: (originPanel: VueNode) => VueNode;
onChange?: (value: DateType | string | null, dateString: string) => void;
'onUpdate:value'?: (value: DateType | string | null) => void;
onOk?: (value: DateType | string | null) => void;
onOpenChange?: (open: boolean) => void;
'onUpdate:open'?: (open: boolean) => void;
onFocus?: FocusEventHandler;
onBlur?: FocusEventHandler;
onMousedown?: MouseEventHandler;
onMouseup?: MouseEventHandler;
onMouseenter?: MouseEventHandler;
onMouseleave?: MouseEventHandler;
onClick?: MouseEventHandler;
onContextmenu?: MouseEventHandler;
onKeydown?: (event: KeyboardEvent, preventDefault: () => void) => void;
role?: string;
name?: string;
autocomplete?: string;
@ -153,10 +175,10 @@ function rangePickerProps<DateType>() {
allowEmpty: { type: Array as unknown as PropType<[boolean, boolean]> },
dateRender: { type: Function as PropType<RangeDateRender<DateType>> },
defaultPickerValue: {
type: Array as unknown as PropType<[DateType, DateType] | [string, string]>,
type: Array as unknown as PropType<RangeValue<DateType> | RangeValue<string>>,
},
defaultValue: { type: Array as unknown as PropType<[DateType, DateType] | [string, string]> },
value: { type: Array as unknown as PropType<[DateType, DateType] | [string, string]> },
defaultValue: { type: Array as unknown as PropType<RangeValue<DateType> | RangeValue<string>> },
value: { type: Array as unknown as PropType<RangeValue<DateType> | RangeValue<string>> },
disabledTime: {
type: Function as PropType<(date: EventValue<DateType>, type: RangeType) => DisabledTimes>,
},
@ -174,15 +196,43 @@ function rangePickerProps<DateType>() {
},
placeholder: Array,
mode: { type: Array as unknown as PropType<[PanelMode, PanelMode]> },
onChange: {
type: Function as PropType<
(
value: RangeValue<DateType> | RangeValue<string> | null,
dateString: [string, string],
) => void
>,
},
'onUpdate:value': {
type: Function as PropType<(value: RangeValue<DateType> | RangeValue<string> | null) => void>,
},
onCalendarChange: {
type: Function as PropType<
(
values: RangeValue<DateType> | RangeValue<string>,
formatString: [string, string],
info: RangeInfo,
) => void
>,
},
onPanelChange: {
type: Function as PropType<
(values: RangeValue<DateType> | RangeValue<string>, modes: [PanelMode, PanelMode]) => void
>,
},
onOk: {
type: Function as PropType<(dates: RangeValue<DateType> | RangeValue<string>) => void>,
},
};
}
export interface RangePickerProps<DateType> {
allowEmpty?: [boolean, boolean];
dateRender?: RangeDateRender<DateType>;
defaultPickerValue?: [DateType, DateType] | [string, string];
defaultValue?: [DateType, DateType] | [string, string];
value?: [DateType, DateType] | [string, string];
defaultPickerValue?: RangeValue<DateType> | RangeValue<string>;
defaultValue?: RangeValue<DateType> | RangeValue<string>;
value?: RangeValue<DateType> | RangeValue<string>;
disabledTime?: (date: EventValue<DateType>, type: RangeType) => DisabledTimes;
disabled?: [boolean, boolean];
format?: string;
@ -194,6 +244,21 @@ export interface RangePickerProps<DateType> {
>;
placeholder?: [string, string];
mode?: [PanelMode, PanelMode];
onChange?: (
value: RangeValue<DateType> | RangeValue<string> | null,
dateString: [string, string],
) => void;
'onUpdate:value'?: (value: RangeValue<DateType> | RangeValue<string> | null) => void;
onCalendarChange?: (
values: RangeValue<DateType> | RangeValue<string>,
formatString: [string, string],
info: RangeInfo,
) => void;
onPanelChange?: (
values: RangeValue<DateType> | RangeValue<string>,
modes: [PanelMode, PanelMode],
) => void;
onOk?: (dates: RangeValue<DateType> | RangeValue<string>) => void;
}
export type ExtraDatePickerProps<DateType> = {
@ -205,9 +270,9 @@ export type ExtraDatePickerProps<DateType> = {
export type ExtraRangePickerProps<DateType> = {
valueFormat?: string;
defaultPickerValue?: [DateType, DateType] | [string, string];
defaultValue?: [DateType, DateType] | [string, string];
value?: [DateType, DateType] | [string, string];
defaultPickerValue?: RangeValue<DateType> | RangeValue<string>;
defaultValue?: RangeValue<DateType> | RangeValue<string>;
value?: RangeValue<DateType> | RangeValue<string>;
};
export { commonProps, datePickerProps, rangePickerProps };

53
components/time-picker/time-picker.tsx
View File

@ -12,6 +12,7 @@ import type { PanelMode, RangeValue } from '../vc-picker/interface';
import type { RangePickerSharedProps } from '../vc-picker/RangePicker';
import devWarning from '../vc-util/devWarning';
import { useInjectFormItemContext } from '../form/FormItemContext';
import omit from '../_util/omit';
export interface TimePickerLocale {
placeholder?: string;
@ -57,11 +58,7 @@ export type TimePickerProps<DateType> = CommonProps<DateType> &
addon?: () => void;
};
function createTimePicker<
DateType,
DTimePickerProps extends TimePickerProps<DateType> = TimePickerProps<DateType>,
DTimeRangePickerProps extends TimeRangePickerProps<DateType> = TimeRangePickerProps<DateType>,
>(generateConfig: GenerateConfig<DateType>) {
function createTimePicker<DateType>(generateConfig: GenerateConfig<DateType>) {
const DatePicker = generatePicker<DateType>(generateConfig, {
...timePickerProps,
order: { type: Boolean, default: true },
@ -69,11 +66,16 @@ function createTimePicker<
const { TimePicker: InternalTimePicker, RangePicker: InternalRangePicker } = DatePicker as any;
const TimePicker = defineComponent<DTimePickerProps>({
const TimePicker = defineComponent({
name: 'ATimePicker',
inheritAttrs: false,
props: {
...commonProps<DateType>(),
...datePickerProps<DateType>(),
...timePickerProps,
addon: { type: Function },
},
slot: ['addon', 'renderExtraFooter', 'suffixIcon', 'clearIcon'],
emits: ['change', 'openChange', 'focus', 'blur', 'ok', 'update:value', 'update:open'],
setup(props, { slots, expose, emit, attrs }) {
const formItemContext = useInjectFormItemContext();
devWarning(
@ -114,7 +116,7 @@ function createTimePicker<
return (
<InternalTimePicker
{...attrs}
{...restProps}
{...omit(restProps, ['onUpdate:value', 'onUpdate:open'])}
id={id}
dropdownClassName={props.popupClassName}
mode={undefined}
@ -134,28 +136,16 @@ function createTimePicker<
},
});
TimePicker.props = {
...commonProps<DateType>(),
...datePickerProps<DateType>(),
...timePickerProps,
addon: { type: Function },
};
const TimeRangePicker = defineComponent<DTimeRangePickerProps>({
const TimeRangePicker = defineComponent({
name: 'ATimeRangePicker',
inheritAttrs: false,
props: {
...commonProps<DateType>(),
...rangePickerProps<DateType>(),
...timePickerProps,
order: { type: Boolean, default: true },
},
slot: ['renderExtraFooter', 'suffixIcon', 'clearIcon'],
emits: [
'change',
'panelChange',
'ok',
'openChange',
'update:value',
'update:open',
'calendarChange',
'focus',
'blur',
],
setup(props, { slots, expose, emit, attrs }) {
const pickerRef = ref();
@ -209,7 +199,7 @@ function createTimePicker<
return (
<InternalRangePicker
{...attrs}
{...restProps}
{...omit(restProps, ['onUpdate:open', 'onUpdate:value'])}
id={id}
dropdownClassName={props.popupClassName}
picker="time"
@ -229,13 +219,6 @@ function createTimePicker<
},
});
TimeRangePicker.props = {
...commonProps<DateType>(),
...rangePickerProps<DateType>(),
...timePickerProps,
order: { type: Boolean, default: true },
};
return {
TimePicker,
TimeRangePicker,