diff --git a/src/app/components/forms/FormDatePicker.js b/src/app/components/forms/FormDatePicker.js index 1310d8a..b43fce9 100644 --- a/src/app/components/forms/FormDatePicker.js +++ b/src/app/components/forms/FormDatePicker.js @@ -1,151 +1,152 @@ -import React, { useState } from "react"; -import { - Modal, - StyleSheet, - Text, - TouchableHighlight, - View, - Platform, - TouchableOpacity, -} from "react-native"; +import React, { useState } from 'react'; 7 +import { Modal, StyleSheet, Text, TouchableHighlight, View, Platform, TouchableOpacity } from 'react-native'; import DateTimePicker from "@react-native-community/datetimepicker"; import moment from "moment"; -import colors from "../../config/colors"; +import colors from '../../config/colors'; const FormDatePicker = (props) => { - const { textStyle, defaultDate } = props; - const [date, setDate] = useState(moment(defaultDate)); - const [show, setShow] = useState(false); - - const onChange = (e, selectedDate) => { - setDate(moment(selectedDate)); - }; - - const androidOnChange = (e, selectedDate) => { - setShow(false); - if (selectedDate) { - setDate(moment(selectedDate)); - props.onDateChange(selectedDate); - // console.log(moment(selectedDate).format("DD-MM-YYYY")); - // console.log(date.format("DD-MM-YYYY")); + + const { textStyle, defaultDate } = props; + const [date, setDate] = useState(moment(defaultDate)); + const [show, setShow] = useState(false); + const [auxDate, setAuxDate] = useState(moment()); + + const onChange = (e, selectedDate) => { + setAuxDate(moment(selectedDate)); // variavel auxiliar para não alterar a data com a rolagem, apenas com o done + } + + const androidOnChange = (e, selectedDate) => { + setShow(false); + if (selectedDate) { + setDate(moment(selectedDate)); + props.onDateChange(selectedDate); + } + } + + const onCancelPress = () => { + //setDate(moment(defaultDate)); + setShow(false); + //console.log(moment(defaultDate).format("DD-MM-YYYY")) + } + + const onDonePress = () => { + setDate(moment(auxDate)); //atualizar a data com a variável auxiliar + props.onDateChange(auxDate); + setShow(false); + //console.log("done"); + //console.log(date.format("DD-MM-YYYY")); + } - }; - - const onCancelPress = () => { - setDate(moment(defaultDate)); - setShow(false); - //console.log(moment(defaultDate).format("DD-MM-YYYY")) - }; - - const onDonePress = () => { - props.onDateChange(date); - setShow(false); - //console.log("done"); - //console.log(date.format("DD-MM-YYYY")); - }; - - const renderDatePicker = () => { + + const renderDatePicker = () => { + return ( + {return moment(selectedDate).format('DD/MM/YYYY');}} //formatar a data do selected date + display={Platform.OS === 'ios' ? 'spinner' : 'default'} + onChange={Platform.OS === 'ios' ? onChange : androidOnChange} + /> + ) + } + return ( - - ); - }; - - return ( - setShow(true)}> - {date.format("DD-MM-YYYY")} - {Platform.OS !== "ios" && show && renderDatePicker()} - - {Platform.OS === "ios" && show && ( - setShow(false)} - > - - setShow(false)} - > - console.log("datepicker clicked")} - > - setShow(true)}> + {date.format("DD/MM/YYYY")} + {Platform.OS !== 'ios' && show && renderDatePicker()} + + {Platform.OS === 'ios' && show && ( + setShow(false)} > - {renderDatePicker()} - onCancelPress()} - style={[styles.btnText, styles.btnCancel]} - > - Cancel - - onDonePress()} - style={[styles.btnText, styles.btnDone]} - > - Done - - - - - - - )} - - ); + + setShow(false)}> + console.log("datepicker clicked")} + > + + + { renderDatePicker() } + + onCancelPress()} + style={[styles.btnText, styles.btnCancel]} + > + + Cancelar + + + onDonePress()} + style={[styles.btnText, styles.btnDone]} + > + + Confirmar + + + + + + + + + + )} + + ); }; FormDatePicker.defaultProps = { - textStyle: {}, - defaultDate: moment(), - onDateChange: () => {}, -}; + textStyle: {}, + defaultDate: moment(), + onDateChange: () => { }, +} const styles = StyleSheet.create({ - btnCancel: { - left: 0, - }, - btnDone: { - right: 0, - }, - btnText: { - position: "absolute", - top: 0, - height: 42, - paddingHorizontal: 20, - flexDirection: "row", - alignItems: "center", - justifyContent: "center", - }, + btnCancel: { + left: 0, + }, + btnDone: { + right: 0, + }, + btnText: { + position: "absolute", + top: 0, + height: 42, + paddingHorizontal: 20, + flexDirection: "row", + alignItems: "center", + justifyContent: "center", + }, }); -export default FormDatePicker; +export default FormDatePicker; \ No newline at end of file diff --git a/src/app/screens/PluviometerSharingDataScreen.js b/src/app/screens/PluviometerSharingDataScreen.js index d62bf33..dc03920 100644 --- a/src/app/screens/PluviometerSharingDataScreen.js +++ b/src/app/screens/PluviometerSharingDataScreen.js @@ -145,22 +145,6 @@ const styles = StyleSheet.create({ color: "#1976D2", marginBottom: 5, }, - btnText: { - position: "absolute", - top: 0, - height: 42, - paddingHorizontal: 20, - flexDirection: "row", - alignItems: "center", - justifyContent: "center", - color: colors.primary, - }, - btnCancel: { - left: 0, - }, - btnDone: { - right: 0, - }, }); export default PluviometerSharingDataScreen;