summaryrefslogtreecommitdiff
path: root/client/src/pages/Enrollment
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/pages/Enrollment')
-rw-r--r--client/src/pages/Enrollment/Address/Address.jsx97
-rw-r--r--client/src/pages/Enrollment/Enrollment.jsx50
2 files changed, 49 insertions, 98 deletions
diff --git a/client/src/pages/Enrollment/Address/Address.jsx b/client/src/pages/Enrollment/Address/Address.jsx
index 2e0fc6c..5324413 100644
--- a/client/src/pages/Enrollment/Address/Address.jsx
+++ b/client/src/pages/Enrollment/Address/Address.jsx
@@ -1,48 +1,14 @@
-import React, { useState, useEffect } from 'react'
+import React from 'react'
import Header from '../../../components/Header/Header'
import Input from '../../../components/Input/Input'
-import { Country, State, City } from 'country-state-city'
+import { State, City } from 'country-state-city'
import Select from 'react-select'
import styles from './Address.module.css'
import { useTranslation } from 'react-i18next'
const Address = ({ formData, setFormData }) => {
- const [tempData, setTempData] = useState({
- country: '',
- state: '',
- district: ''
- })
const { t } = useTranslation()
- const countries = Country.getAllCountries()
-
- useEffect(() => {
- setFormData({
- ...formData,
- address: {
- country: {
- name: tempData.country.label,
- code: tempData.country.isoCode
- },
- state: {
- name: tempData.state.label,
- code: tempData.state.isoCode
- },
- district: {
- name: tempData.district.label,
- code: tempData.district.isoCode
- }
- }
- })
- }, [tempData])
-
- console.log('Form Data: ', formData.address)
-
- const updatedCountries = countries.map((country) => ({
- label: country.name,
- value: country.id,
- ...country
- }))
const updatedStates = (countryId) =>
State.getStatesOfCountry(countryId).map((state) => ({
@@ -83,35 +49,19 @@ const Address = ({ formData, setFormData }) => {
<div className={styles.address__container}>
<div className={styles.input}>
<div className={styles.input__container}>
- <label htmlFor="country">{t('COUNTRY')}</label>
- <Select
- id="country"
- name="country"
- label="country"
- options={updatedCountries}
- value={tempData.country}
- onChange={(e) => {
- setTempData({
- ...tempData,
- country: e
- })
- }}
- styles={customStyles}
- />
- </div>
- </div>
- <div className={styles.input}>
- <div className={styles.input__container}>
<label htmlFor="state">{t('STATE')}</label>
<Select
id="state"
name="state"
- options={updatedStates(tempData.country.isoCode)}
- value={tempData.state}
+ options={updatedStates('IN')}
+ value={formData.address?.state}
onChange={(e) => {
- setTempData({
- ...tempData,
- state: e
+ setFormData({
+ ...formData,
+ address: {
+ ...formData.address,
+ state: e
+ }
})
}}
styles={customStyles}
@@ -124,15 +74,15 @@ const Address = ({ formData, setFormData }) => {
<Select
id="city"
name="city"
- options={updatedCities(
- tempData.country.isoCode,
- tempData.state.isoCode
- )}
- value={tempData.district}
+ options={updatedCities('IN', formData.address?.state?.isoCode)}
+ value={formData.address?.district}
onChange={(e) => {
- setTempData({
- ...tempData,
- district: e
+ setFormData({
+ ...formData,
+ address: {
+ ...formData.address,
+ district: e
+ }
})
}}
styles={customStyles}
@@ -147,7 +97,10 @@ const Address = ({ formData, setFormData }) => {
onChange={(e) => {
setFormData({
...formData,
- village: e.target.value
+ address: {
+ ...formData.address,
+ village: e.target.value
+ }
})
}}
placeholder={t('ENTER_YOUR_VILLAGE_TOWN')}
@@ -163,6 +116,7 @@ const Address = ({ formData, setFormData }) => {
setFormData({
...formData,
address: {
+ ...formData.address,
houseNo: e.target.value
}
})
@@ -178,6 +132,7 @@ const Address = ({ formData, setFormData }) => {
setFormData({
...formData,
address: {
+ ...formData.address,
street: e.target.value
}
})
@@ -193,6 +148,7 @@ const Address = ({ formData, setFormData }) => {
setFormData({
...formData,
address: {
+ ...formData.address,
locality: e.target.value
}
})
@@ -208,6 +164,7 @@ const Address = ({ formData, setFormData }) => {
setFormData({
...formData,
address: {
+ ...formData.address,
postOffice: e.target.value
}
})
@@ -225,6 +182,7 @@ const Address = ({ formData, setFormData }) => {
setFormData({
...formData,
address: {
+ ...formData.address,
landmark: e.target.value
}
})
@@ -240,6 +198,7 @@ const Address = ({ formData, setFormData }) => {
setFormData({
...formData,
address: {
+ ...formData.address,
pincode: e.target.value
}
})
diff --git a/client/src/pages/Enrollment/Enrollment.jsx b/client/src/pages/Enrollment/Enrollment.jsx
index 1a2aa03..c4f5b85 100644
--- a/client/src/pages/Enrollment/Enrollment.jsx
+++ b/client/src/pages/Enrollment/Enrollment.jsx
@@ -39,18 +39,8 @@ const Enrollment = () => {
locality: '',
landmark: '',
village: '',
- district: {
- name: '',
- code: ''
- },
- state: {
- name: '',
- code: ''
- },
- country: {
- name: '',
- code: ''
- },
+ district: {},
+ state: {},
postOffice: '',
pincode: ''
},
@@ -90,39 +80,41 @@ const Enrollment = () => {
setPage(page + 1)
}
} else if (page === 2) {
- if (formData.country === '') {
- toast.error(t('PLEASE_SELECT_YOUR_COUNTRY'))
- } else if (formData.state === '') {
+ if (formData.address.state.name === '') {
toast.error(t('PLEASE_SELECT_YOUR_STATE'))
- } else if (formData.district === '') {
+ } else if (formData.address.district.name === '') {
toast.error(t('PLEASE_SELECT_YOUR_DISTRICT'))
- } else if (formData.village === '') {
+ } else if (formData.address.village === '') {
toast.error(t('PLEASE_ENTER_YOUR_VILLAGE'))
- } else if (formData.houseNo === '') {
+ } else if (formData.address.houseNo === '') {
toast.error(t('PLEASE_ENTER_YOUR_HOUSE_NUMBER'))
- } else if (formData.street === '') {
+ } else if (formData.address.street === '') {
toast.error(t('PLEASE_ENTER_YOUR_STREET'))
- } else if (formData.locality === '') {
+ } else if (formData.address.locality === '') {
toast.error(t('PLEASE_ENTER_YOUR_LOCALITY'))
- } else if (formData.postOffice === '') {
+ } else if (formData.address.postOffice === '') {
toast.error(t('PLEASE_ENTER_YOUR_AREA_POST_OFFICE'))
- } else if (formData.landmark === '') {
+ } else if (formData.address.landmark === '') {
toast.error(t('PLEASE_ENTER_NEAREST_LANDMARK'))
- } else if (formData.pincode === '') {
+ } else if (formData.address.pincode === '') {
toast.error(t('PLEASE_ENTER_YOUR_AREA_PINCODE'))
- } else if (!validPincode.test(formData.pincode)) {
+ } else if (!validPincode.test(formData.address.pincode)) {
toast.error(t('PLEASE_ENTER_VALID_PINCODE'))
} else {
- setFormData({
- ...formData,
- address: `${formData.houseNo}, ${formData.street}, ${formData.locality}, ${formData.landmark}, ${formData.village}, ${formData.district.label}, ${formData.state.label}, ${formData.country.label}, ${formData.postOffice}, ${formData.pincode}`
- })
setPage(page + 1)
}
} else if (page === 3) {
setPage(page + 1)
} else if (page === 4) {
- setPage(page + 1)
+ if (formData.documents.POI === '') {
+ toast.error(t('PLEASE_TAKE_THE_PICTURE_OF_THE_PROOF_OF_IDENTITY'))
+ } else if (formData.documents.POA === '') {
+ toast.error(t('PLEASE_TAKE_THE_PICTURE_OF_THE_PROOF_OF_ADDRESS'))
+ } else if (formData.documents.DOB === '') {
+ toast.error(t('PLEASE_TAKE_THE_PICTURE_OF_THE_PROOF_OF_DATE_OF_BIRTH'))
+ } else {
+ setPage(page + 1)
+ }
} else if (page === 5) {
setPage(page + 1)
} else if (page === 6) {