diff --git a/src/app/components/TextInput.js b/src/app/components/TextInput.js
index 2bfbe65..b946e18 100644
--- a/src/app/components/TextInput.js
+++ b/src/app/components/TextInput.js
@@ -3,34 +3,34 @@ import { View, TextInput, StyleSheet } from "react-native";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import colors from "../config/colors";
import defaultStyles from "../config/styles";
-import {Shadow} from "react-native-shadow-2";
+import { Shadow } from "react-native-shadow-2";
function AppTextInput({ icon, width = "100%", ...otherProps }) {
return (
-
- {icon && (
-
+ {icon && (
+
+ )}
+
- )}
-
-
-
+
+
);
}
diff --git a/src/app/components/forms/ErrorMessage.js b/src/app/components/forms/ErrorMessage.js
index 82e2a67..9863d3e 100644
--- a/src/app/components/forms/ErrorMessage.js
+++ b/src/app/components/forms/ErrorMessage.js
@@ -10,7 +10,7 @@ function ErrorMessage({ error, visible }) {
}
const styles = StyleSheet.create({
- error: { color: "red" },
+ error: { color: "red", paddingTop: 10 },
});
export default ErrorMessage;
diff --git a/src/app/components/forms/FormField.js b/src/app/components/forms/FormField.js
index 3c99d6c..a0888b1 100644
--- a/src/app/components/forms/FormField.js
+++ b/src/app/components/forms/FormField.js
@@ -1,23 +1,130 @@
-import React from "react";
+import React, { useState, useEffect } from "react";
import { useFormikContext } from "formik";
import TextInput from "../TextInput";
import ErrorMessage from "./ErrorMessage";
-import {View} from "react-native";
+import { View, Text } from "react-native";
+import { TouchableOpacity } from "react-native-gesture-handler";
+import colors from "../../config/colors";
+import { Shadow } from "react-native-shadow-2";
-function AppFormField({ name, width, ...otherProps }) {
- const { setFieldTouched, handleChange, errors, touched } = useFormikContext();
+function IncreaseDecreaseButtons({ content }) {
+ return (
+
+
+ {content}
+
+
+ );
+}
+
+function AppFormField({
+ name,
+ width,
+ increaseDecreaseButtons = false,
+ ...otherProps
+}) {
+ const {
+ values,
+ setFieldTouched,
+ setFieldValue,
+ errors,
+ touched,
+ } = useFormikContext();
+
+ const [pluv, setPluv] = useState(0);
+
+ console.log(values);
+ console.log(pluv);
+
+ useEffect(() => {
+ setFieldValue("pluviometer", Number(pluv), true);
+ }, [pluv]);
+
+ const increase = () => {
+ setPluv((Number(pluv) + 1).toString());
+ };
+
+ const decrease = () => {
+ setPluv((Number(pluv) - 1).toString());
+ };
return (
-
- setFieldTouched(name)}
- onChangeText={handleChange(name)}
- width={width}
- {...otherProps}
- />
-
+
+
+
+ setFieldTouched(name)}
+ onChangeText={(val) => {
+ setPluv(val);
+ }}
+ width={width}
+ value={pluv}
+ {...otherProps}
+ />
+
+
+ {increaseDecreaseButtons && (
+ <>
+ {
+ increase();
+ }}
+ style={{
+ paddingLeft: 4,
+ paddingBottom: 8,
+ paddingRight: 1.5,
+ }}
+ >
+
+
+
+ {
+ decrease();
+ }}
+ style={{
+ paddingLeft: 1.5,
+ paddingBottom: 8,
+ paddingRight: 16,
+ }}
+ >
+
+
+ >
+ )}
+
+
+
+
+
);
}
diff --git a/src/app/screens/PluviometerSharingDataScreen.js b/src/app/screens/PluviometerSharingDataScreen.js
index 2b7a81f..cfaedc7 100644
--- a/src/app/screens/PluviometerSharingDataScreen.js
+++ b/src/app/screens/PluviometerSharingDataScreen.js
@@ -1,25 +1,16 @@
import React, { useState, useContext, useEffect } from "react";
-import { StyleSheet, Text, View, ScrollView, PixelRatio } from "react-native";
+import { StyleSheet, Text, View, ScrollView } from "react-native";
import * as Yup from "yup";
-import {
- Form,
- FormField,
- FormPicker as Picker,
- SubmitButton,
-} from "../components/forms";
+import { Form, FormField, SubmitButton } from "../components/forms";
import Screen from "../components/Screen";
-import useLocation from "../hooks/useLocation";
import FormImagePicker from "../components/forms/FormImagePicker";
import { insertPluviometerData } from "../database/databaseLoader";
import { showMessage } from "react-native-flash-message";
import { dimensions, scaleDimsFromWidth } from "../config/dimensions";
-import FormDatePicker from "../components/forms/FormDatePicker";
import colors from "../config/colors/";
import moment from "moment";
-import FormLocationPicker from "../components/forms/FormLocationPicker";
-import { TouchableOpacity } from "react-native-gesture-handler";
-import { EventLocationContext } from "../context/EventLocationContext";
import PickEventDateLocation from "../components/PickEventDateLocation";
+import { EventLocationContext } from "../context/EventLocationContext";
const dims = scaleDimsFromWidth(85, 85, 25);
@@ -36,24 +27,19 @@ const validationSchema = Yup.object().shape({
function PluviometerSharingDataScreen(props) {
const context = useContext(EventLocationContext);
-
- const amount = 2;
+ const [dateTime, setDateTime] = useState(moment());
+ const [time, setTime] = useState(moment());
useEffect(() => {
context.defaultLocation();
}, []);
- const location = context.eventCoordinates;
- const address = context.eventLocation;
-
- const [dateTime, setDateTime] = useState(moment());
- const [time, setTime] = useState(moment());
return (