section 2 display changes

This commit is contained in:
sonika 2023-09-05 18:24:52 +05:30
parent a72be1748f
commit c410fbbd95
3 changed files with 39 additions and 53 deletions

View File

@ -19,21 +19,6 @@ interface Patient {
spousePhone: string | undefined, spousePhone: string | undefined,
} }
const validationSchema = yup.object({
maritalStatus:yup.string().required("Marital Status is required"),
numberOfChildren:yup.string().required("Full name is required"),
occupation:yup.string().required("Occupation is required"),
// hoursPerWeek: yup.number().required('Required'),
// employer:yup.string().required("Full name is required"),
// businessPhone:yup.string().required("Full name is required"),
spouseName:yup.string().required("Spouse name is required"),
// spouseEmployer:yup.string().required("Full name is required"),
// spouseBusinessPhone:yup.string().required("Full name is required"),
emergencyContact:yup.string().matches(/^\d{10}$/, "Cell phone must be 10 digits"),
relationship:yup.string().required("Relationship is required"),
spousePhone:yup.string().matches(/^\d{10}$/, "Cell phone must be 10 digits"),
});
type Props = { type Props = {
handleFormSection2Data:( handleFormSection2Data:(
maritalStatus: string | undefined, maritalStatus: string | undefined,
@ -49,10 +34,12 @@ type Props = {
relationship: string | undefined, relationship: string | undefined,
spousePhone: string | undefined, spousePhone: string | undefined,
)=> void )=> void
patientDataDiplay:any;
type:string;
} }
export default function FamilyFormSection({handleFormSection2Data}:Props){ export default function FamilyFormSection({handleFormSection2Data,patientDataDiplay,type}:Props){
const [patient, setPatient] = React.useState<Patient>({ const [patient, setPatient] = React.useState<Patient>({
maritalStatus:'', maritalStatus:'',
numberOfChildren:'', numberOfChildren:'',
@ -85,6 +72,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
) )
},[patient]) },[patient])
console.log(type,"sfsdfsdfsd")
return( return(
<> <>
<Grid container direction="row"> <Grid container direction="row">
@ -93,9 +82,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
<FormLabel>Marital Status</FormLabel> <FormLabel>Marital Status</FormLabel>
<RadioGroup <RadioGroup
aria-labelledby="demo-radio-buttons-group-label" aria-labelledby="demo-radio-buttons-group-label"
defaultValue="married"
name="maritalStatus" name="maritalStatus"
value={patient.maritalStatus} defaultValue={type=='display'?patientDataDiplay.maritalStatus:patient.maritalStatus}
sx={{display:'flex', flexDirection:'row'}} sx={{display:'flex', flexDirection:'row'}}
onChange={(e)=>{ onChange={(e)=>{
setPatient((prevValues:any) => ({ setPatient((prevValues:any) => ({
@ -103,14 +91,12 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
maritalStatus: e.target.value, maritalStatus: e.target.value,
})); }));
}} }}
// error={formik.touched.numberOfChildren && Boolean(formik.errors.maritalStatus)}
// helperText={formik.touched.numberOfChildren && formik.errors.maritalStatus}
> >
<FormControlLabel value="married" control={<Radio />} label="Married" /> <FormControlLabel value="married" control={<Radio />} label="Married" disabled={type=='display'}/>
<FormControlLabel value="single" control={<Radio />} label="Single" /> <FormControlLabel value="single" control={<Radio />} label="Single" disabled={type=='display'}/>
<FormControlLabel value="widowed" control={<Radio />} label="Widowed" /> <FormControlLabel value="widowed" control={<Radio />} label="Widowed" disabled={type=='display'}/>
<FormControlLabel value="seperated" control={<Radio />} label="Seperated" /> <FormControlLabel value="seperated" control={<Radio />} label="Seperated" disabled={type=='display'}/>
<FormControlLabel value="divorced" control={<Radio />} label="Divorced" /> <FormControlLabel value="divorced" control={<Radio />} label="Divorced" disabled={type=='display'}/>
</RadioGroup> </RadioGroup>
</FormControl> </FormControl>
@ -131,10 +117,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
numberOfChildren: e.target.value, numberOfChildren: e.target.value,
})); }));
}} }}
value={patient.numberOfChildren} value={type=='display'?patientDataDiplay.numberOfChildren:patient.numberOfChildren}
// onBlur={formik.handleBlur} disabled={type=='display'}
// error={formik.touched.numberOfChildren && Boolean(formik.errors.numberOfChildren)}
// helperText={formik.touched.numberOfChildren && formik.errors.numberOfChildren}
/> />
</Grid> </Grid>
<Grid item xs={4} className='collapsable-form-style '> <Grid item xs={4} className='collapsable-form-style '>
@ -150,10 +134,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
occupation: e.target.value, occupation: e.target.value,
})); }));
}} }}
value={patient.occupation} value={type=='display'?patientDataDiplay.occupation:patient.occupation}
// onBlur={formik.handleBlur} disabled={type=='display'}
// error={formik.touched.occupation && Boolean(formik.errors.occupation)}
// helperText={formik.touched.occupation && formik.errors.occupation}
/> />
</Grid> </Grid>
@ -170,8 +152,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
hoursPerWeek: e.target.value, hoursPerWeek: e.target.value,
})); }));
}} }}
value={patient.hoursPerWeek} value={type=='display'?patientDataDiplay.hoursPerWeek:patient.hoursPerWeek}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
@ -187,8 +169,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
employer: e.target.value, employer: e.target.value,
})); }));
}} }}
value={patient.employer} value={type=='display'?patientDataDiplay.employer:patient.employer}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
<Grid item xs={4} className='collapsable-form-style '> <Grid item xs={4} className='collapsable-form-style '>
@ -204,8 +186,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
businessPhone: e.target.value, businessPhone: e.target.value,
})); }));
}} }}
value={patient.businessPhone} value={type=='display'?patientDataDiplay.businessPhone:patient.businessPhone}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
@ -227,8 +209,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
spouseName: e.target.value, spouseName: e.target.value,
})); }));
}} }}
value={patient.spouseName} value={type=='display'?patientDataDiplay.spouseName:patient.spouseName}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
<Grid item xs={4} className='collapsable-form-style '> <Grid item xs={4} className='collapsable-form-style '>
@ -243,8 +225,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
spouseEmployer: e.target.value, spouseEmployer: e.target.value,
})); }));
}} }}
value={patient.spouseEmployer} value={type=='display'?patientDataDiplay.spouseEmployer:patient.spouseEmployer}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
<Grid item xs={4} className='collapsable-form-style '> <Grid item xs={4} className='collapsable-form-style '>
@ -260,8 +242,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
spouseBusinessPhone: e.target.value, spouseBusinessPhone: e.target.value,
})); }));
}} }}
value={patient.spouseBusinessPhone} value={type=='display'?patientDataDiplay.spouseBusinessPhone:patient.spouseBusinessPhone}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
@ -282,8 +264,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
emergencyContact: e.target.value, emergencyContact: e.target.value,
})); }));
}} }}
value={patient.emergencyContact} value={type=='display'?patientDataDiplay.emergencyContact:patient.emergencyContact}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
<Grid item xs={4} className='collapsable-form-style '> <Grid item xs={4} className='collapsable-form-style '>
@ -298,8 +280,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
relationship: e.target.value, relationship: e.target.value,
})); }));
}} }}
value={patient.relationship} value={type=='display'?patientDataDiplay.relationship:patient.relationship}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
<Grid item xs={4} className='collapsable-form-style '> <Grid item xs={4} className='collapsable-form-style '>
@ -315,8 +297,8 @@ export default function FamilyFormSection({handleFormSection2Data}:Props){
spousePhone: e.target.value, spousePhone: e.target.value,
})); }));
}} }}
value={patient.spousePhone} value={type=='display'?patientDataDiplay.spousePhone:patient.spousePhone}
// onBlur={formik.handleBlur} disabled={type=='display'}
/> />
</Grid> </Grid>
</Grid> </Grid>

View File

@ -404,7 +404,11 @@ export default function PatientForm({type}:Props){
</AccordionSummary> </AccordionSummary>
<AccordionDetails> <AccordionDetails>
<FamilyFormSection handleFormSection2Data={handleFormSection2Data}/> <FamilyFormSection
handleFormSection2Data={handleFormSection2Data}
patientDataDiplay={patientData.familyInformation}
type={type}
/>
</AccordionDetails> </AccordionDetails>
</Accordion> </Accordion>

View File

@ -75,7 +75,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
) )
},[patient]) },[patient])
console.log(type,"sfsdfsdfsd")
return( return(
<> <>