{this.props.name}
\n {this.props.aum}
\n \n );\n }\n}\n","import React, { Component } from \"react\";\n\nexport default class TabHeader extends Component {\n render() {\n return (\n \n \n
\n {!!navData.length ? (\n \n \n \n \n \n \n
\n ) : (\n \n \n
\n
\n )}\n \n
\n \n \n {this.props.uptext}\n
\n )}\n {this.props.name} {this?.props?.isMandatory?*:null}
\n {this.props.uptext && (\n \n
\n {!!this.props.errorMessage && (\n \n \n \n {!!this.props.errorMessage ? this.props.errorMessage : \"\"}\n
\n \n \n );\n }\n}\n\nIntegrationReactSelect.propTypes = {\n classes: PropTypes.object.isRequired,\n theme: PropTypes.object.isRequired,\n};\n\nexport default withStyles(styles, { withTheme: true })(IntegrationReactSelect);\n","import React, { Component } from \"react\";\nimport { BUILD_URL } from \"../home/home\";\nimport { fontFamily } from \"@material-ui/system\";\n\nexport class Input extends Component {\n render() {\n const {\n name,\n image,\n image2,\n height,\n placeholder,\n isShowError,\n inputref,\n label,\n bordercolor,\n isShowPasswordError,\n onClick,\n type,\n errorMessage,\n ...rest\n } = this.props;\n return (\n \n \n {/* {!!image && (\n
\n \n {name} {label} {this?.props?.isMandatory?*:null}{\" \"}\n
\n \n {!!image2 && (\n 
\n )}\n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\n\nexport default class Signbutton extends Component {\n render() {\n return (\n\n \n \n {this.props.buttontitle}\n \n
\n );\n }\n}\n\nexport class DebtbuttonActive extends Component {\n render() {\n return (\n \n \n {this.props.buttontitle}\n \n
\n );\n }\n}\n\nexport class DebtbuttonNowidth extends Component {\n render() {\n return (\n \n \n {this.props.buttontitle}\n \n
\n );\n }\n}\n","import { CALL_API } from \"../api.middleware\";\nimport { GET_PROFILE_DATA, GET_PROFILE_DATA_SUCCESS, GET_PROFILE_DATA_FAILED } from \"../types/profile\";\nexport const getProfileData = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetDistributorDetails\",\n params,\n method: \"GET\",\n types: [GET_PROFILE_DATA, GET_PROFILE_DATA_SUCCESS, GET_PROFILE_DATA_FAILED],\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const resetPassword = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetChangePassword\",\n params,\n method: \"GET\",\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};","import { CALL_API } from \"../api.middleware\";\nexport const getDistFoliobyPan = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetDistFoliobyPan\",\n params,\n method: \"GET\"\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getAccountStatement = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetAccountStatement\",\n params,\n method: \"GET\"\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getMailbackSoaStatus = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/SOAMailBackReport\",\n params,\n method: \"GET\"\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getMailbackList = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetDistMailbackList\",\n params,\n method: \"GET\",\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const GetDistMailbackRequest = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetDistMailbackRequest\",\n params,\n method: \"GET\",\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getElssStatment = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/SaveElssReport\",\n params,\n method: \"GET\",\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getcaptialgainStatment = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/CapitalGainsByEmailID\",\n params,\n method: \"GET\",\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getNetworthPortfolio = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/Ktrack_NetWorthPortfolio\",\n params,\n method: \"GET\",\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getMailBackRequestStatus = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetMailBackRequestStatus\",\n params,\n method: \"GET\",\n v\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};","export const firstLetterCaptilize = text => {\n return text.charAt(0).toUpperCase() + text.slice(1).toLowerCase();\n};\n\nexport const firstLetterOnlyCaptilize = text => {\n return text.charAt(0).toUpperCase() + text.slice(1);\n};\n\nexport const captalize = text => {\n return text.toUpperCase();\n};\n\nexport const formatDate = date => {\n return `${checkZero(date.getDate())}/${checkZero(\n date.getMonth() + 1\n )}/${date.getFullYear()}`;\n};\nconst checkZero = data => {\n return data.length == 1 ? `0${data}` : data;\n};\n","import React from \"react\";\n\nconst BUILD_URL = process.env.PUBLIC_URL;\nexport default function Image({ src, ...props }) {\n return \n \n {this.props.response}\n
\n ) : (\n \"\"\n )}\n \n \n
\n Successfully raised a query
\n {!!this.props.response ? (\n \n
\n \n \n \n \n Change Password\n
\n \n \n \n this.submit()}\n />\n
\n \n \n this.onBlurInput(value, \"oldPassword\")}\n height={18}\n image2={\n !!this.state.showOldPassword &&\n !this.state.showOldPassword.value\n ? EYE_ICON\n : EYE_ICON_HIDDEN\n }\n onClick={() => {\n this.setState({\n showOldPassword: !this.state.showOldPassword,\n });\n }}\n isShowError={this.state.oldPassword.isShowError}\n errorMessage={this.state.oldPassword.errorMessage}\n />\n
\n \n this.onBlurInput(value, \"newPassword\")}\n onClick={() => {\n this.setState({\n showPassword: !this.state.showPassword,\n });\n }}\n isShowError={this.state.newPassword.isShowError}\n isShowPasswordError={\n this.state.newPassword.isShowPasswordError\n }\n errorMessage={this.state.newPassword.errorMessage}\n />\n
\n \n {\n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n });\n }}\n value={this.state.confirmPassword.value}\n onChange={this.onChangeInput(\"confirmPassword\")}\n onBlur={(eve) => this.onBlurInput(eve, \"confirmPassword\")}\n isShowError={this.state.confirmPassword.isShowError}\n isShowPasswordError={\n this.state.confirmPassword.isShowPasswordError\n }\n errorMessage={this.state.confirmPassword.errorMessage}\n />\n
\n \n
\n\n \n \n Services\n
\n \n
\n \n \n Forms\n
\n \n
\n \n\n \n \n Downloads\n
\n \n
\n \n \n \n \n \n MailBack Request Status\n \n \n \n \n this.onDateChange(e)}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n maxDate={new Date()}\n id=\"mui-pickers-date\"\n value={this.state.date}\n />\n \n
\n \n
\n \n \n \n );\n }\n}\n\nexport class PosterDialog extends Component {\n render() {\n return (\n <>\n \n \n \n {/* \n window.open(\"https://bit.ly/49yOZfT\")\n }\n /> */}\n \n
\n \n \n \n \n );\n }\n}\n\nexport const MBRStatusDialog = connect(null, { getMailBackRequestStatus })(\n MailBacKRequestStatusPopUp\n);\n\nexport class NonLoginServices extends Component {\n render() {\n return (\n \n
\n \n Important Regulatory Update on KYC Status\n
\n\n As per the Master Circular issued by SEBI on KYC requirements,\n Investors with ‘KYC Registered’ status are requested to do their KYC again to become ‘KYC Validated’ by visiting {\" \"}\n https://mfs.kfintech.com/Investor/General/ValidateKYC/
\n Click here to know more about the circular.\n
\n \n Click here to know more about the circular.\n
\n \n \n \n {!!this.props.message\n ? this.props.message\n : \"This Client is not KYC compliant, do you want to go for KYC\"}\n
\n \n \n
\n \n \n \n );\n }\n}\n\nexport default class CustomizedDialogs extends React.Component {\n render() {\n return ( \n \n
\n \n
\n \n \n \n \n {!!this.props.passwordSucess\n ? this.props.message || \"Password Changed Successfully\"\n : !!this.props.Gas\n ? \"Your request has been successfully submitted\"\n : \"Your request has been successfully submitted\"}\n \n {this.props.cas === true || this.props.Gas === true\n ? \"Investor will receive an email shortly.\"\n : \"\"}\n
\n \n ) : (this.props.componentName === \"MailBacKRequest\" &&\n this.props.refNo) ||\n (this.props.componentName === \"SWP\" && this.props.refNo) ||\n (this.props.componentName === \"REDEMPTION\" &&\n this.props.refNo) ? (\n \n
\n {this.props.nfoFunds === true ? (\n \n
\n ) : this.props.cas === true ||\n this.props.Gas === true ||\n this.props.componentName === \"MailBackSoa\" ||\n this.props.passwordSucess ? (\n \n The transaction for NFO has been initiated\n Successfully.\n
\n \n Link for {this.props.scheme} scheme is\n generated\n
\n \n {!!this.props.componentName &&\n (this.props.componentName === \"REDEMPTION\" ||\n this.props.componentName === \"SWP\") ? (\n
\n \n ) : (\n \n Transaction Successful\n
\n ) : (\n \"\"\n )}\n \n
\n \n {!!this.props.componentName &&\n (this.props.componentName === \"REDEMPTION\" ||\n this.props.componentName === \"SWP\") ? (\n \n Your request is successfully registered with reference \n number\n \n {this.props.refNo}\n \n .Your investor will receive an email for approval. You will also receive a copy of the same mail for your information and records.\n \n
\n \n The transaction for{\" \"}\n {this.props.componentName} has been\n initiated successfully.\n
\n ) : (\n \"\"\n )}\n \n
\n )}\n\n {!!this.props.Transaction && (\n \n {this.props.componentName === \"Sip cancellation\" ||\n this.props.componentName === \"SWP cancellation\" ||\n this.props.componentName === \"STP cancellation\"\n ? `Successfully Cancelled ${this.props.componentName}`\n : this.props.componentName === \"Sip Pause\"\n ? `Successfully Sip Transaction has been paused`\n : `Transaction Successful`}\n
\n\n {this.props.type === \"STP\" || this.props.type === \"SWITCH\" ? (\n \n
\n ) : (\n \n The transaction for {this.props.type} has\n been initiated successfully.\n
\n \n You have initiated the transaction successfully with\n reference number:\n \n {this.props.refNo}\n \n .Your investor will receive an email for approval. You will also receive a copy of the same mail for your information and records.\n
\n \n {!!this.props.reqtype ? (\n
\n )}\n \n the transaction for{\" \"}\n {this.props.reqtype} with the IHNO : $\n {this.props.Nctihno} has been initiated successfully\n
\n ) : (\n this.props.componentName !== \"Sip cancellation\" ||\n this.props.componentName !== \"SWP cancellation\" ||\n this.props.componentName !== \"STP cancellation\" ||\n (this.props.componentName !== \"Sip Pause\" && (\n \n The transaction for{\" \"}\n\n {!!this.props.refrence\n ? this.props.refrence.new_type\n : \"\"}\n {!!this.props.refNo ? \"SIP\" : \"\"}\n {\" \"}\n has been initiated successfully.\n
\n ))\n )}\n {!!this.props.reqtype ? (\n \n Your investor will receive the details via an email and\n SMS\n
\n ) : this.props.componentName === \"Sip cancellation\" ||\n this.props.componentName === \"SWP cancellation\" ||\n this.props.componentName === \"STP cancellation\" ? (\n \n the transaction for{\" \"}\n {this.props.componentName} with the\n Ihno {this.props.refNo.value} has been\n successful.\n
\n ) : this.props.componentName === \"Sip Pause\" ? (\n this.props.refNo.errorMessage\n ) : (\n \n
\n )}\n \n the transaction for{\" \"}\n {this.props.transactName} has been\n initiated successfully.\n
\n \n Your investor will receive the details via an email\n and SMS with reference number\n \n {!!this.props.refrence\n ? this.props.refrence.value\n : \"\"}\n {!!this.props.refNo ? this.props.refNo : \"\"}\n \n
\n \n {!!this.props.Transaction ? (\n \n
\n ) : (\n \n
\n ) : this.props.cas === true && !this.props.componentName ? (\n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n )\n\n }\n \n );\n }\n}\n\n\n\nexport class EnachModal extends Component {\n render() {\n return (\n \n
\n \n
\n \n
\n \n
\n \n
\n {/* \n
*/}\n \n \n eNACH Participating AMCs{\" \"}\n
\n \n \n Transaction Details\n
\n \n \n {!!data && !!data[0] ? data[0].Units : \"\"}\n
\n \n \n \n Units\n
\n \n \n Price (NAV)\n
\n \n \n {!!data && !!data[0] ? data[0].NavDate : \"\"}\n
\n \n \n \n Nav Date\n
\n \n \n Folio Number\n
\n \n
\n \n \n Transaction Completion\n
\n \n
\n \n \n
\n \n \n
\n Payment Confirmation
\n \n {!!data && !!data[0] ? data[0].PaymentDate : \"\"}\n
\n \n Via {!!data && !!data[0] ? data[0].MFPaymentMode : \"-\"}\n
\n \n \n
\n \n Units Allotment
\n \n
\n \n
\n\n );\n};\nexport class TopUPDiscalmierDialog extends Component {\n render() {\n const { data } = this.props\n const mandateText = data.Enachflag === 2 || data.Enachflag === 1 ? \"Mandate\" : \"\";\n const registrationNumber = data.Enachflag === 2 || data.Enachflag === 1 ? \"(UMRN)\" : \"(URN)\";\n const result = `${mandateText} Registration Number ${registrationNumber}`;\n\n return (\n <>\n Cancellation Reasons
\n {props.rejectionReasons.map((reason) => (\n\n
\n \n ))}\n {\n !!props.reasonMandatory && *Rejection reason is mandatory\n }\n \n Selected Reason: {props.selectedReason}
\n {props.selectedReason.includes(\"Others\") && (\n\n
\n )}\n\n \n \n \n
\n \n \n \n {/* \n
\n \n\n
\n \n Please note that you have opted/registered for the top-up in the existing iSIP for the Unique {result}\n {data?.Urnno}\n
\n\n\n Further, the first debit will only happen on the selected iSIP start date as selected at the time of the registration process.\n
\n\n\n The overall registration process of the top-up iSIP may take up to 10 days.\n
\n\n \n Proceed\n \n
\n \n \n \n window.open(\"https://bit.ly/4aNSr7h\")}\n />\n \n
\n \n \n */}\n \n );\n }\n}\nexport class MandateRegistrationDialog extends React.Component {\n render() {\n return (\n \n \n \n \n {`There is no mandate available for the selected Mode of Registration. Please click \"Register New Mandate\" to initiate a new mandate registration, or close this message to proceed with an alternative Mode of Registration`}\n
\n \n \n
\n \n\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport Paper from \"@material-ui/core/Paper\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport SearchIcon from \"@material-ui/icons/Search\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport InputBase from \"@material-ui/core/InputBase\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport { connect } from \"react-redux\";\nimport { REQ_BY } from \"shared/store/types\";\nimport {\n searchInvestors,\n getInvestors,\n getInvestorDetails,\n checkKyc,\n clearingFirstTimeInvestorJourney,\n userPan,\n} from \"shared/store/actions\";\nimport { KycNotDoneDialog } from \"./customModal\";\n\nexport const NEW_TRANSACTION_URL = `${process.env.PUBLIC_URL}/investors`;\nclass Search extends Component {\n constructor(props) {\n super(props);\n const { tran_enable_flag } = this.props;\n this.state = {\n radioValue: tran_enable_flag === \"Y\" ? \"pan\" : \"pan\",\n inputValue: \"\",\n errorMessage: \"\",\n };\n }\n\n componentDidUpdate(prevProps, prevState) {\n const { inputValue } = prevState;\n if (!this.state.inputValue && !!inputValue) {\n this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\n });\n }\n }\n\n handleChange = (event) => {\n this.setState({\n radioValue: event.target.value,\n inputValue: \"\",\n errorMessage: \"\",\n });\n };\n\n changeInput = (event) => {\n const inputValue = event.target.value;\n if (inputValue === \"\") {\n this.setState({\n errorMessage: \"\",\n });\n }\n this.setState({\n inputValue:\n this.state.radioValue === \"pan\"\n ? inputValue.toUpperCase()\n : this.state.radioValue === \"mobile\" && inputValue.length > 10\n ? this.state.inputValue\n : inputValue,\n });\n // if (this.state.radioValue === \"name\" && inputValue.length >= 4) {\n // this.search();\n // }\n };\n\n keyPress = (e) => {\n if (e.key === \"Enter\") {\n this.search();\n e.preventDefault();\n }\n };\n\n search = async () => {\n const { inputValue, radioValue } = this.state;\n const regpan = /^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/;\n if (\n radioValue === \"pan\" &&\n (/[A-Za-z]{5}\\d{4}[A-Za-z]{1}/.test(inputValue) === false ||\n inputValue === \"\")\n ) {\n this.setState({\n errorMessage: \"(Please enter a Valid PAN)\",\n });\n } else if (radioValue === \"name\" && !inputValue) {\n this.setState({\n errorMessage: \"(Please enter a Valid name)\",\n });\n } else if (radioValue === \"folio\" && !inputValue) {\n this.setState({\n errorMessage: \"(Please enter a Valid Folio)\",\n });\n } else if (\n radioValue === \"mobile\" &&\n (/^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[6-9]\\d{9}$/.test(inputValue) ===\n false ||\n inputValue === \"\")\n ) {\n this.setState({\n errorMessage: \"(Please enter a Valid Mobile Number)\",\n });\n } else if (\n radioValue === \"email\" &&\n (/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(inputValue) ===\n false ||\n inputValue === \"\")\n ) {\n this.setState({\n errorMessage: \"Please enter an Valid Email ID\",\n });\n } else {\n if (!!this.state.inputValue) {\n const parameters = {\n [this.state.radioValue]:\n this.state.radioValue === \"pan\"\n ? this.state.inputValue.toUpperCase()\n : this.state.inputValue,\n agent: this.props.token,\n uid: this.props.userId,\n };\n const response = await this.props.searchInvestors(parameters, true);\n if(!response && !!response.error){\n this.setState({\n\n })\n return;\n }\n if (!response && this.state.radioValue === \"pan\") {\n const regpan = /^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/;\n if (!this.state.inputValue || !regpan.test(this.state.inputValue)) {\n this.setState({ errorMessage: \"Please enter valid PAN\" });\n } else if (this.state.inputValue.charAt(3) !== \"P\") {\n this.setState({\n errorMessage: \"Non Individual PAN is not allowed to transact\",\n });\n }\n } \n if(!response && !response.error) {\n this.setState({\n errorMessage: \"\",\n });\n const params = {\n Uid: this.props.userId,\n ReqBy: REQ_BY,\n PAN:\n this.state.radioValue === \"pan\"\n ? this.state.inputValue.toUpperCase()\n : !!response &&\n !!response.Dtdata &&\n !!response.Dtdata[0] &&\n !!response.Dtdata[0].Pan\n ? response.Dtdata[0].Pan\n : this.state.inputValue,\n };\n\n const response = await this.props.getInvestorDetails(\n params,\n true\n );\nconsole.log(\"response\",response)\n if (!!response && !response.error\n ) {\n this.setState({\n errorMessage: \"\",\n });\n // this.props.history.push({\n // pathname: NEW_TRANSACTION_URL + \"/transction-types\",\n // pan: this.state.inputValue\n // });\n } else {\n const kycResponse = await this.props.checkKyc(\n {\n fund: \"105\",\n userid: this.props.userId,\n i_pan: this.state.inputValue,\n },\n true\n );\n\n console.log(kycResponse, 'KYC res')\n\n const {\n DtData: [info],\n } = kycResponse;\n if (info.KYCBlock === \"N\") {\n await this.props.clearingFirstTimeInvestorJourney();\n await this.props.userPan(this.state.inputValue);\n this.props.history.push({\n pathname: NEW_TRANSACTION_URL + \"/transction-types\",\n state: {\n pan: !!this.state.inputValue ? this.state.inputValue : \"\",\n },\n });\n } else {\n this.setState({ openModal: true });\n }\n }\n }\n }\n }\n };\n closeModal = () => {\n this.setState({\n openModal: false,\n });\n };\n\n continue = () => {\n this.closeModal();\n this.props.history.push({\n pathname:\n NEW_TRANSACTION_URL + `/new-investor/ekyc/${this.state.inputValue}`,\n });\n };\n\n render() {\n const { count } = this.props;\n\n return (\n \n {count === 0 && (\n \n
\n \n \n \n \n \n
\n Search by :
\n \n
\n\n Name
\n \n
\n PAN
\n \n
\n Folio No.
\n \n
\n Mobile
\n \n
\n \n Email ID
\n \n
\n \n )}\n {!!this.state.errorMessage ? (\n \n (this.InputField = ele)}\n onChange={this.changeInput}\n onKeyPress={this.keyPress}\n onKeyDown={(evt) =>\n evt.key === \"e\" &&\n (this.state.radioValue === \"mobile\" ||\n this.state.radioValue === \"folio\") &&\n evt.preventDefault()\n }\n />\n
\n \n Search\n
\n \n {index === 0 && (\n \n {breadcrumbNameMap[to].title === \"New Purchase\"\n ? \"New Folio Purchase\"\n : breadcrumbNameMap[to].title}\n \n )}\n
\n );\n })}\n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport Search from \"../searchComponent\";\nimport { ALL, FAVOURITE, RECENT } from \"shared/store/types\";\nimport TableData from \"../tableData\";\nimport { connect } from \"react-redux\";\nimport { getInvestors, storeType } from \"shared/store/actions\";\nimport TabHeader from \"../../forms/tabHeader\";\n\nclass InvestorData extends Component {\n constructor(props) {\n super(props);\n this.state = {\n activeTab: ALL,\n activeText: \"All\"\n };\n }\n\n async componentDidMount() {\n const response = await this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: ALL\n });\n }\n\n selectTab = tabName => async () => {\n this.props.storeType(tabName);\n this.setState({\n activeTab: tabName,\n activeText:\n tabName === ALL ? \"All\" : tabName === RECENT ? \"Recent\" : \"Favourite\"\n });\n\n await this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: tabName\n });\n };\n\n render() {\n const { activeTab } = this.state;\n return (\n \n {breadcrumbNameMap[to].title === \"New Purchase\"\n ? \"New Folio Purchase\"\n : breadcrumbNameMap[to].title}\n
\n ) : (\n \n \n \n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nvar CurrencyFormat = require(\"react-currency-format\");\nexport class FormatCurrency extends Component {\n render() {\n return (\n Investors
\n \n {this.props.active === INVESTMENTS &&\n investments.length > 0 &&\n investments.slice(0, this.props.count).map((investment, index) => (\n \n \n ))}\n\n {this.props.active !== INVESTMENTS && !!upComingSipDetails.length\n ? upComingSipDetails.slice(0, this.props.count).map((sip, index) => (\n \n \n ))\n : this.props.active !== INVESTMENTS && (\n \n No Upcoming Sips\n
\n )}\n \n );\n }\n}\n\nexport default connect(({ investor }) => {\n const { investments, upComingSipDetails } = investor;\n return { investments, upComingSipDetails };\n})(Investments);\n","import React, { PureComponent } from \"react\";\nimport { PieChart, Pie, Cell, Sector } from \"recharts\";\nimport { FormatCurrency } from \"../../home/currencyFormatter\";\n\nconst data = [\n { name: \"Group A\", value: 400 },\n { name: \"Group B\", value: 300 },\n { name: \"Group C\", value: 300 },\n { name: \"Group D\", value: 200 },\n];\nconst COLORS = [\"#AEC1E5\",\"#17469E\",\"#6390E4\",\"#35DFDF\"];\n\nconst renderActiveShape = (name) => (props) => {\n // const RADIAN = Math.PI / 180;\n const {\n cx,\n cy,\n // midAngle,\n innerRadius,\n outerRadius,\n startAngle,\n endAngle,\n fill,\n } = props;\n\n return (\n \n {investment.SchDesc} - {investment.plndesc}\n
\n \n
\n \n
\n Cost
\n \n
\n \n
\n Current Value
\n \n
\n \n
\n Gain
\n \n {investment.GainPercent}{\" \"}\n
\n \n
\n \n
\n Fund Name
\n \n {`${sip.schname}-${sip.plnname}`}\n
\n \n
\n\n \n Folio Number\n
\n \n {sip.accno}\n
\n \n
\n\n Sip Date
\n \n {sip.sipdt}\n
\n \n
\n\n \n Sip Start Date\n
\n \n {sip.sipstartdt}\n
\n \n
\n \n Sip End Date\n
\n \n {sip.sipenddt}\n
\n \n
\n\n Sip Amount
\n \n
\n \n
\n Status
\n \n {sip.Status}\n
\n \n {!!this.props.data && !this.props.name ? (\n
\n ))\n : \"\"}\n \n ) : (\n \n {!!this.props.data\n ? this.props.data.map((item, index) => (\n \n \n {item.name\n .charAt(0)\n .toUpperCase()\n .concat(item.name.substring(1, item.name.length))}\n
\n {item.value} %
\n \n {!!this.props.data\n ? this.props.data.map((item, index) => (\n \n \n \n {!!item && !!item.name && this.props.name === \"Fund\"\n ? `${item.name.split(\"MUTUAL FUND\")[0]} MF`\n : !!item && !!item.name && this.props.name !== \"Fund\"\n ? item.name.toLowerCase()\n : \"\"}\n
\n \n \n ))\n : \"\"}\n \n )}\n {!!this.props.data && !this.props.name ? (\n \"\"\n ) : (\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { FormatCurrency } from \"../../home/currencyFormatter\";\nimport ExpandLess from \"@material-ui/icons/ExpandLess\";\nimport ExpandMore from \"@material-ui/icons/ExpandMore\";\nimport {\n getInvestorDetails,\n favouriteInvestor,\n updateFavouriteInvestor,\n getUpComingSips,\n getInvestors,\n} from \"shared/store/actions\";\nimport {\n YES,\n TRUE,\n FALSE,\n INVESTMENTS,\n REQ_BY,\n UPCOMING_SIP,\n} from \"shared/store/types\";\nimport InvestmentTab from \"./investmentsTab\";\nimport Investments from \"./investments\";\nimport PieDiagram from \"../../home/dashboard/piechart\";\nimport { BUILD_URL } from \"../home\";\nimport CustomLoader from \"../../forms/customLoader\";\nimport { Debtbutton, DebtbuttonActive } from \"../../forms/button\";\n\nclass InvestorDetails extends Component {\n constructor(props) {\n super(props);\n this.state = {\n isLoading: true,\n noData: false,\n count: 3,\n active: INVESTMENTS,\n };\n }\n\n async componentDidMount() {\n await this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: \"A\",\n });\n const { location,investorData } = this.props;\n const { state } = location;\n const params = { PAN: state || investorData.PAN, Uid: this.props.userId, ReqBy: REQ_BY };\n const response = await this.props.getInvestorDetails(params);\n\n if (response) {\n this.setState({ isLoading: false });\n } else {\n this.setState({ isLoading: false, noData: true });\n }\n\n if (this.props.investorData) {\n const Params = {\n Pan: this.props.investorData.PAN,\n YearFlag: new Date().getFullYear(),\n ARNCode:this.props.token,\n };\n await this.props.getUpComingSips(Params);\n }\n }\n\n favourite = async () => {\n let { fav, PAN: InvPan, invname: Name } = this.props.investorData;\n\n const FavFlag = fav === TRUE ? FALSE : TRUE;\n const params = { InvPan, FavFlag, Name, AgentCode: this.props.token };\n const response = await this.props.favouriteInvestor(params);\n\n if(!!response && !!response.Dtinformation && !!response.Dtinformation[0] && !!response.Dtinformation[0].Error_Message){\n\n alert(`${response.Dtinformation[0].Error_Message}`)\n await this.props.updateFavouriteInvestor({ InvPan, FavFlag });\n await this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: \"A\",\n });\n }else if(!!response && !!response.error) {\n alert(`${response.error}`)\n await this.props.updateFavouriteInvestor({ InvPan, FavFlag });\n await this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: \"A\",\n });\n }else if (!response) {\n this.setState({\n errorMessage: \"Already this pan ID member is added as a Favorite\",\n });\n }\n };\n\n changeActive = (active) => () => {\n this.setState({ active });\n };\n\n render() {\n const {\n investorData,\n communicationDetails = [],\n pieData,\n investors,\n investments,\n upComingSipDetails,\n } = this.props;\n const detailsEmail = communicationDetails.find(\n (detail) => detail.PAN === investorData.PAN && !!detail.email\n );\n const detailsMobile = communicationDetails.find(\n (detail) => detail.PAN === investorData.PAN && !!detail.Mobile\n );\n\n const fatca = this.props.investors.find(\n (ele) =>\n !!investorData && !!investorData.PAN && ele.Pan === investorData.PAN\n );\n const { isLoading, noData } = this.state;\n\n\n\n\n\n return (\n \n \n 
*/}\n
\n \n \n
\n {/* \n {!isLoading ? (\n \n {!noData ? (\n \n
\n \n \n \n
\n\n \n \n {this.state.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n
\n\n {!!this.state.errorMessage ? (\n \n
\n \n
\n \n
\n \n
\n \n
\n \n {investorData.invname}\n
\n \n PAN: {investorData.PAN}\n
\n \n
\n \n
\n \n
\n \n {!!detailsEmail && detailsEmail.email\n ? detailsEmail.email\n : \"\"}\n
\n \n {!!detailsMobile && !!detailsMobile.Mobile\n ? detailsMobile.Mobile\n : \"\"}\n
\n \n ele.Pan === investorData.PAN && !!ele.Favorite && ele.Favorite===\"T\")\n ? \"investors-details-fav-button-div mouse-pointer button-highlight\"\n : \"investors-details-fav-button-div mouse-pointer\"\n }\n onClick={this.favourite}\n >\n
\n {!!investors && investors.find((ele)=>ele.Pan === investorData.PAN && !!ele.Favorite && ele.Favorite===\"T\")?\"Favourite Investor\":\"Favourite\"}
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n Cost\n
\n \n\n {!!this.props.investorTotal &&\n !!this.props.investorTotal.CostValue\n ?
\n \n
\n \n
\n \n
\n \n Investment Value\n
\n \n ₹{!!this.props.investorTotal &&\n !!this.props.investorTotal.CurrentValue\n ? this.props.investorTotal.CurrentValue\n : \"--NA--\"}\n
\n \n
\n\n \n Overall Gain\n
\n \n\n ₹{!!this.props.investorTotal &&\n !!this.props.investorTotal.GainVal\n ? this.props.investorTotal.GainVal\n : \"--NA--\"}\n\n
\n \n
\n \n Today's Gain\n
\n \n {!!this.props.investorTotal &&\n !!this.props.investorTotal.todaygain\n ? this.props.investorTotal.todaygain\n : \"--NA--\"}\n (%)\n\n
\n \n \n this.props.history.push({\n pathname:\n BUILD_URL +\n \"/new-transaction/transction-types\",\n state: {\n investorData: investorData,\n },\n })\n }\n display={!!investorData.PAN &&\n investorData.PAN.charAt(3).toUpperCase() === \"P\"\n ? \"block\"\n : \"none\"}\n buttontitle={\"Initiate Investment\"}\n width={150}\n />\n \n this.props.history.push({\n pathname:\n BUILD_URL +\n \"/mailBackRequest/investor\",\n state: {\n investorData: investorData,\n },\n })\n }\n buttontitle={\"Send Reports\"}\n width={150}\n />\n
\n \n
\n {(upComingSipDetails.length > 3 &&\n this.state.active === UPCOMING_SIP) ||\n (this.state.active === INVESTMENTS &&\n investments.length > 3) ? (\n \n
\n ) : (\n \"\"\n )}\n \n
\n \n Asset Allocation\n
\n \n
\n No Investor PAN found. Please submit investor PAN.
\n )}\n \n ) : (\n \n {state.title === \"SIP\" ? \"SIP (Existing Folio)\" : state.title}\n
\n \n
\n ) : (\n \"\"\n )}\n \n
\n )}\n {state.type === SIP && (\n \n
\n )}\n {state.type === STP && (\n \n
\n )}\n {state.type === SWP && (\n \n
\n )}\n\n {state.type != \"Sip cancellation\" && (\n \n
\n ))}\n\n {state.type !== SWP && state.type !== SIP && (\n \n
\n )}\n \n {\n // this.setState({\n // showPassword: !this.state.showPassword,\n // });\n // }}\n // isShowError={password.isError}\n // inputref={(ele) => (this.passwordField = ele)}\n // onKeyPress={this.keyPress()}\n />\n
\n )}\n \n (this.sipTypeField = ele)}\n // isError={sipType.isError}\n // errorMessage={sipType.errorMessage}\n >\n {this.state.sip_pause_dates.map((item, index) => (\n \n ))}\n \n
\n \n (this.sipTypeField = ele)}\n // isError={sipType.isError}\n // errorMessage={sipType.errorMessage}\n >\n {this.state.pause_installemnts.map((item, index) => (\n \n ))}\n \n
\n \n
\n )}\n\n \n {(!!this.props.mainLabel || !!this.props.subLabel) && (\n \n {this.props.subLabel}\n
\n \n )}\n {(!!this.props.mainLabel1 || !!this.props.subLabel2) && (\n \n \n {this.props.mainLabel}\n
\n \n \n {this.props.mainLabel1}\n
\n \n {(!!this.props.mainLabel || !!this.props.subLabel) && (\n \n {this.props.subLabel}\n
\n \n )}\n \n );\n }\n}\n// const investorData = { ...this.props.investorData, Email, Mobile };\n// const Xmobile = (communicationDetails.reverse() || []).find(\n// (detail) => (detail.PAN === investorData.PAN) && !!detail.Mobile\n// );\n// const Xemail = (communicationDetails.reverse() || []).find(\n// (detail) => detail.PAN === investorData.PAN && !!detail.email\n// );\n// const Email = !!Xemail && !!Xemail.email ? Xemail.email : \"\";\n// const Mobile = !!Xmobile && !!Xmobile.Mobile ? Xmobile.Mobile : \"\";\n","import React, { Component } from \"react\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport {\n YES,\n EXISTING,\n NEW,\n REGULAR,\n PURCHASE,\n NO,\n ALL,\n ADDITIONAL_PURCHASE,\n} from \"shared/store/types\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport { Checkbox } from \"@material-ui/core\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport {\n validateSubBroker,\n getAssetClasses,\n getOtherSchemes,\n submitPurchaseData,\n showPurchaseConfirmation,\n} from \"shared/store/actions\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport { NEW_TRANSACTION_URL } from \".\";\nimport { SundaramMutualFund } from \"./newPurchaseForm\";\nimport { INVESTOR_URL } from \"../investors\";\nclass AdditionalPurchase extends Component {\n constructor(props) {\n super(props);\n this.state = {\n fund: { value: { value: \"105\" } },\n folios: [],\n folio: { value: \"\" },\n minAmount: \"\",\n schemes: [],\n schemeType: EXISTING,\n combo: { flag: \"\", disclamier: \"\", label: \"\" },\n isCombo: false,\n scheme: { value: \"\" },\n radioValue: { value: \"no\" },\n arnCode: { value: this.props.token },\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n category: { value: \"\" },\n bank: { value: \"\" },\n categories: [],\n banks: [],\n amount: { value: \"\" },\n showSmart: false,\n smart: { flag: \"yes\" },\n };\n }\n\n handleFundChange = (value) => {\n if (!value) {\n this.setState({\n fund: { value: \"\" },\n folios: [],\n folio: { value: \"\" },\n scheme: { value: \"\" },\n schemeType: EXISTING,\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n category: { value: \"\" },\n // bank: { value: \"\" },\n radioValue: { value: \"no\" },\n showSmart: false,\n amount: { value: \"\" },\n });\n return;\n } else if (value.value === this.state.fund.value.value) {\n return;\n } else {\n const fund = value.value;\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.pFlag === YES && curr.Fund === fund) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n schemeType: EXISTING,\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n category: { value: \"\" },\n // bank: { value: \"\" },\n radioValue: { value: \"no\" },\n showSmart: false,\n amount: { value: \"\" },\n });\n if (!!fund) {\n this.validateBrokerCode(fund)();\n }\n }\n };\n\n async componentDidMount() {\n window.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n this.getFolios();\n }\n\n getFolios = () => {\n const fund = \"105\";\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.pFlag === YES && curr.Fund.trim() === fund) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n\n this.setState({\n fund: { value: { value: \"105\" } },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n schemeType: EXISTING,\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n category: { value: \"\" },\n radioValue: { value: \"no\" },\n amount: { value: \"\" },\n });\n this.validateBrokerCode(fund)();\n };\n\n validateBrokerCode = (fund) => async () => {\n const { subArnCode, arnCode } = this.state;\n if (\n !!this.state.subArnCode.value &&\n this.state.subArnCode.value === this.state.arnCode.value.split(\"-\")[1]\n ) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: \"ARN and Sub ARN Code should not be the same\",\n },\n });\n return;\n }\n const params = {\n Fund: \"105\",\n SubAgentCd: !!subArnCode.value ? `ARN-${subArnCode.value}` : \"\",\n AgentCd: arnCode.value,\n };\n const response = await this.props.validateSubBroker(params);\n\n if (!response) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `Please enter a valid Sub ARN Code`,\n },\n });\n }\n };\n\n handleFolioChange = (value) => {\n if (!value) {\n this.setState({\n folio: { value: \"\" },\n schemes: [],\n schemeType: EXISTING,\n banks: [],\n scheme: { value: \"\" },\n // bank: { value: \"\" },\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n category: { value: \"\" },\n radioValue: { value: \"no\" },\n amount: { value: \"\" },\n showSmart: false,\n });\n return;\n } else if (value.value === this.state.folio.value.value) {\n return;\n } else {\n const folio = value.value;\n const schemes = this.schemes(folio);\n // const banks = this.props.bankDetails.filter(\n // (item) => item.foliono === folio\n // );\n this.setState({\n folio: { value },\n schemes,\n schemeType: EXISTING,\n // banks,\n showSmart: false,\n // bank: { value: \"\" },\n });\n }\n };\n\n changeEuin = (value) => {\n this.setState({\n euinNo: { value },\n });\n };\n\n changeValue = (label) => (event) => {\n if (label === \"amount\" && event.target.value.length <= 10) {\n this.setState({\n [label]: { value: event.target.value.replace(/^0+/, \"\") },\n });\n } else if (label === \"subArnCode\" || label === \"subBrokerCode\") {\n if (/^\\d{0,15}$/.test(event.target.value)) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid number\",\n },\n });\n }\n } else if (label === \"radioValue\" && event.target.value === \"no\") {\n if (!this.state.euinNo.value) {\n this.setState({\n radioValue: { value: event.target.value },\n });\n } else {\n this.setState({\n [label]: { value: event.target.value },\n euinNo: { value: \"\" },\n });\n }\n } else if (\n label !== \"amount\" &&\n label !== \"subArnCode\" &&\n label !== \"subBrokerCode\" &&\n label === \"radioValue\" &&\n event.target.value !== \"no\"\n ) {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n\n getAssetClasses = async () => {\n const params = {\n Fund: \"105\",\n Folio: this.state.folio.value.value,\n };\n const assetClasses = await this.props.getAssetClasses(params);\n if (assetClasses) {\n this.setState({\n categories: assetClasses.DtData,\n });\n }\n };\n\n getOtherSchemes = async (value) => {\n const params = {\n schtype: REGULAR,\n category: value,\n acno: this.state.folio.value.value,\n fundCode: \"105\",\n trantype: PURCHASE,\n };\n const otherSchemes = await this.props.getOtherSchemes(params);\n if (otherSchemes) {\n this.setState({\n schemes: otherSchemes.DtData,\n });\n }\n };\n\n schemes = (folio) => {\n return this.props.fundList.reduce((prev, curr) => {\n if (\n curr.pSchFlg === YES &&\n curr.Fund.trim() === \"105\" &&\n curr.Acno === folio\n ) {\n return [...prev, curr];\n }\n return prev;\n }, []);\n };\n\n handleCategoryChange = (event) => {\n if (event.target.value) {\n this.getOtherSchemes(event.target.value);\n this.setState({\n category: { value: event.target.value },\n scheme: { value: \"\" },\n showSmart: false,\n });\n } else {\n this.setState({\n category: { value: \"\" },\n scheme: { value: \"\" },\n showSmart: false,\n });\n }\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"amount\") {\n if (this.state.amount.value === \"\") {\n console.log(\"hello\");\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `Investment Amount is Mandatory* `,\n },\n });\n } else if (parseFloat(this.state.minAmount) > parseFloat(this.state.amount.value)) {\n console.log(\"hello\");\n this.setState({\n amount: {\n value,\n isError: true,\n errorMessage: `Minimum amount is ₹${this.state.minAmount} `,\n },\n });\n }\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n\n changeSchemeType = (value) => () => {\n if (value === this.state.schemeType) {\n return;\n }\n if (value === EXISTING) {\n const schemes = this.schemes(this.state.folio.value.value);\n this.setState({\n schemeType: value,\n schemes,\n category: { value: \"\" },\n scheme: { value: \"\" },\n amount: { value: \"\" },\n showSmart: false,\n });\n } else {\n this.setState({\n schemeType: value,\n scheme: { value: \"\" },\n category: { value: \"\" },\n amount: { value: \"\" },\n showSmart: false,\n });\n if (!!this.state.fund.value && !!this.state.folio.value) {\n this.getAssetClasses();\n this.getOtherSchemes();\n }\n }\n };\n\n handleSchemeChange = (value) => {\n if (!value) {\n this.setState({\n scheme: { value: \"\" },\n\n scheme: { value: \"\" },\n // bank: { value: \"\" },\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n\n radioValue: { value: \"no\" },\n amount: { value: \"\" },\n showSmart: false,\n });\n return;\n } else if (\n !!value &&\n !!this.state.scheme.value &&\n value.value === this.state.scheme.value.value\n ) {\n return;\n } else {\n const scheme = value.value;\n const checkCombo =\n !!scheme && !!scheme.combo_flag && scheme.combo_flag === \"Y\";\n this.setState({\n scheme: { value },\n minAmount: scheme.MinAmt || scheme.fm_newpur,\n amount: { value: \"\" },\n isCombo: !!checkCombo ? true : false,\n combo: {\n flag: !!checkCombo ? \"Y\" : \"N\",\n disclamier: scheme.combo_disclaimer,\n label: scheme.combo_lable,\n },\n // bank: { value: \"\" },\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n showSmart: false,\n radioValue: { value: \"no\" },\n });\n }\n };\n\n changeSmart = (event) => {\n this.setState({\n smart: { flag: event.target.value },\n });\n };\n\n submit = async () => {\n const {\n funds,\n categories,\n smart,\n showSmart,\n schemes,\n folios,\n banks,\n arnCode,\n subArnCode,\n subBrokerCode,\n radioValue,\n euinNo,\n minAmount,\n schemeType,\n category,\n bank,\n isCombo,\n combo,\n fund,\n ...others\n } = this.state;\n\n const keys = Object.keys(others);\n\n if (this.state.schemeType === NEW && this.state.category.value === \"\") {\n this.setState({\n category: {\n value: \"\",\n isError: true,\n errorMessage: \"Category is Mandatory*\",\n },\n });\n }\n if (\n this.state.euinNo.value === \"\" &&\n this.state.radioValue.value === \"no\"\n ) {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n errorMessage: \"EUIN Declaration is Mandatory*\",\n },\n });\n }\n const findError = keys.every((key) => !!others[key].value);\n const arn = this.state.arnCode.value.split(\"-\");\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"category\"\n ? \"Category\"\n : key === \"folio\"\n ? \"Folio\"\n : key === \"scheme\"\n ? \"Scheme\"\n : key === \"amount\"\n ? \"Investment Amount\"\n : key\n } is Mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n // case \"fund\": {\n // this.fundField.focus();\n // break;\n // }\n case \"folio\": {\n this.folioField.focus();\n break;\n }\n case \"scheme\": {\n this.schemeField.focus();\n break;\n }\n case \"amount\": {\n this.amountField.focus();\n break;\n }\n // case \"bank\": {\n // this.bankField.focus();\n // break;\n // }\n }\n } else if (schemeType === NEW && !category.value) {\n this.setState({\n category: { ...category, isError: true },\n });\n this.categoryField.focus();\n return;\n } else if (radioValue.value === \"no\" && !euinNo.value) {\n this.setState({\n euinNo: { ...euinNo, isError: true },\n });\n this.euinField.focus();\n return;\n } else if (\n !!others.amount.value &&\n parseFloat(minAmount) > parseFloat(others.amount.value)\n ) {\n this.setState({\n amount: {\n ...others[\"amount\"],\n isError: true,\n errorMessage: `Minimum amount is ₹${minAmount}`,\n },\n });\n this.amountField.focus();\n return;\n } else if (arn[1] === this.state.subArnCode.value) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `and ARN code should not match`,\n },\n });\n } else {\n const { communicationDetails, investorData } = this.props;\n const Xmobile = communicationDetails.find(\n (detail) =>\n detail.Fund === this.state.fund.value.value &&\n detail.Acno === this.state.folio.value.value &&\n detail.PAN === investorData.PAN &&\n !!detail.Mobile\n );\n const Xemail = communicationDetails.find(\n (detail) =>\n detail.Fund === this.state.fund.value.value &&\n detail.Acno === this.state.folio.value.value &&\n detail.PAN === investorData.PAN &&\n !!detail.email\n );\n\n const Email = !!Xemail && !!Xemail.email ? Xemail.email : \"\";\n const Mobile = !!Xmobile && !!Xmobile.Mobile ? Xmobile.Mobile : \"\";\n const params = {\n InvestorName: investorData.invname,\n i_entby: this.props.userId,\n trtype: PURCHASE,\n Desci: \"Yes~P~\",\n SubbrokerArn: !!this.state.subArnCode.value\n ? `ARN-${subArnCode.value}`\n : \"\",\n ARNCode: this.state.arnCode.value,\n EuinCode:\n this.state.radioValue.value === \"no\"\n ? this.state.euinNo.value.value\n : \"\",\n i_Userid: this.props.userId,\n Mobile: Mobile,\n PanNo: investorData.PAN,\n Email: Email,\n i_Acno: this.state.folio.value.value,\n\n Subbroker: this.state.subBrokerCode.value,\n i_Fund: \"105\",\n i_UntAmtValue: this.state.amount.value,\n EUINFlag: this.state.radioValue.value === \"no\" ? NO : YES,\n EuinValid: this.state.radioValue.value === \"no\" ? NO : YES,\n // Bankid: `${this.state.bank.value.bnkcode}~${this.state.bank.value.bnkactype}~${this.state.bank.value.bnkacno}`,\n i_Scheme:\n this.state.scheme.value.value.Sch ||\n this.state.scheme.value.value.fm_scheme,\n i_Plan:\n this.state.scheme.value.value.Pln ||\n this.state.scheme.value.value.fm_plan,\n i_Option:\n this.state.scheme.value.value.Opt ||\n this.state.scheme.value.value.fm_option,\n i_oldihno: \"0\",\n i_InvDistFlag: \"P\",\n ModuleName: \"Webile\",\n };\n\n const response = await this.props.submitPurchaseData(params);\n if (!!response && !response.error) {\n const {\n DtData: [purchaseData],\n } = response;\n const confirmationParams = {\n Trtype: PURCHASE,\n fund: \"105\",\n Refno: purchaseData.refno,\n ModuleName: \"Webile\",\n };\n const confirmationResponse = await this.props.showPurchaseConfirmation(\n confirmationParams\n );\n\n if (!!confirmationResponse && !confirmationResponse.error) {\n this.props.history.push({\n pathname:\n INVESTOR_URL + \"/transction-types/additional-purchase/confirm\",\n state: {\n title: \"ADDITIONAL PURCHASE SUMMARY\",\n type: ADDITIONAL_PURCHASE,\n scheme: { Fund: this.state.fund.value.value },\n ARNCode: this.state.arnCode.value.split(\"-\")[1],\n Folio: this.state.folio.value,\n folio: this.state.folio.value,\n methodType: this.state.schemeType,\n },\n });\n } else if (!!confirmationResponse && !!confirmationResponse.error) {\n alert(`${confirmationResponse.error}`);\n }\n } else if (!!response && !!response.error) {\n alert(`${response.error}`);\n }\n }\n };\n\n ComboChange = () => {\n this.setState({\n isCombo: !this.state.isCombo,\n });\n };\n\n render() {\n const {\n fund,\n funds = [],\n folio,\n folios = [],\n schemeType,\n schemes = [],\n scheme,\n radioValue,\n arnCode,\n subArnCode,\n subBrokerCode,\n euinNo,\n categories,\n category,\n combo,\n isCombo,\n // bank,\n banks,\n amount,\n smart,\n showSmart,\n } = this.state;\n const { euinList } = this.props;\n return (\n \n \n {this.props.mainLabel}\n
\n \n \n \n \n
\n )} */}\n {/* Additional Purchase
\n {/* \n
*/}\n AMC
\n \n ({\n label: item,\n value: item,\n }))}\n value={folio.value}\n placeholder=\"Select Folio\"\n handleChange={this.handleFolioChange}\n inputRef={(ele) => (this.folioField = ele)}\n disabled={!fund.value}\n isError={folio.isError}\n errorMessage={folio.errorMessage}\n />\n
\n Folio*
\n Select Scheme Type
\n \n
\n {schemeType === NEW && (\n \n (this.categoryField = ele)}\n isError={category.isError}\n errorMessage={category.errorMessage}\n >\n {categories.map((item, index) => (\n \n ))}\n \n
\n )}\n \n ({\n value: item,\n label: item.PlnDesc\n ? `${item.SchDesc1} - ${item.PlnDesc} - ${item.OptDesc}`\n : item.fm_schdesc,\n }))}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n handleChange={this.handleSchemeChange}\n disabled={!folio.value}\n inputRef={(ele) => (this.schemeField = ele)}\n isError={scheme.isError}\n errorMessage={scheme.errorMessage}\n />\n
\n Scheme*
\n \n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n value={subArnCode.value}\n isShowError={subArnCode.isError}\n errorMessage={subArnCode.errorMessage}\n onBlur={this.validateBrokerCode(\n fund.value ? fund.value.value.Fund : \"\"\n )}\n onChange={this.changeValue(\"subArnCode\")}\n inputref={(ele) => (this.subArnField = ele)}\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n />\n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n isShowError={subBrokerCode.isError}\n errorMessage={subBrokerCode.errorMessage}\n value={subBrokerCode.value}\n onChange={this.changeValue(\"subBrokerCode\")}\n inputref={(ele) => (this.subBrokerField = ele)}\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n />\n
\n \n \n \n \n
\n {radioValue.value === \"no\" ? (\n EUIN Declaration*
\n \n
\n YES
\n \n
\n \n NO
\n \n ({\n value: item.abm_agent,\n label: item.abm_agent,\n }))}\n errorMessage={euinNo.errorMessage}\n value={euinNo.value}\n placeholder=\"Choose EUIN\"\n handleChange={this.changeEuin}\n disabled={!euinList.length}\n inputRef={(ele) => (this.euinField = ele)}\n isError={euinNo.isError}\n />\n
\n ) : (\n \n I/We hereby confirm that the EUIN Declaration box has been\n intentionally left the blank by me/us as this is an 'execution-only'\n transaction without any interaction or advice by any personnel of\n the above distributor or notwithstanding the advice of\n in-appropriateness,if any provided by any personnel of the\n distributor and the distributor has not charged any advisory fees on\n this transaction\n
\n )}\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n onBlur={this.showError(\"amount\")}\n onChange={this.changeValue(\"amount\")}\n inputref={(ele) => (this.amountField = ele)}\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n isShowError={amount.isError}\n errorMessage={amount.errorMessage}\n />\n
\n {/* {!!showSmart && (\n \n \n Your investor is eligible for a SMART facility\n
\n\n \n
\n YES
\n \n
\n \n NO
\n \n
\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }) => {\n const {\n fundList,\n token,\n userId,\n bankDetails,\n investorData,\n communicationDetails,\n } = authReducer;\n const { euinList } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n bankDetails,\n investorData,\n communicationDetails,\n };\n },\n {\n validateSubBroker,\n getAssetClasses,\n getOtherSchemes,\n submitPurchaseData,\n showPurchaseConfirmation,\n }\n)(AdditionalPurchase);\n","import React, { Component } from \"react\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport {\n YES,\n PARTIAL,\n FULL,\n UNITS,\n AMOUNT,\n PURCHASE,\n REDEMPTION,\n} from \"shared/store/types\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport {\n getBankDetails,\n getRedemptionPaymentDetails,\n} from \"shared/store/actions/transactions\";\nimport moment from \"moment\";\n\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\n\nimport { INVESTOR_URL } from \"../investors\";\n\nclass Redemption extends Component {\n constructor(props) {\n super(props);\n this.state = {\n // funds,\n fund: { value: { value: \"105\" } },\n folios: [],\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n bank: { value: \"\", errorMessage: \"\" },\n amount: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n banks: [],\n };\n }\n\n handleFundChange = (value) => {\n const fund = !!value ? value.value : \"\";\n if (!value) {\n this.setState({\n fund: { value: \"\" },\n folios: [],\n scheme: { value: \"\" },\n folio: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n amount: { value: \"\" },\n });\n return;\n } else if (value.value === this.state.fund.value.value) {\n return;\n } else {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.rSchFlg === YES && curr.Fund === fund) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value },\n folios: Array.from(new Set(folios)),\n scheme: { value: \"\" },\n folio: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n });\n }\n };\n\n async componentDidMount() {\n window.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n this.getfolios();\n }\n\n getfolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.rSchFlg === YES && curr.Fund.trim() === \"105\") {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value: { value: \"105\" } },\n folios: Array.from(new Set(folios)),\n scheme: { value: \"\" },\n folio: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n });\n };\n\n handleFolioChange = async (value) => {\n const folio = !!value ? value.value : \"\";\n if (!folio) {\n this.setState({\n folio: { value: \"\" },\n scheme: { value: \"\" },\n schemes: [],\n banks: [],\n bank: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n amount: { value: \"\" },\n });\n } else if (value.value === this.state.folio.value) {\n return;\n } else {\n const params = {\n Acno: folio,\n Trtype: \"\",\n Fund: \"105\",\n };\n let schemes = this.schemes(folio);\n schemes = schemes.filter((scheme) => scheme.BalUnits !== 0);\n const response = await this.props.getBankDetails(params);\n\n if (response) {\n const banks = response.Table1;\n this.setState({\n folio: {\n value,\n isError: !schemes.length,\n errorMessage: !schemes.length\n ? \"Redemption in zero balance folios is not allowed\"\n : \"\",\n },\n scheme: { value: \"\" },\n schemes,\n banks,\n bank: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n });\n }\n }\n };\n\n schemes = (folio) => {\n return this.props.fundList.reduce((prev, curr) => {\n if (\n curr.rSchFlg === YES &&\n curr.Fund === this.state.fund.value.value &&\n curr.Acno === folio &&\n !!curr.BalUnits\n ) {\n return [...prev, curr];\n }\n return prev;\n }, []);\n };\n handleSchemeChange = (value) => {\n const scheme = !!value ? value.value : \"\";\n\n if (!scheme) {\n this.setState({\n scheme: { value: \"\" },\n minAmount: \"\",\n amount: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n });\n } else if (value.value === this.state.scheme.value.value) {\n return;\n } else {\n this.setState({\n scheme: { value },\n minAmount: !!scheme ? scheme.RedMinAmt || scheme.fm_newpur : \"\",\n amount: { value: \"\" },\n redemptionType: PARTIAL,\n redemptionMode: UNITS,\n });\n }\n };\n\n showError = (label) => () => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"amount\") {\n if (!!this.state.scheme && !!this.state.scheme.value) {\n this.setState({\n [label]: {\n value:\n this.state.redemptionMode === AMOUNT &&\n this.state.scheme.value.value.RedMinAmt > this.state.amount.value\n ? \"\"\n : this.state.redemptionMode === AMOUNT &&\n this.state.amount.value >\n parseFloat(\n this.state.scheme.value.value.CurValue.replace(/,/g, \"\")\n )\n ? \"\"\n : this.state.redemptionMode === UNITS &&\n this.state.scheme.value.value.BalUnits <\n this.state.amount.value\n ? \"\"\n : this.state.amount.value,\n isError:\n this.state.redemptionMode === AMOUNT &&\n this.state.scheme.value.value.RedMinAmt > this.state.amount.value\n ? true\n : this.state.redemptionMode === AMOUNT &&\n this.state.amount.value >\n parseFloat(\n this.state.scheme.value.value.CurValue.replace(/,/g, \"\")\n )\n ? true\n : this.state.redemptionMode === UNITS &&\n this.state.scheme.value.value.BalUnits <\n this.state.amount.value\n ? true\n : !value,\n errorMessage:\n this.state.redemptionMode === AMOUNT &&\n this.state.scheme.value.value.RedMinAmt > this.state.amount.value\n ? `Minimum amount is ₹ ${this.state.scheme.value.value.RedMinAmt} `\n : this.state.redemptionMode === AMOUNT &&\n parseFloat(this.state.amount.value) >\n parseFloat(\n this.state.scheme.value.value.CurValue.replace(/,/g, \"\")\n )\n ? `Maximum amount you can redeem is ₹ ${this.state.scheme.value.value.CurValue} `\n : this.state.scheme.value.value.BalUnits <\n this.state.amount.value\n ? `You don't have enough Units To Redeem!`\n : \"\",\n },\n });\n }\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n handleRedemptionValueChange(event) {\n const { redemptionMode, redemptionType } = this.state;\n if (event.target.value.length <= 10) {\n if (redemptionMode === UNITS && redemptionType === PARTIAL) {\n if (\n /^[0-9]*$/.test(event.target.value) ||\n /[-+]?[0-9]*(\\.[0-9]{0,3}$)/.test(event.target.value)\n ) {\n this.setState({\n amount: { value: event.target.value },\n });\n }\n } else {\n this.setState({\n amount: { value: event.target.value.replace(/^0+/, \"\") },\n });\n }\n }\n }\n\n changeRedemptionType = (value) => () => {\n if (value === FULL) {\n this.setState({\n redemptionType: FULL,\n redemptionMode: UNITS,\n amount: {\n value: !!this.state.scheme.value\n ? this.state.scheme.value.value.BalUnits\n : \"\",\n },\n });\n }\n if (value === PARTIAL) {\n this.setState({\n redemptionType: PARTIAL,\n amount: { value: \"\" },\n });\n }\n };\n changeRedemptionMode = (value) => () => {\n if (value === AMOUNT) {\n this.setState({\n redemptionMode: AMOUNT,\n amount: { value: \"\" },\n });\n }\n if (value === UNITS) {\n this.setState({\n redemptionMode: UNITS,\n amount: { value: \"\" },\n });\n }\n };\n handlefolioBankDetailsChange = (event) => {\n this.setState({\n bank: { value: event.target.value },\n });\n };\n\n submit = async () => {\n const {\n funds,\n banks,\n schemes,\n folios,\n redemptionType,\n redemptionMode,\n minAmount,\n fund,\n bank,\n ...others\n } = this.state;\n if (this.state.bank.value === \"\") {\n this.setState({\n bank: {\n value: \"\",\n isError: true,\n errorMessage: \"Bank details are Mandatory*\",\n },\n });\n }\n let currValue;\n if (!!this.state.scheme.value) {\n currValue = !!this.state.scheme.value.value\n ? this.state.scheme.value.value.Fund_CurValue\n : \"\";\n }\n const keys = Object.keys(others);\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"folio\"\n ? \"Folio\"\n : key === \"scheme\"\n ? \"Scheme\"\n : key === \"amount\"\n ? \"Redemption value\"\n : key\n } is Mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n // case \"fund\": {\n // this.fundField.focus();\n // break;\n // }\n case \"folio\": {\n this.folioField.focus();\n break;\n }\n case \"scheme\": {\n this.schemeField.focus();\n break;\n }\n case \"amount\": {\n this.amountField.focus();\n break;\n }\n // case \"bank\": {\n // this.bankField.focus();\n // break;\n // }\n }\n } else if (\n this.state.redemptionMode === AMOUNT &&\n this.state.scheme.value.value.RedMinAmt > this.state.amount.value\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `Minimum amount shoud be ₹ ${this.state.scheme.value.value.RedMinAmt} `,\n },\n });\n } else if (\n this.state.redemptionMode !== AMOUNT &&\n this.state.scheme.value.value.BalUnits < this.state.amount.value\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `You dont have enough points to redeem`,\n },\n });\n } else if (parseInt(this.state.amount.value) < 2) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `Invalid Redemption Value`,\n },\n });\n } else if (this.state.bank.value === \"\") {\n this.setState({\n bank: {\n ...others[\"bank\"],\n isError: true,\n errorMessage: `Please select the bank`,\n },\n });\n this.amountField.focus();\n return;\n } else {\n const params = {\n amount: redemptionMode === AMOUNT ? others.amount.value : \"0\",\n Fund: \"105\",\n plan: others.scheme.value.value.Pln,\n scheme: others.scheme.value.value.Sch,\n acno: others.scheme.value.value.Acno,\n trdt: moment(new Date()).format(\"MM/DD/YYYY\"),\n units: redemptionMode === UNITS ? others.amount.value : \"0\",\n ttrtype: PURCHASE,\n };\n const response = await this.props.getRedemptionPaymentDetails(params);\n if (response) {\n this.props.history.push({\n pathname: INVESTOR_URL + \"/transction-types/redemption/confirm\",\n state: {\n title: \"Redemption Payment Summary\",\n type: REDEMPTION,\n scheme: others.scheme.value.value,\n redemptionMode,\n Folio: { value: others.scheme.value.value.Acno },\n redemptionType,\n amount: others.amount.value,\n bank: this.state.bank.value,\n },\n });\n }\n }\n };\n\n render() {\n const {\n fund,\n funds = [],\n folio,\n folios = [],\n schemes = [],\n scheme,\n bank,\n banks,\n amount,\n redemptionType,\n redemptionMode,\n } = this.state;\n\n const checkMultiBrokerFlag =\n !!this.state.scheme &&\n !!this.state.scheme.value &&\n !!this.state.scheme.value.value &&\n !!this.state.scheme.value.value.multibrokflg &&\n this.state.scheme.value.value.multibrokflg === \"Y\";\n\n return (\n \n \n {\" \"}\n Note: This folio has multiple distributors. Hence, the balance units\n and current value will not be displayed. In case of full redemption,\n all the units in the investor's portfolio will be redeemed.\n
\n )}\n\n Redemption
\n\n \n ({\n label: item,\n value: item,\n }))}\n value={folio.value}\n placeholder=\"Select Folio\"\n handleChange={this.handleFolioChange}\n inputRef={(ele) => (this.folioField = ele)}\n isError={folio.isError}\n errorMessage={folio.errorMessage}\n />\n
\n\n Folio*
\n \n ({\n label: item.PlnDesc\n ? `${item.SchDesc1} - ${item.PlnDesc} - ${item.OptDesc}`\n : item.fm_schdesc,\n value: item,\n }))}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n handleChange={this.handleSchemeChange}\n inputRef={(ele) => (this.schemeField = ele)}\n isError={scheme.isError}\n disabled={!folio.value}\n errorMessage={scheme.errorMessage}\n />\n
\n\n Scheme*
\n \n
\n\n {!!checkMultiBrokerFlag && (\n \n {!checkMultiBrokerFlag &&
\n Balance Units
}\n {!checkMultiBrokerFlag && Current Value
}\n \n NAV as on {!!scheme.value ? scheme.value.value.LastNavDate : \"\"}\n
\n Minimum Amount
\n \n {!checkMultiBrokerFlag && (\n
\n {!!scheme.value ? scheme.value.value.BalUnits : \"\"}
\n )}\n {!checkMultiBrokerFlag && (\n \n {!!scheme.value ? `₹ ${scheme.value.value.CurValue}` : \"\"}\n
\n )}\n {!!scheme.value ? scheme.value.value.LastNAV : \"\"}
\n \n {!!scheme.value ? `₹ ${scheme.value.value.RedMinAmt}` : \"₹\"}\n
\n Redemption Type
\n \n
\n\n Redemption Mode
\n \n
\n\n \n \n (evt.key === \"e\" || evt.key === \"-\") && evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n errorMessage={amount.errorMessage}\n isShowError={amount.isError}\n type=\"number\"\n onBlur={this.showError(\"amount\")}\n disabled={redemptionType === FULL ? true : false}\n inputref={(ele) => (this.amountField = ele)}\n onChange={(event) => this.handleRedemptionValueChange(event)}\n value={amount.value}\n />\n
\n\n \n (this.bankField = ele)}\n >\n {banks.map((item, index) => (\n \n ))}\n \n {/* {!!bank.errorMessage ?
\n {bank.errorMessage}
: \"\"} */}\n \n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const {\n fundList,\n token,\n userId,\n bankDetails,\n investorData,\n communicationDetails,\n } = authReducer;\n\n return {\n fundList,\n token,\n userId,\n bankDetails,\n investorData,\n communicationDetails,\n };\n },\n { getBankDetails, getRedemptionPaymentDetails }\n)(Redemption);\n","import React, { Component } from \"react\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport { Input } from \"../../forms/input\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport {\n validateSubBroker,\n getNewPurchaseFundList,\n getOtherSchemes,\n getAssetClasses,\n setSwitchDetails,\n getRedemptionPaymentDetails,\n} from \"shared/store/actions\";\n\nimport { connect } from \"react-redux\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport {\n YES,\n PARTIAL,\n FULL,\n UNITS,\n AMOUNT,\n REGULAR,\n PURCHASE,\n SWITCH,\n} from \"shared/store/types\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport moment from \"moment\";\nimport { NEW_TRANSACTION_URL } from \".\";\nimport { SundaramMutualFund } from \"./newPurchaseForm\";\nimport { INVESTOR_URL } from \"../investors\";\nclass switchComponent extends Component {\n constructor(props) {\n super(props);\n\n const { switchDetails } = this.props;\n\n this.state = {\n fund: { value: { value: \"105\" } },\n folios: [],\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n radioValue: { value: \"no\" },\n arnCode: { value: this.props.token },\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n euinNo: { value: \"\" },\n category: { value: \"\" },\n categories: [],\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n amount: { value: \"\" },\n switchType: PARTIAL,\n switchMode: UNITS,\n ...switchDetails,\n };\n }\n\n handleFundChange = (value) => {\n if (!value) {\n this.setState({\n fund: { value: \"\" },\n folios: [],\n folio: { value: \"\" },\n scheme: { value: \"\" },\n amount: { value: \"\" },\n switchInScheme: { value: \"\" },\n category: { value: \"\" },\n });\n return;\n } else if (!!value && !!this.state.fund && value.value === \"105\") {\n return;\n } else {\n const fund = value.value;\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund === fund && curr.sSchFlg === YES) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n scheme: { value: \"\" },\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n switchType: PARTIAL,\n switchMode: UNITS,\n });\n if (!!fund) {\n this.validateBrokerCode(fund)();\n }\n }\n };\n async componentDidMount() {\n window.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n this.getFolios();\n }\n\n getFolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund.trim() === \"105\" && curr.sSchFlg === YES) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value: { value: \"105\" } },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n scheme: { value: \"\" },\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n switchType: PARTIAL,\n switchMode: UNITS,\n });\n // if (!!fund) {\n this.validateBrokerCode(\"105\")();\n // }\n };\n\n validateBrokerCode = (fund) => async () => {\n const { subArnCode, arnCode } = this.state;\n if (\n !!this.state.subArnCode.value &&\n this.state.subArnCode.value === this.state.arnCode.value.split(\"-\")[1]\n ) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: \"ARN and Sub ARN Code should not be the same\",\n },\n });\n return;\n }\n const params = {\n Fund: \"105\",\n SubAgentCd: !!subArnCode.value ? `ARN-${subArnCode.value}` : \"\",\n AgentCd: arnCode.value,\n };\n const response = await this.props.validateSubBroker(params);\n if (!response) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `(Please enter a valid Sub ARN Code)`,\n },\n });\n }\n };\n\n handleFolioChange = async (value) => {\n if (!value) {\n this.setState({\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n switchType: PARTIAL,\n switchMode: UNITS,\n amount: { value: \"\" },\n });\n return;\n } else if (\n !!value &&\n !!this.state.folio &&\n value.value === this.state.folio.value.value\n ) {\n return;\n } else {\n const folio = value.value;\n const schemes = this.schemes(folio);\n\n this.setState({\n folio: {\n value,\n isError: !schemes.length,\n errorMessage: !schemes.length\n ? \"SWITCH in zero balance folios is not allowed\"\n : \"\",\n },\n schemes,\n scheme: { value: \"\" },\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n switchType: PARTIAL,\n switchMode: UNITS,\n categories: [],\n });\n\n this.getAssetClasses();\n }\n };\n schemes = (folio) => {\n return this.props.fundList.reduce((prev, curr) => {\n if (\n curr.sSchFlg === YES &&\n curr.Fund.trim() === \"105\" &&\n curr.Acno === folio &&\n !!curr.BalUnits\n ) {\n return [...prev, curr];\n }\n return prev;\n }, []);\n };\n handleSchemeChange = (value) => {\n if (!value) {\n this.setState({\n scheme: { value: \"\" },\n minAmount: \"\",\n amount: { value: \"\" },\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n switchType: PARTIAL,\n switchMode: UNITS,\n categories: [],\n });\n return;\n } else if (\n !!value.value &&\n !!this.state.scheme.value.value &&\n value.value.SchDesc === this.state.scheme.value.value.SchDesc\n ) {\n return;\n } else {\n const scheme = value.value;\n if (!!value.value && !value.value.BalUnits) {\n this.setState({\n folio: {\n value: \"\",\n isError: \"true\",\n errorMessage: \"Switch in Zero balance folios is not accepted\",\n },\n scheme: { value: \"\" },\n });\n } else {\n this.setState({\n scheme: { value },\n minAmount: !!scheme ? scheme.MinAmt : \"\",\n amount: { value: \"\" },\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n });\n }\n this.getAssetClasses();\n }\n };\n handleCategoryChange = (event) => {\n if (!!event.target.value) {\n this.getOtherSchemes(event.target.value);\n this.setState({\n category: { value: event.target.value },\n switchInScheme: { value: \"\" },\n switchInSchemes: [],\n });\n }\n // else if(event.target.value===){\n\n // }\n else {\n this.setState({\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n switchInSchemes: [],\n });\n }\n };\n getAssetClasses = async () => {\n const params = {\n Fund: \"105\",\n Folio: this.state.folio.value.value,\n };\n const assetClasses = await this.props.getAssetClasses(params);\n if (assetClasses) {\n this.setState({\n categories: assetClasses.DtData,\n });\n }\n };\n\n changeEuin = (value) => {\n this.setState({\n euinNo: { value },\n });\n };\n\n getOtherSchemes = async (value) => {\n const params = {\n schtype: REGULAR,\n category: value,\n acno: this.state.folio.value.value,\n fundCode: \"105\",\n trantype: \"S\",\n };\n const otherSchemes = await this.props.getOtherSchemes(params);\n if (otherSchemes) {\n this.setState({\n switchInSchemes: otherSchemes.DtData,\n });\n }\n };\n handleSwitchInSchemeChange = (value) => {\n if (!value) {\n this.setState({\n switchInScheme: { value },\n });\n return;\n }\n this.setState({\n switchInScheme: { value },\n });\n };\n changeValue = (label) => (event) => {\n if (\n (label === \"subArnCode\" || label === \"subBrokerCode\") &&\n event.target.value.length <= 20\n ) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label === \"radioValue\" && event.target.value === \"no\") {\n if (!this.state.euinNo.value) {\n this.setState({\n radioValue: { value: event.target.value },\n });\n } else {\n this.setState({\n [label]: { value: event.target.value },\n euinNo: { value: \"\" },\n });\n }\n } else if (\n label !== \"subArnCode\" &&\n label !== \"subBrokerCode\" &&\n label === \"radioValue\" &&\n event.target.value !== \"no\"\n ) {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n\n handleSwitchValueChange(event) {\n if (event.target.value.length <= 10) {\n this.setState({\n amount: { value: event.target.value.replace(/^0+/, \"\") },\n });\n }\n }\n\n changeSwitchType = (value) => () => {\n if (value === FULL) {\n this.setState({\n switchType: FULL,\n switchMode: UNITS,\n amount: {\n value: !!this.state.scheme.value\n ? this.state.scheme.value.value.BalUnits\n : \"\",\n },\n });\n }\n if (value === PARTIAL) {\n this.setState({\n switchType: PARTIAL,\n amount: { value: \"\" },\n });\n }\n };\n changeSwitchMode = (value) => () => {\n if (value === AMOUNT) {\n this.setState({\n switchMode: AMOUNT,\n amount: { value: \"\" },\n });\n }\n if (value === UNITS) {\n this.setState({\n switchMode: UNITS,\n amount: { value: \"\" },\n });\n }\n };\n showError = (label) => () => {\n const {\n [label]: { value },\n } = this.state;\n if (!!this.state.scheme && !!this.state.scheme.value.value) {\n if (label === \"amount\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.switchMode === AMOUNT\n ? this.state.scheme.value.value.MinAmt > this.state.amount.value\n ? true\n : !value\n : this.state.scheme.value.value.BalUnits <\n this.state.amount.value\n ? true\n : !value,\n errorMessage:\n this.state.switchMode === AMOUNT\n ? this.state.scheme.value.value.MinAmt > this.state.amount.value\n ? `Minimum amount should be ₹ ${this.state.minAmount}`\n : \"\"\n : this.state.scheme.value.value.BalUnits <\n this.state.amount.value\n ? `You don't have enough Units To Redeem!`\n : \"\",\n },\n });\n }\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n\n submit = async () => {\n let currValue, currAmountValue;\n const {\n funds,\n fund,\n schemes,\n switchInSchemes,\n folios,\n switchType,\n switchMode,\n minAmount,\n categories,\n arnCode,\n subArnCode,\n subBrokerCode,\n euinNo,\n amount,\n radioValue,\n isError,\n errorMessage,\n ...others\n } = this.state;\n if (this.state.amount.value === \"\") {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `Switch value is Mandatory*`,\n },\n });\n }\n const arn = this.state.arnCode.value.split(\"-\");\n const keys = Object.keys(others);\n if (!!this.state.scheme.value) {\n currValue = parseFloat(\n this.state.scheme.value.value.CurValue.replace(/,/g, \"\")\n );\n }\n currAmountValue =\n this.state.switchType !== FULL\n ? parseFloat(this.state.amount.value.replace(/,/g, \"\"))\n : \"\";\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"folio\"\n ? \"Folio\"\n : key === \"scheme\"\n ? \"Scheme\"\n : key === \"category\"\n ? \"Category\"\n : key === \"switchInScheme\"\n ? \"Switch in Scheme\"\n : key\n } is Mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n // case \"fund\": {\n // this.fundField.focus();\n // break;\n // }\n case \"folio\": {\n this.folioField.focus();\n break;\n }\n case \"scheme\": {\n this.switchOutField.focus();\n break;\n }\n case \"category\": {\n this.category.focus();\n break;\n }\n case \"switchInScheme\": {\n this.switchInScheme.focus();\n break;\n }\n }\n } else if (arn[1] === this.state.subArnCode.value) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `and ARN code should not match `,\n },\n });\n } else if (this.state.amount.value === \"\") {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `Switch value is Mandatory*`,\n },\n });\n this.amountField.focus();\n } else if (\n (this.state.scheme.value.value.MinAmt > this.state.amount.value &&\n this.state.switchMode === AMOUNT) ||\n (this.state.scheme.value.value.BalUnits < this.state.amount.value &&\n this.state.switchMode === UNITS &&\n this.state.switchType === PARTIAL) ||\n (currValue < currAmountValue && this.state.switchMode === AMOUNT)\n ) {\n if (\n currValue < currAmountValue &&\n this.state.scheme.value.value.MinAmt < this.state.amount.value\n ) {\n this.setState({\n amount: {\n ...others[\"amount\"],\n isError: true,\n errorMessage: `You dont have enough amount to Switch plan`,\n },\n });\n } else if (\n this.state.scheme.value.value.MinAmt > this.state.amount.value &&\n this.state.switchMode === AMOUNT\n ) {\n this.setState({\n amount: {\n ...others[\"amount\"],\n isError: true,\n errorMessage: `Minimum Amount value is ₹ ${this.state.minAmount} `,\n },\n });\n this.amountField.focus();\n return;\n } else if (\n this.state.scheme.value.value.BalUnits < this.state.amount.value &&\n this.state.switchMode === UNITS\n ) {\n this.setState({\n ...others[\"amount\"],\n isError: true,\n errorMessage: `You dont have enough Units to Switch plan`,\n });\n }\n this.amountField.focus();\n return;\n } else if (\n this.state.radioValue.value === \"no\" &&\n this.state.euinNo.value === \"\"\n ) {\n this.setState({\n euinNo: { value: \"\", isError: true, errorMessage: `Choose EUIN` },\n });\n this.euinField.focus();\n } else {\n this.props.setSwitchDetails(this.state);\n const params = {\n amount: switchMode === AMOUNT ? this.state.amount.value : \"0\",\n fund: \"105\",\n plan: others.scheme.value.value.Pln,\n scheme: others.scheme.value.value.Sch,\n acno: others.scheme.value.value.Acno,\n trdt: moment(new Date()).format(\"MM/DD/YYYY\"),\n units: switchMode === UNITS ? this.state.amount.value : \"0\",\n ttrtype: PURCHASE,\n };\n const response = await this.props.getRedemptionPaymentDetails(params);\n if (response) {\n this.props.history.push({\n pathname: INVESTOR_URL + \"/transction-types/switch/confirm\",\n state: {\n title: \"Switch Payment Summary\",\n type: SWITCH,\n scheme: others.scheme.value.value,\n Folio: { value: others.scheme.value.value.Acno },\n switchInScheme: others.switchInScheme.value.value,\n fund: \"105\",\n switchMode,\n subArnCode: this.state.subArnCode.value,\n subBrokerCode: this.state.subBrokerCode.value,\n switchType,\n euin: this.state.euinNo.value,\n amount: this.state.amount.value,\n },\n });\n }\n }\n };\n\n render() {\n const {\n fund,\n funds = [],\n folio,\n folios = [],\n schemes = [],\n scheme,\n radioValue,\n arnCode,\n subArnCode,\n subBrokerCode,\n euinNo,\n categories,\n category,\n switchInScheme,\n switchInSchemes,\n amount,\n switchType,\n switchMode,\n } = this.state;\n const { euinList } = this.props;\n const checkMultiBrokerFlag =\n !!this.state.scheme &&\n !!this.state.scheme.value &&\n !!this.state.scheme.value.value &&\n !!this.state.scheme.value.value.multibrokflg &&\n this.state.scheme.value.value.multibrokflg === \"Y\";\n return (\n \n \n {\" \"}\n Note: This folio has multiple distributors. Hence, the balance units\n and current value will not be displayed.\n
\n )}\n Switch
\n\n \n ({\n label: item,\n value: item,\n }))}\n value={folio.value}\n placeholder=\"Select Folio\"\n handleChange={this.handleFolioChange}\n inputRef={(ele) => (this.folioField = ele)}\n isError={folio.isError}\n errorMessage={folio.errorMessage}\n />\n
\n Folio*
\n \n ({\n value: item,\n label: item.PlnDesc\n ? `${item.SchDesc1} - ${item.PlnDesc} - ${item.OptDesc}`\n : item.fm_schdesc,\n }))}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n handleChange={this.handleSchemeChange}\n disabled={!folio.value}\n inputRef={(ele) => (this.switchOutField = ele)}\n isError={scheme.isError}\n errorMessage={scheme.errorMessage}\n />\n
\n Switch out Scheme*
\n \n
\n {!!checkMultiBrokerFlag && (\n \n {!checkMultiBrokerFlag &&
\n Balance Units
}\n {!checkMultiBrokerFlag && Current Value
}\n NAV as on Date
\n Minimum Amount (INR)
\n \n {!checkMultiBrokerFlag && (\n
\n \n {!!scheme && !!scheme.value ? scheme.value.value.BalUnits : \"\"}\n
\n )}\n {!checkMultiBrokerFlag && (\n \n {!!scheme && !!scheme.value\n ? `₹${scheme.value.value.CurValue}`\n : \"\"}\n
\n )}\n \n {!!scheme && !!scheme.value ? scheme.value.value.LastNAV : \"\"}\n
\n \n {!!scheme && !!scheme.value\n ? `₹${scheme.value.value.MinAmt}`\n : \"\"}\n
\n \n (this.category = ele)}\n isError={category.isError}\n disabled={!scheme.value}\n errorMessage={category.errorMessage}\n >\n {categories.map((item, index) => (\n \n ))}\n \n
\n\n \n ({\n label: item.fm_schdesc,\n value: item,\n }))}\n label=\"Fund\"\n handleChange={this.handleSwitchInSchemeChange}\n value={switchInScheme.value}\n placeholder=\"Select Switch in Scheme\"\n disabled={!category.value}\n inputRef={(ele) => (this.switchInScheme = ele)}\n isError={switchInScheme.isError}\n errorMessage={switchInScheme.errorMessage}\n />\n
\n\n Switch in Scheme*
\n \n
\n\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n disabled={!fund.value}\n isShowError={subArnCode.isError}\n errorMessage={subArnCode.errorMessage}\n value={subArnCode.value}\n onBlur={\n !!fund.value ? this.validateBrokerCode(fund.value.value.Fund) : \"\"\n }\n onChange={this.changeValue(\"subArnCode\")}\n />\n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n value={subBrokerCode.value}\n onChange={this.changeValue(\"subBrokerCode\")}\n />\n
\n\n \n \n \n \n
\n\n {radioValue.value === \"no\" ? (\n EUIN Declaration*
\n \n
\n YES
\n \n
\n \n NO
\n \n ({\n label: item.abm_agent,\n value: item.abm_agent,\n }))}\n label=\"Fund\"\n handleChange={this.changeEuin}\n value={euinNo.value}\n disabled={!euinList.length}\n placeholder=\"Choose EUIN\"\n inputRef={(ele) => (this.euinField = ele)}\n isError={euinNo.isError}\n errorMessage={switchInScheme.errorMessage}\n />\n
\n ) : (\n \n I/We hereby confirm that the EUIN Declaration box has been\n intentionally left the blank by me/us as this is an 'execution-only'\n transaction without any interaction or advice by any personnel of\n the above distributor or notwithstanding the advice of\n in-appropriateness,if any provided by any personnel of the\n distributor and the distributor has not charged any advisory fees on\n this transaction\n
\n )}\n\n Switch Type
\n \n
\n\n Switch Mode
\n \n
\n\n \n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }) => {\n const { fundList, token, userId, investorData, communicationDetails } =\n authReducer;\n const { euinList, switchDetails = {} } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n switchDetails,\n investorData,\n communicationDetails,\n };\n },\n {\n validateSubBroker,\n getNewPurchaseFundList,\n getOtherSchemes,\n setSwitchDetails,\n getAssetClasses,\n getRedemptionPaymentDetails,\n }\n)(switchComponent);\n","export function parseDate(dateString) {\n const [day, month, year] = dateString.split(\"/\").map(Number);\n return new Date(year, month - 1, day);\n}\n\nexport function calculateTopUpDates(OTM,sipStartDateObj, sipEndDateObj, topUpFrequency = 6, currentDate) {\n // const sipStartDateObj = sipStartDate ? parseDate(sipStartDate) : null;\n // const sipEndDateObj = sipEndDate ? parseDate(sipEndDate) : null;\n const currentDateObj = currentDate ? parseDate(currentDate) : new Date();\n\n let minTopUpDate = null;\n let maxTopUpDate = null;\n\n if (sipStartDateObj) {\n const monthsDifference = getMonthsDifference(sipStartDateObj, currentDateObj);\n\n if (monthsDifference > 6) {\n minTopUpDate = addDays(currentDateObj, OTM);\n const cycleDay = sipStartDateObj.getDate();\n\n if (minTopUpDate.getDate() > cycleDay) {\n minTopUpDate.setMonth(minTopUpDate.getMonth() + 1);\n }\n\n minTopUpDate.setDate(cycleDay);\n\n maxTopUpDate = addDays(minTopUpDate, 100);\n } else {\n minTopUpDate = addMonths(sipStartDateObj, 6);\n maxTopUpDate = addDays(minTopUpDate, 100);\n }\n\n let minTopUpEndDate = addMonths(minTopUpDate, topUpFrequency === 6 ? 5 : 11);\n minTopUpEndDate.setDate(sipStartDateObj.getDate());\n minTopUpEndDate.setHours(0,0,0,0);\n\n const topUpEndDate = sipEndDateObj ? sipEndDateObj : null;\n\n /*\n return {\n minTopUpDate: minTopUpDate,\n maxTopUpDate: maxTopUpDate,\n topUpStartDate: {\n day: minTopUpDate ? minTopUpDate.getDate() : null,\n month: topUpStartMonth,\n year: topUpStartYear,\n },\n topUpEndDate: sipEndDateObj ? sipEndDateObj : null,\n };\n */\n return {\n sipDay : sipStartDateObj.getDate(),\n minTopUpDate: minTopUpDate,\n maxTopUpDate: maxTopUpDate,\n topUpStartDate: {\n day: minTopUpDate ? minTopUpDate.getDate() : null,\n month: minTopUpDate ? minTopUpDate.getMonth() + 1 : null,\n year: minTopUpDate ? minTopUpDate.getFullYear() : null,\n },\n minTopUpEndDate: minTopUpEndDate,\n maxTopUpEndDate: topUpEndDate,\n };\n }\n\n return {\n minTopUpDate: null,\n maxTopUpDate: null,\n topUpStartDate: null,\n minTopUpEndDate: null,\n maxTopUpEndDate: null,\n };\n}\n\nfunction addMonths(date, months) {\n const newDate = new Date(date);\n newDate.setMonth(newDate.getMonth() + months);\n return newDate;\n}\n\nfunction addDays(date, days) {\n const newDate = new Date(date);\n newDate.setDate(newDate.getDate() + days);\n return newDate;\n}\n\nfunction getMonthsDifference(startDate, endDate) {\n const yearsDiff = endDate.getFullYear() - startDate.getFullYear();\n const monthsDiff = endDate.getMonth() - startDate.getMonth();\n return yearsDiff * 12 + monthsDiff;\n}\n\nfunction formatDate(date) {\n const day = String(date.getDate()).padStart(2, \"0\");\n const month = String(date.getMonth() + 1).padStart(2, \"0\");\n const year = date.getFullYear();\n return `${day}/${month}/${year}`;\n}\n","import React, { Component } from \"react\";\nimport Signbutton from \"../../forms/button\";\nimport { Input } from \"../../forms/input\";\nimport CustomizedDialogs from \"../customModal\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport { connect } from \"react-redux\";\nimport { SIPSaveTopup } from \"shared/store/actions\";\nimport { NEW_TRANSACTION_URL } from \".\";\nimport {\n KeyboardDatePicker,\n MuiPickersUtilsProvider,\n} from \"@material-ui/pickers\";\nimport moment from \"moment\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport addMonths from \"date-fns/addMonths\";\nimport { calculateTopUpDates, parseDate } from \"./utils\";\nimport CustomLoader from \"../../forms/customLoader\";\n\nconst TopUpInputFields = {\n dates: [\n {\n name: \"TOP-UP Start Date\",\n type: \"date\",\n placeholder: \"Select TOP-UP Start Date\",\n isMandatory: true,\n listName: \"topUpStartDate\",\n },\n {\n name: \"TOP-UP End Date\",\n type: \"date\",\n placeholder: \"Select TOP-UP End Date\",\n isMandatory: true,\n listName: \"topUpEndDate\",\n },\n ],\n others: [\n {\n name: \"Frequency\",\n type: \"radio\",\n options: [\"Quarterly\", \"Half-Yearly\", \"Yearly\"],\n isMandatory: true,\n listName: \"topUpFrequency\",\n },\n {\n name: \"TOP-UP Amount\",\n type: \"number\",\n placeholder: \"Enter Amount\",\n isMandatory: true,\n listName: \"topUpAmount\",\n },\n {\n name: \"TOP-UP CAP Amount\",\n type: \"number\",\n placeholder: \"Enter Amount\",\n isMandatory: true,\n listName: \"topUpCAPAmount\",\n },\n ],\n};\n\nclass Sip extends Component {\n constructor(props) {\n super(props);\n // this.state = {\n // topUp: { value: \"Yes\" },\n // topUpFrequency: { value: \"Half-Yearly\" },\n // topUpAmount: { value: \"\" },\n // topUpStartDate: { value: null, minDate: null, maxDate: null },\n // topUpEndDate: { value: null, disabled: true, minDate: null, maxDate: null },\n // topupStDt: {},\n // startDate: parseDate(this.props.location.state.scheme.Start_Date),\n // endDate: parseDate(this.props.location.state.scheme.End_Date),\n // };\n const { Start_Date, End_Date, Scheme: schemeCatagory } = this.props.location.state.scheme;\n\n const startDate = parseDate(Start_Date);\n const endDate = parseDate(End_Date);\n const OTM = this.props.location.state.scheme?.Enachflag === 2 ? 5 : 10\n const topUpDates = calculateTopUpDates(OTM, startDate, endDate);\n // console.log(\"Consot\", topUpDates);\n this.state = {\n sipStartDate: startDate,\n sipEndDate: endDate,\n topUp: { value: \"Y\" },\n topUpFrequency: { value: \"Half-Yearly\" },\n topUpAmount: { value: \"\" },\n topUpInstallments: { value: \"\" },\n topUpCAPAmount: { value: \"\" ,display:true},\n topUpStartDate: {\n value: null,\n minDate: topUpDates.minTopUpDate.setHours(0, 0, 0, 0),\n maxDate: topUpDates.maxTopUpDate.setHours(0, 0, 0, 0),\n },\n topUpEndDate: {\n value: null,\n disabled: true,\n minDate: topUpDates.minTopUpEndDate.setHours(0, 0, 0, 0),\n maxDate: topUpDates.maxTopUpEndDate.setHours(0, 0, 0, 0),\n display:false\n },\n\n startDate: parseDate(Start_Date),\n endDate: parseDate(End_Date),\n open: false,\n sipRefNo: { value: \"\" },\n loader: false,\n schemeCatagory,\n topUpFieldType:\"endDate\",\n };\n }\n\n async componentDidMount() {\n window.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n }\n\n showError = (label, name) => async (event) => {\n const multiplier = this.state.schemeCatagory.trim() === \"TG\" ? 500 : 100;\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"topUpAmount\") {\n if (\n this.state.topUp.value === \"Y\" && \n Number(this.state.topUpAmount.value) < (this.state.schemeCatagory.trim() === \"TG\" ? 500 : 100)\n ) {\n this.setState({\n topUpAmount: {\n ...this.state.topUpAmount,\n isError: true,\n errorMessage: `Amount should be greater than or equal to ${this.state.schemeCatagory.trim() === \"TG\" ? 500 : 100}`,\n },\n });\n return;\n }\n if (\n this.state.topUp.value === \"Y\" &&\n Number(this.state.topUpAmount.value) % multiplier !== 0\n ) {\n this.setState({\n topUpAmount: {\n ...this.state.topUpAmount,\n isError: true,\n errorMessage: `Amount should be in multiples of ${multiplier}`,\n },\n });\n return;\n }\n }\n else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n errorMessage: `${label} is mandatory`,\n },\n });\n }\n };\n\n handleChange = (label, name = \"\") => async (event) => {\n const { schemeList } = this.state;\n const value = event.target.value;\n if (!value) {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `${name ? name : label} is Mandatory`,\n },\n });\n return;\n }\n this.setState({\n [label]: {\n value,\n isError: false,\n errorMessage: \"\",\n },\n });\n };\n\n handleMinandMaxDate = (field, value) => {\n if (field === \"topUpFrequency\") {\n const monthsMapping = {\n \"Quarterly\": 2,\n \"Half-Yearly\": 5,\n Yearly: 11,\n };\n if (value === \"Yearly\") {\n const date = new Date()\n date.setFullYear(date.getFullYear() + 1);\n const endDate = new Date(this.props.location.state.scheme?.End_Date)\n if (date > endDate) {\n alert(\"Top-up End Date should not be exceed SIP End date\")\n return;\n }\n }\n const monthsToAdd = monthsMapping[value];\n if (monthsToAdd) {\n const topUpDates = calculateTopUpDates(\n this.props.location.state.scheme?.Enachflag === 2 ? 5 : 10,\n this.state.sipStartDate,\n this.state.sipEndDate,\n monthsToAdd\n );\n // console.log(\"Calculated topup dates\", topUpDates, this.state.sipStartDate, this.state.sipEndDate)\n this.setState({\n topUpStartDate: {\n minDate: topUpDates.minTopUpDate.setHours(0, 0, 0, 0),\n maxDate: topUpDates.maxTopUpDate.setHours(0, 0, 0, 0),\n value: null,\n disabled: false,\n isError: false,\n errorMessage: \"\",\n },\n topUpEndDate: {\n minDate: topUpDates.minTopUpEndDate.setHours(0, 0, 0, 0),\n maxDate: topUpDates.maxTopUpEndDate.setHours(0, 0, 0, 0),\n value: null,\n disabled: true,\n isError: false,\n errorMessage: \"\",\n },\n topUpFrequency: {\n value: value,\n }\n });\n }\n }\n };\n\n handleTopUpDate = (date, fieldName) => {\n // console.log(date, this.state?.sipEndDate, fieldName);\n // if (date > this.state?.sipEndDate) {\n // const dateType = fieldName === \"topUpStartDate\" ? \"start\" : \"end\";\n // alert(`Topup ${dateType} date should not exceed SIP end date`);\n // return;\n // }\n if (date) {\n const updatedDate = moment(date).format(\"DD/MM/YYYY\").split(\"/\");\n if (fieldName === \"topUpStartDate\") {\n const topUpFrequencyValue =\n this.state[\"topUpFrequency\"].value === \"Yearly\" ? 12 : this.state[\"topUpFrequency\"].value === \"Quarterly\" ? 3 : 6;\n\n const adjustedMinDate = addMonths(date, topUpFrequencyValue);\n // console.log(\n // \"Adjusted end min\",\n // adjustedMinDate,\n // \",\",\n // this.state[\"topUpEndDate\"].maxDate,\n // adjustedMinDate > this.state[\"topUpEndDate\"].maxDate\n // );\n if (adjustedMinDate > this.state[\"topUpEndDate\"].maxDate) {\n // this.setState({\n // topUpStartDate: {\n // ...this.state[\"topUpStartDate\"],\n // value: date,\n // errorMessage: \"\",\n // },\n\n // topUpEndDate: {\n // ...this.state[\"topUpEndDate\"],\n // minDate: adjustedMinDate,\n // // minDate: new Date().setFullYear(topUpEndYear.toString(), (topUpEndMonth - 1).toString(), updatedDate[0])\n // value: null,\n // disabled: true,\n // isError: true,\n // errorMessage: \"Top-up Start Date should not exceed SIP End Date\",\n // },\n // });\n alert(\"Top-up Start Date is invalid as the Top-up End Date exceeds the SIP End Date based on the selected Top-up frequency\")\n } else {\n this.setState({\n topUpStartDate: {\n ...this.state[\"topUpStartDate\"],\n value: date,\n errorMessage: \"\",\n },\n\n topUpEndDate: {\n ...this.state[\"topUpEndDate\"],\n minDate: adjustedMinDate.setHours(0, 0, 0, 0),\n // minDate: new Date().setFullYear(topUpEndYear.toString(), (topUpEndMonth - 1).toString(), updatedDate[0])\n value: null,\n disabled: false,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n }\n\n if (fieldName === \"topUpEndDate\") {\n const numberofInstallments = calculateMonthsGap(this.state.topUpStartDate.value, date)\n this.setState({\n topUpInstallments: { value: numberofInstallments },\n topUpEndDate: {\n ...this.state[\"topUpEndDate\"],\n value: date,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n } else {\n if (fieldName === \"topUpStartDate\") {\n this.setState({\n topUpStartDate: {\n ...this.state[\"topUpStartDate\"],\n value: null,\n isError: true,\n errorMessage: \"TOP-UP Start Date is Mandatory\",\n },\n topUpEndDate: {\n ...this.state[\"topUpEndDate\"],\n minDate: null,\n value: null,\n disabled: true,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n if (fieldName === \"topUpEndDate\") {\n this.setState({\n topUpEndDate: {\n ...this.state[\"topUpEndDate\"],\n value: null,\n isError: true,\n errorMessage: \"TOP-UP End Date is Mandatory\",\n },\n });\n }\n }\n };\n\n shouldDisableTopUpDate = (date, fieldName) => {\n // console.log(\"Should disable\", date, fieldName)\n if (date) {\n const updatedDate = moment(date).format(\"DD/MM/YYYY\").split(\"/\");\n const formattedDate = new Date(\n updatedDate[2],\n updatedDate[1] - 1,\n updatedDate[0]\n );\n const { minDate, maxDate } = this.state[fieldName];\n\n if (fieldName === \"topUpStartDate\") {\n if (minDate && maxDate) {\n const minDateObj = new Date(minDate).setHours(0, 0, 0, 0);\n const maxDateObj = new Date(maxDate).setHours(0, 0, 0, 0);\n // console.log(\"Should disable\", formattedDate < minDateObj ,\n // formattedDate > maxDateObj ,\n // date.getDate() !== Number(this.state.sipStartDate.getDate()))\n // if(date.getDate() === Number(this.state.sipStartDate.getDate())\n // )\n // {\n // console.log(\"GormatedDate\", formattedDate, minDateObj)\n // }\n return (\n formattedDate < minDateObj ||\n formattedDate > maxDateObj ||\n date.getDate() !== Number(this.state.sipStartDate.getDate())\n );\n }\n\n return;\n }\n\n if (fieldName === \"topUpEndDate\") {\n if (minDate && maxDate) {\n const minDateObj = new Date(minDate);\n const maxDateObj = new Date(maxDate);\n // console.log(\"should disable end\",formattedDate, maxDateObj)\n return (\n formattedDate < minDateObj ||\n formattedDate > maxDateObj ||\n date.getDate() !== Number(this.state.sipStartDate.getDate())\n );\n }\n }\n }\n };\n schemeDetails = [\n { label: \"Folio\", value: this.props.location.state.folio.label },\n { label: \"Scheme\", value: this.props.location.state.scheme.Schdesc },\n {\n label: \"Number of Installments\",\n value: this.props.location.state.scheme.Noofinst,\n },\n { label: \"Frequency\", value: this.props.location.state.scheme.Frequency },\n { label: \"Start Date\", value: this.props.location.state.scheme.Start_Date },\n { label: \"End Date\", value: this.props.location.state.scheme.End_Date },\n ];\n submit = async () => {\n const { location, token, userId, SIPSaveTopup } = this.props;\n const { topUpAmount, topUpStartDate, topUpEndDate } = this.state;\n const scheme = location.state.scheme;\n const multiplier = this.state.schemeCatagory.trim() === \"TG\" ? 500 : 100;\n\n\n const requiredFields = [\n {\n field: topUpAmount,\n key: \"topUpAmount\",\n error: \"TOP-UP Amount is Mandatory\",\n },\n {\n field: topUpStartDate,\n key: \"topUpStartDate\",\n error: \"TOP-UP Start Date is Mandatory\",\n },\n ];\n if (this.state.topUpFieldType === \"endDate\" && !this.state.topUpEndDate.value) {\n this.setState({\n topUpEndDate: {\n ...this.state.topUpEndDate,\n isError: true,\n errorMessage: \"TOP-UP End Date is Mandatory\",\n },\n });\n }\n for (const { field, key, error } of requiredFields) {\n if (!field.value) {\n this.setState({\n [key]: { ...field, value: \"\", isError: true, errorMessage: error },\n });\n return;\n }\n }\n if (\n this.state.topUp.value === \"Y\" && \n Number(this.state.topUpAmount.value) < (this.state.schemeCatagory.trim() === \"TG\" ? 500 : 100)\n ) {\n this.setState({\n topUpAmount: {\n ...this.state.topUpAmount,\n isError: true,\n errorMessage: `Amount should be greater than or equal to ${this.state.schemeCatagory.trim() === \"TG\" ? 500 : 100}`,\n },\n });\n return;\n }\n else if (\n this.state.topUp.value === \"Y\" &&\n Number(this.state.topUpAmount.value) % multiplier !== 0\n ) {\n this.setState({\n topUpAmount: {\n ...this.state.topUpAmount,\n isError: true,\n errorMessage: `Amount should be in multiples of ${multiplier}`,\n },\n });\n return;\n }\n if (\n this.state.topUp.value === \"Y\" &&\n Number(this.state.topUpAmount.value) > Number(this.state.topUpCAPAmount.value) && this.state.topUpFieldType === \"capAmount\"\n ) {\n this.setState({\n topUpCAPAmount: {\n ...this.state[\"topUpCAPAmount\"],\n isError: true,\n errorMessage: \"CAP amount should be greater than the TOP-UP SIP amount\",\n },\n });\n return;\n }\n if (\n this.state.topUp.value === \"Y\" && (scheme.SIPType === 1 || scheme.SIPType === 2) && this.state.topUpFieldType === \"capAmount\" &&\n Number(this.state.topUpCAPAmount.value) > scheme.MandateAmount\n ) {\n this.setState({\n topUpCAPAmount: {\n ...this.state[\"topUpCAPAmount\"],\n isError: true,\n errorMessage: `TOP-UP CAP Amount should not be greater than Mandate Amount ${scheme.MandateAmount}`,\n },\n });\n return;\n }\n if (\n this.state.topUp.value === \"Y\" && (scheme.SIPType === 1 || scheme.SIPType === 2) &&\n Number(this.state.topUpAmount.value) > scheme.MandateAmount\n ) {\n this.setState({\n topUpAmount: {\n ...this.state[\"topUpAmount\"],\n isError: true,\n errorMessage: `Amount should not be greater than Mandate Amount ${scheme.MandateAmount}`,\n },\n });\n return;\n }\n const params = {\n id: \"1\",\n Fund: \"105\",\n Folio: location.state.folio.value.Acno,\n SchemeCode: scheme.Scheme + scheme.Plan,\n Option1: scheme.Option,\n Brokercode: token,\n Subbroker: scheme?.Subbroker,\n Euinno: scheme?.Euincode,\n EuinDeclaration: scheme?.EUINFlag,\n Frequency: scheme.Frequency,\n NoofInstalment: scheme.Noofinst,\n SIPStartDate: convertDateFormat(scheme.Start_Date),\n SIPEndDate: convertDateFormat(scheme.End_Date),\n BankName: scheme.Bankacname,\n EntBy: userId,\n EntDt: moment().format(\"MM/DD/YYYY\"),\n InstAmount: scheme.Amount,\n InvDistFlag: \"P\",\n Subbrokerarn: scheme.SubBrokerArn,\n Scheduleddt: \"\",\n Icustomfund: \"105\",\n Umrn: scheme.Urnno,\n Topupflag: this.state.topUp.value,\n TopupFrequency:\n this.state.topUpFrequency.value === \"Half-Yearly\" ? \"H\" : this.state.topUpFrequency.value === \"Quarterly\" ? \"Q\" : \"Y\",\n TopupAmount: topUpAmount.value,\n TopupStartDate: new Date(topUpStartDate.value).toLocaleString(\"en-US\", {\n year: \"numeric\",\n month: \"2-digit\",\n day: \"2-digit\",\n }),\n TopupEnddate: this.state.topUpFieldType === \"endDate\" ?new Date(topUpEndDate.value).toLocaleString(\"en-US\", {\n year: \"numeric\",\n month: \"2-digit\",\n day: \"2-digit\",\n }):\"\",\n TopupnoofInstallment: this.state.topUpInstallments.value,\n Topupmaxamount:this.state.topUpFieldType === \"capAmount\" ?this.state.topUpCAPAmount.value:\"\",\n OldIhno: scheme.Ihno,\n SipFlag: \"T\",\n Enachflag: scheme.Enachflag,\n SIPType: scheme.SIPType.toString(),\n trtype:scheme?.trtype.trim()\n };\n console.log(\"params\", params);\n this.setState({\n loader: true,\n });\n\n const response = await SIPSaveTopup(params);\n if (response) {\n this.setState({\n open: true,\n sipRefNo: {\n value: `${response.DtData[0].Scheme.trim()}${response.DtData[0].Pln.trim()}${response.DtData[0].Opt.trim()}${response.DtData[0].refno\n }`,\n },\n disabled: false,\n });\n }\n this.setState({\n loader: false,\n });\n };\n\n closeModal = () => {\n this.setState({\n open: false,\n });\n this.props.history.replace(NEW_TRANSACTION_URL);\n };\n render() {\n console.log(\"Rendering location state\", this.props.location.state);\n console.log(\"Rendering state\", this.state);\n const type = this.props.location.state.type;\n return (\n \n
\n {this.state[\"topUp\"]?.value === \"Y\" && (\n TOP-UP SIP
\n \n
\n\n \n
\n \n {this.schemeDetails.map((detail, index) => (\n
\n \n {detail.label}:\n {detail.value}\n
\n ))}\n \n {TopUpInputFields.others.map((field) => (\n \n {field.type === \"radio\" ? (\n \n \n {\n const value = e.target.value;\n this.setState(\n // {\n // topUpFrequency: {\n // value: value,\n // },\n // },\n () => {\n this.handleMinandMaxDate(field.listName, value);\n }\n );\n }}\n >\n {field.options.map((item) => {\n return (\n \n
\n ) : (\n \n {field.name}{\" \"}\n {field.isMandatory && (\n *\n )}\n
\n \n
\n );\n })}\n \n {item}
\n \n \n {this.state.schemeCatagory.trim() === \"TG\" ? \"Minimum Amount : 500\" : \"Minimum Amount : 100\"}\n
\n {this.props.location.state.scheme.MandateAmount && (this.props.location.state.scheme.SIPType === 1 || this.props.location.state.scheme.SIPType === 2) ? `Maximum : ₹ ${this.props.location.state.scheme.MandateAmount}` : \"\"}\n
\n {this.state.schemeCatagory.trim() === \"TG\" ? \"Multiple of : ₹ 500\" : \"\"}\n\n \n )}\n
\n )}\n \n ))}\n \n {this.props.location.state.scheme.MandateAmount && (this.props.location.state.scheme.SIPType === 1 || this.props.location.state.scheme.SIPType === 2) ? `Maximum : ₹ ${this.props.location.state.scheme.MandateAmount}` : \"\"}\n
\n {this.state.schemeCatagory.trim() === \"TG\" ? \"Multiple of : ₹ 500\" : \"\"}\n\n \n )}\n
\n \n {\n const value = e.target.value; // Safely capture the value\n if (value) {\n this.setState((prevState) => ({\n topUpCAPAmount: { ...prevState.topUpCAPAmount, display: value === \"endDate\" },\n topUpEndDate: { ...prevState.topUpEndDate, display: value !== \"endDate\" },\n topUpFieldType: value,\n }));\n } else {\n console.error(\"Unexpected value in onChange:\", e);\n }\n }}\n >\n \n
\n \n
\n End Date
\n \n
\n \n Cap Amount
\n \n {TopUpInputFields.dates.map((field) => (\n \n <>\n \n {field.name}{\" \"}\n {field.isMandatory && (\n *\n )}\n
\n {/* {(() => {\n console.log(\"Field Name:\", field.listName);\n console.log(\n \"Field Value:\",\n this.state[field.listName].value\n );\n console.log(\n \"Min Date:\",\n this.state[field.listName].minDate\n );\n console.log(\n \"Max Date:\",\n this.state[field.listName].maxDate\n );\n console.log(\n \"Is Disabled:\",\n this.state[field.listName].disabled\n );\n console.log(\n \"Is Error:\",\n this.state[field.listName].isError\n );\n console.log(\n \"Error Message:\",\n this.state[field.listName].errorMessage\n );\n })()} */}\n \n Number of Top up installments : {this.state.topUpInstallments.value}\n
\n } */}\n\n \n
\n \n \n
\n )}\n SIP (Existing Folio)
\n \n (this.sipTypeField = ele)}\n isError={sipType.isError}\n errorMessage={sipType.errorMessage}\n >\n {sipTypes.map((item, index) => (\n \n ))}\n \n
\n\n {(sipType.value === NEW || sipType.value === NEWP) && (\n \n
\n )}\n\n {/* \n (this.invNameField = ele)}\n />\n
\n \n ({\n label: item.family_description,\n value: item.family_code,\n }))}\n value={Family_Code_Email.value}\n placeholder=\"Select Family Description\"\n handleChange={this.FamilyDescriptionEmail}\n isError={Family_Code_Email.isError}\n errorMessage={Family_Code_Email.errorMessage}\n />\n
\n \n Email Family Description\n
\n \n (this.emailField = ele)}\n />\n
\n \n ({\n label: item.family_description,\n value: item.family_code,\n }))}\n value={Family_Code_Phone.value}\n placeholder=\"Select Phone Description\"\n handleChange={this.FamilyDescriptionPhone}\n isError={Family_Code_Phone.isError}\n errorMessage={Family_Code_Phone.errorMessage}\n />\n
\n\n \n Mobile Family Description\n
\n \n (this.codeField = ele)}\n />\n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n type=\"number\"\n onChange={this.changeValue(\"mobile\")}\n onBlur={this.showError(\"mobile\")}\n isShowError={mobile.isError}\n errorMessage={mobile.errorMessage}\n inputref={(ele) => (this.mobileField = ele)}\n />\n
\n \n
*/}\n {(sipType.value === EXISTING || sipType.value === EXISTINGP) && (\n AMC
\n \n
\n )}\n\n {(schemeType === NEW ||\n sipType.value === NEW ||\n sipType.value === NEWP) && (\n \n ({\n label: item,\n value: item,\n }))}\n value={folio.value}\n placeholder=\"Select Folio\"\n handleChange={this.handleFolioChange}\n inputRef={(ele) => (this.folioField = ele)}\n disabled={!fund.value}\n isError={folio.isError}\n errorMessage={folio.errorMessage}\n />\n
\n Folio*
\n Select Scheme Type
\n \n
\n \n (this.categoryField = ele)}\n isError={category.isError}\n errorMessage={category.errorMessage}\n >\n {categories.map((item, index) => (\n \n ))}\n \n
\n )}\n \n ({\n label: item.PlnDesc\n ? `${item.SchDesc1} - ${item.PlnDesc} - ${item.OptDesc}`\n : item.fm_schdesc,\n value: item,\n }))}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n // handleInputchange={this.handleInputChange}\n handleChange={this.handleSchemeChange}\n disabled={\n schemeType === EXISTING &&\n (sipType.value === EXISTING || sipType.value === EXISTINGP)\n ? !folio.value\n : !category.value\n }\n inputRef={(ele) => (this.schemeField = ele)}\n isError={scheme.isError}\n errorMessage={scheme.errorMessage}\n />\n
\n\n Scheme*
\n \n
\n\n \n
\n\n \n
\n\n \n \n \n \n
\n {radioValue.value === \"no\" ? (\n EUIN Declaration*
\n \n
\n YES
\n \n
\n \n NO
\n \n ({\n value: item.abm_agent,\n label: item.abm_agent,\n }))}\n value={euinNo.value}\n placeholder=\"Select EUIN\"\n errorMessage={euinNo.errorMessage}\n handleChange={this.changeEuin}\n disabled={!euinList.length}\n inputRef={(ele) => (this.euinField = ele)}\n isError={euinNo.isError}\n />\n
\n ) : (\n \n I/We hereby confirm that the EUIN box has been intentionally left\n the blank by me/us as this is an 'execution-only' transaction\n without any interaction or advice by any personnel of the above\n distributor or notwithstanding the advice of in-appropriateness,if\n any provided by any personnel of the distributor and the distributor\n has not charged any advisory fees on this transaction\n
\n )}\n\n \n (this.investmentFrequency = ele)}\n isError={investmentFrequency.isError}\n errorMessage={investmentFrequency.errorMessage}\n >\n {frequencies.map((item, index) => (\n \n ))}\n \n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n value={installmentAmount.value}\n onChange={this.changeValue(\"installmentAmount\")}\n type=\"number\"\n onBlur={this.getMinimumInstallments}\n isShowError={installmentAmount.isError}\n inputref={(ele) => (this.installmentAmount = ele)}\n errorMessage={installmentAmount.errorMessage}\n />\n
\n\n \n (this.installmentsField = ele)}\n errorMessage={installments.errorMessage}\n />\n
\n \n \n {modes.map((item, index) => (\n \n ))}\n \n
\n {kotm && (\n \n
\n )}\n {kotm && (\n \n (this.kotmField = ele)}\n isError={selectedKotm.error}\n errorMessage={selectedKotm.errorMessage}\n disabled={this.state?.umrn.length === 1 ? true : false}\n >\n {this.state.umrn.map((item, index) => (\n \n ))}\n \n
\n \n {this.state?.umrn.length === 1 &&\n
\n The investor has only one active {this.state.mode.value} mandate.
\n }\n \n
\n )}\n\n \n
\n Mandate amount limit
\n Start Date
\n End Date
\n Bank Name
\n Bank Account No
\n \n
\n \n {selectedKotm.value ? selectedKotm.value.Amt : \"\"}\n (INR)\n
\n \n {selectedKotm.value\n ? selectedKotm.value[\"MANDATE START DATE\"]\n : \"\"}{\" \"}\n
\n \n {selectedKotm.value\n ? selectedKotm.value[\"MANDATE END DATE\"]\n : \"\"}\n
\n \n {selectedKotm.value ? selectedKotm.value[\"BANK NAME\"] : \"\"}\n
{\" \"}\n \n {selectedKotm.value ? selectedKotm.value[\"BANK A/C NO\"] : \"\"}\n
\n \n ({\n value: item.sip_cycleid,\n label: item.sip_cycleid,\n }))}\n value={sipDay.value}\n placeholder=\"SIP Day\"\n handleChange={this.changeSipDay}\n disabled={!investmentFrequency.value || !installments.value}\n inputRef={(ele) => (this.sipDay = ele)}\n isError={sipDay.isError}\n errorMessage={sipDay.errorMessage}\n />\n
\n\n SIP Date*
\n \n
\n\n \n
\n {!!sipDay && !!sipDay.value && (\n \n Perpetual SIP\n
\n \n
\n\n {(sipType.value === NEW || sipType.value === EXISTINGP) && (\n \n
\n Minimum SIP Amount
\n {(sipType.value === NEW || sipType.value === EXISTINGP) && (\n Minimum Lumpsum Investment Amount
\n )}\n \n
\n \n {!!this.state.minAmountValue.value\n ? this.state.minAmountValue.value\n : \"\"}\n (₹)\n
\n {(sipType.value === NEW || sipType.value === EXISTINGP) && (\n {this.state.minimumLumpsumAmout}(₹)
\n )}\n \n \n TOP-UP DETAILS\n \n\n \n {\n const value = e.target.value;\n this.setState({\n ...this.state,\n topUp: {\n ...this.state[\"topUp\"],\n value: value,\n },\n topUpFrequency: {\n ...this.state[\"topUpFrequency\"],\n value: \"Half-Yearly\",\n isMandatory: value === \"Yes\" ? true : false,\n },\n topUpAmount: {\n ...this.state[\"topUpAmount\"],\n value: \"\",\n isMandatory: value === \"Yes\" ? true : false,\n },\n topUpStartDate: {\n ...this.state[\"topUpStartDate\"],\n value: null,\n isMandatory: value === \"Yes\" ? true : false,\n },\n topUpEndDate: {\n ...this.state[\"topUpEndDate\"],\n value: null,\n isMandatory: value === \"Yes\" ? true : false,\n },\n });\n }}\n >\n {[\"Yes\", \"No\"].map((item) => {\n return (\n \n
\n )}\n {this.state[\"topUp\"]?.value === \"Yes\" &&\n this.state[\"sip_start_date\"].value && (\n \n TOP-UP *\n
\n \n
\n );\n })}\n \n {item}
\n \n {TopUpInputFields.others.map((field) => (\n \n {field.type === \"radio\" ? (\n \n \n {\n const value = e.target.value;\n this.setState({\n topUpFrequency: {\n value: value,\n },\n }, () => {\n this.handleMinandMaxDate(field.listName, value)\n }\n );\n }}\n >\n {field.options.map((item) => {\n return (\n \n
\n ) : (\n \n {field.name}{\" \"}\n {field.isMandatory && (\n *\n )}\n
\n \n
\n );\n })}\n \n \n {item}\n
\n \n
\n Minimum Amount : {amountText}
\n \n )}\n
\n )}\n \n ))}\n \n Minimum Amount : {amountText}
\n \n )}\n
\n \n {\n const value = e.target.value; // Safely capture the value\n if (value) {\n this.setState((prevState) => ({\n topUpCapAmount: { ...prevState.topUpCapAmount, display: value === \"endDate\" },\n topUpEndDate: { ...prevState.topUpEndDate, display: value !== \"endDate\" },\n topUpFieldType: value,\n }));\n } else {\n console.error(\"Unexpected value in onChange:\", e);\n }\n }}\n >\n \n
\n\n \n
\n End Date
\n \n
\n \n Cap Amount
\n \n {TopUpInputFields.dates.map((field) => (\n \n <>\n \n {field.name}{\" \"}\n {field.isMandatory && (\n *\n )}\n
\n\n \n Number of Top up installments : {this.state.topUpInstallments.value}\n
\n } */}\n \n\n)}\n\n \n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }) => {\n const { fundList, token, userId, investorData, communicationDetails } =\n authReducer;\n const { euinList, fundsList, sipDetails = {} } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n investorData,\n communicationDetails,\n fundsList,\n sipDetails,\n };\n },\n {\n validateSubBroker,\n swpOptions,\n getNewPurchaseFundList,\n getOtherSchemes,\n getAssetClasses,\n CalcSIPEnddt,\n setSipDetails,\n getCheckPanKotm,\n getCheckPanAotm,\n submitPurchaseData,\n showPurchaseConfirmation,\n getMinimumAmount,\n }\n)(Sip);\nexport const family_description_codes = [\n {\n family_description: \"Self\",\n family_code: \"SE\",\n },\n {\n family_description: \"Spouse\",\n family_code: \"SP\",\n },\n {\n family_description: \"Dependent Children\",\n family_code: \"DC\",\n },\n {\n family_description: \"Dependent Siblings\",\n family_code: \"DS\",\n },\n {\n family_description: \"Dependent Parents\",\n family_code: \"DP\",\n },\n {\n family_description: \"Guardian\",\n family_code: \"GD\",\n },\n];\nexport const formatToFullDate = (inputDate) => {\n const [day, month, year] = inputDate.split('/');\n\n const date = new Date(`${year}-${month}-${day}T00:00:00`);\n\n return date;\n};","import React, { Component } from \"react\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport { YES, SWP } from \"shared/store/types\";\nimport {\n swpOptions,\n CalcSIPEnddt,\n getMinimumAmount,\n} from \"shared/store/actions\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport { INVESTOR_URL } from \"../investors\";\nimport { Checkbox } from \"@material-ui/core\";\nclass Swp extends Component {\n constructor(props) {\n super(props);\n this.state = {\n minAmountValue: { value: \"\" },\n fund: { value: { value: \"105\" } },\n folios: [],\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n swpOption: { value: \"\" },\n swpOptions: [],\n swpFrequency: { value: \"\" },\n swpFrequencyOptions: [],\n withdrawals: { value: \"\" },\n sipDay: { value: \"\" },\n sipStartDate: { value: \"\" },\n sipEndDate: { value: \"\" },\n amount: { value: \"\" },\n sipCycle: [],\n };\n }\n handleFundChange = (value) => {\n if (!value) {\n this.setState({\n fund: { value: \"\" },\n folios: [],\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n swpOption: { value: \"\" },\n swpOptions: [],\n swpFrequency: { value: \"\" },\n swpFrequencyOptions: [],\n withdrawals: { value: \"\" },\n sipDay: { value: \"\" },\n sipStartDate: { value: \"\" },\n sipEndDate: { value: \"\" },\n amount: { value: \"\" },\n sipCycle: [],\n perpetualSip: false,\n });\n } else if (value.value === \"105\") {\n return;\n } else {\n const fund = !!value ? value.value : \"\";\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.sFlag === YES && curr.Fund === fund) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n scheme: { value: \"\" },\n withdrawals: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n }\n };\n\n async componentDidMount() {\n window.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n this.getfolios();\n }\n\n getfolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.sFlag === YES && curr.Fund.trim() === \"105\") {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value: { value: \"105\" } },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n scheme: { value: \"\" },\n withdrawals: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n };\n handleFolioChange = async (value) => {\n const folio = !!value ? value.value : \"\";\n const schemes = !!value ? this.schemes(folio) : [];\n this.setState({\n folio: { value },\n schemes,\n scheme: { value: \"\" },\n });\n };\n schemes = (folio) => {\n return this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund === \"105\" && curr.Acno === folio) {\n return [...prev, curr];\n }\n return prev;\n }, []);\n };\n handlechangeSIPEndDateChange = () => {\n const { perpetualSip } = this.state;\n if (!perpetualSip) {\n this.setState({\n perpetualSip: !this.state.perpetualSip,\n sipEndDate: { value: \"31/12/2099\" },\n withdrawals: {\n value: \"\",\n placeholder: \"Perpetual SWP\",\n disabled: true,\n },\n });\n } else if (!!perpetualSip) {\n this.setState({\n perpetualSip: !this.state.perpetualSip,\n sipDay: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n withdrawals: { value: \"\", placeholder: \"\", disabled: false },\n });\n }\n };\n handleSchemeChange = async (value) => {\n if (!value) {\n this.setState({\n swpOption: { value: \"\" },\n swpOptions: [],\n swpFrequency: { value: \"\" },\n swpFrequencyOptions: [],\n withdrawals: { value: \"\" },\n sipDay: { value: \"\" },\n sipStartDate: { value: \"\" },\n sipEndDate: { value: \"\" },\n amount: { value: \"\" },\n sipCycle: [],\n });\n } else if (\n !!value &&\n !!this.state.scheme.value.value &&\n value.value.SchDesc === this.state.scheme.value.value.SchDesc\n ) {\n return;\n } else {\n if (value.value.BalUnits === 0) {\n this.setState({\n folio: {\n value: \"\",\n isError: true,\n errorMessage: \"SWP in zero balance folios is not allowed\",\n },\n scheme: {\n value: \"\",\n },\n });\n } else {\n const params = {\n fund: \"105\",\n opt: \"SWPW\",\n };\n let swpOptionsResponse = [];\n const response = await this.props.swpOptions(params);\n if (response) {\n swpOptionsResponse = response.Dtinformation;\n }\n this.setState({\n scheme: { value },\n swpOptions: swpOptionsResponse,\n });\n }\n }\n };\n handleSwpOptonChange = async (event) => {\n if (\n !!this.state.swpOption.value &&\n event.target.value.code === this.state.swpOption.value.code\n ) {\n return;\n } else {\n const swpOption = event.target.value;\n const params = {\n opt: \"SWF\",\n fund: \"105\",\n };\n const response = await this.props.swpOptions(params);\n const swpFrequencyOptionsResponse = response.Dtinformation;\n\n this.setState({\n swpOption: { value: swpOption },\n withdrawals: { value: \"\" },\n swpFrequency: { value: \"\" },\n swpFrequencyOptions: swpFrequencyOptionsResponse,\n });\n }\n };\n\n handleSwpFrequencyChange = async (event) => {\n const swpFrequency = event.target.value;\n const params = {\n opt: \"SWPD\",\n fund: \"105\",\n Astscheme:\n !!event.target.value && !!event.target.value.FrequencyDescription\n ? event.target.value.FrequencyDescription\n : \"\",\n };\n const response = await this.props.swpOptions(params);\n const sipCycleResponse = response.Dtinformation;\n\n this.setState({\n swpFrequency: { value: swpFrequency },\n sipDay: { value: \"\" },\n\n sipStartDate: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipCycle: sipCycleResponse,\n });\n const minParams = {\n Fund: \"105\",\n Scheme: this.state.scheme.value.value.Sch,\n Trtype: \"SWP\",\n Frequency: this.state.swpFrequency.value.FrequencyID,\n };\n\n const minResponse = await this.props.getMinimumAmount(minParams);\n if (!!minResponse && !minResponse.error) {\n const { DtData } = minResponse;\n const minAmount = DtData[0].minamt;\n this.setState({\n minAmountValue: {\n value: minAmount,\n },\n });\n }\n };\n\n handleNoOfWithDrawals(event) {\n if (event.target.value.length <= 3 && !!event.target.value) {\n if (parseFloat(event.target.value) <= 500 && event.target.value !== \"0\") {\n this.setState({\n withdrawals: {\n value: parseFloat(event.target.value.replace(/^0+/, \"\")),\n },\n sipStartDate: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipDay: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n } else if (\n parseFloat(event.target.value) > 500 &&\n event.target.value !== \"0\"\n ) {\n this.setState({\n withdrawals: {\n value: \"\",\n isError: true,\n errorMessage: !!event.target.value\n ? \"*No. of Withdrawls should not be more than 500 as stated above\"\n : \"\",\n },\n sipStartDate: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipDay: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n }\n } else if (!event.target.value) {\n this.setState({\n withdrawals: {\n value: \"\",\n isError: true,\n errorMessage:\n !!event.target.value && event.target.value !== \"0\"\n ? \"No. of Withdrawals should not be more than 500\"\n : event.target.value === \"0\"\n ? \"No. of Withdrwals should not be zero\"\n : \"*Please enter the minimum no of Withdrawals\",\n },\n sipStartDate: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipDay: { value: \"\" },\n });\n }\n }\n async handleSwpDay(event) {\n const day = event.target.value;\n\n if (!!day) {\n const params = {\n Fund: \"105\",\n StartDate: day,\n installments: this.state.withdrawals.value,\n Frequency: this.state.swpFrequency.value.FrequencyDescription,\n trtype: \"SWP\",\n sch: this.state.scheme.value.value.Sch,\n };\n\n const response = await this.props.CalcSIPEnddt(params);\n\n const sipStartDateResponse = response.DtData[0].SIP_StartDate;\n const sipEndDateResponse = response.DtData[0].SIP_EndDate;\n this.setState({\n sipDay: { value: day },\n sipStartDate: { value: sipStartDateResponse },\n sipEndDate: { value: sipEndDateResponse },\n });\n }\n }\n\n showError = (label) => () => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"withdrawals\") {\n this.setState({\n [label]: {\n value,\n isError: this.state.withdrawals.value < 1 ? true : !value,\n errorMessage:\n this.state.withdrawals.value < 1\n ? \"*Please enter the vaild number of Withdrawals as stated above\"\n : \"\",\n },\n });\n }\n if (label === \"amount\") {\n if (\n parseFloat(this.state.amount.value) < this.state.minAmountValue.value &&\n this.state.swpOption.value.Description === \"Fixed\"\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `*Minimum amount is ₹${this.state.minAmountValue.value} as mentioned above`,\n },\n });\n } else if (\n !this.state.amount.value &&\n this.state.swpOption.value.Description === \"Fixed\"\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `*Amount is Mandatory`,\n },\n });\n }\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n errorMessage: `*${\n label.charAt(0).toUpperCase() + label.slice(1)\n } is Mandatory`,\n },\n });\n }\n };\n\n handleMinimumAmount(event) {\n if (event.target.value.length <= 10) {\n this.setState({\n amount: { value: parseFloat(event.target.value.replace(/^0+/, \"\")) },\n });\n }\n }\n\n submit = () => {\n let currValue;\n if (!!this.state.scheme.value) {\n currValue = parseFloat(\n this.state.scheme.value.value.CurValue.replace(/,/g, \"\")\n );\n }\n if (this.state.amount.value === \"\") {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: \"*Amount is Mandatory\",\n },\n });\n }\n const {\n fund,\n funds,\n folios,\n schemes,\n swpOptions,\n swpFrequencyOptions,\n withdrawals,\n sipStartDate,\n sipEndDate,\n amount,\n sipCycle,\n bank,\n banks,\n perpetualSip,\n ...others\n } = this.state;\n const keys = Object.keys(others);\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage:\n key === \"scheme\"\n ? \"*Scheme is mandatory\"\n : key === \"folio\"\n ? \"*Folio is mandatory\"\n : key === \"sipDay\"\n ? \"*SWP Day is mandatory\"\n : key === \"swpFrequency\"\n ? \"*Withdrawal Frequency is mandatory\"\n : key === \"swpOption\"\n ? \"*Withdrawal Option is mandatory\"\n : `${key} is Mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n case \"folio\": {\n this.folioField.focus();\n break;\n }\n case \"scheme\": {\n this.schemeField.focus();\n break;\n }\n case \"swpOption\": {\n this.swpOptionField.focus();\n break;\n }\n case \"sipDay\": {\n this.sipDayField.focus();\n break;\n }\n case \"swpFrequency\": {\n this.swpFrquencyField.focus();\n break;\n }\n default:\n break;\n }\n } else if (this.state.withdrawals.value < 1 && !perpetualSip) {\n this.setState({\n withdrawals: {\n value: \"\",\n isError: true,\n errorMessage: `*Please check the minimum Withdrawals Value as stated above`,\n },\n });\n } else if (\n !this.state.amount.value &&\n this.state.swpOption.value.Description === \"Fixed\"\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `*Amount is Mandatory`,\n },\n });\n } else if (\n parseFloat(this.state.amount.value) < this.state.minAmountValue.value &&\n this.state.swpOption.value.Description === \"Fixed\"\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `*Minimum amount is ₹${this.state.minAmountValue.value} as stated above`,\n },\n });\n } else {\n const { funds, folios, schemes, swpFrequencyOptions, ...others } =\n this.state;\n\n this.props.history.push({\n pathname: INVESTOR_URL + \"/transction-types/swp/confirm\",\n state: {\n title: \"SWP Payment Summary\",\n type: SWP,\n Folio: { value: others.scheme.value.value.Acno },\n withDrawals: others.withdrawals.value,\n scheme: others.scheme.value.value,\n swpFrequency: others.swpFrequency.value,\n sipEndDate: others.sipEndDate.value,\n swpOption: others.swpOption.value,\n sipStartDate: others.sipStartDate.value,\n amount: others.amount.value,\n sipDay: others.sipDay.value,\n },\n });\n }\n };\n render() {\n const {\n funds,\n fund,\n folio,\n folios,\n scheme,\n schemes,\n swpOption,\n swpOptions,\n swpFrequency,\n swpFrequencyOptions,\n withdrawals,\n sipDay,\n sipStartDate,\n sipEndDate,\n sipCycle,\n amount,\n perpetualSip,\n } = this.state;\n return (\n \n
\n )}\n SWP Registration
\n\n \n ({\n label: item,\n value: item,\n }))}\n disabled={!fund.value}\n value={folio.value}\n placeholder=\"Select Folio\"\n handleChange={this.handleFolioChange}\n inputRef={(ele) => (this.folioField = ele)}\n isError={folio.isError}\n errorMessage={folio.errorMessage}\n />\n
\n Folio*
\n \n ({\n label: item.PlnDesc\n ? `${item.SchDesc1} - ${item.PlnDesc} - ${item.OptDesc}`\n : item.fm_schdesc,\n value: item,\n }))}\n disabled={!folio.value}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n handleChange={this.handleSchemeChange}\n inputRef={(ele) => (this.schemeField = ele)}\n isError={scheme.isError}\n errorMessage={scheme.errorMessage}\n />\n
\n Scheme*
\n \n
\n \n
\n Current Value
\n \n
\n \n {!!scheme.value ? `₹ ${scheme.value.value.CurValue}` : \"\"}\n
\n \n (this.swpOptionField = ele)}\n isError={swpOption.isError}\n errorMessage={swpOption.errorMessage}\n >\n {swpOptions.map((item, index) => (\n \n ))}\n \n
\n \n this.handleNoOfWithDrawals(event)}\n onBlur={this.showError(\"withdrawals\")}\n isShowError={withdrawals.isError}\n errorMessage={withdrawals.errorMessage}\n disabled={!scheme.value || withdrawals.disabled}\n value={withdrawals.value}\n placeholder={withdrawals.placeholder}\n />\n
\n \n (this.swpFrquencyField = ele)}\n isError={swpFrequency.isError}\n disabled={!withdrawals.value && !perpetualSip}\n errorMessage={swpFrequency.errorMessage}\n >\n {swpFrequencyOptions.map((item, index) => (\n \n ))}\n \n
\n {swpOption.value.Description === \"Fixed\" && (\n \n \n Minimum Amount:{\" \"}\n {!!this.state.minAmountValue\n ? `₹${this.state.minAmountValue.value}`\n : \"\"}\n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n type=\"number\"\n errorMessage={amount.errorMessage}\n isShowError={amount.isError}\n onBlur={this.showError(\"amount\")}\n onChange={(event) => this.handleMinimumAmount(event)}\n value={amount.value}\n />\n
\n \n (this.sipDayField = ele)}\n isError={sipDay.isError}\n errorMessage={sipDay.errorMessage}\n handleChange={(event) => this.handleSwpDay(event)}\n >\n {sipCycle.map((item, index) => (\n \n ))}\n \n
\n {!!sipDay && !!sipDay.value && (\n \n Perpetual SWP\n
\n \n )}\n Withdrawal Period
\n \n
\n\n \n
\n \n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }) => {\n const {\n fundList,\n token,\n userId,\n bankDetails,\n investorData,\n communicationDetails,\n } = authReducer;\n const { euinList } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n bankDetails,\n investorData,\n communicationDetails,\n };\n },\n { swpOptions, CalcSIPEnddt, getMinimumAmount }\n)(Swp);\n","import React, { Component } from \"react\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport {\n validateSubBroker,\n getAssetClasses,\n getOtherSchemes,\n swpOptions,\n CalcSIPEnddt,\n setStpDetails,\n getMinimumAmount,\n} from \"shared/store/actions\";\nimport { REGULAR, PURCHASE, STP } from \"shared/store/types\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport { NEW_TRANSACTION_URL } from \".\";\nimport { SundaramMutualFund } from \"./newPurchaseForm\";\nimport { INVESTOR_URL } from \"../investors\";\nimport { Checkbox } from \"@material-ui/core\";\n\nclass Stp extends Component {\n constructor(props) {\n super(props);\n const { stpDetails } = this.props;\n this.state = {\n fund: { value: { value: \"105\" } },\n folios: [],\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n radioValue: { value: \"no\" },\n arnCode: { value: this.props.token },\n subArnCode: { value: \"\" },\n euinNo: { value: \"\" },\n subBrokerCode: { value: \"\" },\n categories: [],\n category: { value: \"\" },\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n stpDates: [],\n swpOptions: [],\n swpOption: { value: \"\" },\n amount: { value: \"\" },\n minAmount: \"0\",\n swpFrequency: { value: \"\" },\n minimumInstallments: \"\",\n sipdatetrueorfalse: true,\n perpetualSip: false,\n ...stpDetails,\n };\n }\n\n handleFundChange = (value) => {\n if (!value) {\n this.setState({\n fund: { value: \"\" },\n folios: [],\n folio: { value: \"\" },\n subArnCode: { value: \"\" },\n euinNo: { value: \"\" },\n subBrokerCode: { value: \"\" },\n categories: [],\n category: { value: \"\" },\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n amount: { value: \"\" },\n swpFrequency: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n });\n return;\n } else if (value.value === \"105\") {\n return;\n } else {\n const fund = value.value;\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund === fund) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n fund: { value },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n scheme: { value: \"\" },\n schemes: [],\n subArnCode: { value: \"\" },\n euinNo: { value: \"\" },\n subBrokerCode: { value: \"\" },\n categories: [],\n category: { value: \"\" },\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n amount: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n if (!!fund) {\n this.validateBrokerCode(fund)();\n }\n }\n };\n\n async componentDidMount() {\n window.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n this.getFolios();\n }\n getFolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund.trim() === \"105\") {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n\n this.setState({\n fund: { value: { value: \"105\" } },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n scheme: { value: \"\" },\n schemes: [],\n subArnCode: { value: \"\" },\n euinNo: { value: \"\" },\n subBrokerCode: { value: \"\" },\n categories: [],\n category: { value: \"\" },\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n amount: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n this.validateBrokerCode(\"105\")();\n };\n\n validateBrokerCode = (fund) => async () => {\n const { subArnCode, arnCode } = this.state;\n if (\n !!this.state.subArnCode.value &&\n this.state.subArnCode.value === this.state.arnCode.value.split(\"-\")[1]\n ) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: \"ARN and Sub ARN code should not be the same\",\n },\n });\n return;\n }\n const params = {\n Fund: \"105\",\n SubAgentCd: !!subArnCode.value ? `ARN-${subArnCode.value}` : \"\",\n AgentCd: arnCode.value,\n };\n const response = await this.props.validateSubBroker(params);\n if (!response) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `Please enter a valid sub ARN code`,\n },\n });\n }\n };\n\n handleFolioChange = (value) => {\n if (!value) {\n this.setState({\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n subArnCode: { value: \"\" },\n euinNo: { value: \"\" },\n subBrokerCode: { value: \"\" },\n categories: [],\n category: { value: \"\" },\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n amount: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n return;\n } else if (value.value === this.state.folio.value.value) {\n return;\n } else {\n this.getAssetClasses(value.value);\n const schemes = this.schemes(value.value);\n\n this.setState({\n folio: { value },\n schemes,\n scheme: { value: \"\" },\n });\n }\n };\n\n getAssetClasses = async (value) => {\n const params = {\n Fund: \"105\",\n Folio: value,\n };\n const assetClasses = await this.props.getAssetClasses(params);\n if (assetClasses) {\n this.setState({\n categories: assetClasses.DtData,\n });\n }\n };\n\n schemes = (value) => {\n return this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund.trim() === \"105\" && curr.Acno === value) {\n return [...prev, curr];\n }\n return prev;\n }, []);\n };\n handleSchemeChange = (value) => {\n if (!value) {\n this.setState({\n scheme: { value: \"\" },\n category: { value: \"\" },\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n amount: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n return;\n } else if (value.value === this.state.scheme.value.value) {\n return;\n } else {\n if (!value.value.BalUnits) {\n this.setState({\n folio: {\n value: \"\",\n isError: \"true\",\n errorMessage: \"STP in Zero balance folios is not accepted\",\n },\n scheme: { value: \"\" },\n });\n } else {\n this.setState({\n scheme: { value },\n category: { value: \"\" },\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n amount: { value: \"\" },\n swpFrequency: { value: \"\" },\n });\n }\n }\n };\n handleCategoryChange = (event) => {\n if (event.target.value) {\n this.getOtherSchemes(event.target.value);\n this.setState({\n category: { value: event.target.value },\n switchInScheme: { value: \"\" },\n sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n });\n } else {\n this.setState({\n category: { value: \"\" },\n switchInScheme: { value: \"\" },\n });\n }\n };\n getOtherSchemes = async (value) => {\n const params = {\n schtype: REGULAR,\n category: value,\n acno: this.state.folio.value.value,\n fundCode: \"105\",\n trantype: PURCHASE,\n };\n const otherSchemes = await this.props.getOtherSchemes(params);\n\n if (otherSchemes) {\n this.setState({\n switchInSchemes: otherSchemes.DtData,\n });\n }\n };\n handleSwitchInScheme = async (value) => {\n if (!value) {\n this.setState({\n switchInScheme: { value: \"\" },\n // sipCycle: [],\n sipDay: { value: \"\" },\n transfers: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOptions: [],\n swpOption: { value: \"\" },\n });\n return;\n } else if (value.value === this.state.switchInScheme.value.value) {\n return;\n } else {\n const params = {\n opt: \"SF\",\n fund: \"105\",\n astscheme: \"\",\n };\n const sipCycleResponse = await this.props.swpOptions(params);\n const sipCycleResponseOptions = !!sipCycleResponse\n ? sipCycleResponse.Dtinformation\n : \"\";\n this.setState({\n switchInScheme: { value },\n stpDates: sipCycleResponseOptions,\n });\n }\n };\n changeValue = (label) => (event) => {\n if (label === \"subArnCode\" || label === \"subBrokerCode\") {\n if (/^\\d{0,15}$/.test(event.target.value)) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid number\",\n },\n });\n }\n } else if (label === \"radioValue\" && event.target.value === \"no\") {\n if (!this.state.euinNo.value) {\n this.setState({\n radioValue: { value: event.target.value },\n });\n } else {\n this.setState({\n [label]: { value: event.target.value },\n euinNo: { value: \"\" },\n });\n }\n } else if (\n label !== \"subArnCode\" &&\n label !== \"subBrokerCode\" &&\n label === \"radioValue\" &&\n event.target.value !== \"no\"\n ) {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n\n async handleSwpDay(event) {\n const day = event.target.value;\n const x = parseFloat(this.state.transfers.value.replace(/,/g, \"\"));\n if (\n this.state.transfers.value !== \"\" &&\n (x > parseFloat(this.state.minimumInstallments) ||\n x === parseFloat(this.state.minimumInstallments))\n ) {\n const params = {\n Fund: \"105\",\n StartDate: day,\n installments: this.state.transfers.value,\n Frequency: this.state.swpFrequency.value,\n trtype: \"STP\",\n sch: this.state.scheme.value.value.Sch,\n };\n\n const response = await this.props.CalcSIPEnddt(params);\n const sipStartDateResponse = response.DtData[0].SIP_StartDate;\n const sipEndDateResponse = response.DtData[0].SIP_EndDate;\n this.setState({\n sipDay: { value: day },\n sipStartDate: { value: sipStartDateResponse },\n sipEndDate: { value: sipEndDateResponse },\n // swpOption: { value: \"\" }\n });\n }\n }\n handlechangeSIPEndDateChange = () => {\n const { perpetualSip } = this.state;\n if (!perpetualSip) {\n this.setState({\n perpetualSip: !this.state.perpetualSip,\n sipEndDate: { value: \"31/12/2099\" },\n transfers: {\n value: \"\",\n placeholder: \"Perpetual STP\",\n disabled: true,\n },\n });\n } else if (!!perpetualSip) {\n this.setState({\n perpetualSip: !this.state.perpetualSip,\n sipDay: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n transfers: { value: \"\", placeholder: \"\", disabled: false },\n });\n }\n };\n handleChangeTransfers = async (event) => {\n const transferValue = event.target.value;\n const params = {\n fund: \"105\",\n opt: \"SWPW\",\n };\n if (!this.state.swpOption.value && event.target.value.length <= 4) {\n // const response = await this.props.swpOptions(params);\n // const swpOptionsResponse = response.Dtinformation;\n if (!!transferValue && parseFloat(transferValue) <= 9999) {\n this.setState({\n transfers: { value: transferValue },\n swpOptions: [],\n sipDay: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOption: { value: \"\" },\n });\n } else if (!transferValue) {\n this.setState({\n transfers: {\n value: \"\",\n isError: true,\n errorMessage: !!transferValue\n ? \"*No of transfers value should not be more than 9999 as stated above\"\n : \"*Transfers value is mandatory\",\n },\n swpOptions: [],\n sipDay: { value: \"\" },\n sipEndDate: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOption: { value: \"\" },\n });\n }\n } else if (event.target.value.length <= 3) {\n this.setState({\n transfers: { value: transferValue },\n sipEndDate: { value: \"\" },\n sipDay: { value: \"\" },\n sipStartDate: { value: \"\" },\n swpOption: { value: \"\" },\n });\n }\n };\n handleSwpOptionChange = (event) => {\n const swpOption = event.target.value;\n\n this.setState({\n swpOption: { value: swpOption },\n amount: { value: \"\" },\n });\n };\n handleChangeTransferAmount = (event) => {\n const transferAmount = event.target.value;\n if (event.target.value.length <= 10) {\n this.setState({\n amount: { value: transferAmount.replace(/^0+/, \"\") },\n });\n }\n };\n changeEuin = (value) => {\n this.setState({\n euinNo: { value },\n });\n };\n gotosipdatetrueorfalse = () => {\n this.setState({\n sipdatetrueorfalse: false,\n });\n };\n submit = () => {\n let amountValue;\n const {\n amount,\n transfers,\n sipEndDate,\n swpOption,\n sipStartDate,\n funds,\n folios,\n schemes,\n categories,\n switchInSchemes,\n sipCycle,\n subBrokerCode,\n subArnCode,\n radioValue,\n euinNo,\n fund,\n arnCode,\n swpOptions,\n swpFrequency,\n minAmount,\n stpDates,\n minimumInstallments,\n sipdatetrueorfalse,\n perpetualSip,\n ...others\n } = this.state;\n const Dailyminamount = 100;\n const MinRegularamount = 500;\n if (this.state.swpFrequency.value === \"\") {\n this.setState({\n swpFrequency: {\n value: \"\",\n isError: true,\n showError: true,\n errorMessage: \"*STP Frequency is Mandatory\",\n },\n });\n }\n if (!!this.state.amount) {\n amountValue = parseFloat(this.state.amount.value.replace(/,/g, \"\"));\n }\n if (this.state.transfers.value === \"\" && !perpetualSip) {\n this.setState({\n transfers: {\n value: \"\",\n isError: true,\n errorMessage: \"*Please enter the No. of transfers\",\n },\n });\n }\n if (this.state.euinNo.value === \"\") {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n errorMessage: \"*EUIN Declaration is Mandatory\",\n },\n });\n }\n const arn = this.state.arnCode.value.split(\"-\");\n const keys = Object.keys(others);\n\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"sipDay\"\n ? \"*STP Day\"\n : key === \"swpOption\"\n ? \"*STP Option\"\n : key === \"folio\"\n ? \"*Folio\"\n : key === \"scheme\"\n ? \"*Scheme\"\n : key === \"category\"\n ? \"*Category\"\n : key === \"switchInScheme\"\n ? \"*Transfer to Scheme\"\n : key\n } is Mandatory`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n // case \"fund\": {\n // this.fundField.focus();\n // break;\n // }\n case \"folio\": {\n this.folioField.focus();\n break;\n }\n case \"scheme\": {\n this.schemeField.focus();\n break;\n }\n case \"category\": {\n this.categoryField.focus();\n break;\n }\n case \"switchInScheme\": {\n this.switchInSchemeField.focus();\n break;\n }\n case \"sipDay\": {\n this.swpDateField.focus();\n break;\n }\n case \"swpOption\": {\n this.swpField.focus();\n break;\n }\n }\n } else if (\n !!this.state.subArnCode.value &&\n arn[1] === this.state.subArnCode.value\n ) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `and ARN code should not match `,\n },\n });\n } else if (\n !!subBrokerCode.value &&\n !/^\\d{3,15}$/.test(subBrokerCode.value)\n ) {\n this.setState({\n subBrokerCode: {\n value: \"\",\n isError: true,\n errorMessage: \"Invalid Sub Broker Code\",\n },\n });\n this.subBrokerField.focus();\n return;\n } else if (\n (amountValue < minAmount || this.state.amount.value === \"\") &&\n this.state.swpOption.value.Description === \"Fixed\"\n ) {\n if (this.state.amount.value === \"\") {\n this.setState({\n amount: {\n ...others[\"amount\"],\n isError: true,\n errorMessage: `*Transfer amount value is mandatory`,\n },\n });\n }\n\n // } else if (amountValue < minAmount) {\n // this.setState({\n // amount: {\n // ...others[\"amount\"],\n // isError: true,\n // errorMessage: `Minimum amount is 1000 (₹) for monthly stp frequency`,\n // },\n // });\n // }\n // else if (amountValue > currValue) {\n // this.setState({\n // amount: {\n // ...others[\"amount\"],\n // isError: true,\n // errorMessage: `(Transfer amount is more than the current Value)`\n // }\n // });\n // }\n } else if (\n this.state.radioValue.value === \"no\" &&\n !this.state.euinNo.value\n ) {\n this.euinField.focus();\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n },\n });\n } else if (\n (this.state.transfers.value === \"\" ||\n parseFloat(this.state.transfers.value) <\n parseFloat(this.state.minimumInstallments)) &&\n !perpetualSip\n ) {\n this.setState({\n transfers: {\n value: \"\",\n isError: true,\n errorMessage:\n \"*Please check the no of transfers value as stated above\",\n },\n });\n } else if (this.state.amount.value === \"\") {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: \"*Transfer amount per installment is Mandatory\",\n },\n });\n } else if (\n this.state.swpFrequency.value === \"Daily\" &&\n amountValue < Dailyminamount\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `*Minimum amount should be ₹100 as stated above`,\n },\n });\n } else if (\n (this.state.swpFrequency.value === \"Weekly\" ||\n this.state.swpFrequency.value === \"Fortnightly\" ||\n this.state.swpFrequency.value === \"Monthly\" ||\n this.state.swpFrequency.value === \"Quarterly\") &&\n MinRegularamount > amountValue\n ) {\n this.setState({\n amount: {\n value: \"\",\n isError: true,\n errorMessage: `*Amount should be between ₹500 to ₹3000 as stated above`,\n },\n });\n }\n\n // else if (!this.state.swpOption.value) {\n // this.setState({\n // swpOption: {\n // value: \"\",\n // isError: true,\n // errorMessage: \"STP option is mandatory*\",\n // },\n // });\n // }\n else {\n const {\n scheme,\n amount,\n transfers,\n sipEndDate,\n swpOption,\n sipStartDate,\n sipDay,\n euinNo,\n switchInScheme,\n stpDates,\n ...stpDetails\n } = this.state;\n\n this.props.setStpDetails(this.state);\n\n this.props.history.push({\n pathname: INVESTOR_URL + \"/transction-types/stp/confirm\",\n state: {\n title: \"STP Registration Summary\",\n type: STP,\n Folio: { value: this.state.scheme.value.value.Acno },\n scheme: { Fund: \"105\" },\n ...stpDetails,\n },\n });\n }\n };\n\n showError = (label) => () => {\n let amountValue, currValue;\n const {\n [label]: { value },\n } = this.state;\n if (!!this.state.amount) {\n amountValue = parseFloat(this.state.amount.value.replace(/,/g, \"\"));\n }\n if (!!this.state.scheme.value) {\n currValue = parseFloat(\n this.state.scheme.value.value.CurValue.replace(/,/g, \"\")\n );\n }\n if (label === \"transfers\" && !!this.state.transfers.value) {\n this.setState({\n [label]: {\n value,\n isError:\n parseFloat(this.state.transfers.value) <\n parseFloat(this.state.minimumInstallments)\n ? true\n : !value,\n errorMessage:\n parseFloat(this.state.transfers.value) <\n parseFloat(this.state.minimumInstallments) ||\n this.state.transfers.value === \"\"\n ? `*No. of transfers should be minimum ${this.state.minimumInstallments} as mentioned above`\n : \"\",\n },\n });\n } else if (label === \"transfers\" && this.state.transfers.value === \"\") {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: `*Please enter the No. of transfers`,\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n getMinimumInstallments = async () => {\n if (!this.state.amount.value) {\n this.setState({\n amount: {\n value: this.state.amount.value,\n isError: true,\n errorMessage: `*Transfer amount per installment is Mandatory`,\n },\n });\n } else if (this.state.amount.value < this.state.minAmount) {\n this.setState({\n amount: {\n value: this.state.amount.value,\n isError: true,\n errorMessage: `*Minimum amount should be ₹${this.state.minAmount} as mentioned below`,\n },\n });\n } \n };\n handleChangeStpFrequency = async (event) => {\n var minAmount;\n let minInstallment=\"\";\n if (event.target.value === this.state.swpFrequency.value) {\n return;\n } else {\n const params = {\n opt: \"STPD\",\n fund: \"105\",\n astscheme: event.target.value,\n };\n const sipCycleResponse = await this.props.swpOptions(params);\n const sipCycleResponseOptions = !!sipCycleResponse\n ? sipCycleResponse.Dtinformation\n : \"\";\n\n this.setState({\n swpFrequency: { value: event.target.value },\n transfers: { value: \"\" },\n sipCycle: sipCycleResponseOptions,\n });\n const minParams = {\n Fund: \"105\",\n Scheme: this.state.switchInScheme.value.value.fm_scheme,\n Trtype: \"STP\",\n Frequency: event.target.value,\n };\n const response = await this.props.getMinimumAmount(minParams);\n\n if (response) {\n const { DtData } = response;\n minAmount = DtData[0].minamt;\n minInstallment = DtData[0].mininst;\n this.setState({\n minAmount: minAmount,\n minimumInstallments:minInstallment\n });\n }\n }\n };\n\n render() {\n const {\n funds,\n fund,\n folio,\n folios,\n scheme,\n schemes,\n categories,\n category,\n arnCode,\n subArnCode,\n subBrokerCode,\n switchInScheme,\n switchInSchemes,\n euinNo,\n radioValue,\n sipCycle,\n sipDay,\n transfers,\n sipStartDate,\n sipEndDate,\n swpOptions,\n swpOption,\n stpDates,\n amount,\n } = this.state;\n // let e;\n // e = parseFloat(this.state.transfers.value.replace(/,/g, \"\"));\n const { euinList } = this.props;\n return (\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n onChange={this.handleChangeTransferAmount}\n inputRef={(ele) => (this.amountField = ele)}\n value={amount.value}\n type=\"number\"\n onBlur={this.getMinimumInstallments}\n isShowError={amount.isError}\n errorMessage={amount.errorMessage}\n />\n \n \n {`Minimum Amount Rs. ${this.state.minAmount}`}\n \n
\n STP Registration
\n\n \n ({\n label: item,\n value: item,\n }))}\n type=\"number\"\n value={folio.value}\n placeholder=\"Select Folio\"\n handleChange={this.handleFolioChange}\n inputRef={(ele) => (this.folioField = ele)}\n disabled={!fund.value}\n isError={folio.isError}\n errorMessage={folio.errorMessage}\n />\n
\n Folio*
\n \n
\n \n
\n Balance Units
\n Current Value
\n \n
\n {!!scheme.value.value ? scheme.value.value.BalUnits : \"\"}
\n \n {!!scheme.value.value ? `₹ ${scheme.value.value.CurValue}` : \"\"}\n
\n \n ({\n value: item,\n label: item.PlnDesc\n ? `${item.SchDesc1} - ${item.PlnDesc} - ${item.OptDesc}`\n : item.fm_schdesc,\n }))}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n handleChange={this.handleSchemeChange}\n disabled={!folio.value}\n inputRef={(ele) => (this.schemeField = ele)}\n isError={scheme.isError}\n errorMessage={scheme.errorMessage}\n />\n
\n Transfer from*
\n \n (this.categoryField = ele)}\n isError={category.isError}\n disabled={!scheme.value}\n errorMessage={category.errorMessage}\n >\n {categories.map((item, index) => (\n \n ))}\n \n
\n \n ({\n label: item.fm_schdesc,\n value: item,\n }))}\n label=\"Fund\"\n handleChange={this.handleSwitchInScheme}\n value={switchInScheme.value}\n placeholder=\"Select Transfer To Scheme*\"\n inputRef={(ele) => (this.switchInSchemeField = ele)}\n isError={switchInScheme.isError}\n errorMessage={switchInScheme.errorMessage}\n />\n
\n\n Transfer to*
\n \n
\n\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n disabled={!fund.value}\n isShowError={subArnCode.isError}\n errorMessage={subArnCode.errorMessage}\n onBlur={\n !!fund.value ? this.validateBrokerCode(fund.value.value.Fund) : \"\"\n }\n onChange={this.changeValue(\"subArnCode\")}\n />\n
\n\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n onChange={this.changeValue(\"subBrokerCode\")}\n />\n
\n \n \n \n \n
\n {radioValue.value === \"no\" ? (\n EUIN Declaration*
\n \n
\n YES
\n \n
\n \n NO
\n \n ({\n label: item.abm_agent,\n value: item.abm_agent,\n }))}\n handleChange={this.changeEuin}\n errorMessage={euinNo.errorMessage}\n value={euinNo.value}\n disabled={!euinList.length}\n placeholder=\"Choose EUIN\"\n inputRef={(ele) => (this.euinField = ele)}\n isError={euinNo.isError}\n />\n
\n ) : (\n \n I/We hereby confirm that the EUIN Declaration box has been\n intentionally left the blank by me/us as this is an 'execution-only'\n transaction without any interaction or advice by any personnel of\n the above distributor or notwithstanding the advice of\n in-appropriateness,if any provided by any personnel of the\n distributor and the distributor has not charged any advisory fees on\n this transaction\n
\n )}\n \n (this.stpFrequencyField = ele)}\n handleChange={this.handleChangeStpFrequency}\n value={this.state.swpFrequency.value}\n isError={this.state.swpFrequency.isError}\n showError={this.state.swpFrequency.isError}\n errorMessage={this.state.swpFrequency.errorMessage}\n >\n {stpDates.length > 0\n ? stpDates.map((item, index) => (\n \n ))\n : \"\"}\n {/* {\n \n } */}\n \n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n onChange={this.handleChangeTransfers}\n onBlur={this.showError(\"transfers\")}\n isShowError={transfers.isError}\n errorMessage={transfers.errorMessage}\n placeholder={transfers.placeholder}\n />\n
\n\n \n (this.swpDateField = ele)}\n isError={sipDay.isError}\n placeholder=\"STP Date\"\n disabled={!this.state.transfers.value}\n value={\n this.state.sipDay.value\n // this.state.transfers.value !== \"\" && (e > 60 || e === 60)\n // ? this.state.sipDay.value\n // : \"\"\n }\n onBlur={this.showError(\"transfers\")}\n handleChange={(event) => this.handleSwpDay(event)}\n errorMessage={sipDay.errorMessage}\n >\n {sipCycle.map((item, index) => (\n \n ))}\n \n {this.sipdatetrueorfalse ? (\n
\n {!!sipDay && !!sipDay.value && (\n \n *Please fill all options\n
\n ) : null}\n \n Perpetual STP\n
\n \n )}\n Time Period
\n \n
\n \n
\n {/* \n (this.swpField = ele)}\n isError={swpOption.isError}\n errorMessage={swpOption.errorMessage}\n value={swpOption.value}\n handleChange={this.handleSwpOptionChange}\n // disabled={!sipDay.value}\n >\n\n {swpOptions.map((item, index) => (\n \n ))}\n \n
*/}\n {/* {swpOption.value.Description === \"Fixed\" ? ( */}\n\n {/* ) : (\n \"\"\n )} */}\n \n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }) => {\n const {\n fundList,\n token,\n userId,\n bankDetails,\n investorData,\n communicationDetails,\n } = authReducer;\n const { euinList, stpDetails = {} } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n stpDetails,\n bankDetails,\n investorData,\n communicationDetails,\n };\n },\n {\n validateSubBroker,\n getAssetClasses,\n getOtherSchemes,\n swpOptions,\n setStpDetails,\n CalcSIPEnddt,\n getMinimumAmount,\n }\n)(Stp);\n","import React, { Component } from \"react\";\nimport { BUILD_URL } from \"./home\";\n\nexport default class UploadFile extends Component {\n render() {\n const { id, isShowError, fileName } = this.props;\n return (\n \n \n Upload\n
\n \n \n {fileName}
\n \n \n {type === \"isip\" && (\n (this.fundField = ele)}\n isError={fund.isError}\n >\n {fundsList.map((item, index) => (\n \n {type === PHYSICAL_NEW ? item.amc_name : item.FundDesc}\n \n ))}\n \n
\n\n {type !== PHYSICAL_NEW && this.state.sipType.value !== NEW && (\n \n (this.sipTypeField = ele)}\n isError={sipType.isError}\n errorMessage={sipType.errorMessage}\n >\n {sipTypes.map((item, index) => (\n \n ))}\n \n
\n )}\n\n \n (this.folioField = ele)}\n isError={folio.isError}\n >\n {folios.map((item, index) => (\n \n ))}\n \n
\n )}\n \n (this.emailIdField = ele)}\n errorMessage={this.state.emailId.errorMessage}\n />\n
\n\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n value={mobile.value}\n type=\"number\"\n onChange={this.changeValue(\"mobile\")}\n onBlur={this.showError(\"mobile\")}\n isShowError={mobile.isError}\n errorMessage={mobile.errorMessage}\n inputref={(ele) => (this.mobileField = ele)}\n />\n
\n \n {!!this.state.upload.errorMessage ? (\n \n {this.state.upload.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n Only .pdf files allowed. File size to not exceed 24 MB\n
\n \n\n \n
\n \n \n \n \n {this.state.sipType.value} - {index + 1}\n
\n Pause/ Cancel Module
\n \n (this.sipTypeField = ele)}\n // isError={sipType.isError}\n // errorMessage={sipType.errorMessage}\n >\n {sipTypes.map((item, index) => (\n \n ))}\n \n
\n\n\n {folios.map((ele, index) => (\n \n {ele.pause_flag !== \"N\" && this.state.sipType.value === \"SIP\" && (\n \n \n Pause\n
\n \n )}\n\n \n
\n\n \n
\n )}\n \n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }, props) => {\n const { location } = props;\n const { investorData, communicationDetails, token, userId } = authReducer;\n // const { fundsList } = transactions;\n const { fundList } = authReducer;\n\n return {\n investorData,\n communicationDetails,\n token,\n\n fundList,\n userId,\n };\n },\n { getNctType, getNctSave }\n)(NctType);\n","import React, { Component } from \"react\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport { getEnach } from \"shared/store/actions/transactions\";\nimport { EnachModal, EnachAMCModal } from \"../customModal\";\nimport { BUILD_URL } from \"../home\";\nimport investorData from \"../investors/investorData\";\nimport {\n FormControl,\n FormControlLabel,\n Radio,\n RadioGroup,\n} from \"@material-ui/core\";\n\nclass ENACH extends Component {\n constructor(props) {\n super(props);\n const { investorData, communicationDetails, location } = this.props;\n const { state } = location;\n const Xemail =\n !!this.props.communicationDetails &&\n !!this.props.communicationDetails.length > 0 &&\n !!investorData.PAN &&\n (this.props.communicationDetails || []).find(\n (detail) =>\n detail.PAN === investorData.PAN &&\n !!detail.email &&\n /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(detail.email)\n );\n\n const Xmobile =\n !!this.props.communicationDetails &&\n !!this.props.communicationDetails.length > 0 &&\n !!investorData.PAN &&\n (this.props.communicationDetails || []).find(\n (detail) => detail.PAN === investorData.PAN && !!detail.Mobile\n );\n\n const Email = !!Xemail && !!Xemail.email ? Xemail.email : \"\";\n\n const Mobile = !!Xmobile && !!Xmobile.Mobile ? Xmobile.Mobile : \"\";\n this.state = {\n email: { value: Email || \"\" },\n EnachOpen: false,\n eNachAMCOpen: false,\n disabled: false,\n pan: {\n value:\n !!investorData && !!investorData.PAN\n ? investorData.PAN\n : !!state && !!state.pan\n ? state.pan\n : \"\",\n },\n mobile: { value: Mobile },\n name: {\n value:\n !!investorData && !!investorData.invname ? investorData.invname : \"\",\n },\n ref: \"\",\n amount: { value: \"\" },\n countryCode: { value: \"+91\" },\n registrationType: this.props.location?.state?.type === \"ENACH\" ? \"ENACH\" : this.props.location?.state?.type === \"UAUTO\"?\"UAUTO\":\"ENACH\",\n };\n }\n\n changeValue = (label) => async (event) => {\n if (label === \"countryCode\") {\n const { value } = event.target;\n if (!/^[+]\\d{1,3}/.test(value)) {\n this.setState({\n countryCode: { value, errorMessage: \"Enter a valid Country Code\" },\n });\n return;\n }\n this.setState({\n countryCode: { value },\n });\n }\n if (label === \"amount\") {\n const { value } = event.target;\n if (parseInt(value) < 500 || parseInt(value) > 10000000) {\n this.setState({\n amount: {\n value,\n errorMessage: \"Amount should be between Rs 500 and Rs 10000000\",\n },\n });\n return;\n }\n this.setState({\n amount: { value },\n });\n return;\n }\n if (label === \"mobile\" && event.target.value.length <= 10) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label != \"mobile\") {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n submit = async () => {\n const { ref, EnachOpen, EnachRef, disabled, eNachAMCOpen,registrationType, ...others } =\n this.state;\n this.setState({\n disabled: true,\n });\n const keys = Object.keys(others);\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"pan\"\n ? \"PAN No\"\n : key === \"mobile\"\n ? \"Mobile Number\"\n : key === \"name\"\n ? \"Investor Name\"\n : key === \"email\"\n ? \"Email\"\n : key === \"amount\"\n ? \"Amount\"\n : key === \"countryCode\"\n ? \"Country Code\"\n : key\n } is Mandatory`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n case \"amount\": {\n this.amountField.focus();\n break;\n }\n case \"countryCode\": {\n this.countryCodeField.focus();\n break;\n }\n case \"pan\": {\n this.panField.focus();\n break;\n }\n case \"name\": {\n this.nameField.focus();\n break;\n }\n case \"email\": {\n this.emailField.focus();\n break;\n }\n case \"mobile\": {\n this.mobileField.focus();\n break;\n }\n default:\n break;\n }\n } else if (!/^[+]\\d{1,3}/.test(this.state.countryCode.value)) {\n this.setState({\n countryCode: {\n value: \"\",\n errorMessage: \"Please Enter a valid country code\",\n },\n });\n return;\n } else if (\n parseInt(this.state.amount.value) < 500 ||\n parseInt(this.state.amount.value > 10000000)\n ) {\n this.setState({\n amount: {\n value: \"\",\n errorMessage: \"Amount should be between Rs 500 and Rs 10000000\",\n },\n });\n } else if (\n !!this.state.pan.value &&\n /^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/.test(this.state.pan.value) ===\n false\n ) {\n this.setState({\n pan: {\n ...others[\"pan\"],\n isError: true,\n errorMessage: `Enter a vaild PAN`,\n },\n });\n return;\n } else if (\n !!this.state.email.value &&\n /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.email.value\n ) === false\n ) {\n this.setState({\n email: {\n ...others[\"email\"],\n isError: true,\n errorMessage: `Enter a vaild Email address`,\n },\n });\n return;\n } else if (\n !!this.state.mobile.value &&\n /^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[6-9]\\d{9}$/.test(\n this.state.mobile.value\n ) === false\n ) {\n this.setState({\n mobile: {\n ...others[\"mobile\"],\n isError: true,\n errorMessage: `Enter a vaild Phone number`,\n },\n });\n return;\n } else {\n const params = {\n Email: this.state.email.value,\n Contact: this.state.mobile.value,\n Name: this.state.name.value,\n Pan: this.state.pan.value,\n invdistflag: \"P\",\n // flag:this.state.registrationType,\n arncode: this.props.token,\n txnamount: this.state.amount.value,\n siamount: this.state.amount.value,\n };\n const response = await this.props.getEnach(params);\n if (\n !!response &&\n !!response.DtData &&\n !!response.DtData[0] &&\n !!response.DtData[0].en_ihno\n ) {\n this.setState({\n EnachRef: response.DtData[0].en_ihno,\n EnachOpen: true,\n });\n }\n }\n this.setState({\n disabled: false,\n });\n };\n\n OpenEnachAMCOpen = () => {\n this.setState({\n eNachAMCOpen: true,\n });\n };\n\n OpenEnachAMCClose = () => {\n this.setState({\n eNachAMCOpen: false,\n });\n };\n\n close = () => {\n this.setState({\n EnachOpen: false,\n });\n this.props.history.push(BUILD_URL + \"/dashboard\");\n // const refno = encodeURIComponent(btoa(this.state.EnachRef));\n // window.open(\n // `https://api.karvymfs.com/25/Enach/EnachRegd.aspx?refno=${refno}`,\n // \"_self\"\n // );\n };\n\n onEmailBlur = () => {\n if (\n !!this.state.email.value &&\n /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.email.value\n ) === false\n ) {\n this.setState({\n email: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a vaild Email ID\",\n },\n });\n }\n };\n finalMandates = this.props.location?.state?.type === \"ENACH\" ? [\"ENACH\"] : this.props.location?.state?.type === \"KOTM\"?[\"KOTM\"]: this.props.location?.state?.type === \"UAUTO\"?[\"UAUTO\"]:[\"ENACH\",\"UAUTO\"];\n render() {\n const { mobile, email, pan, name } = this.state;\n const { location, investorData } = this.props;\n const { state } = location;\n\n return (\n NCT
\n \n ({\n label: item.FundDesc,\n value: item.Fund,\n }))}\n value={fund.value}\n placeholder=\"Select Fund\"\n handleChange={this.handleFundChange}\n inputRef={(ele) => (this.fundField = ele)}\n isError={fund.isError}\n errorMessage={fund.errorMessage}\n />\n
\n\n Fund
\n \n ({\n label: item,\n value: item,\n }))}\n value={folio.value}\n placeholder=\"Select Folio\"\n handleChange={this.handleFolioChange}\n inputRef={(ele) => (this.folioField = ele)}\n isError={folio.isError}\n disabled={!fund.value}\n errorMessage={folio.errorMessage}\n />\n
\n\n Folio
\n \n ({\n label: item.nm_description,\n value: item.nm_code,\n }))}\n value={NctType.value}\n placeholder=\"Select NCT Type\"\n handleChange={this.handleNctTypeChange}\n inputRef={(ele) => (this.NctTypeField = ele)}\n isError={NctType.isError}\n disabled={!folio.value}\n errorMessage={NctType.errorMessage}\n />\n
\n\n NCT Type
\n \n (this.emailIdField = ele)}\n errorMessage={this.state.emailId.errorMessage}\n />\n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n value={mobile.value}\n onChange={this.changeValue(\"mobile\")}\n // onBlur={this.showError(\"mobile\")}\n isShowError={mobile.isError}\n errorMessage={mobile.errorMessage}\n inputref={(ele) => (this.mobileField = ele)}\n />\n
\n\n \n {!!this.state.upload.errorMessage ? (\n \n {this.state.upload.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n only pdf files are allowed, File size to not exceed 24 MB\n
\n\n \n
\n \n \n {\n const value = e.target.value;\n this.setState({\n registrationType: value,\n });\n }}\n >\n {this.finalMandates.map((item) => {\n return (\n */}\n\n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }, props) => {\n const { location } = props;\n const { investorData, communicationDetails, token, userId } = authReducer;\n // const { fundsList } = transactions;\n const { fundList } = authReducer;\n\n return {\n investorData,\n communicationDetails,\n token,\n\n fundList,\n userId,\n };\n },\n { getEnach }\n)(ENACH);\n","import React, { Component } from \"react\";\nimport { Paper } from \"@material-ui/core\";\n// import { INVESTORS_URL } from \".\";\nimport { BUILD_URL } from \"../home\";\n\nexport const INVESTORS_URL = `${process.env.PUBLIC_URL}/investors`;\nexport default class TransactionTypeCards extends Component {\n constructor() {\n super();\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n }\n\n getUrlByName = (name) => {\n let url = `/`;\n switch (name) {\n case \"New Purchase + SIP (New folio)\":\n url = BUILD_URL + \"/new-investor-transaction/investor-details\";\n break;\n case \"Additional Purchase\":\n url = INVESTORS_URL + \"/transction-types/additional-purchase\";\n break;\n case \"Redemption\":\n url = INVESTORS_URL + \"/transction-types/redemption\";\n break;\n case \"SIP (Existing Folio)\":\n url = `${INVESTORS_URL}/transction-types/sip`;\n break;\n case \"STP Registration\":\n url = INVESTORS_URL + \"/transction-types/stp\";\n break;\n case \"SWP Registration\":\n url = INVESTORS_URL + \"/transction-types/swp\";\n break;\n case \"Switch\":\n url = INVESTORS_URL + \"/transction-types/switch\";\n break;\n case \"Existing Folio - Top Up SIP\":\n url =INVESTORS_URL+ \"/transction-types/sip-live-select\";\n break;\n case \"SIP Pause/Cancellation\":\n url = INVESTORS_URL + \"/transction-types/sip-cancellation\";\n break;\n case \"NCT\":\n url = INVESTORS_URL + \"/nct-type/digital/transact\";\n break;\n case \"eNACH\":\n url = INVESTORS_URL + \"/eNACH/digital/transact\";\n break;\n }\n return url;\n };\n render() {\n return (\n Register Mandate
\n {/* \n
\n );\n })}\n \n {item}
\n \n \n // (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n // evt.preventDefault()\n // }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n onChange={this.changeValue(\"pan\")}\n isShowError={pan.isError}\n inputref={(ele) => (this.panField = ele)}\n errorMessage={this.state.pan.errorMessage}\n />\n
\n \n (this.nameField = ele)}\n errorMessage={this.state.name.errorMessage}\n />\n
\n\n \n (this.emailField = ele)}\n errorMessage={this.state.email.errorMessage}\n />\n
\n \n (this.countryCodeField = ele)}\n />\n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n onChange={this.changeValue(\"mobile\")}\n isShowError={mobile.isError}\n inputref={(ele) => (this.mobileField = ele)}\n errorMessage={this.state.mobile.errorMessage}\n />\n
\n \n (this.amountField = ele)}\n />\n
\n\n \n
\n\n \n
\n {this.props.name}
\n {/* {this.props.name !== \"Pause/Cancellation\" &&\n this.props.name != \"NCT\" &&\n this.props.name != \"eNACH\" ? (\n \n
\n );\n};\n\n// Function to handle Top Up button click\n","import React, { Component } from \"react\";\nimport { Paper } from \"@material-ui/core\";\nimport { connect } from \"react-redux\";\nimport { Route, Switch } from \"react-router-dom\";\nimport NewPurchase from \"./newPurchaseForm\";\nimport NewPurchaseConfirm from \"./newPurchaseConfirm\";\nimport AdditionalPurchase from \"./additionalPurchaseForm\";\nimport Redemption from \"./redemption\";\nimport switchCmponent from \"./switch\";\nimport Sip from \"./sip\";\nimport Swp from \"./swp\";\nimport Stp from \"./stp\";\nimport NfoPhysicalMode from \"./nfoPhysicalMode\";\nimport { BUILD_URL } from \"../home\";\nimport SipCancellation from \"./sipCancellation\";\nimport NctType from \"./nctType\";\nimport ENACH from \"./eNach\";\nimport { userPan } from \"shared/store/actions/auth\";\nimport { LiveSipSelect } from \"./LiveSipSelection\"\nimport SIPTopUp from './SIPTopUp'\nclass NFOAndNewPurchaseDigital extends Component {\n async componentDidMount() {\n if (!!this.props.location.state && !!this.props.location.state.pan) {\n await this.props.userPan(this.props.location.state.pan);\n }\n }\n render() {\n const { investorData } = this.props;\n return (\n \n
\n Folio
\n \n {allSchemes.length > 0 && (\n \n \n
\n \n )}\n
\n \n \n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { investorData, user_pan } = authReducer;\n return { investorData, user_pan };\n },\n { userPan }\n)(NFOAndNewPurchaseDigital);\n\nexport class List extends Component {\n render() {\n const { invname, PAN } = this.props.investorData;\n return (\n \n
\n \n \n\n \n
\n \n \n
\n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Paper } from \"@material-ui/core\";\nimport { BUILD_URL } from \"../home\";\n\nexport default class TransactionMode extends Component {\n render() {\n return (\n \n
\n {!!this.props.image && (\n {invname}
\n \n {\" \"}\n PAN: {PAN || this.props.pan}\n
\n \n
\n )}\n \n \n \n this.props.history.push({\n pathname: this.props.location.state.digital\n })\n }\n >\n Select digital Mode\n \n
\n \n\n \n
\n \n
\n Digital Mode
\n \n A mutual fund is a professionally managed investment fund that pools\n money from many investors to purchase securities. These investors\n may be retail or institutional in nature.\n
\n \n
\n \n
\n Physical Mode
\n \n
\n \n Please Follow The Below Steps\n
\n \n
\n \n
\n \n
\n \n Upload Order form\n
\n \n Upload Cheque\n
\n \n Sumbit Cheque at nearest Karvy Branch\n
\n \n \n \n Digital Mode\n
\n Select Transaction Type
\n \n {/* */}\n \n {/* \n Phygital Mode\n
*/}\n {/* \n \n
\n \n Please Follow The Below Steps\n
*/}\n {/* \n
*/}\n\n \n
\n \n
\n \n Upload Order form\n
\n \n Upload Cheque\n
\n \n Sumbit Cheque at nearest Karvy Branch\n
\n \n \n \n )}\n\n \n {!!showAll && (\n \n \n )}\n\n {!!showAll && (\n \n \n )}\n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { showAll } = authReducer;\n return { showAll };\n },\n { setSipDetails, setSwitchDetails, setStpDetails }\n)(TransactionType);\n","import React,{Component} from \"react\";\nimport { BUILD_URL } from \"../home/home\";\n\n\nexport default class CustomLoader extends Component {\n render () {\n const {display} = this.props\n return (\n \n
\n\n )\n }\n}\n","import React, { Component } from \"react\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport { getNewPurchaseFundList, checkKyc } from \"shared/store/actions\";\nimport { EKYCMail } from \"shared/store/actions/investors\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport {\n GET_FUNDS_LIST,\n GET_FUNDS_LIST_SUCCESS,\n GET_FUNDS_LIST_FAILED,\n ALL,\n} from \"shared/store/types\";\nimport { KycNotDoneDialog } from \"../customModal\";\nimport { SundaramMutualFund } from \"./newPurchaseForm\";\nimport CustomLoader from \"../../forms/Loader\";\nclass EKYC extends Component {\n constructor(props) {\n super(props);\n const { match } = this.props;\n this.state = {\n kycType: { value: \"\" },\n ipv: { value: \"YES\", errorMessage: \"\" },\n display: false,\n messageAlert: \"\",\n open: false,\n pan: {\n value:\n !!match && !!match.params && !!match.params.pan\n ? match.params.pan\n : \"\",\n },\n fund: { value: { value: \"105\" } },\n name: { value: \"\" },\n email: { value: \"\" },\n mobile: { value: \"\" },\n };\n }\n\n // componentDidMount() {\n // const params = {\n // opt: ALL,\n // schemetype: this.props.userId,\n // };\n // const types = [\n // GET_FUNDS_LIST,\n // GET_FUNDS_LIST_SUCCESS,\n // GET_FUNDS_LIST_FAILED,\n // ];\n\n // this.props.getNewPurchaseFundList(params, types);\n // }\n\n handleChange = (value) => {\n this.setState({\n fund: { value },\n pan: { value: this.state.pan.value },\n });\n };\n\n changeValue = (label) => (event) => {\n if (label === \"pan\" && event.target.value.length < 11) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label === \"name\") {\n if (!!event.target.value && /^[a-zA-Z ]*$/.test(event.target.value)) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (!event.target.value) {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n } else if (label === \"mobile\" && event.target.value.length <= 10) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label != \"pan\" && label != \"mobile\" && label != \"name\") {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n\n changeIpvValue = (value) => () => {\n if (value === \"YES\") {\n this.setState({\n ipv: { value: \"YES\" },\n });\n } else if (value === \"NO\") {\n this.setState({\n ipv: {\n value: \"NO\",\n errorMessage: \"(It is mandatory to perform IPV to proceed )\",\n },\n });\n }\n };\n\n showError = (label) => (event) => {\n switch (label) {\n case \"mobile\":\n if (!event.target.value) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Mobile No is Mandatory*\",\n },\n });\n } else if (!/^[6-9]\\d{9}$/.test(event.target.value)) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid Mobile Number\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value: event.target.value,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n break;\n case \"email\":\n if (!event.target.value) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Email id is Mandatory\",\n },\n });\n } else if (\n !/^(?!.{51})([a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?))*$/.test(\n event.target.value\n )\n ) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid Email Id\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value: event.target.value,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n break;\n case \"name\":\n if (!event.target.value) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Name is Mandatory\",\n },\n });\n } else if (!/^[a-zA-Z ]*$/.test(event.target.value)) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid Name\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value: event.target.value,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n break;\n default:\n this.setState({\n [label]: {\n value: event.target.value,\n },\n });\n break;\n }\n };\n getKycDetails = async (pan) => {\n const params = {\n i_pan: pan,\n fund: \"105\",\n userid: this.props.userId,\n };\n const kycResponse = await this.props.checkKyc(params);\n return kycResponse;\n };\n\n submit = async () => {\n const { ipv, open, messageAlert, fund, display, kycType, ...others } =\n this.state;\n const keys = Object.keys(others);\n const findError = keys.every((key) => !!others[key].value);\n\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"fund\"\n ? \"Fund\"\n : key[0].toUpperCase() + key.substring(1)\n } is Mandatory*`,\n },\n });\n });\n return;\n }\n if (\n !!this.state.pan.value &&\n !/^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/.test(this.state.pan.value)\n ) {\n this.setState({\n pan: {\n value: \"\",\n isError: true,\n errorMessage: \"please enter a valid PAN\",\n },\n });\n return;\n }\n if (\n !!this.state.email.value &&\n !/^(?!.{51})([a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?))*$/.test(\n this.state.email.value\n )\n ) {\n this.setState({\n email: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter a valid Email Id\",\n },\n });\n return;\n }\n if (\n !!this.state.mobile.value &&\n !/^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[6-9]\\d{9}$/.test(\n this.state.mobile.value\n )\n ) {\n this.setState({\n mobile: {\n value: \"\",\n isError: true,\n errorMessage: `Please enter a valid Mobile Number`,\n },\n });\n return;\n } else if (\n this.state.ipv.value === \"NO\" &&\n this.state.kycType.value === \"DKYC\"\n ) {\n this.setState({\n ipv: {\n value: \"NO\",\n // isError: true,\n errorMessage: \"(It is mandatory to perform IPV to proceed )\",\n },\n });\n } else {\n // if (this.state.kycType.value === \"IKYC\") {\n const { fund, name, email, mobile, pan } = this.state;\n\n const params = {\n InvPan: this.state.pan.value,\n InvMobile: mobile.value,\n InvEmail: email.value,\n InvFund: \"105\",\n InvDistFlag: \"P\",\n Url: \"\",\n InvName: name.value,\n DistName: this.props.userId,\n DistUserId: this.props.userId,\n ArnCode: this.props.token,\n };\n\n const response = await this.props.EKYCMail(params);\n if (response && !response.error) {\n this.setState({\n open: true,\n messageAlert:\n \"An email will be triggered to investor's email for uploading neccesary KYC documents and selfie video.please confirm\",\n });\n }\n // }\n // else {\n // const { fund, email, mobile, name } = this.state;\n // window.open(\n // `https://mfs.kfintech.com/ckyc/eKyc.aspx?UserID=2703&AgencyCode=105&AgencyTransactionID=123&Pan=${this.state.pan.value}&PanName=${name.value}&Mobile=${mobile.value}&EmailID=${email.value}&AuthType=3&ipv=y&EmpName=${this.props.userId}&EmpDesig=Manager&EmpCode=${this.props.token}&EmpLoc=Hyderabad&FundCode=105&fromType=DITWEB`,\n // \"_self\"\n // );\n // }\n }\n };\n\n closeModal = () => {\n this.setState({\n open: false,\n messageAlert: \"\",\n });\n };\n\n continue = () => {\n const { params } = this.props.match;\n this.setState({\n kycType: { value: \"\" },\n ipv: { value: \"YES\", errorMessage: \"\" },\n fund: { value: \"\" },\n pan: { value: !!params && !!params.pan ? params.pan : \"\" },\n open: false,\n messageAlert: \"\",\n name: { value: \"\" },\n email: { value: \"\" },\n mobile: { value: \"\" },\n });\n this.props.history.push(`${process.env.PUBLIC_URL}/dashboard`);\n };\n\n handleChangeKycType = (event) => {\n const { match } = this.props;\n this.setState({\n kycType: { value: event.target.value },\n ipv: { value: \"YES\", errorMessage: \"\" },\n fund: { value: \"\" },\n pan: {\n value:\n !!match && !!match.params && !!match.params.pan\n ? match.params.pan\n : \"\",\n },\n name: { value: \"\" },\n email: { value: \"\" },\n mobile: { value: \"\" },\n });\n };\n handleKycStatus = async () => {\n if (!this.state.pan.value) {\n this.setState({\n pan: {\n value: \"\",\n isError: true,\n errorMessage: \"PAN is Mandatory*\",\n },\n });\n return;\n }\n if (!/^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/.test(this.state.pan.value)) {\n this.setState({\n pan: {\n value: \"\",\n isError: true,\n errorMessage: \"please enter a valid PAN\",\n },\n });\n return;\n }\n this.setState({\n display: true,\n });\n const kycResponse = await this.getKycDetails(this.state.pan.value);\n if (!!kycResponse && !kycResponse.error) {\n const {\n DtData: [info],\n } = kycResponse;\n if (!!info && !!info.KYCBlock && info.KYCBlock === \"N\") {\n alert(\"PAN is KYC Registered\");\n this.setState({\n pan: { value: \"\" },\n display: false,\n });\n } else {\n this.setState({\n display: false,\n });\n }\n }\n };\n render() {\n const { email, name, mobile, kycType, display } = this.state;\n const KYCTYPES = [\n // { key: \"DKYC\", label: \"Distributor (eKYC)\" },\n { key: \"IKYC\", label: \"Online IPV with E-sign\" },\n ];\n return (\n \n \n 
*/}\n
\n \n \n
\n {/* \n \n
\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }) => {\n const { token, userId } = authReducer;\n const { fundsList = [] } = transactions;\n return {\n token,\n userId,\n fundsList,\n };\n },\n { getNewPurchaseFundList, EKYCMail, checkKyc }\n)(EKYC);\n","import React, { Component } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport Investors from \"./InvestorMain\";\nimport InvestorDetails from \"./InvestorDetails\";\nimport NFOAndNewPurchaseDigital from \"../transactions/nfoAndNewPurchase\";\nimport TransactionMode from \"../transactions/TransactionModes\";\nimport TransactionType from \"../transactions/TransactionTypes\";\nimport EKYC from \"../transactions/ekycForm\";\nimport { LiveSipSelect } from \"../transactions/LiveSipSelection\";\nimport SIPTopUp from \"../transactions/SIPTopUp\";\n\nexport default class InvestorRouter extends Component {\n render() {\n const { history, location } = this.props;\n return (\n eKYC Form
\n \n
\n \n \n
\n )}\n\n {this.state.kycType.value === \"DKYC\" && (\n \n
\n \n \n {KYCTYPES.map((ele) => (\n \n ))}\n */}\n
\n \n {this.state.kycType.value === \"IKYC\"\n ? \"\"\n : this.state.kycType.value === \"DKYC\"\n ? \"Investor Presence Required*\"\n : \"\"}\n
\n \n
\n PAN*
\n \n
\n \n
\n \n
\n \n
\n Name*
\n \n
\n \n
\n\n {this.state.kycType.value === \"IKYC\" && (\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n type=\"number\"\n value={mobile.value}\n onBlur={this.showError(\"mobile\")}\n isError={mobile.isError}\n isShowError={mobile.isError}\n errorMessage={mobile.errorMessage}\n />\n
\n \n \n
\n )}\n\n {this.state.kycType.value === \"DKYC\" && (\n Instructions
\n - \n
- \n This process will send an Email to your client for\n completing the KYC process\n \n
- \n Your client has to upload relevant documents and record a\n video of self by showing the documents.{\" \"}\n \n
- \n Please inform and guide your client accordingly.\n \n
\n \n Aadhaar XML or PDF File \n Share code \n \n
\n \n \n Required Documents\n
\n \n
\n )}\n\n Instructions
\n - \n
- \n This process is based on e-Aadhaar, please keep the masked\n e-Aadhaar copy and password ready before initiating.\n \n
- \n First investment is allowed only towards the fund\n selected.\n \n
\n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport Paper from \"@material-ui/core/Paper\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport { connect } from \"react-redux\";\nimport CustomizedSelect from \"../transactions/customizedSelect\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton from \"../../forms/button\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport { MBRStatusDialog } from \"../../home/customModal\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker,\n} from \"@material-ui/pickers\";\nimport { ALL } from \"shared/store/types\";\nimport {\n getInvestorDetails,\n getNewPurchaseFundList,\n} from \"shared/store/actions\";\nimport {\n getMailbackList,\n GetDistMailbackRequest,\n} from \"shared/store/actions/mailback\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport { SundaramMutualFund } from \"../transactions/newPurchaseForm\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\nexport const MAILBACK_URL = `${process.env.PUBLIC_URL}/mailBackRequest`;\nclass MailBack extends Component {\n constructor(props) {\n super(props);\n const { state } = this.props.location;\n this.state = {\n fund: { value: \"\" },\n reports: [],\n status: {\n value: false,\n },\n report:\n !!state && !!state.value\n ? {\n value: {\n label: state.value.KDM_Repdesc,\n value: state.value.KDM_Repcode,\n },\n }\n : { value: \"\" },\n reportType: { value: \"\" },\n fromDate: { value: null, error: false },\n toDate: { value: null, error: false },\n password: { value: \"\" },\n showPassword: false,\n open: false,\n disableReportType: !!state && !!state.value,\n refrenceNumber: { value: \"\" },\n };\n }\n\n async componentDidMount() {\n const response = await this.props.getMailbackList();\n if (response) {\n this.setState({\n reports: response.DtData,\n });\n }\n }\n handleChangeReports = (value) => {\n this.setState({\n report: { value },\n });\n };\n handleChangeReportTypes = (event) => {\n this.setState({\n reportType: { value: event.target.value },\n });\n };\n handleChangeFunds = (value) => {\n this.setState({\n fund: { value },\n });\n };\n handleChangePassword = (event) => {\n this.setState({\n password: { value: event.target.value },\n });\n };\n onDateChange = (label, event) => {\n if (label === \"toDate\" && !!this.state.fromDate.value && !!event) {\n const reformtStDt = this.state.fromDate.value.toLocaleDateString(\n \"en-US\",\n {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n }\n );\n\n const changeEndDt = event.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n if (d2 > d3 || d2 === d3) {\n this.setState({\n [label]: {\n value: null,\n error: true,\n errorMessage: \"Start Date should be earlier than End Date\",\n },\n });\n } else {\n this.setState({\n [label]: { value: event, errorMessage: \"\", error: false },\n });\n }\n } else if (label === \"fromDate\") {\n this.setState({\n [label]: { value: event },\n toDate: { value: null, error: \"\", errorMessage: \"\" },\n });\n }\n // this.setState({ [label]: { value: event } });\n };\n\n submit = async () => {\n let toDateValue;\n let fromDateValue;\n if (this.state.fromDate.value) {\n fromDateValue = this.state.fromDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n }\n if (this.state.toDate.value) {\n toDateValue = this.state.toDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n }\n const {\n funds,\n fund,\n reports,\n fromDate,\n status,\n toDate,\n showPassword,\n open,\n refrenceNumber,\n disableReportType,\n ...others\n } = this.state;\n\n const keys = Object.keys(others);\n const d2 = new Date(this.state.fromDate.value).setHours(12, 0, 0, 0);\n const d3 = new Date(this.state.toDate.value).setHours(12, 0, 0, 0);\n\n const findError = keys.every((key) => !!others[key].value);\n\n if (!this.state.toDate.value) {\n this.setState({\n toDate: {\n value: null,\n error: true,\n errorMessage: \"End date is mandatory\",\n },\n });\n }\n\n if (!this.state.fromDate.value) {\n this.setState({\n fromDate: {\n value: null,\n error: true,\n errorMessage: \"Start date is mandatory\",\n },\n });\n }\n\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"report\"\n ? \"Report\"\n : key === \"reportType\"\n ? \"Report type\"\n : key === \"password\"\n ? \"Password\"\n : key === \"fund\"\n ? \"Fund\"\n : \"\"\n } is mandatory`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n case \"report\": {\n this.reportField.focus();\n break;\n }\n case \"reportType\": {\n this.reportTypeField.focus();\n break;\n }\n case \"fromDate\": {\n this.fromDateField.focus();\n break;\n }\n case \"toDate\": {\n this.toDateField.focus();\n break;\n }\n }\n } else if (\n this.state.password.value === \"\" ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.password.value\n )\n ) {\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.password.value\n )\n ) {\n this.setState({\n password: {\n value: this.state.password.value,\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n } else if (this.state.password.value === \"\") {\n this.setState({\n password: {\n value: this.state.password.value,\n isError: true,\n errorMessage: `Password is mandatory`,\n },\n });\n return;\n }\n } else if (!this.state.fromDate.value) {\n this.setState({\n fromDate: {\n value: null,\n error: true,\n errorMessage: \"Start Date is mandatory\",\n },\n });\n return;\n } else if (!this.state.toDate.value) {\n this.setState({\n toDate: {\n value: null,\n error: true,\n errorMessage: \"End date is mandatory\",\n },\n });\n return;\n } else if (d2 > d3 || d2 === d3) {\n this.setState({\n toDate: {\n value: null,\n error: true,\n errorMessage: \"Start date should be earlier than End date\",\n },\n });\n } else {\n const params = {\n Userid: this.props.userId,\n ReportNumber: this.state.report.value.value,\n ZipPwd: this.state.password.value,\n Fund: \"105\",\n toDate: toDateValue,\n fromDate: fromDateValue,\n ReqBy: ALL,\n Agent: this.props.token,\n reportType: this.state.reportType.value === \"Excel\" ? \"Excel\" : \"DBF\",\n };\n const response = await this.props.GetDistMailbackRequest(params);\n if (response) {\n this.setState({\n open: true,\n refrenceNumber: { value: response.DtData[0].Refno },\n });\n }\n }\n };\n\n closeModal = () => {\n this.setState({\n open: false,\n fund: { value: \"\" },\n report: { value: \"\" },\n reportType: { value: \"\" },\n fromDate: { value: null, error: false },\n toDate: { value: null, error: false },\n password: { value: \"\" },\n refrenceNumber: { value: \"\" },\n disableReportType: false,\n });\n };\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"\") {\n this.setState({\n [label]: {\n value: \"\",\n isError: this.state.selfPassword.value === \"\" ? true : !value,\n errorMessage:\n this.state.selfPassword.value === \"\"\n ? `(selfPassword is mandatory)`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n close() {\n this.setState({\n status: {\n value: false,\n },\n });\n }\n gotoblur = () => {\n if (\n this.state.password.value === \"\" ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.password.value\n )\n ) {\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.password.value\n )\n ) {\n this.setState({\n password: {\n value: this.state.password.value,\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n } else if (this.state.password.value === \"\") {\n this.setState({\n password: {\n value: this.state.password.value,\n isError: true,\n errorMessage: `Password is mandatory`,\n },\n });\n return;\n }\n }\n };\n\n render() {\n const { fundsList, location } = this.props;\n const { fund, reports, report, reportType, password } = this.state;\n const { state } = location;\n return (\n \n \n \n
\n\n My Reports
\n\n \n
\n \n
\n\n \n (this.reportTypeField = ele)}\n isError={reportType.isError}\n errorMessage={reportType.errorMessage}\n isShowError={reportType.isError}\n placeholder=\"Select Report Type\"\n >\n \n \n \n
\n \n ({\n label: item.KDM_Repdesc.split(\"-\")[1].trim(),\n value: item.KDM_Repcode,\n }))}\n value={report.value}\n placeholder=\"Select Report\"\n errorMessage={report.errorMessage}\n maxDate={new Date()}\n disabled={this.state.disableReportType}\n inputRef={(ele) => (this.reportField = ele)}\n isError={report.isError}\n isShowError={report.isError}\n handleChange={this.handleChangeReports}\n />\n
\n Select Report
\n \n
\n \n \n this.onDateChange(\"fromDate\", e)}\n // openTo={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n maxDate={new Date()}\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.fromDate.value}\n />\n {!!this.state.fromDate.errorMessage ? (\n \n {this.state.fromDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n Start Date
\n \n \n this.onDateChange(\"toDate\", e)}\n // onBlur={}\n // openTo={true}\n disabled={!this.state.fromDate.value ? true : false}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n errorMessage={this.state.toDate.errorMessage}\n maxDate={new Date()}\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.toDate.value}\n />\n {!!this.state.toDate.errorMessage ? (\n \n {this.state.toDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n End Date
\n \n
\n \n \n\n \n {\n this.setState({\n showPassword: !this.state.showPassword,\n });\n }}\n image2={\n !!this.state.showPassword ? EYE_ICON : EYE_ICON_HIDDEN\n }\n height={15}\n value={password.value}\n inputRef={(ele) => (this.passwordField = ele)}\n isShowError={password.isError}\n errorMessage={password.errorMessage}\n />\n {!password.isError && (\n \n Password should be at least 8 characters in length and\n should contain at least 1 uppercase letter (A-Z), 1\n special character and 1 numeric value (0-9)\n
\n )}\n \n
\n\n \n {!!transactions && !!transactions.length ?\n \n \n {!!display ? (\n
\n }\n \n )}\n : \n No Investor PAN found. Please submit Investor PAN\n
\n ) : (\n \n
\n ))}\n \n Transactions(Last 10 Transactions)\n
\n {transactions.map((transaction, index) => (\n \n
\n\n \n
\n \n
\n Fund Name
\n {transaction.SchemeDesc}
\n \n {transaction.Status === \"Pending\" ||\n transaction.Status === \"Pending payment confirmation\" ||\n transaction.Status === \"Success\" ? (\n \n {transaction.Status === \"Rejected\" ? (\n \n this.props.history.push(\n NEW_TRANSACTION_URL + \"/transction-types\"\n )\n }\n />\n ) : (\n \n this.props.history.push(\n NEW_TRANSACTION_URL + \"/transction-types\"\n )\n }\n />\n )}\n
\n \n
\n ) : (\n \n )}\n \n
\n No Data Found
\n }\n \n \n {\" \"}\n No Data Found\n
\n )}\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactionHistory }) => {\n const { investorData, userId } = authReducer;\n const { fundsList, transactions } = transactionHistory;\n return { investorData, userId, fundsList, transactions };\n },\n { getTransactionHistory, getTrackDetails, RemoveTransactionData }\n)(HistoryDetail);\n\nexport class SingleAmcheader extends Component {\n render() {\n const { invname, PAN } = this.props.investorData;\n return (\n \n Transactions(Last 10 Transactions)\n
\n {transactions.length > 0 ? (\n transactions.map((transaction, index) => (\n \n
\n );\n }\n}\n\nexport class TransactionSubContainer extends Component {\n render() {\n const { list } = this.props;\n return (\n <>\n {list.map((ele, index) => (\n \n
\n \n
\n \n
\n {invname}
\n PAN: {PAN}
\n \n \n {!!ele.value ? ele.value : \"-\"}\n
\n \n ))}\n \n );\n }\n}\nexport class InvestorTableCard extends Component {\n render() {\n const { Type, Ref_No, Folio, Units, Date, Status, Amount, NAV, Name, Investordata, transaction, gotoTrack } = this.props;\n return (\n {ele.key}
\n \n
\n\n \n \n {Name}\n
\n \n
\n \n \n {!!Type ? Type : \"-\"}\n
\n \n Type\n
\n \n \n ₹{!!Amount.split(\".\")[0] ? Amount.split(\".\")[0] : \"-\"}\n
\n \n \n \n Amount\n
\n \n
\n \n \n {!!Ref_No ? Ref_No : \"-\"}\n
\n \n Ref No\n
\n \n \n {!!Folio ? Folio : \"-\"}\n
\n \n \n \n Folio\n
\n \n
\n \n \n {!!NAV && NAV !== \"-\"\n ? `₹${NAV}`\n : \"-\"}\n
\n \n NAV\n
\n \n \n {!!Units ? Units : \"-\"}\n
\n \n \n \n Units\n
\n \n
\n \n \n {!!Date ? Date : \"-\"}\n
\n \n Date\n
\n \n \n {!!Status ? Status : \"-\"}\n
\n \n \n \n Status\n
\n \n {Status === \"Pending\" ||\n Status === \"Pending payment confirmation\" ||\n Status === \"Success\" ? (\n \n {Status === \"Rejected\" ? (\n \n this.props.history.push(\n NEW_TRANSACTION_URL + \"/transction-types\"\n )\n }\n />\n ) : (\n \n this.props.history.push(\n NEW_TRANSACTION_URL + \"/transction-types\"\n )\n }\n />\n )}\n
\n \n \n \n );\n }\n}","import { CALL_API } from \"../api.middleware\";\nimport { GET_FUNDS_LIST_PAN, GET_FUNDS_LIST_PAN_SUCCESS, GET_FUNDS_LIST_PAN_FAILED, GET_TRANSACTION_HISTORY, GET_TRANSACTION_HISTORY_SUCCESS, GET_TRANSACTION_HISTORY_FAILED, GET_NAV_DATA, GET_NAV_DATA_SUCCESS, GET_NAV_DATA_FAILED, REMOVE_NAV_DATA, REMOVE_TRANSACTION_HISTORY_DATA } from \"../types\";\nexport const getFundsByPan = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/GetFundslistByPAN\",\n params,\n types: [GET_FUNDS_LIST_PAN, GET_FUNDS_LIST_PAN_SUCCESS, GET_FUNDS_LIST_PAN_FAILED],\n showLoader: true,\n method: \"GET\"\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getTransactionHistory = function (params) {\n return async function (dispatch) {\n try {\n await dispatch({\n [CALL_API]: {\n url: \"/GetTrxnDatabyFund\",\n params,\n types: [GET_TRANSACTION_HISTORY, GET_TRANSACTION_HISTORY_SUCCESS, GET_TRANSACTION_HISTORY_FAILED],\n showLoader: true,\n method: \"GET\"\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const getNavData = function (params) {\n return async function (dispatch) {\n try {\n await dispatch({\n [CALL_API]: {\n url: \"/GetNAVGraph\",\n params,\n method: \"GET\",\n types: [GET_NAV_DATA, GET_NAV_DATA_SUCCESS, GET_NAV_DATA_FAILED],\n showLoader: true\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const removeNavData = function () {\n return {\n type: REMOVE_NAV_DATA\n };\n};\nexport const getTrackDetails = function (params) {\n return async function (dispatch) {\n try {\n return await dispatch({\n [CALL_API]: {\n url: \"/TrackTransactionDetails\",\n params,\n method: \"GET\"\n }\n });\n } catch (error) {\n return {\n error\n };\n }\n };\n};\nexport const RemoveTransactionData = function () {\n return {\n type: REMOVE_TRANSACTION_HISTORY_DATA\n };\n};","import React, { Component } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport Investors from \"../investors/InvestorMain\";\nimport HistoryDetail from \"./historyDetail\";\n\nexport default class HistoryRouter extends Component {\n render() {\n const { history, location } = this.props;\n return (\n \n
\n ) : (\n \n )}\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport Loader from \"react-loader-spinner\";\nimport \"react-loader-spinner/dist/loader/css/react-spinner-loader.css\";\n\nexport default class CustomLoading extends Component {\n render() {\n return (\n \n {count > 0 ? (\n \n No data Found\n
\n ) : (\n ((this.props.tran_enable_flag === \"Y\" &&\n investors.length !== this.props.investorsCount) ||\n this.props.tran_enable_flag === \"N\") && (\n \n {investors.map((investor, index) => (\n \n \n
\n \n \n \n \n this.props.history.push({\n pathname: `${INVESTOR_URL}/details/xxxxxxxxxx`,\n state: `${investor.Pan}`,\n })\n }\n style={{\n borderBottom: \"2px solid #80bce3\",\n paddingBottom: 3,\n fontFamily: \"SourceSansPro-SemiBold\",\n }}\n className=\"tabledata_invname\"\n >\n {investor.Name}\n \n )}\n
\n \n {pathname.includes(\"/investors\") ||\n pathname.includes(\"/transaction-history\") ? (\n \n {pathname.includes(\"/investors\") && (\n \n Select\n \n )}\n
\n \n
\n {investor.Mobile}
\n \n \n \n \n {this.state.errorMessage}\n
\n )}\n \n
\n \n Search\n
\n \n )}\n {!!this.state.errorMessage && (\n \n \n
*/}\n {this.state.active === NEW ? (\n New Transaction
\n\n {/* \n
\n )}\n\n {/* \n {this.props.investors.length > 0 && (\n \n this.props.history.push(\"/newTransaction/transction-types\")\n }\n >\n Next\n
\n )}\n */}\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, investor }) => {\n const { token } = authReducer;\n const { investors } = investor;\n return { investors, token };\n },\n { getInvestors }\n)(Transactions);\n","import React, { Component } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport Transactions from \"./TransactionMain\";\nimport TransactionType from \"./TransactionTypes\";\nimport TransactionMode from \"./TransactionModes\";\nimport NFOAndNewPurchaseDigital from \"./nfoAndNewPurchase\";\nimport EKYC from \"./ekycForm\";\n\nexport default class TransactionRouter extends Component {\n render() {\n const { history, location } = this.props;\n return (\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport {\n getNewPurchaseFundList,\n validateSubBroker,\n getInvestorDetails,\n submitPurchaseData,\n showPurchaseConfirmation,\n} from \"shared/store/actions\";\nimport {\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_SCHEME_LIST,\n GET_SCHEME_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n GET_SCHEME_LIST_FAILED,\n PURCHASE,\n ALL,\n REGULAR,\n NO,\n YES,\n NEW_PURCHASE,\n NEW,\n NEWP,\n} from \"shared/store/types\";\nimport { Checkbox } from \"@material-ui/core\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport { NEW_TRANSACTION_URL } from \".\";\nimport { INVESTOR_URL } from \"../investors\";\nclass NewPurchase extends Component {\n constructor(props) {\n super(props);\n\n const { investorData, communicationDetails = [], token } = this.props;\n const revCD =\n !!communicationDetails && communicationDetails.length > 0\n ? communicationDetails.reverse()\n : \"\";\n const Xmobile = (revCD || []).find(\n (detail) => detail.PAN === investorData.PAN && !!detail.Mobile\n );\n const Xemail = (revCD || []).find(\n (detail) => detail.PAN === investorData.PAN && !!detail.email\n );\n const Email = !!Xemail && !!Xemail.email ? Xemail.email : \"\";\n const Mobile = !!Xmobile && !!Xmobile.Mobile ? Xmobile.Mobile : \"\";\n\n this.state = {\n emailId: { value: Email || \"\" },\n mobile: { value: Mobile || \"\" },\n arnCode: { value: token },\n invName: { value: this.props.investorData.invname || \"\" },\n fund: { value: \"105\" },\n category: { value: \"\" },\n scheme: { value: \"\" },\n minAmount: { value: \"\" },\n subArnCode: { value: \"\" },\n euinNo: { value: \"\" },\n radioValue: { value: \"no\" },\n subBrokerCode: { value: \"\" },\n isCombo: false,\n combo: { flag: \"\", disclamier: \"\", label: \"\" },\n showSmart: false,\n smart: { flag: \"yes\" },\n code: { value: \"+91\" },\n Family_Code_Email: { value: \"\" },\n Family_Code_Phone: { value: \"\" },\n };\n }\n\n async componentDidMount() {\n const params = {\n opt: \"AT\",\n plntype: REGULAR,\n fund: \"105\",\n };\n\n const types = [\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n ];\n await this.props.getNewPurchaseFundList(params, types);\n }\n FamilyDescriptionEmail = (event) => {\n this.setState({\n Family_Code_Email: { value: event },\n });\n };\n FamilyDescriptionPhone = (event) => {\n this.setState({\n Family_Code_Phone: { value: event },\n });\n };\n handleChange = (label) => async (value) => {\n this.setState({ [label]: { value } });\n if (!value) {\n this.setState({\n [label]: { value: \"\" },\n category: { value: \"\" },\n scheme: { value: \"\" },\n minCost: \"\",\n euinNo: { value: \"\" },\n showSmart: false,\n });\n } else if (value.value === this.state.fund.value.value) {\n return;\n } else {\n let params = { plntype: REGULAR };\n params = { ...params, opt: \"AT\", fund: value.value };\n const types = [\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n ];\n const response = await this.props.getNewPurchaseFundList(params, types);\n if (response) {\n this.setState({\n [label]: { value },\n category: { value: \"\" },\n scheme: { value: \"\" },\n minCost: \"\",\n euinNo: { value: \"\" },\n showSmart: false,\n });\n }\n }\n };\n\n validateBrokerCode = async () => {\n if (\n !!this.state.subArnCode.value &&\n this.state.subArnCode.value === this.state.arnCode.value.split(\"-\")[1]\n ) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: \"ARN and Sub ARN Code should not be the same\",\n },\n });\n return;\n }\n\n const { fund, subArnCode, arnCode } = this.state;\n const params = {\n Fund: \"105\",\n SubAgentCd: !!subArnCode.value ? `ARN-${subArnCode.value}` : \"\",\n AgentCd: arnCode.value,\n };\n const response = await this.props.validateSubBroker(params);\n // if (!response) {\n // alert(`${response}`);\n // // this.setState({\n // // subArnCode: {\n // // value: \"\",\n // // isError: true,\n // // errorMessage: ``,\n // // },\n // // });\n // }\n };\n\n handleCategoryChange = (label) => async (event) => {\n this.setState({ [label]: { value: event.target.value } });\n if (!!event.target.value) {\n let params = { plntype: REGULAR };\n params = {\n ...params,\n opt: \"S\",\n schemetype: event.target.value,\n fund: \"105\",\n };\n const types = [\n GET_SCHEME_LIST,\n GET_SCHEME_LIST_SUCCESS,\n GET_SCHEME_LIST_FAILED,\n ];\n const response = await this.props.getNewPurchaseFundList(params, types);\n if (response) {\n this.setState({\n [label]: { value: event.target.value },\n scheme: { value: \"\" },\n minCost: \"\",\n });\n }\n } else {\n this.setState({\n [label]: { value: event.target.value },\n scheme: { value: \"\" },\n minCost: \"\",\n });\n }\n };\n\n changeScheme = (value) => {\n const comboScheme =\n !!value &&\n !!value.value &&\n this.props.schemeList.find((ele) => ele.Scheme_Plan === value.value);\n this.setState({\n scheme: { value: value, isError: false, errorMessage: \"\" },\n minAmount: { value: \"\", isError: false, errorMessage: \"\" },\n minCost: !!comboScheme && !!comboScheme.MinAmt ? comboScheme.MinAmt : \"\",\n multiples:\n !!comboScheme && !!comboScheme.multiples ? comboScheme.multiples : \"\",\n });\n if (!!value) {\n this.validateBrokerCode();\n }\n };\n\n changeValue = (label) => (event) => {\n if (label === \"minAmount\" && event.target.value.length <= 10) {\n this.setState({\n [label]: { value: event.target.value.replace(/^0+/, \"\") },\n });\n } else if (label === \"mobile\" && event.target.value.length <= 10) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label === \"subArnCode\" || label === \"subBrokerCode\") {\n if (/^\\d{0,15}$/.test(event.target.value)) {\n this.setState({\n [label]: { value: event.target.value },\n });\n return;\n } else {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid Number\",\n },\n });\n return;\n }\n } else if (label === \"invName\") {\n if (/^[A-Za-z ]{0,50}$/.test(event.target.value)) {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: `Enter a valid Name`,\n },\n });\n }\n } else if (label === \"emailId\") {\n if (this.state.emailId.value.length > 50) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid Email Address *\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value: event.target.value,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n } else if (\n label !== \"mobile\" &&\n label !== \"minAmount\" &&\n label !== \"subArnCode\" &&\n label !== \"subBrokerCode\"\n ) {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n\n changeEuin = (label) => (value) => {\n this.setState({\n [label]: { value },\n });\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n if (label === \"minAmount\") {\n if (!this.state.minAmount.value) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: `Investment Amount is Mandatory*`,\n },\n });\n } else if (this.state.minCost > this.state.minAmount.value) {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `(Amount should be atleast ₹${this.state.minCost})`,\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n } else if (label === \"emailId\") {\n if (!this.state.emailId.value) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"EmailId is Mandatory*\",\n },\n });\n } else if (\n /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.emailId.value\n )\n ) {\n this.setState({\n [label]: {\n value,\n isError: false,\n errorMessage: \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `Enter a valid Email Address*`,\n },\n });\n }\n } else if (label === \"mobile\") {\n if (\n /^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[6-9]\\d{9}$/.test(\n this.state.mobile.value\n )\n ) {\n this.setState({\n [label]: {\n value,\n isError: false,\n errorMessage: \"\",\n },\n });\n } else if (this.state.mobile.value === \"\") {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `Mobile is Mandatory*`,\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `Enter a valid Mobile Number *`,\n },\n });\n }\n } else if (label === \"invName\") {\n if (!/^[A-Za-z ]{4,50}$/.test(this.state.invName.value)) {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `Enter a valid Name`,\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: this.state.invName.value === \"\" ? true : false,\n errorMessage:\n this.state.invName.isError && `Investor Name is Mandatory*`,\n },\n });\n }\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n\n submit = async () => {\n const { location } = this.props;\n const { state } = location;\n\n const {\n arnCode,\n combo,\n subArnCode,\n isCombo,\n radioValue,\n invName,\n euinNo,\n minCost,\n subBrokerCode,\n showSmart,\n fund,\n multiples,\n smart,\n code,\n Family_Code_Email,\n Family_Code_Phone,\n ...others\n } = this.state;\n const arn = this.state.arnCode.value.split(\"-\");\n if (this.state.euinNo.value === \"\") {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n errorMessage: \"EUIN Declaration is Mandatory*\",\n },\n });\n }\n\n if (this.state.invName.value === \"\") {\n this.showError(\"invName\");\n this.invNameField.focus();\n }\n\n const keys = Object.keys(others);\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n key === \"category\"\n ? \"Category\"\n : key === \"scheme\"\n ? \"Scheme\"\n : key === \"minAmount\"\n ? \"Investment Amount\"\n : key === \"mobile\"\n ? \"Mobile \"\n : key[0].toUpperCase() + key.substr(1)\n } is Mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n case \"emailId\": {\n this.emailIdField.focus();\n break;\n }\n case \"mobile\": {\n this.mobileField.focus();\n break;\n }\n // case \"fund\": {\n // this.fundField.focus();\n // break;\n // }\n case \"category\": {\n this.categoryField.focus();\n break;\n }\n case \"scheme\": {\n this.schemeField.focus();\n break;\n }\n case \"minAmount\": {\n this.minAmountField.focus();\n break;\n }\n }\n } else if (invName.value === \"\") {\n this.showError(\"invName\");\n } else if (radioValue.value === \"no\" && !euinNo.value) {\n this.setState({\n euinNo: { ...euinNo, isError: true },\n });\n this.euinField.focus();\n return;\n } else if (minCost > others.minAmount.value) {\n this.setState({\n minAmount: {\n value: \"\",\n isError: true,\n errorMessage: `Minimum amount should be ₹${minCost} `,\n },\n });\n this.minAmountField.focus();\n } else if (\n /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.emailId.value\n ) === false\n ) {\n this.setState({\n emailId: {\n ...others[\"emailId\"],\n isError: true,\n errorMessage: `Enter a Vaild Email address`,\n },\n });\n this.emailIdField.focus();\n return;\n } else if (\n /^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[6-9]\\d{9}$/.test(\n this.state.mobile.value\n ) === false\n ) {\n this.setState({\n mobile: {\n ...others[\"mobile\"],\n isError: true,\n errorMessage: `Enter a Vaild phone Number`,\n },\n });\n this.mobileField.focus();\n return;\n } else if (arn[1] === this.state.subArnCode.value) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `and ARN code should not match `,\n },\n });\n } else if (\n !/^[+]\\d{1,3}/.test(this.state.code.value) &&\n (this.state.sipType.value === NEW || this.state.sipType.value === NEWP)\n ) {\n this.setState({\n code: {\n value: \"\",\n isError: true,\n errorMessage: !code.value\n ? \"Country Code is Mandatory\"\n : \"Enter a valid Country Code\",\n },\n });\n return;\n } else {\n const plan = this.state.scheme.value.value.split(\"~\");\n\n const params = {\n InvestorName: this.state.invName.value,\n i_entby: this.props.userId,\n trtype: PURCHASE,\n Desci: \"Yes~A~\",\n SubbrokerArn: !!this.state.subArnCode.value\n ? `ARN-${subArnCode.value}`\n : \"\",\n ARNCode: this.state.arnCode.value,\n EuinCode:\n this.state.radioValue.value === \"no\"\n ? this.state.euinNo.value.value\n : \"\",\n i_Userid: this.props.userId,\n Mobile: this.state.mobile.value,\n PanNo: this.props.investorData.PAN || state.pan,\n Email: this.state.emailId.value,\n i_Acno: \"0\",\n Subbroker: this.state.subBrokerCode.value,\n i_Fund: \"105\",\n i_UntAmtValue: this.state.minAmount.value,\n EUINFlag: this.state.radioValue.value === \"no\" ? NO : YES,\n EuinValid: this.state.radioValue.value === \"no\" ? NO : YES,\n i_Scheme: plan[1],\n i_Plan: plan[2],\n i_Option: plan[3],\n i_oldihno: \"0\",\n i_InvDistFlag: \"P\",\n ModuleName: \"Webile\",\n countrycode: this.state.code.value,\n fEmailFlag: this.state.Family_Code_Email.value.value,\n fMobileFlag: this.state.Family_Code_Phone.value.value,\n };\n\n const response = await this.props.submitPurchaseData(params);\n\n if (!!response && !response.error) {\n const {\n DtData: [purchaseData],\n } = response;\n const confirmationParams = {\n Trtype: PURCHASE,\n fund: \"105\",\n Refno: purchaseData.refno,\n ModuleName: \"Webile\",\n };\n const confirmationResponse = await this.props.showPurchaseConfirmation(\n confirmationParams\n );\n\n if (!!confirmationResponse && !confirmationResponse.error) {\n this.props.history.push({\n pathname:\n INVESTOR_URL + \"/transction-types/nfo-new-purchase/confirm\",\n state: {\n title: \"NEW FOLIO PURCHASE SUMMARY\",\n pan: !!state && !!state.pan ? state.pan : \"\",\n InvestorEmail: this.state.emailId.value,\n orginalScheme: this.state.scheme.value.label,\n InvestorMobile: this.state.mobile.value,\n scheme: { Fund: \"105\" },\n type: NEW_PURCHASE,\n arnCode: this.state.arnCode.value,\n },\n });\n } else if (!!confirmationResponse.error) {\n alert(`${confirmationResponse.error}`);\n }\n } else if (!!response && !!response.error) {\n alert(`${response.error}`);\n }\n }\n };\n\n ComboChange = () => {\n this.setState({\n isCombo: !this.state.isCombo,\n });\n };\n\n changeSmart = (event) => {\n this.setState({\n smart: { flag: event.target.value },\n });\n };\n\n render() {\n const { fundsList, schemeList, categoryList, euinList } = this.props;\n const {\n emailId,\n mobile,\n arnCode,\n fund,\n invName,\n category,\n combo,\n scheme,\n subArnCode,\n radioValue,\n euinNo,\n minAmount,\n subBrokerCode,\n smart,\n showSmart,\n isCombo,\n Family_Code_Email,\n Family_Code_Phone,\n code,\n } = this.state;\n const { location } = this.props;\n const { state } = location;\n\n return (\n \n
\n New Folio Purchase
\n\n {/* \n
*/}\n\n {/* {!!state && !!state.pan && ( */}\n AMC
\n \n (this.invNameField = ele)}\n />\n
\n\n \n ({\n label: item.family_description,\n value: item.family_code,\n }))}\n value={Family_Code_Email.value}\n placeholder=\"Select Family Description\"\n handleChange={this.FamilyDescriptionEmail}\n />\n
\n {/* )} */}\n \n Email Family Description\n
\n \n (this.emailIdField = ele)}\n errorMessage={this.state.emailId.errorMessage}\n />\n
\n \n ({\n label: item.family_description,\n value: item.family_code,\n }))}\n value={Family_Code_Phone.value}\n placeholder=\"Select Phone Description\"\n handleChange={this.FamilyDescriptionPhone}\n />\n
\n\n \n Mobile Family Description\n
\n \n (this.codeField = ele)}\n />\n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n value={mobile.value}\n onChange={this.changeValue(\"mobile\")}\n onBlur={this.showError(\"mobile\")}\n isShowError={mobile.isError}\n errorMessage={mobile.errorMessage}\n inputref={(ele) => (this.mobileField = ele)}\n />\n
\n\n \n (this.categoryField = ele)}\n isError={category.isError}\n errorMessage={category.errorMessage}\n >\n {categoryList.map((item, index) => (\n \n ))}\n \n
\n\n \n ({\n label: item.Scheme_Desc,\n value: item.Scheme_Plan,\n }))}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n handleChange={this.changeScheme}\n disabled={!category.value}\n inputRef={(ele) => (this.schemeField = ele)}\n isError={scheme.isError}\n errorMessage={scheme.errorMessage}\n />\n
\n\n Scheme*
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n placeholder=\"Amount\"\n step=\"1\"\n type=\"number\"\n value={minAmount.value}\n onChange={this.changeValue(\"minAmount\")}\n onBlur={this.showError(\"minAmount\")}\n errorMessage={minAmount.errorMessage}\n isShowError={minAmount.isError}\n inputref={(ele) => (this.minAmountField = ele)}\n />\n
\n\n \n
\n\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n value={subArnCode.value}\n isShowError={subArnCode.isError}\n errorMessage={subArnCode.errorMessage}\n onBlur={this.validateBrokerCode}\n onChange={this.changeValue(\"subArnCode\")}\n inputref={(ele) => (this.subArnField = ele)}\n />\n
\n\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n isShowError={subBrokerCode.isError}\n errorMessage={subBrokerCode.errorMessage}\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n value={subBrokerCode.value}\n onChange={this.changeValue(\"subBrokerCode\")}\n inputref={(ele) => (this.subBrokerField = ele)}\n />\n
\n \n \n \n \n
\n {radioValue.value === \"no\" ? (\n EUIN Declaration*
\n\n \n
\n YES
\n \n
\n \n NO
\n \n ({\n label: item.abm_agent,\n value: item.abm_agent,\n }))}\n value={euinNo.value}\n errorMessage={euinNo.errorMessage}\n placeholder=\"Choose EUIN\"\n handleChange={this.changeEuin(\"euinNo\")}\n disabled={!euinList.length}\n inputRef={(ele) => (this.euinField = ele)}\n isError={euinNo.isError}\n />\n
\n ) : (\n \n I/We hereby confirm that the EUIN Declaration box has been\n intentionally left the blank by me/us as this is an\n 'execution-only' transaction without any interaction or advice by\n any personnel of the above distributor or notwithstanding the\n advice of in-appropriateness,if any provided by any personnel of\n the distributor and the distributor has not charged any advisory\n fees on this transaction\n
\n )}\n\n \n
\n Social
;\n }\n}\n","import React, { Component } from \"react\";\nimport { DebtbuttonNowidth } from \"../../forms/button\";\nimport { Input } from \"../../forms/input\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { PasswordDialog } from \"../customModal\";\nimport {\n getProfileData,\n resetPassword,\n KARVY_STOCK_BROKING_LIMITED,\n SAMCO_STOCK\n} from \"shared/store/actions/profile\";\nimport { BUILD_URL } from \"../home\";\n\nclass Settings extends Component {\n constructor(props) {\n super(props);\n this.state = {\n openPasswordModal: false\n };\n }\n PasswordModal() {\n this.setState({\n openPasswordModal: true\n });\n }\n closeModal() {\n this.setState({\n openPasswordModal: false\n });\n }\n\n componentDidMount() {\n this.props.getProfileData({\n Agent: this.props.token,\n UserId: this.props.userId\n });\n }\n render() {\n const { profileData, reviewList, token } = this.props;\n const {\n Distributor_Name = \"\",\n City = \"\",\n MobileNo = \"\",\n PAN = \"\",\n Email = \"\"\n } = profileData;\n\n return (\n \n \n this.PasswordModal()}\n />\n
\n Profile Settings
\n \n
\n \n
\n\n \n
\n\n \n
\n\n \n
\n\n \n
\n\n \n
\n \n \n Status\n
\n \n {reviewList.slice(0, 9).map((item, index) => (\n Review
\n \n \n Year\n
\n \n
\n \n );\n }\n}\n\nexport class BlueLine extends Component {\n render() {\n return (\n \n
\n \n {fromYear} - {toYear}\n
\n\n \n \n {confirmation===\"Submitted\"?`Self Declaration ${confirmation}`:confirmation}\n
\n \n
\n \n \n 0 ? \"ThreeDots\" : \"\"}\n width={this.props.count > 0 ? 25 : 0}\n height={this.props.count > 0 ? 25 : 0}\n />\n )}\n \n
\n \n );\n }\n}\n\nDisplayCards.propTypes = {\n classes: PropTypes.object.isRequired,\n};\nexport default connect(({ loading }) => {\n const { count } = loading;\n return { count };\n})(withStyles(dashboardStyles)(DisplayCards));\n","const drawerWidth = 254;\n\nexport const drawerStyles = (theme) => ({\n root: {\n display: \"flex\",\n },\n toolbar: {\n height: 80,\n minHeight: 80,\n display: \"flex\",\n alignItems: \"center\",\n paddingLeft: 20,\n borderBottom: \"1px solid #E8EFF6\",\n },\n appBar: {\n width: `100%`,\n minHeight: 80,\n maxHeight: 80,\n marginLeft: drawerWidth,\n background: \"white\",\n boxShadow: \"0px 0px 1px -1px lavender\",\n },\n drawer: {\n width: drawerWidth,\n flexShrink: 0,\n overflow: \"hidden\",\n },\n drawerPaper: {\n width: drawerWidth,\n boxShadow: \"0px 0px 3px -1px lavender\",\n border: 0,\n overflow: \"hidden\",\n },\n content: {\n flexGrow: 1,\n margin: \"100px 30px 100px 30px\",\n backgroundColor: theme.palette.background.default,\n },\n appbaricons: {\n marginLeft: 20,\n marginTop: 20,\n },\n appabarlastlogin: {\n height: 20,\n },\n appabarring: {\n height: 20,\n marginLeft: 20,\n marginRight: 20,\n },\n appabarlogout: {\n cursor: \"pointer\",\n height: 35,\n marginLeft: 5,\n marginRight: 20,\n },\n lastlogindiv: {\n display: \"flex\",\n marginRight: 50,\n },\n lastloginmain: {\n color: \"gray\",\n fontSize: 14,\n marginLeft: 5,\n fontFamily: \"SourceSansPro-Regular\",\n },\n lastloginsub: {\n color: \"#003d7b\",\n },\n profile: {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n marginTop: 25,\n },\n profileimage: {\n background: \"rgba(218, 37, 29, 0.18)\",\n display: \"flex\",\n color: \"#1F317F\",\n fontSize: 22,\n fontFamily: \"SourceSansPro-SemiBold\",\n alignItems: \"center\",\n justifyContent: \"center\",\n height: 60,\n width: 60,\n marginRight: 0,\n borderRadius: \"50%\",\n },\n profileRole: {\n // backgroundColor: \"#e5f2f9\",\n padding: \"5px 20px 5px 10px\",\n borderTopRightRadius: 30,\n borderBottomRightRadius: 30,\n },\n profileRoletext: {\n color: \"#586a82\",\n fontFamily: \"SourceSansPro-Regular\",\n fontSize: 12,\n },\n profileRolesubtext: {\n color: \"#137ebf\",\n fontFamily: \"SourceSansPro-Bold\",\n fontSize: 12,\n },\n profileSettings: {\n display: \"flex\",\n alignItems: \"center\",\n padding: 10,\n marginRight: 5,\n border: \"1px solid rgba(0, 0, 0, 0.5px)\",\n borderRadius: 5,\n boxShadow: \"0px 0px 0px 1px lavender\",\n },\n profileSettingsicon: {\n height: 30,\n width: 35,\n marginRight: 10,\n },\n profileName: {\n color: \"#4E4E4E\",\n fontSize: 15,\n marginTop: 10,\n fontFamily: \"SourceSansPro-SemiBold\",\n textAlign: \"center\",\n },\n profilenametext: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n },\n profilenameMaintext: {\n display: \"flex\",\n justifyContent: \"flex-end\",\n fontSize: 13,\n fontFamily: \"SourceSansPro-SemiBold\",\n color: \"rgba(24, 42, 70, 0.8)\",\n textAlign: \"center\",\n marginTop: 2,\n },\n profilediv: {\n paddingBottom: 15,\n },\n profilenamesubtext: {\n color: \"#1f317f\",\n fontSize: 13,\n marginLeft: 5,\n marginTop: 2,\n fontFamily: \"SourceSansPro-Regular\",\n },\n combined: {\n margin: \"10px 0px\",\n },\n list: {\n margin: \"0px 4px 0px 0px\",\n\n padding: \"20px 0px\",\n paddingBottom: 120,\n overflow: \"auto\",\n },\n listImage: {\n marginLeft: 12,\n height: 15,\n },\n listTextActive: {\n fontSize: 14,\n marginLeft: 15,\n color: \"#00579B\",\n fontFamily: \"SourceSansPro-SemiBold\",\n },\n\n listText: {\n fontSize: 15,\n marginLeft: 12,\n color: \"#2D3034\",\n fontFamily: \"SourceSansPro-Regular\",\n },\n});\n\nexport const dashboardStyles = (theme) => ({\n card: {\n display: \"flex\",\n width: \"33%\",\n maxWidth: \"33%\",\n height: 100,\n margin: \"0px 10px\",\n },\n details: {\n display: \"flex\",\n flexDirection: \"column\",\n },\n content: {\n flex: \"1 0 auto\",\n display: \"flex\",\n paddingBottom: 0,\n flexDirection: \"column\",\n justifyContent: \"center\",\n },\n cover: {\n width: 151,\n },\n controls: {\n display: \"flex\",\n alignItems: \"center\",\n paddingLeft: theme.spacing(1),\n paddingBottom: theme.spacing(1),\n },\n playIcon: {\n height: 38,\n width: 38,\n },\n});\n\nexport const simpleCardsStyles = (theme) => ({\n card: {\n display: \"flex\",\n alignItems: \"center\",\n width: \"33.33%\",\n marginTop: 1,\n padding: \"16px 15px\",\n boxShadow: \"0px 0px 3px 1px lavender\",\n margin: \"0px 10px\",\n flexGrow: 1,\n },\n\n content: {\n display: \"flex\",\n flexDirection: \"column\",\n justifyContent: \"center\",\n padding: 0,\n },\n displaySimpleCard: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n },\n simpletwo: {\n display: \"flex\",\n alignItems: \"center\",\n },\n details: {\n margin: \"0px 20px\",\n },\n name: {\n fontSize: 14,\n fontFamily: \"SourceSansPro-Regular\",\n },\n count: {\n fontFamily: \"SourceSansPro-Bold\",\n fontSize: 18,\n },\n});\n","import React, { Component } from \"react\";\nimport { withStyles } from \"@material-ui/core/styles\";\nimport { simpleCardsStyles } from \"../appCss\";\nimport PropTypes from \"prop-types\";\nimport Card from \"@material-ui/core/Card\";\nimport CardContent from \"@material-ui/core/CardContent\";\nimport { BUILD_URL } from \"../home\";\nimport CustomLoading from \"../CustomLoader\";\nimport {\n NEW_INVESTORS,\n INACTIVE_INVESTORS,\n ACTIVE_INVESTORS,\n EXPIRING_NEXT_MONTH,\n CLOSED_THIS_MONTH,\n SIP_INVESTMENTS,\n} from \"shared/store/types\";\n\nclass DisplaySimpleCards extends Component {\n render() {\n const { classes } = this.props;\n const x = this.props.count + \"\";\n const nameArray = [\n \"Authorization Expired\",\n \"Authorization Approved\",\n \"Authorization Pending\",\n \"New Investors\",\n \"Active Investors\",\n \"Inactive Investors\",\n NEW_INVESTORS,\n INACTIVE_INVESTORS,\n ACTIVE_INVESTORS,\n EXPIRING_NEXT_MONTH,\n CLOSED_THIS_MONTH,\n SIP_INVESTMENTS,\n ];\n\n return (\n \n {this.props.name}\n
\n {!!this.props.values ? (\n {this.props.values}
\n ) : (\n \n
\n \n\n {nameArray.includes(this.props.name) ? (\n \n
\n \n \n {this.props.name}\n
\n\n {this.props.count >= 0 ? (\n \n {!!x && x.length === 1 && x !== \"0\" ? \"0\" + x : x}\n
\n ) : (\n \n
\n ) : (\n \"\"\n )}\n \n \n \n 0 && !earnings.length ? true : false}\n display={true}\n />\n ) : (\n \n \n )}\n
\n );\n }\n}\n\nexport default connect(\n ({ transactions, authReducer, loading }) => {\n const { earnings } = transactions;\n const { token } = authReducer;\n const { count } = loading;\n return { token, earnings, count };\n },\n { getFundWiseEarnings }\n)(MyEarnings);\n\nexport class EarningsBlock extends Component {\n render() {\n const { earning, index } = this.props;\n return (\n My Earnings
\n {count > 0 && !earnings.length ? (\n \n
\n \n
\n {!!earnings.length ? (\n earnings.map((earning, index) => (\n \n Brokerage Details(Last 6 Months)\n
\n \n Total:
\n No Data Found
\n )}\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport DisplayCards from \"./displaycards\";\nimport DisplaySimpleCards from \"./displaySimpleCards\";\nimport TabHeader from \"../../forms/tabHeader\";\nimport PieDiagram from \"./piechart\";\nimport { ALL } from \"shared/store/types\";\nimport { Paper } from \"@material-ui/core\";\nimport \"react-loader-spinner/dist/loader/css/react-spinner-loader.css\";\nimport moment from \"moment\";\nimport { FormatCurrency } from \"../currencyFormatter\";\nimport {\n getDashboardData,\n getAumData,\n getInvestors,\n getFrequentMailBackRequest,\n getInvestorDetails,\n getDashboardDataAum,\n getSipSummary,\n PosterOpen,\n} from \"shared/store/actions\";\nimport { getMailbackList } from \"shared/store/actions/mailback\";\nimport {\n getProfileData,\n KARVY_STOCK_BROKING_LIMITED,\n SAMCO_STOCK,\n} from \"shared/store/actions/profile\";\nimport { connect } from \"react-redux\";\nimport {\n AUTHORIZATION_PENDING,\n AUTHORIZATION_APPROVED,\n AUTHORIZATION_EXPIRED,\n INACTIVE_INVESTORS,\n ACTIVE_INVESTORS,\n NEW_INVESTORS,\n EXPIRING_NEXT_MONTH,\n CLOSED_THIS_MONTH,\n SIP_INVESTMENTS,\n} from \"shared/store/types\";\nimport { BUILD_URL } from \"../home\";\nimport { MyEarnings_URL } from \"../myEarnings\";\nimport { PosterDialog } from \"../customModal\";\n\n\nclass Dashboard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n date: new Date().toLocaleDateString(),\n reports: [],\n report: { value: \"\" },\n Tab: \"AUM_SUMMARY\",\n PosterOpen:true,\n\n };\n }\n\n goToRoute = (path) => () => {\n this.props.history.push({\n pathname: BUILD_URL + \"/dashboard/transaction-summary\",\n state: {\n active: path,\n },\n });\n };\n closePoster = async () => {\n this.setState({\n PosterOpen: false,\n });\n await this.props.PosterOpen(1);\n };\n\n goToSIPRoute = (path) => () => {\n this.props.history.push({\n pathname: BUILD_URL + \"/dashboard/SipSummaryTypes\",\n state: {\n active: path,\n },\n });\n };\n\n async componentDidMount() {\n this.props.getProfileData({\n Agent: this.props.token,\n UserId: this.props.userId,\n });\n\n const body = {\n AgentCode: this.props.token,\n UserId: this.props.userId,\n DateVal: moment(new Date()).format(\"MM-DD-YYYY\"),\n };\n this.props.getDashboardDataAum(body);\n\n this.props.getDashboardData({\n AgentCode: this.props.token,\n });\n\n this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: ALL,\n });\n\n const sipParams = {\n Uid: this.props.userId,\n AgentCode: this.props.token,\n DateVal: moment(new Date()).format(\"MM-DD-YYYY\"),\n };\n const api =\n this.props.token === \"ARN-0018\"\n ? \"\"\n : this.props.getSipSummary(sipParams);\n\n const response = await this.props.getMailbackList();\n if (response) {\n this.setState({\n reports: response.DtData,\n });\n }\n }\n handleChangeSubReports = (value) => () => {\n this.props.history.push({\n pathname: `${process.env.PUBLIC_URL}/mailBackRequest`,\n state: {\n value: value,\n },\n });\n };\n\n currencyConverter = (value) => {\n if (Math.abs(Number(value)) >= 1.0e5) {\n return `${parseInt(Math.abs(Number(value)) / 1.0e5)} Lacs`;\n } else if (Math.abs(Number(value)) >= 1.0e7) {\n return `${parseInt(Math.abs(Number(value)) / 1.0e7)} Cr`;\n } else if (Math.abs(Number(value)) >= 1.0e3) {\n return `${parseInt(Math.abs(Number(value)) / 1.0e3)} K`;\n } else {\n return Math.abs(Number(value));\n }\n };\n\n handleChangeTab = (label) => () => {\n this.setState({\n Tab: label,\n });\n };\n\n gotoNfo = () => {\n this.props.history.push(`${process.env.PUBLIC_URL}/dashboard/nfo-funds`);\n };\n gotoEarnings = () => {\n this.props.history.push(`${process.env.PUBLIC_URL}/my-earnings`);\n };\n\n //transaction-summary // kebab case // route names , css class names\n //transactionSummary // camel case // variables, function names.\n //transaction_summary // snake case //\n //TransactionSummary // PascalCase //Class names\n\n render() {\n const {\n transactionSummary,\n my_aum,\n numberofschemes,\n profileData,\n dashboardAUMData,\n sipSummaryData,\n } = this.props;\n const AmcAumList =\n !!dashboardAUMData && dashboardAUMData.Table4\n ? dashboardAUMData.Table2\n : [];\n\n const SipAumList =\n !!sipSummaryData && !!sipSummaryData.DtData ? sipSummaryData.DtData : [];\n\n const AUMDetails =\n !!dashboardAUMData && dashboardAUMData.Table3\n ? dashboardAUMData.Table3\n : [];\n const AUMPieData =\n !!dashboardAUMData && dashboardAUMData.DtData\n ? dashboardAUMData.DtData.map((ele) => ({\n name: ele.category,\n value: ele.aum_percent,\n ruppess: ele.aum,\n }))\n : [];\n return (\n {earning.BankName}
\n \n
\n\n \n
\n Period:
\n \n {earning.Fromdate} to {earning.ToDate}\n
\n \n
\n Amount
\n \n
\n \n {this.props.posterStatus === 0 && (\n \n \n
\n */}\n\n \n {profileData.Distributor_Name} Portfolio\n
\n {!!this.props.tran_enable_flag &&\n this.props.tran_enable_flag === \"N\" && (\n \n {profileData.Distributor_Name} Portfolio\n
\n \n MY AUM\n \n (as on{\" \"}\n \n {moment(new Date(), \"DD/MM/YYYY\").format(\"MMM DD, YYYY\")})\n \n \n
\n\n \n
\n \n\n \n
\n \n \n
\n \n \n \n No Data Found\n
\n )}\n \n \n Asset Class Wise Investment Break Up\n
\n {!!AUMPieData.length ? (\n \n TRANSACTION SUMMARY\n \n (as on{\" \"}\n \n {moment(new Date(), \"DD/MM/YYYY\").format(\"MMM DD, YYYY\")})\n \n \n
\n \n
\n\n \n
\n \n
\n \n \n {!!this.state.reports &&\n this.state.reports.map((item) => (\n \n
\n )}\n\n {this.state.Tab === \"SIP_SUMMARY\" && (\n \n
\n )}\n\n {this.state.Tab === \"AUM_SUMMARY\" && (\n \n
\n {SipAumList.map((item, index) => (\n \n
\n \n {!!AmcAumList && AmcAumList.length > 0 ? (\n AmcAumList.map((item, index) => (\n \n No Data Found\n
\n )}\n \n )}\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, dashboard, investor, profileReducer }) => {\n const { token, userId, tran_enable_flag,posterStatus } = authReducer;\n const { count } = investor;\n const { profileData } = profileReducer;\n const {\n transactionSummary = {},\n my_aum,\n numberofschemes,\n aumData,\n fundData,\n totalAum,\n sipSummaryData,\n dashboardAUMData,\n } = dashboard;\n return {\n token,\n dashboardAUMData,\n posterStatus,\n userId,\n transactionSummary,\n sipSummaryData,\n my_aum,\n count,\n profileData,\n totalAum,\n numberofschemes,\n aumData,\n fundData,\n tran_enable_flag,\n };\n },\n {\n getDashboardData,\n getDashboardDataAum,\n PosterOpen,\n getSipSummary,\n getAumData,\n getInvestors,\n getInvestorDetails,\n getFrequentMailBackRequest,\n getProfileData,\n getMailbackList,\n }\n)(Dashboard);\n\nexport class SubReports extends Component {\n render() {\n return (\n \n \n \n
\n \n \n {value.descr}\n
\n Investors
\n \n
\n {/* \n Brokerage Details{\" \"}\n \n {\" \"}\n (Last 6 Months)\n \n
\n \n {!!title ?
\n \n );\n }\n}\n\n// NFO CODE\n\n// \n {summaryData.length > 0 ? (\n summaryData.map((ele, index) => (\n \n {\" \"}\n No Data Found\n
\n )}\n \n \n
\n \n \n {!!InvName ? InvName : \"NA\"}\n
\n \n Name\n
\n \n \n {!!date ? date : \"NA\"}\n
\n \n \n \n Date\n
\n \n
\n \n \n {!!type ? type : \"NA\"}\n
\n \n Type\n
\n \n \n {!!contact ? contact : \"NA\"}\n
\n \n \n \n Contact\n
\n \n Amount\n
\n \n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { token } = authReducer;\n return { token };\n },\n { getTransactionData }\n)(TabContainer);\n","import React, { Component } from \"react\";\nimport TabHeader from \"../../forms/tabHeader\";\nimport {\n INACTIVE_INVESTORS,\n NEW_INVESTORS,\n ACTIVE_INVESTORS\n} from \"shared/store/types\";\n\nexport default class ListOfInvestors extends Component {\n render() {\n const { active } = this.props;\n return (\n \n
\n )}\n\n {tableData.length > 0 ? tableData.map((ele, index) => (\n \n {!!tableData.length && (\n \n {tablearray.map((ele, index) => (\n \n {ele}\n
\n ))}\n \n {ele.name}\n
\n\n \n {ele.funddesc}\n
\n\n \n {ele.pangir}\n
\n\n \n {ele.mobile}\n
\n\n \n {ele.email}\n
\n \n )): \n {tableData.length > 0 ? (\n tableData.map((ele, index) => (\n \n {\" \"}\n No Data Found\n
\n )}\n \n \n );\n }\n}\n\nexport default connect(({ dashboard }) => {\n const { dashboardAUMData, sipSummaryData } = dashboard;\n return { dashboardAUMData, sipSummaryData };\n}, null)(ListOfInvestorsTabs);\n\n\nexport class InvestorTableCard extends Component {\n render() {\n const { invName, pan, mobile, email } = this.props;\n return (\n \n
\n \n \n {!!pan ? pan : \"NA\"}\n
\n \n PAN\n
\n \n \n {!!mobile ? mobile : \"NA\"}\n
\n \n \n \n Mobile\n
\n \n \n {!!email ? email : \"NA\"}\n
\n \n \n );\n }\n}\n\n","import React, { Component } from \"react\";\nimport TabHeader from \"../../forms/tabHeader\";\nimport {\n EXPIRING_NEXT_MONTH,\n CLOSED_THIS_MONTH,\n SIP_INVESTMENTS,\n} from \"shared/store/types\";\n\nexport default class SipSummaryMainTabs extends Component {\n render() {\n const { active } = this.props;\n return (\n \n Email\n
\n \n \n \n \n \n this.props.history.push(\n `${INVESTOR_URL}/details/${ele.pan}`\n )\n }\n />\n
\n \n \n
\n )}\n {!!tableData && tableData.length > 0 ? (\n tableData.map((ele, index) => (\n \n {ele.invname}\n
\n Folio - {ele.acno}
\n )}\n \n
\n \n ))\n ) : tableData.length === 0 ? (\n \n
\n {this.state.Investmentsbutton === CWS ? (\n Email
\n \n {ele.email}\n
\n \n
\n ) : (\n Start Date
\n \n {/*
\n \n
\n )}\n {this.state.Investmentsbutton === CWS && (\n PAN
\n \n {/*
\n \n
\n )}\n EndDate
\n \n {ele.EndDate}\n
\n \n
\n Mobile Number
\n \n {ele.mobile}\n
\n \n {!!this.props.nfoSchemes &&\n !!this.props.nfoSchemes.DtData &&\n this.props.nfoSchemes.DtData.length > 0 ? (\n this.props.nfoSchemes.DtData.map((ele, index) => (\n \n Currently there are no active NFOs available.\n
\n )}\n \n );\n }\n}\n\nexport default connect(\n ({ dashboard }) => {\n const { nfoSchemes } = dashboard;\n return {\n nfoSchemes,\n };\n },\n { getNfoSchemes }\n)(NfoFunds);\n\nexport class NfoFundCard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n openShare: false,\n };\n }\n\n copyCodeToClipboard = () => {\n this.setState({\n openShare: false,\n });\n copy(this.props.link);\n alert(\"Link copied successfully\");\n };\n OpenShareOptions = () => {\n this.setState({\n openShare: !this.state.openShare,\n });\n };\n\n closeShare = () => {\n this.setState({\n openShare: false,\n });\n };\n\n render() {\n const { fund, OpeningDate, closingDate, scheme, link, LocationScheme } =\n this.props;\n console.log(link, LocationScheme, \"sldfjkldsf\");\n return (\n \n {ele.fund === \"105\" && (\n
\n ))\n ) : (\n \n \n Scheme\n
\n \n \n {OpeningDate}\n
\n \n \n \n Opening Date\n
\n \n \n Closing Date\n
\n \n {/* \n */}\n {/* \n
\n \n \n )}\n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { Input } from \"../../forms/input\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport { connect } from \"react-redux\";\nimport { LocalActivityOutlined } from \"@material-ui/icons\";\nimport Signbutton from \"../../forms/button\";\nimport {\n validateSubBroker,\n NfoSchemesSubmission,\n getNfoSchemes,\n} from \"shared/store/actions\";\nimport { NO, YES } from \"shared/store/types\";\nimport CustomizedDialogs from \"../customModal\";\n\nclass NfoTransact extends Component {\n constructor(props) {\n super(props);\n this.state = {\n subArnCode: { value: \"\" },\n subBrokerCode: { value: \"\" },\n radioValue: { value: \"no\" },\n euinNo: { value: \"\" },\n open: false,\n FundSchemes: [],\n scheme: { value: \"\" },\n nfoLink: \"\",\n refno: \"\",\n };\n }\n async componentDidMount() {\n const { location, nfoSchemes } = this.props;\n if (!!location && !!location.fund && !!location.scheme) {\n const params = {\n Fund: \"105\",\n SubAgentCd: \"\",\n AgentCd: this.props.token,\n };\n\n const Euinresponse = await this.props.validateSubBroker(params);\n if (!!nfoSchemes && !!nfoSchemes.Table2 && nfoSchemes.Table2.length > 0) {\n const filteredSchemes = nfoSchemes.Table2.filter(\n (ele) => String(ele.fund).trim() === \"105\"\n );\n this.setState({\n FundSchemes: filteredSchemes,\n });\n } else {\n const params = { fund: \"105\" };\n const response = await this.props.getNfoSchemes(params);\n\n if (!!response && !!response.Table2 && response.Table2.length > 0) {\n const filteredSchemes = response.Table2.filter(\n (ele) =>\n String(ele.fund).trim() === \"105\" &&\n ele.scheme_desc.toUpperCase().includes(location.scheme)\n );\n\n this.setState({\n FundSchemes: filteredSchemes,\n });\n }\n }\n } else {\n this.props.history.push(`${process.env.PUBLIC_URL}/dashboard/nfo-funds`);\n }\n }\n changeValue = (label) => (event) => {\n if (label === \"radioValue\" && event.target.value === \"no\") {\n if (!this.state.euinNo.value) {\n this.setState({\n radioValue: { value: event.target.value },\n });\n } else {\n this.setState({\n [label]: { value: event.target.value },\n euinNo: { value: \"\" },\n });\n }\n return;\n } else if (label === \"radioValue\" && event.target.value === \"yes\") {\n this.setState({\n radioValue: { value: event.target.value },\n });\n return;\n } else if (\n (label === \"subArnCode\" || label === \"subBrokerCode\") &&\n event.target.value.length <= 20\n ) {\n this.setState({\n [label]: { value: event.target.value },\n });\n return;\n }\n };\n\n changeEuin = (value) => {\n this.setState({\n euinNo: { value },\n });\n };\n\n submit = async () => {\n const {\n subArnCode,\n radioValue,\n euinNo,\n subBrokerCode,\n nfoLink,\n refno,\n open,\n FundSchemes,\n ...others\n } = this.state;\n const keys = Object.keys(others);\n if (this.state.euinNo.value === \"\" && radioValue.value === \"no\") {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n errorMessage: \"Euin Declartion is mandatory*\",\n },\n });\n }\n\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${key} is mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n case \"scheme\": {\n this.schemeField.focus();\n break;\n }\n }\n } else if (this.state.euinNo.value === \"\" && radioValue.value === \"no\") {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n errorMessage: \"Euin Declartion is mandatory*\",\n },\n });\n } else {\n const params = {\n euincode: this.state.euinNo.value.value,\n euinflag: this.state.radioValue.value === \"no\" ? NO : YES,\n fund: \"105\",\n scheme: this.state.scheme.value.value,\n userid: this.props.userId,\n invdistflag: \"P\",\n arncode: this.props.token,\n subarn: this.state.subArnCode.value,\n subbroker: this.state.subBrokerCode.value,\n };\n const response = await this.props.NfoSchemesSubmission(params);\n if (\n !!response &&\n !!response.DtData &&\n !!response.DtData[0] &&\n !!response.DtData[0].refno\n ) {\n this.setState({\n open: true,\n refno: response.DtData[0].refno,\n nfoLink: response.DtData[0].nfo_link,\n });\n }\n }\n };\n\n closeModal = () => {\n const { location } = this.props;\n\n this.setState({\n open: false,\n });\n this.props.history.push({\n pathname: `${process.env.PUBLIC_URL}/dashboard/nfo-funds`,\n link: this.state.nfoLink,\n fund: \"105\",\n scheme: this.state.scheme.value.label,\n });\n };\n\n handleSchemeChange = (value) => {\n if (!value) {\n this.setState({\n scheme: { value: \"\" },\n });\n return;\n } else if (\n !!value.value &&\n !!this.state.scheme.value.value &&\n value.value.scheme_desc === this.state.scheme.value.value.scheme_desc\n ) {\n return;\n } else {\n const scheme = value.value;\n\n this.setState({\n scheme: { value },\n });\n }\n };\n\n render() {\n const { radioValue, scheme, subBrokerCode, subArnCode, euinNo } =\n this.state;\n const { euinList } = this.props;\n return (\n \n \n
\n \n \n
\n \n \n
\n\n \n \n
\n \n \n \n
\n \n \n \n
\n\n \n
\n\n \n
\n \n
\n \n
\n \n \n (evt.key === \"e\" ||\n evt.key === \".\" ||\n evt.key === \"-\") &&\n evt.preventDefault()\n }\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n type=\"number\"\n onBlur={this.validateBrokerCode}\n onChange={this.changeValue(\"subArnCode\")}\n inputref={(ele) => (this.subArnField = ele)}\n />\n
\n \n \n 0\n ? this.state.FundSchemes.map((item) => ({\n label: item.scheme_desc,\n value: item.scheme,\n }))\n : []\n }\n label=\"AMC\"\n handleChange={this.handleSchemeChange}\n value={scheme.value}\n placeholder=\"Select Scheme\"\n inputRef={(ele) => (this.schemeField = ele)}\n isError={scheme.isError}\n errorMessage={scheme.errorMessage}\n />\n
\n Scheme
\n \n
\n \n \n (evt.key === \"e\" ||\n evt.key === \".\" ||\n evt.key === \"-\") &&\n evt.preventDefault()\n }\n type=\"number\"\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n value={subBrokerCode.value}\n onChange={this.changeValue(\"subBrokerCode\")}\n inputref={(ele) => (this.subBrokerField = ele)}\n />\n
\n \n
\n \n
\n\n \n \n \n \n \n
\n {radioValue.value === \"no\" ? (\n EUIN Declaration
\n \n
\n YES
\n \n
\n \n NO
\n \n ({\n label: item.abm_agent,\n value: item.abm_agent,\n }))}\n label=\"Euin\"\n handleChange={this.changeEuin}\n value={euinNo.value}\n disabled={!euinList.length}\n placeholder=\"Select EUIN\"\n inputRef={(ele) => (this.euinField = ele)}\n isError={euinNo.isError}\n errorMessage={euinNo.errorMessage}\n />\n
\n ) : (\n \n I/We hereby confirm that the EUIN box has been\n intentionally left the blank by me/us as this is an\n 'execution-only' transaction without any interaction or\n advice by any personnel of the above distributor or\n notwithstanding the advice of in-appropriateness,if any\n provided by any personnel of the distributor and the\n distributor has not charged any advisory fees on this\n transaction\n
\n )}{\" \"}\n \n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport Paper from \"@material-ui/core/Paper\";\n// import mailBackSoa from \"./mailBackSoa\";\nimport { MAILBACK_URL } from \".\";\nimport { BUILD_URL } from \"../home\";\nimport {MailBackSoaIcon,CASIcon,ELSSIcon,CANIcon,CGSIcon,GASIcon,networthIcon,mailbackRightarrow} from \"../../forms/appEssentials\";\n\nexport default class MailBackInvestor extends Component {\n render() {\n return (\n \n
\n );\n }\n}\n\nexport class RequestModes extends Component {\n render() {\n return (\n Mail Back Request – Investor
\n \n \n this.props.history.push({\n pathname:\n this.props.location.state &&\n this.props.location.state.investorData\n ? MAILBACK_URL +\n \"/investor/investor-selection/mail-back-soa\"\n : MAILBACK_URL + \"/investor/investor-selection\",\n\n state:\n this.props.location.state &&\n this.props.location.state.investorData\n ? {\n name: \"mailBackSoa\",\n investorData: this.props.location.state.investorData\n }\n : { name: \"mailBackSoa\" }\n })\n }\n />\n \n this.props.history.push({\n pathname:\n this.props.location.state &&\n this.props.location.state.investorData\n ? MAILBACK_URL +\n \"/investor/investor-selection/consolidated-account-statement\"\n : MAILBACK_URL + \"/investor/investor-selection\",\n state:\n this.props.location.state &&\n this.props.location.state.investorData\n ? {\n name: \"consolidated\",\n investorData: this.props.location.state.investorData\n }\n : {\n name: \"consolidated\"\n }\n })\n }\n />\n \n this.props.history.push({\n pathname:\n this.props.location.state &&\n this.props.location.state.investorData\n ? MAILBACK_URL + \"/investor/investor-selection/ELSS\"\n : MAILBACK_URL + \"/investor/investor-selection\",\n state:\n this.props.location.state &&\n this.props.location.state.investorData\n ? {\n name: \"ELSS\",\n investorData: this.props.location.state.investorData\n }\n : {\n name: \"ELSS\"\n }\n })\n }\n />\n \n this.props.history.push({\n pathname:\n this.props.location.state &&\n this.props.location.state.investorData\n ? MAILBACK_URL + \"/investor/investor-selection/CAN\"\n : MAILBACK_URL + \"/investor/investor-selection\",\n state:\n this.props.location.state &&\n this.props.location.state.investorData\n ? {\n name: \"CAN\",\n investorData: this.props.location.state.investorData\n }\n : {\n name: \"CAN\"\n }\n })\n }\n />\n \n this.props.history.push({\n pathname:\n this.props.location.state &&\n this.props.location.state.investorData\n ? MAILBACK_URL + \"/investor/investor-selection/CGS\"\n : MAILBACK_URL + \"/investor/investor-selection\",\n state:\n this.props.location.state &&\n this.props.location.state.investorData\n ? {\n name: \"CGS\",\n investorData: this.props.location.state.investorData\n }\n : {\n name: \"CGS\"\n }\n })\n }\n />\n \n this.props.history.push({\n pathname:\n this.props.location.state &&\n this.props.location.state.investorData\n ? MAILBACK_URL + \"/investor/investor-selection/GAS\"\n : MAILBACK_URL + \"/investor/investor-selection\",\n state:\n this.props.location.state &&\n this.props.location.state.investorData\n ? {\n name: \"GAS\",\n investorData: this.props.location.state.investorData\n }\n : {\n name: \"GAS\"\n }\n })\n }\n />\n\n \n this.props.history.push({\n pathname:\n this.props.location.state &&\n this.props.location.state.investorData\n ? MAILBACK_URL + \"/investor/investor-selection/GAS\"\n : MAILBACK_URL + \"/investor/investor-selection\",\n state:\n this.props.location.state &&\n this.props.location.state.investorData\n ? {\n name: \"Networth\",\n investorData: this.props.location.state.investorData\n }\n : {\n name: \"Networth\"\n }\n })\n }\n />\n
\n \n
\n \n {this.props.name}\n
\n \n
\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport TableData from \"../tableData\";\nimport Breadcrumbs from \"@material-ui/core/Breadcrumbs\";\nimport NavigateNextIcon from \"@material-ui/icons/NavigateNext\";\nimport Search from \"../searchComponent\";\nimport { ALL } from \"shared/store/types\";\nimport { connect } from \"react-redux\";\nimport { getInvestors } from \"shared/store/actions\";\nimport { MAILBACK_URL } from \".\";\nimport { BUILD_URL } from \"../home\";\nimport { dashboardActive } from \"../../forms/appEssentials\";\n\nclass InvestorSelection extends Component {\n componentDidMount() {\n this.props.getInvestors({ ARN: this.props.token, AllFavFlag: \"P\" });\n }\n\n render() {\n return (\n \n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { token } = authReducer;\n return { token };\n },\n { getInvestors }\n)(InvestorSelection);\n","import React, { Component } from \"react\";\n\nexport default class SubmitRequest extends Component {\n render() {\n return \n
\n \n this.props.history.push(MAILBACK_URL + \"/investor\")}\n className=\"breadcrumbs-unselect-label\"\n style={{cursor:\"pointer\"}}\n >\n Mail Back Types\n \n
\n\n\n Investors Selection
\n \n sumbit process
;\n }\n}\n","export const ASON = \"ASON\";\nexport const BETWEEN = \"BETWEEN\";\nexport const SINGLESOA = \"SINGLESSOA\";\nexport const MULTISOA = \"MULTISOA\";\nexport const SUMMARY = \"SUMMARY\";\nexport const DETAILED = \"DETAILED\";\nexport const CURRENTFINANCIALYEAR = \"CURRENTFINANCIALYEAR\";\nexport const PREVIOUSFINANCIALYEAR = \"PREVIOUSFINANCIALYEAR\";\nexport const SPECIFICPERIOD = \"SPECIFICPERIOD\";","import React,{Component} from \"react\";\nimport MailbackRouter from \"./mailBackRoutes\";\nimport Breadcrumbs from \"@material-ui/core/Breadcrumbs\";\nimport NavigateNextIcon from \"@material-ui/icons/NavigateNext\";\nimport { BUILD_URL } from \"../home\";\nimport { dashboardActive } from \"../../forms/appEssentials\";\n\nconst MAILBACK_URL = `${process.env.PUBLIC_URL}/mailBackRequest`;\n\nexport default class MailBackComponent extends Component {\n render (){\n return (\n \n
\n )\n }\n}\n\n\nexport class MailBackBreadCrumb extends Component {\n render() {\n const {name} = this.props;\n return(\n \n
\n )\n }\n}","import React, { Component } from \"react\";\nimport { List } from \"../transactions/nfoAndNewPurchase\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport { Input } from \"../../forms/input\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker,\n} from \"@material-ui/pickers\";\nimport {\n ASON,\n BETWEEN,\n SINGLESOA,\n MULTISOA,\n} from \"shared/store/types/mailBack\";\nimport {\n GET_FUNDS_LIST,\n GET_FUNDS_LIST_SUCCESS,\n GET_FUNDS_LIST_FAILED,\n ALL,\n} from \"shared/store/types\";\nimport {\n getInvestorDetails,\n getNewPurchaseFundList,\n} from \"shared/store/actions\";\nimport {\n getDistFoliobyPan,\n getMailbackSoaStatus,\n // getNewPurchaseFundList\n} from \"shared/store/actions/mailback\";\nimport {\n Select,\n Checkbox,\n ListItemText,\n Input as MaterialInput,\n} from \"@material-ui/core\";\nimport { DASHBOARD_URL } from \"../dashboard\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { SundaramMutualFund } from \"../transactions/newPurchaseForm\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\nclass MailBackSoa extends Component {\n constructor(props) {\n super(props);\n this.state = {\n names: [\"sai\", \"anil\", \"ravi\"],\n selectedNames: [],\n asDate: { value: null, error: false },\n DateON: ASON,\n fromDate: { value: null, error: false, errorMessage: \"\" },\n toDate: { value: null, error: false, errorMessage: \"\" },\n funds: [],\n fund: { value: \"\" },\n folios: [],\n folio: { value: \"\" },\n soaValue: SINGLESOA,\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n open: false,\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n\n async componentDidMount() {\n const params = {\n PAN: this.props.investorData.PAN,\n Fund: \"105\",\n Agent: this.props.token,\n };\n const response = await this.props.getDistFoliobyPan(params);\n if (response) {\n this.setState({\n folios: response.DtData.reduce((prev, curr) => {\n const alreadyExist = prev.find((item) => item === curr.acno);\n if (alreadyExist) {\n return prev;\n }\n return [...prev, curr.acno];\n }, []),\n });\n }\n }\n changeDateOn = (event) => () => {\n this.setState({\n DateON: event,\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n fund: { value: \"\" },\n selectedNames: [],\n });\n };\n changeSoaValue = (event) => () => {\n this.setState({\n soaValue: event,\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n };\n\n handlechange = (event) => {\n const { selectedNames } = this.state;\n const { value } = event.target;\n if (selectedNames.includes(value)) {\n this.setState({\n selectedNames: selectedNames.filter((item) => item !== value),\n });\n } else {\n this.setState({\n selectedNames: [...selectedNames, value],\n });\n }\n };\n\n handleChangeFunds = async (value) => {\n if (value.value === this.state.fund.value.value) {\n return;\n } else {\n this.setState({\n fund: { value },\n selectedNames: [],\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n if (!!value) {\n const params = {\n PAN: this.props.investorData.PAN,\n Fund: value.value,\n Agent: this.props.token,\n };\n const response = await this.props.getDistFoliobyPan(params);\n if (response) {\n this.setState({\n folios: response.DtData.reduce((prev, curr) => {\n const alreadyExist = prev.find((item) => item === curr.acno);\n if (alreadyExist) {\n return prev;\n }\n return [...prev, curr.acno];\n }, []),\n });\n }\n }\n }\n };\n handleChangefolio = (event) => {\n const folio = event.target.value;\n if (this.state.fund.value === \"\") {\n this.setState({\n selectedNames: [],\n });\n } else {\n this.setState({\n folio: { value: folio },\n soaValue: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n }\n };\n handleChangeSelfextractPassWord = (event) => {\n this.setState({\n selfExtract: { value: event.target.value },\n });\n };\n handleChangeConfirmSelfextractPassWord = (event) => {\n this.setState({\n confirmSelfExtract: { value: event.target.value },\n });\n };\n\n handleChangeSelfPassword = (event) => {\n this.setState({\n selfPassword: { value: event.target.value },\n });\n };\n handleChangeConfirmSelfPassword = (event) => {\n this.setState({\n ConfirmSelfPassword: { value: event.target.value },\n });\n };\n\n submit = async () => {\n const {\n selectedNames,\n asDate,\n DateON,\n fromDate,\n toDate,\n funds,\n fund,\n folios,\n folio,\n soaValue,\n showPassword,\n confirmShowPassword,\n names,\n open,\n ...others\n } = this.state;\n const keys = Object.keys(others);\n const d2 = new Date(this.state.fromDate.value).setHours(12, 0, 0, 0);\n const d3 = new Date(this.state.toDate.value).setHours(12, 0, 0, 0);\n const findError = keys.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n this.setState({ [key]: { ...others[key], isError: true ,errorMessage:`${key===\"selfPassword\"?\"Self-Password\":key===\"ConfirmSelfPassword\"?\"Confirm Self-Password\":\"\"} is mandatory` } });\n });\n return;\n } else if (this.state.selectedNames === []) {\n this.setState({\n password: {\n ...others[\"folio\"],\n isError: true,\n },\n });\n return;\n } else if (\n others.selfPassword.value === \"\" ||\n others.selfPassword.value !== others.ConfirmSelfPassword.value\n ) {\n if (others.selfPassword.value === \"\") {\n this.setState({\n password: {\n ...others[\"selfPassword\"],\n isError: true,\n errorMessage: `password is mandatory`,\n },\n });\n } else if (\n others.selfPassword.value !== others.ConfirmSelfPassword.value\n ) {\n this.setState({\n password: {\n ...others[\"ConfirmSelfPassword\"],\n isError: true,\n errorMessage: `password Mismatch`,\n },\n });\n }\n\n return;\n } else if (others.ConfirmSelfPassword.value === \"\") {\n this.setState({\n password: {\n ...others[\"ConfirmSelfPassword\"],\n isError: true,\n errorMessage: `password is mandatory`,\n },\n });\n return;\n } else if (\n !!d2 &&\n !!d3 &&\n (d2 > d3 || d2 === d3) &&\n this.state.DateON !== ASON\n ) {\n this.setState({\n toDate: {\n value: null,\n error: true,\n errorMessage: \"(*From Date Should less than to Date)\",\n },\n });\n } else if (\n (this.state.fromDate.value === null ||\n this.state.toDate.value === null) &&\n this.state.DateON !== ASON\n ) {\n if (this.state.fromDate.value === null) {\n this.setState({\n fromDate: { error: true },\n });\n }\n if (this.state.toDate.value === null) {\n this.setState({\n toDate: { error: true },\n });\n }\n } else {\n const params = {\n UserId: this.props.userId,\n Zippwd: this.state.selfPassword.value,\n RepType: \"SOA\",\n Arn: this.props.token,\n Pan: this.props.investorData.PAN,\n Acno: this.state.selectedNames.join(),\n Freq: this.state.soaValue === SINGLESOA ? \"S\" : \"M\",\n Fund: \"105\",\n stdt:\n this.state.DateON === ASON\n ? \"\"\n : this.state.fromDate.value\n ? this.state.fromDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n })\n : \"\",\n EndDt:\n this.state.DateON === ASON\n ? \"\"\n : this.state.toDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n }),\n };\n\n\n\n const response = await this.props.getMailbackSoaStatus(params);\n if (response) {\n this.setState({\n open: true,\n });\n }\n }\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"selfPassword\") {\n if (this.state.selfPassword.value === \"\" || !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)) {\n if(!/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)){\n this.setState({\n selfPassword: {\n value:this.state.selfPassword.value,\n isError: true,\n errorMessage: `Password should be at least 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n }\n }else if(this.state.selfPassword.value === \"\") {\n this.setState({\n selfPassword: {\n value:\"\",\n isError: true,\n errorMessage: `Password is mandatory`,\n },\n });\n return;\n }\n\n } else if (label === \"email\") {\n this.setState({\n [label]: {\n value,\n isError:\n /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.email.value\n ) === false\n ? true\n : !value,\n errorMessage:\n /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.email.value\n ) === false\n ? `(enter an vaild email address )`\n : \"\",\n },\n });\n } else if (label === \"ConfirmSelfPassword\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? true\n : !value,\n errorMessage:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? `The Password and Confirm Password do not match`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n\n closeModal = () => {\n this.setState({\n open: false,\n });\n this.props.history.replace(DASHBOARD_URL);\n };\n\n onDateChange = (label, event) => {\n if (label === \"toDate\" && !!this.state.fromDate.value && !!event ) {\n const reformtStDt = this.state.fromDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = event.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n if ( d2>d3|| d2 === d3) {\n this.setState({\n [label]: {\n value: null,\n error: true,\n errorMessage: \"Start date should be earlier than End date\",\n },\n });\n } else {\n this.setState({\n [label]: { value: event, errorMessage: \"\", error: false },\n });\n }\n } else if (label === \"fromDate\") {\n this.setState({\n [label]: { value: event },\n toDate: { value: null, error: \"\", errorMessage: \"\" },\n });\n }\n // this.setState({ [label]: { value: event } });\n };\n render() {\n const { investorData, fundsList } = this.props;\n const {\n selectedNames,\n DateON,\n fund,\n folios,\n soaValue,\n ConfirmSelfPassword,\n selfPassword,\n } = this.state;\n return (\n \n this.props.history.push(MAILBACK_URL + \"/investor\")}\n className=\"breadcrumbs-unselect-label\"\n style={{cursor:\"pointer\"}}\n >\n Mail Back Types\n \n
\n\n\n\n this.props.history.push({\n pathname:MAILBACK_URL + \"/investor/investor-selection\",\n state:\n !!this.props.investorData ?\n { name: !!name && name === \"Mail Back SOA\"?\"mailBackSoa\":name===\"Consolidated Account Statment\"?\"consolidated\":name===\"ELSS Account Statement\"?\"ELSS\":name===\"CAN Based Account Statement\"?\"CAN\":name===\"Capital Gains Account Statement\"?\"CGS\":name===\"Grandfathering Account Statement\"?\"GAS\":name===\"Networth Report\"?\"Networth\":\"Networth\",\n investorData: this.props.investorData\n } :\n {\n name:!!name && name === \"Mail Back SOA\"?\"mailBackSoa\":name===\"Consolidated Account Statment\"?\"consolidated\":name===\"ELSS Account Statement\"?\"ELSS\":name===\"CAN Based Account Statement\"?\"CAN\":name===\"Capital Gains Account Statement\"?\"CGS\":name===\"Grandfathering Account Statement\"?\"GAS\":name===\"Networth Report\"?\"Networth\":\"Networth\",\n }}\n )}\n >\n Investors Selection\n \n {this.props.name===\"Mailback SOA\"?\"Mail Back SOA\":this.props.name}
\n \n \n \n
\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions }) => {\n const { investorData, userId, token } = authReducer;\n const { fundsList } = transactions;\n return { investorData, userId, token, fundsList };\n },\n {\n getInvestorDetails,\n getNewPurchaseFundList,\n getDistFoliobyPan,\n getMailbackSoaStatus,\n }\n)(MailBackSoa);\n","import React, { Component } from \"react\";\nimport { List } from \"../transactions/nfoAndNewPurchase\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { Input } from \"../../forms/input\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport { BUILD_URL } from \"../home\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker,\n} from \"@material-ui/pickers\";\nimport { getAccountStatement } from \"shared/store/actions/mailback\";\nimport {\n SUMMARY,\n DETAILED,\n CURRENTFINANCIALYEAR,\n PREVIOUSFINANCIALYEAR,\n SPECIFICPERIOD,\n} from \"shared/store/types/mailBack\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport \"react-datepicker/dist/react-datepicker.css\";\n\nimport { MAILBACK_URL } from \".\";\nimport moment from \"moment\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\nimport investorData from \"../investors/investorData\";\n\nclass Cas extends Component {\n constructor(props) {\n super(props);\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n\n this.state = {\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value:d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n error: \"\",\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: GetEmail.email },\n open: false,\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n componentDidMount() {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n this.setState({\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value: d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n error: \"\",\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: GetEmail.email },\n open: false,\n });\n }\n onDateChange = (label, event) => {\n if (label === \"endDate\" && !!this.state.startDate.value && !!event ) {\n const reformtStDt = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = event.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n if ( d2>d3|| d2 === d3) {\n this.setState({\n [label]: {\n value: null,\n error: true,\n errorMessage: \"Start Date should be earlier than End Date\",\n },\n });\n } else {\n this.setState({\n [label]: { value: event, errorMessage: \"\", error: false },\n });\n }\n } else if (label === \"startDate\") {\n this.setState({\n [label]: { value: event },\n endDate: { value: null, error: \"\", errorMessage: \"\" },\n });\n }\n // this.setState({ [label]: { value: event } });\n };\n changesummaryData = (event) => () => {\n this.setState({\n summaryData: event,\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n };\n\n ChangeDetailedData = (event) => () => {\n if (event === PREVIOUSFINANCIALYEAR) {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear() - 1, 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n\n const reformtEndDt = new Date(\n new Date().setFullYear(new Date().getFullYear(), 2, 31)\n ).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d4 = new Date(reformtEndDt).setHours(12, 0, 0, 0);\n const d5 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n\n\n this.setState({\n DetailedData: event,\n startDate: {\n value: d2 > d3 ? new Date(\n new Date().setFullYear(new Date().getFullYear() - 1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear() - 2, 3, 1)\n ),\n },\n endDate: {\n value:d4>d5?new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 2, 31)\n ) :new Date(\n new Date().setFullYear(new Date().getFullYear(), 2, 31)\n ),\n },\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n } else if (event === SPECIFICPERIOD) {\n this.setState({\n DetailedData: event,\n startDate: { value: null },\n endDate: { value: null },\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n } else if (event === CURRENTFINANCIALYEAR) {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n this.setState({\n DetailedData: event,\n startDate: {\n value:d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n },\n endDate: { value: new Date() },\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n }\n };\n\n handleChangeSelfPassword = (event) => {\n this.setState({\n selfPassword: { value: event.target.value },\n });\n };\n handleChangeConfirmSelfPassword = (event) => {\n this.setState({\n ConfirmSelfPassword: { value: event.target.value },\n });\n };\n handleChangeEmail = (event) => {\n this.setState({\n email: { value: event.target.value },\n });\n };\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"selfPassword\") {\n if (this.state.selfPassword.value === \"\" || !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)) {\n if(!/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)){\n this.setState({\n selfPassword: {\n\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n }\n }else if(this.state.selfPassword.value === \"\") {\n this.setState({\n selfPassword: {\n value:\"\",\n isError: true,\n errorMessage: `Password is mandatory`,\n },\n });\n return;\n }\n\n }\n // else if (label === \"email\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? true\n // : !value,\n // errorMessage:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? `Enter a valid email address`\n // : \"\",\n // },\n // });\n // }\n else if (label === \"ConfirmSelfPassword\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? true\n : !value,\n errorMessage:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? `The Password and Confirm Password do not match`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n closeYesModal = () => {\n\n this.setState({\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value: new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)),\n error: \"\",\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n // email: { value: \"\" },\n open: false,\n });\n this.props.history.replace(\n MAILBACK_URL +\n \"/investor/investor-selection/consolidated-account-statement\"\n );\n };\n closeNoModal = () => {\n this.setState({\n open: false,\n });\n this.props.history.replace(process.env.PUBLIC_URL + \"/\");\n };\n submit = async () => {\n let asDateValue, startDateValue, endDateValue;\n if (this.state.AsDate.value) {\n asDateValue = this.state.AsDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n }\n if (this.state.startDate.value) {\n startDateValue = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n }\n if (this.state.endDate.value) {\n endDateValue = this.state.endDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n }\n\n\n\n const {\n AsDate,\n startDate,\n endDate,\n ConfirmSelfPassword,\n selfPassword,\n email,\n showPassword,\n confirmShowPassword,\n ...others\n } = this.state;\n\n if (\n !this.state.selfPassword.value ||\n !this.state.ConfirmSelfPassword.value ||\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n ) ||\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n )\n ) {\n this.setState({\n selfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n )\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (!this.state.selfPassword.value) {\n this.setState({\n selfPassword: {\n ...others[\"selfPassword\"],\n isError: true,\n errorMessage: `(password is mandatory)`,\n },\n });\n }\n if (!this.state.ConfirmSelfPassword.value) {\n this.setState({\n ConfirmSelfPassword: {\n ...others[\"ConfirmSelfPassword\"],\n isError: true,\n errorMessage: `(ConfirmSelfPassword is mandatory)`,\n },\n });\n }\n // if (\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // )\n // ) {\n // if (!this.state.email.value) {\n // this.setState({\n // email: {\n // ...others[\"email\"],\n // isError: true,\n // errorMessage: `(email is mandatory)`,\n // },\n // });\n // } else {\n // this.setState({\n // email: {\n // ...others[\"email\"],\n // isError: true,\n // errorMessage: `Enter a valid email address`,\n // },\n // });\n // }\n // }\n if (\n !!this.state.ConfirmSelfPassword &&\n !!this.state.selfPassword &&\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `(Password does not match )`,\n },\n });\n }\n } else {\n const {investorData} = this.props;\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n const params = {\n Soapwd: this.state.selfPassword.value,\n ToDate:\n this.state.summaryData === SUMMARY ? moment(new Date()).format(\"MM/DD/YYYY\") :endDateValue ,\n FromDate:\n this.state.summaryData === SUMMARY ? \"01/01/1970\" :startDateValue ,\n userid: this.state.email.value,\n Brokermail: this.state.email.value,\n Soaflag: \"C\",\n Pan:!!investorData && !!investorData.PAN ? investorData.PAN :\"\" ,\n Fund: \"105\",\n EmailId: GetEmail.email,\n Folio: \"0\",\n ReqBy: \"a\",\n LoginFlag: \"Y\",\n StmtFlag: this.state.summaryData === SUMMARY ? \"Summary\" : \"Detailed\",\n Broker: \"\",\n };\n\n const response = await this.props.getAccountStatement(params);\n if (response) {\n this.setState({\n open: true,\n });\n }\n }\n };\n\n render() {\n const { investorData } = this.props;\n const {\n summaryData,\n DetailedData,\n selfPassword,\n ConfirmSelfPassword,\n email,\n } = this.state;\n return (\n \n
\n\n \n
\n \n
\n )}\n\n\n Mail Back SOA
\n \n
\n {DateON === ASON ? (\n \n \n this.onDateChange(\"toDate\", e)}\n // openTo={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n maxDate={new Date()}\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n disabled={true}\n value={new Date()}\n />\n \n
\n ) : (\n As on Date
\n \n \n this.onDateChange(\"fromDate\", e)}\n // openTo={true}\n style={{\n border:\n this.state.fromDate.error === true\n ? \"1px solid red\"\n : \"1px solid rgba(211, 211, 211)\",\n\n borderRadius:\n this.state.fromDate.error === true ? 7 : 7,\n marginTop:0,\n marginBottom:10\n }}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n maxDate={new Date()}\n margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.fromDate.value}\n />\n \n\n
\n Start Date
\n \n \n this.onDateChange(\"toDate\", e)}\n disabled={!this.state.fromDate.value}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n maxDate={new Date()}\n margin=\"normal\"\n id=\"mui-pickers-date\"\n value={this.state.toDate.value}\n />\n \n {!!this.state.toDate.errorMessage ? (\n \n {this.state.toDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n End Date
\n \n
\n Folio
\n \n
\n SOA Type
\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n onBlur={this.showError(\"selfPassword\")}\n isShowError={selfPassword.isError}\n errorMessage={selfPassword.errorMessage}\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n inputref={(ele) => (this.selfPasswordField = ele)}\n />\n
\n \n Password should be at least 8 characters in length and should contain at least 1 uppercase letter (A-Z), 1 special character and 1 numeric value (0-9)\n
\n \n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n type={!!this.state.confirmShowPassword ? \"text\" : \"password\"}\n height={15}\n onChange={this.handleChangeConfirmSelfPassword}\n value={ConfirmSelfPassword.value}\n onBlur={this.showError(\"ConfirmSelfPassword\")}\n isShowError={ConfirmSelfPassword.isError}\n errorMessage={ConfirmSelfPassword.errorMessage}\n\n bordercolor=\"rgba(0, 0, 0, 0.5)\"\n inputref={(ele) => (this.ConfirmSelfPasswordField = ele)}\n />\n
\n \n
\n \n \n
\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { investorData, userId ,communicationDetails} = authReducer;\n\n // const userid = authReducer.userId;\n return { investorData, userId,communicationDetails };\n },\n { getAccountStatement }\n)(Cas);\n","import React, { Component } from \"react\";\nimport { List } from \"../transactions/nfoAndNewPurchase\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { Input } from \"../../forms/input\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport { BUILD_URL } from \"../home\";\nimport moment from \"moment\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker,\n} from \"@material-ui/pickers\";\nimport { getElssStatment } from \"shared/store/actions/mailback\";\nimport {\n SUMMARY,\n DETAILED,\n CURRENTFINANCIALYEAR,\n PREVIOUSFINANCIALYEAR,\n SPECIFICPERIOD,\n} from \"shared/store/types/mailBack\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport { NEW_TRANSACTION_URL } from \"../transactions\";\nimport { MAILBACK_URL } from \".\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\n\nclass ELSS extends Component {\n constructor(props) {\n super(props);\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n this.state = {\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value:d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n error: \"\",\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: GetEmail.email },\n open: false,\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n componentDidMount() {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n this.setState({\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value: d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n error: \"\",\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: GetEmail.email },\n open: false,\n });\n }\n onDateChange = (label, event) => {\n if (label === \"endDate\" && !!this.state.startDate.value && !!event ) {\n const reformtStDt = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = event.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n if ( d2>d3|| d2 === d3) {\n this.setState({\n [label]: {\n value: null,\n error: true,\n errorMessage: \"Start Date should be earlier than End Date\",\n },\n });\n } else {\n this.setState({\n [label]: { value: event, errorMessage: \"\", error: false },\n });\n }\n } else if (label === \"startDate\") {\n this.setState({\n [label]: { value: event },\n endDate: { value: null, error: \"\", errorMessage: \"\" },\n });\n }\n };\n changesummaryData = (event) => () => {\n this.setState({\n summaryData: event,\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n };\n\n ChangeDetailedData = (event) => () => {\n if (event === PREVIOUSFINANCIALYEAR) {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear() - 1, 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n\n const reformtEndDt = new Date(\n new Date().setFullYear(new Date().getFullYear(), 2, 31)\n ).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d4 = new Date(reformtEndDt).setHours(12, 0, 0, 0);\n const d5 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n\n this.setState({\n DetailedData: event,\n startDate: {\n value: d2 > d3 ? new Date(\n new Date().setFullYear(new Date().getFullYear() - 1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear() - 2, 3, 1)\n ),\n },\n endDate: {\n value:d4>d5?new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 2, 31)\n ) :new Date(\n new Date().setFullYear(new Date().getFullYear(), 2, 31)\n ),\n },\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n } else if (event === SPECIFICPERIOD) {\n this.setState({\n DetailedData: event,\n startDate: { value: null },\n endDate: { value: new Date() },\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n } else if (event === CURRENTFINANCIALYEAR) {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n this.setState({\n DetailedData: event,\n startDate: {\n value: d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)),\n },\n endDate: { value: new Date() },\n // email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n });\n }\n };\n\n handleChangeSelfPassword = (event) => {\n this.setState({\n selfPassword: { value: event.target.value },\n });\n };\n handleChangeConfirmSelfPassword = (event) => {\n this.setState({\n ConfirmSelfPassword: { value: event.target.value },\n });\n };\n handleChangeEmail = (event) => {\n this.setState({\n email: { value: event.target.value },\n });\n };\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"selfPassword\") {\n if (this.state.selfPassword.value === \"\" || !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)) {\n if(!/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)){\n this.setState({\n selfPassword: {\n\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n }\n }else if(this.state.selfPassword.value === \"\") {\n this.setState({\n selfPassword: {\n value:\"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n return;\n }\n }\n // else if (label === \"email\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? true\n // : !value,\n // errorMessage:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? `Enter a valid email address`\n // : \"\",\n // },\n // });\n // }\n else if (label === \"ConfirmSelfPassword\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? true\n : !value,\n errorMessage:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? `The Password and Confirm Password do not match`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n closeYesModal = () => {\n this.setState({\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value: new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)),\n error: \"\",\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n // email: { value: \"\" },\n open: false,\n });\n this.props.history.replace(\n MAILBACK_URL + \"/investor/investor-selection/ELSS\"\n );\n };\n closeNoModal = () => {\n this.setState({\n open: false,\n });\n this.props.history.replace(BUILD_URL + \"/\");\n };\n submit = async () => {\n let asDateValue, startDateValue, endDateValue;\n if (this.state.AsDate.value) {\n asDateValue = this.state.AsDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n }\n if (this.state.startDate.value) {\n startDateValue = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n }\n if (this.state.endDate.value) {\n endDateValue = this.state.endDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n }\n\n const {\n AsDate,\n startDate,\n endDate,\n ConfirmSelfPassword,\n selfPassword,\n showPassword,\n confirmShowPassword,\n email,\n ...others\n } = this.state;\n\n if (\n !this.state.selfPassword.value ||\n !this.state.ConfirmSelfPassword.value ||\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n ) ||\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n )\n ) {\n this.setState({\n selfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n )\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (!this.state.selfPassword.value) {\n this.setState({\n selfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n }\n if (!this.state.ConfirmSelfPassword.value) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `ConfirmSelfPassword is Mandatory`,\n },\n });\n }\n // if (\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // )\n // ) {\n // if (!this.state.email.value) {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Email is Mandatory`,\n // },\n // });\n // } else {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Enter a valid email address`,\n // },\n // });\n // }\n // }\n if (\n !!this.state.ConfirmSelfPassword &&\n !!this.state.selfPassword &&\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password does not match`,\n },\n });\n }\n } else {\n const {investorData} = this.props;\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n const params = {\n Soapwd: this.state.selfPassword.value,\n ToDate:\n this.state.summaryData === SUMMARY ? moment(new Date()).format(\"MM/DD/YYYY\") :endDateValue ,\n FromDate:\n this.state.summaryData === SUMMARY ? \"01/01/1970\" :startDateValue ,\n userid: this.state.email.value,\n Brokermail: this.state.email.value,\n Soaflag: \"C\",\n Pan: !!investorData && !!investorData.PAN ?investorData.PAN:\"\",\n Fund: \"105\",\n EmailId: GetEmail.email,\n Folio: \"0\",\n ReqBy: \"a\",\n LoginFlag: \"Y\",\n StmtFlag: this.state.summaryData === SUMMARY ? \"Summary\" : \"Detailed\",\n Broker: \"\",\n };\n const response = await this.props.getElssStatment(params);\n if (response) {\n this.setState({\n open: true,\n });\n }\n }\n };\n\n render() {\n const { investorData } = this.props;\n const {\n summaryData,\n DetailedData,\n selfPassword,\n ConfirmSelfPassword,\n email,\n } = this.state;\n return (\n \n
\n \n
\n \n
\n )}\n Consolidated Account Statement
\n Statement Type
\n \n
\n {summaryData === SUMMARY ? (\n \n \n this.onDateChange(\"AsDate\", e)}\n // openTo={true}\n disabled={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n // minDate={new Date(new Date().setFullYear(1980, 0, 1))}\n maxDate={new Date()}\n margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.AsDate}\n />\n \n
\n ) : (\n As on Date
\n \n
\n Detailed Options
\n \n
\n \n \n this.onDateChange(\"startDate\", e)}\n // openTo={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n disabled={\n DetailedData === SPECIFICPERIOD ? false : true\n }\n\n minDate={\n DetailedData === CURRENTFINANCIALYEAR\n ? new Date(\n new Date().setFullYear(\n new Date().getFullYear(),\n 3,\n 1\n )\n )\n : DetailedData === SPECIFICPERIOD\n ? new Date(new Date().setFullYear(1970, 0, 1))\n : \"\"\n }\n style={{\n marginTop:0,\n marginBottom:10\n }}\n maxDate={new Date()}\n margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.startDate.value}\n />\n \n
\n Start Date
\n \n \n this.onDateChange(\"endDate\", e)}\n disableFuture={true}\n disabled={\n DetailedData === SPECIFICPERIOD&&!!this.state.startDate.value ? false : true\n }\n format=\"dd/MM/yyyy\"\n maxDate={\n DetailedData === CURRENTFINANCIALYEAR ||\n DetailedData === SPECIFICPERIOD\n ? new Date()\n : DetailedData === PREVIOUSFINANCIALYEAR\n ? \"\"\n : \"\"\n }\n id=\"mui-pickers-date\"\n value={this.state.endDate.value}\n errorMessage={this.state.endDate.errorMessage}\n />\n \n {!!this.state.endDate.errorMessage ? (\n \n {this.state.endDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n End Date\n
\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n onChange={this.handleChangeSelfPassword}\n value={selfPassword.value}\n onBlur={this.showError(\"selfPassword\")}\n isShowError={selfPassword.isError}\n errorMessage={selfPassword.errorMessage}\n\n />\n
\n \n Password should be at least 8 characters in length and should contain at least 1 uppercase letter (A-Z), 1 special character and 1 numeric value (0-9)\n
\n \n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n type={!!this.state.confirmShowPassword ? \"text\" : \"password\"}\n height={15}\n onChange={this.handleChangeConfirmSelfPassword}\n value={ConfirmSelfPassword.value}\n onBlur={this.showError(\"ConfirmSelfPassword\")}\n isShowError={ConfirmSelfPassword.isError}\n errorMessage={ConfirmSelfPassword.errorMessage}\n\n />\n
\n \n \n
\n \n \n \n
\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { investorData, userId,communicationDetails } = authReducer;\n // const userid = authReducer.userId;\n return { investorData, userId ,communicationDetails};\n },\n { getElssStatment }\n)(ELSS);\n","import React, { Component } from \"react\";\nimport { List } from \"../transactions/nfoAndNewPurchase\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { Input } from \"../../forms/input\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport { BUILD_URL } from \"../home\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker\n} from \"@material-ui/pickers\";\nimport { getcaptialgainStatment } from \"shared/store/actions/mailback\";\nimport {\n SUMMARY,\n DETAILED,\n CURRENTFINANCIALYEAR,\n PREVIOUSFINANCIALYEAR,\n SPECIFICPERIOD\n} from \"shared/store/types/mailBack\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport { formatDate } from \"../../forms/captalize\";\nimport { MAILBACK_URL } from \".\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\n\nclass CAN extends Component {\n constructor(props) {\n super(props);\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n this.state = {\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value:d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n error: \"\",\n isError: \"\",\n errorMessage: \"\"\n },\n endDate: { value: new Date(), error: \"\", isError: \"\", errorMessage: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: \"\" },\n open: false,\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n componentDidMount() {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n this.setState({\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value: d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n error: \"\"\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: \"\" },\n open: false,\n showPassword: false,\n confirmShowPassword: false,\n });\n }\n onDateChange = (label, event) => {\n if (label === \"endDate\" && !!this.state.startDate.value && !!event ) {\n const reformtStDt = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = event.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n if ( d2>d3|| d2 === d3) {\n this.setState({\n [label]: {\n value: null,\n error: true,\n errorMessage: \"Start Date should be earlier than End Date\",\n },\n });\n } else {\n this.setState({\n [label]: { value: event, errorMessage: \"\", error: false },\n });\n }\n } else if (label === \"startDate\") {\n this.setState({\n [label]: { value: event },\n endDate: { value: null, error: \"\", errorMessage: \"\" },\n });\n }\n // this.setState({ [label]: event });\n };\n changesummaryData = event => () => {\n this.setState({\n summaryData: event,\n email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" }\n });\n };\n\n ChangeDetailedData = event => () => {\n if (event === PREVIOUSFINANCIALYEAR) {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear() - 1, 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n\n const reformtEndDt = new Date(\n new Date().setFullYear(new Date().getFullYear(), 2, 31)\n ).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d4 = new Date(reformtEndDt).setHours(12, 0, 0, 0);\n const d5 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n this.setState({\n DetailedData: event,\n startDate: {\n value: d2 > d3 ? new Date(\n new Date().setFullYear(new Date().getFullYear() - 1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear() - 2, 3, 1)\n ),\n },\n endDate: {\n value:d4>d5?new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 2, 31)\n ) :new Date(\n new Date().setFullYear(new Date().getFullYear(), 2, 31)\n ),\n },\n email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" }\n });\n } else if (event === SPECIFICPERIOD) {\n this.setState({\n DetailedData: event,\n startDate: { value: null },\n endDate: { value: null },\n email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" }\n });\n } else if (event === CURRENTFINANCIALYEAR) {\n const reformtStDt = new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)).toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeStDt = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeStDt).setHours(12, 0, 0, 0);\n this.setState({\n DetailedData: event,\n startDate: {\n value: d2 > d3? new Date(\n new Date().setFullYear(new Date().getFullYear()-1, 3, 1)\n ):new Date(\n new Date().setFullYear(new Date().getFullYear(), 3, 1)\n ),\n },\n endDate: { value: new Date() },\n email: { value: \"\" },\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" }\n });\n }\n };\n\n handleChangeSelfPassword = event => {\n this.setState({\n selfPassword: { value: event.target.value }\n });\n };\n handleChangeConfirmSelfPassword = event => {\n this.setState({\n ConfirmSelfPassword: { value: event.target.value }\n });\n };\n handleChangeEmail = event => {\n this.setState({\n email: { value: event.target.value }\n });\n };\n showError = label => event => {\n const {\n [label]: { value }\n } = this.state;\n\n if (label === \"selfPassword\") {\n if (this.state.selfPassword.value === \"\" || !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)) {\n if(!/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)){\n this.setState({\n selfPassword: {\n\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n }\n }else if(this.state.selfPassword.value === \"\") {\n this.setState({\n selfPassword: {\n value:\"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n return;\n }\n }\n // else if (label === \"email\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // /^\\w+([\\.-]?\\w+)@\\w+([\\.-]?\\w+)(\\.\\w{2,3})+$/.test(\n // this.state.email.value\n // ) === false\n // ? true\n // : !value,\n // errorMessage:\n // /^\\w+([\\.-]?\\w+)@\\w+([\\.-]?\\w+)(\\.\\w{2,3})+$/.test(\n // this.state.email.value\n // ) === false\n // ? `(enter an vaild email address )`\n // : \"\"\n // }\n // });\n // }\n else if (label === \"ConfirmSelfPassword\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? true\n : !value,\n errorMessage:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? `The Password and Confirm Password do not match`\n : \"\"\n }\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value\n }\n });\n }\n };\n // onDateChange = (label, event) => {\n // this.setState({ [label]: { value: event } });\n // };\n closeYesModal = () => {\n this.setState({\n summaryData: SUMMARY,\n DetailedData: CURRENTFINANCIALYEAR,\n AsDate: new Date(),\n startDate: {\n value: new Date(new Date().setFullYear(new Date().getFullYear(), 3, 1)),\n error: \"\"\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: \"\" },\n open: false\n });\n this.props.history.replace(\n MAILBACK_URL + \"/investor/investor-selection/CAN\"\n );\n };\n closeNoModal = () => {\n this.setState({\n open: false\n });\n this.props.history.replace(BUILD_URL + \"/\");\n };\n submit = async () => {\n let asDateValue, startDateValue, endDateValue;\n if (this.state.AsDate.value) {\n asDateValue = this.state.AsDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\"\n });\n }\n if (this.state.startDate.value) {\n startDateValue = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\"\n });\n }\n if (this.state.endDate.value) {\n endDateValue = this.state.endDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\"\n });\n }\n const d2 = !!this.state.startDate.value\n ? new Date(this.state.startDate.value).setHours(12, 0, 0, 0)\n : \"\";\n const d3 = !!this.state.endDate.value\n ? new Date(this.state.endDate.value).setHours(12, 0, 0, 0)\n : \"\";\n\n const {\n AsDate,\n startDate,\n endDate,\n ConfirmSelfPassword,\n selfPassword,\n email,\n showPassword,\n confirmShowPassword,\n ...others\n } = this.state;\n\n if (\n !this.state.selfPassword.value ||\n !this.state.ConfirmSelfPassword.value ||\n !this.state.email.value ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n ) ||\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n )\n ) {\n this.setState({\n selfPassword: {\n value: \"\",\n isShowPasswordError: true\n }\n });\n }\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n )\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isShowPasswordError: true\n }\n });\n }\n if (!this.state.selfPassword.value) {\n this.setState({\n selfPassword: {\n ...others[\"selfPassword\"],\n isError: true,\n errorMessage: `Password is Mandatory`\n }\n });\n }\n if (!this.state.ConfirmSelfPassword.value) {\n this.setState({\n ConfirmSelfPassword: {\n ...others[\"ConfirmSelfPassword\"],\n isError: true,\n errorMessage: `Confirm Self Extraction Password is Mandatory`\n }\n });\n }\n if (!this.state.email.value) {\n if (!this.state.email.value) {\n this.setState({\n email: {\n ...others[\"email\"],\n isError: true,\n errorMessage: `CAN is Mandatory`\n }\n });\n }\n }\n if (\n !!this.state.ConfirmSelfPassword &&\n !!this.state.selfPassword &&\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Passwords do not match`\n }\n });\n }\n } else if (!this.state.startDate.value || !this.state.endDate.value) {\n if (!this.state.startDate.value) {\n this.setState({\n startDate: {\n value: null,\n isError: true,\n errorMessage: \"From Date is Mandatory\"\n }\n });\n }\n if (!this.state.endDate.value) {\n this.setState({\n endDate: {\n value: null,\n isError: true,\n errorMessage: \"To Date is Mandatory\"\n }\n });\n }\n } else if (!!d2 && !!d3 && (d2 > d3 || d2 === d3)) {\n this.setState({\n endDate: {\n value: null,\n isError: true,\n errorMessage: \"*From Date Should less than to Date\"\n }\n });\n } else {\n const params = {\n fromdt: formatDate(this.state.startDate.value),\n todate: formatDate(this.state.endDate.value),\n trtype: \"CAN\",\n PAN: \"\",\n Email: this.state.email.value,\n distCode: this.props.token,\n Password: this.state.selfPassword.value,\n distUid: this.props.userId,\n StmtFlag: this.state.summaryData === SUMMARY ? \"Summary\" : \"Detailed\"\n };\n const response = await this.props.getcaptialgainStatment(params);\n\n if (response) {\n this.setState({\n open: true\n });\n } else {\n this.setState({\n email: {\n value: \"\",\n errorMessage: \"NO Email ID for this CAN\",\n isError: true\n }\n });\n }\n }\n };\n\n render() {\n const { investorData } = this.props;\n const {\n summaryData,\n DetailedData,\n selfPassword,\n ConfirmSelfPassword,\n email\n } = this.state;\n return (\n \n
\n \n
\n \n
\n )}\n ELSS Account Statement
\n Statement Type
\n \n
\n {summaryData === SUMMARY ? (\n \n \n this.onDateChange(\"AsDate\", e)}\n // openTo={true}\n disabled={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n // minDate={new Date(new Date().setFullYear(1980, 0, 1))}\n maxDate={new Date()}\n margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.AsDate}\n />\n \n
\n ) : (\n As on Date
\n \n
\n Detailed Options
\n \n
\n \n \n this.onDateChange(\"startDate\", e)}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n disabled={\n DetailedData === SPECIFICPERIOD ? false : true\n }\n minDate={\n DetailedData === CURRENTFINANCIALYEAR\n ? new Date(\n new Date().setFullYear(\n new Date().getFullYear(),\n 3,\n 1\n )\n )\n : DetailedData === SPECIFICPERIOD\n ? new Date(new Date().setFullYear(1970, 0, 1))\n : \"\"\n }\n style={{\n marginTop:0,\n marginBottom:10\n }}\n maxDate={new Date()}\n margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.startDate.value}\n />\n \n
\n Start Date
\n \n \n this.onDateChange(\"endDate\", e)}\n // openTo={true}\n disableFuture={true}\n disabled={\n DetailedData === SPECIFICPERIOD ? false : true\n }\n format=\"dd/MM/yyyy\"\n maxDate={\n DetailedData === CURRENTFINANCIALYEAR ||\n DetailedData === SPECIFICPERIOD\n ? new Date()\n : DetailedData === PREVIOUSFINANCIALYEAR\n ? \"\"\n : \"\"\n }\n // margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.endDate.value}\n />\n \n {!!this.state.endDate.errorMessage ? (\n \n {this.state.endDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n End Date\n
\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n onChange={this.handleChangeSelfPassword}\n value={selfPassword.value}\n onBlur={this.showError(\"selfPassword\")}\n isShowError={selfPassword.isError}\n errorMessage={selfPassword.errorMessage}\n />\n
\n \n Password should be at least 8 characters in length and should contain at least 1 uppercase letter (A-Z), 1 special character and 1 numeric value (0-9)\n
\n \n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n type={!!this.state.confirmShowPassword ? \"text\" : \"password\"}\n height={15}\n onChange={this.handleChangeConfirmSelfPassword}\n value={ConfirmSelfPassword.value}\n onBlur={this.showError(\"ConfirmSelfPassword\")}\n isShowError={ConfirmSelfPassword.isError}\n errorMessage={ConfirmSelfPassword.errorMessage}\n />\n
\n \n \n
\n \n \n \n
\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { investorData, userId } = authReducer;\n // const userid = authReducer.userId;\n return { investorData, userId };\n },\n { getcaptialgainStatment }\n)(CAN);\n","import React, { Component } from \"react\";\nimport { List } from \"../transactions/nfoAndNewPurchase\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { Input } from \"../../forms/input\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport { BUILD_URL } from \"../home\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker,\n} from \"@material-ui/pickers\";\nimport { getcaptialgainStatment } from \"shared/store/actions/mailback\";\nimport {\n SUMMARY,\n DETAILED,\n CURRENTFINANCIALYEAR,\n PREVIOUSFINANCIALYEAR,\n SPECIFICPERIOD,\n} from \"shared/store/types/mailBack\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport { NEW_TRANSACTION_URL } from \"../transactions\";\nimport { MAILBACK_URL } from \".\";\nimport { formatDate } from \"../../forms/captalize\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\n\nclass CGS extends Component {\n constructor(props) {\n super(props);\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n this.state = {\n startDate: {\n value: null,\n error: \"\",\n },\n endDate: { value: null, error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value:GetEmail.email },\n open: false,\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n\n handleChangeSelfPassword = (event) => {\n this.setState({\n selfPassword: { value: event.target.value },\n });\n };\n handleChangeConfirmSelfPassword = (event) => {\n this.setState({\n ConfirmSelfPassword: { value: event.target.value },\n });\n };\n handleChangeEmail = (event) => {\n this.setState({\n email: { value: event.target.value },\n });\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"selfPassword\") {\n if (this.state.selfPassword.value === \"\" || !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)) {\n if(!/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)){\n this.setState({\n selfPassword: {\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n }\n }else if(this.state.selfPassword.value === \"\") {\n this.setState({\n selfPassword: {\n value:\"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n return;\n }\n }\n // else if (label === \"email\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? true\n // : !value,\n // errorMessage:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? `Enter a valid email address`\n // : \"\",\n // },\n // });\n // }\n else if (label === \"ConfirmSelfPassword\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? true\n : !value,\n errorMessage:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? `The Password and Confirm Password do not match`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n closeYesModal = () => {\n this.setState({\n startDate: {\n value: new Date(),\n error: \"\",\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n // email: { value: \"\" },\n open: false,\n });\n this.props.history.replace(\n MAILBACK_URL + \"/investor/investor-selection/CGS\"\n );\n };\n closeNoModal = () => {\n this.setState({\n open: false,\n });\n this.props.history.replace(BUILD_URL + \"/\");\n };\n\n onDateChange = (label, event) => {\n if (label === \"endDate\" && !!this.state.startDate.value && !!event ) {\n const reformtStDt = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n const changeEndDt = event.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n\n\n const d2 = new Date(reformtStDt).setHours(12, 0, 0, 0);\n const d3 = new Date(changeEndDt).setHours(12, 0, 0, 0);\n if ( d2>d3|| d2 === d3) {\n this.setState({\n [label]: {\n value: null,\n error: true,\n errorMessage: \"Start Date should be earlier than End Date\",\n },\n });\n } else {\n this.setState({\n [label]: { value: event, errorMessage: \"\", error: false },\n });\n }\n } else if (label === \"startDate\") {\n this.setState({\n [label]: { value: event },\n endDate: { value: null, error: \"\", errorMessage: \"\" },\n });\n }\n // this.setState({ [label]: { value: event } });\n };\n\n submit = async () => {\n let startDateValue, endDateValue;\n\n if (this.state.startDate.value) {\n startDateValue = this.state.startDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n }\n if (this.state.endDate.value) {\n endDateValue = this.state.endDate.value.toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"2-digit\",\n });\n }\n\n const d2 = new Date(this.state.startDate.value).setHours(12, 0, 0, 0);\n const d3 = new Date(this.state.endDate.value).setHours(12, 0, 0, 0);\n\n const {\n AsDate,\n startDate,\n endDate,\n ConfirmSelfPassword,\n selfPassword,\n showPassword,\n confirmShowPassword,\n email,\n ...others\n } = this.state;\n\n if (\n !this.state.selfPassword.value ||\n !this.state.ConfirmSelfPassword.value ||\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n ) ||\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n )\n ) {\n this.setState({\n selfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n )\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (!this.state.selfPassword.value) {\n this.setState({\n selfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n }\n if (!this.state.ConfirmSelfPassword.value) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `ConfirmSelfPassword is Mandatory`,\n },\n });\n }\n // if (\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // )\n // ) {\n // if (!this.state.email.value) {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Email is Mandatory`,\n // },\n // });\n // } else {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Enter a valid email address`,\n // },\n // });\n // }\n // }\n if (\n !!this.state.ConfirmSelfPassword &&\n !!this.state.selfPassword &&\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password does not match`,\n },\n });\n }\n } else if (!this.state.startDate.value) {\n this.setState({\n startDate: {\n value: null,\n error: true,\n errorMessage: \"*From Date is Mandatory\",\n },\n });\n return;\n } else if (!this.state.endDate.value) {\n this.setState({\n startDate: {\n value: null,\n error: true,\n errorMessage: \"*To Date is Mandatory\",\n },\n });\n return;\n } else if (d2 > d3 || d2 === d3) {\n this.setState({\n startDate: {\n value: null,\n error: true,\n errorMessage: \"(*From Date Should less than to Date)\",\n },\n });\n } else {\n const {investorData} = this.props;\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n const params = {\n fromdt: formatDate(this.state.startDate.value),\n todate: formatDate(this.state.endDate.value),\n trtype: \"WBCAP\",\n PAN: !!investorData && !!investorData.PAN ?investorData.PAN:\"\",\n Email: GetEmail.email,\n distCode: this.props.token,\n Password: this.state.selfPassword.value,\n distUid: this.props.userId,\n };\n const response = await this.props.getcaptialgainStatment(params);\n\n if (response) {\n this.setState({\n open: true,\n });\n }\n }\n };\n\n render() {\n const { investorData } = this.props;\n const { selfPassword, ConfirmSelfPassword, email } = this.state;\n return (\n \n
\n \n
\n \n
\n )}\n CAN Based Account Statement
\n Statement Type
\n \n
\n {summaryData === SUMMARY ? (\n \n \n this.onDateChange(\"AsDate\", e)}\n // openTo={true}\n disabled={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n // minDate={new Date(new Date().setFullYear(1980, 0, 1))}\n maxDate={new Date()}\n margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.AsDate}\n />\n \n
\n ) : (\n As on Date
\n \n
\n Detailed Options
\n \n
\n \n \n this.onDateChange(\"startDate\", e)}\n // openTo={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n disabled={\n DetailedData === SPECIFICPERIOD ? false : true\n }\n style={{marginTop:0,marginBottom:10}}\n minDate={\n DetailedData === CURRENTFINANCIALYEAR\n ? new Date(\n new Date().setFullYear(\n new Date().getFullYear(),\n 3,\n 1\n )\n )\n : DetailedData === SPECIFICPERIOD\n ? new Date(new Date().setFullYear(1970, 0, 1))\n : \"\"\n }\n maxDate={new Date()}\n margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.startDate.value}\n />\n \n\n\n
\n Start Date
\n \n \n this.onDateChange(\"endDate\", e)}\n // openTo={true}\n disableFuture={true}\n disabled={\n DetailedData === SPECIFICPERIOD ? false : true\n }\n format=\"dd/MM/yyyy\"\n maxDate={\n DetailedData === CURRENTFINANCIALYEAR ||\n DetailedData === SPECIFICPERIOD\n ? new Date()\n : DetailedData === PREVIOUSFINANCIALYEAR\n ? \"\"\n : \"\"\n }\n // margin=\"normal\"\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.endDate.value}\n />\n \n {\n !!this.state.endDate.errorMessage ? (\n \n {this.state.endDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n End Date\n
\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n onChange={this.handleChangeSelfPassword}\n value={selfPassword.value}\n onBlur={this.showError(\"selfPassword\")}\n isShowError={selfPassword.isError}\n errorMessage={selfPassword.errorMessage}\n />\n {!selfPassword.isError &&
\n \n Password should be at least 8 characters in length and should contain at least 1 uppercase letter (A-Z), 1 special character and 1 numeric value (0-9)\n
}\n \n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n type={!!this.state.confirmShowPassword ? \"text\" : \"password\"}\n height={15}\n onChange={this.handleChangeConfirmSelfPassword}\n value={ConfirmSelfPassword.value}\n onBlur={this.showError(\"ConfirmSelfPassword\")}\n isShowError={ConfirmSelfPassword.isError}\n errorMessage={ConfirmSelfPassword.errorMessage}\n\n />\n
\n \n \n
\n \n \n \n
\n \n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { investorData, userId, token ,communicationDetails} = authReducer;\n return { investorData, userId, token,communicationDetails };\n },\n { getcaptialgainStatment }\n)(CGS);\n","import React, { Component } from \"react\";\nimport { List } from \"../transactions/nfoAndNewPurchase\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { Input } from \"../../forms/input\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport { BUILD_URL } from \"../home\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker,\n} from \"@material-ui/pickers\";\nimport { getcaptialgainStatment } from \"shared/store/actions/mailback\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport { MAILBACK_URL } from \".\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\n\nclass GAS extends Component {\n constructor(props) {\n super(props);\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n this.state = {\n startDate: {\n value: new Date(),\n error: \"\",\n },\n pan: {\n value: \"\",\n isError: false,\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: GetEmail.email },\n open: false,\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n\n handleChangeSelfPassword = (event) => {\n this.setState({\n selfPassword: { value: event.target.value },\n });\n };\n handleChangeConfirmSelfPassword = (event) => {\n this.setState({\n ConfirmSelfPassword: { value: event.target.value },\n });\n };\n handleChangeEmail = (event) => {\n this.setState({\n email: { value: event.target.value },\n });\n };\n\n handleChangePan = (event) => {\n if (event.target.value.length <= 10) {\n this.setState({\n pan: {\n value: event.target.value.toUpperCase(),\n },\n });\n }\n };\n\n panvadilation = (event) => {\n if (/[A-Za-z]{5}\\d{4}[A-Za-z]{1}/.test(event.target.value) === false) {\n this.setState({\n pan: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a vaild pan\",\n },\n });\n }\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"selfPassword\") {\n if (this.state.selfPassword.value === \"\" || !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)) {\n if(!/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)){\n this.setState({\n selfPassword: {\n\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n }\n }else if(this.state.selfPassword.value === \"\") {\n this.setState({\n selfPassword: {\n value:\"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n return;\n }\n }\n // else if (label === \"email\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? true\n // : !value,\n // errorMessage:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? `Enter a valid email address`\n // : \"\",\n // },\n // });\n // }\n else if (label === \"ConfirmSelfPassword\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? true\n : !value,\n errorMessage:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? `The Password and Confirm Password do not match`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n\n closeYesModal = () => {\n this.setState({\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: \"\" },\n open: false,\n });\n this.props.history.replace(\n MAILBACK_URL + \"/investor/investor-selection/GAS\"\n );\n };\n closeNoModal = () => {\n this.setState({\n open: false,\n });\n this.props.history.replace(BUILD_URL + \"/\");\n };\n\n onDateChange = (label, event) => {\n this.setState({ [label]: { value: event } });\n };\n\n submit = async () => {\n const { ConfirmSelfPassword, selfPassword, email, showPassword,\n confirmShowPassword, ...others } = this.state;\n\n if (\n !this.state.selfPassword.value ||\n !this.state.ConfirmSelfPassword.value ||\n // !this.state.email.value ||\n !this.state.pan.value ||\n !/[A-Za-z]{5}\\d{4}[A-Za-z]{1}/.test(this.state.pan.value) ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n ) ||\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n if (!/[A-Za-z]{5}\\d{4}[A-Za-z]{1}/.test(this.state.pan.value)) {\n this.setState({\n pan: {\n value: \"\",\n isError: true,\n errorMessage: \"enter a vaild pan\",\n },\n });\n }\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n )\n ) {\n this.setState({\n selfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n )\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (!this.state.selfPassword.value) {\n this.setState({\n selfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n }\n if (!this.state.ConfirmSelfPassword.value) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `ConfirmSelfPassword is Mandatory`,\n },\n });\n }\n // if (\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // )\n // ) {\n // if (!this.state.email.value) {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Email is Mandatory`,\n // },\n // });\n // } else {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Enter a valid email address`,\n // },\n // });\n // }\n // }\n if (\n !!this.state.ConfirmSelfPassword &&\n !!this.state.selfPassword &&\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password does not match`,\n },\n });\n }\n } else {\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n const params = {\n fromdt: \"\",\n todate: \"\",\n trtype: \"GF\",\n PAN: this.state.pan.value,\n Email: GetEmail.email,\n distCode: this.props.token,\n Password: this.state.selfPassword.value,\n distUid: this.props.userId,\n };\n const response = await this.props.getcaptialgainStatment(params);\n\n if (response) {\n this.setState({\n open: true,\n });\n } else {\n this.setState({\n open: true,\n error: \"NO records found\",\n });\n }\n }\n };\n\n render() {\n const { investorData } = this.props;\n const { selfPassword, ConfirmSelfPassword, email, pan } = this.state;\n return (\n \n
\n \n
\n \n
\n Capital Gains Account Statement
\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n onChange={this.handleChangeSelfPassword}\n value={selfPassword.value}\n onBlur={this.showError(\"selfPassword\")}\n isShowError={selfPassword.isError}\n errorMessage={selfPassword.errorMessage}\n\n />\n
\n \n Password should be at least 8 characters in length and should contain at least 1 uppercase letter (A-Z), 1 special character and 1 numeric value (0-9)\n
\n \n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n type={!!this.state.confirmShowPassword ? \"text\" : \"password\"}\n height={15}\n onChange={this.handleChangeConfirmSelfPassword}\n value={ConfirmSelfPassword.value}\n onBlur={this.showError(\"ConfirmSelfPassword\")}\n isShowError={ConfirmSelfPassword.isError}\n errorMessage={ConfirmSelfPassword.errorMessage}\n\n />\n
\n \n \n this.onDateChange(\"startDate\", e)}\n // openTo={true}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n maxDate={new Date()}\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.startDate.value}\n />\n {!!this.state.startDate.errorMessage ? (\n \n {this.state.startDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n Start Date
\n \n \n this.onDateChange(\"endDate\", e)}\n // openTo={true}\n disabled={!this.state.startDate.value ? true : false}\n disableFuture={true}\n format=\"dd/MM/yyyy\"\n errorMessage={this.state.endDate.errorMessage}\n maxDate={new Date()}\n // animateYearScrolling={true}\n id=\"mui-pickers-date\"\n value={this.state.endDate.value}\n />\n {!!this.state.endDate.errorMessage ? (\n \n {this.state.endDate.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n End Date
\n \n \n
\n \n \n \n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { investorData, userId, token,communicationDetails } = authReducer;\n return { investorData, userId, token,communicationDetails };\n },\n { getcaptialgainStatment }\n)(GAS);\n","import React, { Component } from \"react\";\nimport { List } from \"../transactions/nfoAndNewPurchase\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { connect } from \"react-redux\";\nimport { Input } from \"../../forms/input\";\nimport { BUILD_URL } from \"../home\";\nimport { getNetworthPortfolio } from \"shared/store/actions/mailback\";\nimport CustomizedDialogs from \"../../home/customModal\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport { MAILBACK_URL } from \".\";\nimport { formatDate } from \"../../forms/captalize\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\n\nclass Networth extends Component {\n constructor(props) {\n super(props);\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n this.state = {\n startDate: {\n value: new Date(),\n error: \"\",\n },\n pan: {\n value: \"\",\n isError: false,\n },\n endDate: { value: new Date(), error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: GetEmail.email },\n open: false,\n Mode: \"Email\",\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n\n handleChangeSelfPassword = (event) => {\n this.setState({\n selfPassword: { value: event.target.value },\n });\n };\n handleChangeConfirmSelfPassword = (event) => {\n this.setState({\n ConfirmSelfPassword: { value: event.target.value },\n });\n };\n handleChangeEmail = (event) => {\n this.setState({\n email: { value: event.target.value },\n });\n };\n\n handleChangePan = (event) => {\n if (event.target.value.length <= 10) {\n this.setState({\n pan: {\n value: event.target.value.toUpperCase(),\n },\n });\n }\n };\n\n panvadilation = (event) => {\n if (/[A-Za-z]{5}\\d{4}[A-Za-z]{1}/.test(event.target.value) === false) {\n this.setState({\n pan: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid PAN\",\n },\n });\n }\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n\n if (label === \"selfPassword\") {\n if (this.state.selfPassword.value === \"\" || !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)) {\n if(!/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(this.state.selfPassword.value)){\n this.setState({\n selfPassword: {\n\n isError: true,\n errorMessage: `Password should be atleast 8 characters in length and should contain at least 1 Upper Case alphabet(A-Z).1 Special Character and 1 Numeric Value (0-9)`,\n },\n });\n return;\n }\n }else if(this.state.selfPassword.value === \"\") {\n this.setState({\n selfPassword: {\n value:\"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n return;\n }\n }\n // else if (label === \"email\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? true\n // : !value,\n // errorMessage:\n // /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) === false\n // ? `Enter a valid email address`\n // : \"\",\n // },\n // });\n // }\n else if (label === \"ConfirmSelfPassword\") {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? true\n : !value,\n errorMessage:\n this.state.selfPassword.value !==\n this.state.ConfirmSelfPassword.value ||\n this.state.ConfirmSelfPassword.value === \"\"\n ? `The Password and Confirm Password do not match`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n\n changeDateOn = (event) => () => {\n this.setState({\n Mode: event,\n selfPassword: { value: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n // email: { value: \"\" },\n pan:{value:\"\"}\n });\n };\n\n closeYesModal = () => {\n this.setState({\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n // email: { value: \"\" },\n open: false,\n });\n this.props.history.replace(\n MAILBACK_URL + \"/investor/investor-selection/Networth\"\n );\n };\n closeNoModal = () => {\n this.setState({\n open: false,\n });\n this.props.history.replace(BUILD_URL + \"/\");\n };\n\n onDateChange = (label, event) => {\n this.setState({ [label]: { value: event } });\n };\n\n submit = async () => {\n const { ConfirmSelfPassword, selfPassword, email, showPassword,\n confirmShowPassword, ...others } = this.state;\n if (this.state.Mode === \"Email\") {\n if (\n !this.state.selfPassword.value ||\n !this.state.ConfirmSelfPassword.value ||\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n ) ||\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n ) ||\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.selfPassword.value\n )\n ) {\n this.setState({\n selfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (\n !/^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/.test(\n this.state.ConfirmSelfPassword.value\n )\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isShowPasswordError: true,\n },\n });\n }\n if (!this.state.selfPassword.value) {\n this.setState({\n selfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password is Mandatory`,\n },\n });\n }\n if (!this.state.ConfirmSelfPassword.value) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Confirm Self Extraction Password is Mandatory`,\n },\n });\n }\n // if (\n // !this.state.email.value ||\n // !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n // this.state.email.value\n // )\n // ) {\n // if (!this.state.email.value) {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Email is Mandatory`,\n // },\n // });\n // } else {\n // this.setState({\n // email: {\n // value: \"\",\n // isError: true,\n // errorMessage: `Enter a valid email address`,\n // },\n // });\n // }\n // }\n if (\n !!this.state.ConfirmSelfPassword &&\n !!this.state.selfPassword &&\n this.state.selfPassword.value !== this.state.ConfirmSelfPassword.value\n ) {\n this.setState({\n ConfirmSelfPassword: {\n value: \"\",\n isError: true,\n errorMessage: `Password does not match`,\n },\n });\n }\n } else {\n let startDateValue;\n startDateValue = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n\n const GetEmail = this.props.communicationDetails.find((ele)=>ele.PAN === this.props.investorData.PAN && !!ele.email)\n\n const params = {\n fromdate: \"01/01/1970\",\n todate: formatDate(new Date()),\n mylp: \"\",\n emailid: GetEmail.email,\n distCode: this.props.token,\n pswd: this.state.selfPassword.value,\n funds: \"\",\n pagetype: \"Email\",\n distUid: this.props.userId,\n };\n\n const response = await this.props.getNetworthPortfolio(params);\n\n if (response) {\n this.setState({\n open: true,\n });\n }\n }\n } else if (this.state.Mode === \"PAN\") {\n if (\n !this.state.pan.value ||\n !/[A-Za-z]{5}\\d{4}[A-Za-z]{1}/.test(this.state.pan.value)\n ) {\n if (!/[A-Za-z]{5}\\d{4}[A-Za-z]{1}/.test(this.state.pan.value)) {\n this.setState({\n pan: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid pan\",\n },\n });\n }\n } else {\n let startDateValue;\n const params = {\n fromdate: \"01/01/1970\",\n todate: formatDate(new Date()),\n mylp: \"\",\n emailid: \"\",\n pan: this.state.pan.value,\n distCode: this.props.token,\n pswd: this.state.pan.value,\n funds: \"\",\n pagetype: \"PAN\",\n distUid: this.props.userId,\n };\n\n const response = await this.props.getNetworthPortfolio(params);\n\n if (response) {\n this.setState({\n open: true,\n error: \"Data inserted Successfully\",\n });\n }\n }\n }\n };\n\n render() {\n const { investorData } = this.props;\n const { selfPassword, ConfirmSelfPassword, email, pan, Mode } = this.state;\n return (\n \n
\n \n
\n \n \n
\n Grandfathering Account Statement
\n \n
\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n onChange={this.handleChangeSelfPassword}\n value={selfPassword.value}\n onBlur={this.showError(\"selfPassword\")}\n isShowError={selfPassword.isError}\n errorMessage={selfPassword.errorMessage}\n\n />\n
\n \n Password should be at least 8 characters in length and should contain at least 1 uppercase letter (A-Z), 1 special character and 1 numeric value (0-9)\n
\n \n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n type={!!this.state.confirmShowPassword ? \"text\" : \"password\"}\n height={15}\n onChange={this.handleChangeConfirmSelfPassword}\n value={ConfirmSelfPassword.value}\n onBlur={this.showError(\"ConfirmSelfPassword\")}\n isShowError={ConfirmSelfPassword.isError}\n errorMessage={ConfirmSelfPassword.errorMessage}\n\n />\n
\n \n \n
\n \n \n \n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { investorData, userId, token,communicationDetails } = authReducer;\n return { investorData, userId, token,communicationDetails };\n },\n { getNetworthPortfolio }\n)(Networth);\n","import React, { Component } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport MailBackInvestor from \"./investor\";\nimport InvestorSelection from \"./InvestorSelection\";\nimport SubmitRequest from \"./submitRequest\";\nimport MailBackSoa from \"./mailBackSoa\";\nimport Cas from \"./consolidatedAccountStatement\";\nimport ELSS from \"./ELSS\";\nimport CAN from \"./CAN\";\nimport CGS from \"./CGS\";\nimport GAS from \"./GAS\";\nimport Networth from \"./networth\";\n\nexport default class MailbackRouter extends Component {\n render() {\n return (\n \n
\n \n
\n \n \n
\n Networth Report
\n \n
\n {Mode === \"PAN\" ? (\n \n
\n ) : (\n \n
\n \n
\n )}\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n onChange={this.handleChangeSelfPassword}\n value={selfPassword.value}\n onBlur={this.showError(\"selfPassword\")}\n isShowError={selfPassword.isError}\n errorMessage={selfPassword.errorMessage}\n\n />\n
\n \n Password should be at least 8 characters in length and should contain at least 1 uppercase letter (A-Z), 1 special character and 1 numeric value (0-9)\n
\n \n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n type={!!this.state.confirmShowPassword ? \"text\" : \"password\"}\n height={15}\n onChange={this.handleChangeConfirmSelfPassword}\n value={ConfirmSelfPassword.value}\n onBlur={this.showError(\"ConfirmSelfPassword\")}\n isShowError={ConfirmSelfPassword.isError}\n errorMessage={ConfirmSelfPassword.errorMessage}\n\n />\n
\n \n \n
\n \n \n {!hide && (\n
\n \n ))}\n \n )}\n \n );\n};\nexport default connect(({ newinvestor }) => {\n const {\n applicantparams,\n schemeDetails,\n fatcaDetails,\n investmentparams,\n nomineDetails,\n } = newinvestor;\n return {\n applicantparams,\n schemeDetails,\n fatcaDetails,\n applicantparams,\n investmentparams,\n nomineDetails,\n };\n})(VerticalStepper);\n","import React from \"react\";\n\nconst CardComponent = (props) => {\n return (\n \n {steps.map((step, index) => (\n \n \n \n Step {index + 1}\n \n \n {step.value}\n \n
\n \n \n
\n \n \n {props.children}\n
\n \n );\n};\nconst SummaryCard = (props) => {\n return (\n <>\n \n {props.title.toUpperCase()}\n
\n \n
\n \n );\n};\n\nexport default CardComponent;\nexport { SummaryCard };\n","export const emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/;\nexport const ifscRegex = new RegExp(\"^[A-Za-z]{4}[a-zA-Z0-9]{7}$\");\nexport const mobileRegex = new RegExp(\"^[6-9]{1}[0-9]{9}$\");\nexport const nameRegex = new RegExp(\"^[a-zA-Z ]{4,50}$\");\nexport const accountRegex = new RegExp(\"^[a-zA-Z ]{0,10}$\");\nexport const panRegex = new RegExp(\"^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$\");\nexport const bankAccountRegex = new RegExp(\"^[0-9]{9,18}$\");\nexport const pincodeRegex = new RegExp(\"^[0-9]{6}$\");\nexport const countryCodeRegex = new RegExp(\"^[+][0-9]{1,3}$\");\nexport const alphabetsRegex = new RegExp(\"/^[A-Za-z]$/\");\nexport const forbiddenCharsRegex = new RegExp(/^[^\\[\\]\\{\\}<>\\/\\?\\\\\\|\"'=;:]*$/);\n\nexport const genderOptions = [\n { name: \"Male\", value: \"M\" },\n { name: \"Female\", value: \"F\" },\n { name: \"Transgender\", value: \"O\" },\n];\nexport const NomineesList = [\n {\n label: \"1\",\n value: \"1\",\n },\n {\n label: \"2\",\n value: \"2\",\n },\n {\n label: \"3\",\n value: \"3\",\n },\n];\n\nexport const categoryOptions = [\n { name: \"Resident Indian\", value: \"11\" },\n { name: \"NRI\", value: \"20\" },\n];\nexport const statusOptions = [\n { name: \"Individual\", value: \"I\" },\n { name: \"NRI\", value: \"N\" },\n];\nexport const Occupations = [\n { label: \"Service\", value: 1 },\n { label: \"Business\", value: 2 },\n { label: \"Student\", value: 3 },\n { label: \"House Wife\", value: 4 },\n { label: \"Professional\", value: 5 },\n { label: \"Retired\", value: 7 },\n { label: \"Others\", value: 8 },\n];\nexport const Gross_Annual_income = [\n { label: \"Below 1 Lac\", value: \"Below 1 Lac\" },\n { label: \"1-5 Lacs\", value: \"1-5 Lacs\" },\n { label: \"5-10 Lacs\", value: \"5-10 Lacs\" },\n { label: \"10-25 Lacs\", value: \"10-25 Lacs\" },\n { label: \"25 Lacs-1 Crore\", value: \"25 Lacs-1 Crore\" },\n { label: \"1 Crore and above\", value: \"1 Crore and above\" },\n];\nexport const countrycodeOptions = [\n { label: \"+91\", value: \"+91\" },\n { label: \"+61\", value: \"+61\" },\n { label: \"+1\", value: \"+1\" },\n { label: \"+852\", value: \"+852\" },\n { label: \"+968\", value: \"+968\" },\n { label:\"+974\", value: \"+974\" },\n { label:\"+966\", value: \"+966\"},\n { label: \"+65\", value: \"+65\" },\n { label: \"+971\", value: \"+971\" },\n {label: \"+44\", value: \"+44\"}\n];\n\nexport const modeOfHoldingOptions = [\n { name: \"Single\", value: \"single\" },\n { name: \"Anyone (or) survivor\", value: \"anyone\" },\n];\n\nexport const relationshipOptions = [\n {\n name: \"Brother\",\n value: \"Brother\",\n },\n {\n name: \"Daughter\",\n value: \"Daughter\",\n },\n {\n name: \"Father\",\n value: \"Father\",\n },\n {\n name: \"Mother\",\n value: \"Mother\",\n },\n {\n name: \"Sister\",\n value: \"Sister\",\n },\n {\n name: \"Son\",\n value: \"Son\",\n },\n {\n name: \"Wife\",\n value: \"Wife\",\n },\n];\nexport const familyDescriptionOptions = [\n {\n label: \"Self\",\n value: \"SE\",\n },\n {\n label: \"Spouse\",\n value: \"SP\",\n },\n {\n label: \"Dependent Children\",\n value: \"DC\",\n },\n {\n label: \"Dependent Siblings\",\n value: \"DS\",\n },\n {\n label: \"Dependent Parents\",\n value: \"DP\",\n },\n {\n label: \"Guardian\",\n value: \"GD\",\n },\n];\nexport const otpRegex = /^\\d{6}$/;\n","import Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport React from \"react\";\nexport const RadioButton = (props) => {\n return (\n <>\n {props.title}
\n {props.children}
\n \n
\n \n );\n};\n","import React, { useState, useEffect } from \"react\";\nimport CardComponent from \"./lib/CardComponent\";\nimport { format } from \"date-fns\";\nimport { connect } from \"react-redux\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport { Occupations, Gross_Annual_income } from \".\";\nimport {\n getCountriesList,\n getStatesList,\n storeFatcaDetails,\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n getCitiesList as getCitiesByState,\n getRelationShipList,\n storeAddress,\n} from \"shared/store/actions\";\n// import CustomLoader from \"../../../forms/Loader\";\nimport CustomLoader from \"../../../forms/customLoader\";\nimport CustomizedSelect from \"../customizedSelect\";\nimport { Input } from \"../../../forms/input\";\nimport { RadioButton } from \"./lib/Radiobutton\";\nimport { BUILD_URL } from \"../../home\";\n\nconst FatcaDetails = (props) => {\n const checkReduxStore = () => {\n if (props.fatcaDetails.i_Occpn) {\n const { fatcaDetails } = props;\n const {\n i_Occpn,\n i_income,\n FCountryofBirth,\n FNationality,\n i_invpin,\n FPEP,\n FPREP,\n FTaxResident,\n FForeignTaxType,\n FForeignTaxId,\n i_SOccpn,\n i_Sincome,\n SCountryofBirth,\n SNationality,\n i_invpin2,\n SForeignTaxType,\n STaxResident,\n SForeignTaxId,\n SPEP,\n SPREP,\n i_TOccpn,\n i_Tincome,\n TCountryofBirth,\n TNationality,\n i_invpin3,\n TForeignTaxType,\n TTaxResident,\n TForeignTaxId,\n TPEP,\n TPREP,\n } = fatcaDetails;\n setCategoryOccupation((prev) => {\n return {\n ...prev,\n categoryoccupationprimary: { value: i_Occpn },\n };\n });\n setGross_Annual_Income((prev) => {\n return {\n ...prev,\n gross_annual_incomeprimary: { value: i_income },\n };\n });\n setcountryselected((prev) => {\n return {\n ...prev,\n countryofbirth: { value: FCountryofBirth },\n nationality: { value: FNationality },\n };\n });\n setPincode((prev) => {\n return {\n ...prev,\n value: { value: i_invpin },\n };\n });\n setPolitically_Exposed_Applicant((prev) => {\n return {\n ...prev,\n primary: FPEP,\n };\n });\n setPolitically_Exposed_Relative((prev) => {\n return {\n ...prev,\n primary: FPREP,\n };\n });\n setTax_resident((prev) => {\n return {\n ...prev,\n primary: FTaxResident,\n };\n });\n if (FTaxResident === \"yes\") {\n setforeign_tax_id_no((prev) => {\n return {\n ...prev,\n primary: { value: FForeignTaxId },\n };\n });\n settax_resident_option((prev) => {\n return {\n ...prev,\n primary: { value: FForeignTaxType },\n };\n });\n }\n\n if (!!props.applicantparams && !!props.applicantparams.i_pangno2) {\n setCategoryOccupation((prev) => {\n return {\n ...prev,\n categoryoccupationjoint1: { value: i_SOccpn },\n };\n });\n setGross_Annual_Income((prev) => {\n return {\n ...prev,\n gross_annual_incomejoint1: { value: i_Sincome },\n };\n });\n setcountryselected((prev) => {\n return {\n ...prev,\n countryofbirthjoint1: { value: SCountryofBirth },\n nationalityjoint1: { value: SNationality },\n };\n });\n setPincode((prev) => {\n return {\n ...prev,\n value_joint1: { value: i_invpin2 },\n };\n });\n setPolitically_Exposed_Applicant((prev) => {\n return {\n ...prev,\n joint1: SPEP,\n };\n });\n setPolitically_Exposed_Relative((prev) => {\n return {\n ...prev,\n joint1: SPREP,\n };\n });\n setTax_resident((prev) => {\n return {\n ...prev,\n joint1: STaxResident,\n };\n });\n if (STaxResident === \"yes\") {\n setforeign_tax_id_no((prev) => {\n return {\n ...prev,\n joint1: { value: SForeignTaxId },\n };\n });\n settax_resident_option((prev) => {\n return {\n ...prev,\n joint1: { value: SForeignTaxType },\n };\n });\n }\n }\n if (!!props.applicantparams && !!props.applicantparams.i_pangno3) {\n setCategoryOccupation((prev) => {\n return {\n ...prev,\n categoryoccupationjoint2: { value: i_TOccpn },\n };\n });\n setGross_Annual_Income((prev) => {\n return {\n ...prev,\n gross_annual_incomejoint2: { value: i_Tincome },\n };\n });\n setcountryselected((prev) => {\n return {\n ...prev,\n countryofbirthjoint2: { value: TCountryofBirth },\n nationalityjoint2: { value: TNationality },\n };\n });\n setPincode((prev) => {\n return {\n ...prev,\n value_joint2: { value: i_invpin3 },\n };\n });\n setPolitically_Exposed_Applicant((prev) => {\n return {\n ...prev,\n joint2: TPEP,\n };\n });\n setPolitically_Exposed_Relative((prev) => {\n return {\n ...prev,\n joint2: TPREP,\n };\n });\n setTax_resident((prev) => {\n return {\n ...prev,\n joint2: TTaxResident,\n };\n });\n if (TTaxResident === \"yes\") {\n setforeign_tax_id_no((prev) => {\n return {\n ...prev,\n joint2: { value: TForeignTaxId },\n };\n });\n settax_resident_option((prev) => {\n return {\n ...prev,\n joint2: { value: TForeignTaxType },\n };\n });\n }\n }\n }\n };\n const [isLoading, setIsLoading] = useState(false);\n const [categoryoccupation, setCategoryOccupation] = useState({\n categoryoccupationprimary: { value: \"\" },\n categoryoccupationjoint1: { value: \"\" },\n categoryoccupationjoint2: { value: \"\" },\n });\n const [gross_annual_income, setGross_Annual_Income] = useState({\n gross_annual_incomeprimary: { value: \"\" },\n gross_annual_incomejoint1: { value: \"\" },\n gross_annual_incomejoint2: { value: \"\" },\n });\n const [countriesList, setcountriesList] = useState([]);\n const [foreigncountriesList, setforeigncountriesList] = useState([]);\n const [countryselected, setcountryselected] = useState({\n countryofbirth: { value: \"\" },\n nationality: { value: \"\" },\n countryofbirthjoint1: { value: \"\" },\n nationalityjoint1: { value: \"\" },\n countryofbirthjoint2: { value: \"\" },\n nationalityjoint2: { value: \"\" },\n });\n const [tax_resident, setTax_resident] = useState({\n primary: props.applicantparams.i_category === \"20\" ? \"yes\" : \"no\",\n joint1: props.applicantparams.i_category2 === \"20\" ? \"yes\" : \"no\",\n joint2: props.applicantparams.i_category3 === \"20\" ? \"yes\" : \"no\",\n });\n const [politically_exposed_applicant, setPolitically_Exposed_Applicant] =\n useState({ primary: \"no\", joint1: \"no\", joint2: \"no\" });\n const [politically_exposed_relative, setPolitically_Exposed_Relative] =\n useState({ primary: \"no\", joint1: \"no\", joint2: \"no\" });\n const [tax_resident_option, settax_resident_option] = useState({\n primary: { value: \"\" },\n joint1: { value: \"\" },\n joint2: { value: \"\" },\n });\n const [foreign_tax_id_no, setforeign_tax_id_no] = useState({\n primary: { value: \"\" },\n joint1: { value: \"\" },\n joint2: { value: \"\" },\n });\n const [pincode, setPincode] = useState({\n value: { value: \"\" },\n value_joint1: { value: \"\" },\n value_joint2: { value: \"\" },\n });\n const [openModal, setOpenModal] = useState(false);\n const [panverification, setPanverification] = useState(false);\n\n let nriCountry = props.location.state?.nriCountry;\n nriCountry = nriCountry ? nriCountry.charAt(0).toUpperCase() + nriCountry.slice(1).toLowerCase() : \"\";\n\n useEffect(() => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n firstRender();\n checkReduxStore();\n }, []);\n const firstRender = async () => {\n await getLists();\n await prefillFormValues();\n };\n const getLists = async () => {\n setIsLoading(true);\n const countriesResponse = await props.getCountriesList();\n const Countries = countriesResponse.Dtinformation;\n const countriesList = Countries.map((country) => {\n return { label: country.country_name, value: country.country_name };\n });\n const ForeignCountrires = Countries.map((country) => {\n return { label: country.country_name, value: country.country_name };\n });\n setcountriesList(\n countriesList.length > 0\n ? countriesList\n : [{ label: \"India\", value: \"India\" }]\n );\n const RemomovingIndia = { label: \"India\", value: \"India\" };\n ForeignCountrires.splice(\n ForeignCountrires.findIndex((a) => a.value === RemomovingIndia.value),\n 1\n );\n setforeigncountriesList(ForeignCountrires);\n setIsLoading(false);\n };\n const prefillFormValues = async () => {\n if (!props.fatcaDetails.i_invpin) {\n if (\n (!!props.store_pan && props.store_pan.length > 0) ||\n props.applicantparams.typeofinvestor === \"M\"\n ) {\n const kycResponse = await props.getKycDetails({ pan: props.store_pan });\n if (!!kycResponse) {\n const {\n country,\n pin,\n GrossAnnualIncome,\n app_occ,\n add1,\n add2,\n add3,\n state,\n city,\n } = kycResponse.DtData[0];\n setCategoryOccupation((prev) => {\n return {\n ...prev,\n categoryoccupationprimary: { value: app_occ },\n };\n });\n settax_resident_option((prev) => {\n return {\n ...prev,\n primary: { value: nriCountry },\n };\n });\n setPincode((prev) => {\n return {\n ...prev,\n value: { value: pin },\n };\n });\n if (GrossAnnualIncome) {\n setGross_Annual_Income((prev) => {\n return {\n ...prev,\n gross_annual_incomeprimary: { value: GrossAnnualIncome },\n };\n });\n }\n // setGross_Annual_Income((prev) => {\n // return {\n // ...prev,\n // gross_annual_incomeprimary: { value: GrossAnnualIncome },\n // };\n // });\n if (country && state && city && pin && (add1 || add2 || add3)) {\n const countryvalue = country.charAt(0).toUpperCase() + country.slice(1).toLowerCase();\n setcountryselected((prev) => {\n return {\n ...prev,\n nationality: { value: countryvalue },\n countryofbirth: { value: countryvalue },\n };\n });\n\n const address = [add1, add2, add3].filter(Boolean).join(\" \");\n const convertingcountry = country.toLowerCase();\n const restOfGreeting = convertingcountry.slice(1);\n const convertcountry = convertingcountry[0].toUpperCase();\n const newGreeting = convertcountry + restOfGreeting;\n\n const Address = {\n state: state,\n city: city,\n country: newGreeting,\n pincode: pin,\n address: address,\n };\n\n props.storeAddress(Address);\n\n setcountryselected({\n ...countryselected,\n nationality: { value: countryvalue },\n countryofbirth: { value: countryvalue },\n });\n } else {\n console.error(\"Required fields are missing.\");\n }\n }\n }\n }\n // setIsLoading(true)\n if (\n !!props.applicantparams.i_pangno2 &&\n props.applicantparams.i_pangno2.length > 0\n ) {\n const kycResponse = await props.getKycDetails({\n pan: props.applicantparams.i_pangno2,\n });\n // const { DtData } = !!kycResponse ?kycResponse :[]\n // const kycDetails = !!DtData[0] ?DtData[0] :{} ;\n if (!!kycResponse) {\n const { country, pin, GrossAnnualIncome, app_occ } =\n kycResponse.DtData[0];\n setCategoryOccupation((prev) => {\n return {\n ...prev,\n categoryoccupationjoint1: { value: app_occ },\n };\n });\n setPincode((prev) => {\n return {\n ...prev,\n value_joint1: { value: pin },\n };\n });\n setGross_Annual_Income((prev) => {\n return {\n ...prev,\n gross_annual_incomejoint1: { value: GrossAnnualIncome },\n };\n });\n const countryvalue =\n country.charAt(0).toUpperCase() + country.slice(1).toLowerCase();\n setcountryselected((prev) => {\n return {\n ...prev,\n nationalityjoint1: { value: countryvalue },\n countryofbirthjoint1: { value: countryvalue },\n };\n });\n }\n }\n if (\n !!props.applicantparams.i_pangno3 &&\n props.applicantparams.i_pangno3.length > 0\n ) {\n const kycResponse = await props.getKycDetails({\n pan: props.applicantparams.i_pangno3,\n });\n if (!!kycResponse) {\n const { country, pin, GrossAnnualIncome, app_occ } =\n kycResponse.DtData[0];\n setCategoryOccupation((prev) => {\n return {\n ...prev,\n categoryoccupationjoint2: { value: app_occ },\n };\n });\n setPincode((prev) => {\n return {\n ...prev,\n value_joint2: { value: pin },\n };\n });\n setGross_Annual_Income((prev) => {\n return {\n ...prev,\n gross_annual_incomejoint2: { value: GrossAnnualIncome },\n };\n });\n const countryvalue =\n country.charAt(0).toUpperCase() + country.slice(1).toLowerCase();\n setcountryselected((prev) => {\n return {\n ...prev,\n nationalityjoint2: { value: countryvalue },\n countryofbirthjoint2: { value: countryvalue },\n };\n });\n }\n }\n };\n const handleRadioButton = (label) => (event) => {\n if (label === \"TaxresidentPrimary\") {\n setTax_resident((prev) => {\n return {\n ...prev,\n primary: event.target.value,\n };\n });\n }\n if (label === \"PoliticallyExposedPersonPrimary\") {\n setPolitically_Exposed_Applicant((prev) => {\n return {\n ...prev,\n primary: event.target.value,\n };\n });\n }\n if (label === \"PoliticallyExposedRelativePrimary\") {\n setPolitically_Exposed_Relative((prev) => {\n return {\n ...prev,\n primary: event.target.value,\n };\n });\n }\n if (label === \"TaxresidentPrimaryjoint1\") {\n setTax_resident((prev) => {\n return {\n ...prev,\n joint1: event.target.value,\n };\n });\n }\n if (label === \"PoliticallyExposedPersonJoint1\") {\n setPolitically_Exposed_Applicant((prev) => {\n return {\n ...prev,\n joint1: event.target.value,\n };\n });\n }\n if (label === \"PoliticallyExposedRelativeJoint1\") {\n setPolitically_Exposed_Relative((prev) => {\n return {\n ...prev,\n joint1: event.target.value,\n };\n });\n }\n if (label === \"TaxresidentPrimaryjoint2\") {\n setTax_resident((prev) => {\n return {\n ...prev,\n joint2: event.target.value,\n };\n });\n }\n if (label === \"PoliticallyExposedPersonJoint2\") {\n setPolitically_Exposed_Applicant((prev) => {\n return {\n ...prev,\n joint2: event.target.value,\n };\n });\n }\n if (label === \"PoliticallyExposedRelativeJoint2\") {\n setPolitically_Exposed_Relative((prev) => {\n return {\n ...prev,\n joint2: event.target.value,\n };\n });\n }\n };\n const handlePincode = (label) => (event) => {\n const value = event.target.value;\n if (label === \"pincode1\" && value.length <= 6) {\n if (value.length < 6) {\n setPincode({\n value: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter valid Pincode\",\n },\n });\n }\n setPincode({ ...pincode, value: { value: value } });\n }\n };\n const submit = async () => {\n if (!categoryoccupation?.categoryoccupationprimary?.value) {\n setCategoryOccupation({\n ...categoryoccupation,\n categoryoccupationprimary: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Occupation\",\n },\n });\n return;\n }\n if (!gross_annual_income?.gross_annual_incomeprimary?.value) {\n setGross_Annual_Income({\n ...gross_annual_income,\n gross_annual_incomeprimary: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Gross Annual Income\",\n },\n });\n return;\n }\n if (!countryselected?.countryofbirth?.value) {\n setcountryselected({\n ...countryselected,\n ...countryselected,\n countryofbirth: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Country of Birth\",\n },\n });\n return;\n }\n if (!countryselected?.nationality?.value) {\n setcountryselected({\n ...countryselected,\n nationality: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Nationality\",\n },\n });\n return;\n }\n if (\n tax_resident.primary == \"yes\" &&\n tax_resident_option.primary.value == \"\"\n ) {\n settax_resident_option({\n ...tax_resident_option,\n primary: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Tax Resident\",\n },\n });\n return;\n }\n if (\n tax_resident.primary == \"yes\" &&\n foreign_tax_id_no.primary.value == \"\"\n ) {\n setforeign_tax_id_no({\n ...foreign_tax_id_no,\n primary: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter the Foreign Tax ID No\",\n },\n });\n return;\n }\n // if (pincode.value.value.length <= 5) {\n // setPincode({\n // ...pincode,\n // value: {\n // isError: true,\n // errorMessage: \"Please enter a valid 6-digit PIN code\",\n // },\n // });\n // return;\n // }\n if (!!props.applicantparams && !!props.applicantparams.i_pangno2) {\n if (categoryoccupation.categoryoccupationjoint1.value == \"\") {\n setCategoryOccupation({\n ...categoryoccupation,\n categoryoccupationjoint1: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Occupation\",\n },\n });\n return;\n }\n if (!gross_annual_income?.gross_annual_incomejoint1?.value) {\n setGross_Annual_Income({\n ...gross_annual_income,\n gross_annual_incomejoint1: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Gross Annual Income\",\n },\n });\n return;\n }\n if (!countryselected?.countryofbirthjoint1?.value) {\n setcountryselected({\n ...countryselected,\n countryofbirthjoint1: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Country of Birth\",\n },\n });\n return;\n }\n if (!countryselected?.nationalityjoint1?.value) {\n setcountryselected({\n ...countryselected,\n nationalityjoint1: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Nationality\",\n },\n });\n return;\n }\n if (\n tax_resident.joint1 == \"yes\" &&\n tax_resident_option.joint1.value == \"\"\n ) {\n settax_resident_option({\n ...tax_resident_option,\n joint1: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Tax Resident\",\n },\n });\n return;\n }\n if (\n tax_resident.joint1 == \"yes\" &&\n foreign_tax_id_no.joint1.value == \"\"\n ) {\n setforeign_tax_id_no({\n ...foreign_tax_id_no,\n joint1: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter the Foreign Tax ID No\",\n },\n });\n return;\n }\n // if (pincode.value_joint1.value.length <= 5) {\n // setPincode({\n // ...pincode,\n // value_joint1: {\n // isError: true,\n // errorMessage: \"Please enter a valid 6-digit PIN code\",\n // },\n // });\n // return;\n // }\n }\n if (!!props.applicantparams && !!props.applicantparams.i_pangno3) {\n if (categoryoccupation.categoryoccupationjoint2.value == \"\") {\n setCategoryOccupation({\n ...categoryoccupation,\n categoryoccupationjoint2: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Occupation\",\n },\n });\n return;\n }\n if (!gross_annual_income?.gross_annual_incomejoint2?.value) {\n setGross_Annual_Income({\n ...gross_annual_income,\n gross_annual_incomejoint2: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Gross Annual Income\",\n },\n });\n return;\n }\n if (!countryselected?.countryofbirthjoint2?.value) {\n setcountryselected({\n ...countryselected,\n countryofbirthjoint2: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Country of Birth\",\n },\n });\n return;\n }\n if (!countryselected?.nationalityjoint2?.value) {\n setcountryselected({\n ...countryselected,\n nationalityjoint2: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Nationality\",\n },\n });\n return;\n }\n if (\n tax_resident.joint2 == \"yes\" &&\n tax_resident_option.joint2.value == \"\"\n ) {\n settax_resident_option({\n ...tax_resident_option,\n joint2: {\n value: \"\",\n isError: true,\n errorMessage: \"Select the Tax Resident\",\n },\n });\n return;\n }\n if (\n tax_resident.joint2 == \"yes\" &&\n foreign_tax_id_no.joint2.value == \"\"\n ) {\n setforeign_tax_id_no({\n ...foreign_tax_id_no,\n joint2: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter the Foreign Tax ID No\",\n },\n });\n return;\n }\n // if ( tax_resident.joint2 == \"yes\" &&pincode.value_joint2.value.length <= 5) {\n // setPincode({\n // ...pincode,\n // value_joint2: {\n // isError: true,\n // errorMessage: \"Please enter a valid 6-digit PIN code\",\n // },\n // });\n // return;\n // }\n }\n if (panverification) {\n setOpenModal(!openModal);\n return;\n }\n setIsLoading(true);\n const fatcaDetails = {\n i_Occpn: categoryoccupation.categoryoccupationprimary.value,\n i_income: gross_annual_income.gross_annual_incomeprimary.value,\n FCountryofBirth: countryselected.countryofbirth.value,\n FNationality: countryselected.nationality.value,\n i_invpin: pincode.value.value,\n FPEP: politically_exposed_applicant.primary,\n FPREP: politically_exposed_relative.primary,\n FTaxResident: tax_resident.primary,\n FForeignTaxType:\n tax_resident.primary == \"yes\" ? tax_resident_option.primary.value : \"\",\n FForeignTaxId:\n tax_resident.primary == \"yes\" ? foreign_tax_id_no.primary.value : \"\",\n ...(props.applicantparams.i_genMOH === \"4\" &&\n props.applicantparams.i_pangno2 && {\n i_SOccpn: categoryoccupation.categoryoccupationjoint1.value,\n i_Sincome: gross_annual_income.gross_annual_incomejoint1.value,\n SCountryofBirth: countryselected.countryofbirthjoint1.value,\n SNationality: countryselected.nationalityjoint1.value,\n i_invpin2: pincode.value_joint1.value,\n SForeignTaxType:\n tax_resident.joint1 == \"yes\"\n ? tax_resident_option.joint1.value\n : \"\",\n STaxResident: tax_resident.joint1,\n SForeignTaxId:\n tax_resident.joint1 == \"yes\" ? foreign_tax_id_no.joint1.value : \"\",\n SPEP: politically_exposed_applicant.joint1,\n SPREP: politically_exposed_relative.joint1,\n }),\n ...(props.applicantparams.i_genMOH === \"4\" &&\n props.applicantparams.i_pangno3 && {\n i_TOccpn: categoryoccupation.categoryoccupationjoint2.value,\n i_Tincome: gross_annual_income.gross_annual_incomejoint2.value,\n TCountryofBirth: countryselected.countryofbirthjoint2.value,\n TNationality: countryselected.nationalityjoint2.value,\n i_invpin3: pincode.value_joint2.value,\n TForeignTaxType:\n tax_resident.joint2 == \"yes\"\n ? tax_resident_option.joint2.value\n : \"\",\n TTaxResident: tax_resident.joint2,\n TForeignTaxId:\n tax_resident.joint2 == \"yes\" ? foreign_tax_id_no.joint2.value : \"\",\n TPEP: politically_exposed_applicant.joint2,\n TPREP: politically_exposed_relative.joint2,\n }),\n };\n props.storeFatcaDetails(fatcaDetails);\n setIsLoading(false);\n props.history.replace(BUILD_URL + \"/new-investor-transaction/nominee-details\");\n };\n\n return (\n <>\n \n \n \n \n
\n \n {props.Heading}\n
\n \n
\n YES
\n \n
\n \n NO
\n \n \n \n
\n )}\n Primary Holder :
\n \n \n setCategoryOccupation({\n ...categoryoccupation,\n categoryoccupationprimary: { value: event.target.value },\n })\n }\n isError={categoryoccupation.categoryoccupationprimary.isError}\n errorMessage={\n categoryoccupation.categoryoccupationprimary.errorMessage\n }\n placeholder={\"Select One\"}\n >\n {Occupations.map((item, index) => (\n \n ))}\n \n
{\" \"}\n \n \n setGross_Annual_Income({\n ...gross_annual_income,\n gross_annual_incomeprimary: { value: event.target.value },\n })\n }\n isError={gross_annual_income.gross_annual_incomeprimary.isError}\n errorMessage={\n gross_annual_income.gross_annual_incomeprimary.errorMessage\n }\n placeholder={\"Select One\"}\n >\n {Gross_Annual_income.map((item, index) => (\n \n ))}\n \n
\n \n \n setcountryselected({\n ...countryselected,\n countryofbirth: { value: event.target.value },\n })\n }\n isError={countryselected.countryofbirth.isError}\n errorMessage={countryselected.countryofbirth.errorMessage}\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n \n setcountryselected({\n ...countryselected,\n nationality: { value: event.target.value },\n })\n }\n // isError={countryselected.nationality.isError}\n // errorMessage={countryselected.nationality.errorMessage}\n isError={countryselected.nationality.isError}\n errorMessage={countryselected.nationality.errorMessage}\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n
\n \n \n settax_resident_option({\n ...tax_resident_option,\n primary: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n placeholder={\"Select One\"}\n isError={tax_resident_option.primary.isError}\n errorMessage={tax_resident_option.primary.errorMessage}\n >\n {foreigncountriesList.map((item, index) => (\n \n ))}\n \n
\n \n {\n const regex = /^[a-zA-Z0-9]*$/;\n const isValid = regex.test(value) && value.length <= 20;\n setforeign_tax_id_no({\n ...foreign_tax_id_no,\n primary: {\n ...foreign_tax_id_no.primary,\n value: isValid ? value : foreign_tax_id_no.primary.value,\n isError: !isValid,\n errorMessage: isValid\n ? \"\"\n : \"Enter valid Foreign tax id number\",\n },\n });\n }}\n fatcawidth=\"true\"\n isShowError={foreign_tax_id_no.primary.isError}\n errorMessage={foreign_tax_id_no.primary.errorMessage}\n />\n
\n \n \n \n
\n )}\n Secondary Holder 1:
\n \n \n setCategoryOccupation({\n ...categoryoccupation,\n categoryoccupationjoint1: { value: event.target.value },\n })\n }\n isError={\n categoryoccupation.categoryoccupationjoint1.isError\n }\n errorMessage={\n categoryoccupation.categoryoccupationjoint1.errorMessage\n }\n >\n {Occupations.map((item, index) => (\n \n ))}\n \n
{\" \"}\n \n \n setGross_Annual_Income({\n ...gross_annual_income,\n gross_annual_incomejoint1: {\n value: event.target.value,\n },\n })\n }\n isError={\n gross_annual_income.gross_annual_incomejoint1.isError\n }\n errorMessage={\n gross_annual_income.gross_annual_incomejoint1.errorMessage\n }\n >\n {Gross_Annual_income.map((item, index) => (\n \n ))}\n \n
\n \n \n setcountryselected({\n ...countryselected,\n countryofbirthjoint1: { value: event.target.value },\n })\n }\n isError={countryselected.countryofbirthjoint1.isError}\n errorMessage={\n countryselected.countryofbirthjoint1.errorMessage\n }\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n ({\n label: item.label,\n value: item.value,\n }))}\n value={\n countryselected.nationalityjoint1.value\n ? countryselected.nationalityjoint1.value\n : \"\"\n }\n handleChange={(event) =>\n setcountryselected({\n ...countryselected,\n nationalityjoint1: { value: event.target.value },\n })\n }\n isError={countryselected.nationalityjoint1.isError}\n errorMessage={\n countryselected.nationalityjoint1.errorMessage\n }\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n \n setPincode({\n ...pincode,\n value_joint1: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n isShowError={pincode.value_joint1.isError}\n errorMessage={pincode.value_joint1.errorMessage}\n />\n
\n \n \n settax_resident_option({\n ...tax_resident_option,\n joint1: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n isError={tax_resident_option.joint1.isError}\n errorMessage={tax_resident_option.joint1.errorMessage}\n >\n {foreigncountriesList.map((item, index) => (\n \n ))}\n \n
\n \n
\n \n {\n const regex = /^[a-zA-Z0-9]*$/;\n const isValid = regex.test(value) && value.length <= 20;\n setforeign_tax_id_no({\n ...foreign_tax_id_no,\n joint1: {\n ...foreign_tax_id_no.joint2,\n value: isValid ? value : foreign_tax_id_no.joint1.value,\n isError: !isValid,\n errorMessage: isValid\n ? \"\"\n : \"Enter valid Foreign tax id number\",\n },\n });\n }}\n fatcawidth=\"true\"\n isShowError={foreign_tax_id_no.joint1.isError}\n errorMessage={foreign_tax_id_no.joint1.errorMessage}\n />\n
\n \n \n \n
\n )}\n Secondary Holder 2:
\n \n \n setCategoryOccupation({\n ...categoryoccupation,\n categoryoccupationjoint2: { value: event.target.value },\n })\n }\n isError={\n categoryoccupation.categoryoccupationjoint2.isError\n }\n errorMessage={\n categoryoccupation.categoryoccupationjoint2.errorMessage\n }\n >\n {Occupations.map((item, index) => (\n \n ))}\n \n
{\" \"}\n \n \n setGross_Annual_Income({\n ...gross_annual_income,\n gross_annual_incomejoint2: {\n value: event.target.value,\n },\n })\n }\n isError={\n gross_annual_income.gross_annual_incomejoint2.isError\n }\n errorMessage={\n gross_annual_income.gross_annual_incomejoint2.errorMessage\n }\n placeholder={\"Select One\"}\n >\n {Gross_Annual_income.map((item, index) => (\n \n ))}\n \n
\n \n \n setcountryselected({\n ...countryselected,\n countryofbirthjoint2: { value: event.target.value },\n })\n }\n isError={countryselected.countryofbirthjoint2.isError}\n errorMessage={\n countryselected.countryofbirthjoint2.errorMessage\n }\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n ({\n label: item.label,\n value: item.value,\n }))}\n value={\n countryselected.nationalityjoint2.value\n ? countryselected.nationalityjoint2.value\n : \"\"\n }\n handleChange={(event) =>\n setcountryselected({\n ...countryselected,\n nationalityjoint2: { value: event.target.value },\n })\n }\n isError={countryselected.nationalityjoint2.isError}\n errorMessage={\n countryselected.nationalityjoint2.errorMessage\n }\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n \n setPincode({\n ...pincode,\n value_joint2: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n isShowError={pincode.value_joint2.isError}\n errorMessage={pincode.value_joint2.errorMessage}\n />\n
\n \n \n settax_resident_option({\n ...tax_resident_option,\n joint2: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n isError={tax_resident_option.joint2.isError}\n errorMessage={tax_resident_option.joint2.errorMessage}\n >\n {foreigncountriesList.map((item, index) => (\n \n ))}\n \n
\n \n {\n const regex = /^[a-zA-Z0-9]*$/;\n const isValid = regex.test(value) && value.length <= 20;\n setforeign_tax_id_no({\n ...foreign_tax_id_no,\n joint2: {\n ...foreign_tax_id_no.joint2,\n value: isValid ? value : foreign_tax_id_no.joint2.value,\n isError: !isValid,\n errorMessage: isValid\n ? \"\"\n : \"Enter valid Foreign tax id number\",\n },\n });\n }}\n fatcawidth=\"true\"\n isShowError={foreign_tax_id_no.joint2.isError}\n errorMessage={foreign_tax_id_no.joint2.errorMessage}\n />\n
\n \n \n props.history.replace(BUILD_URL + \"/new-investor-transaction/investor-details\")\n }\n >\n BACK\n \n \n PROCEED\n \n
\n \n );\n};\nexport default connect(\n ({ newinvestor }) => {\n const { applicantparams, fatcaDetails, store_pan } = newinvestor;\n return {\n applicantparams,\n fatcaDetails,\n store_pan,\n };\n },\n {\n storeFatcaDetails,\n getCountriesList,\n getStatesList,\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n getCitiesByState,\n getRelationShipList,\n storeAddress,\n }\n)(FatcaDetails);\n","import { MenuItem, Checkbox } from \"@material-ui/core\";\nimport CustomizedDialogs from \"../../customModal\";\nimport { Input } from \"../../../forms/input\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport React, { useState, useEffect, useReducer } from \"react\";\nimport { connect, useDispatch } from \"react-redux\";\nimport { useHistory } from \"react-router\";\nimport { Termsandconditions } from \"./lib/Termsandconditions\";\nimport {\n getNewPurchaseFundList,\n validateSubBroker,\n submitLumpsumDetails,\n clearingFirstTimeInvestorJourney,\n storeSchemeDetails,\n} from \"shared/store/actions\";\nimport {\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n REGULAR,\n} from \"shared/store/types\";\nimport IntegrationReactSelect from \"../../../forms/autoCompleteInput\";\nimport { RadioButton } from \"./lib/Radiobutton\";\n// import CustomLoader from \"../../../forms/Loader\";\nimport CustomLoader from \"../../../forms/customLoader\";\nimport { format, set } from \"date-fns\";\n// import CustomizedSelect from \"../customizedSelect\";\n// import CustomizedDialogs from \"../../customModal\";\nimport CustomizedSelect from \"../customizedSelect\";\nimport CardComponent from \"./lib/CardComponent\";\nimport { BUILD_URL } from \"../../home\";\nconst Lumpsum = (props) => {\n const initialState = {\n Scheme: { value: \"\" },\n Category: { value: \"\" },\n Sub_ARN: { value: \"\" },\n Sub_Broker_Code: { value: \"\" },\n // \"Scheme Plan\": \"\",\n // \"Scheme Option\": \"\",\n Combo: false,\n comboDisclaimer: \"\",\n comboLabel: \"\",\n Amount: { value: \"\" },\n // \"Sub Broker Code\": { value: \"\" },\n planValue: \"\",\n optionValue: \"\",\n schemeValue: \"\",\n EUIN: \"\",\n EUINNO: { value: \"no\" },\n schemeList: [],\n euinList: [],\n CategoryList: [],\n multiples: \"\",\n };\n const [formValues, setFormValues] = useReducer(\n (preValues, newValues) => ({ ...preValues, ...newValues }),\n initialState\n );\n const InputFields = [\n [\n {\n name: \"Category\",\n type: \"select\",\n placeholder: \"Select Category\",\n isMandatory: true,\n listName: \"CategoryList\",\n },\n\n {\n name: \"Scheme\",\n type: \"Searchselect\",\n placeholder: \"Select Scheme\",\n isMandatory: true,\n listName: \"schemeList\",\n },\n ],\n [\n {\n name: \"Sub_ARN\",\n type: \"number\",\n isMandatory: false,\n },\n ],\n [\n {\n name: \"Sub_Broker_Code\",\n type: \"number\",\n isMandatory: false,\n },\n ],\n [\n {\n name: \"EUIN\",\n type: \"Searchselect\",\n placeholder: \"Select EUIN\",\n isMandatory: true,\n listName: \"euinList\",\n },\n ],\n [\n {\n name: \"Amount\",\n type: \"number\",\n placeholder: \"Enter Amount\",\n isMandatory: true,\n },\n ],\n [\n {\n name: \"Combo\",\n type: \"combo\",\n },\n ],\n\n\n\n ];\n const [dialog, setDialog] = useState({ open: false, appno: \"\" });\n const [isLoading, setIsLoading] = useState(false);\n const [isChecked, setIsChecked] = useState(true);\n const history = useHistory();\n const fetchSchemeList = async () => {\n try {\n const params = {\n plntype: \"Regular\",\n opt: \"S\",\n schemetype: formValues.Category.value,\n fund: \"105\"\n };\n const response = await props.getNewPurchaseFundList(params);\n const { Dtinformation } = response;\n const schemeList = Dtinformation.map((item) => ({\n value: item.Scheme_Plan,\n label: item.Scheme_Desc,\n plan: item.PlanDesc,\n option: item.fm_optiondesc,\n planValue: item.Scheme_Plan.split(\"~\")[2],\n optionValue: item.Scheme_Plan.split(\"~\")[3],\n schemeValue: item.Scheme_Plan.split(\"~\")[1],\n minAmt: item.MinAmt,\n multiples: item.multiples,\n combo: item.combo_flag,\n comboDisclaimer: item.combo_disclaimer,\n comboLabel: item.combo_lable,\n }));\n setFormValues({\n schemeList: schemeList.filter((item) => {\n return (\n item.plan.toLowerCase() === \"regular\" && item.schemeValue !== \"EB\"\n );\n }),\n });\n } catch (e) {\n setFormValues({ schemeList: [] });\n console.log(e);\n } finally {\n setIsLoading(false);\n }\n };\n const fetchEuinList = async () => {\n try {\n setIsLoading(true);\n const response = await props.validateSubBroker({\n Fund: \"105\",\n SubAgentCd: `ARN-${formValues?.Sub_ARN?.value.trim() || \"\"}`,\n AgentCd: props.token,\n });\n const { DtData } = response;\n const euinList = DtData.map((item) => ({\n value: item.abm_name,\n label: item.abm_agent,\n }));\n if (euinList.length === 1) {\n setFormValues({\n EUIN: {\n value: { label: euinList[0].label, value: euinList[0].value },\n },\n });\n }\n setFormValues({ euinList: euinList });\n } catch (e) {\n alert(e);\n } finally {\n setIsLoading(false);\n }\n };\n const fetchCategoryList = async () => {\n try {\n setIsLoading(true);\n let params = { plntype: REGULAR };\n params = { ...params, opt: \"AT\", fund: \"105\", customfund: \"105\" };\n const types = [\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n ];\n const response = await props.getNewPurchaseFundList(params, types);\n const { Dtinformation } = response;\n const categoryList = Dtinformation.map((item) => ({\n value: item.fm_subcategory,\n label: item.fm_subcategory,\n }));\n setFormValues({ CategoryList: categoryList });\n } catch (e) {\n console.log(e);\n } finally {\n setIsLoading(false);\n }\n };\n useEffect(() => {\n fetchCategoryList();\n }, []);\n // const handleSubArnCode =()=>{\n // if(!!formValues.Sub_ARN.value){\n // fetchEuinList()\n // }\n // }\n useEffect(() => {\n fetchSchemeList();\n fetchEuinList();\n }, [formValues.Category.value]);\n useEffect(() => {\n const handler= setTimeout(() => {\n fetchEuinList();\n },500)\n return () => {\n clearTimeout(handler);\n }\n }, [formValues.Sub_ARN.value]);\n const handleScheme = (label) => (event) => {\n const { schemeList } = formValues;\n if (label === \"Scheme\") {\n const scheme = schemeList.find((item) => item.value === event.value);\n const commonValues = {\n Scheme: { value: event },\n \"Scheme Plan\": { value: scheme.plan },\n \"Scheme Option\": { value: scheme.option },\n planValue: scheme.planValue,\n optionValue: scheme.optionValue,\n schemeValue: scheme.schemeValue,\n minimumAmount: scheme.minAmt,\n multiples: scheme.multiples || 1,\n };\n\n setFormValues({\n ...commonValues,\n ...(scheme.combo === \"Y\" && !!scheme.comboDisclaimer\n ? { Combo: true, comboDisclaimer: scheme.comboDisclaimer }\n : { comboDisclaimer: \"\" }),\n });\n\n\n }\n if (label === \"EUIN\") {\n setFormValues({\n EUIN: { value: event },\n });\n }\n };\n const handleChange = (label) => (event) => {\n const value = label !== \"Scheme\" ? event.target.value : event.value;\n switch (label) {\n case \"Category\":\n setFormValues({\n [label]: { value },\n Scheme: { value: \"\" },\n \"Scheme Plan\": \"\",\n \"Scheme Option\": \"\",\n Amount: { value: \"\" },\n EUIN: \"\",\n });\n break;\n case \"Combo\":\n setFormValues({\n Combo: !formValues.Combo,\n });\n break;\n case \"radioValue\":\n setFormValues({\n EUINNO: { value: formValues.EUINNO.value === \"no\" ? \"yes\" : \"no\" }\n })\n case \"Amount\":\n if (value.length > 9) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Amount cannot exceed 10 digits\",\n },\n });\n } else if (parseInt(value) < parseInt(formValues.minimumAmount)) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \"Amount should be greater than or equal to \" +\n formValues.minimumAmount,\n },\n });\n } else if (parseInt(value) % parseInt(formValues.multiples) !== 0) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \"Amount should be multiple of \" + formValues.multiples,\n },\n });\n } else {\n setFormValues({ [label]: { value } });\n }\n break;\n case \"Sub_ARN\":\n if (value.length > 8) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Sub-ARN Code cannot exceed 12 digits\",\n },\n });\n } else {\n setFormValues({ [label]: { value } });\n }\n break;\n case \"Sub_Broker_Code\":\n if (value.length > 8) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Sub-Broker Code cannot exceed 12 digits\"\n },\n });\n } else {\n setFormValues({ [label]: { value } });\n }\n break;\n default:\n setFormValues({ [label]: { value } });\n }\n };\n const closeModel = () => {\n history.replace(BUILD_URL + \"/new-transaction\");\n };\n const handleBlur = (label) => (event) => {\n const value = event.target.value;\n props.storeLumpsum({ [label]: value })\n }\n const gotoTransactionTypes = () => {\n history.replace(BUILD_URL + \"/\");\n };\n const dispatch = useDispatch();\n const submit = async () => {\n if (!formValues.Category.value) {\n setFormValues({\n Category: {\n value: \"\",\n isError: true,\n errorMessage: \" Category is Mandatory\",\n },\n });\n return;\n } else if (!formValues.Scheme.value) {\n setFormValues({\n Scheme: {\n value: \"\",\n isError: true,\n errorMessage: \" Scheme is Mandatory\",\n },\n });\n return;\n } else if (formValues.EUINNO.value === \"no\" && !formValues.EUIN.value) {\n setFormValues({\n EUIN: {\n value: \"\",\n isError: true,\n errorMessage: \"EUIN selection is mandatory\",\n },\n });\n return;\n } else if (!formValues.Amount.value) {\n setFormValues({\n Amount: {\n value: \"\",\n isError: true,\n errorMessage: \" Amount is Mandatory\",\n },\n });\n return;\n } else if (!isChecked) {\n alert(\"Please accept the terms and conditions to proceed\");\n return;\n } else if (formValues.Amount.value < formValues.minimumAmount) {\n setFormValues({\n Amount: {\n value: formValues.Amount.value,\n isError: true,\n errorMessage:\n \" Amount should be greater than or equal to \" +\n formValues.minimumAmount,\n },\n });\n return;\n } else if (formValues.Amount.value % formValues.multiples !== 0) {\n setFormValues({\n Amount: {\n value: formValues.Amount.value,\n isError: true,\n errorMessage:\n \"Amount should be a multiple of \" + formValues.multiples,\n },\n });\n return;\n } else if ((formValues.Sub_ARN.value && formValues.Sub_Broker_Code.value ) && (formValues.Sub_ARN.value === formValues.Sub_Broker_Code.value)) {\n setFormValues((prev) => ({\n ...prev,\n Sub_Broker_Code: {\n ...prev.Sub_Broker_Code,\n value: \"\",\n isError: true,\n errorMessage: `Sub ARN code and Sub Broker code cannot be the same`,\n },\n }));\n return;\n } else {\n if (!!formValues.Combo) {\n if (\n window.confirm(\n \"You have opted to do a Purchase cum Switch. Do you want to proceed?\"\n )\n ) {\n } else {\n return;\n }\n }\n\n setIsLoading(true);\n const schemedetails = {\n i_scheme: formValues.schemeValue,\n i_plan: formValues.planValue,\n i_option: formValues.optionValue,\n i_EUINno: formValues.EUINNO.value === \"no\" ? formValues.EUIN.value.value : \"\",\n i_amount: formValues.Amount.value,\n i_disitributorid: props.token,\n combo_flag: !!formValues.Combo ? \"Y\" : \"N\",\n };\n props.storeSchemeDetails({\n ...formValues,\n type: \"lumpsum\",\n ct: formValues.Category.value,\n });\n const paramsLumpsum = {\n ...props.applicantparams,\n ...props.fatcaDetails,\n ...props.investmentparams,\n ...props.nomineDetails,\n ...schemedetails,\n i_email: props.applicantparams.i_email === props.applicantparams.i_maskedEmail ? props.applicantparams.i_orignalEmail : props.applicantparams.i_email,\n i_mobileno: props.applicantparams.i_mobileno === props.applicantparams.i_maskedMobile ? props.applicantparams.i_orignalMobile : props.applicantparams.i_mobileno,\n i_subarncode: !!formValues.Sub_ARN.value ? `ARN-${formValues.Sub_ARN.value}` : \"\",\n i_subBrokerCode:!!formValues.Sub_Broker_Code.value ? formValues.Sub_Broker_Code.value : \"\",\n i_trtype: \"NEW\",\n i_appldt: format(new Date(), \"MM/dd/yyyy\"),\n i_chqdt: format(new Date(), \"MM/dd/yyyy\"),\n i_entby: props.userId,\n i_bankadd2: \" -\",\n i_bankadd3: \" -\",\n Invdistflag: \"W\",\n CustomFund: \"105\",\n i_fund: \"105\",\n };\n\n try {\n const responseLumpsum = await props.submitLumpsumDetails(paramsLumpsum);\n const { DtData } = responseLumpsum;\n const { appno } = DtData[0];\n dispatch(clearingFirstTimeInvestorJourney());\n setDialog({ appno: appno, open: true });\n setIsLoading(false);\n } catch (error) {\n setIsLoading(false);\n }\n\n }\n };\n const handleCombo = () => {\n setFormValues({\n Combo: !formValues.Combo,\n });\n }\n return (\n <>\n \n {section.map((field) => (\n \n {field.type === \"select\" ? (\n \n {formValues[field.listName].map((i, index) => (\n \n ))}\n \n ) : field.type === \"Searchselect\" || field.type === \"radio\" ? (\n <>\n
\n )}\n {!!formValues.comboDisclaimer && !!formValues.Combo && (\n \n \n\t\t\t\t\t\t\t ({\n label: i.label,\n value: i.value,\n }))}\n value={formValues[field.name].value}\n placeholder={`Select ${field.name}`}\n handleChange={handleScheme(field.name)}\n onBlur={handleBlur(field.name)}\n disabled={field.disabled}\n isError={formValues[field.name].isError}\n errorMessage={formValues[field.name].errorMessage}\n />\n ) : (\n
\n {field.name === \"Amount\" && (\n Minimum Amount : ₹ {formValues.minimumAmount}\n )}\n \n ) : field.type === \"combo\" ? (\n \n {field.name === \"Scheme\"\n ? Scheme*\n : (field.name === \"EUIN\" && formValues.EUINNO.value === \"no\")\n ? EUIN Selection*\n : (field.name === \"EUIN\" && formValues.EUINNO.value !== \"no\") ? \"\" : \"\"}\n
\n {/* {field.name ===\n\t\t\t\t\t\t \"Do you want to intentionally leave the EUIN box blank?\" && (\n\t\t\t\t\t\t <>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t YES
\n\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t\t)} */}\n {(field.type !== \"radio\") && ((field.name !== \"EUIN\" || formValues.EUINNO.value === \"no\") ? (\n NO
\n\t\t\t\t\t\t\t \n I/We hereby confirm that the EUIN box has been intentionally left\n the blank by me/us as this is an 'execution-only' transaction\n without any interaction or advice by any personnel of the above\n distributor or notwithstanding the advice of in-appropriateness,if\n any provided by any personnel of the distributor and the distributor\n has not charged any advisory fees on this transaction\n
\n ))}\n \n {!!formValues.comboDisclaimer && (\n \n \n Combo\n
\n \n
\n {field.name === \"Amount\" && (\n Minimum Amount : ₹ {formValues.minimumAmount}\n )}\n \n )}\n \n ))}\n \n ))}\n {/* <>\n \n \n history.replace(BUILD_URL + \"/new-investor-transaction/bank-details\")\n }\n >\n BACK\n \n \n SUBMIT\n \n
\n \n );\n};\nexport default connect(\n ({ authReducer, transactions, newinvestor }) => {\n const { token, userId } = authReducer;\n const { euinList } = transactions;\n const {\n schemeDetails,\n fatcaDetails,\n applicantparams,\n investmentparams,\n nomineDetails,\n } = newinvestor;\n return {\n schemeDetails,\n token,\n userId,\n euinList,\n fatcaDetails,\n applicantparams,\n investmentparams,\n nomineDetails,\n };\n },\n {\n getNewPurchaseFundList,\n validateSubBroker,\n submitLumpsumDetails,\n storeSchemeDetails,\n clearingFirstTimeInvestorJourney,\n }\n)(Lumpsum);\n","import {\n KeyboardDatePicker,\n MuiPickersUtilsProvider,\n} from \"@material-ui/pickers\";\nimport { Termsandconditions } from \"./lib/Termsandconditions\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport {\n Checkbox,\n FormControl,\n FormControlLabel,\n MenuItem,\n Radio,\n RadioGroup,\n} from \"@material-ui/core\";\nimport React, { useEffect, useReducer, useState } from \"react\";\nimport CustomizedSelect from \"../customizedSelect\";\nimport { Input } from \"../../../forms/input\";\nimport CardComponent from \"./lib/CardComponent\";\nimport CustomizedDialogs, { MandateRegistrationDialog } from \"../../customModal\";\nimport { connect, useDispatch } from \"react-redux\";\nimport IntegrationReactSelect from \"../../../forms/autoCompleteInput\";\nimport { RadioButton } from \"./lib/Radiobutton\";\nimport { BUILD_URL } from \"../../home\";\nimport { useHistory } from \"react-router\";\nimport {\n getNewPurchaseFundList,\n validateSubBroker,\n swpOptions,\n CalcSIPEnddt,\n storeSchemeDetails,\n getNav,\n getOtherSchemes,\n storeSchemeParams,\n submitSipDetails,\n clearingFirstTimeInvestorJourney,\n getCheckPanKotm,\n getCheckPanAotm,\n getMinimumAmount,\n} from \"shared/store/actions\";\nimport {\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n REGULAR,\n} from \"shared/store/types\";\nimport {\n INVESTMENT_FREQUENCY,\n SIP_DAY,\n PAYMENT_MODE,\n} from \"shared/store/types\";\nimport CustomLoader from \"../../../forms/customLoader\";\nimport { format } from \"date-fns\";\nimport addMonths from 'date-fns/addMonths';\nimport { calculateMonthsGap } from \"../SIPTopUp\";\nimport { formatToFullDate } from \"../sip\";\nimport moment from \"moment\";\nconst LummpsumSip = (props) => {\n const history = useHistory();\n const initialState = {\n Scheme: { value: \"\" },\n EUIN: { value: \"\" },\n Category: { value: \"\" },\n \"SIP Day\": { value: \"\" },\n Frequency: { value: \"\" },\n \"Sub Broker Code\": { value: \"\" },\n \"Sub ARN Code\": { value: \"\" },\n \"SIP Period From\": { value: \"\" },\n \"SIP Period To\": { value: \"\" },\n \"No of Installments\": { value: \"\" },\n MinimumAmount: \"\",\n MinimumLumpsumAmount: \"\",\n Amount: { value: \"\" },\n \"Lumpsum Amount\": { value: \"\" },\n MinimumInstallements: \"\",\n schemeList: [],\n euinList: [],\n EUINNO: { value: \"no\" },\n sipDateList: [],\n frequencyList: [],\n CategoryList: [],\n planValue: \"\",\n optionValue: \"\",\n schemeValue: \"\",\n multiple: \"\",\n perpetualSip: false,\n \"Mode of Registration\": { value: \"\" },\n openMandateDialog: false,\n modeList: [],\n umrnList: [],\n \"UMRN\": { value: \"\" },\n topUp: { value: \"No\" },\n topUpFrequency: { value: \"Half-Yearly\" },\n topUpAmount: { value: \"\" },\n topUpCapAmount: { value: \"\", display: true },\n topUpInstallments: { value: \"\" },\n topUpStartDate: { value: null, minDate: null, maxDate: null },\n topUpEndDate: { value: null, disabled: true, minDate: null, maxDate: null, display: false },\n topUpFieldType: \"endDate\",\n };\n const [formValues, setFormValues] = useReducer(\n (preValues, newValues) => ({ ...preValues, ...newValues }),\n initialState\n );\n const InputFields = [\n [\n {\n name: \"Category\",\n type: \"select\",\n placeholder: \"Select Category\",\n isMandatory: true,\n listName: \"CategoryList\",\n },\n ],\n [\n {\n name: \"Scheme\",\n type: \"Searchselect\",\n placeholder: \"Select Scheme\",\n isMandatory: true,\n listName: \"schemeList\",\n },\n ],\n [\n {\n name: \"Sub ARN Code\",\n type: \"number\",\n isMandatory: false,\n },\n ],\n [\n {\n name: \"Sub Broker Code\",\n type: \"number\",\n isMandatory: false,\n },\n ],\n [\n {\n name: \"EUIN\",\n type: \"Searchselect\",\n placeholder: \"Select EUIN\",\n isMandatory: true,\n listName: \"euinList\",\n },\n ],\n [\n {\n name: \"Frequency\",\n type: \"select\",\n placeholder: \"Select Frequency\",\n isMandatory: true,\n listName: \"frequencyList\",\n },\n ],\n [\n {\n name: \"Mode of Registration\",\n type: \"select\",\n placeholder: \"Select Mode\",\n isMandatory: true,\n listName: \"modeList\",\n },\n ],\n [\n {\n name: \"UMRN\",\n type: \"select\",\n placeholder: \"Select UMRN\",\n listName: \"umrnList\",\n display:\n [\"KOTM\", \"AOTM\", \"UAUTO\"].includes(formValues[\"Mode of Registration\"].value)\n ? false\n : true,\n disabled: formValues.umrnList.length === 1 ? true : false\n },\n ],\n [\n {\n name: \"SIP Day\",\n type: \"select\",\n placeholder: \"Select SIP Day\",\n isMandatory: true,\n listName: \"sipDateList\",\n },\n ],\n [\n {\n name: \"No of Installments\",\n type: \"number\",\n placeholder: !formValues.perpetualSip ? \"\" : \"Perpetual SIP\",\n isMandatory: true,\n disabled: !formValues.perpetualSip ? false : true,\n },\n ],\n [\n {\n name: \"SIP Period From\",\n type: \"date\",\n placeholder: \"Start Date\",\n isMandatory: true,\n disabled: true,\n },\n {\n name: \"SIP Period To\",\n type: \"date\",\n placeholder: \"End Date\",\n isMandatory: true,\n disabled: true,\n },\n ],\n\n [\n {\n name: \"Perpetual SIP\",\n type: \"Perpetual\",\n display: !formValues[\"SIP Period From\"].value\n },\n ],\n [\n {\n name: \"Amount\",\n type: \"number\",\n isMandatory: true,\n },\n ],\n [\n {\n name: \"Lumpsum Amount\",\n type: \"number\",\n display: props.type === \"Lumpsum + SIP\" ? false : true,\n isMandatory: props.type === \"Lumpsum + SIP\" ? true : false,\n },\n ],\n ];\n const TopUpInputFields = {\n dates: [\n {\n name: \"TOP-UP Start Date\",\n type: \"date\",\n placeholder: \"Select TOP-UP Start Date\",\n isMandatory: true,\n listName: \"topUpStartDate\",\n },\n {\n name: \"TOP-UP End Date\",\n type: \"date\",\n placeholder: \"Select TOP-UP End Date\",\n isMandatory: true,\n listName: \"topUpEndDate\",\n },\n ],\n others: [\n {\n name: \"Frequency\",\n type: \"radio\",\n options: [\"Quarterly\", \"Half-Yearly\", \"Yearly\"],\n isMandatory: true,\n listName: \"topUpFrequency\",\n },\n {\n name: \"TOP-UP Amount\",\n type: \"number\",\n placeholder: \"Enter Amount\",\n isMandatory: true,\n listName: \"topUpAmount\",\n },\n {\n name: \"TOP-UP CAP Amount\",\n type: \"number\",\n placeholder: \"Enter CAP Amount\",\n isMandatory: true,\n listName: \"topUpCapAmount\",\n },\n ],\n };\n\n const [topupStDt, setTopupStDt] = useState([]);\n\n\n const [dialog, setDialog] = useState({ open: false, appno: \"\" });\n const [isChecked, setIsChecked] = useState(true);\n const [isLoading, setIsLoading] = useState(false);\n const [sipStartDateRef, setSipStartDateRef] = useState(\"\");\n const [sipEndDateRef, setSipEndDateRef] = useState(\"\");\n\n const SIP_Date = formValues[\"SIP Day\"].value;\n const Frequency = formValues[\"Frequency\"].value;\n const setFrequencyList = async () => {\n const euinParams = { opt: INVESTMENT_FREQUENCY, fund: \"105\" };\n const euinResponse = await props.swpOptions(euinParams);\n const { Dtinformation } = euinResponse;\n const frequencyList = Dtinformation.map((item) => ({\n label: item.FrequencyID,\n value: item.FrequencyID,\n min: item.Minimum_Instalment,\n }));\n setFormValues({ frequencyList });\n };\n const handleScheme = (label) => (event) => {\n const { schemeList } = formValues;\n if (label === \"Scheme\") {\n const scheme = schemeList.find((item) => item.label === event.label);\n setFormValues({\n Scheme: { value: event },\n planValue: scheme.planValue,\n optionValue: scheme.optionValue,\n schemeValue: scheme.schemeValue,\n // MinimumAmount: scheme.MinimumAmount,\n multiple: scheme.multiples || 1,\n MinimumLumpsumAmount: scheme.MinimumLumpsumAmount,\n });\n setFrequencyList();\n }\n if (label === \"EUIN\") {\n setFormValues({\n EUIN: { value: event },\n });\n }\n };\n const shouldDisableTopUpDate = (date, fieldName) => {\n if (date) {\n const updatedDate = moment(date).format(\"DD/MM/YYYY\").split(\"/\");\n const formattedDate = new Date().setFullYear(\n updatedDate[2],\n updatedDate[1] - 1,\n updatedDate[0]\n );\n const { minDate, maxDate } = formValues[fieldName];\n\n if (fieldName === \"topUpStartDate\") {\n if (topupStDt.length > 0) {\n return date.getDate() !== Number(topupStDt[0]);\n }\n if (minDate && maxDate) {\n const minDateObj = new Date(minDate);\n const maxDateObj = new Date(maxDate);\n return formattedDate < minDateObj || formattedDate > maxDateObj;\n }\n }\n\n if (fieldName === \"topUpEndDate\") {\n if (topupStDt.length > 0) {\n return date.getDate() !== Number(topupStDt[0]);\n }\n if (minDate && maxDate) {\n const minDateObj = new Date(minDate);\n const maxDateObj = new Date(maxDate);\n return formattedDate < minDateObj || formattedDate > maxDateObj;\n }\n }\n }\n };\n\n const handleMinandMaxDate = (field, value) => {\n if (field === \"topUpFrequency\") {\n const minDate = addMonths(sipStartDateRef, 6);\n setFormValues({\n topUpStartDate: {\n minDate: minDate || null,\n maxDate: addMonths(minDate, 3),\n value: null,\n disabled: false,\n isError: false,\n errorMessage: \"\",\n },\n topUpEndDate: {\n minDate: null,\n value: null,\n disabled: true,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n }\n const handleTopUpDate = (pickerDate, fieldName) => {\n const date = new Date(pickerDate).setHours(0, 0, 0, 0);\n if (date > sipEndDateRef) {\n const dateType = fieldName === \"topUpStartDate\" ? \"start\" : \"end\";\n alert(`Topup ${dateType} date should not exceed SIP end date`);\n return;\n }\n if (date) {\n const updatedDate = moment(date).format(\"DD/MM/YYYY\").split(\"/\");\n if (fieldName === \"topUpStartDate\") {\n const topUpFrequencyValue =\n formValues[\"topUpFrequency\"].value === \"Yearly\" ? 12 : formValues[\"topUpFrequency\"].value === \"Quarterly\" ? 3 : 6;\n const topupyearadd = 2;\n let minTopUpEndDt =\n Number(updatedDate[1]) +\n (formValues[\"topUpFrequency\"] === \"Yearly\" ? 12 : formValues[\"topUpFrequency\"].value === \"Quarterly\" ? 3 : 6);\n let topUpEndMonth =\n minTopUpEndDt > 12 ? minTopUpEndDt - 12 : minTopUpEndDt;\n let topUpEndYear =\n minTopUpEndDt > 12\n ? Number(updatedDate[2]) + 1\n : Number(updatedDate[2]);\n const topupmonth =\n updatedDate[1] - 1 + topUpFrequencyValue > 12\n ? updatedDate[1] - 1 + topUpFrequencyValue - 12\n : updatedDate[1] - 1 + topUpFrequencyValue;\n const topupyear =\n updatedDate[1] - 1 + topUpFrequencyValue > 12\n ? updatedDate[2] - 1 + topupyearadd\n : updatedDate[2];\n const adjustedMinDate = addMonths(date, topUpFrequencyValue);\n if (adjustedMinDate > (sipEndDateRef\n ? sipEndDateRef\n : new Date(2099, 11, 31))\n ) {\n alert(\"Top-up Start Date is invalid as the Top-up End Date exceeds the SIP End Date based on the selected Top-up frequency\")\n }\n else {\n setFormValues({\n topUpStartDate: {\n ...formValues[\"topUpStartDate\"],\n value: new Date(\n updatedDate[2],\n updatedDate[1] - 1,\n updatedDate[0]\n ),\n isError: false,\n errorMessage: \"\",\n },\n topUpEndDate: {\n ...formValues[\"topUpEndDate\"],\n minDate: adjustedMinDate,\n // minDate: new Date(topUpEndYear.toString(), (topUpEndMonth - 1).toString(), updatedDate[0])\n maxDate: sipEndDateRef\n ? sipEndDateRef\n : null,\n value: null,\n disabled: false,\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n }\n\n if (fieldName === \"topUpEndDate\") {\n if (([\"KOTM\", \"AOTM\", \"UAUTO\"].includes(formValues[\"Mode of Registration\"].value)) && new Date(\n updatedDate[2],\n updatedDate[1],\n updatedDate[0]\n ) > formatToFullDate(formValues[\"UMRN\"].value[\"MANDATE END DATE\"])) {\n alert(\"Top-up end date exceeds the mandate end date\");\n return;\n }\n const numberofInstallments = calculateMonthsGap(formValues[\"topUpStartDate\"].value, date)\n setFormValues({\n topUpInstallments: { value: numberofInstallments },\n topUpEndDate: {\n ...formValues[\"topUpEndDate\"],\n value: new Date(\n updatedDate[2],\n updatedDate[1] - 1,\n updatedDate[0]\n ),\n isError: false,\n errorMessage: \"\",\n },\n });\n }\n } else {\n if (fieldName === \"topUpStartDate\") {\n setFormValues({\n topUpStartDate: {\n ...formValues[\"topUpStartDate\"],\n value: null,\n isError: true,\n errorMessage: \"TOP-UP Start Date is Mandatory\",\n },\n topUpEndDate: {\n ...formValues[\"topUpEndDate\"],\n minDate: null,\n value: null,\n disabled: true,\n isError: false,\n errorMessage: \"\",\n },\n topUpInstallments: { value: \"\" }\n });\n }\n if (fieldName === \"topUpEndDate\") {\n setFormValues({\n topUpEndDate: {\n ...formValues[\"topUpEndDate\"],\n value: null,\n isError: true,\n errorMessage: \"TOP-UP End Date is Mandatory\",\n },\n });\n }\n }\n };\n\n const getSipDates = async (installments) => {\n const StartDate = formValues[\"SIP Day\"].value;\n const { Scheme } = formValues;\n const sipDateParams = {\n fund: \"105\",\n trtype: \"SIP\",\n StartDate,\n Installments: installments,\n Frequency: formValues.Frequency.value,\n sch: !!Scheme.value.schemeValue ? Scheme.value.schemeValue : \"\",\n };\n try {\n setIsLoading(true);\n const sipDateResponse = await props.CalcSIPEnddt(sipDateParams);\n const {\n DtData: [dates],\n } = sipDateResponse;\n const { SIP_EndDate, SIP_StartDate } = dates;\n const End_dt = !!SIP_EndDate ? SIP_EndDate.split(\"/\") : [];\n const Start_dt = !!SIP_StartDate ? SIP_StartDate.split(\"/\") : [];\n const endDay = parseInt(End_dt[0], 10);\n const endMonth = parseInt(End_dt[1], 10) - 1;\n const endYear = parseInt(End_dt[2], 10);\n const sipEndDateObj = new Date(endYear, endMonth, endDay);\n const startDay = parseInt(Start_dt[0], 10);\n const startMonth = parseInt(Start_dt[1], 10) - 1;\n const startYear = parseInt(Start_dt[2], 10);\n const sipStartDateObj = new Date(startYear, startMonth, startDay);\n setSipStartDateRef(sipStartDateObj);\n setSipEndDateRef(sipEndDateObj);\n\n let minTopUpDt = Number(Start_dt[1]) + 6;\n let topUpStartMonth = minTopUpDt > 12 ? minTopUpDt - 12 : minTopUpDt;\n let topUpStartYear =\n minTopUpDt > 12 ? Number(Start_dt[2]) + 1 : Number(Start_dt[2]);\n setTopupStDt([\n Start_dt[0],\n topUpStartMonth.toString(),\n topUpStartYear.toString(),\n ]);\n const minDate = addMonths(sipStartDateObj, 6);\n\n setFormValues({\n \"SIP Period From\": {\n value: !!End_dt\n ? new Date().setFullYear(Start_dt[2], Start_dt[1] - 1, Start_dt[0])\n : \"\",\n },\n \"SIP Period To\": {\n value: !!Start_dt\n ? new Date().setFullYear(End_dt[2], End_dt[1] - 1, End_dt[0])\n : \"\",\n },\n topUpStartDate: {\n minDate: minDate || null,\n maxDate: addMonths(minDate, 3) || null,\n value: null,\n },\n topUpEndDate: {\n minDate: null,\n maxDate: End_dt\n ? new Date().setFullYear(End_dt[2], End_dt[1] - 1, End_dt[0])\n : null,\n value: null,\n disabled: true,\n },\n });\n } catch (e) {\n console.log(\"error\", e);\n setFormValues({\n \"No of Installments\": {\n value: \"\",\n isError: true,\n errorMessage: `Enter Valid Number of Installments`,\n },\n \"SIP Period From\": { value: \"\" },\n \"SIP Period To\": { value: \"\" },\n });\n } finally {\n setIsLoading(false);\n }\n };\n\n const handleChange = (label) => async (event) => {\n const value = event.target.value;\n if (!value && label !== \"Sub ARN Code\" && label !== \"Sub Broker Code\") {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage: `${label} is Mandatory`,\n },\n });\n return;\n }\n setFormValues({ [label]: { value } });\n switch (label) {\n case \"Category\":\n setFormValues({\n [label]: { value },\n Scheme: { value: \"\" },\n Amount: { value: \"\" },\n EUIN: \"\",\n \"SIP Day\": { value: \"\" },\n Frequency: { value: \"\" },\n \"Lumpsum Amount\": { value: \"\" },\n \"SIP Period From\": { value: \"\" },\n \"SIP Period To\": { value: \"\" },\n \"No of Installments\": { value: \"\" },\n });\n break;\n case \"No of Installments\":\n if (\n !!value &&\n parseInt(value) < parseInt(formValues.MinimumInstallements)\n ) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \" Number of installments should be greater than or equal to the minimum number of installments \",\n },\n });\n } else if (parseInt(value) > 999) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"No of Installments should not be greater than 999\",\n },\n });\n }\n break;\n case \"radioValue\":\n setFormValues({\n EUINNO: { value: formValues.EUINNO.value === \"no\" ? \"yes\" : \"no\" },\n });\n break;\n case \"Mode of Registration\":\n console.log(\"value\",value)\n if ([\"KOTM\", \"AOTM\", \"UAUTO\"].includes(value)) {\n fetchUMRNList(value);\n } else {\n setFormValues({ UMRN: { value: \"\" } });\n }\n\n // setFormValues({ [label]: { value } });\n break;\n case \"Amount\":\n if (!!value && parseInt(value) < parseInt(formValues.MinimumAmount)) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \" Amount should be greater than or equal to \" +\n formValues.MinimumAmount,\n },\n });\n } else if (parseInt(value) % parseInt(formValues.multiple) !== 0) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \"Amount should be multiple of \" + formValues.multiple,\n },\n });\n } else {\n setFormValues({ [label]: { value } });\n }\n break;\n case \"Lumpsum Amount\":\n if (\n !!value &&\n parseInt(formValues.MinimumLumpsumAmount) > parseInt(value)\n ) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \" Amount should be greater than or equal to \" +\n formValues.MinimumLumpsumAmount,\n },\n });\n } else if (parseInt(value) % parseInt(formValues.multiple) !== 0) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \"Amount should be multiple of \" + formValues.multiple,\n },\n });\n } else {\n setFormValues({ [label]: { value } });\n }\n break;\n case \"Sub ARN Code\":\n if (value.length > 8) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Sub-ARN Code cannot exceed 8 digits\",\n },\n });\n } else {\n setFormValues({ [label]: { value } });\n }\n break;\n case \"Sub Broker Code\":\n if (value.length > 8) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Sub-Broker Code cannot exceed 8 digits\"\n },\n });\n } else {\n setFormValues({ [label]: { value } });\n }\n break;\n default:\n setFormValues({ [label]: { value } });\n break;\n }\n };\n const fetchUMRNList = async (type) => {\n try {\n setIsLoading(true);\n const { AMC } = formValues;\n const params = {\n Fund: \"105\",\n PAN: props.applicantparams.i_pangno,\n Source: type,\n Acno: 0,\n };\n\n const response =\n type === \"KOTM\"\n ? await props.getCheckPanKotm(params)\n : await props.getCheckPanAotm(params);\n\n const { Table1 } = response;\n\n if (Table1.length === 0 && type === \"UAUTO\") {\n setIsLoading(false);\n setFormValues({\n openMandateDialog: true,\n });\n return;\n }\n\n const umrnList = Table1.map((item) => ({\n value: item,\n label: item.UMRNNO,\n }));\n\n if (umrnList.length > 1) {\n const maxAmt = Table1.reduce(\n (max, obj) => (obj.Amt > max ? obj.Amt : max),\n 0\n );\n const filteredData = Table1.filter((obj) => obj.Amt === maxAmt);\n setFormValues({ UMRN: { value: filteredData[0] } });\n }\n\n if (umrnList.length === 1) {\n setFormValues({ UMRN: { value: umrnList[0].value } });\n }\n\n setFormValues({ umrnList: umrnList });\n } catch (error) {\n console.error(\"Error fetching UMRN List:\", error);\n } finally {\n setIsLoading(false);\n }\n };\n\n const validate = (label) => async (event) => {\n const value = event.target.value;\n switch (label) {\n case \"Amount\":\n if (!!value && parseInt(value) < parseInt(formValues.MinimumAmount)) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage:\n \" Amount should be greater than or equal to Minimum Amount \",\n },\n });\n }\n break;\n case \"No of Installments\":\n if (!value && formValues.perpetualSip) {\n setFormValues({\n [label]: {\n value,\n isError: true,\n errorMessage: `${label} is Mandatory`,\n },\n });\n return;\n }\n getSipDates(value);\n break;\n default:\n break;\n }\n };\n\n const getMinInstallment = async (event) => {\n const value = event.target.value;\n const { frequencyList } = formValues;\n\n const installment = frequencyList.find((item) => item.value === value);\n const frequencyParams = {\n opt: SIP_DAY,\n fund: \"105\",\n astscheme: value,\n };\n const frequencyResponse = await props.swpOptions(frequencyParams);\n const frequencyData = frequencyResponse.Dtinformation;\n const sipDateList = frequencyData.map((item) => ({\n label: item.sip_cycleid,\n value: item.sip_cycleid,\n }));\n const minParams = {\n Fund: \"105\",\n Scheme:formValues.schemeValue,\n Trtype: \"SIP\",\n Frequency: value,\n\n };\n const response = await props.getMinimumAmount(minParams);\n if (response) {\n const { DtData } = response;\n let minAmount = DtData[0].minamt;\n setFormValues({\n sipDateList,\n MinimumInstallements: installment.min,\n Frequency: { value },\n MinimumAmount: minAmount \n })\n } else {\n setFormValues({\n sipDateList:[],\n MinimumInstallements: \"\",\n Frequency: { value:\"\" },\n MinimumAmount: \"\" \n })\n }\n };\n const fetchSchemeList = async () => {\n try {\n setIsLoading(true);\n const schemeParams = {\n schtype: \"Regular\",\n category: formValues.Category.value,\n acno: \"0\",\n fundCode: \"105\",\n trantype: \"I\",\n };\n const schemeResponse = await props.getOtherSchemes(schemeParams);\n const { DtData } = schemeResponse;\n const schemeList = DtData.map((item) => {\n return {\n label: item.fm_schdesc,\n value: item.fm_scheme,\n planValue: item.fm_plan,\n optionValue: item.fm_option,\n schemeValue: item.fm_scheme,\n // MinimumAmount: item.SIPminamt,\n multiples: item.multiples,\n MinimumLumpsumAmount: item.fm_newpur,\n };\n });\n setFormValues({\n schemeList,\n });\n } catch (e) {\n console.log(e);\n setFormValues({ schemeList: [] });\n } finally {\n setIsLoading(false);\n }\n };\n const fetchEuinList = async () => {\n try {\n setIsLoading(true);\n const response = await props.validateSubBroker({\n Fund: \"105\",\n SubAgentCd: `ARN-${formValues[\"Sub ARN Code\"]?.value.trim() || \"\"}`,\n AgentCd: props.token,\n });\n const { DtData } = response;\n const euinList = DtData.map((item) => ({\n value: item.abm_name,\n label: item.abm_agent,\n }));\n setFormValues({ euinList: euinList });\n } catch (e) {\n alert(e);\n } finally {\n setIsLoading(false);\n }\n };\n const fetchModelist = async () => {\n try {\n setIsLoading(true);\n const params = {\n opt: PAYMENT_MODE,\n Fund: \"105\",\n astscheme: props.applicantparams.i_pangno,\n };\n const response = await props.swpOptions(params);\n if (!!response) {\n setFormValues({\n modeList: response.Dtinformation.map((item) => {\n return { label: item.Pay_Mode, value: item.Pay_Mode_Val };\n }),\n });\n }\n } catch (e) {\n console.log(e);\n } finally {\n setIsLoading(false);\n }\n };\n const fetchCategoryList = async () => {\n try {\n setIsLoading(true);\n let params = { plntype: REGULAR };\n params = { ...params, opt: \"AT\", fund: \"105\" };\n const types = [\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n ];\n const response = await props.getNewPurchaseFundList(params, types);\n const { Dtinformation } = response;\n const categoryList = Dtinformation.map((item) => ({\n value: item.fm_subcategory,\n label: item.fm_subcategory,\n }));\n setFormValues({ CategoryList: categoryList });\n } catch (e) {\n console.log(e);\n } finally {\n setIsLoading(false);\n }\n };\n useEffect(() => {\n fetchCategoryList();\n fetchModelist();\n }, []);\n useEffect(() => {\n fetchSchemeList();\n fetchEuinList();\n }, [formValues.Category.value]);\n useEffect(() => {\n if (formValues[\"No of Installments\"].value && SIP_Date && Frequency) {\n getSipDates(formValues[\"No of Installments\"].value);\n }\n }, [SIP_Date, Frequency]);\n useEffect(() => {\n const handler = setTimeout(() => {\n fetchEuinList();\n },500)\n return ()=>{\n clearTimeout(handler)\n }\n }, [formValues[\"Sub ARN Code\"].value]);\n const handlechangeSIPEndDateChange = () => {\n const { perpetualSip } = formValues;\n let Umrn_endDate;\n const URMN_enddate =\n formValues[\"UMRN\"]?.value[\"MANDATE END DATE\"]?.split(\"/\");\n const End_dt = \"31/12/2099\".split(\"/\");\n const endDate = new Date().setFullYear(End_dt[2], End_dt[1] - 1, End_dt[0]);\n if (formValues[\"UMRN\"]?.value[\"MANDATE END DATE\"]) {\n Umrn_endDate = new Date().setFullYear(\n URMN_enddate[2],\n URMN_enddate[1] - 1,\n URMN_enddate[0]\n );\n }\n let selectedFrequency = formValues[\"Frequency\"].value;\n let startDateSplitting = formValues[\"SIP Period From\"].value\n let dateFromTimestamp = new Date(startDateSplitting);\n\n // Extract the year, month, and day from the Date object\n let Year = dateFromTimestamp.getFullYear();\n let Month = dateFromTimestamp.getMonth() + 1; // getMonth() returns 0-11\n let Day = dateFromTimestamp.getDate();\n const startDate = new Date(Year, Month - 1, Day);\n\n let EndDate =\n [\"KOTM\", \"AOTM\", \"UAUTO\"].includes(formValues[\"Mode of Registration\"].value)\n\n ? new Date(Umrn_endDate)\n : new Date(endDate);\n let monthsDifference =\n (EndDate.getFullYear() - startDate.getFullYear()) * 12 +\n (EndDate.getMonth() - startDate.getMonth());\n let noofFrequency =\n selectedFrequency == \"Monthly\"\n ? monthsDifference\n : selectedFrequency == \"Daily\"\n ? Math.floor((EndDate - startDate) / (1000 * 60 * 60 * 24))\n : selectedFrequency == \"Weekly\"\n ? (EndDate - startDate) / (1000 * 60 * 60 * 24) / 7\n : selectedFrequency == \"Quarterly\"\n ? Math.floor(monthsDifference / 3)\n : selectedFrequency == \"Yearly\"\n ? Math.floor(monthsDifference / 12)\n : \"\";\n if (!perpetualSip && formValues[\"UMRN\"]?.value) {\n setFormValues({\n perpetualSip: !perpetualSip,\n \"SIP Period To\": {\n value:\n [\"KOTM\", \"AOTM\", \"UAUTO\"].includes(formValues[\"Mode of Registration\"].value)\n ? Umrn_endDate\n : endDate,\n },\n \"No of Installments\": {\n value: Math.floor(noofFrequency),\n },\n });\n } else if (!perpetualSip) {\n setFormValues({\n perpetualSip: !perpetualSip,\n \"SIP Period To\": {\n value: endDate,\n },\n \"No of Installments\": {\n value: Math.floor(noofFrequency),\n },\n });\n } else if (!!perpetualSip) {\n setFormValues({\n perpetualSip: !perpetualSip,\n });\n }\n };\n\n const closeModel = () => {\n history.replace(BUILD_URL + \"/new-transaction\");\n };\n const gotoTransactionTypes = () => {\n history.replace(BUILD_URL + \"/\");\n };\n const dispatch = useDispatch();\n const closeMandate = () => {\n setFormValues({\n openMandateDialog: false,\n \"Mode of Registration\": { value: \"\" },\n });\n };\n const continueMandate = () => {\n history.replace(BUILD_URL + \"/investors/eNACH/digital/transact\", {\n type: formValues[\"Mode of Registration\"].value,\n });\n };\n\n const submit = async () => {\n const {\n schemeList,\n euinList,\n CategoryList,\n modeList,\n sipDateList,\n frequencyList,\n MinimumInstallements,\n MinimumAmount,\n MinimumLumpsumAmount,\n planValue,\n optionValue,\n schemeValue,\n type,\n ct,\n umrnList,\n perpetualSip,\n multiple,\n openMandateDialog,\n sub_arn,\n topUp,\n topUpFrequency,\n topUpAmount,\n topUpCapAmount,\n topUpInstallments,\n topUpStartDate,\n topUpEndDate,\n topUpFieldType,\n ...others\n } = formValues;\n let d1,d2\n const sipPeriodTo = formValues?.[\"SIP Period To\"]?.value;\nconst mandateEndDate = formValues?.[\"UMRN\"]?.value?.[\"MANDATE END DATE\"];\n\nif (sipPeriodTo) {\n const split_enddate = format(sipPeriodTo, \"MM/dd/yyyy\").split(\"/\");\n \n if (split_enddate.length === 3 && split_enddate.every(val => val)) {\n let d1 = new Date(Number(split_enddate[2]), Number(split_enddate[0]) - 1, Number(split_enddate[1]));\n console.log(\"Valid SIP Period To date:\", d1);\n } else {\n console.error(\"Invalid SIP Period To date format\");\n }\n} else {\n console.error(\"SIP Period To value is missing\");\n}\n\nif (mandateEndDate) {\n const split_mandatedate = mandateEndDate.split(\"/\");\n \n if (split_mandatedate.length === 3 && split_mandatedate.every(val => val)) {\n let d2 = new Date(Number(split_mandatedate[2]), Number(split_mandatedate[1]) - 1, Number(split_mandatedate[0]));\n console.log(\"Valid Mandate End Date:\", d2);\n } else {\n console.error(\"Invalid Mandate End Date format\");\n }\n} else {\n console.error(\"Mandate End Date value is missing\");\n}\n\n\n const isTG = formValues?.schemeValue === \"TG\";\n const topUpminAmount = isTG ? 500 : 100;\n const amount = Number(topUpAmount.value);\n const noof = [\"No of Installments\"];\n const SIPPeriodTo = [\"SIP Period To\"];\n const topUpCAPAmount = formValues.topUpCapAmount;\n const umrn = [\"UMRN\"];\n const lumpsumAmount = [\"Lumpsum Amount\"]\n const values = Object.keys(others);\n const sub_arn_code = [\"Sub ARN Code\"];\n const sub_broker_code = [\"Sub Broker Code\"];\n const subbrokersubarn = [...sub_arn_code, ...sub_broker_code];\n const filteredValues = values.filter((ele) => !subbrokersubarn.includes(ele));\n const keys = formValues.perpetualSip\n ? filteredValues.filter((ele) => !noof.includes(ele))\n : filteredValues;\n const final_keys_for_validation = [\"KOTM\", \"AOTM\", \"UAUTO\"].includes(formValues[\"Mode of Registration\"].value) ? keys : keys.filter((ele) => !umrn.includes(ele));\n const finalKeys = props.type !== \"Lumpsum + SIP\"\n ? final_keys_for_validation.filter((ele) => !lumpsumAmount.includes(ele))\n : final_keys_for_validation;\n const submitfinalKeys = formValues.topUpFieldType === \"capAmount\"\n ? finalKeys.filter((ele) => !SIPPeriodTo.includes(ele))\n : finalKeys\n const findError = submitfinalKeys.every((key) => !!others[key].value);\n console.log(\"submitfinalKeys\", submitfinalKeys)\n\n if (!findError) {\n submitfinalKeys.forEach((key) => {\n !others[key].value &&\n setFormValues({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${key === \"sipType\"\n ? \"SIP Type\"\n : key === \"Scheme\"\n ? \"Scheme\"\n : key === \"investmentFrequency\"\n ? \"Investment frequency\"\n : key === \"installments\"\n ? \"Installments\"\n : key === \"sipDay\"\n ? \"SIP day\"\n : key === \"sip_start_date\"\n ? \"SIP Start date\"\n : key === \"sip_end_date\"\n ? \"SIP end date\"\n : key === \"installmentAmount\"\n ? \"Installment Amount\"\n : key\n } is Mandatory`,\n },\n });\n });\n\n return;\n } else if (\n others[\"No of Installments\"].value < MinimumInstallements &&\n !formValues.perpetualSip\n ) {\n setFormValues({\n \"No of Installments\": {\n ...others[\"No of Installments\"],\n isError: true,\n errorMessage: `Number of installments should be greater than or equal to the minimum number of installments`,\n },\n });\n\n return;\n } else if (parseInt(others[\"Amount\"].value) < parseInt(MinimumAmount)) {\n setFormValues({\n Amount: {\n ...others[\"Amount\"],\n value: \"\",\n isError: true,\n errorMessage: `Amount should be greater than or equal to Minimum Amount`,\n },\n });\n\n return;\n } else if (+others[\"Amount\"].value > 1000000) {\n\n setFormValues({\n Amount: {\n ...others[\"Amount\"],\n isError: true,\n errorMessage: `Amount should be less than or equal to 10,00,000`,\n },\n });\n return;\n } else if ((props.type === \"Lumpsum + SIP\") && (+others[\"Lumpsum Amount\"].value > 1000000)) {\n setFormValues({\n \"Lumpsum Amount\": {\n ...others[\"Lumpsum Amount\"],\n isError: true,\n errorMessage: `Lumpsum Amount should be less than or equal to 10,00,000`,\n },\n });\n return;\n } else if ((!!formValues[\"Sub ARN Code\"].value && !!formValues[\"Sub Broker Code\"].value) && (formValues[\"Sub ARN Code\"].value === formValues[\"Sub Broker Code\"].value)) {\n setFormValues({\n \"Sub Broker Code\": {\n ...others[\"Sub Broker Code\"],\n isError: true,\n errorMessage: `Sub ARN code and Sub Broker code cannot be the same`\n },\n });\n return;\n } else if (formValues.Amount.value % formValues.multiple !== 0) {\n setFormValues({\n Amount: {\n value: formValues.Amount.value,\n isError: true,\n errorMessage: \"Amount should be a multiple of \" + formValues.multiple,\n },\n });\n return;\n } else if(topUpCapAmount.value && topUpCapAmount.value > formValues[\"UMRN\"]?.value?.Amt){\n setFormValues({\n topUpCapAmount: {\n value: topUpCapAmount?.value,\n isError: true,\n errorMessage: \"TOP-UP CAP Amount should not be greater than \" + formValues[\"UMRN\"]?.value?.Amt,\n },\n });\n return;\n } else if (\n [\"KOTM\", \"AOTM\", \"UAUTO\"].includes(formValues[\"Mode of Registration\"].value) &&\n formValues[\"UMRN\"].value.Amt < formValues.Amount.value\n ) {\n setFormValues({\n Amount: {\n value: formValues.Amount.value,\n isError: true,\n errorMessage: `SIP installment amount cannot exceed\n mandate registration limit of ${formValues[\"UMRN\"]?.value?.Amt}.`,\n },\n });\n } else if (props.type === \"Lumpsum + SIP\" &&\n (parseInt(others[\"Lumpsum Amount\"].value) <\n parseInt(formValues.MinimumLumpsumAmount))\n ) {\n setFormValues({\n \"Lumpsum Amount\": {\n ...others[\"Lumpsum Amount\"],\n value: \"\",\n isError: true,\n errorMessage: `Amount should be greater than or equal to Minimum Amount`,\n },\n });\n return;\n } else if (props.type === \"Lumpsum + SIP\" && (others[\"Lumpsum Amount\"].value % formValues.multiple !== 0)) {\n setFormValues({\n \"Lumpsum Amount\": {\n value: formValues[\"Lumpsum Amount\"].value,\n isError: true,\n errorMessage: \"Amount should be a multiple of \" + formValues.multiple,\n },\n });\n return;\n } else if (!isChecked) {\n alert(\"Please accept the terms and conditions to proceed\");\n\n return;\n } else if (d1 > d2) {\n setFormValues({\n \"SIP Period To\": {\n value: \"\",\n isError: true,\n errorMessage: `SIP end date cannot exceed mandate validity\n date of ${formValues[\"UMRN\"].value[\"MANDATE END DATE\"]}.`,\n },\n });\n return;\n } else if (!formValues.EUIN.value) {\n setFormValues({\n EUIN: {\n value: \"\",\n isError: true,\n errorMessage: `EUIN selection is mandatory`,\n },\n });\n } else if (\n topUp.value === \"Yes\" &&\n (!topUpAmount.value || !topUpStartDate.value || (topUpFieldType === \"endDate\" && !topUpEndDate.value) || (topUpFieldType === \"capAmount\" && !topUpCapAmount.value)\n )) {\n setFormValues({\n topUpAmount: {\n ...formValues[\"topUpAmount\"],\n isError: !topUpAmount.value ? true : false,\n errorMessage: !topUpAmount.value ? `TOP-UP Amount is Mandatory` : \"\",\n },\n topUpCapAmount: {\n ...formValues[\"topUpCapAmount\"],\n isError: !topUpCapAmount.value ? true : false,\n errorMessage: !topUpCapAmount.value ? `TOP-UP CAP Amount is Mandatory` : \"\",\n },\n topUpStartDate: {\n ...formValues[\"topUpStartDate\"],\n isError: !topUpStartDate.value ? true : false,\n errorMessage: !topUpStartDate.value\n ? `TOP-UP Start Date is Mandatory`\n : \"\",\n },\n topUpEndDate: {\n ...formValues[\"topUpEndDate\"],\n isError: !topUpEndDate.value ? true : false,\n errorMessage: !topUpEndDate.value\n ? `TOP-UP End Date is Mandatory`\n : \"\",\n },\n });\n return;\n } else if (topUp.value === \"Yes\" && amount && amount < topUpminAmount) {\n setFormValues({\n topUpAmount: {\n ...topUpAmount,\n isError: true,\n errorMessage: `Amount should be greater than or equal to ${topUpminAmount}`,\n },\n });\n return;\n } else if (topUp.value === \"Yes\" && (Number(topUpAmount.value) > Number(topUpCapAmount.value)) && (topUpFieldType === \"capAmount\")) {\n setFormValues({\n topUpCapAmount: {\n ...formValues[\"topUpCapAmount\"],\n isError: true,\n errorMessage: `CAP amount should be greater than the TOP-UP SIP amount`,\n },\n });\n } else {\n setIsLoading(true);\n const schemedetails = {\n i_scheme: schemeValue,\n i_plan: planValue,\n i_option: optionValue,\n sip_amt: others.Amount.value,\n i_disitributorid: props.token,\n i_EUINno: formValues.EUINNO.value === \"no\" ? formValues.EUIN.value.value : \"\",\n i_subBrokerCode: !!formValues[\"Sub Broker Code\"].value ? formValues[\"Sub Broker Code\"].value : \"\",\n i_subarncode: !!formValues[\"Sub ARN Code\"].value ? `ARN-${formValues[\"Sub ARN Code\"].value}` : \"\",\n i_frequency: others.Frequency.value,\n i_noofinst: others[\"No of Installments\"].value,\n i_sipstartdt: format(others[\"SIP Period From\"].value, \"MM/dd/yyyy\"),\n i_sipenddt: format(others[\"SIP Period To\"].value, \"MM/dd/yyyy\"),\n i_amount: props?.type === \"Lumpsum + SIP\" ? formValues[\"Lumpsum Amount\"].value : 0,\n i_paymode: formValues[\"Mode of Registration\"].value,\n i_umrno: formValues[\"UMRN\"]?.value?.UMRNNO,\n Topupflag: topUp.value === \"Yes\" ? \"Y\" : \"N\",\n TopupFrequency: topUp.value === \"Yes\" ? topUpFrequency.value === \"Yearly\" ? \"Y\" : \"H\" : \"\",\n TopupAmount: topUp.value === \"Yes\" ? topUpAmount.value : \"\",\n Topupmaxamount: (topUp.value === \"Yes\" && topUpFieldType === \"capAmount\") ? topUpCapAmount.value : \"\",\n TopupnoofInstallment: topUp.value === \"Yes\" ? topUpInstallments.value : \"\",\n TopupStartDate: topUp.value === \"Yes\" ? new Date(topUpStartDate.value).toLocaleString('en-US', {\n year: \"numeric\",\n month: \"2-digit\",\n day: \"2-digit\"\n }) : \"\",\n TopupEnddate: (topUp.value === \"Yes\" && topUpFieldType === \"endDate\") ? new Date(topUpEndDate.value).toLocaleString('en-US', {\n year: \"numeric\",\n month: \"2-digit\",\n day: \"2-digit\"\n }) : \"\",\n\n };\n const paramsSip = {\n ...props.applicantparams,\n ...props.investmentparams,\n ...props.fatcaDetails,\n ...schemedetails,\n ...props.nomineDetails,\n i_email: props.applicantparams.i_email === props.applicantparams.i_maskedEmail ? props.applicantparams.i_orignalEmail : props.applicantparams.i_email,\n i_mobileno: props.applicantparams.i_mobileno === props.applicantparams.i_maskedMobile ? props.applicantparams.i_orignalMobile : props.applicantparams.i_mobileno,\n i_trtype: props?.type === \"Lumpsum + SIP\" ? \"SIN\" : \"SINI\",\n i_appldt: format(new Date(), \"MM/dd/yyyy\"),\n i_chqdt: format(new Date(), \"MM/dd/yyyy\"),\n i_entby: props.userId,\n i_sipflag: \"Y\",\n Invdistflag: \"W\",\n CustomFund: \"105\",\n i_fund: \"105\",\n };\n try {\n\n const responseSip = await props.submitSipDetails(paramsSip);\n const { DtData } = responseSip;\n const { appno } = DtData[0];\n setIsLoading(false);\n dispatch(clearingFirstTimeInvestorJourney());\n setDialog({ appno: appno, open: true });\n } catch (err) {\n if (\n !!err\n ) {\n setIsLoading(false);\n }\n }\n\n }\n };\n const isTG = formValues?.schemeValue === \"TG\"\n\n const amountText = isTG ? \"₹ 500\" : \"₹ 100\";\n console.log(\"formvalues\", formValues)\n return (\n <>\n \n {section.map((field) => (\n \n {field.type === \"select\" ? (\n \n {formValues[field.listName].map((i, index) => (\n \n {i.label}\n \n ))}\n \n ) : field.type === \"Searchselect\" || field.type === \"radio\" ? (\n <>\n \n \n \n ) : field.type === \"Perpetual\" ? (\n
\n )}\n \n ) : (\n \n \n ({\n label: i.label,\n value: i.value,\n })\n )}\n value={formValues[field.name].value}\n placeholder={`Select ${field.name}`}\n handleChange={handleScheme(field.name)}\n disabled={field.disabled}\n isError={formValues[field.name].isError}\n errorMessage={formValues[field.name].errorMessage}\n />\n ) : (\n
\n {field.name === \"Amount\" && (\n Minimum Amount : ₹ {formValues.minimumAmount}\n )}\n \n ) : field.type === \"date\" ? (\n <>\n \n {field.name === \"Scheme\"\n ? Scheme*\n : field.name === \"EUIN\" &&\n formValues.EUINNO.value === \"no\"\n ? EUIN Selection*\n : field.name === \"EUIN\" &&\n formValues.EUINNO.value !== \"n0\"\n ? \"\"\n : \"\"}\n
\n {/* {field.name ===\n \"Do you want to intentionally leave the EUIN box blank?\" && (\n <>\n \n
\n YES
\n \n
\n \n \n )} */}\n {field.type !== \"radio\" &&\n (field.name !== \"EUIN\" ||\n formValues.EUINNO.value === \"no\" ? (\n NO
\n \n I/We hereby confirm that the EUIN box has been\n intentionally left the blank by me/us as this is an\n 'execution-only' transaction without any interaction\n or advice by any personnel of the above distributor\n or notwithstanding the advice of\n in-appropriateness,if any provided by any personnel\n of the distributor and the distributor has not\n charged any advisory fees on this transaction\n
\n ))}\n \n {field.name}\n *\n
\n\n \n {!!formValues[\"SIP Day\"].value && (\n \n \n Perpetual SIP\n
\n \n e.key === \".\" && e.preventDefault()}\n />\n \n {field.name === \"No of Installments\"\n ? `Minimum number of installments : ${formValues.MinimumInstallements}`\n : field.name === \"Amount\"\n ? `Minimum Amount : ${formValues.MinimumAmount}`\n : field.name === \"Lumpsum Amount\"\n ? `Minimum Lumpsum Amount : ${formValues.MinimumLumpsumAmount}`\n : null}\n \n
\n )}\n {formValues[\"UMRN\"]?.value && field.name === \"UMRN\" && (\n \n
\n )}\n {formValues[\"UMRN\"]?.value && field.name === \"UMRN\" && formValues?.umrnList.length === 1 && (\n The investor has only one active {formValues[\"Mode of Registration\"].value} mandate.\n )}\n\n \n ))}\n \n ))}\n {formValues[\"SIP Period From\"].value && (\n \n
\n Mandate amount limit
\n Start Date
\n End Date
\n Bank Name
\n Bank Account No
\n \n
\n \n {formValues[\"UMRN\"].value ? formValues[\"UMRN\"].value.Amt : \"\"}\n (INR)\n
\n \n {formValues[\"UMRN\"].value\n ? formValues[\"UMRN\"].value[\"MANDATE START DATE\"]\n : \"\"}{\" \"}\n
\n \n {formValues[\"UMRN\"].value\n ? formValues[\"UMRN\"].value[\"MANDATE END DATE\"]\n : \"\"}\n
\n \n {formValues[\"UMRN\"].value ? formValues[\"UMRN\"].value[\"BANK NAME\"] : \"\"}\n
{\" \"}\n \n {formValues[\"UMRN\"].value ? formValues[\"UMRN\"].value[\"BANK A/C NO\"] : \"\"}\n
\n \n \n TOP-UP DETAILS\n \n\n \n {\n const value = e.target.value;\n setFormValues({\n ...formValues,\n topUp: {\n ...formValues[\"topUp\"],\n value: value,\n },\n topUpFrequency: {\n ...formValues[\"topUpFrequency\"],\n value: \"Half-Yearly\",\n isMandatory: value === \"Yes\" ? true : false,\n },\n topUpAmount: {\n ...formValues[\"topUpAmount\"],\n value: \"\",\n isMandatory: value === \"Yes\" ? true : false,\n },\n topUpStartDate: {\n ...formValues[\"topUpStartDate\"],\n value: null,\n isMandatory: value === \"Yes\" ? true : false,\n },\n topUpEndDate: {\n ...formValues[\"topUpEndDate\"],\n value: null,\n isMandatory: value === \"Yes\" ? true : false,\n },\n });\n }}\n >\n {[\"Yes\", \"No\"].map((item) => {\n return (\n \n
\n )}\n\n {formValues[\"topUp\"].value === \"Yes\" && (\n \n TOP-UP *\n
\n \n
\n );\n })}\n \n {item}
\n \n {TopUpInputFields.others.map((field) => (\n \n {field.type === \"radio\" ? (\n \n \n {\n const value = e.target.value;\n setFormValues({\n topUpFrequency: {\n value: value,\n },\n });\n handleMinandMaxDate(field.listName, value)\n }}\n >\n {field.options.map((item) => {\n return (\n \n
\n ) : (\n \n {field.name}{\" \"}\n {field.isMandatory && (\n *\n )}\n
\n \n
\n );\n })}\n \n \n {item}\n
\n \n \n Minimum Amount : {amountText}\n \n )}\n
\n )}\n \n ))}\n \n \n {\n const value = e.target.value;\n if (value) {\n setFormValues({\n topUpCapAmount: { display: value === \"endDate\", value: null },\n topUpEndDate: { display: value !== \"endDate\", value: null },\n topUpFieldType: value,\n });\n } else {\n console.error(\"Unexpected value in onChange:\", e);\n }\n }}\n >\n \n
\n\n \n
\n End Date
\n \n
\n \n Cap Amount
\n \n {TopUpInputFields.dates.map((field) => (\n \n <>\n \n {field.name}{\" \"}\n {field.isMandatory && (\n *\n )}\n
\n\n \n \n history.replace(\"/new-investor-transaction/bank-details\")\n }\n >\n BACK\n \n \n SUBMIT\n \n
\n \n );\n};\n\nexport default connect(\n ({ authReducer, transactions, newinvestor }) => {\n const { token, userId } = authReducer;\n const { euinList } = transactions;\n const {\n schemeparams,\n schemeDetails,\n applicantparams,\n fatcaDetails,\n investmentparams,\n nomineDetails,\n } = newinvestor;\n return {\n token,\n userId,\n euinList,\n schemeparams,\n schemeDetails,\n applicantparams,\n investmentparams,\n fatcaDetails,\n nomineDetails,\n };\n },\n {\n getNewPurchaseFundList,\n validateSubBroker,\n swpOptions,\n CalcSIPEnddt,\n submitSipDetails,\n storeSchemeDetails,\n storeSchemeParams,\n getOtherSchemes,\n getCheckPanKotm,\n getNav,\n clearingFirstTimeInvestorJourney,\n getCheckPanAotm,\n getMinimumAmount\n }\n)(LummpsumSip);","import React, { useEffect, useState } from \"react\";\nimport Lumpsum from \"./Lumpsum\";\nimport LumpsumSip from \"./LumpsumSip\";\nimport {\n getNewPurchaseFundList,\n storeSchemeDetails,\n} from \"shared/store/actions\";\nimport {\n FormControl,\n RadioGroup,\n Radio,\n FormControlLabel,\n} from \"@material-ui/core\";\nimport { connect } from \"react-redux\";\n\nconst SchemeDetails = (props) => {\n const schemes = [\"Lumpsum\", \"SIP\", \"Lumpsum + SIP\"];\n const [scheme, setScheme] = useState(\"Lumpsum\");\n useEffect(() => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n }, []);\n return (\n <>\n \n \n Mode of Transaction *\n \n \n setScheme(e.target.value)}\n >\n {schemes.map((mode) => (\n \n
\n ))}\n \n \n \n {scheme === \"Lumpsum\" ? \n {mode === \"SIP\" ? \"SIP(Without Payment)\" : mode}\n
\n \n {error}\n
\n )}\n \n );\n};\n\nconst defaultChoiceOptions = [\n { name: \"Yes\", value: YES },\n { name: \"No\", value: NO },\n];\n\nexport const ChoiceField = ({\n value,\n onChange,\n options = defaultChoiceOptions,\n disabled,\n}) => {\n return (\n\n {options.map((o) => (\n
\n );\n};\n\nexport default AutoField;\n","import { default as React, useEffect, useState } from \"react\";\nimport { connect, useSelector } from \"react-redux\";\nimport { differenceInYears, format } from \"date-fns\";\n\nimport {\n Radio,\n RadioGroup,\n FormControl,\n FormControlLabel,\n} from \"@material-ui/core\";\nimport { KycNotDoneDialog } from \"../../customModal\";\nimport { NEW_TRANSACTION_URL } from \"..\";\nimport {\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n storePan,\n checkPAN,\n} from \"shared/store/actions\";\n\nimport {\n getFieldsFromMap,\n getFieldList,\n $wait,\n checkIfMinor,\n} from \"./lib/utils\";\n\nimport CardComponent from \"./lib/CardComponent\";\nimport CustomLoader from \"../../../forms/customLoader\";\nimport AutoField from \"./lib/AutoField\";\nimport {\n countryCodeRegex,\n emailRegex,\n mobileRegex,\n nameRegex,\n panRegex,\n categoryOptions,\n genderOptions,\n familyDescriptionOptions,\n relationshipOptions,\n countrycodeOptions,\n} from \".\";\nimport { BUILD_URL } from \"../../home\";\n\nconst YES = \"Yes\";\nconst INDIVIDUAL = \"individual\";\n\nconst investorOptions = [\n { name: \"Individual\", value: INDIVIDUAL },\n { name: \"Minor\", value: \"minor\" },\n];\n\nconst InvestorDetails = (props) => {\n // const { nomineesData, investors, token } = useSelector(\n // ({ NomineeReducer, investor, authReducer }) => ({\n // nomineesData: NomineeReducer,\n // investors: investor.investors,\n // token: authReducer.token,\n // })\n // );\n\n const [maskedMobile, setMaskedMobile] = useState(\"\");\n const [maskedEmail, setMaskedEmail] = useState(\"\");\n\n const [orignalMobile, setOrignalMobile] = useState(\"\");\n const [orignalEmail, setOrignalEmail] = useState(\"\");\n const SINGLE_APPLICANT = \"single\";\n\n const [investortype, setInvestorType] = useState({\n investorType: INDIVIDUAL,\n });\n\n const MAX_APPLICANTS = 3;\n\n const [disabledFields, setDisabledFields] = useState({});\n\n const validateSecondPan = (secondPan) => {\n const firstPan = formValues.pan_1;\n const thirdPan = formValues.pan_3;\n let error;\n if (firstPan === secondPan) {\n setFieldValue(\"pan_2\", \"\");\n error = \"PAN of Secondary Holder 1 should not be same as Primary Holder\";\n const id = document.getElementById(\"pan_2Field\");\n id.focus();\n } else if (secondPan.length > 3 && secondPan[3].toLowerCase() !== \"p\") {\n // setFieldValue(\"pan_2\", \"\");\n error =\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\";\n const id = document.getElementById(\"pan_2Field\");\n id.focus();\n } else if (secondPan === thirdPan) {\n setFieldValue(\"pan_3\", \"\");\n } else {\n const isValid = panRegex.test(secondPan || \"\");\n if (!isValid) {\n error = \"Please enter a valid PAN\";\n }\n }\n return error;\n };\n\n const validateThirdPan = (thirdPan) => {\n const firstPan = formValues.pan_1;\n const secondPan = formValues.pan_2;\n let error;\n if (firstPan === thirdPan) {\n setFieldValue(\"pan_3\", \"\");\n error =\n \"PAN of the Secondary Holder should not be same as Primary Holder\";\n const id = document.getElementById(\"pan_3Field\");\n id.focus();\n } else if (secondPan === thirdPan) {\n setFieldValue(\"pan_3\", \"\");\n error =\n \"PAN of the First Secondary Holder should not be same as Second Secondary Holder\";\n const id = document.getElementById(\"pan_3Field\");\n id.focus();\n } else if (thirdPan.length > 3 && thirdPan[3] !== \"P\") {\n // setFieldValue(\"pan_3\", \"\");\n error =\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\";\n const id = document.getElementById(\"pan_3Field\");\n id.focus();\n }\n if (!!thirdPan && !panRegex.test(thirdPan)) {\n error = \"Please enter a valid PAN\";\n }\n return error;\n };\n\n const applicantSchema = {\n pan: {\n name:\n investortype.investorType != \"minor\"\n ? \"PAN of Primary Holder\"\n : \"Minor PAN\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter PAN of First Applicant\",\n validate: panRegex,\n },\n name: {\n name:\n investortype.investorType != \"minor\"\n ? \"Name (As per PAN)\"\n : \"Minor Name (As per PAN)\",\n isRequired: true,\n placeholder: \"Enter Name\",\n validate: nameRegex,\n },\n emailFamily: {\n name: \"Email Family Description\",\n type: \"select\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n default: \"SE\",\n options: familyDescriptionOptions,\n },\n email: {\n name: \"Email ID\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter Email ID\",\n validate: emailRegex,\n },\n gender: {\n name: \"Gender\",\n type: \"select\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n options: genderOptions,\n },\n dob: {\n name: \"Date of Birth (As per PAN)\",\n type: \"date\",\n isRequired: true,\n },\n category: {\n name: \"Category\",\n type: \"select\",\n isRequired: true,\n options: categoryOptions,\n },\n countrycode: {\n name: \"Country Code\",\n isRequired: true,\n default: \"+91\",\n type: \"select\",\n options: countrycodeOptions,\n },\n\n mobileFamily: {\n name: \"Mobile Family Description\",\n type: \"select\",\n isRequired: true,\n default: \"SE\",\n options: familyDescriptionOptions,\n },\n mobile: {\n name: \"Mobile Number\",\n isRequired: true,\n placeholder: \"Enter Mobile Number\",\n validate: mobileRegex,\n },\n guardianname: {\n name: \"Guardian Name (As per PAN)\",\n isRequired: true,\n placeholder: \"Enter Guardian Name\",\n validate: nameRegex,\n hidden: true,\n },\n guardianpan: {\n name: \"Guardian PAN\",\n isRequired: true,\n placeholder: \"Enter PAN of First Applicant\",\n validate: panRegex,\n hidden: true,\n },\n guardiancategory: {\n name: \"Guardian Category\",\n type: \"select\",\n isRequired: true,\n options: categoryOptions,\n hidden: true,\n },\n\n guardianemailFamily: {\n name: \"Guardian Email Family Description\",\n type: \"select\",\n isRequired: true,\n default: \"SE\",\n options: familyDescriptionOptions,\n hidden: true,\n },\n guardianemail: {\n name: \"Guardian Email ID\",\n isRequired: true,\n placeholder: \"Enter Guardian Email ID\",\n validate: emailRegex,\n hidden: true,\n },\n guardianmobileFamily: {\n name: \"Guardian Mobile Family Description\",\n type: \"select\",\n isRequired: true,\n default: \"SE\",\n options: familyDescriptionOptions,\n hidden: true,\n },\n guardianmobile: {\n name: \"Guardian Mobile Number\",\n isRequired: true,\n placeholder: \"Enter Guardian Mobile Number\",\n validate: mobileRegex,\n hidden: true,\n },\n guardianRelationship: {\n name: \"Guardian Relationship with Minor\",\n type: \"select\",\n isRequired: true,\n options: relationshipOptions,\n hidden: true,\n },\n address1: {\n name: \"Address1\",\n isRequired: true,\n placeholder: \"Enter Address\",\n hidden: true,\n },\n address2: {\n name: \"Address2\",\n isRequired: true,\n placeholder: \"Enter Address\",\n hidden: true,\n },\n city: {\n name: \"City\",\n isRequired: true,\n placeholder: \"Enter City\",\n validate: nameRegex,\n hidden: true,\n },\n state: {\n name: \"State\",\n isRequired: false,\n placeholder: \"Enter State\",\n validate: nameRegex,\n hidden: true,\n },\n country: {\n name: \"Country\",\n isRequired: true,\n placeholder: \"Enter Country\",\n validate: nameRegex,\n hidden: true,\n },\n };\n\n const initialFormValues = {\n modeOfHolding: SINGLE_APPLICANT,\n kycCompleted_1: YES,\n };\n\n const allFieldsMax = getFieldList({\n ...getFieldsFromMap(\"\", applicantSchema, MAX_APPLICANTS),\n });\n\n for (let f of allFieldsMax) {\n initialFormValues[f.key] = initialFormValues[f.key] || f.default || \"\";\n }\n\n const [formValues, setFormValues] = useState(initialFormValues);\n const [errors, setErrors] = useState({});\n\n const showJointHolders = formValues.modeOfHolding !== SINGLE_APPLICANT;\n const noOfApplicants = showJointHolders ? 3 : 1;\n\n const applicantFields = getFieldsFromMap(\n \"\",\n applicantSchema,\n noOfApplicants,\n (field, i, k) => {\n if (i > 1) {\n if (k === \"category\") {\n field.hidden = true;\n }\n const pan2 = formValues[`pan_${i}`];\n const panNotFilled = !pan2 || errors[`pan_${i}`];\n if (k === \"pan\") {\n field.name =\n i === 2 ? \"PAN of Secondary Holder 1\" : \"PAN of Secondary Holder 2\";\n field.validate = validateSecondPan;\n } else if (panNotFilled) {\n field.hidden = true;\n }\n if (i > 2) {\n if (k == \"pan\") {\n if (formValues.pan_2 && !errors.pan_2) {\n field.hidden = false;\n field.validate = validateThirdPan;\n } else {\n field.hidden = true;\n field.validate = null;\n }\n field.isRequired = false;\n }\n }\n }\n const category = formValues[`category_${i}`];\n const nriFields = [\"address1\", \"address2\", \"state\", \"country\", \"city\"];\n const minorFields = [\n \"guardianname\",\n \"guardianpan\",\n \"guardiancategory\",\n \"guardianemailFamily\",\n \"guardianemail\",\n \"guardianmobileFamily\",\n \"guardianmobile\",\n \"guardianmobileFamily\",\n \"guardianRelationship\",\n ];\n if (category === \"20\") {\n const isNriField = nriFields.some((fieldName) => fieldName === k);\n if (!!isNriField) field.hidden = false;\n }\n if (investortype.investorType === \"minor\") {\n const isMinorFields = minorFields.some((fieldName) => fieldName === k);\n if (!!isMinorFields) field.hidden = false;\n }\n }\n );\n\n const validateField = async (field, value) => {\n const validate = field.validate;\n let fieldKey = \"\"\n let isValid = true;\n let errorMessage = \"\";\n if (!value && field.isRequired && !field.hidden) {\n errorMessage = `${field.name} is required to proceed.`;\n } else if (typeof validate == \"function\") {\n field.key.includes(\"nom_email\")\n ? (errorMessage = validate(field, value))\n : (errorMessage = validate(value));\n } else if (field.key === \"mobile_1\" && value === maskedMobile) {\n isValid = true;\n return;\n } else if (field.key === \"email_1\" && value === maskEmail) {\n isValid = true;\n return;\n } else if (typeof validate == \"object\" && field.isRequired) {\n const validationRegex = validate;\n isValid = validationRegex.test(value || \"\");\n if (isValid && field.key == \"email_1\") {\n isValid = value.includes(\".\") || value === orignalEmail;\n }\n if (!isValid && field.key == \"countrycode_1\") {\n isValid = value.length < 4;\n }\n if (\n isValid &&\n field.key === \"countrycode_1\" &&\n formValues.category_1 === \"20\" &&\n value === \"+91\"\n ) {\n isValid = false;\n }\n } else if (typeof validate == \"object\" && !!value) {\n const validationRegex = validate;\n isValid = validationRegex.test(value);\n }\n for (let i = 1; i <= 3; i++) {\n if (\n field.key === `countrycode_${i}` &&\n formValues[`category_${i}`] === \"11\"\n ) {\n isValid = value === \"+91\";\n break;\n }\n if (\n field.key === `email_${i}` && value === props.profileData.Email\n\n ) {\n isValid = false;\n errorMessage = \"Email id cannot be same as Distributor email\"\n break;\n }\n if (\n field.key === `mobile_${i}` && value === props.profileData.MobileNo\n\n ) {\n isValid = false;\n errorMessage = \"Mobile Number cannot be same as Distributor email\"\n\n break;\n }\n if (\n field.key === `pan_${i}` && value === props.profileData.PAN\n\n ) {\n isValid = false;\n errorMessage = \"PAN cannot be same as Distributor email\"\n\n break;\n }\n if (field.key === `email_${i}`) {\n if (formValues[`email_${i}`] && formValues[`email_${i}`].length > 0) {\n for (let j = 1; j <= 3; j++) {\n if (formValues[`email_${j}`] && formValues[`email_${j}`].length > 0 && formValues[`email_${i}`].toLowerCase() === formValues[`email_${j}`].toLowerCase() && i !== j && formValues[`emailFamily_${i}`].toLowerCase() === formValues[`emailFamily_${j}`].toLowerCase() ) {\n isValid = false;\n fieldKey = `emailFamily_${i}`;\n errorMessage = \"Please change the email flag because the email IDs are same\";\n break;\n }\n }\n }\n }\n if (field.key === `mobile_${i}`) {\n if (formValues[`mobile_${i}`] && formValues[`mobile_${i}`].length > 0) {\n for (let j = 1; j <= 3; j++) {\n if (formValues[`mobile_${j}`] && formValues[`mobile_${j}`].length > 0 && formValues[`mobile_${i}`] === formValues[`mobile_${j}`] && i !== j && formValues[`mobileFamily_${i}`] === formValues[`mobileFamily_${j}`]) {\n isValid = false;\n fieldKey = `mobileFamily_${i}`;\n errorMessage = \"Please change the mobile flag because the mobile number's are same\";\n break;\n }\n }\n }\n }\n }\n\n if (!isValid) {\n errorMessage = !!errorMessage ? errorMessage : `Please enter a valid ${field.name}`;\n }\n setFieldError((errorMessage === \"Please change the email flag because the email IDs are same\" || errorMessage === \"Please change the mobile flag because the mobile number's are same\" )? fieldKey : field.key, errorMessage);\n await $wait(10);\n if (errorMessage) {\n return { [field.key]: errorMessage };\n }\n\n if (!value && field.isRequired && !field.hidden) {\n errorMessage = `${field.name} is required to proceed.`;\n }\n if (typeof validate == \"function\") {\n field.key.includes(\"nom_email\")\n ? (errorMessage = validate(field, value))\n : (errorMessage = validate(value));\n } else if (typeof validate == \"object\" && field.isRequired) {\n const validationRegex = validate;\n isValid = validationRegex.test(value || \"\");\n } else if (typeof validate == \"object\" && !!value) {\n const validationRegex = validate;\n isValid = validationRegex.test(value);\n }\n if (!isValid) {\n errorMessage = `Please enter a valid ${field.name}`;\n }\n setFieldError(field.key, errorMessage);\n await $wait(10);\n if (errorMessage) {\n return { [field.key]: errorMessage };\n }\n };\n\n const [isLoading, setIsLoading] = useState(false);\n const [displayModal1, setDisplayModal1] = useState(false);\n const [displayModal2, setDisplayModal2] = useState(false);\n\n const [previouslyCheckedPAN, setPreviouslyCheckedPAN] = useState({\n pan_2: \"\",\n pan_3: \"\",\n });\n\n const applicantFieldList = getFieldList(applicantFields);\n\n const allFields = [...applicantFieldList];\n\n const removeJointHolderDetails = () => {\n try {\n const newFormValues = formValues;\n const jointHoldersFields = [...applicantFieldList];\n for (let f of jointHoldersFields) {\n if ([\"_2\", \"_3\"].some((num) => f.key.includes(num))) {\n delete newFormValues[f.key];\n }\n }\n setFormValues(newFormValues);\n } catch (error) {\n console.error(error);\n }\n };\n\n const prefillFormValues = async () => {\n const { location } = props;\n const { state } = location;\n\n if (!!state && !!state.pan && !props.applicantparams.i_fname) {\n const { pan } = state;\n setIsLoading(true);\n try {\n const kycResponse = await props.getKycDetails({ pan });\n const { DtData } = kycResponse;\n const kycDetails = DtData[0];\n for (let key in kycDetails) {\n const val = kycDetails[key];\n if (!val) {\n key === \"country\"\n ? (kycDetails[key] = \"India\")\n : (kycDetails[key] = \"\");\n }\n }\n\n const { name1, gender, dob, email, mobile, app_cat } = kycDetails;\n setOrignalMobile(mobile.trim());\n setOrignalEmail(email);\n\n let kycFormValues = {\n name_1: name1,\n pan_1: pan,\n };\n kycFormValues = {\n ...kycFormValues,\n dob_1:\n !!dob &&\n differenceInYears(\n new Date(),\n new Date(parseInt(dob.substr(6))),\n \"MM/dd/yyyy\"\n ) >= 18\n ? format(new Date(parseInt(dob.substr(6))), \"MM/dd/yyyy\")\n : \"\",\n email_1: email ? maskEmail(email) : email,\n orignalEmail: orignalEmail,\n maskedEmail: maskedEmail,\n\n orignalMobile: orignalMobile,\n maskedMobile: maskedMobile,\n\n gender_1: gender,\n mobile_1: mobile ? maskMobileNumber(mobile) : mobile,\n category_1: app_cat,\n status_1: +app_cat === 11 ? \"I\" : +app_cat > 20 ? \"N\" : \"\",\n }\n\n setMaskedEmail(maskEmail(email));\n setMaskedMobile(maskMobileNumber(mobile));\n setFormValues((prev) => {\n return { ...prev, ...kycFormValues };\n });\n setDisabledFields((prev) => {\n return {\n ...prev,\n pan_1: investortype.investorType != \"minor\" ? true : false,\n kycCompleted_1: true,\n status_1: true,\n // name_1: true ,\n };\n });\n } catch (err) {\n setFormValues((prev) => {\n return {\n ...prev,\n pan_1: pan,\n };\n });\n\n setDisabledFields((prev) => {\n return {\n ...prev,\n pan_1: true,\n kycCompleted_1: true,\n status_1: true,\n };\n });\n } finally {\n setIsLoading(false);\n }\n }\n };\n const gotoEkyc = () => {\n props.history.replace(BUILD_URL + \"/e-KYC\");\n };\n const checkReduxStore = async () => {\n const { applicantparams } = props;\n const {\n i_category,\n i_dob,\n i_email,\n i_email3,\n i_fname,\n i_invgender,\n i_mobileno,\n i_pangno,\n fEmailFlag,\n fMobileFlag,\n country_code,\n typeofinvestor,\n JHfEmailFlag1,\n JHfMobileFlag1,\n JHfEmailFlag2,\n JHfMobileFlag2,\n i_genMOH,\n i_pangno2,\n i_jholder1,\n i_invgender2,\n i_jh1dob,\n i_category2,\n i_mobileno2,\n i_pangno3,\n i_jholder2,\n i_email2,\n i_invgender3,\n i_jh2dob,\n i_category3,\n i_mobileno3,\n i_shnriadd1,\n i_shnriadd2,\n i_shnricity,\n i_shnristate,\n i_shnricountry,\n i_jhnriadd1,\n i_jhnriadd2,\n i_jhnricity,\n i_jhnristate,\n i_jhnricountry,\n i_nriadd1,\n i_nriadd2,\n i_nricity,\n i_nristate,\n i_nricountry,\n i_guardianname,\n i_guardianpan,\n i_guardiancategory,\n i_guadianmobile,\n i_guardianemail,\n i_guardianEmailFlag,\n i_guardianMobileFlag,\n i_guardianrelationship,\n i_orignalEmail,\n i_maskedEmail,\n i_orignalMobile,\n i_maskedMobile,\n } = applicantparams;\n if (!!props.applicantparams.i_fname) {\n setOrignalEmail(i_orignalEmail);\n setOrignalMobile(i_orignalMobile);\n setMaskedEmail(i_maskedEmail);\n setMaskedMobile(i_maskedMobile);\n setFormValues({\n ...formValues,\n [`name_1`]: i_fname,\n [`pan_1`]: i_pangno,\n [`dob_1`]: i_dob,\n [`gender_1`]: i_invgender,\n [`email_1`]: i_email,\n [`mobile_1`]: i_mobileno,\n [`category_1`]: i_category,\n [`emailFamily_1`]: fEmailFlag,\n [`mobileFamily_1`]: fMobileFlag,\n [`countrycode_1`]: country_code,\n [`modeOfHolding`]: i_genMOH === \"1\" ? \"single\" : \"anyone\",\n ...(!!i_pangno2 && {\n [`name_2`]: i_jholder1,\n [`pan_2`]: i_pangno2,\n [`dob_2`]: i_jh1dob,\n [`gender_2`]: i_invgender2,\n [`email_2`]: i_email2,\n [`mobile_2`]: i_mobileno2,\n [`category_2`]: i_category2,\n [`emailFamily_2`]: JHfEmailFlag1,\n [`mobileFamily_2`]: JHfMobileFlag1,\n }),\n ...(!!i_pangno3 && {\n [`name_3`]: i_jholder2,\n [`pan_3`]: i_pangno3,\n [`dob_3`]: i_jh2dob,\n [`gender_3`]: i_invgender3,\n [`email_3`]: i_email3,\n [`mobile_3`]: i_mobileno3,\n [`category_3`]: i_category3,\n [`emailFamily_3`]: JHfEmailFlag2,\n [`mobileFamily_3`]: JHfMobileFlag2,\n }),\n ...(i_category === \"20\" && {\n [`address1_1`]: i_nriadd1,\n [`address2_1`]: i_nriadd2,\n [`city_1`]: i_nricity,\n [`state_1`]: i_nristate,\n [`country_1`]: i_nricountry,\n }),\n ...(i_category2 === \"20\" && {\n [`address1_2`]: i_jhnriadd1,\n [`address2_2`]: i_jhnriadd2,\n [`city_2`]: i_jhnricity,\n [`state_2`]: i_jhnristate,\n [`country_2`]: i_jhnricountry,\n }),\n ...(i_category3 === \"20\" && {\n [`address1_3`]: i_shnriadd1,\n [`address2_3`]: i_shnriadd2,\n [`city_3`]: i_shnricity,\n [`state_3`]: i_shnristate,\n [`country_3`]: i_shnricountry,\n }),\n ...(typeofinvestor === \"M\" && {\n [`guardianname_1`]: i_guardianname,\n [`guardianpan_1`]: i_guardianpan,\n [`guardiancategory_1`]: i_guardiancategory,\n [`guardianmobile_1`]: i_guadianmobile,\n [`guardianemail_1`]: i_guardianemail,\n [`guardianemailFamily_1`]: i_guardianEmailFlag,\n [`guardianmobileFamily_1`]: i_guardianMobileFlag,\n [`guardianRelationship_1`]: i_guardianrelationship,\n }),\n });\n setDisabledFields((prev) => {\n return {\n ...prev,\n pan_1: true,\n // name_1: true,\n };\n });\n setInvestorType({\n investorType: typeofinvestor === \"M\" ? \"minor\" : \"individual\",\n });\n }\n };\n const firstRender = async () => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n if (!!props.location.state) {\n props.storePan(props.location.state.pan);\n }\n await prefillFormValues();\n await checkReduxStore();\n };\n useEffect(() => {\n firstRender();\n }, []);\n const handleInvestor = async (e) => {\n setInvestorType({ investorType: e.target.value });\n if (e.target.value === \"minor\") {\n setFormValues((prev) => {\n return {\n ...prev,\n [\"guardianpan_1\"]: props.store_pan,\n [\"guardianname_1\"]: formValues.name_1,\n [\"guardianemail_1\"]: formValues.email_1,\n [\"guardianmobile_1\"]: formValues.mobile_1,\n [`modeOfHolding`]: SINGLE_APPLICANT,\n [`name_1`]: \"\",\n [`pan_1`]: \"\",\n [`dob_1`]: \"\",\n [`gender_1`]: \"\",\n [`email_1`]: \"\",\n [`mobile_1`]: \"\",\n [`category_1`]: \"\",\n [`emailFamily_1`]: \"\",\n [`mobileFamily_1`]: \"\",\n };\n });\n }\n setDisabledFields((prev) => {\n return {\n ...prev,\n pan_1:\n e.target.value === \"individual\" && formValues.pan_1.length === 10\n ? true\n : false,\n };\n });\n };\n\n const convertDateFormat = (originalDate) => {\n const [month, day, year] = originalDate.split(\"/\");\n\n const convertedDate = `${day}/${month}/${year}`;\n\n return convertedDate;\n };\n\n const submit = async () => {\n try {\n setIsLoading(true);\n const errors = [];\n\n for (let field of allFields) {\n const error = await validateField(field, formValues[field.key]);\n if (error) {\n errors.push(error);\n }\n }\n const isValid = errors.filter((e) => !!e).length === 0;\n const getStatus = (category) => (category === \"20\" ? \"NRI\" : \"RI\");\n const getInvStatus = (category) =>\n !!category ? getStatus(category) : \"\";\n\n if (!!isValid) {\n const payload = {\n pan: formValues.pan_1,\n PanName: formValues.name_1,\n PanDOB: !!formValues.dob_1\n ? convertDateFormat(formValues.dob_1)\n : formValues.dob_1,\n folio: \"\",\n trType: \"New\",\n fund: \"105\",\n scheme: \"\",\n plan: \"\",\n guardianPan: formValues.guardianpan_1,\n guardianPanDOB: \"\",\n guardianPanName: formValues.guardianname_1,\n jointHolder1Pan: formValues.pan_2,\n jointHolder1PanName: formValues.name_2,\n jointHolder1PanDOB: !!formValues.dob_2\n ? convertDateFormat(formValues.dob_2)\n : formValues.dob_2,\n jointHolder2Pan: formValues.pan_3,\n jointHolder2PanName: formValues.name_3,\n jointHolder2PanDOB: !!formValues.dob_3\n ? convertDateFormat(formValues.dob_3)\n : formValues.dob_3,\n invStatus: getInvStatus(formValues.category_1),\n JH1_invStatus: getInvStatus(formValues.category_2),\n JH2_invStatus: getInvStatus(formValues.category_3),\n G_invStatus: getInvStatus(formValues.guardiancategory_1),\n };\n const response = await props.checkPAN(payload);\n validateResponse(response);\n const ApplicantDetails = {\n i_Ckyc1: formValues.kycCompleted_1,\n i_category: formValues.category_1,\n i_dob: formValues.dob_1,\n i_email: formValues.email_1,\n i_orignalEmail: orignalEmail,\n i_maskedEmail: maskedEmail,\n\n i_orignalMobile: orignalMobile,\n i_maskedMobile: maskedMobile,\n\n i_fname: formValues.name_1,\n i_invgender: formValues.gender_1,\n i_mobileno: formValues.mobile_1,\n i_pangno: formValues.pan_1,\n fEmailFlag: formValues.emailFamily_1,\n fMobileFlag: formValues.mobileFamily_1,\n typeofinvestor:\n investortype.investorType === \"individual\" ? \"I\" : \"M\",\n i_genMOH: formValues.modeOfHolding === \"single\" ? \"1\" : \"4\",\n country_code: formValues.countrycode_1,\n ...(formValues.category_1 === \"20\" && {\n i_nriadd1: formValues.address1_1,\n i_nriadd2: formValues.address2_1,\n i_nricity: formValues.city_1,\n i_nristate: formValues.state_1,\n i_nricountry: formValues.country_1,\n }),\n ...(formValues.category_2 === \"20\" && {\n i_jhnriadd1: formValues.address1_2,\n i_jhnriadd2: formValues.address2_2,\n i_jhnricity: formValues.city_2,\n i_jhnristate: formValues.state_2,\n i_jhnricountry: formValues.country_2,\n }),\n ...(formValues.category_3 === \"20\" && {\n i_shnriadd1: formValues.address1_3,\n i_shnriadd2: formValues.address2_3,\n i_shnricity: formValues.city_3,\n i_shnristate: formValues.state_3,\n i_shnricountry: formValues.country_3,\n }),\n\n ...(formValues.modeOfHolding === \"anyone\" &&\n formValues.pan_2.length === 10 && {\n i_pangno2: formValues.pan_2,\n i_jholder1: formValues.name_2,\n i_email2: formValues.email_2,\n JHfEmailFlag1: formValues.emailFamily_2,\n JHfMobileFlag1: formValues.mobileFamily_2,\n i_invgender2: formValues.gender_2,\n i_jh1dob: formValues.dob_2,\n i_category2: formValues.category_2,\n i_mobileno2: formValues.mobile_2,\n JHcountry_code1: formValues.countrycode_2,\n }),\n ...(formValues.modeOfHolding === \"anyone\" &&\n formValues.pan_3.length === 10 && {\n i_pangno3: formValues.pan_3,\n i_jholder2: formValues.name_3,\n i_email3: formValues.email_3,\n JHfEmailFlag2: formValues.emailFamily_3,\n JHfMobileFlag2: formValues.mobileFamily_3,\n i_invgender3: formValues.gender_3,\n i_jh2dob: formValues.dob_3,\n i_category3: formValues.category_3,\n i_mobileno3: formValues.mobile_3,\n JHcountry_code2: formValues.countrycode_3,\n }),\n ...(investortype.investorType === \"minor\" && {\n i_guardianname: formValues.guardianname_1,\n i_guardianpan: formValues.guardianpan_1,\n guard_category: formValues.guardiancategory_1,\n i_guadianmobile: formValues.guardianmobile_1,\n i_guardianemail: formValues.guardianemail_1,\n i_guardianEmailFlag: formValues.guardianemailFamily_1,\n i_guardianMobileFlag: formValues.guardianmobileFamily_1,\n i_guardianrelationship: formValues.guardianRelationship_1,\n }),\n };\n if (isValid) {\n props.storeApplicantParams(ApplicantDetails);\n props.history.push({\n pathname: BUILD_URL+\"/new-investor-transaction/fatca-details\",\n state: { nriCountry: formValues.country_1 },\n });\n } else {\n const id = Object.keys(errors[0])[0] + \"Field\";\n const element = document.getElementById(id);\n element.focus();\n setIsLoading(false);\n }\n }\n setIsLoading(false);\n } catch (error) {\n alert(error.message);\n setIsLoading(false);\n }\n };\n // End of Sumbit, thank you, visit again.\n function validateResponse(response) {\n if (response.Transaction_allow === \"N\") {\n if (response.PASFlag === \"N\") {\n throw new Error(response.PASRemarks);\n }\n if (response.PANFlag === \"N\") {\n throw new Error(response.PANRemarks);\n }\n if (response.PANNameMatch === \"N\") {\n throw new Error(\"Entered Primary holder name does not match with PAN record\");\n }\n if (response.JH1_panFlag === \"N\") {\n throw new Error(response.JH1_panRemarks);\n }\n if (response.JH2_panFlag === \"N\") {\n throw new Error(response.JH2_panRemarks);\n }\n if (response.G_panFlag === \"N\") {\n throw new Error(response.G_panRemarks);\n }\n if (response.JH1_PANNameMatch === \"N\") {\n throw new Error(\n \"Entered Secondary Holder 1 name does not match with PAN record\"\n );\n }\n if (response.JH2_PANNameMatch === \"N\") {\n throw new Error(\n \"Entered Secondary Holder 2 name name does not match with PAN record\"\n );\n }\n if (response.G_PANNameMatch === \"N\") {\n throw new Error(\"Entered Guadian name does not match with PAN record\");\n }\n if (response.PanDOBMatch === \"N\") {\n throw new Error(\"Entered Primay DOB does not match with PAN record\");\n }\n if (response.JH1_PanDOBMatch === \"N\") {\n throw new Error(\n \"Entered Secondary Holder 1 DOB does not match with PAN record\"\n );\n }\n if (response.JH2_PanDOBMatch === \"N\") {\n throw new Error(\n \"Entered Secondary Holder 2 DOB name does not match with PAN record\"\n );\n }\n if (response.G_PanDOBMatch === \"N\") {\n throw new Error(\"Entered Guadian DOB does not match with PAN record\");\n }\n }\n }\n\n const setFieldValue = (field_key, value) => {\n const cleanedValue = value.replace(/\\s+/g, \" \");\n setFormValues((values) => ({\n ...values,\n [field_key]: cleanedValue,\n }));\n };\n\n const setFieldError = (field_key, errorMessage) => {\n setErrors((errors) => ({\n ...errors,\n [field_key]: errorMessage,\n }));\n };\n\n const handleChange = (field) => {\n return (e) => {\n const value =\n typeof e == \"string\"\n ? e\n : field.type === \"date\"\n ? format(new Date(e), \"MM/dd/yyyy\")\n : field.key.includes(\"pan\")\n ? e.target.value.toUpperCase()\n : (e.target && e.target.value) || \"\";\n if (field.key.includes(\"category\")) {\n let countryCode = \"+91\";\n const status = +value === 11 ? \"I\" : +value === 20 ? \"N\" : \"\";\n const key = field.key.replace(\"category\", \"status\");\n setFieldValue(key, status);\n if (String(value) === \"20\") {\n countryCode = \"\";\n }\n\n const countryCodeKey = field.key.replace(\"category\", \"countrycode\");\n setFieldValue(countryCodeKey, countryCode);\n }\n setFieldValue(field.key, value);\n validateField(field, value)\n .then((error) => {\n if (\n field.key.includes(\"pan\") &&\n value &&\n value.length === 10 &&\n !error\n ) {\n const id = field.key + \"Field\";\n const element = document.getElementById(id);\n element.blur();\n getKycStatus(field)({ target: { value } });\n }\n })\n .catch((err) => {\n console.error(err);\n setFieldValue(field.key, \"\");\n });\n };\n };\n\n const handleBlur = (field) => {\n return async (e) => {\n const value =\n typeof e == \"string\" ? e : (e.target && e.target.value) || \"\";\n const error = await validateField(field, value);\n if (error) {\n setFieldValue(field.key, \"\");\n }\n };\n };\n\n const getKycStatus = (field) => async (e) => {\n const value = e.target.value;\n const n = field.key.split(\"_\")[1];\n if (field.key != \"guardianpan_1\") {\n setIsLoading(true);\n try {\n const error = await validateField(field, value);\n\n if (error) {\n return;\n }\n\n const response = await props.checkKyc({\n fund: \"105\",\n userid: props.userId,\n i_pan: value,\n });\n const {\n DtData: [info],\n } = response;\n if (info.KYCBlock !== \"N\") {\n +n === 2 ? setDisplayModal1(true) : setDisplayModal2(true);\n setPreviouslyCheckedPAN((val) => ({ ...val, [field.key]: \"\" }));\n return;\n }\n const kycDetails = await props.getKycDetails({ pan: value });\n const { DtData } = kycDetails;\n const {\n name1,\n gender,\n app_pangno,\n app_occ,\n dob,\n email,\n mobile,\n app_cat,\n } = DtData[0];\n const kycFormValues = {\n [`name_${n}`]: name1,\n [`pan_${n}`]: app_pangno,\n // [`dob_${n}`]: !!dob\n // ? format(new Date(parseInt(dob.substr(6))), \"MM/dd/yyyy\")\n // : \"\",\n // [`gender_${n}`]: gender,\n // [`email_${n}`]: email,\n // [`mobile_${n}`]: mobile,\n // [`kyc_occupation_${n}`]: app_occ,\n // [`category_${n}`]: app_cat,\n // [`status_${n}`]: +app_cat === 11 ? \"I\" : +app_cat > 20 ? \"N\" : \"\",\n };\n\n setFormValues((prev) => {\n return {\n ...prev,\n ...kycFormValues,\n };\n });\n setDisabledFields((prev) => {\n return {\n ...prev,\n [`kycCompleted_${n}`]: true,\n [`status_${n}`]: true,\n // [`name_${n}`]: true,\n };\n });\n } catch (error) {\n setFormValues((prev) => {\n return {\n ...prev,\n [`name_${n}`]: \"\",\n [`dob_${n}`]: \"\",\n [`email_${n}`]: \"\",\n [`mobile_${n}`]: \"\",\n [`kyc_occupation_${n}`]: \"\",\n [`category_${n}`]: \"\",\n [`status_${n}`]: \"\",\n };\n });\n\n setDisabledFields((prev) => {\n return {\n ...prev,\n [`kycCompleted_${n}`]: true,\n [`status_${n}`]: true,\n };\n });\n } finally {\n setIsLoading(false);\n }\n }\n };\n\n const isMinor = investortype.investorType == \"minor\";\n return (\n <>\n \n {\n const newValue = o.value;\n onChange({ target: { value: newValue } });\n }}\n />\n
\n ))}\n \n {o.name}\n
\n\n \n {/*
\n \n Type of Investor:
\n\n handleInvestor(e)}\n />\n
*/}\n\n {!isMinor && (\n <>\n \n \n {\n if (formValues.modeOfHolding !== e.target.value) {\n removeJointHolderDetails();\n }\n setFieldValue(\"modeOfHolding\", e.target.value);\n }}\n >\n \n
\n \n )}\n \n Mode of Holding*\n
\n \n
\n Single
\n \n
\n \n \n Anyone (or) Surviour\n
\n \n {applicantFieldList.map((field) => {\n return (\n \n \n );\n })}\n
\n \n {\n props.history.push({\n pathname: NEW_TRANSACTION_URL,\n state: { nriCountry: formValues.country_1 },\n });\n }}\n >\n Back\n \n \n Proceed\n \n
\n \n );\n};\nexport default connect(\n ({ newinvestor, authReducer, profileReducer }) => {\n const { applicantparams, store_pan } = newinvestor;\n const { userId } = authReducer;\n const { profileData } = profileReducer;\n\n return {\n applicantparams,\n store_pan,\n userId,\n profileData\n };\n },\n {\n checkPAN,\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n storePan,\n }\n)(InvestorDetails);\n\nfunction ChoiceFieldforinvestor({ value, options, onChange }) {\n return (\n \n {options.map((o, i) => {\n const isActive = o.value == value;\n const handleClick = () => {\n const newValue = o.value;\n onChange({ target: { value: newValue } });\n };\n const isFirst = i == 0;\n const isLast = i == options.length - 1;\n const radius = \"6px\";\n return (\n
\n );\n })}\n \n );\n}\nconst maskMobileNumber = (mobileNumber) => {\n if (!mobileNumber) {\n return \"\";\n }\n return mobileNumber.replace(/\\d(?=\\d{4})/g, \"x\").replace(\"+\", \"x\");\n};\nconst maskEmail = (email) => {\n if (!email) return '';\n let parts = email.split('@');\n parts[0] = parts[0].slice(0, -3).replace(/\\w/g, 'x') + parts[0].slice(-3);\n return parts[0] + '@' + parts[1];\n};","import React, { useState, useEffect } from \"react\";\nimport CardComponent from \"./lib/CardComponent\";\nimport { connect } from \"react-redux\";\nimport CustomizedSelect from \"../customizedSelect\";\nimport { Input } from \"../../../forms/input\";\nimport { Checkbox } from \"@material-ui/core\";\nimport {\n MuiPickersUtilsProvider,\n KeyboardDatePicker,\n} from \"@material-ui/pickers\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport {\n genderOptions,\n NomineesList,\n panRegex,\n emailRegex,\n nameRegex,\n} from \".\";\nimport { KycNotDoneDialog } from \"../../customModal\";\nimport { $wait, checkIfMinor } from \"./lib/utils\";\n// import CustomLoader from \"../../../forms/Loader\";\nimport CustomLoader from \"../../../forms/customLoader\";\nimport {\n storeNomineeDetails,\n storeApplicantParams,\n getKycDetails,\n getRelationShipList,\n getNomineeDetails,\n getCountriesList,\n} from\"shared/store/actions\";\nimport { format } from \"date-fns\";\n\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport { BUILD_URL } from \"../../home\";\n\nconst NomineeDetails = (props) => {\n const first_nominee_details = {\n name: { value: \"\" },\n pan: { value: \"\" },\n relationship: { value: \"\" },\n otherrelationship: { value: \"\" },\n dob: { value: \"\" },\n gender: { value: \"\" },\n percentage: { value: \"100\" },\n email: { value: \"\" },\n address: { value: \"\" },\n country: { value: \"\" },\n state: { value: \"\" },\n city: { value: \"\" },\n pincode: { value: \"\" },\n gaurdianname: { value: \"\" },\n gaurdianpan: { value: \"\" },\n gaurdianrelationship: { value: \"\" },\n };\n const second_nominee_details = {\n name: { value: \"\" },\n pan: { value: \"\" },\n relationship: { value: \"\" },\n otherrelationship: { value: \"\" },\n dob: { value: \"\" },\n gender: { value: \"\" },\n percentage: { value: \"100\" },\n email: { value: \"\" },\n address: { value: \"\" },\n country: { value: \"\" },\n state: { value: \"\" },\n city: { value: \"\" },\n pincode: { value: \"\" },\n gaurdianname: { value: \"\" },\n gaurdianpan: { value: \"\" },\n gaurdianrelationship: { value: \"\" },\n };\n const third_nominee_details = {\n name: { value: \"\" },\n pan: { value: \"\" },\n relationship: { value: \"\" },\n otherrelationship: { value: \"\" },\n dob: { value: \"\" },\n gender: { value: \"\" },\n percentage: { value: \"100\" },\n email: { value: \"\" },\n address: { value: \"\" },\n country: { value: \"\" },\n state: { value: \"\" },\n city: { value: \"\" },\n pincode: { value: \"\" },\n gaurdianname: { value: \"\" },\n gaurdianpan: { value: \"\" },\n gaurdianrelationship: { value: \"\" },\n };\n const [isLoading, setIsLoading] = useState(false);\n const [NomineeListShow, setIsNomineeListShow] = useState(true);\n const [openModal, setOpenModal] = useState(false);\n\n const [nominate_yes_or_no, setnominate_yes_or_no] = useState(false);\n const [countriesList, setcountriesList] = useState([]);\n const [nominees_selected, setnomineeSelected] = useState({\n nominee_selected1: \"\",\n nominee_selected2: \"\",\n nominee_selected3: \"\",\n });\n const [nomineeList, setnomineeList] = useState([]);\n const [relationshipList, setrelationshipList] = useState([]);\n const [same_as_first_appicant_address, setsame_as_first_appicant_address] =\n useState(false);\n const list = \"1\";\n const [nominee_dateofbirth, setnominee_dateofbirth] = useState({\n first_nominee_dateofbirth: false,\n second_nominee_dateofbirth: false,\n third_nominee_dateofbirth: false,\n });\n const [nominee_list, setnominee_list] = useState(list);\n const [first_nomineeDetails, setfirst_nomineeDetails] = useState(\n first_nominee_details\n );\n const [second_nomineeDetails, setsecond_nomineeDetails] = useState(\n second_nominee_details\n );\n const [third_nomineeDetails, setthird_nomineeDetails] = useState(\n third_nominee_details\n ); \n const [inputLabel, setInputLabel] = useState('');\n const prefillFormValues = async () => {\n setIsLoading(true);\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n address: { value: !!props.address.address ? props.address.address : \"\" },\n country: { value: !!props.address.country ? props.address.country : \"\" },\n state: { value: !!props.address.state ? props.address.state : \"\" },\n pincode: { value: !!props.address.pincode ? props.address.pincode : \"\" },\n city: { value: !!props.address.city ? props.address.city : \"\" },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n address: { value: !!props.address.address ? props.address.address : \"\" },\n country: { value: !!props.address.country ? props.address.country : \"\" },\n state: { value: !!props.address.state ? props.address.state : \"\" },\n pincode: { value: !!props.address.pincode ? props.address.pincode : \"\" },\n city: { value: !!props.address.city ? props.address.city : \"\" },\n });\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n address: { value: !!props.address.address ? props.address.address : \"\" },\n country: { value: !!props.address.country ? props.address.country : \"\" },\n state: { value: !!props.address.state ? props.address.state : \"\" },\n pincode: { value: !!props.address.pincode ? props.address.pincode : \"\" },\n city: { value: !!props.address.city ? props.address.city : \"\" },\n });\n setIsLoading(false);\n };\n const handleAddress = () => {\n setsame_as_first_appicant_address(!same_as_first_appicant_address);\n if (same_as_first_appicant_address == false) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n address: { value: props.address.address ? props.address.address : \"\" },\n country: {\n value: !!props.address.country ? props.address.country : \"\",\n },\n state: { value: !!props.address.state ? props.address.state : \"\" },\n pincode: {\n value: !!props.address.pincode ? props.address.pincode : \"\",\n },\n city: { value: !!props.address.city ? props.address.city : \"\" },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n address: { value: props.address.address ? props.address.address : \"\" },\n country: {\n value: !!props.address.country ? props.address.country : \"\",\n },\n state: { value: !!props.address.state ? props.address.state : \"\" },\n pincode: {\n value: !!props.address.pincode ? props.address.pincode : \"\",\n },\n city: { value: !!props.address.city ? props.address.city : \"\" },\n });\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n address: { value: props.address.address ? props.address.address : \"\" },\n country: {\n value: !!props.address.country ? props.address.country : \"\",\n },\n state: { value: !!props.address.state ? props.address.state : \"\" },\n pincode: {\n value: !!props.address.pincode ? props.address.pincode : \"\",\n },\n city: { value: !!props.address.city ? props.address.city : \"\" },\n });\n } else {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n address: { value: \"\" },\n country: { value: \"\" },\n state: { value: \"\" },\n pincode: { value: \"\" },\n city: { value: \"\" },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n address: { value: \"\" },\n country: { value: \"\" },\n state: { value: \"\" },\n pincode: { value: \"\" },\n city: { value: \"\" },\n });\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n address: { value: \"\" },\n country: { value: \"\" },\n state: { value: \"\" },\n pincode: { value: \"\" },\n city: { value: \"\" },\n });\n }\n };\n const handleChangeNomineeList = async (event) => {\n const value = event.target.value;\n setnominee_list(event.target.value);\n if (value == \"1\") {\n setIsLoading(true);\n await $wait(10);\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage: { value: \"100\" },\n });\n setIsLoading(false);\n }\n if (value == \"2\") {\n setIsLoading(true);\n await $wait(10);\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage: { value: \"50\" },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n percentage: { value: \"50\" },\n });\n setIsLoading(false);\n }\n if (value == \"3\") {\n setIsLoading(true);\n await $wait(10);\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage: { value: \"33.3\" },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n percentage: { value: \"33.3\" },\n });\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n percentage: { value: \"33.4\" },\n });\n setIsLoading(false);\n }\n };\n useEffect(() => {\n firstRender();\n }, []);\n const firstRender = async () => {\n await getLists();\n checkReduxStore();\n };\n useEffect(() => {\n nomineelist();\n prefillFormValues();\n }, [nomineeList.length === 1]);\n useEffect(() => {\n secondRender()\n }, [nomineeList.length >= 2]);\n useEffect(() => {\n const guardianPANs = [\n first_nomineeDetails.gaurdianpan.value,\n second_nomineeDetails.gaurdianpan.value,\n third_nomineeDetails.gaurdianpan.value,\n ];\n const investorAsGuardianCount = guardianPANs.filter(pan => pan === props.store_pan).length;\n if (investorAsGuardianCount > 1) {\n alert(\"PAN cannot be both Primary & Guardian PAN for multiple nominees.\");\n switch(inputLabel) {\n case \"firstNomineeGuardianPan\":\n setfirst_nomineeDetails(prevDetails => ({...prevDetails, gaurdianpan: { value: \"\" }}));\n break;\n case \"secondNomineeGuardianPan\":\n setsecond_nomineeDetails(prevDetails => ({...prevDetails, gaurdianpan: { value: \"\" }}));\n break;\n case \"thirdNomineeGuardianPan\":\n setthird_nomineeDetails(prevDetails => ({...prevDetails, gaurdianpan: { value: \"\" }}));\n break;\n default:\n break;\n }\n }\n }, [first_nomineeDetails, second_nomineeDetails, third_nomineeDetails, inputLabel, props.store_pan]); \n const secondRender =async()=>{\n if(!first_nomineeDetails.name.value){\n await prefill_nomineelist();\n }\n }\n const prefill_nomineelist = async () => {\n setIsLoading(true);\n const nomineeone_details = props?.getnomineeDetails?.Dtinformation?.[0] \n const nomineetwo_details = props?.getnomineeDetails?.Dtinformation?.[1]\n const nomineethree_details = props?.getnomineeDetails?.Dtinformation?.[2] \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n name: { value: nomineeone_details?.Nom1 },\n relationship: {\n value:\n nomineeone_details?.Nom1Relation.charAt(0).toUpperCase() +\n nomineeone_details?.Nom1Relation.substr(1).toLowerCase(),\n },\n dob: { value: nomineeone_details?.Nom1_Dob },\n gender: { value: nomineeone_details?.Nom1_Gender === \"Male\" ? \"M\" : nomineeone_details?.Nom1_Gender === \"Female\" ? \"F\":null },\n address: {\n value:\n nomineeone_details?.Nom1_Add1 +\n nomineeone_details?.Nom1_Add2 +\n nomineeone_details?.Nom1_Add3,\n },\n percentage:{value:nomineeone_details?.NomPer1},\n // country: { value: nomineeone_details?.Nom1_Country },\n state: { value: nomineeone_details?.Nom1_state },\n pincode: { value: nomineeone_details?.Nom1_pin },\n city: { value: nomineeone_details?.Nom1_City },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n name: { value: nomineetwo_details?.Nom1 },\n relationship: {\n value:\n nomineetwo_details?.Nom1Relation.charAt(0).toUpperCase() +\n nomineetwo_details?.Nom1Relation.substr(1).toLowerCase(),\n },\n dob: { value: nomineetwo_details?.Nom1_Dob },\n gender: { value: nomineetwo_details?.Nom1_Gender === \"Male\" ? \"M\" : nomineeone_details?.Nom1_Gender === \"Female\" ? \"F\":null },\n address: {\n value:\n nomineetwo_details?.Nom1_Add1 +\n nomineetwo_details?.Nom1_Add2 +\n nomineetwo_details?.Nom1_Add3,\n },\n percentage:{value:nomineeone_details?.NomPer2},\n // country: { value: nomineetwo_details?.Nom1_Country },\n state: { value: nomineetwo_details?.Nom1_state },\n pincode: { value: nomineetwo_details?.Nom1_pin },\n city: { value: nomineetwo_details?.Nom1_City },\n });\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n name: { value: nomineethree_details?.Nom1 },\n relationship: {\n value:\n nomineethree_details?.Nom1Relation.charAt(0).toUpperCase() +\n nomineethree_details?.Nom1Relation.substr(1).toLowerCase(),\n },\n dob: { value: nomineethree_details?.Nom1_Dob },\n gender: { value: nomineethree_details?.Nom1_Gender === \"Male\" ? \"M\" : nomineeone_details?.Nom1_Gender === \"Female\" ? \"F\":null },\n address: {\n value:\n nomineethree_details?.Nom1_Add1 +\n nomineethree_details?.Nom1_Add2 +\n nomineethree_details?.Nom1_Add3,\n },\n percentage:{value:nomineeone_details?.NomPer3},\n // country: { value: nomineethree_details?.Nom1_Country },\n state: { value: nomineethree_details?.Nom1_state },\n pincode: { value: nomineethree_details?.Nom1_pin },\n city: { value: nomineethree_details?.Nom1_City },\n });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected1: nomineeone_details?.Nom1 ,\n nominee_selected2: nomineetwo_details?.Nom1 ,\n nominee_selected3: nomineethree_details?.Nom1 ,\n });\n setnominee_list(!!nomineethree_details?.Nom1?\"3\":!!nomineetwo_details?.Nom1?\"2\":!!nomineeone_details?.Nom1?\"1\":null);\n setIsLoading(false);\n };\n const nomineelist = async () => {\n await NomineeDetails();\n };\n const checkReduxStore = () => {\n if(!!props.nomineDetails.nominate_yes_or_no){\n setnominate_yes_or_no(true)\n } else if (!!props.nomineDetails && !!props.nomineDetails.i_nominee) {\n const { nomineDetails } = props;\n const {\n i_nominee,\n i_nominee2,\n i_nominee3,\n i_nompan1,\n i_nompan2,\n i_nompan3,\n i_NomRelation,\n i_NomRelation2,\n i_NomRelation3,\n i_NomDOB,\n i_NomDOB2,\n i_NomDOB3,\n nom1gender,\n nom2gender,\n nom3gender,\n i_Nominee1percentage,\n i_Nominee2percentage,\n i_Nominee3percentage,\n nom1email,\n nom2email,\n nom3email,\n i_nomadd1,\n i_nomadd21,\n i_nomadd31,\n i_nomcountry,\n i_nom2country,\n i_nom3country,\n i_nomstate,\n i_nomstate2,\n i_nomstate3,\n i_nomcity,\n i_nomcity2,\n i_nomcity3,\n i_nompin,\n i_nompin2,\n i_nompin3,\n i_nomguardianname1,\n i_nomguardianname3,\n i_nomguardianpan1,\n i_nomguardianpan3,\n i_nomguardianname2,\n i_namguardianrelationship1,\n i_namguardianrelationship3,\n i_namguardianrelationship2,\n i_nomguardianpan2,\n } = nomineDetails;\n setnominate_yes_or_no(!!i_nominee ? false : true);\n setnominee_list(\n !!i_nominee3 ? \"3\" : !!i_nominee2 ? \"2\" : !!i_nominee ? \"1\" : \"\"\n );\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected1:i_nominee,\n nominee_selected2:i_nominee2,\n nominee_selected3:i_nominee3,\n }); if (!!i_nominee) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n name: { value: i_nominee },\n pan: { value: i_nompan1 },\n relationship: { value: i_NomRelation },\n dob: { value: i_NomDOB },\n gender: { value: nom1gender },\n percentage: { value: i_Nominee1percentage },\n email: { value: nom1email },\n address: { value: i_nomadd1 },\n country: { value: i_nomcountry },\n state: { value: i_nomstate },\n city: { value: i_nomcity },\n pincode: { value: i_nompin },\n });\n }\n if (!!i_nominee2) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n name: { value: i_nominee2 },\n pan: { value: i_nompan2 },\n relationship: { value: i_NomRelation2 },\n dob: { value: i_NomDOB2 },\n gender: { value: nom2gender },\n percentage: { value: i_Nominee2percentage },\n email: { value: nom2email },\n address: { value: i_nomadd21 },\n country: { value: i_nom2country },\n state: { value: i_nomstate2 },\n city: { value: i_nomcity2 },\n pincode: { value: i_nompin2 },\n });\n }\n if (!!i_nominee3) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n name: { value: i_nominee3 },\n pan: { value: i_nompan3 },\n relationship: { value: i_NomRelation3 },\n dob: { value: i_NomDOB3 },\n gender: { value: nom3gender },\n percentage: { value: i_Nominee3percentage },\n email: { value: nom3email },\n address: { value: i_nomadd31 },\n country: { value: i_nom3country },\n state: { value: i_nomstate3 },\n city: { value: i_nomcity3 },\n pincode: { value: i_nompin3 },\n });\n }\n let new_nominee_dateofbirth = nominee_dateofbirth;\n if (!!i_NomDOB && checkIfMinor(i_NomDOB)) {\n new_nominee_dateofbirth.first_nominee_dateofbirth = true;\n\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n name: { value: i_nominee },\n pan: { value: i_nompan1 },\n relationship: { value: i_NomRelation },\n dob: { value: i_NomDOB },\n gender: { value: nom1gender },\n percentage: { value: i_Nominee1percentage },\n email: { value: nom1email },\n address: { value: i_nomadd1 },\n country: { value: i_nomcountry },\n state: { value: i_nomstate },\n city: { value: i_nomcity },\n pincode: { value: i_nompin },\n gaurdianname: { value: i_nomguardianname1 },\n gaurdianpan: { value: i_nomguardianpan1 },\n gaurdianrelationship: { value: i_namguardianrelationship1 },\n });\n }\n if (!!i_NomDOB2 && checkIfMinor(i_NomDOB2)) {\n new_nominee_dateofbirth.second_nominee_dateofbirth = true;\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n name: { value: i_nominee2 },\n pan: { value: i_nompan2 },\n relationship: { value: i_NomRelation2 },\n dob: { value: i_NomDOB2 },\n gender: { value: nom2gender },\n percentage: { value: i_Nominee2percentage },\n email: { value: nom2email },\n address: { value: i_nomadd21 },\n country: { value: i_nom2country },\n state: { value: i_nomstate2 },\n city: { value: i_nomcity2 },\n pincode: { value: i_nompin2 },\n gaurdianname: { value: i_nomguardianname2 },\n gaurdianpan: { value: i_nomguardianpan2 },\n gaurdianrelationship: { value: i_namguardianrelationship2 },\n });\n }\n if (!!i_NomDOB3 && checkIfMinor(i_NomDOB3)) {\n new_nominee_dateofbirth.third_nominee_dateofbirth = true;\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n name: { value: i_nominee3 },\n pan: { value: i_nompan3 },\n relationship: { value: i_NomRelation3 },\n dob: { value: i_NomDOB3 },\n gender: { value: nom3gender },\n percentage: { value: i_Nominee3percentage },\n email: { value: nom3email },\n address: { value: i_nomadd31 },\n country: { value: i_nom3country },\n state: { value: i_nomstate3 },\n city: { value: i_nomcity3 },\n pincode: { value: i_nompin3 },\n gaurdianname: { value: i_nomguardianname3 },\n gaurdianpan: { value: i_nomguardianpan3 },\n gaurdianrelationship: { value: i_namguardianrelationship3 },\n });\n }\n setnominee_dateofbirth(new_nominee_dateofbirth);\n }\n };\n\n const NomineeDetails = async () => {\n setIsLoading(true);\n const params = {\n pan: props.store_pan,\n };\n const response = await props.getNomineeDetails(params);\n const nomineevalues = !!response.Dtinformation\n ? response.Dtinformation\n : [];\n if (response.Dtinformation.length === 0) {\n setIsNomineeListShow(false);\n }\n const nomineeList = nomineevalues.map((nominee) => {\n return { label: nominee.Nom1.trim(), value: nominee.Nom1.trim() };\n });\n const AddNew = { label: 'ADD NEW NOMINEE', value: 'ADD NEW NOMINEE' }\n nomineeList.push(AddNew);\n setnomineeList(nomineeList);\n setIsLoading(false);\n };\n const getLists = async () => {\n const relationShipResponse = await props.getRelationShipList();\n const { Dtinformation } = relationShipResponse;\n const relationShipList = Dtinformation.map((item) => ({\n label: item.rm_relation,\n value: item.rm_relation,\n }));\n const countriesResponse = await props.getCountriesList();\n const Countries = countriesResponse.Dtinformation;\n const countriesList = Countries.map((country) => {\n return { label: country.country_name, value: country.country_name };\n });\n setcountriesList(\n countriesList.length > 0\n ? countriesList\n : [{ label: \"India\", value: \"India\" }]\n );\n setrelationshipList(relationShipList);\n };\n const handleDateofBirth = (label) => (event) => {\n const value = format(new Date(event), \"MM/dd/yyyy\");\n const oneday = 86400000;\n const today = new Date();\n const datevalue = new Date(value);\n if (label == \"dob1\") {\n const min18yersletnew = new Date(today.getTime() - oneday * 365 * 18);\n if (datevalue.getTime() > min18yersletnew) {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n first_nominee_dateofbirth: true,\n });\n } else {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n first_nominee_dateofbirth: false,\n });\n }\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n dob: { value: value },\n });\n }\n if (label == \"dob2\") {\n const min18yersletnew = new Date(today.getTime() - oneday * 365 * 18);\n if (datevalue.getTime() > min18yersletnew) {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n second_nominee_dateofbirth: true,\n });\n } else {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n second_nominee_dateofbirth: false,\n });\n }\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n dob: { value: value },\n });\n }\n if (label == \"dob3\") {\n const min18yersletnew = new Date(today.getTime() - oneday * 365 * 18);\n if (datevalue.getTime() > min18yersletnew) {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n third_nominee_dateofbirth: true,\n });\n } else {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n third_nominee_dateofbirth: false,\n });\n }\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n dob: { value: value },\n });\n }\n };\n const handleNomineeList = (label) => async (event) => {\n const RemovingTheNomineeMember = { value:event.target.value };\n if (nominee_list === \"1\" && RemovingTheNomineeMember.value!==\"ADD NEW NOMINEE\") {\n if (\n RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected3 ||\n nominees_selected.nominee_selected2\n ) {\n alert(\"Already this nominee has been selected\");\n return;\n }\n }\n if (nominee_list === \"2\" && RemovingTheNomineeMember.value!==\"ADD NEW NOMINEE\") {\n if (\n RemovingTheNomineeMember.value === nominees_selected.nominee_selected1\n ) {\n alert(\"Already this nominee has been selected\");\n return;\n }\n }\n if (nominee_list === \"3\" && RemovingTheNomineeMember.value!==\"ADD NEW NOMINEE\") {\n if (\n (label == \"nomine1\" &&\n RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected3) ||\n RemovingTheNomineeMember.value === nominees_selected.nominee_selected2\n ) {\n alert(\"Already this nominee has been selected1\");\n\n return;\n }\n if (\n (label == \"nomine2\" &&\n RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected3) ||\n RemovingTheNomineeMember.value === nominees_selected.nominee_selected1\n ) {\n alert(\"Already this nominee has been selected2\");\n return;\n }\n if (\n (label == \"nomine3\" &&\n RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected2) ||\n RemovingTheNomineeMember.value === nominees_selected.nominee_selected1\n ) {\n alert(\"Already this nominee has been selected3\");\n return ;\n }\n }\n const nomineedetails =\n !!props.getnomineeDetails &&\n props.getnomineeDetails.Dtinformation.find(\n (ele) => ele.Nom1.trim() === event.target.value.trim() \n );\n const oneday = 86400000;\n const today = new Date();\n if (!!nomineedetails && label === \"nominee1\" ) {\n if (!!nomineedetails.Nom1_Dob) {\n const value = new Date(nomineedetails.Nom1_Dob);\n const min18yersletnew = new Date(today.getTime() - oneday * 365 * 18);\n if (value.getTime() > min18yersletnew) {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n first_nominee_dateofbirth: true,\n });\n } else {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n first_nominee_dateofbirth: false,\n });\n }\n }\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n name: { value: nomineedetails?.Nom1 },\n relationship: {\n value:\n nomineedetails.Nom1Relation.charAt(0).toUpperCase() +\n nomineedetails.Nom1Relation.substr(1).toLowerCase(),\n },\n dob: { value: nomineedetails?.Nom1_Dob },\n gender: { value: nomineedetails.Nom1_Gender === \"Male\" ? \"M\" : \"F\" },\n address: {\n value:\n nomineedetails?.Nom1_Add1 +\n nomineedetails?.Nom1_Add2 +\n nomineedetails?.Nom1_Add3,\n },\n country: { value: nomineedetails?.Nom1_Country },\n state: { value: nomineedetails?.Nom1_state },\n pincode: { value: nomineedetails?.Nom1_pin },\n city: { value: nomineedetails?.Nom1_City },\n });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected1: event.target.value,\n });\n } else if(label === \"nominee1\" && event.target.value===\"ADD NEW NOMINEE\"){\n const thirdPercentage = nominee_list ===\"3\" ?third_nomineeDetails.percentage.value: 0;\n const secondPercentage = nominee_list >=\"2\" ? second_nomineeDetails.percentage.value:0;\n const percentage = thirdPercentage\n ? 100 - thirdPercentage - (secondPercentage || 0)\n : secondPercentage\n ? 100 - secondPercentage\n : 100;\n setfirst_nomineeDetails({\n ...first_nominee_details,\n percentage:{value:percentage}\n });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected1: event.target.value,\n });\n }\n\n if (!!nomineedetails && label === \"nominee2\" ) {\n if (!!nomineedetails.Nom2_Dob) {\n const value = new Date(nomineedetails.Nom2_Dob);\n const min18yersletnew = new Date(today.getTime() - oneday * 365 * 18);\n if (value.getTime() > min18yersletnew) {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n second_nominee_dateofbirth: true,\n });\n } else {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n second_nominee_dateofbirth: false,\n });\n }\n }\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n name: { value: nomineedetails?.Nom1 },\n relationship: {\n value:\n nomineedetails.Nom1Relation.charAt(0).toUpperCase() +\n nomineedetails.Nom1Relation.substr(1).toLowerCase(),\n },\n dob: { value: nomineedetails?.Nom1_Dob },\n gender: { value: nomineedetails.Nom1_Gender === \"Male\" ? \"M\" : \"F\" },\n address: {\n value:\n nomineedetails?.Nom1_Add1 +\n nomineedetails?.Nom1_Add2 +\n nomineedetails?.Nom1_Add3,\n },\n country: { value: nomineedetails?.Nom1_Country },\n state: { value: nomineedetails?.Nom1_state },\n pincode: { value: nomineedetails?.Nom1_pin },\n city: { value: nomineedetails?.Nom1_City },\n });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected2: event.target.value,\n });\n } else if (label === \"nominee2\" && event.target.value===\"ADD NEW NOMINEE\") {\n const thirdPercentage = nominee_list ===\"3\" ?third_nomineeDetails.percentage.value: 0;\n const firstPercentage = first_nomineeDetails.percentage.value;\n const percentage = thirdPercentage\n ? 100 - thirdPercentage - (firstPercentage || 0)\n : firstPercentage\n ? 100 - firstPercentage\n : 100;\n setsecond_nomineeDetails({\n ...second_nominee_details,\n percentage:{value:percentage}\n\n });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected2: event.target.value,\n });\n }\n if (!!nomineedetails && label === \"nominee3\" ) {\n if (!!nomineedetails.Nom3_Dob) {\n const value = new Date(nomineedetails.Nom3_Dob);\n const min18yersletnew = new Date(today.getTime() - oneday * 365 * 18);\n if (value.getTime() > min18yersletnew) {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n third_nominee_dateofbirth: true,\n });\n } else {\n setnominee_dateofbirth({\n ...nominee_dateofbirth,\n third_nominee_dateofbirth: false,\n });\n }\n }\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n name: { value: nomineedetails?.Nom1 },\n relationship: {\n value:\n nomineedetails.Nom1Relation.charAt(0).toUpperCase() +\n nomineedetails.Nom1Relation.substr(1).toLowerCase(),\n },\n dob: { value: nomineedetails?.Nom1_Dob },\n gender: { value: nomineedetails.Nom1_Gender === \"Male\" ? \"M\" : \"F\" },\n address: {\n value:\n nomineedetails?.Nom1_Add1 +\n nomineedetails?.Nom1_Add2 +\n nomineedetails?.Nom1_Add3,\n },\n country: { value: nomineedetails?.Nom1_Country },\n state: { value: nomineedetails?.Nom1_state },\n pincode: { value: nomineedetails?.Nom1_pin },\n city: { value: nomineedetails?.Nom1_City },\n });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected3: event.target.value,\n });\n } else if (label === \"nominee3\" && event.target.value===\"ADD NEW NOMINEE\") {\n const firstPercentage = first_nomineeDetails.percentage.value;\n const secondPercentage = nominee_list >=\"2\" ? second_nomineeDetails.percentage.value:0;\n const percentage = firstPercentage\n ? 100 - firstPercentage - (secondPercentage || 0)\n : secondPercentage\n ? 100 - secondPercentage\n : 100;\n setthird_nomineeDetails({\n ...third_nominee_details,\n percentage:{value:percentage}\n });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected3: event.target.value,\n });\n }\n };\n const handleChangePan = (label) => async (event) => {\n const value = event?.target?.value?.toUpperCase();\n setInputLabel(label);\n const arr = [\n { pan: props.profileData.PAN},\n { pan: props.store_pan },\n { pan: props.applicantparams.i_pangno2 },\n { pan: props.applicantparams.i_pangno3 },\n { pan: first_nomineeDetails.pan.value },\n { pan: second_nomineeDetails.pan.value },\n { pan: third_nomineeDetails.pan.value },\n { pan: first_nomineeDetails.gaurdianpan.value },\n { pan: second_nomineeDetails.gaurdianpan.value },\n { pan: third_nomineeDetails.gaurdianpan.value },\n ];\n if (label === \"firstNomineePan\" && value?.length <= 10) {\n if (value.length === 10 && !/^[A-Z]{5}[0-9]{4}[A-Z]$/.test(value)) {\n alert(\"Provide valid PAN\");\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n const search = arr.find((ele) => !!ele.pan && ele.pan === value);\n if (!!search) {\n alert(\"Nominee PAN,Primary Holder PAN,Guardian PAN,Distributor PAN cannot be same\");\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n pan: { value: value },\n });\n if(label === \"firstNomineePan\" && value.length > 3 && value[3]?.toLowerCase() !== \"p\") {\n alert(\"Invalid PAN\");\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n }\n if (label === \"secondNomineePan\" && value.length <= 10) {\n if (value.length === 10 && !/^[A-Z]{5}[0-9]{4}[A-Z]$/.test(value)) {\n alert(\"Provide Valid PAN\");\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n const search = arr.find((ele) => !!ele.pan && ele.pan === value);\n if (!!search) {\n alert(\"Nominee PAN,Primary Holder PAN,Guardian PAN,Distributor PAN cannot be same\");\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n pan: { value: value },\n });\n if(label === \"secondNomineePan\" && value.length > 3 && value[3]?.toLowerCase() !== \"p\") {\n alert(\"Provide Valid PAN\");\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n }\n if (label === \"thirdNomineePan\" && value.length <= 10) {\n if (value.length === 10 && !/^[A-Z]{5}[0-9]{4}[A-Z]$/.test(value)) {\n alert(\"Provide Valid PAN\");\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n const search = arr.find((ele) => !!ele.pan && ele.pan === value);\n if (!!search) {\n alert(\"Nominee PAN,Primary Holder PAN,Guardian PAN,Distributor PAN cannot be same\");\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n if(label === \"thirdNomineePan\" && value.length > 3 && value[3]?.toLowerCase() !== \"p\") {\n alert(\"Invalid PAN\");\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n pan: { value: value },\n });\n }\n if (label === \"firstNomineeGuardianPan\" && value.length <= 10) {\n const search = arr.find((ele) => !!ele.pan && ele.pan === value);\n if (!!search && (value !== props.store_pan)) {\n alert(\"Nominee PAN,Primary Holder PAN,Guardian PAN,Distributor PAN cannot be same\");\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianpan: { value: \"\" },\n });\n return;\n }\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianpan: { value: value },\n });\n if( value.length >= 4 && value.length > 3 && value[3].toLowerCase() != \"p\") {\n alert(\"Invalid PAN\");\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianpan: { value: \"\" },\n });\n return;\n }\n }\n if (label === \"secondNomineeGuardianPan\" && value.length <= 10) {\n \n const search = arr.find((ele) => !!ele.pan && ele.pan === value);\n if (!!search && (value !== props.store_pan)) {\n alert(\"Nominee PAN,Primary Holder PAN,Guardian PAN,Distributor PAN cannot be same\");\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianpan: { value: \"\" },\n });\n return;\n }\n\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianpan: { value: value },\n });\n if( value.length >= 4 && value.length > 3 && value[3].toLowerCase() != \"p\") {\n alert(\"Invalid PAN\");\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianpan: { value: \"\" },\n });\n return;\n }\n }\n if (label === \"thirdNomineeGuardianPan\" && value.length <= 10) {\n \n const search = arr.find((ele) => !!ele.pan && ele.pan === value);\n if (!!search && (value !== props.store_pan)) {\n alert(\"Nominee PAN,Primary Holder PAN,Guardian PAN,Distributor PAN cannot be same\");\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianpan: { value: \"\" },\n });\n return;\n }\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianpan: { value: value },\n });\n if( value.length >= 4 && value.length > 3 && value[3].toLowerCase() != \"p\") {\n alert(\"Invalid PAN\");\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianpan: { value: \"\" },\n });\n return;\n }\n }\n \n };\n const handlePercentage = (label) => (event) => {\n const value = event.target.value;\n if (event.target.value <= 100) {\n if (label === \"first\" && nominee_list === \"1\") {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage: { value: value },\n });\n }\n if (nominee_list === \"2\" && (label === \"second\" || label === \"first\")) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n percentage:\n label === \"second\"\n ? { value: value }\n : { value: Math.abs(value - 100) },\n });\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage:\n label === \"first\"\n ? { value: value }\n : { value: Math.abs(value - 100) },\n });\n }\n if (\n nominee_list === \"3\" &&\n (label === \"first\" || label === \"second\" || label === \"third\")\n ) {\n // if(label === \"first\") {\n // if ((value + second_nomineeDetails.percentage.value + third_nomineeDetails.percentage.value) > 100 ) {\n // alert(\"Total nominee percentage should not be more than 100%\")\n // return;\n // }\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage:\n label === \"first\"\n ? { value: value }\n : { value: Math.abs(value - 100)/2 },\n }); \n // }\n // if(label === \"second\") {\n // if ((value + first_nomineeDetails.percentage.value + third_nomineeDetails.percentage.value) > 100 ) {\n // alert(\"Total nominee percentage should not be more than 100%\")\n // return;\n // }\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n percentage:\n label === \"second\"\n ? { value: value }\n : { value: Math.abs(value - 100)/2 },\n }); \n // }\n // if(label === \"third\") {\n // if ((value + second_nomineeDetails.percentage.value + first_nomineeDetails.percentage.value) > 100 ) {\n // alert(\"Total nominee percentage should not be more than 100%\")\n // return;\n // }\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n percentage:\n label === \"third\"\n ? { value: value }\n : { value: Math.abs(value - 100)/2 },\n }); \n // }\n }\n }\n };\n const handleNominees = () => {\n setnominate_yes_or_no(!nominate_yes_or_no);\n setfirst_nomineeDetails(first_nominee_details);\n setsecond_nomineeDetails(second_nominee_details);\n setthird_nomineeDetails(third_nominee_details);\n };\n const handlePincode = (label) => (event) => {\n const value = event.target.value;\n if (value.length <= 6) {\n if (label === \"nominee1\") {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n pincode: { value: event.target.value },\n });\n }\n if (label === \"nominee2\") {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n pincode: { value: event.target.value },\n });\n }\n\n if (label === \"nominee3\") {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n pincode: { value: event.target.value },\n });\n }\n }\n };\n const handleName = (label) => (event) => {\n const value = event.target.value;\n const investorName = props?.applicantparams.i_fname.toLowerCase();\n const isDuplicate = value.toLowerCase() === investorName ? true : false;\n const arr = [\n { name: third_nomineeDetails.name.value },\n { name: second_nomineeDetails.name.value },\n { name: first_nomineeDetails.name.value },\n ];\n\n if (label === \"nominee1\") {\n const search = arr.find((ele) => !!ele.name && ele.name === value);\n if (isDuplicate || !!search) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n name: { value: \"\" },\n });\n alert(isDuplicate ? \"Nominee name should not match Investor name\" : \"Nominee Names cannot be same\");\n return;\n }\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n name: { value: value },\n });\n }\n if (label === \"nominee2\") {\n const search = arr.find((ele) => !!ele.name && ele.name === value);\n if (isDuplicate || !!search) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n name: { value: \"\" },\n });\n alert(isDuplicate ? \"Nominee name cannot match Investor name\" : \"Nominee Names cannot be same\");\n return;\n }\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n name: { value: value },\n });\n }\n if (label === \"nominee3\") {\n const search = arr.find((ele) => !!ele.name && ele.name === value);\n if (isDuplicate || !!search) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n name: { value: \"\" },\n });\n alert(isDuplicate ? \"Nominee name cannot match Investor name\" : \"Nominee Names cannot be same\");\n return;\n }\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n name: { value: value },\n });\n }\n };\n const closeModal = () => {\n setOpenModal(false)\n ;\n};\nconst handleContinue = () => {\n closeModal();\n props.history.push({\n pathname:\n \"/e-KYC\",\n });\n};\n const submit = async () => {\n if (!nominate_yes_or_no && (props.store_pan.charAt(3) !== \"H\" && props.applicantparams.typeofinvestor !== \"M\")) {\n if (nominee_list >= 1) {\n if (!nameRegex.test(first_nomineeDetails.name.value)) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n name: {\n value: \"\",\n isError: true,\n errorMessage: \"Name is mandatory\",\n },\n });\n return;\n }\n if (!first_nomineeDetails.relationship.value) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n relationship: {\n isError: true,\n errorMessage: \"Select the Relationship\",\n },\n });\n return;\n }\n if((!!first_nomineeDetails?.pan?.value) && first_nomineeDetails?.pan?.value?.length !== 10) {\n alert(\"enter valid pan\")\n return;\n }\n if((!!second_nomineeDetails?.pan?.value) && second_nomineeDetails?.pan?.value?.length !== 10) {\n alert(\"enter valid pan\")\n return;\n }\n if((!!third_nomineeDetails?.pan?.value) && third_nomineeDetails?.pan?.value?.length !== 10) {\n alert(\"enter valid pan\")\n return;\n }\n if (!first_nomineeDetails.dob.value) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n dob: {\n isError: true,\n errorMessage: \"Select the Date of Birth\",\n },\n });\n return;\n }\n if (\n !!nominee_dateofbirth.first_nominee_dateofbirth &&\n first_nomineeDetails.gaurdianname.value == \"\"\n ) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianname: {\n isError: true,\n errorMessage: \"Enter the Guardian Name\",\n },\n });\n return;\n }\n if (\n !!nominee_dateofbirth.first_nominee_dateofbirth &&\n !panRegex.test(first_nomineeDetails.gaurdianpan.value)\n ) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianpan: {\n isError: true,\n errorMessage: \"Enter valid Guardian PAN\",\n },\n });\n return;\n }\n if (!first_nomineeDetails.gender.value) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gender: {\n isError: true,\n errorMessage: \"Select the gender\",\n },\n });\n return;\n }\n if ((first_nomineeDetails.percentage.value===\"0\" || first_nomineeDetails.percentage.value===\"\" || first_nomineeDetails.percentage.value===null || first_nomineeDetails.percentage.value===0)) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage: {\n value:\"\",\n isError: true,\n errorMessage: \"Please enter a valid percentage\",\n },\n });\n return;\n }\n if (nominee_list === \"1\" && first_nomineeDetails.percentage.value!==\"100\") {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage: {\n value:\"\",\n isError: true,\n errorMessage: \"Please enter a valid percentage\",\n },\n });\n return;\n }\n if (first_nomineeDetails.email.value.length > 0 &&\n (!emailRegex.test(first_nomineeDetails.email.value) ||\n !first_nomineeDetails.email.value.includes(\".\"))\n ) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n email: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter valid Email id\",\n },\n });\n return;\n }\n if (nominee_list >= 2) {\n if (!nameRegex.test(second_nomineeDetails.name.value)) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n name: {\n value: \"\",\n isError: true,\n errorMessage: \"Name is mandatory\",\n },\n });\n return;\n }\n if (!second_nomineeDetails.dob.value) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n dob: {\n isError: true,\n errorMessage: \"Select the Date of Birth\",\n },\n });\n return;\n }\n if (!second_nomineeDetails.relationship.value) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n relationship: {\n isError: true,\n errorMessage: \"Select the Relationship\",\n },\n });\n return;\n }\n if (second_nomineeDetails.percentage.value === 0 || second_nomineeDetails.percentage.value===\"\" || second_nomineeDetails.percentage.value===null || second_nomineeDetails.percentage.value===\"0\") {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n percentage: {\n value:\"\",\n isError: true,\n errorMessage: \"Please enter a valid percentage\",\n },\n });\n return;\n }\n if (\n !!nominee_dateofbirth.second_nominee_dateofbirth &&\n second_nomineeDetails.gaurdianname.value == \"\"\n ) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianname: {\n isError: true,\n errorMessage: \"Enter the Guardian Name\",\n },\n });\n return;\n }\n if (\n !!nominee_dateofbirth.second_nominee_dateofbirth &&\n !panRegex.test(second_nomineeDetails.gaurdianpan.value)\n ) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianpan: {\n isError: true,\n errorMessage: \"Enter valid Guardian PAN\",\n },\n });\n return;\n }\n if (!second_nomineeDetails.gender.value) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gender: {\n isError: true,\n errorMessage: \"Select the gender\",\n },\n });\n return;\n }\n if (second_nomineeDetails.email.value.length > 0 &&\n (!emailRegex.test(second_nomineeDetails.email.value) ||\n !second_nomineeDetails.email.value.includes(\".\"))\n ) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n email: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter valid Email id\",\n },\n });\n return;\n }\n }\n }\n if (nominee_list >= 3) {\n if (!nameRegex.test(third_nomineeDetails.name.value)) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n name: {\n value: \"\",\n isError: true,\n errorMessage: \"Name is mandatory\",\n },\n });\n return;\n }\n if (!third_nomineeDetails.dob.value) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n dob: {\n isError: true,\n errorMessage: \"Select the Date of Birth\",\n },\n });\n return;\n }\n if (!third_nomineeDetails.relationship.value) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n relationship: {\n isError: true,\n errorMessage: \"Select the Relationship\",\n },\n });\n return;\n }\n if (third_nomineeDetails.percentage.value===0 || third_nomineeDetails.percentage.value===\"\" || third_nomineeDetails.percentage.value===null || third_nomineeDetails.percentage.value===\"0\") {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n percentage: {\n value:\"\",\n isError: true,\n errorMessage: \"Please enter a valid percentage\",\n },\n });\n return;\n }\n if (\n !!nominee_dateofbirth.third_nominee_dateofbirth &&\n third_nomineeDetails.gaurdianname.value == \"\"\n ) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianname: {\n isError: true,\n errorMessage: \"Enter the Guardian Name\",\n },\n });\n return;\n }\n if (\n !!nominee_dateofbirth.third_nominee_dateofbirth &&\n !panRegex.test(third_nomineeDetails.gaurdianpan.value)\n ) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianpan: {\n isError: true,\n errorMessage: \"Enter valid Guardian PAN\",\n },\n });\n return;\n }\n if (!third_nomineeDetails.gender.value) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gender: {\n isError: true,\n errorMessage: \"Select the gender\",\n },\n });\n return;\n }\n if (third_nomineeDetails.email.value.length > 0 &&\n (!emailRegex.test(\n third_nomineeDetails.email.value ||\n !third_nomineeDetails.email.value.includes(\".\"))\n )\n ) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n email: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter valid Email Id\",\n },\n });\n return;\n }\n }\n }\n \n\n setIsLoading(true);\n const NomineeDetails = {\n nominate_yes_or_no:nominate_yes_or_no,\n ...(!nominate_yes_or_no && {\n i_nominee: first_nomineeDetails.name.value,\n i_nompan1: first_nomineeDetails.pan.value,\n i_NomRelation:\n first_nomineeDetails.relationship.value === \"Other\"\n ? first_nomineeDetails.otherrelationship.value\n : first_nomineeDetails.relationship.value,\n i_NomDOB: first_nomineeDetails.dob.value,\n nom1gender: first_nomineeDetails.gender.value,\n i_Nominee1percentage: first_nomineeDetails.percentage.value,\n nom1email: first_nomineeDetails.email.value,\n i_nomadd1: first_nomineeDetails.address.value,\n i_nomcountry: first_nomineeDetails.country.value,\n i_nomstate: first_nomineeDetails.state.value,\n i_nomcity: first_nomineeDetails.city.value,\n i_nompin: first_nomineeDetails.pincode.value,\n i_nomguardianname1: first_nomineeDetails.gaurdianname.value,\n i_nomguardianpan1: first_nomineeDetails.gaurdianpan.value,\n i_namguardianrelationship1:\n first_nomineeDetails.gaurdianrelationship.value,\n }),\n ...(!nominate_yes_or_no && nominee_list > 1\n ? {\n i_nominee2: second_nomineeDetails.name.value,\n i_nompan2: second_nomineeDetails.pan.value,\n i_NomRelation2:\n second_nomineeDetails.relationship.value === \"Other\"\n ? second_nomineeDetails.otherrelationship.value\n : second_nomineeDetails.relationship.value,\n i_NomDOB2: second_nomineeDetails.dob.value,\n nom2gender: second_nomineeDetails.gender.value,\n i_Nominee2percentage: second_nomineeDetails.percentage.value,\n nom2email: second_nomineeDetails.email.value,\n i_nomadd21: second_nomineeDetails.address.value,\n i_nom2country: second_nomineeDetails.country.value,\n i_nomstate2: second_nomineeDetails.state.value,\n i_nomcity2: second_nomineeDetails.city.value,\n i_nompin2: second_nomineeDetails.pincode.value,\n i_nomguardianname2: second_nomineeDetails.gaurdianname.value,\n i_nomguardianpan2: second_nomineeDetails.gaurdianpan.value,\n i_namguardianrelationship2:\n second_nomineeDetails.gaurdianrelationship.value,\n }\n : {}),\n ...(!nominate_yes_or_no && nominee_list > 2\n ? {\n i_nominee3: third_nomineeDetails.name.value,\n i_nompan3: third_nomineeDetails.pan.value,\n i_NomRelation3:\n third_nomineeDetails.relationship.value === \"Other\"\n ? third_nomineeDetails.otherrelationship.value\n : third_nomineeDetails.relationship.value,\n i_NomDOB3: third_nomineeDetails.dob.value,\n nom3gender: third_nomineeDetails.gender.value,\n i_Nominee3percentage: third_nomineeDetails.percentage.value,\n nom3email: third_nomineeDetails.email.value,\n i_nomadd31: third_nomineeDetails.address.value,\n i_nom3country: third_nomineeDetails.country.value,\n i_nomstate3: third_nomineeDetails.state.value,\n i_nomcity3: third_nomineeDetails.city.value,\n i_nompin3: third_nomineeDetails.pincode.value,\n i_nomguardianname3: third_nomineeDetails.gaurdianname.value,\n i_nomguardianpan3: third_nomineeDetails.gaurdianpan.value,\n i_namguardianrelationship3:\n third_nomineeDetails.gaurdianrelationship.value,\n }\n : {}),\n };\n setIsLoading(false);\n props.storeNomineeDetails(NomineeDetails);\n props.history.replace(BUILD_URL+\"/new-investor-transaction/bank-details\");\n };\n return (\n <>\n \n \n {o.name}\n
\n \n
\n {(!nominate_yes_or_no && Object.keys(props.address).length>0 ) &&(\n \n
\n )}\n \n {!nominate_yes_or_no && (\n \n
\n )}\n {nominee_list >= 2 && (\n \n \n {NomineesList.map((item, index) => (\n \n ))}\n \n
\n {nominee_list >= 1 && (\n \n \n {NomineeListShow && (\n
\n Nominee 1:
\n \n \n {nomineeList.map((item, index) => (\n \n ))}\n \n
\n )}\n\n \n =1? false : true\n }\n isShowError={first_nomineeDetails.name.isError}\n errorMessage={first_nomineeDetails.name.errorMessage}\n />\n
\n \n
\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n relationship: { value: event.target.value },\n })\n }\n >\n {relationshipList.map((item, index) => (\n \n ))}\n \n
\n {first_nomineeDetails.relationship.value == \"Other\" && (\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n otherrelationship: { value: event.target.value },\n })\n }\n />\n
\n )}\n \n \n \n {!!first_nomineeDetails.dob.errorMessage && (\n
\n {nominee_dateofbirth.first_nominee_dateofbirth && (\n Date of Birth*
\n \n {\" \"}\n {first_nomineeDetails.dob.errorMessage}\n
\n )}\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianname: { value: event.target.value },\n })\n }\n onBlur={(event) => {\n const guardianName = event.target.value;\n if (guardianName.length < 2) {\n alert('Guardian Name must be at least 2 characters long');\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianname: { value: \"\" },\n })\n }\n }}\n isShowError={first_nomineeDetails.gaurdianname.isError}\n errorMessage={\n first_nomineeDetails.gaurdianname.errorMessage\n }\n />\n
\n )}\n {nominee_dateofbirth.first_nominee_dateofbirth && (\n \n setfirst_nomineeDetails({ ...first_nomineeDetails, gaurdianpan:{value:event.target.value}})}\n isShowError={first_nomineeDetails.gaurdianpan.isError}\n errorMessage={\n first_nomineeDetails.gaurdianpan.errorMessage\n }\n />\n
\n )}\n {nominee_dateofbirth.first_nominee_dateofbirth && (\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianrelationship: { value: event.target.value },\n })\n }\n >\n {relationshipList.map((item, index) => (\n \n ))}\n \n
\n )}\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gender: { value: event.target.value },\n })\n }\n >\n {genderOptions.map((item, index) => (\n \n ))}\n \n
\n \n
\n \n \n // setfirst_nomineeDetails({\n // ...first_nomineeDetails,\n // email: { value: event.target.value },\n // })\n // }\n onChange={(event) => {\n const emailValue = event.target.value;\n const isDistributorEmail = emailValue === props.profileData.Email;\n \n setfirst_nomineeDetails((prevDetails) => ({\n ...first_nomineeDetails,\n email: { value: isDistributorEmail ? \"\" : emailValue, isError: isDistributorEmail,\n errorMessage: isDistributorEmail ? \"Email id cannot be same as Distributor email\" : \"\" },\n\n }));\n }}\n isShowError={first_nomineeDetails.email.isError}\n errorMessage={first_nomineeDetails.email.errorMessage}\n />\n
\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n address: { value: event.target.value },\n })\n }\n />\n
\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n country: { value: event.target.value },\n })\n }\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n {\n const inputValue = event.target.value;\n if (!/\\d/.test(inputValue)) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n state: { value: inputValue },\n }); } else {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n state: { value: \"\" },\n }); }\n } }\n />\n
\n \n {\n const inputValue = event.target.value;\n if (!/\\d/.test(inputValue)) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n city: { value: event.target.value },\n }) \n } else {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n city: { value: \"\" },\n })\n } }}\n />{\" \"}\n
\n \n
\n \n \n {NomineeListShow && (\n
\n \n )}\n {nominee_list >= 3 && (\n Nominee 2:
\n\n \n \n {nomineeList.map((item, index) => (\n \n ))}\n \n
\n )}\n \n =1? false : true\n }\n isShowError={second_nomineeDetails.name.isError}\n errorMessage={second_nomineeDetails.name.errorMessage}\n />\n
\n \n
\n \n \n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n relationship: { value: event.target.value },\n })\n }\n >\n {relationshipList.map((item, index) => (\n \n ))}\n \n
\n {second_nomineeDetails.relationship.value == \"Other\" && (\n \n \n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n otherrelationship: { value: event.target.value },\n })\n }\n />\n
\n )}\n \n \n \n {!!second_nomineeDetails.dob.errorMessage && (\n
\n {nominee_dateofbirth.second_nominee_dateofbirth && (\n Date of Birth*
\n \n {\" \"}\n {second_nomineeDetails.dob.errorMessage}\n
\n )}\n \n \n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianname: { value: event.target.value },\n })\n }\n onBlur={(event) => {\n const guardianName = event.target.value;\n if (guardianName.length < 2) {\n alert('Guardian Name must be at least 2 characters long');\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianname: { value: \"\" },\n })\n }\n }}\n isShowError={second_nomineeDetails.gaurdianname.isError}\n errorMessage={\n second_nomineeDetails.gaurdianname.errorMessage\n }\n />\n
\n )}\n {nominee_dateofbirth.second_nominee_dateofbirth && (\n \n
\n )}\n {nominee_dateofbirth.second_nominee_dateofbirth && (\n \n \n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gaurdianrelationship: { value: event.target.value },\n })\n }\n >\n {relationshipList.map((item, index) => (\n \n ))}\n \n
\n )}\n \n \n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n gender: { value: event.target.value },\n })\n }\n >\n {genderOptions.map((item, index) => (\n \n ))}\n \n
{\" \"}\n \n
\n \n \n // setsecond_nomineeDetails({\n // ...second_nomineeDetails,\n // email: { value: event.target.value },\n // })\n // }\n onChange={(event) => {\n const emailValue = event.target.value;\n const isDistributorEmail = emailValue === props.profileData.Email;\n \n setsecond_nomineeDetails((prevDetails) => ({\n ...second_nomineeDetails,\n email: { value: isDistributorEmail ? \"\" : emailValue, isError: isDistributorEmail,\n errorMessage: isDistributorEmail ? \"Email id cannot be same as Distributor email\" : \"\" },\n\n }));\n }}\n isShowError={second_nomineeDetails.email.isError}\n errorMessage={second_nomineeDetails.email.errorMessage}\n />\n
\n \n \n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n address: { value: event.target.value },\n })\n }\n />\n
\n \n \n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n country: { value: event.target.value },\n })\n }\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
\n \n {\n const inputValue = event.target.value;\n if (!/\\d/.test(inputValue)) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n state: { value: event.target.value },\n })\n }else {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n state: { value: \"\" },\n })\n } } }\n />\n
\n \n {\n const inputValue = event.target.value;\n if (!/\\d/.test(inputValue)) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n city: { value: event.target.value },\n })\n } else {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n city: { value: \"\" },\n })\n } }}\n />\n
\n \n
\n \n \n {NomineeListShow && (\n
\n \n )}\n \n )}\n\n Nominee 3:
\n \n \n {nomineeList.map((item, index) => (\n \n ))}\n \n
\n )}\n \n =1? false : true\n }\n value={third_nomineeDetails.name.value}\n isShowError={third_nomineeDetails.name.isError}\n errorMessage={third_nomineeDetails.name.errorMessage}\n />\n
\n \n
\n \n \n setthird_nomineeDetails({\n ...third_nomineeDetails,\n relationship: { value: event.target.value },\n })\n }\n >\n {relationshipList.map((item, index) => (\n \n ))}\n \n
\n {third_nomineeDetails.relationship.value == \"Other\" && (\n \n \n setthird_nomineeDetails({\n ...third_nomineeDetails,\n otherrelationship: { value: event.target.value },\n })\n }\n />\n
\n )}\n \n \n \n {!!third_nomineeDetails.dob.errorMessage && (\n
\n {nominee_dateofbirth.third_nominee_dateofbirth && (\n Date of Birth*
\n \n {\" \"}\n {third_nomineeDetails.dob.errorMessage}\n
\n )}\n \n \n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianname: { value: event.target.value },\n })\n }\n onBlur={(event) => {\n const guardianName = event.target.value;\n if (guardianName.length < 2) {\n alert('Guardian Name must be at least 2 characters long');\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianname: { value: \"\" },\n })\n }\n }}\n isShowError={third_nomineeDetails.gaurdianname.isError}\n errorMessage={\n third_nomineeDetails.gaurdianname.errorMessage\n }\n />\n
\n )}\n {nominee_dateofbirth.third_nominee_dateofbirth && (\n \n
\n )}\n {nominee_dateofbirth.third_nominee_dateofbirth && (\n \n \n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gaurdianrelationship: { value: event.target.value },\n })\n }\n >\n {relationshipList.map((item, index) => (\n \n ))}\n \n
\n )}\n \n \n setthird_nomineeDetails({\n ...third_nomineeDetails,\n gender: { value: event.target.value },\n })\n }\n >\n {genderOptions.map((item, index) => (\n \n ))}\n \n
\n \n
\n \n {\n const emailValue = event.target.value;\n const isDistributorEmail = emailValue === props.profileData.Email;\n \n setthird_nomineeDetails(() => ({\n ...third_nomineeDetails,\n email: { value: isDistributorEmail ? \"\" : emailValue, isError: isDistributorEmail,\n errorMessage: isDistributorEmail ? \"Email id cannot be same as Distributor email\" : \"\" },\n\n }));\n }}\n isShowError={third_nomineeDetails.email.isError}\n errorMessage={third_nomineeDetails.email.errorMessage}\n />\n
\n \n \n setthird_nomineeDetails({\n ...third_nomineeDetails,\n address: { value: event.target.value },\n })\n }\n fatcawidth={true}\n />\n
{\" \"}\n \n \n setthird_nomineeDetails({\n ...third_nomineeDetails,\n country: { value: event.target.value },\n })\n }\n >\n {countriesList.map((item, index) => (\n \n ))}\n \n
{\" \"}\n \n {\n const inputValue = event.target.value;\n if (!/\\d/.test(inputValue)) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n state: { value: event.target.value },\n })\n } else { setthird_nomineeDetails({ ...third_nomineeDetails, state: { value: \"\" } }) } }}\n />\n
\n \n {\n const inputValue = event.target.value;\n if (!/\\d/.test(inputValue)) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n city: { value: event.target.value },\n })\n } else {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n city: { value: \"\" },\n })\n } }}\n />\n
\n \n
\n {props.store_pan.charAt(3) === \"H\" && props.applicantparams.typeofinvestor === \"M\" ? \"Nominee section is disabled for HUF Investor\" : \"For minor's nominee section is disabled\"}
\n )}\n \n \n props.history.replace(BUILD_URL+\"/new-investor-transaction/fatca-details\")\n }\n >\n BACK\n \n \n PROCEED\n \n
\n \n );\n};\nexport default connect(\n ({ newinvestor , authReducer,profileReducer }) => {\n const {\n applicantparams,\n fatcaDetails,\n getnomineeDetails,\n nomineDetails,\n address,\n store_pan,\n } = newinvestor;\n const { userId } = authReducer;\n const { profileData } = profileReducer;\n return {\n fatcaDetails,\n applicantparams,\n getnomineeDetails,\n nomineDetails,\n address,\n store_pan,\n profileData\n };\n },\n {\n storeApplicantParams,\n getKycDetails,\n getRelationShipList,\n storeNomineeDetails,\n getNomineeDetails,\n getCountriesList\n }\n)(NomineeDetails);\n","import React, { useEffect, useReducer, useState } from \"react\";\n\nimport {\n ifscRegex,\n bankAccountRegex,\n pincodeRegex,\n nameRegex,\n accountRegex,\n} from \".\";\n\nimport CustomizedSelect from \"../customizedSelect\";\nimport { Input } from \"../../../forms/input\";\n// import CustomLoader from \"../../../forms/Loader\";\nimport CustomLoader from \"../../../forms/customLoader\";\nimport CardComponent from \"./lib/CardComponent\";\nimport { MenuItem } from \"@material-ui/core\";\nimport {\n getBankList,\n storeInvestmentDetails,\n storeInvestmentParams,\n NewinvestorBankDetails,\n getAccountTypes,\n storeApplicantParams,\n getInvestorBankDetails\n} from \"shared/store/actions\"\nimport { connect } from \"react-redux\";\nimport { BUILD_URL } from \"../../home\";\n\nconst BankDetails = (props) => {\n // const ValidAccountTypes = {\n // 11: [\"Savings\"],\n // 12: [\"Current\"],\n // 21: [\"NRE\"],\n // 22: [\"NRO\"],\n // };\n\n const [bankselected, setbankseleected] = useState(\"\");\n const [bankList, setBankList] = useState([]);\n\n const initialState = {\n IFSC: { value: \"\" },\n // \"MICR Code\": { value: \"\" },\n \"Bank Name\": { value: \"\" },\n \"Branch Address\": { value: \"\" },\n \"Branch City\": { value: \"\" },\n \"Branch Pincode\": { value: \"\" },\n \"Account Type\": { value: \"\" },\n \"Account Number\": { value: \"\" },\n \"Confirm Account Number\": { value: \"\" },\n AccountTypes: [],\n isLoading: false,\n BanksListShow: true,\n DisablingBankDetails: false,\n };\n const [formValues, setFormValues] = useReducer(\n (preValues, newValues) => ({ ...preValues, ...newValues }),\n initialState\n );\n const InputFields = [\n [\n { name: \"IFSC\", isMandatory: false, type: \"text\" },\n { name: \"Account Type\", isMandatory: false },\n ],\n [\n // { name: \"MICR Code\", isMandatory: false, type: \"text\" },\n { name: \"Bank Name\", isMandatory: false, type: \"text\", disabled: !!formValues.DisablingBankDetails ? true : false },\n { name: \"Branch Address\", isMandatory: false, type: \"text\", disabled: !!formValues.DisablingBankDetails ? true : false },\n ],\n [\n { name: \"Branch City\", isMandatory: false, type: \"text\", disabled: !!formValues.DisablingBankDetails ? true : false },\n { name: \"Branch Pincode\", isMandatory: false, type: \"number\", disabled: !!formValues.DisablingBankDetails ? true : false },\n ],\n [\n { name: \"Account Number\", isMandatory: false, type: \"password\" },\n { name: \"Confirm Account Number\", isMandatory: false, type: \"number\" },\n ],\n ];\n\n useEffect(() => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n const { investmentDetails } = props;\n if (!!investmentDetails.IFSC) {\n setFormValues({ ...investmentDetails });\n return;\n } else {\n NewinvestorBankDetails();\n }\n // setFormValues({\n // AccountTypes: ValidAccountTypes[props.applicantparams.i_category],\n // \"Account Type\": {\n // value: ValidAccountTypes[props.applicantparams.i_category]\n // },\n // });\n }, []);\n const NewinvestorBankDetails = async () => {\n const params = {\n opt: \"AC\",\n SchemeType: props.applicantparams.i_category === \"20\" ? 'Y' : \"\",\n }\n const res = await props.getAccountTypes(params)\n if (res) {\n const typeList = res.Dtinformation.map((type) => {\n return { label: type.Account_Type, value: type.Account_Type };\n });\n setFormValues({ AccountTypes: typeList });\n }\n const response = await props.NewinvestorBankDetails({\n pan: props.applicantparams.i_pangno,\n });\n\n if (!response.Dtinformation) return;\n if (!response.Dtinformation.length) {\n setFormValues({ BanksListShow: false });\n return;\n }\n\n const banks = response.Dtinformation;\n const bankDetails = banks[0];\n setFormValues({\n bankadd1: bankDetails.BankAdd1,\n bankadd2: bankDetails.BankAdd2,\n bankadd3: bankDetails.BankAdd3,\n IFSC: { value: bankDetails.ifsccode },\n \"Bank Name\": { value: bankDetails.BankName },\n \"Branch Address\": {\n value:\n bankDetails.BankAdd1 +\n \", \" +\n bankDetails.BankAdd2 +\n \" ,\" +\n bankDetails.BankAdd3,\n },\n \"Branch City\": { value: bankDetails.BankCity },\n \"Branch Pincode\": { value: bankDetails.BankPIN },\n \"Account Number\": { value: bankDetails.BankAcno },\n \"Confirm Account Number\": { value: bankDetails.BankAcno },\n });\n };\n\n const handleChange = (label) => (event) => {\n const value = event.target.value;\n switch (label) {\n case \"IFSC\":\n const alphanumericRegex = /^[A-Za-z0-9]+$/;\n setFormValues({\n [label]: {\n value: value.toUpperCase(),\n isError: !ifscRegex.test(value) || !alphanumericRegex.test(value),\n errorMessage: !value\n ? \"IFSC Number is Mandatory\"\n : !alphanumericRegex.test(value) ? \"Enter valid IFSC Number\"\n : !ifscRegex.test(value)\n ? \"Enter a valid IFSC Number\"\n : \"\",\n },\n });\n break;\n case \"Account Type\":\n setFormValues({\n [label]: {\n value: value,\n isError: value ? false : true,\n errorMessage: value ? \"\" : \"Enter a valid Account Typ\",\n },\n });\n break;\n case \"Branch Pincode\":\n setFormValues({\n [label]: {\n value,\n isError: !pincodeRegex.test(value),\n errorMessage: !value\n ? \"Pincode is Mandatory\"\n : !pincodeRegex.test(value)\n ? \"Enter a valid Pincode\"\n : \"\",\n },\n });\n break;\n // case \"Account Number\":\n // setFormValues({\n // [label]: {\n // value,\n // isError: !bankAccountRegex.test(value),\n // errorMessage: !value\n // ? \"Account Number is Mandatory\"\n // : !bankAccountRegex.test(value)\n // ? \"Enter a valid Account Number\"\n // : \"\",\n // },\n // });\n // break;\n case \"Confirm Account Number\":\n setFormValues({\n [label]: {\n value,\n isError: !(formValues[\"Account Number\"].value === value),\n errorMessage: !value\n ? \"Account Number is Mandatory\"\n : !(formValues[\"Account Number\"].value === value)\n ? \"Account Numbers does not match\"\n : \"\",\n },\n });\n break;\n default:\n setFormValues({ [label]: { value } });\n break;\n }\n };\n const getBankDetails = async () => {\n const { IFSC } = formValues;\n if (ifscRegex.test(IFSC.value)) {\n setFormValues({ isLoading: true });\n try {\n const response = await props.getInvestorBankDetails({ ifsc: IFSC.value });\n const { DtData } = response;\n const {\n BankName,\n BankAdd1,\n BankAdd2,\n BankAdd3,\n BankCity,\n BankPin,\n MicrNo,\n } = DtData[0];\n setFormValues({\n bankadd1: BankAdd1,\n bankadd2: BankAdd2,\n bankadd3: BankAdd3,\n \"Bank Name\": { value: BankName },\n \"Branch Address\": {\n value: BankAdd1 + \", \" + BankAdd2 + \" ,\" + BankAdd3,\n },\n \"Branch City\": { value: BankCity },\n \"Branch Pincode\": { value: BankPin },\n DisablingBankDetails: true\n // \"MICR Code\": { value: MicrNo },\n });\n } catch (error) {\n console.log(error);\n setFormValues({\n // AccountTypes: ValidAccountTypes[props.category_1],\n // \"Account Type\": {\n // value: ValidAccountTypes[props.category_1],\n // },\n IFSC: {\n value: \"\",\n isError: true,\n errorMessage: \"IFSC Not Found, Enter a valid IFSC Number\",\n },\n });\n } finally {\n setFormValues({ isLoading: false });\n }\n } else {\n setFormValues({\n IFSC: {\n isError: true,\n errorMessage: \"IFSC Not Found, Enter a valid IFSC Number\",\n },\n });\n }\n };\n const handleBankDetails = (event) => {\n setbankseleected(event.target.value);\n const bankDetails =\n !!props.getbankDetails.Dtinformation &&\n props.getbankDetails.Dtinformation.find(\n (ele) => ele.BankName === event.target.value\n );\n setFormValues({\n bankadd1: bankDetails.BankAdd1,\n bankadd2: bankDetails.BankAdd2,\n bankadd3: bankDetails.BankAdd3,\n IFSC: { value: bankDetails.ifsccode },\n \"Bank Name\": { value: bankDetails.BankName },\n \"Branch Address\": {\n value:\n bankDetails.BankAdd1 +\n \", \" +\n bankDetails.BankAdd2 +\n \" ,\" +\n bankDetails.BankAdd3,\n },\n \"Branch City\": { value: bankDetails.BankCity },\n \"Branch Pincode\": { value: bankDetails.BankPIN },\n \"Account Number\": { value: bankDetails.BankAcno },\n \"Confirm Account Number\": { value: bankDetails.BankAcno },\n \"Account Type\": {\n value: bankDetails.BnkAcType,\n },\n // value: ValidAccountTypes[bankDetails.BnkAcType]\n });\n };\n\n const submit = async () => {\n if (formValues[\"IFSC\"].isError) {\n return;\n }\n if (!!formValues.IFSC.value && !formValues[\"Account Type\"].value) {\n setFormValues({\n ...formValues,\n \"Account Type\": {\n value: \"\",\n isError: true,\n errorMessage: \"Account Type is mandatory\",\n },\n });\n return;\n }\n if (\n props.applicantparams.i_category === \"20\" &&\n [\"SAVING\", \"Savings\", \"Saving\", \"SAVINGS\", \"\"].includes(\n formValues[\"Account Type\"].value\n )\n ) {\n setFormValues({\n ...formValues,\n \"Account Type\": {\n value: \"\",\n isError: true,\n errorMessage: \"Select account type\",\n },\n });\n return;\n }\n\n if (\n formValues[\"Account Number\"].value.length > 0 &&\n formValues[\"Confirm Account Number\"].value.length > 0 &&\n formValues[\"Account Number\"].value !==\n formValues[\"Confirm Account Number\"].value\n ) {\n setFormValues({\n \"Confirm Account Number\": {\n value: \"\",\n isError: true,\n errorMessage: \"Account Numbers does not match\",\n },\n });\n return;\n }\n if (formValues[\"Account Type\"].value === \"NRE\") {\n props.applicantparams[\"i_category\"] = \"21\";\n props.storeApplicantParams(props.applicantparams);\n }\n if (formValues[\"Account Type\"].value === \"NRO\") {\n props.applicantparams[\"i_category\"] = \"22\";\n props.storeApplicantParams(props.applicantparams);\n }\n\n const { AccountTypes, isLoading, bankadd1, bankadd2, bankadd3, ...others } =\n formValues;\n const invdetails = {\n i_ifsccode: formValues.IFSC?.value || \"\",\n // i_micrcode: formValues[\"MICR Code\"]?.value || \"\",\n i_bnkacname: formValues[\"Bank Name\"]?.value || \"\",\n i_bnkadd1: formValues.bankadd1 || \"\",\n i_bnkadd3: formValues.bankadd3 || \"\",\n i_bnkadd2: formValues.bankadd2 || \"\",\n i_bnkcity: formValues[\"Branch City\"]?.value || \"\",\n i_bnkpin: formValues[\"Branch Pincode\"]?.value || \"\",\n i_bnkacctype: formValues[\"Account Type\"]?.value || \"\",\n i_bnkacno: formValues[\"Account Number\"]?.value || \"\",\n };\n props.storeInvestmentDetails({ ...formValues });\n props.storeInvestmentParams({ ...invdetails });\n props.history.replace(BUILD_URL + \"/new-investor-transaction/scheme-details\");\n };\n const { AccountTypes, isLoading } = formValues;\n return (\n <>\n \n \n {bankList.map((item, index) => (\n \n ))}\n \n
\n )} */}\n\n {InputFields.map((section) => (\n \n {section.map((field) => (\n console.log(field)}\n >\n {!!field.type ? (\n \n {AccountTypes.map((i, index) => (\n \n ))}\n \n )}\n
\n ))}\n \n ))}\n <>\n \n {\n props.history.replace(BUILD_URL + \"/new-investor-transaction/nominee-details\");\n }}\n >\n BACK\n \n \n PROCEED\n \n
\n \n );\n};\nexport default connect(\n ({ newinvestor }) => {\n const { investmentDetails, applicantparams, getbankDetails } = newinvestor;\n return {\n investmentDetails,\n applicantparams,\n getbankDetails,\n };\n },\n {\n getInvestorBankDetails,\n storeInvestmentDetails,\n storeInvestmentParams,\n getBankList,\n NewinvestorBankDetails,\n getAccountTypes,\n storeApplicantParams\n }\n)(BankDetails);\n","import React from \"react\";\nimport { connect } from \"react-redux\";\nimport { Route, Switch , Router } from \"react-router\";\n\nimport VerticalStepper from \"./lib/VerticalStepper\";\nimport FatcaDetails from \"./FatcaDetails\";\nimport SchemeDetails from \"./SchemeDetails\";\nimport InvestorDetails from \"./InvestorDetails\";\nimport Signbutton from \"../../../forms/button\";\nimport { NEW_TRANSACTION_URL } from \"..\";\nimport NomineeDetails from \"./NomineeDetails\";\nimport BankDetails from \"./BankDetails\";\n\nconst NewInvestorRegistration = (props) => {\n const { location } = props;\n const { pathname } = location;\n const activestep = pathname.split(\"/\").slice(-1)[0];\n const hide = pathname.includes(\"first-time-new-investor-journey\");\n return (\n \n
\n );\n};\n\nexport default connect(null)(NewInvestorRegistration);\n","import React, { Component } from \"react\";\nimport { Route, Switch, Redirect } from \"react-router-dom\";\nimport Amc from \"./amc\";\nimport Nav from \"./nav\";\nimport MailBack from \"./mailBackRequest\";\nimport TransactionHistory from \"./transactionHistory\";\nimport Social from \"./social\";\n// import Support from \"./support\";\nimport Settings from \"./settings\";\n// import FeedBack from \"./feedback\";\nimport DashboardComponent from \"./dashboard/index\";\nimport InvestorComponent from \"./investors/index\";\nimport TransactionComponent from \"./transactions/index\";\nimport MailbackRouter from \"./mailBackRequest/mailBackRoutes\";\nimport MyEarnings from \"./myEarnings/index\";\nimport EKYC from \"../home/transactions/ekycForm\";\nimport { connect } from \"react-redux\";\nimport MailBackComponent from \"./mailBackRequest/mailback\";\nimport nfoFunds from \"./dashboard/nfoFunds\";\nimport NfoTransaction from \"./dashboard/NfoTransaction\";\nimport NewInvestorRegistration from \"./transactions/newInvestor/NewInvestorRegistration\";\nclass AppRouter extends Component {\n render() {\n return (\n \n
\n \n \n \n \n \n
\n \n Mutual Fund investments are subject to market risks, read all scheme\n related documents carefully.\n
{\" \"}\n \n © 2021, JM FINANCIAL MUTUAL FUND, All rights\n reserved.\n
\n \n );\n }\n}\n","import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { withStyles } from \"@material-ui/core/styles\";\nimport Drawer from \"@material-ui/core/Drawer\";\nimport CssBaseline from \"@material-ui/core/CssBaseline\";\nimport AppBar from \"@material-ui/core/AppBar\";\nimport Toolbar from \"@material-ui/core/Toolbar\";\nimport Divider from \"@material-ui/core/Divider\";\nimport AppRouter from \"./appRoutes\";\nimport { drawerStyles } from \"./appCss\";\nimport List from \"@material-ui/core/List\";\nimport Tooltip from \"@material-ui/core/Tooltip\";\nimport ListItem from \"@material-ui/core/ListItem\";\nimport ListItemText from \"@material-ui/core/ListItemText\";\nimport Collapse from \"@material-ui/core/Collapse\";\nimport ExpandLess from \"@material-ui/icons/ExpandLess\";\nimport ExpandMore from \"@material-ui/icons/ExpandMore\";\nimport { connect } from \"react-redux\";\nimport { userLogout } from \"shared/store/actions\";\nimport { getProfileData } from \"shared/store/actions/profile\";\nimport { INVESTOR_URL } from \"./investors\";\nimport { NEW_TRANSACTION_URL } from \"./transactions\";\nimport { MAILBACK_URL } from \"./mailBackRequest\";\nimport { NAV_URL } from \"./nav\";\nimport { HISTORY_URL } from \"./transactionHistory\";\nimport CustomLoading from \"../home/CustomLoader\";\nimport { MyEarnings_URL } from \"./myEarnings\";\n\nimport {\n dashboardActive,\n investorsActive,\n newTransactionActive,\n navActive,\n mailBackActive,\n transactionHistoryActive,\n ekycActive,\n earningsActive,\n supportActive,\n settingsActive,\n dashboardInActive,\n investorsInActive,\n newTransactionInActive,\n navInActive,\n mailBackInActive,\n transactionHistoryInActive,\n ekycInActive,\n earningsInActive,\n supportInActive,\n settingsInactive,\n LOGOUT_ICON,\n APP_LOGO,\n second_app_logo,\n} from \"../forms/appEssentials\";\nimport Footer from \"../auth/footer\";\n\nexport const BUILD_URL = process.env.PUBLIC_URL;\nexport const EKYC_URL = `${process.env.PUBLIC_URL}/e-KYC`;\nclass PermanentDrawerLeft extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n open: false,\n pathname: \"\",\n responsiveDrawer: false,\n };\n }\n componentDidMount() {\n this.props.getProfileData({\n Agent: this.props.token,\n UserId: this.props.userId,\n });\n }\n handleClick = () => {\n this.setState({\n open: !this.state.open,\n });\n this.props.history.push(MAILBACK_URL);\n };\n\n goToRoute = (path) => () => {\n this.props.history.push(path);\n // if (!path.includes(MAILBACK_URL)) {\n this.setState({\n open: false,\n responsiveDrawer: false,\n });\n // }\n };\n\n logOut = () => {\n this.props.userLogout();\n this.props.history.replace(BUILD_URL + \"/\");\n };\n\n openResponsiveDrawer = () => {\n this.setState({\n responsiveDrawer: !this.state.responsiveDrawer,\n });\n };\n render() {\n const { classes, location, tran_enable_flag } = this.props;\n const { responsiveDrawer } = this.state;\n const { pathname } = location;\n return (\n \n \n \n \n Logged as :{\" \"}\n \n {\" \"}\n {this.props.userId}\n \n
\n \n \n \n
\n \n \n \n\n \n
\n \n
\n \n
\n \n {/*
\n Logged in as
\n Distributor
*/}\n \n {!!this.props.userId\n ? this.props.userId\n .split(\" \")\n .reduce(\n (p, c) => p.concat(c.charAt(0).toUpperCase()),\n \"\"\n )\n : \"\"}\n
\n \n
\n \n {this.props.profileData.Distributor_Name}\n
\n \n
\n \n
\n\n ARN Code:
\n \n
\n \n {this.props.token}\n
\n \n \n \n Dashboard\n
\n \n - \n
\n \n \n New Transaction\n
\n \n \n )}\n \n \n\n \n
\n \n
\n \n \n
\n \n {!!this.props.userId\n ? this.props.userId\n .split(\" \")\n .reduce((p, c) => p.concat(c.charAt(0).toUpperCase()), \"\")\n : \"\"}\n
\n \n
\n \n {this.props.profileData.Distributor_Name}\n
\n \n
\n \n
\n\n ARN Code:
\n \n
\n \n {this.props.token}\n
\n \n \n \n Dashboard\n
\n \n - \n
\n \n \n Transact\n
\n \n \n )}\n \n \n \n \n \n \n 
\n \n\n {/* \n 
\n */}\n {/*
*/}\n \n {/* \n \n Home\n \n\n \n About\n \n
\n\n \n Contact us\n \n \n \n \n Client Services\n \n
\n \n \n
\n \n {ServicesArray.map((ele, index) => (\n \n {ele.title}\n \n ))}\n
\n \n \n {CarsouelArray.map((ele, index) => (\n \n 
\n \n ))}\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport Appbar from \"./appbar\";\nimport Signbutton from \"../forms/button\";\nimport { Input } from \"../forms/input\";\nimport DemoCarousel from \"../auth/carsouel\";\nimport { connect } from \"react-redux\";\nimport {\n userLogin,\n generateLoginOtp,\n validateLoginOtp,\n passwordPolicy_JMF,\n} from \"shared/store/actions\";\nimport { REQ_BY } from \"shared/store/types\";\nimport { DASHBOARD_URL } from \"../home/dashboard\";\nimport { BUILD_URL } from \"../home/home\";\n\nimport CustomLoader from \"../forms/customLoader\";\n\nimport { getProfileData } from \"shared/store/actions/profile\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../forms/appEssentials\";\nvar jwt = require(\"jsonwebtoken\");\nvar token1;\nvar token2;\n\nclass Login extends Component {\n constructor(props) {\n super(props);\n this.state = {\n username: { value: \"\" },\n otp: { value: \"\" },\n password: { value: \"\" },\n showPassword: false,\n PosterOpen: true,\n display: false,\n displayPassword: false,\n disabled: false,\n arncode: \"\",\n flag: \"\",\n MobileNo: \"\",\n email: \"\",\n };\n }\n\n changeValue = (label) => (event) => {\n if (event.target.value.length <= 70) {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n strongRegex = new RegExp(\n \"^(?=.*?[A-Z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$\"\n );\n\n showError = (label) => async (event) => {\n const {\n [label]: { value },\n } = this.state;\n this.setState({\n [label]: {\n value,\n isError: !value,\n errorMessage: `${\n label === \"username\"\n ? \"User ID\"\n : label === \"password\"\n ? \"Password\"\n : label\n } is mandatory`,\n },\n });\n if (!!this.state.password.value) {\n if (!this.strongRegex.test(this.state.password.value)) {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage:\n \"Password should be minimum 8 characters in length and should consist of at least One Capital alphabet, One Small alphabet, One Special Character and One numeric number\",\n },\n });\n }\n }\n };\n keyDown = (label) => (event) => {\n if (event.key === \"Enter\") {\n if (label === \"username\") {\n this.otpField.focus();\n } else if (label === \"otp\") {\n this.validateOtp();\n } else if (label === \"password\") {\n this.signIn();\n }\n event.preventDefault();\n }\n };\n signIn = async () => {\n const {\n showPassword,\n PosterOpen,\n display,\n disabled,\n MobileNo,\n otp,\n displayPassword,\n flag,\n arncode,\n email,\n nonce,\n OTPnonce,\n ...others\n } = this.state;\n const keys = Object.keys(others);\n const Noerrors = keys.every((key) => {\n return !!this.state[key].value;\n });\n if (!Noerrors) {\n keys.forEach((key) => {\n !this.state[key].value &&\n this.setState({\n [key]: {\n ...this.state[key],\n isError: true,\n errorMessage: `${key === \"username\"\n ? \"User ID\"\n : key === \"password\"\n ? \"Password\"\n : key\n } is mandatory`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !this.state[key].value);\n switch (firstErroredKey) {\n case \"username\":\n this.usernameField.focus();\n break;\n case \"password\":\n this.passwordField.focus();\n break;\n }\n } else {\n const nonce = Math.floor(100000 + Math.random() * 900000);\n this.setState({\n display: true,\n nonce,\n });\n // const params = {\n // Uid: this.state.username.value,\n // Password:this.state.password.value,\n // };\n // const responsedata = await this.props.passwordPolicy_JMF(params);\n const payload = {\n username: encrypt(this.state.username.value),\n password: encrypt(this.state.password.value),\n ReqBy: \"M\",\n nonce: encrypt(nonce),\n token: token2.token\n };\n const response = await this.props.userLogin(payload);\n if (response && String(response?.nonce) !== String(this.state.nonce)) {\n this.setState({\n display: false,\n username: { value: \"\" },\n password: { value: \"\" },\n });\n alert(\"Unauthorized Request\");\n return;\n }\n\n if (\n !!response &&\n !response.error &&\n !!response.DtData &&\n response.DtData.length > 0\n ) {\n const DtData = response.DtData;\n if (DtData[0].tran_enable_flag === \"N\") {\n this.props.history.push(DASHBOARD_URL);\n } else {\n this.props.history.push(`${process.env.PUBLIC_URL}/new-transaction`);\n }\n } else if (!response) {\n this.setState({\n display: false,\n\n password: {\n value: \"\",\n isError: true,\n errorMessage: \"Incorrect Password\",\n },\n });\n }\n }\n };\n closePoster = () => {\n this.setState({\n PosterOpen: false,\n });\n };\n generateOtp = async () => {\n const userName = this.state.username.value;\n if (!!userName) {\n try {\n this.setState({ display: true });\n const payload = {\n Userid: encrypt(userName),\n };\n const response = await this.props.generateLoginOtp(payload);\n if(!!response.token){\n token1 = response;\n const { Email, Mobile } = jwt.decode(token1.token);\n this.setState({\n MobileNo: !!Mobile ? Mobile : \"\",\n email: !!Email ? Email : \"\",\n })\n }\n\n } catch (e) {\n alert(e);\n } finally {\n this.setState({ display: false });\n }\n } else {\n this.setState({\n username: {\n value: \"\",\n isError: true,\n errorMessage: \"User ID is mandatory\",\n },\n });\n this.usernameField.focus();\n }\n };\n validateOtp = async () => {\n const otp = this.state.otp.value;\n if (!!otp) {\n try {\n const OTPnonce = Math.floor(100000 + Math.random() * 900000);\n this.setState({ display: true, OTPnonce });\n const payload = {\n Otp: encrypt(otp),\n token: token1.token,\n OTPnonce: encrypt(OTPnonce)\n };\n const response = await this.props.validateLoginOtp(payload);\n if (!!response && !!response?.OTPnonce && String(response?.OTPnonce) !== String(this.state.OTPnonce)) {\n this.setState({\n display: false,\n username: { value: \"\" },\n password: { value: \"\" },\n otp: { value: \"\" }\n });\n alert(\"Unauthorized Request\");\n return;\n }\n if (!response.error) {\n this.setState({ displayPassword: true, disabled: true });\n token2 = response;\n }\n } catch (e) {\n alert(e);\n } finally {\n this.setState({ display: false });\n }\n }\n };\n maskMobileNumber = (number) => {\n if (number.length <= 6) return 'xxxxxx'; \n return 'xxxxxx' + number.slice(6);\n };\n\n maskEmail = (email) => {\n const [username, domain] = email.split('@');\n if (username.length <= 6) {\n return username.padStart(username.length + 6, 'x') + '@' + domain; \n } else {\n return 'xxxxxx' + username.slice(6, username.length - 4) + username.slice(-4) + '@' + domain; \n }\n };\n render() {\n const { username, password, otp } = this.state;\n return (\n \n {ele.title}\n
\n \n {ele.desci}\n
\n\n \n {/*
\n \n \n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { token, UserId, userLogout } = authReducer;\n return { token };\n },\n {\n userLogin,\n getProfileData,\n generateLoginOtp,\n validateLoginOtp,\n passwordPolicy_JMF,\n }\n)(Login);\n\nexport class Redtoolbar extends Component {\n render() {\n const features = [\n { name: \"Home\" },\n { name: \"About Us\" },\n { name: \"NAVs and Dividends\" },\n { name: \"Products\" },\n { name: \"Home\" },\n { name: \"Downloads\" },\n { name: \"Knowledge center\" },\n { name: \"Distributor Corner\" },\n { name: \"Transact Online\" },\n { name: \"Customer Services\" },\n ];\n return (\n \n \n If you have access to Kfintech common portal then request you to\n use the same credentials to Sign In\n \n\n \n \n Terms and Conditions*\n \n \n Support:\n \n distributorcare@jmfl.com\n \n
\n \n {\n this.setState({\n showPassword: !this.state.showPassword,\n });\n }}\n isShowError={password.isError}\n inputref={(ele) => (this.passwordField = ele)}\n onKeyDown={this.keyDown(\"password\")}\n />\n \n this.props.history.push(BUILD_URL + \"/forgot-password\")\n }\n >\n Forgot Password?\n
\n \n )}\n {this.state.displayPassword ? (\n \n (this.usernameField = ele)}\n onKeyDown={this.keyDown(\"username\")}\n />\n\n \n this.props.history.push(BUILD_URL + \"/forgot-userid\")\n }\n >\n Forgot User ID?\n
\n {this.state.MobileNo.length > 0 && (\n SIGN IN
\n \n OTP has been sent to {this.maskMobileNumber(this.state.MobileNo)} and {this.maskEmail(this.state.email)}\n
\n )\n }\n \n (this.otpField = ele)}\n onKeyDown={this.keyDown(\"otp\")}\n />\n
\n\n {this.state.displayPassword && (\n <>\n \n Don't have an account?{\" \"}\n \n this.props.history.push(BUILD_URL + \"/register\")\n }\n >\n SIGN UP\n \n
\n \n {features.map((ele, index) => (\n
\n );\n }\n}\n\nfunction encrypt(text) {\n const str = \"acgredf7e2e\";\n const str1 = \"hseckahdfis234te\";\n const decode = btoa(text);\n const encrpytion1 = str + decode + str1;\n const encrpyted = btoa(encrpytion1);\n return encrpyted;\n}\n","import React, { Component } from \"react\";\nimport Appbar from \"./appbar\";\nimport Signbutton from \"../forms/button\";\nimport { Input } from \"../forms/input\";\nimport DemoCarousel from \"../auth/carsouel\";\nimport { connect } from \"react-redux\";\nimport { generateOtp } from \"shared/store/actions\";\nimport { BUILD_URL } from \"../home/home\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../forms/appEssentials\";\nimport Footer from \"./footer\";\nimport { RepeatOneSharp } from \"@material-ui/icons\";\nclass Register extends Component {\n constructor(props) {\n super(props);\n this.state = {\n userId: { value: \"\" },\n arnCode: { value: \"\" },\n password: { value: \"\" },\n confirmPassword: { value: \"\" },\n showPassword: false,\n confirmShowPassword: false,\n };\n }\n\n changeValue = (label) => (event) => {\n if (label === \"arnCode\") {\n if (event.target.value.length <= 20)\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label != \"arnCode\") {\n this.setState({\n [label]: { value: event.target.value },\n });\n }\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n if (label == \"userId\") {\n if (this.state.userId.value === \"\") {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: \"User Id is Mandatory\",\n },\n });\n }\n }\n if (label == \"arnCode\") {\n if (this.state.arnCode.value === \"\") {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: \"ARN Code is Mandatory\",\n },\n });\n }\n if (/^[0-9]{4,6}$/.test(this.state.arnCode.value)) {\n this.setState({\n [label]: {\n value,\n isError: false,\n errorMessage: \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `ARN code should be a min of 4 digits and a max of 6 digits.`,\n },\n });\n }\n }\n if (label == \"password\") {\n if (this.state.password.value === \"\") {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: \"Password is Mandatory\",\n },\n });\n }\n if (\n /^(?=.*\\d)(?=.*[!@#$%^&*])(?=.*[a-z])(?=.*[A-Z]).{8,}$/.test(\n this.state.password.value\n )\n ) {\n this.setState({\n [label]: {\n value,\n isError: false,\n errorMessage: \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: `Password should be minimum 8 characters in length and should consist of at least One Capital alphabet, One Small alphabet, One Special Character and One numeric number`,\n },\n });\n }\n }\n if (label == \"confirmPassword\") {\n if (this.state.confirmPassword.value === \"\") {\n this.setState({\n [label]: {\n value,\n isError: true,\n errorMessage: \"Confirm Password is Mandatory\",\n },\n });\n }\n }\n };\n keyPress = (label) => (e) => {\n if (e.key === \"Enter\") {\n // Do code here\n if (label === \"userId\") {\n this.arnCodeField.focus();\n } else if (label === \"arnCode\") {\n this.passwordField.focus();\n } else if (label === \"password\") {\n this.confirmPasswordField.focus();\n } else {\n this.generateOtp();\n }\n e.preventDefault();\n }\n };\n\n generateOtp = async () => {\n const { showPassword, confirmShowPassword, ...others } = this.state;\n const keys = Object.keys(others);\n const findError = keys.every((key) => {\n return !!this.state[key].value;\n });\n const isPasswordEqual =\n this.state.password.value === this.state.confirmPassword.value;\n if (!findError) {\n keys.forEach((key) => {\n !this.state[key].value &&\n this.setState({\n [key]: {\n ...this.state[key],\n isError: true,\n errorMessage: `${\n key === \"userId\"\n ? \"User ID\"\n : key === \"password\"\n ? \"Password\"\n : key === \"arnCode\"\n ? \"ARN Code\"\n : key === \"confirmPassword\"\n ? \"Confirm Password\"\n : key\n } is mandatory`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !this.state[key].value);\n switch (firstErroredKey) {\n case \"userId\":\n this.userIdField.focus();\n break;\n case \"password\":\n this.passwordField.focus();\n break;\n case \"arnCode\":\n this.arnCodeField.focus();\n break;\n case \"confirmPassword\":\n this.confirmPasswordField.focus();\n break;\n }\n return;\n }\n if (!/^[0-9]{4,6}$/.test(this.state.arnCode.value)) {\n this.setState({\n arnCode: {\n ...this.state.arnCode,\n isError: true,\n errorMessage:\n \"ARN code should be a min of 4 digits and a max of 6 digits.\",\n },\n });\n this.arnCodeField.focus();\n return;\n }\n if (\n !/^(?=.*\\d)(?=.*[!@#$%^&*])(?=.*[a-z])(?=.*[A-Z]).{8,}$/.test(\n this.state.password.value\n )\n ) {\n this.setState({\n password: {\n ...this.state.password,\n isError: true,\n errorMessage: \"Enter valid Password\",\n },\n });\n this.passwordField.focus();\n return;\n }\n if (this.state.userId.value === this.state.password.value && this.state.userId.value.length > 7) {\n this.setState({\n password: {\n ...this.state.password,\n isError: true,\n errorMessage: \"Password should not consist of username/loginname\",\n },\n });\n return;\n }\n if (!isPasswordEqual) {\n this.setState({\n confirmPassword: {\n ...this.state.confirmPassword,\n isError: true,\n errorMessage: \"Passwords don't match\",\n },\n });\n this.confirmPasswordField.focus();\n return;\n }\n\n const payload = {\n UserId: this.state.userId.value,\n ARNCode: `ARN-${this.state.arnCode.value}`,\n OTPMsg: Math.floor(100000 + Math.random() * 900000),\n };\n const response = await this.props.generateOtp(payload);\n if (\n response.error === \"User id already exists for this ARN code.\" ||\n response.error ===\n \"The ARN number mentioned has an active user Id, If you don’t remember your user id, you can use forgot user id to retrieve your Id.\"\n ) {\n alert(\n \"The ARN number mentioned has an active user Id, If you don’t remember your user id, you can use forgot user id to retrieve your Id.\"\n );\n this.setState({\n userId: { value: \"\" },\n arnCode: { value: \"\" },\n password: { value: \"\" },\n confirmPassword: { value: \"\" },\n });\n return;\n }\n if (response.error === \"Invalid ARN code.\") {\n alert(\"Enter valid ARN Code\");\n return;\n }\n if (!!response) {\n this.props.history.push({\n pathname: BUILD_URL + \"/otp\",\n state: { payload: { ...payload, password: this.state.password.value } },\n });\n }\n };\n\n render() {\n const { userId, password, arnCode, confirmPassword } = this.state;\n\n return (\n \n \n
\n ))}\n \n {ele.name}
\n \n
\n );\n }\n}\n\nexport default connect(null, { generateOtp })(Register);\n","import React, { Component } from \"react\";\nimport Appbar from \"./appbar\";\nimport DemoCarousel from \"../auth/carsouel\";\nimport Footer from \"./footer\";\n\nexport default class CommonTemplate extends Component {\n render() {\n const { title, textOne, textTwo } = this.props;\n return (\n \n
\n \n
\n \n \n this.setState({\n showPassword: !this.state.showPassword,\n })\n }\n image={\"/images/locked.svg\"}\n image2={!!this.state.showPassword ? EYE_ICON : EYE_ICON_HIDDEN}\n value={password.value}\n onChange={this.changeValue(\"password\")}\n onBlur={this.showError(\"password\")}\n isShowError={password.isError}\n inputref={(ele) => (this.passwordField = ele)}\n onKeyPress={this.keyPress(\"password\")}\n />\n \n this.setState({\n confirmShowPassword: !this.state.confirmShowPassword,\n })\n }\n image={\"/images/locked.svg\"}\n image2={\n !!this.state.confirmShowPassword ? EYE_ICON : EYE_ICON_HIDDEN\n }\n value={confirmPassword.value}\n onChange={this.changeValue(\"confirmPassword\")}\n onBlur={this.showError(\"confirmPassword\")}\n isShowError={confirmPassword.isError}\n inputref={(ele) => (this.confirmPasswordField = ele)}\n onKeyPress={this.keyPress(\"confirmPassword\")}\n />\n \n If you have access to Kfintech common portal then request you to\n use the same credentials to Sign In\n \n {/*
\n SIGN UP
\n \n (this.userIdField = ele)}\n onKeyPress={this.keyPress(\"userId\")}\n />\n
\n \n (this.arnCodeField = ele)}\n onKeyPress={this.keyPress(\"arnCode\")}\n />\n
\n\n \n * Password should be at least\n 8 characters in length & should contain at least 1 uppercase\n alphabet (A-Z), 1 special character and 1 numeric character\n
\n \n Already have an account?{\" \"}\n this.props.history.push(BUILD_URL + \"/login\")}\n >\n SIGN IN\n \n
\n \n \n Terms and Conditions*\n \n
*/}\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport Signbutton from \"../forms/button\";\nimport { OtpInput } from \"../forms/input\";\nimport { registration, generateOtp } from \"shared/store/actions\";\nimport { connect } from \"react-redux\";\nimport { BUILD_URL } from \"../home/home\";\nimport CommonTemplate from \"./commonTemplate\";\nclass OTP extends Component {\n constructor(props) {\n super(props);\n const { OTPMsg, UserId, ARNCode, password } =\n !!this.props.location.state && !!this.props.location.state.payload\n ? this.props.location.state.payload\n : {};\n this.state = {\n otpMsg: OTPMsg,\n UserId,\n ARNCode,\n password\n };\n }\n\n regenerteOtp = async () => {\n const { UserId, ARNCode } = this.state;\n const OTPMsg = Math.floor(100000 + Math.random() * 900000);\n const params = {\n UserId,\n ARNCode,\n OTPMsg\n };\n const response = await this.props.generateOtp(params);\n if (response) {\n this.setState({\n otpMsg: OTPMsg\n });\n alert(\"An Otp has been resent to your registered Mobile Number\");\n }\n };\n\n submitOtp = async enteredOtp => {\n const { otpMsg, UserId, password, ARNCode } = this.state;\n if (Number(enteredOtp.join(\"\")) === otpMsg) {\n const params = {\n Username: UserId,\n DistCode: ARNCode,\n Password: password\n };\n const response = await this.props.registration(params);\n if (response) {\n this.props.history.push(BUILD_URL + \"/login\");\n }\n } else {\n alert(\"Please enter valid otp\");\n }\n };\n\n render() {\n return (\n \n
\n \n
\n {title}
\n {textOne}
\n {textTwo}
\n {this.props.children}\n \n {Array(6)\n .fill(0)\n .map((item, index) => (\n (this[`textInput${index}`] = ele)}\n onKeyPress={this.keyPress}\n onKeyDown={this.keyDown(index)}\n />\n ))}\n
\n \n * Password should be atleast 8\n characters length & should contain atleast 1 uppercase alphabet(A-Z),1\n special character& 1 numeric character\n
\n