fixed search and added routes for past

This commit is contained in:
Ava DeCroix
2023-05-01 14:18:19 -04:00
parent 09a59d77cf
commit 32053d9ff9
3 changed files with 186 additions and 239 deletions

View File

@@ -80,84 +80,39 @@ function weekStart(){
const net_id = ReactSession.get("net_id"); const net_id = ReactSession.get("net_id");
//to set nutritional goal for the week
const [goalInput, setGoalInput] = useState({
total_cal: 0,
total_fat: 0,
total_sat_fat: 0,
total_trans_fat: 0,
total_carbs: 0,
total_fiber: 0,
total_sugar: 0,
total_protein: 0,
total_sodium: 0,
total_potassium: 0,
total_cholesterol: 0,
}
);
const{total_cal, total_fat, total_sat_fat, total_trans_fat, total_carbs, total_fiber,
total_sugar, total_protein, total_sodium, total_potassium, total_cholesterol} = goalInput
const changeGoalHandler = evt =>{
setGoalInput({...goalInput, [evt.target.name]: [evt.target.value] })
}
const submitGoalHandler = evt => {
evt.preventDefault();
console.log(goalInput)
console.log(net_id)
console.log(weekStart())
Axios.post("http://3.219.93.142:8000/api/goal",
{
net_id: net_id,
week_date: weekStart(),
total_cal: Number(total_cal[0]),
total_fat: Number(total_fat[0]),
total_sat_fat: Number(total_sat_fat[0]),
total_trans_fat: Number(total_trans_fat[0]),
total_carbs: Number(total_carbs[0]),
total_fiber: Number(total_fiber[0]),
total_sugar: Number(total_sugar[0]),
total_protein: Number(total_protein[0]),
total_sodium: Number(total_sodium[0]),
total_potassium: Number(total_potassium[0]),
total_cholesterol: Number(total_cholesterol[0])
}).then((response) => {
console.log(response);
console.log(response.status);
})
};
//to find a food item from an on campus location to your weekly journal //to find a food item from an on campus location to your weekly journal
const [keyword, setKeyword] = useState({ const [keyword, setKeyword] = useState({
search_term:"" search_term:""
}) })
const [searchItems, setSearchItems] = useState([{}]); const [searchItems, setSearchItems] = useState([]);
const [sendItems, setSendItems] = useState([{}]);
const{search_term} = keyword const{search_term} = keyword
const removeItem = (index) => { const removeItem = (index) => {
setSearchItems([ setSendItems([
...searchItems.slice(0, index), ...sendItems.slice(0, index),
...searchItems.slice(index + 1) ...sendItems.slice(index + 1)
]); ]);
} }
function handleCheck (i) { function handleCheck (i) {
console.log(i); console.log(i);
if (searchItems.indexOf(i) > -1){ if (sendItems.indexOf(i) > -1){
//get index and delete //get index and delete
var index = searchItems.indexOf(i) var index = sendItems.indexOf(i)
removeItem(index); removeItem(index);
console.log(`removed ${i}`); console.log(`removed ${i}`);
} }
else{ else{
setSearchItems(searchItems => [...searchItems, i]); setSendItems(sendItems => [...sendItems, i]);
console.log(`added ${i}`); console.log(`added ${i}`);
} }
@@ -178,8 +133,9 @@ const submitSearchHandler = evt => {
}).then((response) => { }).then((response) => {
console.log(response); console.log(response);
console.log(response.status); console.log(response.status);
console.log(response.data); console.log('Data:')
setSearchItems(response.data); console.log(response.data.results);
setSearchItems(response.data.results);
}) })
}; };
@@ -335,9 +291,6 @@ color: 'main',
onChange={() => handleCheck(searchitem.item_id)} onChange={() => handleCheck(searchitem.item_id)}
/> />
</TableCell> </TableCell>
<TableCell>
{searchitem.item_name}
</TableCell>
<TableCell> {searchitem.eatery_id}</TableCell> <TableCell> {searchitem.eatery_id}</TableCell>
<TableCell> {searchitem.item_name}</TableCell> <TableCell> {searchitem.item_name}</TableCell>

View File

