form 7 textfields

This commit is contained in:
sonika 2023-08-27 20:38:14 +05:30
parent 6af50c495e
commit 04a1a2b8be
2 changed files with 142 additions and 9 deletions

View File

@ -10,6 +10,12 @@
height: 50px
}
.collapsable-form-style-form7 .MuiInputBase-root {
width: 400px !important;
margin: 5%;
height: 50px
}
.collapsable-form-style-multiline .MuiInputBase-root {
width: 400px !important;
margin: 5%;
@ -23,6 +29,10 @@
padding: 15px;
}
.collapsable-form-style-form7 label {
padding: 20px;
}
.collapsable-form-style-radioButtons{
width: 300px !important;
margin: 5%;

View File

@ -5,13 +5,21 @@ interface FormValues {
hobbies: string;
educationLevel: string;
excercise: string;
excerciseExplanation: string;
tobacco: string;
tobaccoExplanation: string;
alcohol: string;
alcoholExplanation: string;
healthyDiet: string;
healthyDietExplanation: string;
sleep: string;
sleepExplanation: string;
workSchool: string;
workSchoolExplanation: string;
familyLife: string;
familyLifeExplanation: string;
drugs: string;
drugsExplanation:string;
}
export default function RecreationalHobbiesSection7(){
@ -19,19 +27,25 @@ export default function RecreationalHobbiesSection7(){
hobbies: '',
educationLevel: '',
excercise:'',
excerciseExplanation:'',
tobacco: '',
tobaccoExplanation:'',
alcohol: '',
alcoholExplanation:'',
healthyDiet: '',
healthyDietExplanation:'',
sleep: '',
sleepExplanation: '',
workSchool: '',
workSchoolExplanation:'',
familyLife: '',
familyLifeExplanation:'',
drugs: '',
drugsExplanation:''
});
return(
<>
{/* <Grid item xs={12} className='collapsable-form-style'>
<FormLabel sx={{fontWeight:600}}>Please choose body areas or systems where you may have problems:</FormLabel>
</Grid> */}
<Grid container direction="row">
<Grid item xs={6} className='collapsable-form-style-multiline'>
<FormLabel>Recreational Activities/Hobbies:</FormLabel>
@ -69,6 +83,7 @@ export default function RecreationalHobbiesSection7(){
</RadioGroup>
</FormControl>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>Do you excercise?</FormLabel>
@ -88,6 +103,20 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="Times per week?"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
excerciseExplanation: event.target.value,
}));
}}
/>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>Use tobacco?</FormLabel>
@ -107,6 +136,20 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="Packs/Cans per day(If you have quit, when did you quit?)"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
excerciseExplanation: event.target.value,
}));
}}
/>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>Consume alcohol?</FormLabel>
@ -126,6 +169,20 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="How many drinks per week?"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
alcoholExplanation: event.target.value,
}));
}}
/>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>Have a healthy diet?</FormLabel>
@ -145,6 +202,20 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="If no, explain"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
healthyDietExplanation: event.target.value,
}));
}}
/>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>Get adequate sleep?</FormLabel>
@ -164,6 +235,20 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="If no, explain"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
sleepExplanation: event.target.value,
}));
}}
/>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>Is Work/School stressful to you?</FormLabel>
@ -183,6 +268,20 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="If yes, explain"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
workSchool: event.target.value,
}));
}}
/>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>Family life stressful to you?</FormLabel>
@ -202,9 +301,23 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="If yes, explain"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
familyLifeExplanation: event.target.value,
}));
}}
/>
</Grid>
<Grid item xs={12} className='collapsable-form-style-radioButtons'>
<FormControl>
<FormLabel>use recreational drugs?</FormLabel>
<FormLabel>Use recreational drugs?</FormLabel>
<RadioGroup
name="painDuration"
sx={{display:'flex', flexDirection:'row'}}
@ -221,9 +334,19 @@ export default function RecreationalHobbiesSection7(){
</FormControl>
</Grid>
<Grid item xs={6} className='collapsable-form-style-form7'>
<TextField
variant="outlined"
label="If yes, explain"
name='treatmentGoal'
onChange={(event) => {
setValues((prevValues) => ({
...prevValues,
drugsExplanation: event.target.value,
}));
}}
/>
</Grid>
</Grid>
</>
)