Browse Source

Fixing date picker and making it work to get only the date by omitting the time hook

master
GabrielTrettel 3 years ago
parent
commit
5da978b0b6
  1. 23
      src/app/components/DatePicker.js
  2. 23
      src/app/components/forms/FormDatePicker.js

23
src/app/components/DatePicker.js

@ -48,9 +48,11 @@ export default function DatePicker(props) {
if (selectedDate) { if (selectedDate) {
if (mode == "date") { if (mode == "date") {
setDate(moment(selectedDate)); setDate(moment(selectedDate));
props.onDateChange(date);
setMode("time");
setShow(true); // to show the picker again in time mode
props.onDateChange(moment(selectedDate));
if (props.onTimeChange) {
setMode("time");
setShow(true); // to show the picker again in time mode
}
} else { } else {
if (validateTimeInput(selectedDate)) { if (validateTimeInput(selectedDate)) {
setTime(moment(selectedDate)); setTime(moment(selectedDate));
@ -74,8 +76,10 @@ export default function DatePicker(props) {
if (mode == "date") { if (mode == "date") {
setDate(moment(auxDate)); //atualizar a data com a variável auxiliar setDate(moment(auxDate)); //atualizar a data com a variável auxiliar
props.onDateChange(auxDate); props.onDateChange(auxDate);
setMode("time");
setShow(true); // to show the picker again in time mode
if (props.onTimeChange) {
setMode("time");
setShow(true); // to show the picker again in time mode
}
} else { } else {
if (validateTimeInput(auxDate)) { if (validateTimeInput(auxDate)) {
setTime(moment(auxDate)); setTime(moment(auxDate));
@ -96,7 +100,7 @@ export default function DatePicker(props) {
mode={mode} mode={mode}
is24Hour={true} is24Hour={true}
locale={"pt-br"} locale={"pt-br"}
minimumDate={new Date(moment().subtract(1, "month"))}
minimumDate={props.minimumDate}
maximumDate={new Date(moment())} maximumDate={new Date(moment())}
formatChosenDate={(selectedDate) => { formatChosenDate={(selectedDate) => {
if (mode == "date") { if (mode == "date") {
@ -112,7 +116,7 @@ export default function DatePicker(props) {
}; };
return ( return (
<View>
<View flex={1}>
<TouchableOpacity disabled={disabled} onPress={() => setShow(true)}> <TouchableOpacity disabled={disabled} onPress={() => setShow(true)}>
{props.children} {props.children}
</TouchableOpacity> </TouchableOpacity>
@ -144,7 +148,6 @@ export default function DatePicker(props) {
borderTopColor: "#d3d3d3", borderTopColor: "#d3d3d3",
borderTopWidth: 1, borderTopWidth: 1,
}} }}
// onPress={() => console.log("datepicker clicked")}
> >
<View <View
style={{ style={{
@ -182,7 +185,9 @@ DatePicker.defaultProps = {
textStyle: {}, textStyle: {},
defaultDate: moment(), defaultDate: moment(),
onDateChange: () => {}, onDateChange: () => {},
onTimeChange: () => {},
onTimeChange: undefined,
minimumDate: new Date(moment().subtract(1, "month")),
flex: 0,
}; };
const styles = StyleSheet.create({ const styles = StyleSheet.create({

23
src/app/components/forms/FormDatePicker.js

@ -53,21 +53,32 @@ function PluvRegisterPicker(props) {
); );
} }
export default function FormDatePicker({ formTypeFace = "events", ...props }) {
export default function FormDatePicker({ formTypeFace = "events", onDateChange, onTimeChange, children, ...props }) {
const RenderFace = () => {
if (children)
return children
else if (formTypeFace == "events")
return EventsDatePicker(props)
else
return PluvRegisterPicker(props)
}
return ( return (
<View flex={1}>
<DatePicker <DatePicker
textStyle={{ textStyle={{
borderColor: colors.gray, borderColor: colors.gray,
borderWidth: 3, borderWidth: 3,
}} }}
defaultDate={new Date()} defaultDate={new Date()}
onDateChange={props.onDateChange}
onTimeChange={props.onTimeChange}
onDateChange={onDateChange}
onTimeChange={onTimeChange}
{...props}
> >
{formTypeFace == "events"
? EventsDatePicker(props)
: PluvRegisterPicker(props)}
<RenderFace/>
</DatePicker> </DatePicker>
</View>
); );
} }

Loading…
Cancel
Save