@@ -1,4 +1,4 @@
import React,{useState} from 'react'; import React,{useState, useEffect} from 'react';
import {Routes, Route, useNavigate} from 'react-router-dom'; import {Routes, Route, useNavigate} from 'react-router-dom';
import './Login.css'; import './Login.css';
import Button from "@mui/material/Button"; import Button from "@mui/material/Button";
@@ -22,7 +22,7 @@ import MenuItem from '@mui/material/MenuItem';
import {red, green, lightBlue, lightGreen} from '@mui/material/colors'; import {red, green, lightBlue, lightGreen} from '@mui/material/colors';
import { ThemeProvider, createTheme } from '@mui/material/styles'; import { ThemeProvider, createTheme } from '@mui/material/styles';
import { ReactSession } from 'react-client-session'; import { ReactSession } from 'react-client-session';
import { Axios } from 'axios'; import Axios from 'axios';
import Chip from '@mui/material/Chip'; import Chip from '@mui/material/Chip';
import Stack from '@mui/material/Stack'; import Stack from '@mui/material/Stack';
import Select, { SelectChangeEvent } from '@mui/material/Select'; import Select, { SelectChangeEvent } from '@mui/material/Select';
@@ -94,78 +94,43 @@ function weekStart(){
const net_id = ReactSession.get("net_id"); const net_id = ReactSession.get("net_id");
//to set nutritional goal for the week //Get history of plans for this week
const [goalInput, setGoalInput] = useState({ const [pastPlans, setPastPlans] = useState([{}]);
total_cal: "", const makePastURL = (net_id) => `http://3.219.93.142:8000/api/${net_id}`;
total_fat: "",
total_sat_fat: "", const getPastPlans = () => {
total_trans_fat: "", const net_id = ReactSession.get("net_id");
total_carbs: "", const url_to_query = makePastURL(net_id);
total_fiber: "", Axios.get(url_to_query).then((response) => {
total_sugar: "", console.log(response.data);
total_protein: "", setPastPlans(response.data);
total_sodium: "", });
total_potassium: "",
total_cholesterol: "",
} }
); //Get history of actual totals for weekly plan (progress)
const [past, setPast] = useState([{}]);
const makeURL = (net_id) => `http://3.219.93.142:8000/api/${net_id}`;
const{total_cal, total_fat, total_sat_fat, total_trans_fat, total_carbs, total_fiber, const getPast = () => {
total_sugar, total_protein, total_sodium, total_potassium, total_cholesterol} = goalInput const net_id = ReactSession.get("net_id");
const url_to_query = makeURL(net_id);
Axios.get(url_to_query).then((response) => {
console.log(response.data);
setPast(response.data);
});
const changeGoalHandler = evt =>{
setGoalInput({...goalInput, [evt.target.name]: [evt.target.value] })
}
const submitGoalHandler = evt => {
evt.preventDefault();
console.log(goalInput)
Axios.post("http://3.219.93.142:8000/api/",
{
total_cal: total_cal[0],
total_fat: total_fat[0],
total_sat_fat: total_sat_fat[0],
total_trans_fat: total_trans_fat[0],
total_carbs: total_carbs[0],
total_fiber: total_fiber[0],
total_sugar: total_sugar[0],
total_protein: total_protein[0],
total_sodium: total_sodium[0],
total_potassium: total_potassium[0],
total_cholesterol: total_cholesterol[0]
}).then((response) => {
console.log(response);
console.log(response.status);
})
};
//to add an off campus food item or meal to your weekly journal
const [offCampusInput, setOffCampusInput] = useState({
calories: "",
fat_g: "",
sat_fat_g: "",
trans_fat_g: "",
carbs_g: "",
fiber_g: "",
sugar_g: "",
protein_g: "",
sodium_g: "",
potassium_g: "",
cholesterol_g: "",
}
);
const { calories, fat_g, sat_fat_g, trans_fat_g, carbs_g, fiber_g,sugar_g, protein_g,
sodium_g, potassium_g, cholesterol_g, } = offCampusInput
const changeoffCampusHandler = evt => {
setOffCampusInput({ ...offCampusInput, [evt.target.name]: [evt.target.value] })
} }
const submitoffCampusHandler = evt => { //run getPast and pastPlans on page load
evt.preventDefault(); useEffect(() => {
}; getPast()
console.log('Past actual in')
getPastPlans()
console.log('Past plans in')
}, [])
@@ -200,48 +165,129 @@ const submitGoalHandler = evt => {
<div> <div>
<h1> <h1>
&nbsp; &nbsp;
Past plans: Your History
</h1> </h1>
<TableContainer component={Paper}> <h3>
<Table stickyHeader> &nbsp; &nbsp;
Past plans by week:
</h3>
<Paper sx={{ width: '100%', overflow: 'hidden' }}>
<TableContainer component={Paper} sx={{margin: 5, maxHeight: 200, maxWidth:1400}}>
<Table stickyHeader sx={{maxWidth:1400}}>
<TableHead> <TableHead>
<TableRow> <TableRow sx={{maxWidth:1400}}>
<TableCell style={{ width: 90 }} align="left">Food</TableCell>
<TableCell style={{ width: 90 }} align="left">Calories</TableCell>
<TableCell style={{ width: 90 }} align="left">Fat&nbsp;(g)</TableCell> <TableCell style={{ maxWidth: 110}} align="left">Week</TableCell>
<TableCell style={{ width: 90 }} align="left">Saturated Fat&nbsp;(g)</TableCell> <TableCell style={{ maxWidth: 90 }} align="left">Calories</TableCell>
<TableCell style={{ width: 90 }} align="left">TransFat&nbsp;(g)</TableCell> <TableCell style={{ maxWidth: 70 }} align="left">Fat&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Carbs&nbsp;(g)</TableCell> <TableCell style={{ maxWidth: 90 }} align="left">Saturated Fat&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Fiber&nbsp;(g)</TableCell> <TableCell style={{ maxWidth: 90 }} align="left">TransFat&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Sugar&nbsp;(g)</TableCell> <TableCell style={{ maxWidth: 50 }} align="left">Carbs&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Protein&nbsp;(g)</TableCell> <TableCell style={{ maxWidth: 70 }} align="left">Fiber&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Sodium&nbsp;(mg)</TableCell> <TableCell style={{ maxWidth: 90 }} align="left">Sugar&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Potassium&nbsp;(mg)</TableCell> <TableCell style={{ maxWidth: 90 }} align="left">Protein&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Cholesterol&nbsp;(mg)</TableCell> <TableCell style={{ maxWidth: 90 }} align="left">Sodium&nbsp;(mg)</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">Potassium&nbsp;(mg)</TableCell>
<TableCell style={{ maxWidth: 80 }} align="left">Cholesterol&nbsp;(mg)</TableCell>
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody> <TableBody sx={{maxWidth:1350}}>
<TableRow> {pastPlans.map((pastplan, i) => {
<TableCell> </TableCell> console.log(i);
<TableCell> </TableCell> return(
<TableCell> </TableCell> <TableRow
<TableCell> </TableCell> key={pastplan.week}
<TableCell> </TableCell> sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
<TableCell> </TableCell> >
<TableCell> </TableCell>
<TableCell> </TableCell> <TableCell>
<TableCell> </TableCell> {pastplan.week}
<TableCell> </TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> {pastplan.calories}</TableCell>
<TableCell> {pastplan.fat_g}</TableCell>
<TableCell> {pastplan.sat_fat_g}</TableCell>
<TableCell> {pastplan.trans_fat_g}</TableCell>
<TableCell> {pastplan.carbs_g}</TableCell>
<TableCell> {pastplan.fiber_g}</TableCell>
<TableCell>{pastplan.sugar_g} </TableCell>
<TableCell> {pastplan.protein_g}</TableCell>
<TableCell>{pastplan.sodium_mg} </TableCell>
<TableCell> {pastplan.potassium_mg}</TableCell>
<TableCell> {pastplan.cholesterol_mg}</TableCell>
</TableRow> </TableRow>
)
})}
</TableBody> </TableBody>
</Table> </Table>
</TableContainer> </TableContainer>
</Paper>
<h3>
&nbsp; &nbsp;
Past actual by week:
</h3>
<Paper sx={{ width: '100%', overflow: 'hidden' }}>
<TableContainer component={Paper} sx={{margin: 5, maxHeight: 200, maxWidth:1400}}>
<Table stickyHeader sx={{maxWidth:1400}}>
<TableHead>
<TableRow sx={{maxWidth:1400}}>
<TableCell style={{ maxWidth: 110}} align="left">Week</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">Calories</TableCell>
<TableCell style={{ maxWidth: 70 }} align="left">Fat&nbsp;(g)</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">Saturated Fat&nbsp;(g)</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">TransFat&nbsp;(g)</TableCell>
<TableCell style={{ maxWidth: 50 }} align="left">Carbs&nbsp;(g)</TableCell>
<TableCell style={{ maxWidth: 70 }} align="left">Fiber&nbsp;(g)</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">Sugar&nbsp;(g)</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">Protein&nbsp;(g)</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">Sodium&nbsp;(mg)</TableCell>
<TableCell style={{ maxWidth: 90 }} align="left">Potassium&nbsp;(mg)</TableCell>
<TableCell style={{ maxWidth: 80 }} align="left">Cholesterol&nbsp;(mg)</TableCell>
</TableRow>
</TableHead>
<TableBody sx={{maxWidth:1350}}>
{past.map((progress, i) => {
console.log(i);
return(
<TableRow
key={progress.week}
sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
>
<TableCell>
{progress.week}
</TableCell>
<TableCell> {progress.calories}</TableCell>
<TableCell> {progress.fat_g}</TableCell>
<TableCell> {progress.sat_fat_g}</TableCell>
<TableCell> {progress.trans_fat_g}</TableCell>
<TableCell> {progress.carbs_g}</TableCell>
<TableCell> {progress.fiber_g}</TableCell>
<TableCell>{progress.sugar_g} </TableCell>
<TableCell> {progress.protein_g}</TableCell>
<TableCell>{progress.sodium_mg} </TableCell>
<TableCell> {progress.potassium_mg}</TableCell>
<TableCell> {progress.cholesterol_mg}</TableCell>
</TableRow>
)
})}
</TableBody>
</Table>
</TableContainer>
</Paper>
</div> </div>

View File

@@ -94,79 +94,8 @@ function weekStart(){
const net_id = ReactSession.get("net_id"); const net_id = ReactSession.get("net_id");
//to set nutritional goal for the week
const [goalInput, setGoalInput] = useState({
total_cal: "",
total_fat: "",
total_sat_fat: "",
total_trans_fat: "",
total_carbs: "",
total_fiber: "",
total_sugar: "",
total_protein: "",
total_sodium: "",
total_potassium: "",
total_cholesterol: "",
}
);
const{total_cal, total_fat, total_sat_fat, total_trans_fat, total_carbs, total_fiber,
total_sugar, total_protein, total_sodium, total_potassium, total_cholesterol} = goalInput
const changeGoalHandler = evt =>{
setGoalInput({...goalInput, [evt.target.name]: [evt.target.value] })
}
const submitGoalHandler = evt => {
evt.preventDefault();
console.log(goalInput)
Axios.post("http://3.219.93.142:8000/api/",
{
total_cal: total_cal[0],
total_fat: total_fat[0],
total_sat_fat: total_sat_fat[0],
total_trans_fat: total_trans_fat[0],
total_carbs: total_carbs[0],
total_fiber: total_fiber[0],
total_sugar: total_sugar[0],
total_protein: total_protein[0],
total_sodium: total_sodium[0],
total_potassium: total_potassium[0],
total_cholesterol: total_cholesterol[0]
}).then((response) => {
console.log(response);
console.log(response.status);
})
};
//to add an off campus food item or meal to your weekly journal
const [offCampusInput, setOffCampusInput] = useState({
calories: "",
fat_g: "",
sat_fat_g: "",
trans_fat_g: "",
carbs_g: "",
fiber_g: "",
sugar_g: "",
protein_g: "",
sodium_g: "",
potassium_g: "",
cholesterol_g: "",
}
);
const { calories, fat_g, sat_fat_g, trans_fat_g, carbs_g, fiber_g,sugar_g, protein_g,
sodium_g, potassium_g, cholesterol_g, } = offCampusInput
const changeoffCampusHandler = evt => {
setOffCampusInput({ ...offCampusInput, [evt.target.name]: [evt.target.value] })
}
const submitoffCampusHandler = evt => {
evt.preventDefault();
};
//Get history of items for this week
const [pastItems, setPastItems] = useState([{}]); const [pastItems, setPastItems] = useState([{}]);
const makeURL = (net_id) => `http://3.219.93.142:8000/api/week_progress/${net_id}`; const makeURL = (net_id) => `http://3.219.93.142:8000/api/week_progress/${net_id}`;
@@ -179,11 +108,21 @@ const submitGoalHandler = evt => {
}); });
} }
useEffect(() => { //Get sum of totals for weekly plan (progress)
getHistory() const [goals, setGoals] = useState([{}]);
console.log('History in') const goalURL = (net_id) => `http://3.219.93.142:8000/api/week_goal/${net_id}`;
}, [])
const getGoal = () => {
const net_id = ReactSession.get("net_id");
const url_to_query = goalURL(net_id);
Axios.get(url_to_query).then((response) => {
console.log(response.data);
setGoals(response.data);
});
}
//Get weekly plan goals
const [sum, setSum] = useState([{}]); const [sum, setSum] = useState([{}]);
const sumURL = (net_id) => `http://3.219.93.142:8000/api/week_sum/${net_id}`; const sumURL = (net_id) => `http://3.219.93.142:8000/api/week_sum/${net_id}`;
@@ -196,11 +135,20 @@ const submitGoalHandler = evt => {
}); });
} }
const [cals, setCals] = useState([{}]);
const [fat, setFat] = useState([{}]);
const [trans, setTrans] = useState([{}]);
//Run getSum, getHistory, and getPlan on page load
useEffect(() => { useEffect(() => {
getHistory() getHistory()
console.log('History in') console.log('History in')
getSum() getSum()
console.log('Sum in') console.log('Sum in')
getGoal()
console.log('Goal in')
}, []) }, [])