Skip to content

Commit

Permalink
commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@akhilrgeorge007
akhilrgeorge007 committed Mar 19, 2023
1 parent 7724d54 commit 0c5f735
Showing 1 changed file with 114 additions and 15 deletions.
129 changes: 114 additions & 15 deletions frontend/src/pages/Details2/Details2.js
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,97 @@
import React from 'react';
import React, { useState } from 'react'
import 'bootstrap/dist/css/bootstrap.css';
import './Details2.css';
import axios from "axios";
import Popover from '@mui/material/Popover';
import Typography from '@mui/material/Typography';
function Details2() {
import {
Dialog,
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
} from "@mui/material";
const Details2 = ()=>{


const addData = (e)=>{
// console.log(e.target);
const {name,value} = e.target;
setData(()=>{
return{
...logdata,
[name]:value
}

})
}

const [res,setRes] = useState({
data:""
})
const baseURL = "http://localhost:4000/api"
async function predict(){
await axios.post(`${baseURL}/diabetes/predict`,{
Age:logdata.Age,
Sex:logdata.Sex,
HighChol:logdata.HighChol,
BMI:logdata.BMI,
Smoker:logdata.Smoker,
PhysActivity:logdata.PhysActivity,
PhysHlth:logdata.PhysHlth,
Fruits:logdata.Fruits,
Veggies:logdata.Veggies,
HvyAlcoholConsump:logdata.HvyAlcoholConsump,
Stroke:logdata.Stroke,
HighBP:logdata.HighBP
}).then((response)=>{
console.log(response.data)
setRes(()=>{
return{
...res,
["data"]:response.data.message
}

})
})
}
const [logdata,setData] = useState({
Age:"",
Sex:"",
HighChol:"",
BMI:"",
Smoker:"",
PhysActivity:"",
PhysHlth:"",
Fruits:"",
Veggies:"",
HvyAlcoholConsump:"",
Stroke:"",
HighBP:""
})

var _a = React.useState(null), anchorEl = _a[0], setAnchorEl = _a[1];
var handleClick = function (event) {
setAnchorEl(event.currentTarget);
};
var handleClose = function () {
setAnchorEl(null);
};


const open = Boolean(anchorEl);
const id = open ? 'simple-popover' : undefined;

const [open1, setOpen1] = React.useState(false);

const handleClickOpen = (e) => {
e.preventDefault()
setOpen1(true);
};

const handleClose1 = () => {
setOpen1(false);
};
return (
<div className='whole'>
<div className='container'>
Expand All @@ -24,18 +103,18 @@ function Details2() {
<div class="form-group row">
<label class="control-label col-sm-2" for="age">Age :</label>
<div class="col-sm-3">
<input type="number" class="form-control" id="age" min='1' />
<input type="number" class="form-control" id="age" name='Age' min='1' value={logdata.Age} onChange={addData} />
</div>
<label class="control-label col-sm-2 offset-1" for="gender">Gender:</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='Sex' onChange={addData} value={logdata.Sex} />
</div>
</div>
<br />
<div class="form-group row">
<label className='control-label col-sm-2'>High Cholestrol :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='HighChol' value={logdata.HighChol} onChange={addData}/>
</div>
<a className='control-label col-sm-2 offset-1' aria-describedby={id} variant="contained" onClick={handleClick}>Body Mass Index(BMI) :
</a>
Expand All @@ -52,57 +131,62 @@ function Details2() {
<Typography sx={{ p: 2 }}>The content of the Popover.</Typography>
</Popover>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='BMI' value={logdata.BMI} onChange={addData}/>
</div>
</div>
<br />
<div class="form-group row">
<label className='control-label col-sm-2'>Are you a smoker? :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='Smoker' value={logdata.Smoker} onChange={addData}/>
</div>
<a className='control-label col-sm-2 offset-1' aria-describedby={id} variant="contained" onClick={handleClick}>Physical Activity:</a>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='PhysActivity' value={logdata.PhysActivity} onChange={addData} />
</div>
</div>
<br />
<div class="form-group row">
<label className='control-label col-sm-2' aria-describedby={id} variant="contained" onClick={handleClick}>Physical Health :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='PhysHlth' value={logdata.PhysHlth} onChange={addData} />
</div>
<label className='control-label col-sm-2 offset-1' aria-describedby={id} variant="contained" onClick={handleClick}>Fruits :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='Fruits' value={logdata.Fruits} onChange={addData}/>
</div>
</div>
<br />
<div class="form-group row">
<label className='control-label col-sm-2' aria-describedby={id} variant="contained" onClick={handleClick}>Vegetables :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='Veggies' value={logdata.Veggies} onChange={addData} />
</div>
<label className='control-label col-sm-2 offset-1' aria-describedby={id} variant="contained" onClick={handleClick}>Heavy Alcohol Consumption :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='HvyAlcoholConsump' value={logdata.HvyAlcoholConsump} onChange={addData} />
</div>
</div>
<br />
<div class="form-group row">
<label className='control-label col-sm-2' aria-describedby={id} variant="contained" onClick={handleClick}>Stroke :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" name='Stroke' value={logdata.Stroke} onChange={addData} />
</div>
<label className='control-label col-sm-2 offset-1' aria-describedby={id} variant="contained" onClick={handleClick}>High Blood Pressure :</label>
<div class="col-sm-3">
<input type="text" class="form-control" />
<input type="text" class="form-control" value={logdata.HighBP} name='HighBP' onChange={addData} />
</div>
</div>

<br />
<div className='row'>
<input type="submit" class="btn btn-danger col-1 offset-5" value="Submit" />
<input type="submit" class="btn btn-danger col-1 offset-5" value="Submit" onClick={(e)=>{
e.preventDefault();
predict()
handleClickOpen(e)
console.log(logdata)
}}/>
</div>
</form>

Expand Down Expand Up @@ -135,6 +219,21 @@ function Details2() {
<br />
<h2 className='g1'>*High Blood Pressure: 0 = no High BP,1 = Yes High BP </h2>
</div>
<Dialog
open={open1}
onClose={handleClose1}
aria-labelledby="alert-dialog-title"
aria-describedby="alert-dialog-description"
>
<DialogTitle id="alert-dialog-title">
{"Message"}
</DialogTitle>
<DialogContent>
<DialogContentText id="alert-dialog-description">
{res.data}
</DialogContentText>
</DialogContent>
</Dialog>
</div >
)
}
Expand Down

0 comments on commit 0c5f735

Please sign in to comment.