From e885eeb9f838f7ea3bb0395b9b92054ebcf97b70 Mon Sep 17 00:00:00 2001 From: analuizaff Date: Wed, 31 Mar 2021 17:48:41 -0300 Subject: [PATCH] starting pluviometer diary screen --- src/app/components/forms/FormDatePicker.js | 3 +- src/app/screens/PluviometerDiaryScreen.js | 151 +++++++++++++++++++++ src/package-lock.json | 20 +++ src/package.json | 1 + 4 files changed, 173 insertions(+), 2 deletions(-) create mode 100644 src/app/screens/PluviometerDiaryScreen.js diff --git a/src/app/components/forms/FormDatePicker.js b/src/app/components/forms/FormDatePicker.js index c1c2d51..c511995 100644 --- a/src/app/components/forms/FormDatePicker.js +++ b/src/app/components/forms/FormDatePicker.js @@ -192,7 +192,7 @@ FormDatePicker.defaultProps = { const styles = StyleSheet.create({ btnCancel: { left: 0, - }, + }, btnDone: { right: 0, }, @@ -207,7 +207,6 @@ const styles = StyleSheet.create({ }, dateInput: { flex: 0.9, - backgroundColor: colors.white, height: "100%", flexDirection: "column", justifyContent: "center", diff --git a/src/app/screens/PluviometerDiaryScreen.js b/src/app/screens/PluviometerDiaryScreen.js new file mode 100644 index 0000000..ebc4107 --- /dev/null +++ b/src/app/screens/PluviometerDiaryScreen.js @@ -0,0 +1,151 @@ +import React, { useState, useContext, useEffect } from "react"; +import { StyleSheet, Text, View } from "react-native"; + +import Screen from "../components/Screen"; +import { dimensions, scaleDimsFromWidth } from "../config/dimensions"; +import colors from "../config/colors/"; + +import { FontAwesome5 } from '@expo/vector-icons'; +import { MaterialIcons } from "@expo/vector-icons"; + +const dims = scaleDimsFromWidth(85, 85, 25); + +function PluviometerDiaryScreen(props) { + //Substituir por dados vindos da API + const school = "Escola registrada do pluviômetro"; + const profile = "Tipo de perfil do usuário"; + const local = "Endereço registrado do pluviômetro" + return ( + + + + Gráfico do pluviometro + + + + + {/* Endereço */} + < View style={{ flex: 1 }}> + + + + + + + {local} + + + + + + {/* Escola */} + + + + + + + + { school } + + + + + + {/* Usuário */} + + + + + + + + { profile } + + + + + + + ); +} + +const styles = StyleSheet.create({ + container: { + padding: 10, + flex: 1, + }, + image: { + width: dims.width * 0.8, + height: dims.height * 0.8, + justifyContent: "center", + alignItems: "center", + }, + label: { + fontSize: dimensions.text.secondary, + fontWeight: "bold", + textAlign: "left", + color: colors.lightBlue, + }, + title: { + fontSize: 20, + fontWeight: "bold", + textAlign: "center", + color: colors.primary, + }, + location: { + width: "100%", + flexDirection: "row", + alignItems: "flex-start", + justifyContent: "space-between", + }, + adressText: { + flex: 0.90, + height: "100%", + flexDirection: "column", + justifyContent: "center", + paddingLeft: 5, + }, + mapIcon: { + backgroundColor: colors.primary, + padding: 8, + width: 20, + alignItems: "center", + borderRadius: 5, + flex: 0.10, + marginTop: 8, + }, + +}); + +export default PluviometerDiaryScreen; diff --git a/src/package-lock.json b/src/package-lock.json index c3d9abf..c7bee0d 100644 --- a/src/package-lock.json +++ b/src/package-lock.json @@ -15881,6 +15881,11 @@ } } }, + "paths-js": { + "version": "0.4.11", + "resolved": "https://registry.npmjs.org/paths-js/-/paths-js-0.4.11.tgz", + "integrity": "sha512-3mqcLomDBXOo7Fo+UlaenG6f71bk1ZezPQy2JCmYHy2W2k5VKpP+Jbin9H0bjXynelTbglCqdFhSEkeIkKTYUA==" + }, "pause": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz", @@ -16068,6 +16073,11 @@ "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz", "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==" }, + "point-in-polygon": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/point-in-polygon/-/point-in-polygon-1.1.0.tgz", + "integrity": "sha512-3ojrFwjnnw8Q9242TzgXuTD+eKiutbzyslcq1ydfu82Db2y+Ogbmyrkpv0Hgj31qwT3lbS9+QAAO/pIQM35XRw==" + }, "posix-character-classes": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz", @@ -16587,6 +16597,16 @@ } } }, + "react-native-chart-kit": { + "version": "6.11.0", + "resolved": "https://registry.npmjs.org/react-native-chart-kit/-/react-native-chart-kit-6.11.0.tgz", + "integrity": "sha512-mRSfW+mcyVSi0UZKFucru5h5TPB6UcWrMi/DphICRpPJWlvIVAv/6VYGFA57NFDLoRVufFjbsRRrms+TOq61jw==", + "requires": { + "lodash": "^4.17.13", + "paths-js": "^0.4.10", + "point-in-polygon": "^1.0.1" + } + }, "react-native-flash-message": { "version": "0.1.18", "resolved": "https://registry.npmjs.org/react-native-flash-message/-/react-native-flash-message-0.1.18.tgz", diff --git a/src/package.json b/src/package.json index cfd2823..d9b492a 100644 --- a/src/package.json +++ b/src/package.json @@ -36,6 +36,7 @@ "react-dom": "16.13.1", "react-google-places-autocomplete": "^3.2.1", "react-native": "https://github.com/expo/react-native/archive/sdk-39.0.4.tar.gz", + "react-native-chart-kit": "^6.11.0", "react-native-flash-message": "^0.1.18", "react-native-gesture-handler": "~1.7.0", "react-native-google-places-autocomplete": "^2.1.3",