added date format to date picker

This commit is contained in:
Nikhil Nandagopal 2020-06-09 14:14:13 +05:30
parent 563c74f1a9
commit 8501ebe670
4 changed files with 14 additions and 9 deletions

View File

@ -106,7 +106,7 @@ class DatePickerComponent extends React.Component<
className={this.props.isLoading ? "bp3-skeleton" : ""}
formatDate={this.formatDate}
parseDate={this.parseDate}
placeholder={this.props.dateFormat}
placeholder={"Select Date"}
disabled={this.props.isDisabled}
showActionsBar={true}
timePrecision={TimePrecision.MINUTE}
@ -137,16 +137,17 @@ class DatePickerComponent extends React.Component<
}
formatDate = (date: Date): string => {
const dateFormat = "DD/MM/YYYY HH:mm";
return moment(date).format(dateFormat);
return moment(date).format(this.props.dateFormat);
};
parseDate = (dateStr: string): Date => {
return moment(dateStr, "DD/MM/YYYY HH:mm").toDate();
return moment(dateStr).toDate();
};
onDateSelected = (selectedDate: Date) => {
const date = selectedDate ? moment(selectedDate).toISOString(true) : "";
const date = selectedDate
? moment(selectedDate).format(this.props.dateFormat)
: "";
this.setState({ selectedDate: date });
this.props.onDateSelected(date);
};

View File

@ -86,10 +86,10 @@ const WidgetConfigResponse: WidgetConfigReducerState = {
datePickerType: "DATE_PICKER",
rows: 1,
label: "",
dateFormat: "DD/MM/YYYY",
dateFormat: "DD/MM/YYYY HH:mm",
columns: 5,
widgetName: "DatePicker",
defaultDate: moment().toISOString(true),
defaultDate: moment().format("DD/MM/YYYY HH:mm"),
},
TABLE_WIDGET: {
rows: 7,

View File

@ -403,7 +403,11 @@ export const VALIDATORS: Record<ValidationType, Validator> = {
};
}
const isValid = moment(value).isValid();
const parsed = isValid ? moment(value).toISOString(true) : today;
const parsed = isValid
? props.dateFormat
? moment(value).format(props.dateFormat)
: moment(value).toISOString(true)
: today;
return {
isValid,
parsed,

View File

@ -59,7 +59,7 @@ class DatePickerWidget extends BaseWidget<DatePickerWidgetProps, WidgetState> {
return (
<DatePickerComponent
label={`${this.props.label}`}
dateFormat={"DD/MM/YYYY HH:mm"}
dateFormat={this.props.dateFormat}
widgetId={this.props.widgetId}
isDisabled={this.props.isDisabled}
datePickerType={"DATE_PICKER"}