fm453/nocobase
1
0
Fork 0
mirror of https://gitee.com/nocobase/nocobase.git synced 2025-05-07 22:49:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: date range picker in filter form/action not showing time picker when showTime=true is set (#5956)

Browse Source
This commit is contained in:
Katherine 2024-12-28 21:28:46 +08:00 committed by GitHub
parent 31ddbc402f
commit 2fd614fd64
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 25 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
packages/core/client/src/schema-component/antd/date-picker/DatePicker.tsx
View File

@ -12,7 +12,7 @@ import { DatePicker as AntdDatePicker, DatePickerProps as AntdDatePickerProps, S
import { RangePickerProps } from 'antd/es/date-picker';
import dayjs from 'dayjs';
import React, { useState, useEffect, useRef } from 'react';
import { getPickerFormat } from '@nocobase/utils/client';
import { getPickerFormat, getDateTimeFormat } from '@nocobase/utils/client';
import { useTranslation } from 'react-i18next';
import { ReadPretty, ReadPrettyComposed } from './ReadPretty';
import { getDateRanges, mapDatePicker, mapRangePicker, inferPickerType } from './util';
@ -167,7 +167,7 @@ export const DatePicker: ComposedDatePicker = (props: any) => {
DatePicker.ReadPretty = ReadPretty.DatePicker;
DatePicker.RangePicker = function RangePicker(props: any) {
const { value, picker = 'date', format } = props;
const { value, picker = 'date', format, showTime, timeFormat } = props;
const { t } = useTranslation();
const fieldSchema = useFieldSchema();
const field: any = useField();
@ -198,14 +198,14 @@ DatePicker.RangePicker = function RangePicker(props: any) {
];
const targetPicker = value ? inferPickerType(value?.[0]) : picker;
const targetFormat = getPickerFormat(targetPicker) || format;
const targetDateFormat = getPickerFormat(targetPicker) || format;
const newProps: any = {
utc,
presets,
...props,
format: targetFormat,
format: getDateTimeFormat(targetPicker, targetDateFormat, showTime, timeFormat),
picker: targetPicker,
showTime: props.showTime ? { defaultValue: [dayjs('00:00:00', 'HH:mm:ss'), dayjs('00:00:00', 'HH:mm:ss')] } : false,
showTime: showTime ? { defaultValue: [dayjs('00:00:00', 'HH:mm:ss'), dayjs('00:00:00', 'HH:mm:ss')] } : false,
};
const [stateProps, setStateProps] = useState(newProps);
@ -240,17 +240,18 @@ DatePicker.RangePicker = function RangePicker(props: any) {
])}
onChange={(value) => {
const format = getPickerFormat(value);
const dateTimeFormat = getDateTimeFormat(value, format, showTime, timeFormat);
field.setComponentProps({
picker: value,
format,
});
newProps.picker = value;
newProps.format = format;
newProps.format = dateTimeFormat;
setStateProps(newProps);
fieldSchema['x-component-props'] = {
...props,
picker: value,
format,
format: dateTimeFormat,
};
field.value = undefined;
}}
@ -263,19 +264,19 @@ DatePicker.RangePicker = function RangePicker(props: any) {
};
DatePicker.FilterWithPicker = function FilterWithPicker(props: any) {
const { picker = 'date', format } = props;
const { picker = 'date', format, showTime, timeFormat } = props;
const { utc = true } = useDatePickerContext();
const value = Array.isArray(props.value) ? props.value[0] : props.value;
const compile = useCompile();
const fieldSchema = useFieldSchema();
const targetPicker = value ? inferPickerType(value) : picker;
const targetFormat = getPickerFormat(targetPicker) || format;
const targetDateFormat = getPickerFormat(targetPicker) || format;
const newProps = {
utc,
...props,
underFilter: true,
showTime: props.showTime ? { defaultValue: dayjs('00:00:00', 'HH:mm:ss') } : false,
format: targetFormat,
showTime: showTime ? { defaultValue: dayjs('00:00:00', 'HH:mm:ss') } : false,
format: getDateTimeFormat(targetPicker, targetDateFormat, showTime, timeFormat),
picker: targetPicker,
onChange: (val) => {
props.onChange(undefined);
@ -316,17 +317,18 @@ DatePicker.FilterWithPicker = function FilterWithPicker(props: any) {
])}
onChange={(value) => {
const format = getPickerFormat(value);
const dateTimeFormat = getDateTimeFormat(value, format, showTime, timeFormat);
field.setComponentProps({
picker: value,
format,
});
newProps.picker = value;
newProps.format = format;
newProps.format = dateTimeFormat;
setStateProps(newProps);
fieldSchema['x-component-props'] = {
...props,
picker: value,
format,
format: dateTimeFormat,
};
field.value = null;
}}

10
packages/core/utils/src/date.ts
View File

@ -225,3 +225,13 @@ export const getPickerFormat = (picker) => {
return 'YYYY-MM-DD';
}
};
export const getDateTimeFormat = (picker, format, showTime, timeFormat) => {
if (picker === 'date') {
if (showTime) {
return format + timeFormat || 'HH:mm:ss';
}
return format;
}
return format;
};