|
|
@ -9,6 +9,7 @@ import colors from "../config/colors/"; |
|
|
|
import moment from "moment"; |
|
|
|
import { TouchableOpacity } from "react-native-gesture-handler"; |
|
|
|
import { FontAwesome5 } from "@expo/vector-icons"; |
|
|
|
import { MaterialCommunityIcons } from "@expo/vector-icons"; |
|
|
|
import { AuthContext } from "../auth/context"; |
|
|
|
import { Shadow } from "react-native-shadow-2"; |
|
|
|
import { AssembleIngestionPluvRegistration } from "../components/forms/AssembleIngestionObject"; |
|
|
@ -58,6 +59,7 @@ function LocationPicker({ |
|
|
|
location, |
|
|
|
setLocationAddr, |
|
|
|
setGeoLocation, |
|
|
|
pluviometer, |
|
|
|
}) { |
|
|
|
return ( |
|
|
|
<View |
|
|
@ -68,6 +70,16 @@ function LocationPicker({ |
|
|
|
}} |
|
|
|
> |
|
|
|
<MaterialIcons name="location-on" size={30} color={colors.primary} /> |
|
|
|
|
|
|
|
{pluviometer && ( |
|
|
|
<View style={{ flexDirection: "row", marginTop: 16 }}> |
|
|
|
<Text style={styles.subText}> |
|
|
|
{pluviometer?.address ? pluviometer.address : "Erro ao carregar endereço"} |
|
|
|
</Text> |
|
|
|
</View> |
|
|
|
)} |
|
|
|
|
|
|
|
{!pluviometer && ( |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
marginLeft: 16, |
|
|
@ -105,6 +117,49 @@ function LocationPicker({ |
|
|
|
</TouchableOpacity> |
|
|
|
</Shadow> |
|
|
|
</View> |
|
|
|
)} |
|
|
|
</View> |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
function PluvDateTimePicker({ |
|
|
|
onDateChange, |
|
|
|
onTimeChange, |
|
|
|
date, |
|
|
|
time, |
|
|
|
formTypeFace, |
|
|
|
pluviometer, |
|
|
|
}) { |
|
|
|
return ( |
|
|
|
<View style={{ flex: 1 }}> |
|
|
|
{!pluviometer && ( |
|
|
|
<FormDatePicker |
|
|
|
onDateChange={onDateChange} |
|
|
|
onTimeChange={onTimeChange} |
|
|
|
date={date} |
|
|
|
time={time} |
|
|
|
formTypeFace={formTypeFace} |
|
|
|
/> |
|
|
|
)} |
|
|
|
{pluviometer && ( |
|
|
|
<View |
|
|
|
style={{ |
|
|
|
flexDirection: "row", |
|
|
|
alignItems: "center", |
|
|
|
}} |
|
|
|
> |
|
|
|
<MaterialCommunityIcons |
|
|
|
name="calendar-today" |
|
|
|
size={30} |
|
|
|
color={colors.primary} |
|
|
|
/> |
|
|
|
<View style={{ flexDirection: "row", marginTop: 16 }}> |
|
|
|
<Text style={styles.subText}> |
|
|
|
{pluviometer.regiterDate ? pluviometer.regiterDate : "Erro ao carregar a data"} |
|
|
|
</Text> |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
)} |
|
|
|
</View> |
|
|
|
); |
|
|
|
} |
|
|
@ -115,22 +170,19 @@ function PluviometerRegisterScreen(props) { |
|
|
|
const [location, setLocationAddr] = useState("Defina o endereço no mapa"); |
|
|
|
const [coordinates, setCoordinates] = useState(null); |
|
|
|
const { user, _ } = useContext(AuthContext); |
|
|
|
console.log(user); |
|
|
|
|
|
|
|
const [showAwaitModal, setShowAwaitModal] = useState(false); |
|
|
|
const [showMessageModal, setShowMessageModal] = useState(false); |
|
|
|
const [apiMessage, setApiMessage] = useState(null); |
|
|
|
|
|
|
|
const sendForm = async (date, |
|
|
|
time, |
|
|
|
user, |
|
|
|
address, |
|
|
|
coordinates) => { |
|
|
|
const isSent = await AssembleIngestionPluvRegistration(date, |
|
|
|
const sendForm = async (date, time, user, address, coordinates) => { |
|
|
|
const isSent = await AssembleIngestionPluvRegistration( |
|
|
|
date, |
|
|
|
time, |
|
|
|
user, |
|
|
|
address, |
|
|
|
coordinates); |
|
|
|
coordinates |
|
|
|
); |
|
|
|
if (isSent) { |
|
|
|
setApiMessage(isSent.ok); |
|
|
|
} |
|
|
@ -139,7 +191,7 @@ function PluviometerRegisterScreen(props) { |
|
|
|
}; |
|
|
|
|
|
|
|
return ( |
|
|
|
<View style={{padding: 10, flex:1}}> |
|
|
|
<View style={{ padding: 10, flex: 1 }}> |
|
|
|
<OnSubmitAwaitModal show={showAwaitModal} /> |
|
|
|
<OnSubmitMessageModal |
|
|
|
show={showMessageModal} |
|
|
@ -151,20 +203,15 @@ function PluviometerRegisterScreen(props) { |
|
|
|
initialValues={{}} |
|
|
|
onSubmit={async () => { |
|
|
|
setShowAwaitModal(true); |
|
|
|
sendForm( |
|
|
|
date, |
|
|
|
time, |
|
|
|
user, |
|
|
|
location, |
|
|
|
coordinates |
|
|
|
).then((isSent) => { |
|
|
|
sendForm(date, time, user, location, coordinates).then((isSent) => { |
|
|
|
setShowAwaitModal(false); |
|
|
|
setShowMessageModal(true); |
|
|
|
}); |
|
|
|
}} |
|
|
|
> |
|
|
|
<View style={{padding: 6, flex:1}}> |
|
|
|
<View style={{ padding: 6, flex: 1, flexDirection:"column" }}> |
|
|
|
<Text style={styles.title}>Cadastro do Pluviômetro</Text> |
|
|
|
<View style={{flex: 0.25}}> |
|
|
|
<Text |
|
|
|
style={{ |
|
|
|
marginTop: 24, |
|
|
@ -178,13 +225,16 @@ function PluviometerRegisterScreen(props) { |
|
|
|
Data do cadastro: |
|
|
|
</Text> |
|
|
|
|
|
|
|
<FormDatePicker |
|
|
|
<PluvDateTimePicker |
|
|
|
onDateChange={(value) => setDate(value)} |
|
|
|
onTimeChange={(value) => setTime(value)} |
|
|
|
date={date} |
|
|
|
time={time} |
|
|
|
formTypeFace={"pluviometerRegister"} |
|
|
|
pluviometer={user.pluviometer} |
|
|
|
/> |
|
|
|
</View> |
|
|
|
<View style={{flex: 0.25}}> |
|
|
|
<Text style={styles.label}>Endereço do pluviômetro*: </Text> |
|
|
|
|
|
|
|
<View marginBottom={24}> |
|
|
@ -193,11 +243,18 @@ function PluviometerRegisterScreen(props) { |
|
|
|
location={location} |
|
|
|
setLocationAddr={setLocationAddr} |
|
|
|
setGeoLocation={setCoordinates} |
|
|
|
pluviometer={user.pluviometer} |
|
|
|
/> |
|
|
|
</View> |
|
|
|
|
|
|
|
</View> |
|
|
|
<View style={{flex: 0.25}}> |
|
|
|
<Institution user={user} /> |
|
|
|
</View> |
|
|
|
<View style={{flex: 0.25}}> |
|
|
|
{!user.pluviometer && ( |
|
|
|
<SubmitButton title="Cadastrar" paddingHorizontal={0} /> |
|
|
|
)} |
|
|
|
</View> |
|
|
|
</View> |
|
|
|
</Form> |
|
|
|
</View> |
|
|
@ -232,6 +289,11 @@ const styles = StyleSheet.create({ |
|
|
|
textAlign: "center", |
|
|
|
color: colors.primary, |
|
|
|
}, |
|
|
|
date: { |
|
|
|
paddingLeft: 12, |
|
|
|
flexDirection: "column", |
|
|
|
justifyContent: "center", |
|
|
|
}, |
|
|
|
}); |
|
|
|
|
|
|
|
export default PluviometerRegisterScreen; |