diff --git a/src/Components/PatientForm/PersonalSection1.tsx b/src/Components/PatientForm/PersonalSection1.tsx index c4c4f28..52c393d 100644 --- a/src/Components/PatientForm/PersonalSection1.tsx +++ b/src/Components/PatientForm/PersonalSection1.tsx @@ -147,44 +147,49 @@ export default function PersonalSection({ className='collapsable-form-style' > { - setPatient((prevValues: any) => ({ - ...prevValues, - cellPhone: e.target.value, - })); - }} - onBlur={(e) => { - if (!/^\d{10}$/.test(e.target.value)) { - setPatient((prevValues: any) => ({ - ...prevValues, - cellPhoneError: true, - })); - } else { - setPatient((prevValues: any) => ({ - ...prevValues, - cellPhoneError: false, - })); + required + variant='outlined' + label='Phone Number' + name='cellPhone' + type='number' + placeholder='Please enter your cell Phone number' + value={ + type == 'display' + ? patientDataDiplay.cellPhone + : patient.cellPhone } - }} - error={patient.cellPhoneError} - helperText={ - patient.cellPhoneError - ? 'Please enter a valid 10-digit phone number' - : '' - } - /> + disabled={type == 'display'} + onChange={(e) => { + let value = e.target.value; + if (value[0] === '0') { + value = value.slice(1); + } + setPatient((prevValues: any) => ({ + ...prevValues, + cellPhone: value, + })); + }} + onBlur={(e) => { + if (!/^\d{10}$/.test(e.target.value)) { + setPatient((prevValues: any) => ({ + ...prevValues, + cellPhoneError: true, + })); + } else { + setPatient((prevValues: any) => ({ + ...prevValues, + cellPhoneError: false, + })); + } + }} + error={patient.cellPhoneError} + helperText={ + patient.cellPhoneError + ? 'Please enter a valid 10-digit phone number' + : '' + } + /> +