Skip to content

2
2023-032
Commit 329348e7 authored by Kavindu Lakshitha's avatar Kavindu Lakshitha
Browse files
Options

updated

parent 0824bbfc
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 4253 additions and 2313 deletions
Frontend/App.js
View file @ 329348e7
......@@ -40,6 +40,7 @@ import { AntDesign } from "@expo/vector-icons";
import TitleHeaderCancelQuery from "./components/TitleHeaderCancelQuery";
import ScanResult from "./screens/Medical_Image_Analysis/ScanResult";
import { useWindowDimensions } from "react-native";
import Test from "./components/Test";
const Stack = createStackNavigator();
const Tab = createBottomTabNavigator();
......@@ -467,6 +468,31 @@ export default function App() {
}}
component={ScanResult}
/>
<Stack.Screen
name="Test"
options={{
headerTitle: "Test",
headerTitleAlign: "center",
headerTitleStyle: {
fontSize: 18 / fontScale,
textTransform: "capitalize",
fontFamily: "Lora-Bold",
color: "#222244",
},
headerBackground: () => (
<View
style={{
backgroundColor: "#f0f9ff",
height: "100%",
borderBottomColor: "#b3e0ff",
borderBottomWidth: 1,
}}
/>
),
}}
component={Test}
/>
</Stack.Navigator>
</NavigationContainer>
);
......
Frontend/app.json
View file @ 329348e7
......@@ -19,7 +19,15 @@
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#ffffff"
}
},
"permssions":[
"ACCESS_COARSE_LOCATION",
"ACCESS_FINE_LOCATION",
"CAMERA",
"READ_EXTERNAL_STORAGE",
"WRITE_EXTERNAL_STORAGE",
"INTERNET"
]
},
"web": {
"favicon": "./assets/favicon.png"
......
Frontend/assets/MedicalCenters.js
View file @ 329348e7
export default [
{
name: "Center 1",
name: "General Hospital Colombo",
district: "Colombo",
latitude: 6.9294,
longitude: 79.93884,
latitude: 6.92904971159076,
longitude: 79.86716514231897,
},
{
name: "Center 2",
name: "District General Hospital Gampaha",
district: "Gampaha",
latitude: 7.479304425076363,
longitude: 80.35973544100177,
latitude: 7.092119292572659,
longitude: 80.00115380102628,
},
{
name: "Center 3",
name: "Teaching Hospital Kalutara",
district: "Kalutara",
latitude: 7.4793150626305485,
longitude: 80.3595423219729,
latitude: 6.5629391972343045,
longitude: 79.98557023699956,
},
{
name: "Center 4",
name: "Kandy General Hospital",
district: "Kandy",
latitude: 7.290572,
longitude: 80.633726,
latitude: 7.286402963175747,
longitude: 80.63175012856654,
},
{
name: "Center 5",
name: "District General Hospital - Matale",
district: "Matale",
latitude: 7.4675,
longitude: 80.6234,
latitude: 7.461738195471175,
longitude: 80.62479580740677,
},
{
name: "Center 6",
name: "Nuwara Eliya Distric General Hospital",
district: "Nuwara Eliya",
latitude: 6.9686,
longitude: 80.7891,
latitude: 6.974289365418938,
longitude: 80.78023643068765,
},
{
name: "Center 7",
name: "Karapitiya Teaching hospital",
district: "Galle",
latitude: 6.0535,
longitude: 80.2209,
latitude: 6.09055455347143,
longitude: 80.21773837596368,
},
{
name: "Center 8",
name: "District General Hospital - Matara",
district: "Matara",
latitude: 5.9481,
longitude: 80.5353,
latitude: 5.950568251006557,
longitude: 80.55052226818319,
},
{
name: "Center 9",
name: " General Hospital - Hambantota",
district: "Hambantota",
latitude: 6.1241,
longitude: 81.1188,
latitude: 6.127236541682126,
longitude: 81.12186001149317,
},
{
name: "Center 10",
name: "Teaching Hospital Jaffna",
district: "Jaffna",
latitude: 9.6619,
longitude: 80.025,
latitude: 9.666143793869884,
longitude: 80.01588465234339,
},
{
name: "Center 11",
name: "Mannar Distric General Hospital",
district: "Mannar",
latitude: 8.9772,
longitude: 79.9096,
latitude: 8.981682995923498,
longitude: 79.90462726480925,
},
{
name: "Center 12",
name: "Vavuniya Distric General Hospital",
district: "Vavuniya",
latitude: 8.7514,
longitude: 80.4988,
latitude: 8.760562490832573,
longitude: 80.50025504788317,
},
{
name: "Center 13",
name: "Divisional Hospital Mullaithivu",
district: "Mullaitivu",
latitude: 9.2673,
longitude: 80.8149,
latitude: 9.251366754209071,
longitude: 80.81296870010513,
},
{
name: "Center 14",
name: "Renal Care Unit - Teaching Hospital - Batticaloa",
district: "Batticaloa",
latitude: 7.7186,
longitude: 81.7006,
latitude: 7.708750229835289,
longitude: 81.69394983910354,
},
{
name: "Center 15",
name: "District general hospital Ampara",
district: "Ampara",
latitude: 7.308,
longitude: 81.6725,
latitude: 7.2996844326855985,
longitude: 81.68947628884695,
},
{
name: "Center 16",
name: "District general hospital Trincomalee",
district: "Trincomalee",
latitude: 8.5874,
longitude: 81.2152,
latitude: 8.565649831603867,
longitude: 81.24407403007164,
},
{
name: "Center 17",
name: "Teaching Hospital Kurunegala",
district: "Kurunegala",
latitude: 7.4869,
longitude: 80.3648,
latitude: 7.479681452385665,
longitude: 80.35892420898047,
},
{
name: "Center 18",
name: "Puttalam Base Hospital",
district: "Puttalam",
latitude: 8.0366,
longitude: 79.8289,
latitude: 8.032504700702123,
longitude: 79.92185605278694,
},
{
name: "Center 19",
name: "New Kidney Hospital and Research Center",
district: "Anuradhapura",
latitude: 8.3126,
longitude: 80.4139,
latitude: 8.387265144896821,
longitude: 80.65094972630182,
},
{
name: "Center 20",
name: "National Nephrology Hospital Polonnaruwa",
district: "Polonnaruwa",
latitude: 7.9394,
longitude: 81.0188,
},
{
name: "Center 21",
name: "Teaching Hospital Badulla",
district: "Badulla",
latitude: 6.9924,
longitude: 81.054,
latitude: 6.992499296453275,
longitude: 81.05368736772151,
},
{
name: "Center 22",
name: "District General Hospital Monaragala",
district: "Monaragala",
latitude: 6.8785,
longitude: 81.3509,
latitude: 6.890837377699182,
longitude: 81.37690609360635,
},
{
name: "Center 23",
name: "Teaching Hospital - Ratnapura",
district: "Ratnapura",
latitude: 6.7051,
longitude: 80.384,
latitude: 6.6944049538220645,
longitude: 80.39650400875763,
},
{
name: "Center 24",
name: "Teaching Hospital Kegalle",
district: "Kegalle",
latitude: 7.2514,
longitude: 80.3464,
latitude: 7.248130920247129,
longitude: 80.34532666982548,
},
{
name: "Center 25",
name: "District General Hospital - Kilinochchi",
district: "Kilinochchi",
latitude: 9.392,
longitude: 80.4038,
latitude: 9.353466363633549,
longitude: 80.46938971470755,
},
];
Frontend/assets/WaterDistricts.js 0 → 100644
View file @ 329348e7
export const waterDistricts = [
{
label: "Anuradhapura",
value: "1",
},
{
label: "Kurunegala",
value: "2",
},
{
label: "Polonnaruwa",
value: "3",
},
];
Frontend/components/CarouselDietB.js 0 → 100644
View file @ 329348e7
import { StyleSheet, Text, View, ScrollView } from "react-native";
import React from "react";
import { useWindowDimensions } from "react-native";
import DietCard from "./DietCard";
export default function s() {
const diets = [
{
category: "Fruits",
items: [
"Grapes",
"Lemon",
"Peaches",
"Pomegranate",
],
},
{
category: "Vegitables",
items: ["Onion",
"Bell peppers",
"Carrot",
"Tomatoes",
"Mushrooms"
],
},
{
category: "Dairy Products",
items: ["Cheese", "Milk", "Yogurt"],
},
{
category: "Animal Protiene",
items: ["Meat", "Fish", "Egg"],
},
{
category: "Miscellaneous",
items: ["Seeds and nuts"],
},
];
return (
<>
{diets.map((diet, index) => (
<DietCard key={index} category={diet.category} items={diet.items} />
))}
</>
);
}
const styles = StyleSheet.create({});
Frontend/components/CarouselDietC.js 0 → 100644
View file @ 329348e7
import { StyleSheet, Text, View, ScrollView } from "react-native";
import React from "react";
import { useWindowDimensions } from "react-native";
import DietCard from "./DietCard";
export default function s() {
const diets = [
{
category: "Fruits",
items: [
"Bananas",
"Apple",
"Oranges",
"Pomegranate",
"Dates"
],
},
{
category: "Vegitables",
items: ["Beans",
"Pumkin",
"Leeks",
"Carrot",
"Potatoes",
"Tomatoes"
],
},
{
category: "Dairy Products",
items: [ "Milk", "Yogurt"],
},
{
category: "Animal Protiene",
items: ["Meat", "Fish", "Egg"],
},
{
category: "Miscellaneous",
items: ["Seeds and nuts"],
},
];
return (
<>
{diets.map((diet, index) => (
<DietCard key={index} category={diet.category} items={diet.items} />
))}
</>
);
}
const styles = StyleSheet.create({});
Frontend/components/CarouselDietD.js 0 → 100644
View file @ 329348e7
import { StyleSheet, Text, View, ScrollView } from "react-native";
import React from "react";
import { useWindowDimensions } from "react-native";
import DietCard from "./DietCard";
export default function s() {
const diets = [
{
category: "Fruits",
items: [
"Apples",
"Berries",
"Grapes",
"Lemon",
"Peaches",
"Pomegranate",
"Pineapple",
"Plums",
"Watermelon",
],
},
{
category: "Vegitables",
items: ["Carrots",
"Cabbage",
"Cucumber",
"EggPlant",
"Green Beans",
"Onion",
"Bell peppers"
],
},
{
category: "Dairy Products",
items: ["Cheese", "Milk", "Yogurt"],
},
{
category: "Animal Protiene",
items: ["Meat", "Fish", "Egg"],
},
{
category: "Miscellaneous",
items: ["Seeds and nuts", "popcorn(unsalted)"],
},
];
return (
<>
{diets.map((diet, index) => (
<DietCard key={index} category={diet.category} items={diet.items} />
))}
</>
);
}
const styles = StyleSheet.create({});
Frontend/components/DietFormInput.js
View file @ 329348e7
......@@ -2,9 +2,10 @@ import { View, Text, TextInput } from "react-native";
import React from "react";
import { AntDesign } from "@expo/vector-icons";
import { useWindowDimensions } from "react-native";
import { onChange } from "deprecated-react-native-prop-types/DeprecatedTextInputPropTypes";
export default function DietFormInput(props) {
const { label, unit } = props;
const { label, unit, value, onChange } = props;
const { fontScale } = useWindowDimensions();
return (
......@@ -45,6 +46,8 @@ export default function DietFormInput(props) {
}}
>
<TextInput
value={value}
onChange={onChange}
keyboardType="numeric"
style={{
fontFamily: "OpenSans-Regular",
......
Frontend/components/ImagePicker.js
View file @ 329348e7
This diff is collapsed.
Frontend/components/LabDataInput.js
View file @ 329348e7
......@@ -3,7 +3,7 @@ import React from "react";
import { AntDesign } from "@expo/vector-icons";
export default function LabDataInput(props) {
const { label, unit } = props;
const { label, unit, value, onChangeText } = props;
const { fontScale } = useWindowDimensions();
return (
......@@ -44,6 +44,8 @@ export default function LabDataInput(props) {
>
<View style={{}}>
<TextInput
value={value}
onChangeText={onChangeText}
keyboardType="numeric"
style={{
fontFamily: "OpenSans-Regular",
......
Frontend/components/Test.js 0 → 100644
View file @ 329348e7
import React, { useState } from "react";
import { View, Text, Image, Button, TouchableOpacity } from "react-native";
import * as ImagePicker from "expo-image-picker";
import axios from "axios";
export default function App() {
const [image, setImage] = useState(null);
const [prediction, setPrediction] = useState({});
const selectImage = async () => {
const permissionResult =
await ImagePicker.requestMediaLibraryPermissionsAsync();
if (permissionResult.granted === false) {
alert("Permission to access camera roll is required!");
return;
}
const result = await ImagePicker.launchImageLibraryAsync();
if (!result.canceled) {
setImage(result.assets[0].uri);
uploadImage(result.assets[0].uri);
}
};
const uploadImage = async (uri) => {
const formData = new FormData();
formData.append("image", {
uri,
type: "image/jpeg",
name: "image.jpg",
});
try {
const response = await axios.post(
"http://192.168.8.156:5002/predict",
formData,
{
headers: {
"Content-Type": "multipart/form-data",
},
}
);
setPrediction(response.data);
} catch (error) {
console.error("Error uploading image:", error);
}
};
return (
<View>
<Button title="Select Image" onPress={selectImage} />
{image && (
<Image source={{ uri: image }} style={{ width: 200, height: 200 }} />
)}
{prediction.resnet_label && (
<View>
<Text>Prediction: {prediction.resnet_label}</Text>
<Text>Confidence: {prediction.resnet_pred}</Text>
</View>
)}
</View>
);
}
Frontend/package-lock.json
View file @ 329348e7
This source diff could not be displayed because it is too large. You can view the blob instead.
Frontend/package.json
View file @ 329348e7
......@@ -13,12 +13,12 @@
"@react-navigation/bottom-tabs": "^6.5.7",
"@react-navigation/native": "^6.1.6",
"@react-navigation/stack": "^6.3.16",
"axios": "^1.4.0",
"axios": "^1.6.0",
"deprecated-react-native-prop-types": "^4.2.1",
"expo": "~48.0.18",
"expo-checkbox": "~2.3.1",
"expo-font": "~11.1.1",
"expo-image": "~1.0.1",
"expo-image": "~1.0.2",
"expo-image-picker": "~14.1.1",
"expo-linear-gradient": "~12.1.2",
"expo-permissions": "~14.1.1",
......@@ -30,14 +30,16 @@
"intl": "^1.2.5",
"intl-pluralrules": "^2.0.1",
"lottie-react-native": "5.1.4",
"node-fetch": "^3.3.2",
"react": "18.2.0",
"react-i18next": "^13.2.0",
"react-native": "0.71.8",
"react-native": "^0.71.14",
"react-native-autocomplete-input": "^5.3.2",
"react-native-awesome-loading": "^1.0.15",
"react-native-dropdown-picker": "^5.4.6",
"react-native-easy-grid": "^0.2.2",
"react-native-element-dropdown": "^2.9.0",
"react-native-elements": "^3.4.3",
"react-native-fast-image": "^8.6.3",
"react-native-gesture-handler": "~2.9.0",
"react-native-localize": "^3.0.2",
......
Frontend/screens/Food_Recommendation/DietPlan.js
View file @ 329348e7
import { ScrollView, StyleSheet, View } from "react-native";
import React, { useState } from "react";
import { Provider } from "react-native-paper";
import ButtonFilled from "../../components/ButtonFilled";
import { useNavigation } from "@react-navigation/native";
import { ScrollView, View, Button, Text } from "react-native";
import React, { useEffect, useState } from "react";
import DietPlanA from "./DietPlanA";
import { useRoute } from "@react-navigation/native";
import axios from "axios";
import { useWindowDimensions } from "react-native";
import DietPlanB from "./DietPlanB";
import DietPlanC from "./DietPlanC";
import DietPlanD from "./DietPlanD";
export default function DietPlan() {
const [value, setValue] = useState(null);
const route = useRoute();
const { fontScale } = useWindowDimensions();
const {
stage,
potassium,
calcium,
phosphorus,
sodium,
hemoglobin,
cholesterol,
} = route.params;
const [inputDietData, setInputDietData] = useState({
stage,
potassium,
calcium,
phosphorus,
sodium,
hemoglobin,
cholesterol,
});
const [dietPlan, setDietPlan] = useState("");
useEffect(() => {
axios
.post("http://192.168.8.156:5001/predict", inputDietData)
.then((response) => {
setDietPlan(response.data.prediction);
})
.catch((error) => {
console.error("Error:", error);
});
}, []);
return (
<ScrollView
......@@ -36,7 +75,31 @@ export default function DietPlan() {
marginTop: "2.5%",
}}
>
<DietPlanA />
{/* <Button title="Predict" onPress={handleSubmit} /> */}
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-SemiBold",
}}
>
{dietPlan}
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-SemiBold",
color: "#333366",
marginTop: "5%",
}}
>
The ideal diet plan for you is:
</Text>
{dietPlan === "Low" && <DietPlanA />}
{dietPlan === "Safe" && <DietPlanB />}
{dietPlan === "Caution" && <DietPlanC />}
{dietPlan === "Danger" && <DietPlanD />}
</View>
</View>
</View>
......
Frontend/screens/Food_Recommendation/DietPlanB.js
View file @ 329348e7
import { View, Text, ScrollView, StyleSheet } from "react-native";
import React from "react";
import { useWindowDimensions } from "react-native";
import CarouselDietB from "../../components/CarouselDiet";
import { LinearGradient } from "expo-linear-gradient";
import { Ionicons } from "@expo/vector-icons";
export default function DietPlanB() {
const { fontScale } = useWindowDimensions();
return (
<View>
<LinearGradient
style={{
borderRadius: 10,
marginTop: 10,
padding: 15,
shadowColor: "#333366",
shadowOffset: { width: 1, height: 2 },
shadowOpacity: 0.25,
shadowRadius: 1,
elevation: 5,
}}
colors={["#2e5bc6", "#3b6edf"]}
>
<View>
<Text
style={{
backgroundColor: "#d5efff",
alignSelf: "flex-start",
paddingVertical: 5,
borderRadius: 10,
paddingHorizontal: 15,
}}
>
<Text
style={{
fontFamily: "Lora-Bold",
fontSize: 18 / fontScale,
color: "#222244",
textAlign: "center",
}}
>
Renal Balance Advance
</Text>
</Text>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Get a balanced intake of high-quality protein from sources
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Avoid high-sodium processed foods and use herbs and spices for
flavor instead of salt.
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Promoting a balanced diet with moderate protein.
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Be aware of foods that are high in these minerals.
</Text>
</View>
</View>
</LinearGradient>
<View>
<Text
style={{
fontFamily: "Lora-Bold",
fontSize: 20 / fontScale,
color: "#222244",
textAlign: "center",
marginTop: 10,
}}
>
What to eat
</Text>
<CarouselDietB />
</View>
</View>
);
}
Frontend/screens/Food_Recommendation/DietPlanC.js 0 → 100644
View file @ 329348e7
import { View, Text, ScrollView, StyleSheet } from "react-native";
import React from "react";
import { useWindowDimensions } from "react-native";
import CarouselDietC from "../../components/CarouselDietC";
import { LinearGradient } from "expo-linear-gradient";
import { Ionicons } from "@expo/vector-icons";
export default function DietPlanB() {
const { fontScale } = useWindowDimensions();
return (
<View>
<LinearGradient
style={{
borderRadius: 10,
marginTop: 10,
padding: 15,
shadowColor: "#333366",
shadowOffset: { width: 1, height: 2 },
shadowOpacity: 0.25,
shadowRadius: 1,
elevation: 5,
}}
colors={["#2e5bc6", "#3b6edf"]}
>
<View>
<Text
style={{
backgroundColor: "#d5efff",
alignSelf: "flex-start",
paddingVertical: 5,
borderRadius: 10,
paddingHorizontal: 15,
}}
>
<Text
style={{
fontFamily: "Lora-Bold",
fontSize: 18 / fontScale,
color: "#222244",
textAlign: "center",
}}
>
Renal Care Plus
</Text>
</Text>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Further reduces protein intake to lessen the burden on the
kidneys.​
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Enforces strict limitations on potassium, phosphorus, and sodium.​
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Focuses on minimizing waste buildup in the body.​
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Provides guidance on fortified foods and supplements to address
potential nutrient deficiencies.​
</Text>
</View>
</View>
</LinearGradient>
<View>
<Text
style={{
fontFamily: "Lora-Bold",
fontSize: 20 / fontScale,
color: "#222244",
textAlign: "center",
marginTop: 10,
}}
>
What to eat
</Text>
<CarouselDietC />
</View>
</View>
);
}
Frontend/screens/Food_Recommendation/DietPlanD.js 0 → 100644
View file @ 329348e7
import { View, Text, ScrollView, StyleSheet } from "react-native";
import React from "react";
import { useWindowDimensions } from "react-native";
import { LinearGradient } from "expo-linear-gradient";
import { Ionicons } from "@expo/vector-icons";
import CarouselDietD from "../../components/CarouselDietD";
export default function DietPlanD() {
const { fontScale } = useWindowDimensions();
return (
<View>
<LinearGradient
style={{
borderRadius: 10,
marginTop: 10,
padding: 15,
shadowColor: "#333366",
shadowOffset: { width: 1, height: 2 },
shadowOpacity: 0.25,
shadowRadius: 1,
elevation: 5,
}}
colors={["#2e5bc6", "#3b6edf"]}
>
<View>
<Text
style={{
backgroundColor: "#d5efff",
alignSelf: "flex-start",
paddingVertical: 5,
borderRadius: 10,
paddingHorizontal: 15,
}}
>
<Text
style={{
fontFamily: "Lora-Bold",
fontSize: 18 / fontScale,
color: "#222244",
textAlign: "center",
}}
>
Renal Support Max
</Text>
</Text>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Highly restrictive, with minimal protein, potassium, phosphorus,
and sodium.
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
May incorporate dialysis-specific dietary guidelines if
applicable.
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Advocates for a limited fluid intake to avoid fluid retention.
</Text>
</View>
<View
style={{
borderBottomColor: "#fff",
borderBottomWidth: 0.5,
paddingVertical: 5,
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#fff",
}}
>
Emphasizes working closely with a nephrologist or dietitian for
personalized care.
</Text>
</View>
</View>
</LinearGradient>
<View>
<Text
style={{
fontFamily: "Lora-Bold",
fontSize: 20 / fontScale,
color: "#222244",
textAlign: "center",
marginTop: 10,
}}
>
What to eat
</Text>
<CarouselDietD />
</View>
</View>
);
}
Frontend/screens/Food_Recommendation/DietStepTwo.js
View file @ 329348e7
......@@ -5,12 +5,45 @@ import ButtonFilled from "../../components/ButtonFilled";
import { useNavigation } from "@react-navigation/native";
import { MultiSelect } from "react-native-element-dropdown";
import { useWindowDimensions } from "react-native";
import { useRoute } from "@react-navigation/native";
export default function DietStepTwo() {
const navigation = useNavigation();
const [selected, setSelected] = useState([]);
const { fontScale } = useWindowDimensions();
const route = useRoute();
const {
stage,
potassium,
calcium,
phosphorus,
sodium,
hemoglobin,
cholesterol,
} = route.params;
const handleNext = () => {
console.log("Stage:", stage);
console.log("Potassium:", potassium);
console.log("Calcium:", calcium);
console.log("Phosphorus:", phosphorus);
console.log("Sodium:", sodium);
console.log("Hemoglobin:", hemoglobin);
console.log("Cholesterol:", cholesterol);
navigation.navigate("DietPlan", {
stage,
potassium,
calcium,
phosphorus,
sodium,
hemoglobin,
cholesterol,
});
};
const preferences = [
{
label: "Vegitarian",
......@@ -159,10 +192,7 @@ export default function DietStepTwo() {
width: "85%",
}}
>
<ButtonFilled
title="Next"
onPress={() => navigation.navigate("DietPlan")}
/>
<ButtonFilled title="Next" onPress={handleNext} />
</View>
</View>
);
......
Frontend/screens/Prediction/Prediction.js
View file @ 329348e7
......@@ -3,8 +3,10 @@ import {
Text,
TouchableOpacity,
useWindowDimensions,
Button,
Image,
} from "react-native";
import React, { useRef } from "react";
import React, { useRef, useState, useEffect } from "react";
import ButtonFilled from "../../components/ButtonFilled";
import ButtonFilledLight from "../../components/ButtonFilledLight";
import { RadioButton } from "react-native-paper";
......@@ -13,15 +15,63 @@ import { AntDesign } from "@expo/vector-icons";
import PredictionCircle from "../../components/PredictionCircle";
import MedicalCenters from "../../assets/MedicalCenters";
import MapView, { Marker } from "react-native-maps";
import axios from "axios";
export default function Prediction() {
const navigation = useNavigation();
const route = useRoute();
const { selectedDistrict } = route.params;
const {
selectedDistrict,
age,
gender,
color,
medications,
overweight,
smoking,
alcohol,
diabetes,
frequent,
blockage,
swelling,
history,
} = route.params;
const centers = MedicalCenters.filter((c) => c.district === selectedDistrict);
const mapRef = useRef(null);
const { fontScale } = useWindowDimensions();
const [inputData, setInputData] = useState({
age,
gender,
color,
medications,
overweight,
smoking,
alcohol,
diabetes,
frequent,
blockage,
swelling,
history,
});
const [prediction, setPrediction] = useState("");
useEffect(() => {
console.log(route.params);
// alert(JSON.stringify(route.params));
}, []);
useEffect(() => {
axios
.post("http://192.168.8.156:5004/predict", inputData)
.then((response) => {
setPrediction(response.data.prediction);
})
.catch((error) => {
console.error("Error:", error);
});
}, []);
return (
<View
style={{
......@@ -43,129 +93,158 @@ export default function Prediction() {
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-SemiBold",
color: "red",
textAlign: "center",
}}
>
You have a risk of contracting CKD!
You are at a {prediction} level
</Text>
<View style={{}}>
<Text
style={{
fontSize: 18 / fontScale,
fontFamily: "Lora-Bold",
color: "#222244",
marginVertical: "2.5%",
}}
>
Recommended Tests
</Text>
<View
style={{
gap: 10,
}}
>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Complete Blood Count
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Estimated GFR ( CKD - EPI )
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Plasma Glucose Venous - Fasting
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Serum Creatinine
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Blood Pressure
</Text>
</View>
</View>
<View style={{ flex: 1 }}>
<Text
style={{
fontSize: 18 / fontScale,
fontFamily: "Lora-Bold",
color: "#222244",
marginTop: "2.5%",
}}
>
Nearest Medical Centers in {selectedDistrict}
</Text>
{centers.map((center) => (
<View
style={{ flex: 1, width: "100%", height: "100%" }}
key={center.name}
>
{prediction === "Risky" && (
<>
<View style={{}}>
<Text
style={{
fontSize: 18 / fontScale,
fontFamily: "OpenSans-Regular",
fontFamily: "Lora-Bold",
color: "#222244",
marginVertical: "2.5%",
}}
>
{center.name}
Recommended Tests
</Text>
<MapView
<View
style={{
flex: 1,
gap: 10,
}}
initialRegion={{
latitude: center.latitude,
longitude: center.longitude,
latitudeDelta: 0.04,
longitudeDelta: 0.05,
}}
key={center.name}
>
<Marker
coordinate={{
latitude: center.latitude,
longitude: center.longitude,
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Complete Blood Count
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Estimated GFR ( CKD - EPI )
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Plasma Glucose Venous - Fasting
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
title={center.name}
/>
</MapView>
>
Serum Creatinine
</Text>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
}}
>
Blood Pressure
</Text>
</View>
</View>
))}
</View>
<View style={{ flex: 1 }}>
<Text
style={{
fontSize: 18 / fontScale,
fontFamily: "Lora-Bold",
color: "#222244",
marginTop: "2.5%",
}}
>
Nearest Medical Centers in {selectedDistrict}
</Text>
{centers.map((center) => (
<View
style={{ flex: 1, width: "100%", height: "100%" }}
key={center.name}
>
<Text
style={{
fontSize: 16 / fontScale,
fontFamily: "OpenSans-Regular",
color: "#222244",
marginVertical: "2.5%",
}}
>
{center.name}
</Text>
<MapView
style={{
flex: 0.95,
height: 200,
}}
initialRegion={{
latitude: center.latitude,
longitude: center.longitude,
latitudeDelta: 0.04,
longitudeDelta: 0.05,
}}
key={center.name}
>
<Marker
coordinate={{
latitude: center.latitude,
longitude: center.longitude,
}}
title={center.name}
/>
</MapView>
</View>
))}
</View>
</>
)}
{prediction === "Not Risky" && (
<>
<Text
style={{
fontSize: 14 / fontScale,
fontFamily: "OpenSans-Medium",
color: "#222244",
marginTop: "2.5%",
textAlign: "justify",
}}
>
While you are not at a high risk of CKD at the moment, it is
essential to continue a healthy lifestyle, including a balanced
diet, regular exercise, and avoiding risk factors like smoking and
excessive alcohol consumption.
</Text>
<Image
style={{
width: "100%",
height: 300,
resizeMode: "contain",
marginTop: "2.5%",
}}
source={require("../../assets/images/PredictionImage.png")}
/>
</>
)}
</View>
<View
......
Frontend/screens/Prediction/PredictionStepOne.js
View file @ 329348e7
......@@ -15,15 +15,49 @@ import { AntDesign } from "@expo/vector-icons";
import { useNavigation } from "@react-navigation/native";
import { Dropdown } from "react-native-element-dropdown";
import { useWindowDimensions } from "react-native";
import { useEffect } from "react";
export default function PredictionStepOne() {
const [checkedAge, setCheckedAge] = useState("Yes");
const [checkedGender, setCheckedGender] = useState("Male");
const [checkedGender, setCheckedGender] = useState();
const [value, setValue] = useState(null);
const navigation = useNavigation();
const [selectedDistrict, setSelectedDistrict] = useState(null);
const { fontScale } = useWindowDimensions();
const [inputData, setInputData] = useState({
age: "",
gender: "",
});
const [age, setAge] = useState();
const [gender, setGender] = useState();
const handleInputChange = (name, value) => {
const numericValue = parseFloat(value);
setInputData({ ...inputData, [name]: numericValue });
setAge(numericValue);
};
useEffect(() => {
if (checkedGender !== undefined) {
setGender(checkedGender);
}
}, [checkedGender]);
const handleNext = () => {
console.log("Age:", age);
console.log("Gender:", gender);
console.log("Selected District:", selectedDistrict);
// Pass color, medications, overweight, smoking, alcohol, and selectedDistrict to the next screen
navigation.navigate("PredictionStepTwo", {
age,
gender,
selectedDistrict,
});
};
return (
<View
style={{
......@@ -50,11 +84,10 @@ export default function PredictionStepOne() {
>
<View>
<FormInput
// value={email}
// onChangeText={(value) => handleOnChangeText(value, "email")}
autoCapitalize="none"
onChangeText={(value) => handleInputChange("age", value)}
value={inputData.age}
secureTextEntry={false}
// autoComplete="age"
label="What is your age?"
placeholder="Age"
keyboardType="numeric"
......@@ -76,9 +109,9 @@ export default function PredictionStepOne() {
<View style={{ marginTop: 10, flexDirection: "row" }}>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="male"
status={checkedGender === "male" ? "checked" : "unchecked"}
onPress={() => setCheckedGender("male")}
value={1}
status={checkedGender === 1 ? "checked" : "unchecked"}
onPress={() => setCheckedGender(1)}
/>
<Text
style={{
......@@ -91,9 +124,9 @@ export default function PredictionStepOne() {
</View>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="female"
status={checkedGender === "female" ? "checked" : "unchecked"}
onPress={() => setCheckedGender("female")}
value={0}
status={checkedGender === 0 ? "checked" : "unchecked"}
onPress={() => setCheckedGender(0)}
/>
<Text
style={{
......@@ -169,12 +202,7 @@ export default function PredictionStepOne() {
width: "85%",
}}
>
<ButtonFilled
title="Next"
onPress={() =>
navigation.navigate("PredictionStepTwo", { selectedDistrict })
}
/>
<ButtonFilled title="Next" onPress={handleNext} />
</View>
</View>
);
......
Frontend/screens/Prediction/PredictionStepThree.js
View file @ 329348e7
import { View, Text, TouchableOpacity } from "react-native";
import React, { useState } from "react";
import React, { useState, useEffect } from "react";
import ButtonFilled from "../../components/ButtonFilled";
import { AntDesign } from "@expo/vector-icons";
import { RadioButton } from "react-native-paper";
......@@ -8,19 +8,62 @@ import FormInput from "../../components/FormInput";
import { useWindowDimensions } from "react-native";
export default function PredictionStepThree() {
const [checkedAge, setCheckedAge] = useState("Yes");
const [checkedGender, setCheckedGender] = useState("Yes");
const [diabetes, setDiabetes] = useState("");
const [frequent, setFrequent] = useState("");
const [blockage, setBlockage] = useState("");
const [swelling, setSwelling] = useState("");
const [history, setHistory] = useState("");
const [diabetes, setDiabetes] = useState();
const [frequent, setFrequent] = useState();
const [blockage, setBlockage] = useState();
const [swelling, setSwelling] = useState();
const [history, setHistory] = useState();
const route = useRoute();
const { selectedDistrict } = route.params;
const {
age,
gender,
color,
medications,
overweight,
smoking,
alcohol,
selectedDistrict,
} = route.params;
const { fontScale } = useWindowDimensions();
useEffect(() => {
setDiabetes(diabetes);
setBlockage(blockage);
setFrequent(frequent);
setSwelling(swelling);
setHistory(history);
}, [diabetes, blockage, frequent, swelling, history]);
const handleNext = () => {
console.log("Diabetes:", diabetes);
console.log("Frequent:", frequent);
console.log("Blockage:", blockage);
console.log("Swelling:", swelling);
console.log("History:", history);
navigation.navigate("Prediction", {
age,
gender,
color,
medications,
overweight,
smoking,
alcohol,
diabetes,
frequent,
blockage,
swelling,
history,
selectedDistrict,
});
};
const navigation = useNavigation();
useEffect(() => {
console.log(route.params);
}, []);
return (
<View
style={{
......@@ -58,9 +101,9 @@ export default function PredictionStepThree() {
>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="yes"
status={diabetes === "yes" ? "checked" : "unchecked"}
onPress={() => setDiabetes("yes")}
value={1}
status={diabetes === 1 ? "checked" : "unchecked"}
onPress={() => setDiabetes(1)}
/>
<Text
style={{
......@@ -73,9 +116,9 @@ export default function PredictionStepThree() {
</View>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="no"
status={diabetes === "no" ? "checked" : "unchecked"}
onPress={() => setDiabetes("no")}
value={0}
status={diabetes === 0 ? "checked" : "unchecked"}
onPress={() => setDiabetes(0)}
/>
<Text
style={{
......@@ -110,9 +153,9 @@ export default function PredictionStepThree() {
>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="yes"
status={history === "yes" ? "checked" : "unchecked"}
onPress={() => setHistory("yes")}
value={1}
status={history === 1 ? "checked" : "unchecked"}
onPress={() => setHistory(1)}
/>
<Text
style={{
......@@ -125,9 +168,9 @@ export default function PredictionStepThree() {
</View>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="no"
status={history === "no" ? "checked" : "unchecked"}
onPress={() => setHistory("no")}
value={0}
status={history === 0 ? "checked" : "unchecked"}
onPress={() => setHistory(0)}
/>
<Text
style={{
......@@ -163,9 +206,9 @@ export default function PredictionStepThree() {
>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="yes"
status={frequent === "yes" ? "checked" : "unchecked"}
onPress={() => setFrequent("yes")}
value={1}
status={frequent === 1 ? "checked" : "unchecked"}
onPress={() => setFrequent(1)}
/>
<Text
style={{
......@@ -178,9 +221,9 @@ export default function PredictionStepThree() {
</View>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="no"
status={frequent === "no" ? "checked" : "unchecked"}
onPress={() => setFrequent("no")}
value={0}
status={frequent === 0 ? "checked" : "unchecked"}
onPress={() => setFrequent(0)}
/>
<Text
style={{
......@@ -216,9 +259,9 @@ export default function PredictionStepThree() {
>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="yes"
status={blockage === "yes" ? "checked" : "unchecked"}
onPress={() => setBlockage("yes")}
value={1}
status={blockage === 1 ? "checked" : "unchecked"}
onPress={() => setBlockage(1)}
/>
<Text
style={{
......@@ -231,9 +274,9 @@ export default function PredictionStepThree() {
</View>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="no"
status={blockage === "no" ? "checked" : "unchecked"}
onPress={() => setBlockage("no")}
value={0}
status={blockage === 0 ? "checked" : "unchecked"}
onPress={() => setBlockage(0)}
/>
<Text
style={{
......@@ -270,9 +313,9 @@ export default function PredictionStepThree() {
>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="yes"
status={swelling === "yes" ? "checked" : "unchecked"}
onPress={() => setSwelling("yes")}
value={1}
status={swelling === 1 ? "checked" : "unchecked"}
onPress={() => setSwelling(1)}
/>
<Text
style={{
......@@ -285,9 +328,9 @@ export default function PredictionStepThree() {
</View>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<RadioButton
value="no"
status={swelling === "no" ? "checked" : "unchecked"}
onPress={() => setSwelling("no")}
value={0}
status={swelling === 0 ? "checked" : "unchecked"}
onPress={() => setSwelling(0)}
/>
<Text
style={{
......@@ -311,12 +354,7 @@ export default function PredictionStepThree() {
width: "85%",
}}
>
<ButtonFilled
title="Next"
onPress={() =>
navigation.navigate("Prediction", { selectedDistrict })
}
/>
<ButtonFilled title="Next" onPress={handleNext} />
</View>
</View>
);
......
Frontend/screens/Water_Quality_Analysis/AutomaticMode.js
View file @ 329348e7
import { View, Text } from "react-native";
import React, { useState } from "react";
import { View, Text, TouchableOpacity, Linking } from "react-native";
import React, { useState, useEffect } from "react";
import * as Progress from "react-native-progress";
import { Ionicons } from "@expo/vector-icons";
import { useWindowDimensions } from "react-native";
export default function AutomaticMode() {
const [isConnectedMLP, setIsConnectedMLP] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const [isLoading, setIsLoading] = useState(true);
const [waterdata, setWaterdata] = useState(null);
const [showLink, setShowLink] = useState(false);
const { fontScale } = useWindowDimensions();
useEffect(() => {
const timer = setTimeout(() => {
setIsLoading(false);
setShowLink(true);
}, 6000); // 6 seconds
return () => clearTimeout(timer);
}, []);
async function fetchData() {
const result = await API.getData();
setData(result);
setIsLoading(false);
}
const handleLinkPress = () => {
Linking.openURL("https://ckdrealtimedata.streamlit.app/");
};
return (
<View>
<View
......@@ -69,6 +83,29 @@ export default function AutomaticMode() {
{isLoading ? "Please Wait..." : "Fetched successfully!"}
</Text>
</View>
{showLink && (
<View
style={{
marginTop: "10%",
marginLeft: "auto",
marginRight: "auto",
}}
>
<TouchableOpacity onPress={handleLinkPress}>
<Text
style={{
fontFamily: "OpenSans-Bold",
fontSize: 16 / fontScale,
color: "#008000",
textTransform: "uppercase",
}}
>
Click Here to Open the Link
</Text>
</TouchableOpacity>
</View>
)}
</View>
);
}
Frontend/screens/Water_Quality_Analysis/ManualMode.js
View file @ 329348e7
import { View, Text, StyleSheet } from "react-native";
import { View, Text, StyleSheet, TextInput } from "react-native";
import React, { useState } from "react";
import WaterQualityInput from "../../components/WaterQualityInput";
import { Dropdown } from "react-native-element-dropdown";
import { districts } from "../../assets/Districts";
import { useWindowDimensions } from "react-native";
import { waterDistricts } from "../../assets/WaterDistricts";
import { useEffect } from "react";
import ButtonFilled from "../../components/ButtonFilled";
import { useNavigation } from "@react-navigation/native";
export default function ManualMode() {
const [value, setValue] = useState(null);
const { fontScale } = useWindowDimensions();
const navigation = useNavigation();
const [inputWaterData, setInputWaterData] = useState({
location: "",
pHValue: "",
temperature: "",
turbidity: "",
tds: "",
});
const waterDistricts = [
{
label: "Anuradhapura",
value: "0",
},
{
label: "Kurunegala",
value: "1",
},
{
label: "Polonnaruwa",
value: "2",
},
];
const [location, setLocation] = useState();
const [pHValue, setpHValue] = useState();
const [temperature, setTemperature] = useState();
const [turbidity, setTurbidity] = useState();
const [tds, setTds] = useState();
const [checklocation, setChecklocation] = useState(false);
const handleInputChange = (name, value) => {
const numericValue = parseFloat(value);
setInputWaterData({ ...inputWaterData, [name]: numericValue });
if (name === "pHValue") {
setpHValue(numericValue);
} else if (name === "temperature") {
setTemperature(numericValue);
} else if (name === "turbidity") {
setTurbidity(numericValue);
} else if (name === "tds") {
setTds(numericValue);
}
};
useEffect(() => {
if (checklocation !== undefined) {
setChecklocation(value);
}
});
const handleNext = () => {
console.log("location", location);
console.log("pHValue", pHValue);
console.log("temperature", temperature);
console.log("turbidity", turbidity);
console.log("tds", tds);
navigation.navigate("WaterTestResults", {
location,
pHValue,
temperature,
turbidity,
tds,
});
};
return (
<View
......@@ -63,25 +135,207 @@ export default function ManualMode() {
}}
iconStyle={styles.iconStyle}
search
data={districts}
data={waterDistricts}
maxHeight={300}
labelField="label"
valueField="value"
placeholder="Your Location"
value={value}
value={location}
onChange={(item) => {
setValue(item.value);
setLocation(item.value);
}}
/>
</View>
{/* <WaterQualityInput label="Date" keyboardType="numeric" /> */}
<WaterQualityInput label="pH Value" keyboardType="numeric" />
<WaterQualityInput
label="Water Temperature (°C) "
keyboardType="numeric"
/>
<WaterQualityInput label="Turbidity" keyboardType="numeric" />
<View
style={{
width: "85%",
marginLeft: "auto",
marginRight: "auto",
marginTop: "2.5%",
gap: 5,
}}
>
<View
style={{
flexDirection: "row",
alignItems: "center",
justifyContent: "space-between",
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#222244",
}}
>
Temperature
</Text>
<View
style={{
flexDirection: "row",
alignItems: "center",
flex: 1,
justifyContent: "flex-end",
}}
>
<TextInput
keyboardType="numeric"
value={inputWaterData.temperature}
onChangeText={(value) => handleInputChange("temperature", value)}
style={{
fontFamily: "OpenSans-Regular",
fontSize: 15,
borderWidth: 1,
borderColor: "#333366",
width: 165,
paddingVertical: 5,
paddingHorizontal: 15,
borderRadius: 45,
}}
/>
</View>
</View>
<View
style={{
flexDirection: "row",
alignItems: "center",
justifyContent: "space-between",
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#222244",
}}
>
pH Value
</Text>
<View
style={{
flexDirection: "row",
alignItems: "center",
flex: 1,
justifyContent: "flex-end",
}}
>
<TextInput
keyboardType="numeric"
value={inputWaterData.pHValue}
onChangeText={(value) => handleInputChange("pHValue", value)}
style={{
fontFamily: "OpenSans-Regular",
fontSize: 15,
borderWidth: 1,
borderColor: "#333366",
width: 165,
paddingVertical: 5,
paddingHorizontal: 15,
borderRadius: 45,
}}
/>
</View>
</View>
<View
style={{
flexDirection: "row",
alignItems: "center",
justifyContent: "space-between",
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#222244",
}}
>
Turbidity
</Text>
<View
style={{
flexDirection: "row",
alignItems: "center",
flex: 1,
justifyContent: "flex-end",
}}
>
<TextInput
keyboardType="numeric"
value={inputWaterData.turbidity}
onChangeText={(value) => handleInputChange("turbidity", value)}
style={{
fontFamily: "OpenSans-Regular",
fontSize: 15,
borderWidth: 1,
borderColor: "#333366",
width: 165,
paddingVertical: 5,
paddingHorizontal: 15,
borderRadius: 45,
}}
/>
</View>
</View>
<View
style={{
flexDirection: "row",
alignItems: "center",
justifyContent: "space-between",
}}
>
<Text
style={{
fontFamily: "OpenSans-Regular",
fontSize: 13 / fontScale,
color: "#222244",
}}
>
TDS
</Text>
<View
style={{
flexDirection: "row",
alignItems: "center",
flex: 1,
justifyContent: "flex-end",
}}
>
<TextInput
keyboardType="numeric"
value={inputWaterData.tds}
onChangeText={(value) => handleInputChange("tds", value)}
style={{
fontFamily: "OpenSans-Regular",
fontSize: 15,
borderWidth: 1,
borderColor: "#333366",
width: 165,
paddingVertical: 5,
paddingHorizontal: 15,
borderRadius: 45,
}}
/>
</View>
</View>
</View>
<View
style={{
width: "85%",
marginLeft: "auto",
marginRight: "auto",
marginTop: "5%",
}}
>
<ButtonFilled onPress={handleNext} title="Next" />
</View>
</View>
);
}
......
Frontend/screens/Water_Quality_Analysis/WaterQualityStepOne.js
View file @ 329348e7
......@@ -113,8 +113,6 @@ export default function WaterQualityStepOne() {
<AutomaticMode />
</>
)}
{/* <LoadingAnimation /> */}
</View>
<View
......@@ -125,10 +123,10 @@ export default function WaterQualityStepOne() {
width: "85%",
}}
>
<ButtonFilled
{/* <ButtonFilled
title="View Test Results"
onPress={() => navigation.navigate("WaterTestResults")}
/>
/> */}
</View>
</View>
);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment