Browse Source

setting a time limit on datetimepicker

master
analuizaff 3 years ago
parent
commit
0380d099f5
  1. 26
      src/app/components/forms/FormDatePicker.js

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

@ -7,6 +7,7 @@ import {
View,
Platform,
TouchableOpacity,
Alert,
} from "react-native";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import DateTimePicker from "@react-native-community/datetimepicker";
@ -14,9 +15,10 @@ import DateTimePicker from "@react-native-community/datetimepicker";
import moment from "moment";
import colors from "../../config/colors";
import { dimensions } from "../../config/dimensions";
import { showMessage } from "react-native-flash-message";
const FormDatePicker = (props) => {
const [disabled,setDisabled]=useState(props.disabled);
const [disabled, setDisabled] = useState(props.disabled);
const { textStyle, defaultDate } = props;
const [date, setDate] = useState(moment(defaultDate));
@ -25,6 +27,19 @@ const FormDatePicker = (props) => {
const [mode, setMode] = useState("date");
const [time, setTime] = useState(moment(defaultDate));
const validateTimeInput = (selectedDate) => {
if (!(moment().isSameOrAfter(selectedDate)) && new Date(moment()).getDay() == new Date(date).getDay()) {
Alert.alert(
"Horário inválido",
"Selecione um horário válido",
[
{ text: "OK", onPress: () => renderDatePicker() }
]
);
return false;
}
return true;
}
const onChange = (e, selectedDate) => {
setAuxDate(moment(selectedDate)); // variavel auxiliar para não alterar a data com a rolagem, apenas com o done
@ -32,19 +47,23 @@ const FormDatePicker = (props) => {
const androidOnChange = (e, selectedDate) => {
setShow(false);
if (selectedDate) {
if (mode == "date") {
setDate(moment(selectedDate));
props.onDateChange(selectedDate);
setMode("time");
setShow(true); // to show the picker again in time mode
} else {
}
else {
if (validateTimeInput(selectedDate)) {
setTime(moment(selectedDate));
props.onTimeChange(selectedDate);
setShow(false);
setMode("date");
}
}
}
};
const onCancelPress = () => {
@ -61,11 +80,14 @@ const FormDatePicker = (props) => {
setShow(true); // to show the picker again in time mode
}
else {
if (validateTimeInput(auxDate)) {
setTime(moment(auxDate));
props.onTimeChange(auxDate);
setShow(false);
setMode("date");
}
}
};
const renderDatePicker = () => {

Loading…
Cancel
Save