Skip to content

T
TMP-23-197
Commit 950ebf2b authored by IT20161538's avatar IT20161538
Browse files
Options

new commit

parent 54021086
Expand all Show whitespace changes
Inline Side-by-side
Showing with 2153 additions and 1004 deletions
ResearchFinal.ipynb → SideEffects_Treatments.ipynb
View file @ 950ebf2b
This source diff could not be displayed because it is too large. You can view the blob instead.
sideeffects_treatments.py 0 → 100644
View file @ 950ebf2b
This diff is collapsed.
src/components/SideEffectsAndTreatments.css
View file @ 950ebf2b
.form-container{
margin: 5rem 6rem;
color: #2a2a2a;
.side-effect-wrapper{
width: 95vw;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.form-container form{
width:820px;
height:850px;
padding:20px;
.side-effect-form{
padding: 10px;
margin: 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border-radius:6px;
background:#FFF;
box-shadow:0 0 8px #696969;
margin-left:330px;
padding-block: 10px;
width: 45vw;
margin-top: 80px;
}
.form-container label{
text-align: left;
margin-left:50px;
.title{
margin-bottom: 20px;
}
.form-container input{
height: 2rem;
padding: 0 1rem ;
margin-bottom: 2rem;
border-radius: .3rem;
border: 1px solid #2a2a2a ;
.form{
width: 35vw;
height: 750px;
display: flex;
flex-direction: column;
justify-content: start;
gap: 19px;
padding: 5px;
}
.form-container select {
width: 50%;
padding: 6px 20px;
border: none;
border-radius: 2px;
background-color: white;
margin-right: 2px;
border: 1px solid #2a2a2a ;
.input-group{
display: flex;
flex-direction: row;
gap: 10px;
align-items: center;
padding: 5px;
}
.l-radio {
display: inline-block;
margin-right: 2px;
select{
padding: 5px;
}
.gender-radio {
display: inline-block;
margin-right: 2px;
input{
padding: 5px;
}
.gender-container {
.btn-area{
display: flex;
align-items: center;
flex-direction: row;
justify-content: end;
}
.form-container button{
border:0;
outline:0;
height:50px;
width:200px;
border-radius:50px;
color:white;
font-weight:bold;
font-size:0.9rem;
cursor:pointer;
background:black;
margin-left:530px;
.btn{
color: whitesmoke;
background-color: black;
padding-inline: 40px;
padding-block: 10px;
border-radius: 50px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-ms-border-radius: 50px;
-o-border-radius: 50px;
cursor: pointer;
margin-right:400px;
}
@media screen and (max-width: 850px){
.form-container{
margin: 4rem 2rem;
color: #2a2a2a;
}
.form-container form{
padding-top: 2rem;
width: 90%;
}
.input-group1{
display: flex;
flex-direction: row;
gap: 10px;
align-items: center;
padding: 5px;
}
\ No newline at end of file
src/components/SideEffectsAndTreatments.js
View file @ 950ebf2b
import React from 'react';
import React, { useState } from 'react'
import './SideEffectsAndTreatments.css';
export default function SideEffectsAndTreatments() {
return (
<div className='form-container'>
<form>
<h1>Side Effects & Treatments</h1>
<br/><br/>
<label>Age : <input placeholder='Age'/></label>
<label for="methods">Gender :
<label class="gender-radio">
<input type="radio" name="gender" value="male"/> Male
</label>
<label class="gender-radio">
<input type="radio" name="gender" value="female"/> Female
</label>
</label>
const [age, setAge] = useState('');
const [drugUsageMg, setDrugUsageMg] = useState('');
const [months, setMonths] = useState('');
const [takingCooccurringSubstances, setTakingCooccurringSubstances] = useState('');
const [preExistingmedicalcondition, setPreExistingmedicalcondition] = useState('');
<label>Drug Type :
return (
<div className='side-effect-wrapper'><div className='side-effect-form'><br/>
<h1 className='title'>Side Effect & Treatments</h1><br/>
<form className='form'>
<div className='input-group'>
<label>Age: </label>
<input type='number' placeholder='Age' value={age} onChange={(e)=>{setAge(e.target.value)}}/>
</div>
<div className='input-group'>
<label>Gender: </label>
<input type='radio' name='gender' value='male'/>
<span>Male</span>
<input type='radio' name='gender' value='female'/>
<span>Female</span>
</div>
<div className='input-group'>
<label>Drug Type: </label>
<select name="drugtype">
<option>Choose a Drug Type</option>
<option>Heroin</option>
......@@ -28,24 +33,34 @@ export default function SideEffectsAndTreatments() {
<option>Hashish</option>
<option>Cocaine</option>
<option>Methamphetamine</option>
</select></label>
<br/>
<label>Measures of drug used per day(mg) : <input placeholder='mg'/></label>
<label>Time Used(Month) : <input placeholder='No of months'/></label>
<label>Route of Administration :
</select>
</div>
<div className='input-group'>
<label>Measures of drug used per day(mg): </label>
<input type='number' placeholder='mg' value={drugUsageMg} onChange={(e)=>{setDrugUsageMg(e.target.value)}}/>
</div>
<div className='input-group'>
<label>Time Used(Month): </label>
<input type='number' placeholder='No of months' value={months} onChange={(e)=>{setMonths(e.target.value)}}/>
</div>
<div className='input-group'>
<label>Route of Administration: </label>
<select name="route_of_administration ">
<option>Choose a Route of Administration</option>
<option>Inhalation</option>
<option>Injection</option>
<option>Smoking</option>
</select></label>
<br/>
<label>Taking Co-occurring Substances : <input placeholder=''/></label>
<label>Co-occurring Substances :
</select>
</div>
<div className='input-group'>
<label>Taking Co-occurring Substances: </label>
<input type='radio' name='takingCooccurringSubstances' value='yes' checked={takingCooccurringSubstances === 'yes'} onChange={() => setTakingCooccurringSubstances('yes')}/>
<span>Yes</span>
<input type='radio' name='takingCooccurringSubstances' value='no' checked={takingCooccurringSubstances === 'no'} onChange={() => setTakingCooccurringSubstances('no')}/>
<span>No</span>
</div>
<div className='input-group'>
<label>Co-occurring Substances: </label>
<select name="co-occurringsubstances ">
<option>Choose a Co-occurring Substances</option>
<option>Cannabis</option>
......@@ -55,20 +70,24 @@ export default function SideEffectsAndTreatments() {
<option>Methamphetamine</option>
<option>Alcohol</option>
<option>No</option>
</select></label>
<br/>
</select>
</div>
<div className='input-group'>
<label>Any pre-existing medical conditions?: </label>
<input type='radio' name='preExistingmedicalcondition' value='yes' checked={preExistingmedicalcondition === 'yes'} onChange={() => setPreExistingmedicalcondition('yes')}/>
<span>Yes</span>
<input type='radio' name='preExistingmedicalcondition' value='no' checked={preExistingmedicalcondition === 'no'} onChange={() => setPreExistingmedicalcondition('no')}/>
<span>No</span>
</div>
<label for="methods">Pre-existing medical condition :
<label class="gender-radio">
<input type="radio" name="gender" value="male"/> Yes
</label>
<label class="gender-radio">
<input type="radio" name="gender" value="female"/> No
</label>
</label>
<div className='btn-area'>
<div className='btn'>Predict</div>
</div>
<div className='input-group1'>
<h2>Predictions:</h2>
</div>
<button>Submit</button>
</form>
</div>
</div></div>
)
}
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