college_archive/advanced_db
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed search and added routes for past

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

242
db_app/src/components/Past.js
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 './Login.css';
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 { ThemeProvider, createTheme } from '@mui/material/styles';
import { ReactSession } from 'react-client-session';
import { Axios } from 'axios';
import Axios from 'axios';
import Chip from '@mui/material/Chip';
import Stack from '@mui/material/Stack';
import Select, { SelectChangeEvent } from '@mui/material/Select';
@@ -94,78 +94,43 @@ function weekStart(){
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: "",
//Get history of plans for this week
const [pastPlans, setPastPlans] = useState([{}]);
const makePastURL = (net_id) => `http://3.219.93.142:8000/api/${net_id}`;
const getPastPlans = () => {
const net_id = ReactSession.get("net_id");
const url_to_query = makePastURL(net_id);
Axios.get(url_to_query).then((response) => {
console.log(response.data);
setPastPlans(response.data);
});
}
);
//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 getPast = () => {
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{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);
})
};
//run getPast and pastPlans on page load
useEffect(() => {
getPast()
console.log('Past actual in')
getPastPlans()
console.log('Past plans in')
}, [])
//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();
};
@@ -200,48 +165,129 @@ const submitGoalHandler = evt => {
<div>
<h1>
&nbsp;
Past plans:
Your History
</h1>
<TableContainer component={Paper}>
<Table stickyHeader>
<h3>
&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>
<TableRow>
<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={{ width: 90 }} align="left">Saturated Fat&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">TransFat&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Carbs&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Fiber&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Sugar&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Protein&nbsp;(g)</TableCell>
<TableCell style={{ width: 90 }} align="left">Sodium&nbsp;(mg)</TableCell>
<TableCell style={{ width: 90 }} align="left">Potassium&nbsp;(mg)</TableCell>
<TableCell style={{ width: 90 }} align="left">Cholesterol&nbsp;(mg)</TableCell>
<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>
<TableRow>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableCell> </TableCell>
<TableBody sx={{maxWidth:1350}}>
{pastPlans.map((pastplan, i) => {
console.log(i);
return(
<TableRow
key={pastplan.week}
sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
>
<TableCell>
{pastplan.week}
</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>
)
})}
</TableBody>
</Table>
</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>