Skip to content

Commit de854f1

Browse files
DatePicker: set default values to empty instead of date
1 parent 0013e87 commit de854f1

File tree

2 files changed

+41
-40
lines changed

2 files changed

+41
-40
lines changed

client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx

Lines changed: 29 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -166,7 +166,7 @@ export type DateCompViewProps = Pick<
166166
};
167167

168168
export const datePickerControl = new UICompBuilder(childrenMap, (props) => {
169-
let time = dayjs(null);
169+
let time = null;
170170
if (props.value.value !== '') {
171171
time = dayjs(props.value.value, DateParser);
172172
}
@@ -187,7 +187,7 @@ export const datePickerControl = new UICompBuilder(childrenMap, (props) => {
187187
minDate={props.minDate}
188188
maxDate={props.maxDate}
189189
placeholder={props.placeholder}
190-
value={time.isValid() ? time : null}
190+
value={time?.isValid() ? time : null}
191191
onChange={(time) => {
192192
handleDateChange(
193193
time && time.isValid()
@@ -285,11 +285,12 @@ export const dateRangeControl = (function () {
285285
};
286286

287287
return new UICompBuilder(childrenMap, (props) => {
288-
let start = dayjs(null);
289-
let end = dayjs(null);
288+
let start = null;
289+
let end = null;
290290
if (props.start.value !== '') {
291291
start = dayjs(props.start.value, DateParser);
292292
}
293+
293294
if (props.end.value !== '') {
294295
end = dayjs(props.end.value, DateParser);
295296
}
@@ -300,8 +301,8 @@ export const dateRangeControl = (function () {
300301
$style={props.inputFieldStyle}
301302
disabled={props.disabled}
302303
{...datePickerProps(props)}
303-
start={start.isValid() ? start : null}
304-
end={end.isValid() ? end : null}
304+
start={start?.isValid() ? start : null}
305+
end={end?.isValid() ? end : null}
305306
minDate={props.minDate}
306307
maxDate={props.maxDate}
307308
placeholder={[props.placeholder, props.placeholder]}
@@ -418,26 +419,26 @@ export const DatePickerComp = withExposingConfigs(datePickerControl, [
418419
desc: trans("export.datePickerValueDesc"),
419420
depKeys: ["value", "showTime"],
420421
func: (input) => {
421-
const mom = dayjs(input.value, DateParser);
422-
return mom.isValid() ? mom.format(input.showTime ? DATE_TIME_FORMAT : DATE_FORMAT) : "";
422+
const mom = Boolean(input.value) ? dayjs(input.value, DateParser) : null;
423+
return mom?.isValid() ? mom.format(input.showTime ? DATE_TIME_FORMAT : DATE_FORMAT) : null;
423424
},
424425
}),
425426
depsConfig({
426427
name: "formattedValue",
427428
desc: trans("export.datePickerFormattedValueDesc"),
428429
depKeys: ["value", "format"],
429430
func: (input) => {
430-
const mom = dayjs(input.value, DateParser);
431-
return mom.isValid() ? mom.format(input.format) : "";
431+
const mom = Boolean(input.value) ? dayjs(input.value, DateParser) : null;
432+
return mom?.isValid() ? mom.format(input.format) : "";
432433
},
433434
}),
434435
depsConfig({
435436
name: "timestamp",
436437
desc: trans("export.datePickerTimestampDesc"),
437438
depKeys: ["value"],
438439
func: (input) => {
439-
const mom = dayjs(input.value, DateParser);
440-
return mom.isValid() ? mom.unix() : "";
440+
const mom = Boolean(input.value) ? dayjs(input.value, DateParser) : null;
441+
return mom?.isValid() ? mom.unix() : "";
441442
},
442443
}),
443444
depsConfig({
@@ -459,47 +460,47 @@ export let DateRangeComp = withExposingConfigs(dateRangeControl, [
459460
desc: trans("export.dateRangeStartDesc"),
460461
depKeys: ["start", "showTime"],
461462
func: (input) => {
462-
const mom = dayjs(input.start, DateParser);
463-
return mom.isValid() ? mom.format(input.showTime ? DATE_TIME_FORMAT : DATE_FORMAT) : "";
463+
const mom = Boolean(input.start) ? dayjs(input.start, DateParser): null;
464+
return mom?.isValid() ? mom.format(input.showTime ? DATE_TIME_FORMAT : DATE_FORMAT) : null;
464465
},
465466
}),
466467
depsConfig({
467468
name: "end",
468469
desc: trans("export.dateRangeEndDesc"),
469470
depKeys: ["end", "showTime"],
470471
func: (input) => {
471-
const mom = dayjs(input.end, DateParser);
472-
return mom.isValid() ? mom.format(input.showTime ? DATE_TIME_FORMAT : DATE_FORMAT) : "";
472+
const mom = Boolean(input.end) ? dayjs(input.end, DateParser): null;
473+
return mom?.isValid() ? mom.format(input.showTime ? DATE_TIME_FORMAT : DATE_FORMAT) : null;
473474
},
474475
}),
475476
depsConfig({
476477
name: "startTimestamp",
477478
desc: trans("export.dateRangeStartTimestampDesc"),
478479
depKeys: ["start"],
479480
func: (input) => {
480-
const mom = dayjs(input.start, DateParser);
481-
return mom.isValid() ? mom.unix() : "";
481+
const mom = Boolean(input.start) ? dayjs(input.start, DateParser) : null;
482+
return mom?.isValid() ? mom.unix() : "";
482483
},
483484
}),
484485
depsConfig({
485486
name: "endTimestamp",
486487
desc: trans("export.dateRangeEndTimestampDesc"),
487488
depKeys: ["end"],
488489
func: (input) => {
489-
const mom = dayjs(input.end, DateParser);
490-
return mom.isValid() ? mom.unix() : "";
490+
const mom = Boolean(input.end) ? dayjs(input.end, DateParser) : null;
491+
return mom?.isValid() ? mom.unix() : "";
491492
},
492493
}),
493494
depsConfig({
494495
name: "formattedValue",
495496
desc: trans("export.dateRangeFormattedValueDesc"),
496497
depKeys: ["start", "end", "format"],
497498
func: (input) => {
498-
const start = dayjs(input.start, DateParser);
499-
const end = dayjs(input.end, DateParser);
499+
const start = Boolean(input.start) ? dayjs(input.start, DateParser): null;
500+
const end = Boolean(input.end) ? dayjs(input.end, DateParser): null;
500501
return [
501-
start.isValid() && start.format(input.format),
502-
end.isValid() && end.format(input.format),
502+
start?.isValid() && start.format(input.format),
503+
end?.isValid() && end.format(input.format),
503504
]
504505
.filter((item) => item)
505506
.join(" - ");
@@ -510,17 +511,17 @@ export let DateRangeComp = withExposingConfigs(dateRangeControl, [
510511
desc: trans("export.dateRangeFormattedStartValueDesc"),
511512
depKeys: ["start", "format"],
512513
func: (input) => {
513-
const start = dayjs(input.start, DateParser);
514-
return start.isValid() && start.format(input.format);
514+
const start = Boolean(input.start) ? dayjs(input.start, DateParser): null;
515+
return start?.isValid() && start.format(input.format);
515516
},
516517
}),
517518
depsConfig({
518519
name: "formattedEndValue",
519520
desc: trans("export.dateRangeFormattedEndValueDesc"),
520521
depKeys: ["end", "format"],
521522
func: (input) => {
522-
const end = dayjs(input.end, DateParser);
523-
return end.isValid() && end.format(input.format);
523+
const end = Boolean(input.end) ? dayjs(input.end, DateParser): null;
524+
return end?.isValid() && end.format(input.format);
524525
},
525526
}),
526527
depsConfig({

client/packages/lowcoder/src/comps/comps/dateComp/timeComp.tsx

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,7 @@ export type TimeCompViewProps = Pick<
137137
};
138138

139139
export const timePickerControl = new UICompBuilder(childrenMap, (props) => {
140-
let time = dayjs(null);
140+
let time = null;
141141
if(props.value.value !== '') {
142142
time = dayjs(props.value.value, TimeParser);
143143
}
@@ -150,7 +150,7 @@ export const timePickerControl = new UICompBuilder(childrenMap, (props) => {
150150
viewRef={props.viewRef}
151151
$style={props.style}
152152
disabled={props.disabled}
153-
value={time.isValid() ? time : null}
153+
value={time?.isValid() ? time : null}
154154
disabledTime={() => disabledTime(props.minTime, props.maxTime)}
155155
{...timePickerComps(props)}
156156
hourStep={props.hourStep as hourStepType}
@@ -339,8 +339,8 @@ export const TimePickerComp = withExposingConfigs(timePickerControl, [
339339
desc: trans("export.timePickerFormattedValueDesc"),
340340
depKeys: ["value", "format"],
341341
func: (input) => {
342-
const mom = dayjs(input.value, TimeParser);
343-
return mom.isValid() ? mom.format(input.format) : "";
342+
const mom = Boolean(input.value) ? dayjs(input.value, TimeParser) : null;
343+
return mom?.isValid() ? mom.format(input.format) : '';
344344
},
345345
}),
346346
depsConfig({
@@ -364,11 +364,11 @@ export let TimeRangeComp = withExposingConfigs(timeRangeControl, [
364364
desc: trans("export.timeRangeFormattedValueDesc"),
365365
depKeys: ["start", "end", "format"],
366366
func: (input) => {
367-
const start = dayjs(input.start, TimeParser);
368-
const end = dayjs(input.end, TimeParser);
367+
const start = Boolean(input.start) ? dayjs(input.start, TimeParser) : null;
368+
const end = Boolean(input.end) ? dayjs(input.end, TimeParser) : null;
369369
return [
370-
start.isValid() && start.format(input.format),
371-
end.isValid() && end.format(input.format),
370+
start?.isValid() && start.format(input.format),
371+
end?.isValid() && end.format(input.format),
372372
]
373373
.filter((item) => item)
374374
.join(" - ");
@@ -379,17 +379,17 @@ export let TimeRangeComp = withExposingConfigs(timeRangeControl, [
379379
desc: trans("export.timeRangeFormattedStartValueDesc"),
380380
depKeys: ["start", "format"],
381381
func: (input) => {
382-
const start = dayjs(input.start, TimeParser);
383-
return start.isValid() && start.format(input.format);
382+
const start = Boolean(input.start) ? dayjs(input.start, TimeParser) : null;
383+
return start?.isValid() && start.format(input.format);
384384
},
385385
}),
386386
depsConfig({
387387
name: "formattedEndValue",
388388
desc: trans("export.timeRangeFormattedEndValueDesc"),
389389
depKeys: ["end", "format"],
390390
func: (input) => {
391-
const end = dayjs(input.end, TimeParser);
392-
return end.isValid() && end.format(input.format);
391+
const end = Boolean(input.end) ? dayjs(input.end, TimeParser) : null;
392+
return end?.isValid() && end.format(input.format);
393393
},
394394
}),
395395
depsConfig({

0 commit comments

Comments
 (0)