From b2b8da3c0890408c2498fd92d30036e6e95e2e33 Mon Sep 17 00:00:00 2001 From: Kermit Date: Thu, 25 Feb 2021 19:58:21 +0800 Subject: [PATCH] chore: optimize experience of hover value (#220) --- examples/basic.tsx | 3 ++- src/PickerPanel.tsx | 18 ++++++++++++++++-- src/panels/DatetimePanel/index.tsx | 29 ++--------------------------- src/utils/timeUtil.ts | 27 +++++++++++++++++++++++++++ 4 files changed, 47 insertions(+), 30 deletions(-) diff --git a/examples/basic.tsx b/examples/basic.tsx index a68704a96..abf794455 100644 --- a/examples/basic.tsx +++ b/examples/basic.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import moment, { Moment } from 'moment'; +import type { Moment } from 'moment'; +import moment from 'moment'; import Picker from '../src/Picker'; import momentGenerateConfig from '../src/generate/moment'; import zhCN from '../src/locale/zh_CN'; diff --git a/src/PickerPanel.tsx b/src/PickerPanel.tsx index 1dcdac8eb..9c7224691 100644 --- a/src/PickerPanel.tsx +++ b/src/PickerPanel.tsx @@ -37,7 +37,7 @@ import type { MonthCellRender } from './panels/MonthPanel/MonthBody'; import RangeContext from './RangeContext'; import getExtraFooter from './utils/getExtraFooter'; import getRanges from './utils/getRanges'; -import { getLowerBoundTime, setTime } from './utils/timeUtil'; +import { getLowerBoundTime, setDateTime, setTime } from './utils/timeUtil'; export type PickerPanelSharedProps = { prefixCls?: string; @@ -202,7 +202,21 @@ function PickerPanel(props: PickerPanelProps) { const [viewDate, setInnerViewDate] = useMergedState(null, { value: pickerValue, defaultValue: defaultPickerValue || mergedValue, - postState: (date) => date || generateConfig.getNow(), + postState: (date) => { + const now = generateConfig.getNow(); + if (!date) return now; + // When value is null and set showTime + if (!mergedValue && showTime) { + if (typeof showTime === 'object') { + return setDateTime(generateConfig, date, showTime.defaultValue || now); + } + if (defaultValue) { + return setDateTime(generateConfig, date, defaultValue); + } + return setDateTime(generateConfig, date, now); + } + return date; + }, }); const setViewDate = (date: DateType) => { diff --git a/src/panels/DatetimePanel/index.tsx b/src/panels/DatetimePanel/index.tsx index eb3faccc9..a3e5d490f 100644 --- a/src/panels/DatetimePanel/index.tsx +++ b/src/panels/DatetimePanel/index.tsx @@ -6,33 +6,8 @@ import DatePanel from '../DatePanel'; import type { SharedTimeProps } from '../TimePanel'; import TimePanel from '../TimePanel'; import { tuple } from '../../utils/miscUtil'; -import type { PanelRefProps, DisabledTime, NullableDateType } from '../../interface'; -import type { GenerateConfig } from '../../generate'; - -function setTime( - generateConfig: GenerateConfig, - date: DateType, - defaultDate: NullableDateType, -) { - if (!defaultDate) { - return date; - } - - let newDate = date; - newDate = generateConfig.setHour( - newDate, - generateConfig.getHour(defaultDate), - ); - newDate = generateConfig.setMinute( - newDate, - generateConfig.getMinute(defaultDate), - ); - newDate = generateConfig.setSecond( - newDate, - generateConfig.getSecond(defaultDate), - ); - return newDate; -} +import { setDateTime as setTime } from '../../utils/timeUtil'; +import type { PanelRefProps, DisabledTime } from '../../interface'; export type DatetimePanelProps = { disabledTime?: DisabledTime; diff --git a/src/utils/timeUtil.ts b/src/utils/timeUtil.ts index 0b9e5dc61..3b4051824 100644 --- a/src/utils/timeUtil.ts +++ b/src/utils/timeUtil.ts @@ -1,3 +1,4 @@ +import type { NullableDateType } from '../interface'; import type { GenerateConfig } from '../generate'; export function setTime( @@ -13,6 +14,32 @@ export function setTime( return nextTime; } +export function setDateTime( + generateConfig: GenerateConfig, + date: DateType, + defaultDate: NullableDateType, +) { + if (!defaultDate) { + return date; + } + + let newDate = date; + newDate = generateConfig.setHour( + newDate, + generateConfig.getHour(defaultDate), + ); + newDate = generateConfig.setMinute( + newDate, + generateConfig.getMinute(defaultDate), + ); + newDate = generateConfig.setSecond( + newDate, + generateConfig.getSecond(defaultDate), + ); + return newDate; +} + + export function getLowerBoundTime( hour: number, minute: number,