diff --git a/src/static-date-picker/StaticDatePicker.tsx b/src/static-date-picker/StaticDatePicker.tsx index aacd547e86..e717033072 100644 --- a/src/static-date-picker/StaticDatePicker.tsx +++ b/src/static-date-picker/StaticDatePicker.tsx @@ -4,6 +4,7 @@ import { ArrowsLeftOutlined, ArrowLeftOutlined, ArrowRightOutlined, ArrowsRightO import PickerPanel from 'rc-picker/lib/PickerPanel'; import generateDateFns from 'rc-picker/lib/generate/dateFns'; import { Locale, PickerMode } from 'rc-picker/lib/interface'; +import { exportDateToZonedDate } from '../utils/timeHelper'; import defaultLocale from './locales/zh-CN'; import { StaticDatePickerProps } from './interfaces'; @@ -81,7 +82,7 @@ const StaticDatePicker: React.FC = ({ {...restProps} pickerValue={viewDate} onSelect={(date) => { - onSelect?.(date); + onSelect?.(exportDateToZonedDate(date, 'yyyy-MM-DD')); }} onChange={(date) => { setViewDate(date, true); diff --git a/src/static-date-range-picker/StaticDateRangePicker.tsx b/src/static-date-range-picker/StaticDateRangePicker.tsx index cf4c78e15f..48892b53bc 100644 --- a/src/static-date-range-picker/StaticDateRangePicker.tsx +++ b/src/static-date-range-picker/StaticDateRangePicker.tsx @@ -8,6 +8,7 @@ import isBefore from 'date-fns/isBefore'; import StaticDatePicker, { StaticDatePickerContext } from '../static-date-picker'; import { StaticDateRangePickerProps } from './interfaces'; import { getDefaultViewDates, calcClosingViewDate, mergeDates } from './utils'; +import { exportDateToZonedDate } from '../utils/timeHelper'; function StaticDateRangePicker({ className, @@ -86,7 +87,7 @@ function StaticDateRangePicker({ }, onSelect: (currentValue) => { const newValue = mergeDates(selectedValue, currentValue, dateIndex); - onSelect?.(newValue as [Date, Date], dateIndex); + onSelect?.(newValue?.map((date) => exportDateToZonedDate(date, 'yyyy-MM-DD')) as [Date, Date], dateIndex); setSelectedValue(newValue, true); setDateIndex(1 - dateIndex); }, diff --git a/src/static-past-time-picker/AbsoluteRangePicker.tsx b/src/static-past-time-picker/AbsoluteRangePicker.tsx index 40eab4c2e4..154eb40364 100644 --- a/src/static-past-time-picker/AbsoluteRangePicker.tsx +++ b/src/static-past-time-picker/AbsoluteRangePicker.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { getTime, isValid, isAfter, startOfToday, subMonths, endOfDay, startOfDay } from 'date-fns'; +import { getTime, isValid, isAfter, startOfToday, subMonths, startOfDay } from 'date-fns'; import { usePrefixCls, useLocale } from '@gio-design/utils'; import { formatDates } from '../date-range-picker/index'; import StaticDateRangePicker from '../static-date-range-picker/index'; @@ -7,6 +7,7 @@ import InnerRangePanel from './InnerRangePanel'; import { RangePickerProps } from './interfaces'; import { parseStartAndEndDate } from './utils'; import defaultLocale from './locales/zh-CN'; +import { exportDateToZonedDate } from '../utils/timeHelper'; function AbsoluteRangePicker({ disabledDate, timeRange, onSelect, onRangeSelect, onCancel }: RangePickerProps) { const [dates, setDates] = React.useState<[Date | undefined, Date | undefined]>(parseStartAndEndDate(timeRange)); @@ -28,12 +29,16 @@ function AbsoluteRangePicker({ disabledDate, timeRange, onSelect, onRangeSelect, }; const handleDisabledDate = (current: Date) => disabledDate?.(current) || isAfter(current, startOfToday()); const handleOnOK = () => { - onSelect(`abs:${getTime(startOfDay(dates[0] as Date))},${getTime(endOfDay(dates[1] as Date))}`); + onSelect( + `abs:${getTime(exportDateToZonedDate(dates[0] as Date))},${ + getTime(exportDateToZonedDate(dates[1] as Date)) + 86399999 + }` + ); }; const handleOnSelect = (date: [Date, Date], index: number) => { setDates(date); onRangeSelect?.(date, index); - } + }; const endDay = dates[1] !== undefined && isValid(dates[1]) ? dates[1] : new Date(); return ( { - onSelect(`${endKey === 'yesterday' ? 'since-lt-today' : 'since'}:${getTime(startOfDay(startDate as Date))}`); + onSelect(`${endKey === 'yesterday' ? 'since-lt-today' : 'since'}:${getTime(exportDateToZonedDate(startDate))}`); }; return ( - moment(data as string, format).tz(localStorage.getItem('timezone') || 'UTC'); + momentTZ(data as string, format).tz(localStorage.getItem('timezone') || 'UTC'); // 时间日期转换时区 date-fns export const parseFnsTimeZone = (date: number | Date | string, format: string) => { @@ -12,7 +13,18 @@ export const parseFnsTimeZone = (date: number | Date | string, format: string) = if (isNumber(date)) { finalDate = new Date(date); } + return dateFnsFormat(finalDate, format, { timeZone: localStorage.getItem('timezone') || 'UTC', }); }; + +// 选择器时间按时区转化 +// 例: date: Fri Oct 21 2022 09:00:00 GMT+0800 (中国标准时间) format: 'yyyy-MM-DD'; +// return +export const exportDateToZonedDate = (date: any, format?: string) => { + if (!date) return date; + return new Date( + momentTZ.tz(moment(date).format(format || 'yyyy-MM-DD'), localStorage.getItem('timezone') || 'UTC').format() + ); +};