test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-02 11:58:10 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix: 修复 input-datetime 无法输入问题 (#3914)

Browse Source
This commit is contained in:
吴多益 2022-03-31 13:29:36 +08:00 committed by GitHub
parent 6e28ed0400
commit 677a52ecc0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
scss/components/form/_date.scss
View File

@ -112,7 +112,6 @@
.#{$ns}DatePicker-shortcuts {
margin: 0;
background: var(--Calendar-shortcuts-bg);
padding: calc(
(
var(--Calendar-shortcuts-height) - var(--Calendar-fontSize) *
@ -121,7 +120,6 @@
)
var(--gap-sm);
list-style: none;
width: px2rem(250px);
& + .rdt .rdtPicker {
padding-top: 0;
@ -211,27 +209,28 @@
width: #{px2rem(472px)};
}
.rdtTimeWithoutD {}
.rdtTimeWithoutD {
}
.rdt {
user-select: none;
font-size: var(--Calendar-fontSize);
color: var(--Calendar-color);
.rdtDays{
.rdtDays {
display: flex;
// height: #{px2rem(280px)};
.rdtDaysPart{
.rdtDaysPart {
width: #{px2rem(264px)};
}
.rdtTimePart{
.rdtTimePart {
width: #{px2rem(131px)};
text-align: center;
}
.rdtTimePartWithS{
.rdtTimePartWithS {
width: #{px2rem(199px)};
text-align: center;
}

27
src/components/DatePicker.tsx
View File

@ -297,7 +297,7 @@ export interface DateProps extends LocaleProps, ThemeProps {
// [propName: string]: any;
onFocus?: Function;
onBlur?: Function;
onRef?: any
onRef?: any;
}
export interface DatePickerState {
@ -515,13 +515,20 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
if (value === '') {
onChange('');
} else {
const newDate = moment(value, inputFormat);
const dateValue = utc
? moment.utc(newDate).format(format)
: newDate.format(format);
// 小于 0 的日期丢弃
if (!dateValue.startsWith('-')) {
onChange(dateValue);
// 将输入的格式转成正则匹配，比如 YYYY-MM-DD HH:mm:ss 改成 \d\d\d\d\-
// 只有匹配成功才更新
const inputCheckRegex = new RegExp(
inputFormat!.replace(/[ymdhs]/gi, '\\d').replace(/-/gi, '\\-')
);
if (inputCheckRegex.test(value)) {
const newDate = moment(value, inputFormat);
const dateValue = utc
? moment.utc(newDate).format(format)
: newDate.format(format);
// 小于 0 的日期丢弃
if (!dateValue.startsWith('-')) {
onChange(dateValue);
}
}
}
}
@ -804,7 +811,7 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
<Calendar
value={date}
onChange={this.handleChange}
requiredConfirm={!!(dateFormat && timeFormat)}
requiredConfirm={false}
dateFormat={dateFormat}
inputFormat={inputFormat}
timeFormat={timeFormat}
@ -843,7 +850,7 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
<Calendar
value={date}
onChange={this.handleChange}
requiredConfirm={!!(dateFormat && timeFormat)}
requiredConfirm={false}
dateFormat={dateFormat}
inputFormat={inputFormat}
timeFormat={timeFormat}