{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}
\n {this.props.uptext && (\n \n
\n {!!this.props.errorMessage && (\n \n {props.children}\n
\n );\n}\n\nfunction Menu(props) {\n return (\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}{\" \"}\n
\n \n {!!image2 && (\n
\n \n {isShowError\n ? errorMessage || ` is required.`\n : isShowPasswordError\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 );\n }\n}\n\nexport class OtpInput extends Component {\n render() {\n const { inputref, ...rest } = this.props;\n return (\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 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 \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 this.submit()}\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\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\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 : `The entered PAN is not KYC-Compliant. Please click \"Continue\" to proceed for doing eKYC`}\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 ? this.props.error\n : \"Your request has been successfully submitted\"}\n \n {this.props.cas === true\n ? \"A mail will be sent to the investor within 30 minutes.\"\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 Successfully Initiated Transaction\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 number\n \n {\" \"}\n {this.props.refNo}\n \n .{\" \"}\n {this.props.myself === true ? \"Distributor\" : \"Investor\"}{\" \"}\n will receive an email for approval.\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 {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 : `Successfully Initiated Transaction`}\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 investor will receive an email for approval.\n
\n \n {!!this.props.reqtype ? (\n
\n )}\n \n the transaction for {this.props.reqtype}{\" \"}\n with the IHNO : ${this.props.Nctihno} has been initiated\n 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 and\n 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 Would you like to do another transaction ?
}\n\n \n {!!this.props.Transaction?\n
\n \n \n \n );\n }\n}\n\nexport class SipCancelModal extends Component {\n render() {\n return (\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}\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 \n \n {!!data && !!data[0]?data[0].Units : \"\"}\n
\n \n Units\n
\n \n \n {!!data && !!data[0]?data[0].NAV : \"\"}\n
\n \n \n \n Price (NAV)\n
\n \n
\n \n \n {!!data && !!data[0]?data[0].NavDate : \"\"}\n
\n \n Nav Date\n
\n \n \n {!!data && !!data[0]?data[0].trs_acno : \"\"}\n
\n \n \n \n \n Folio Number\n
\n \n
\n \n \n Transaction Completion\n
\n \n
\n \n \n Transaction Status\n
\n \n \n
\n \n \n
\n Payment Confirmation
\n {/* \n {!!data && !!data[0]?data[0].PaymentDate:\"\"}\n
*/}\n {/* Via {!!data && !!data[0]?data[0].MFPaymentMode:\"-\"}
*/}\n \n
\n \n \n
\n Units Allotment
\n \n
\n \n \n \n \n \n
\n );\n }\n}\nexport const RejectionReason = (props) => {\n return (\n \n
\n \n Successfully Re-Initiated Transaction\n
\n \n
\n \n
\n \n Transaction for {this.props.componentName}{\" \"}\n has been initiated Successfully.\n
\n \n Your investor will receive the details via an mail and sms with\n reference number\n \n {!!this.props.refNo ? this.props.refNo : \"\"}\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 CustomizedSelect from \"../home/transactions/customizedSelect\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\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 schemeSearch,\n ditSchemeDetails,\n getInvestors,\n getInvestorDetails,\n checkKyc,\n storeFundState,\n storeKYCData,\n userPan,\n clearingFirstTimeInvestorJourney,\n storeCurrentPage\n} from \"shared/store/actions\";\nimport { KycNotDoneDialog } from \"./customModal\";\n\nexport const NEW_TRANSACTION_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\" : \"name\",\n inputValue: \"\",\n errorMessage: \"\",\n scheme: { value: \"\" },\n schemeOptions: [],\n };\n }\n async componentDidMount() {\n const { fundstate } = this.props;\n if (!!fundstate) {\n this.setState({\n ...fundstate,\n radioValue: \"pan\",\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 handleRadioChange = async (event) => {\n this.props.storeCurrentPage(1);\n this.setState({\n radioValue: event.target.value,\n inputValue: \"\",\n errorMessage: \"\",\n });\n this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\n });\n if (event.target.value === \"fund\") {\n const params = {\n fund: \"176\",\n agentcode: this.props.token,\n };\n const response = await this.props.ditSchemeDetails(params);\n const { DtData } = response;\n this.setState({\n schemeOptions: DtData || [],\n });\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(inputValue === \"\") {\n this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\n });\n return\n }\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 this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\n });\n } else if (radioValue === \"name\" && !inputValue) {\n this.setState({\n errorMessage: \"(Please enter a Valid name)\",\n });\n this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\n });\n } else if (radioValue === \"folio\" && !inputValue) {\n this.setState({\n errorMessage: \"(Please enter a Valid Folio)\",\n });\n this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\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 this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\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 a Valid Email ID\",\n });\n this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: this.props.selectedTab,\n });\n } else if (radioValue === \"fund\" && !inputValue) {\n this.setState({\n errorMessage: \"(Please enter a Valid Fund)\",\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 && 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\") && (this.state.inputValue.charAt(3) !== \"H\")) {\n this.setState({\n errorMessage: \"Non Indivdual PAN is not allowed to transact\",\n });\n }\n } else {\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 Investorresponse = await this.props.getInvestorDetails(\n params,\n true\n );\n\n if (!!Investorresponse && !Investorresponse.error) {\n // this.props.history.push({\n // pathname: process.env.PUBLIC_URL + \"/investors/transction-types\",\n // pan: this.state.radioValue === \"pan\"?this.state.inputValue: !!response &&\n // !!response.Dtdata &&\n // !!response.Dtdata[0] &&\n // !!response.Dtdata[0].Pan\n // ? response.Dtdata[0].Pan:\"\",\n // });\n } else {\n if (this.state.radioValue === \"pan\") {\n const kycResponse = await this.props.checkKyc(\n {\n fund: \"176\",\n userid: this.props.userId,\n i_pan: this.state.inputValue,\n },\n true\n );\n\n const {\n DtData: [info],\n } = kycResponse;\n await this.props.storeKYCData(info)\n await this.props.clearingFirstTimeInvestorJourney();\n if (info.KYCBlock === \"N\") {\n await this.props.clearingFirstTimeInvestorJourney();\n\n this.props.history.push({\n pathname: \"/new-investor-transaction/investor-details\",\n\n // pathname: NEW_TRANSACTION_URL + \"/transction-types\",\n state: {\n pan: !!this.state.inputValue ? this.state.inputValue : \"\",\n },\n });\n await this.props.userPan(this.state.inputValue);\n\n } else {\n this.setState({ openModal: true });\n }\n } else {\n alert(\"No Data Found\");\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 handleschemeOptions = async (event) => {\n const schemeoption = event.target.value;\n this.setState({\n scheme: { value: schemeoption },\n });\n const params = {\n fund: \"176\",\n scheme: schemeoption,\n agentcode: this.props.token,\n };\n const response = await this.props.schemeSearch(params);\n if (!!response && response.error) {\n alert(response.error);\n }\n this.props.storeFundState(this.state);\n };\n\n render() {\n const { count } = this.props;\n return (\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 {count === 0 && (\n \n \n \n \n \n {\n \n
\n \n {this.state.radioValue !== \"fund\" && (\n Search by :
\n \n
\n }\n Name
\n \n
\n PAN
\n \n
\n Folio No.
\n \n
\n Mobile
\n \n
\n Email ID
\n \n
\n \n Fund
\n \n
\n )}\n {this.state.radioValue === \"fund\" && (\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 \n {this.state.schemeOptions.map((item, index) => (\n \n ))}\n \n
\n )}\n \n )}\n {!!this.state.errorMessage ? (\n \n {index === 0 && (\n \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,schemeSearch,storeFundState,nctInvestorslist} 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 { fundstate } = this.props;\n const response = await this.props.getInvestors({\n ARN: this.props.token,\n AllFavFlag: ALL\n });\n if(this.props.location.pathname.includes(\"nct\")){\n await this.props.nctInvestorslist()\n }\n if (!!fundstate && !!Object.keys(fundstate).length) {\n if (!!fundstate.scheme.value) {\n const params = {\n fund: \"176\",\n scheme: fundstate.scheme.value,\n agentcode: this.props.token,\n }\n const response = await this.props.schemeSearch(params)\n if (!!response && response.error) {\n alert(response.error);\n }\n }\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 console.log(\"this.props,\",this.props)\n return (\n \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 {props.active === INVESTMENTS && (\n <>\n setIsChecked((p) => !p)}\n checked={isChecked}\n />\n \n Include Zero Holdings\n \n \n )}\n \n
\n
\n );\n};\n\nconst cellStyleBase = {\n padding: \"20px 10px\",\n color: \"#2f3953\",\n fontSize: 15,\n fontFamily: \"Ubuntu-Regular\",\n};\n\nconst cellStyleRight = { ...cellStyleBase, textAlign: \"right\" };\nconst cellStyleLeft = { ...cellStyleBase, textAlign: \"left\" };\n\nconst cellStyleCenter = { ...cellStyleBase, textAlign: \"center\" };\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 = [\"#FCC65D\",\"#35DFDF\", \"#196FB2\", \"#68be7f\"];\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 {!!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 clearingFirstTimeInvestorJourney,\n userPan,\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\";\nimport Breadcrumbs from \"@material-ui/core/Breadcrumbs\";\nimport NavigateNextIcon from \"@material-ui/icons/NavigateNext\";\nimport { dashboardActive } from \"../../forms/appEssentials\";\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 const { location } = this.props;\n const { state } = location;\n const params = { PAN: state.PAN, Uid: this.props.userId, ReqBy: REQ_BY };\n const response = await this.props.getInvestorDetails(params);\n await this.props.clearingFirstTimeInvestorJourney();\n await this.props.userPan(state.PAN);\n if (response && response.error !== \"No Data\") {\n this.setState({ isLoading: false });\n } else if(response.error && response.error === \"No Data\") {\n this.setState({ isLoading: false, noData: true });\n }\n if (state.PAN) {\n const Params = {\n Pan: state.PAN,\n YearFlag: new Date().getFullYear(),\n invdistflag: \"A\",\n };\n await this.props.getUpComingSips(Params);\n }\n if (state.from === \"view history\") {\n this.setState({ active: UPCOMING_SIP });\n }\n }\n\n /**\n *\n * @param {string} pan\n * @returns {string} 'T' if investor is favourited else 'F'\n */\n findFavFlag = (pan) => {\n const { investors } = this.props;\n const fav = investors.find((_eachInvestor) => _eachInvestor.Pan === pan);\n return !!fav ? fav.Favorite : FALSE;\n };\n\n favourite = async () => {\n let { PAN: InvPan, invname: Name } = this.props.investorData;\n const FavFlag = this.findFavFlag(InvPan) === TRUE ? FALSE : TRUE;\n\n const params = { InvPan, FavFlag, Name, AgentCode: this.props.token };\n const response = await this.props.favouriteInvestor(params);\n if(response.error){\n alert(response.error)\n }\n if (response) {\n this.props.updateFavouriteInvestor({ InvPan, FavFlag });\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 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 const isFavourite = this.findFavFlag(investorData.PAN) === TRUE;\n\n return (\n \n \n 
\n
\n \n \n
\n \n {!isLoading ? (\n \n {!noData ? (\n \n \n {this.state.errorMessage}\n
\n ) : (\n \"\"\n )}\n \n\n \n {this.props.location?.state?.from === \"view history\" && (\n \n \n
\n\n {!!this.state.errorMessage ? (\n \n this.props.history.push({\n pathname:\"/dashboard/SipSummaryTypes\",\n state: {\n active: this.props.location?.state?.active,\n },\n })}\n className=\"breadcrumbs-unselect-label\"\n style={{ cursor: \"pointer\" }}\n >\n Sip Summary\n \n
\n \n )}\n \n
\n \n \n \n \n
\n \n
\n \n \n
\n \n
\n \n
\n\n \n \n {investorData.fav === TRUE ? (\n
\n \n {investorData.invname}\n
\n \n PAN: {investorData.PAN}\n
\n \n
\n \n {!!detailsEmail && detailsEmail.email\n ? detailsEmail.email\n : \"\"}\n
\n \n \n {!!detailsMobile && !!detailsMobile.Mobile\n ? detailsMobile.Mobile\n : \"\"}\n
\n \n \n
\n \n
\n \n Cost\n
\n \n {!!this.props.investorTotal &&\n !!this.props.investorTotal.CostValue ? (\n
\n \n
\n\n \n Investment Value\n
\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 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 \n \n \n
\n \n Asset Allocation\n
\n\n \n
\n {(upComingSipDetails.length > 3 &&\n this.state.active === UPCOMING_SIP) ||\n (this.state.active === INVESTMENTS &&\n investments.length > 3) ? (\n No Investor PAN found. Please submit investor PAN.
\n )}\n \n ) : (\n {state.title}
\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 {((state.type === \"NEW_PURCHASE\") || (sipType.value === NEW || sipType.value === NEWP )) && (\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 \n {this.props.subLabel}\n
\n \n \n \n {this.props.mainLabel}\n
\n \n \n {this.props.mainLabel1}\n
\n \n \n \n \n
\n )} */}\n {/* {combo.flag === \"Y\" && (\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 type=\"number\"\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 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
\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 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 (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 {combo.label}\n
\n \n )}\n {combo.flag === \"Y\" && (\n \n
\n }\n \n
\n {this.state.combo_disclaimer.value}
\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,transactionDetails } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n bankDetails,\n investorData,\n communicationDetails,\n transactionDetails\n };\n },\n {\n validateSubBroker,\n getAssetClasses,\n getOtherSchemes,\n submitPurchaseData,\n showPurchaseConfirmation,\n saveTransactionDetails\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 saveTransactionDetails,\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 const { location } = this.props;\n const { state } = location;\n const { transaction } = state || {};\n this.state = {\n // funds,\n fund: { value: { value: \"176\" } },\n folios: [],\n folio: {\n value: !!transaction\n ? {\n label: transaction.acno,\n value: transaction.acno,\n }\n : \"\",\n },\n schemes: [],\n scheme: {\n value: !!transaction\n ? {\n label: transaction.schemename,\n value: transaction.scheme_code,\n }\n : \"\",\n },\n bank: { value: \"\", errorMessage: \"\" },\n amount: {\n value: !!transaction\n ? !!transaction.amount\n ? transaction.amount\n : transaction.units\n : \"\",\n },\n redemptionType: !!transaction\n ? transaction.sip_tran_trtype === \"FUL\"\n ? FULL\n : PARTIAL\n : PARTIAL,\n redemptionMode: !!transaction\n ? !!transaction.amount\n ? AMOUNT\n : UNITS\n : 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 const { transactionDetails } = this.props;\n if (!!transactionDetails && (Object.keys(transactionDetails).length > 0)) {\n this.setState(transactionDetails);\n return;\n }\n this.getfolios();\n if (this.props?.location?.state?.transaction) {\n let schemes = this.schemes(this.props.location.state.transaction.acno);\n schemes = schemes.filter((scheme) => scheme.BalUnits !== 0);\n const findingScheme = schemes.find((ele)=>(`176~${ele.Sch}~${ele.Pln}~${ele.Opt}`=== this.props.location.state.transaction.scheme_code))\n this.setState({\n schemes,\n scheme:{value:{label:this.props.location.state.transaction.schemename,value:findingScheme}}\n });\n const params = {\n Acno: this.props.location.state.transaction.acno,\n Trtype: \"\",\n Fund: \"176\",\n };\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 banks,\n });\n }\n }\n }\n\n getfolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.rSchFlg === YES && curr.Fund.trim() === \"176\") {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n ...this.state,\n fund: { value: { value: \"176\" } },\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: \"176\",\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 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 isError:\n this.state.redemptionMode === 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.redemptionMode === AMOUNT\n ? this.state.scheme.value.value.MinAmt > this.state.amount.value\n ? `Minimum amount is ${this.state.scheme.value.value.MinAmt} (₹)`\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 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 });\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: \"Please select the bank details\",\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: `${key} 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.MinAmt > 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.MinAmt} (₹)`,\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 (this.state.bank.value === \"\") {\n this.setState({\n bank: {\n ...others[\"bank\"],\n isError: true,\n errorMessage: `Please select the bank`,\n },\n });\n } else {\n const params = {\n amount: redemptionMode === AMOUNT ? others.amount.value : \"0\",\n Fund: \"176\",\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.saveTransactionDetails(this.state);\n\n this.props.history.push({\n pathname: INVESTOR_URL + \"/redemption/digital/transact/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 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 NAV as on Date
\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 {!!scheme.value ? `₹ ${scheme.value.value.MinAmt}` : \"₹\"}
\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,transactions }) => {\n const {\n fundList,\n token,\n userId,\n bankDetails,\n investorData,\n communicationDetails,\n } = authReducer;\nconst {transactionDetails}= transactions\n return {\n fundList,\n token,\n userId,\n bankDetails,\n investorData,\n communicationDetails,\n transactionDetails\n };\n },\n { getBankDetails, getRedemptionPaymentDetails, saveTransactionDetails\n }\n)(Redemption);","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 saveTransactionDetails\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 switchCmponent extends Component {\n constructor(props) {\n super(props);\n const { switchDetails,location } = this.props;\n const { state } = location;\n const { transaction } = state || {};\n this.state = {\n fund: { value: {value:\"176\"} },\n folios: [],\n folio: {\n value: !!transaction\n ? {\n label: transaction.acno,\n value: transaction.acno,\n }\n : \"\",\n },\n schemes: [],\n scheme: {\n value: !!transaction\n ? {\n label: transaction.schemename,\n value: transaction.scheme_code,\n }\n : \"\",\n },\n radioValue: {\n value: !!transaction && transaction.euinopt === \"Y\" ? \"yes\" : \"no\",\n }, \n arnCode: { value: this.props.token },\n subArnCode: { value: !!transaction ? transaction.Sub_ARN_code : \"\" },\n subBrokerCode: { value: !!transaction ? transaction.subbroker : \"\" },\n euinNo: {\n value:\n !!transaction && transaction.euinopt == \"N\"\n ? transaction.euincode\n : \"\",\n }, \n category: { value: !!transaction ? transaction.category : \"\" },\n categories: [],\n switchInSchemes: [],\n switchInScheme: { value: \"\" },\n amount: {\n value: !!transaction\n ? !!transaction.amount\n ? transaction.amount\n : transaction.units\n : \"\",\n },\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 (\n !!value &&\n !!this.state.fund &&\n value.value === \"176\"\n ) {\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 const { transactionDetails }= this.props\n if (!!transactionDetails && (Object.keys(transactionDetails).length > 0)) {\n this.setState(transactionDetails);\n return;\n }\n this.getFolios();\n if (this.props?.location?.state?.transaction) {\n let schemes = this.schemes(this.props.location.state.transaction.acno);\n schemes = schemes.filter((scheme) => scheme.BalUnits !== 0);\n const findingScheme = schemes.find((ele)=>(`176~${ele.Sch}~${ele.Pln}~${ele.Opt}`=== this.props.location.state.transaction.scheme_code))\n this.setState({\n schemes,\n scheme:{value:{label:this.props.location.state.transaction.schemename,value:findingScheme}}\n });\n this.getAssetClasses();\n this.getOtherSchemes(this.props.location.state.transaction.category) \n }\n }\n\n getFolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund.trim() === \"176\" && curr.sSchFlg === YES) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n ...this.state,\n fund: { value: { value: \"176\" } },\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(\"117\")();\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: \"176\",\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() === \"176\" &&\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: \"176\",\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: \"176\",\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 if (!!this.props.location.state.transaction) {\n const findingInScheme = otherSchemes.DtData.find((ele)=>(ele.fm_schdesc === this.props.location.state.transaction.Switch_in_scheme))\n this.setState({\n switchInScheme:{value:{label:this.props.location.state.transaction.Switch_in_scheme,value:findingInScheme}}\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\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: `Please enter the switch value`,\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: `${key} 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 (\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: `select 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: \"176\",\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 + \"/switch/digital/transact/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: \"176\",\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 \n Switch out Scheme\n
\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 ? `₹${scheme.value.value.CurValue}` : \"\"}\n
\n )}\n \n {!!scheme && !!scheme.value ? scheme.value.value.LastNAV : \"\"}\n
\n \n {!!scheme && !!scheme.value ? `₹${scheme.value.value.MinAmt}` : \"\"}\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 \n Switch in Scheme\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 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
\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=\"Select EUIN\"\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 Switch Type
\n \n
\n\n Switch Mode
\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 investorData,\n communicationDetails,\n } = authReducer;\n const { euinList, switchDetails = {},transactionDetails } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n switchDetails,\n investorData,\n communicationDetails,\n transactionDetails\n };\n },\n {\n validateSubBroker,\n getNewPurchaseFundList,\n getOtherSchemes,\n setSwitchDetails,\n getAssetClasses,\n getRedemptionPaymentDetails,\n saveTransactionDetails\n }\n)(switchCmponent);\n","import React, { Component, useEffect } from \"react\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport Signbutton, { Debtbutton } from \"../../forms/button\";\nimport { Input } from \"../../forms/input\";\nimport {\n EXISTING,\n NEW,\n NEWP,\n YES,\n ALL,\n GET_FUNDS_LIST,\n GET_FUNDS_LIST_SUCCESS,\n GET_FUNDS_LIST_FAILED,\n PAYMENT_MODE,\n REGULAR,\n PURCHASE,\n SIP_TRANS_TYPE,\n INVESTMENT_FREQUENCY,\n SIP_DAY,\n SIP,\n NO,\n EXISTINGP,\n} from \"shared/store/types\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\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 { Checkbox } from \"@material-ui/core\";\nimport {\n validateSubBroker,\n swpOptions,\n getNewPurchaseFundList,\n getOtherSchemes,\n getAssetClasses,\n CalcSIPEnddt,\n setSipDetails,\n submitPurchaseData,\n showPurchaseConfirmation,\n getMinimumAmount,\n getCheckPanKotm,\n getCheckPanAotm,\n saveTransactionDetails\n} from \"shared/store/actions\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\n// import { NEW_TRANSACTION_URL } from \".\";\nimport { SundaramMutualFund } from \"./newPurchaseForm\";\nimport { INVESTOR_URL } from \"../investors\";\nconst initialState = {\n fund: { value: \"\" },\n funds: [],\n folio: { value: \"\" },\n folios: [],\n category: { value: \"\" },\n minimumLumpsumAmout: \"\",\n categories: [],\n scheme: { value: \"\" },\n schemes: [],\n investmentFrequency: { value: \"\" },\n frequencies: [],\n installments: { value: \"\" },\n sipDay: { value: \"\" },\n sipDays: [],\n perpetualSip: false,\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n installmentAmount: { value: \"\" },\n investmentAmount: { value: \"\" },\n mode: { value: \"\" },\n modes: [],\n minAmount: \"\",\n code: { value: \"+91\" },\n minInstallment: \"\",\n kotm: false,\n selectedKotm: { value: \"\" },\n umrn: [],\n};\nclass Sip extends Component {\n constructor(props) {\n super(props);\n const { sipDetails, location, fundList } = this.props;\n const { state } = location;\n const { transaction } = state || {};\n const checkExisting =\n !!fundList && fundList.find((ele) => ele.Fund === \"176\" && !!ele.Acno);\n this.state = {\n sipTypes:\n (!!state && !!state.pan) || !checkExisting\n ? [\n // {\n // label: \"New Folio - SIP Registration with payment\",\n // value: NEW,\n // },\n { label: \"New Folio - SIP Registration\", value: NEWP },\n ]\n : [\n { label: \"Existing Folio - SIP Registration\", value: EXISTING },\n // { label: \"New Folio - SIP Registration\", value: NEWP },\n // {\n // label: \"New Folio - SIP Registration with payment\",\n // value: NEW,\n // },\n {\n label: \"Existing Folio - SIP Registration with payment\",\n value: EXISTINGP,\n },\n ],\n invName: {\n value: !!transaction ? transaction.InvName : this.props.kycData.invname,\n },\n sipType: { value: !!transaction ? transaction.sip_trtype : \"\" },\n fund: { value: \"\" },\n funds: [],\n folio: {\n value: !!transaction\n ? {\n label: transaction.acno,\n value: transaction.acno,\n }\n : \"\",\n },\n folios: [],\n arnCode: { value: this.props.token },\n subArnCode: { value: !!transaction ? transaction.Sub_ARN_code : \"\" },\n subBrokerCode: { value: !!transaction ? transaction.subbroker : \"\" },\n schemeType: EXISTING,\n category: { value: !!transaction ? transaction.category : \"\" },\n categories: [],\n schemes: [],\n scheme: {\n value: !!transaction\n ? {\n label: transaction.schemename,\n value: transaction.scheme_code,\n }\n : \"\",\n },\n modes: [],\n mode: { value: !!transaction ? transaction.mode_of_registration : \"\" },\n euinNo: {\n value:\n !!transaction && transaction.euinopt == \"N\"\n ? transaction.euincode\n : \"\",\n },\n radioValue: {\n value: !!transaction && transaction.euinopt === \"Y\" ? \"yes\" : \"no\",\n },\n transactionType: { value: \"\" },\n minAmount: \"\",\n minAmountValue: { value: \"\" },\n frequencies: [],\n investmentFrequency: { value: \"\" },\n sipDays: [],\n sipDay: { value: \"\" },\n installments: { value: !!transaction ? transaction.no_of_inst : \"\" },\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n email: { value: !!transaction ? transaction.Email : \"\" },\n mobile: { value: !!transaction ? transaction.mobile : \"\" },\n installmentAmount: { value: !!transaction ? transaction.amount : \"\" },\n investmentAmount: { value: !!transaction ? transaction.sipamount : \"\" },\n Family_Code_Email: { value: \"\" },\n Family_Code_Phone: { value: \"\" },\n code: { value: \"+91\" },\n minInstallment: \"\",\n transactiontype_flexi: false,\n ...sipDetails,\n };\n }\n\n async componentDidMount() {\n window.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n const { transactionDetails } = this.props;\n if (!!transactionDetails && (Object.keys(transactionDetails).length > 0)) {\n this.setState(transactionDetails);\n return;\n }\n if (this.props?.location?.state?.transaction) {\n if (\n this.state.sipType.value === NEW ||\n this.state.sipType.value === NEWP\n ) {\n this.getAssetClasses(\"176\");\n }\n this.getFolios();\n const params = {\n Fund: \"176\",\n SubAgentCd: !!this.state.subArnCode.value\n ? `ARN-${this.state.subArnCode.value}`\n : \"-\",\n AgentCd: this.state.arnCode.value,\n };\n await this.props.validateSubBroker(params);\n\n if (\n this.state.sipType.value === EXISTING ||\n this.state.sipType.value === EXISTINGP\n ) {\n const schemes = this.schemes(this.state.folio.value.value);\n const findingScheme = schemes.find(\n (ele) =>\n `176~${ele.Sch}~${ele.Pln}~${ele.Opt}` ===\n this.props.location.state.transaction.scheme_code\n );\n this.setState({\n schemes,\n scheme: { value: findingScheme },\n });\n } else {\n this.getOtherSchemes(this.state.category.value);\n }\n const params1 = {\n opt: INVESTMENT_FREQUENCY,\n fund: \"176\",\n };\n this.getInvestmentFrequency(params1, \"frequencies\");\n const parameters = {\n opt: PAYMENT_MODE,\n Fund: \"176\",\n astscheme: this.props.location.state.transaction.pan,\n };\n const response = await this.props.swpOptions(parameters);\n if (response) {\n const { Dtinformation } = response;\n this.setState({\n modes: Dtinformation,\n });\n }\n }\n }\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 handlechangetransactiontype = () => {\n const { transactiontype_flexi } = this.state;\n if (!transactiontype_flexi) {\n this.setState({\n transactiontype_flexi: !this.state.transactiontype_flexi,\n });\n } else if (!!transactiontype_flexi) {\n this.setState({\n transactiontype_flexi: !this.state.transactiontype_flexi,\n });\n }\n };\n\n handlechangeSIPEndDateChange = () => {\n let selectedFrequency = this.state.investmentFrequency.value.FrequencyID;\n let startDate = new Date();\n let daysToNextYear = Math.ceil((new Date(new Date().getFullYear() + 1, new Date().getMonth(), new Date().getDate()) - new Date()) / (1000 * 60 * 60 * 24));\n\n\n let endDate = new Date(\"2099-12-31\");\n let monthsDifference =\n (endDate.getFullYear() - startDate.getFullYear()) * 12 +\n (endDate.getMonth() - startDate.getMonth());\n let noofFrequency =\n selectedFrequency == \"Monthly\"\n ? monthsDifference - 1\n : selectedFrequency == \"Daily\"\n ? Math.floor(daysToNextYear)\n : selectedFrequency == \"Weekly\"\n ? Math.floor((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 const { perpetualSip } = this.state;\n if (!perpetualSip) {\n this.setState({\n perpetualSip: !this.state.perpetualSip,\n sip_end_date: { value: \"31/12/2099\" },\n mode: { value: \"\" },\n kotm: false,\n installments: {\n value: noofFrequency,\n placeholder: \"\",\n disabled: true,\n },\n });\n } else if (!!perpetualSip) {\n this.setState({\n perpetualSip: !this.state.perpetualSip,\n sipDay: { value: \"\" },\n sip_end_date: { value: \"\" },\n sip_start_date: { value: \"\" },\n mode: { value: \"\" },\n kotm: false,\n installments: {\n value: \"\",\n placeholder: \"\",\n disabled: false,\n },\n });\n }\n };\n\n // handleFundChange = async (value) => {\n // const fund = !!value ? value.value : \"\";\n // const fundValue = !!value\n // ? this.state.sipType.value === NEW || this.state.sipType.value === NEWP\n // ? fund.amc_code\n // : fund.Fund\n // : \"\";\n\n // if (!value) {\n // this.setState({\n // ...initialState,\n // funds: this.state.funds,\n // fund: { value },\n // schemes: [],\n // scheme: { value: \"\" },\n // modes: [],\n // mode: { value: \"\" },\n // euinNo: { value: \"\" },\n // radioValue: { value: \"no\" },\n // minAmount: \"\",\n // frequencies: [],\n // investmentFrequency: { value: \"\" },\n // sipDays: [],\n // sipDay: { value: \"\" },\n // minAmountValue: { value: \"\" },\n // installments: { value: \"\" },\n // sip_start_date: { value: \"\" },\n // sip_end_date: { value: \"\" },\n // email: {\n // value:\n // this.state.sipType.value === NEW ||\n // this.state.sipType.value === NEWP\n // ? this.state.email.value\n // : \"\",\n // },\n // mobile: {\n // value:\n // this.state.sipType.value === NEW ||\n // this.state.sipType.value === NEWP\n // ? this.state.mobile.value\n // : \"\",\n // },\n // installmentAmount: { value: \"\" },\n // investmentAmount: { value: \"\" },\n // });\n // return;\n // } else if (\n // !!value &&\n // !!this.state.fund.value &&\n // value.value.Fund === this.state.fund.value.value.Fund &&\n // value.value.Fund !== undefined\n // ) {\n // return;\n // } else {\n // const params = {\n // opt: PAYMENT_MODE,\n // Fund: fundValue,\n // astscheme:\n // !!this.props.investorData && !!this.props.investorData.PAN\n // ? this.props.investorData.PAN\n // : \"\",\n // };\n // const folios = this.props.fundList.reduce((prev, curr) => {\n // if (curr.Fund === fundValue && curr.sipFlag === YES) {\n // return [...prev, curr.Acno];\n // }\n // return prev;\n // }, []);\n // this.setState({\n // ...initialState,\n // funds: this.state.funds,\n // fund: { value },\n // folios: Array.from(new Set(folios)),\n // folio: { value: \"\" },\n // });\n // if (!!value) {\n // this.validateBrokerCode(fundValue)();\n // }\n // if (\n // this.state.sipType.value === NEW ||\n // this.state.sipType.value === NEWP\n // ) {\n // this.getAssetClasses(fundValue);\n // }\n // const response = await this.props.swpOptions(params);\n // if (response) {\n // const { Dtinformation } = response;\n // this.setState({\n // modes: Dtinformation,\n // minAmountValue: { value: \"\" },\n // mode: { value: \"\" },\n // });\n // }\n // }\n // };\n getUMRN = async (pass) => {\n const params = {\n Fund: \"176\",\n PAN: this.props.investorData.PAN || this.props.location.state.pan,\n Acno: this.state.folio.value.value ? this.state.folio.value.value : 0,\n };\n const response =\n pass === \"KOTM\"\n ? await this.props.getCheckPanKotm(params)\n : await this.props.getCheckPanAotm(params);\n const umrn = await response.Table1;\n if (umrn.length > 1) {\n const maxAmt = umrn.reduce(\n (max, obj) => (obj.Amt > max ? obj.Amt : max),\n 0\n );\n const filteredData = umrn.filter((obj) => obj.Amt === maxAmt);\n this.setState({\n selectedKotm: { value: filteredData[0] },\n sip_end_date:\n { value: filteredData[0][\"MANDATE END DATE\"] }\n });\n }\n if (umrn.length === 1) {\n this.setState({\n selectedKotm: { value: umrn[0] },\n sip_end_date: !!this.state.perpetualSip\n ? { value: umrn[0][\"MANDATE END DATE\"] }\n : \"\",\n });\n }\n this.setState({\n umrn,\n });\n };\n\n validateBrokerCode = (fund) => async () => {\n const { subArnCode, arnCode } = this.state;\n if (\n !!subArnCode.value &&\n subArnCode.value === arnCode.value.split(\"-\")[1]\n ) {\n this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: `(Please enter a valid Sub ARN Code)`,\n },\n });\n } else {\n const params = {\n Fund: \"176\",\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\n handleFolioChange = (value) => {\n const folio = !!value ? value.value : \"\";\n const { funds, fund, folios, modes, mode } = this.state;\n const state = { funds, fund, folios, modes, mode };\n if (!value) {\n this.setState({\n ...initialState,\n ...state,\n folio: { value },\n });\n return;\n } else if (\n !!value &&\n !!this.state.folio.value &&\n value.value === this.state.folio.value.value\n ) {\n return;\n } else {\n const schemes = this.schemes(folio);\n this.setState({\n ...initialState,\n ...state,\n folio: { value },\n minAmountValue: { value: \"\" },\n schemes,\n schemeType: EXISTING,\n });\n }\n };\n\n changeEuin = (value) => {\n this.setState({\n euinNo: { value },\n });\n };\n\n changeValue = (label) => (event) => {\n if (\n (label === \"installmentAmount\" || label === \"investmentAmount\") &&\n event.target.value.length <= 10\n ) {\n this.setState({\n [label]: { value: parseFloat(event.target.value.replace(/^0+/, \"\")) },\n });\n }\n if (label === \"installments\" && event.target.value.length <= 4) {\n if (parseFloat(event.target.value) <= 9999) {\n this.setState({\n [label]: {\n value: parseFloat(event.target.value.replace(/^0+/, \"\")),\n },\n sipDay: { value: \"\" },\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n });\n } else if (!event.target.value) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: !!event.target.value\n ? \"No. of Installments should not be more than 500\"\n : \"No. of Installments is mandatory\",\n },\n sipDay: { value: \"\" },\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n });\n }\n } else if (label === \"code\") {\n if (!/^[+]\\d{1,3}/.test(event.target.value)) {\n this.setState({\n [label]: {\n value: event.target.value,\n isError: true,\n errorMessage: \"Enter a valid Country Code\",\n },\n });\n } else {\n this.setState({ [label]: { value: event.target.value } });\n }\n } else if (label === \"mobile\" && event.target.value.length <= 10) {\n this.setState({\n [label]: { value: event.target.value },\n });\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 } else if (label === \"mode\") {\n this.setState({\n sipDay: { value: \"\" },\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n perpetualSip: false,\n })\n // if(this.state.perpetualSip){\n // this.setState({installments:{value:\"\"}})\n // }\n if (event.target.value === \"KOTM\") {\n this.getUMRN(\"KOTM\");\n }\n if (event.target.value === \"AOTM\") {\n this.getUMRN(\"AOTM\");\n }\n this.setState({\n [label]: { value: event.target.value },\n kotm: event.target.value === \"KOTM\" || event.target.value === \"AOTM\",\n selectedKotm: { value: \"\" },\n });\n } else if (label === \"kotm\" ) {\n\n this.setState({\n selectedKotm: {\n value: event.target.value,\n },\n sip_end_date: !!this.state.perpetualSip\n ? { value: event.target.value[\"MANDATE END DATE\"] }\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 (label === \"email\") {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label === \"transactionType\") {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (label === \"invName\") {\n this.setState({\n [label]: { value: event.target.value },\n });\n } else if (\n label !== \"installmentAmount\" &&\n label !== \"invName\" &&\n label !== \"subArnCode\" &&\n label !== \"mode\" &&\n label !== \"installments\" &&\n label !== \"subBrokerCode\" &&\n label !== \"email\" &&\n label !== \"mobile\" &&\n label !== \"investmentAmount\" &&\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 (fund, folio) => {\n const params = {\n Fund: \"176\",\n Folio: folio,\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 (category) => {\n const params = {\n schtype: REGULAR,\n category,\n acno:\n this.state.sipType.value === NEW || this.state.sipType.value === NEWP\n ? \"0\"\n : this.state.folio.value.value,\n fundCode: \"176\",\n trantype: SIP_TRANS_TYPE,\n };\n\n const otherSchemes = await this.props.getOtherSchemes(params);\n const FundName = \"176\";\n\n if (otherSchemes) {\n this.setState({\n schemes: otherSchemes.DtData,\n fund: {\n ...this.state.fund,\n errorMessage:\n (FundName.trim() === \"128\" ||\n FundName.trim() === \"116\" ||\n FundName.trim() === \"178\") &&\n this.state.category.value === \"LIQUID\" &&\n otherSchemes.DtData.length === 0\n ? \"Liquid Schemes are not allowed for SIP\"\n : otherSchemes.DtData.length === 0 &&\n (FundName.trim() !== \"128\" ||\n FundName.trim() !== \"116\" ||\n FundName.trim() !== \"178\")\n ? \"No Schemes under this fund\"\n : \"\",\n },\n });\n }\n if (!!this.props.location.state.transaction) {\n const findingInScheme = otherSchemes.DtData.find(\n (ele) =>\n ele.fm_schdesc === this.props.location.state.transaction.schemename\n );\n this.setState({\n scheme: {\n value: {\n label: this.props.location.state.transaction.schemename,\n value: findingInScheme,\n },\n },\n });\n }\n };\n\n // schemes = (folio) => {\n // return this.props.fundList.reduce((prev, curr) => {\n // if (\n // this.state.sipType.value === NEW &&\n // !!this.state.fund.value &&\n // this.state.fund.value.value\n // ? curr.Fund === \"176\"\n // : curr.Fund === \"176\" &&\n // curr.Acno === folio &&\n // curr.sipSchFlg === YES\n // ) {\n // return [...prev, curr];\n // }\n // return prev;\n // }, []);\n // };\n\n schemes = (folio) => {\n if (\n this.state.sipType.value === EXISTING ||\n this.state.sipType.value === EXISTINGP\n ) {\n return this.props.fundList.reduce((prev, curr) => {\n if (\n parseFloat(curr.Fund) === 176 &&\n parseFloat(curr.Acno) === parseFloat(folio) &&\n curr.sipSchFlg === YES\n ) {\n return [...prev, curr];\n }\n return prev;\n }, []);\n }\n };\n\n handleCategoryChange = (event) => {\n const category = event.target.value;\n const { funds, fund, folios, modes, mode, folio, categories } = this.state;\n const state = {\n funds,\n fund,\n folios,\n modes,\n mode,\n folio,\n categories,\n };\n if (!category) {\n this.setState({\n ...initialState,\n ...state,\n category: { value: \"\" },\n });\n return;\n }\n this.setState({\n ...initialState,\n ...state,\n category: { value: category },\n });\n this.getOtherSchemes(category);\n };\n getFolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (parseFloat(curr.Fund) === 176 && curr.sipFlag === YES) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n folios: Array.from(new Set(folios)),\n });\n };\n handleSipTypeChange = async (event) => {\n const sipType = event.target.value;\n const { communicationDetails, investorData, location } = this.props;\n const { state } = location;\n\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 Setstate = {\n ...initialState,\n schemeType: EXISTING,\n invName: {\n value:\n !!investorData && !!investorData.invname\n ? investorData.invname\n : this.props.kycData.invname,\n },\n email: {\n value:\n (sipType === NEW || sipType === NEWP) &&\n // !!location.state &&\n // !location.state.pan &&\n !!detailsEmail &&\n !!detailsEmail.email\n ? detailsEmail.email\n : \"\",\n },\n mobile: {\n value:\n (sipType === NEW || sipType === NEWP) &&\n // !!location.state &&\n // !location.state.pan &&\n !!detailsMobile &&\n !!detailsMobile.Mobile\n ? detailsMobile.Mobile\n : \"\",\n },\n disbleEmail:\n !!detailsEmail &&\n !!detailsEmail.email &&\n (sipType === NEW || sipType === NEWP)\n ? true\n : false,\n disbleMobile:\n !!detailsMobile &&\n (sipType === NEW || sipType === NEWP) &&\n !!detailsMobile.Mobile\n ? true\n : false,\n };\n\n if (!sipType) {\n this.setState({\n ...state,\n sipType: { value: event.target.value },\n minAmountValue: { value: \"\" },\n });\n return;\n } else if (event.target.value === this.state.sipType.value) {\n return;\n }\n const params = {\n opt: PAYMENT_MODE,\n Fund: \"176\",\n astscheme:\n !!this.props.investorData && !!this.props.investorData.PAN\n ? this.props.investorData.PAN\n : !!state && !!state.pan\n ? state.pan\n : \"\",\n };\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (parseFloat(curr.Fund) === 176 && curr.sipFlag === YES) {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n\n this.setState({\n ...Setstate,\n sipType: { value: sipType },\n funds: [],\n fund: { value: { value: \"176\" } },\n folios: Array.from(new Set(folios)),\n folio: { value: \"\" },\n });\n if (!!sipType) {\n this.validateBrokerCode(\"176\")();\n }\n if (sipType === NEW || sipType === NEWP) {\n this.getAssetClasses(\"176\");\n }\n const response = await this.props.swpOptions(params);\n if (response) {\n const { Dtinformation } = response;\n this.setState({\n modes: Dtinformation,\n minAmountValue: { value: \"\" },\n mode: { value: \"\" },\n });\n }\n // const { fundList, fundsList } = this.props;\n // const funds =\n // sipType === NEW || sipType === NEWP\n // ? fundsList\n // : fundList.reduce((prev, curr) => {\n // if (curr.sipFlag === YES) {\n // const findIndex =\n // prev.findIndex((fund) => fund.Fund === curr.Fund) !== -1;\n // if (!findIndex) {\n // return [...prev, { Fund: curr.Fund, FundDesc: curr.FundDesc }];\n // }\n // }\n // return prev;\n // }, []);\n\n // this.setState({\n // ...state,\n // sipType: { value: event.target.value },\n // minAmountValue: { value: \"\" },\n // funds,\n // });\n };\n\n changeSchemeType = (value) => () => {\n const { funds, fund, folios, modes, mode, folio } = this.state;\n const state = {\n funds,\n fund,\n folios,\n modes,\n mode,\n folio,\n };\n if (value === this.state.schemeType) {\n return;\n }\n if (value === EXISTING || value === EXISTINGP) {\n const schemes = this.schemes(this.state.folio.value.value);\n this.setState({\n ...initialState,\n ...state,\n schemeType: value,\n minAmountValue: { value: \"\" },\n schemes,\n });\n } else {\n this.setState({\n ...initialState,\n minAmountValue: { value: \"\" },\n ...state,\n schemeType: value,\n });\n if (!!this.state.fund.value && !!this.state.folio.value) {\n this.getAssetClasses(\n this.state.sipType.value === NEW\n ? this.state.fund.value.value.amc_code\n : this.state.fund.value.value.Fund,\n this.state.folio.value.value\n );\n }\n }\n };\n\n handleSchemeChange = (value) => {\n const scheme = !!value ? value.value : \"\";\n\n const {\n funds,\n fund,\n folios,\n modes,\n mode,\n folio,\n categories,\n category,\n schemes,\n } = this.state;\n const state = {\n funds,\n fund,\n folios,\n modes,\n mode,\n folio,\n categories,\n category,\n schemes,\n };\n if (!value) {\n this.setState({\n ...initialState,\n ...state,\n scheme: { value: value },\n });\n return;\n }\n\n this.setState({\n ...initialState,\n ...state,\n scheme: { value },\n multiples: !!scheme && !!scheme.multiples ? scheme.multiples : \"\",\n minAmount: !!scheme ? scheme.sipminamt || scheme.SIPminamt : \"\",\n minAmountValue: {\n value: !!scheme ? scheme.sipminamt || scheme.SIPminamt : \"\",\n },\n minimumLumpsumAmout:\n this.state.sipType.value === NEW || this.state.sipType.value === NEWP\n ? scheme.fm_newpur\n : this.state.sipType.value === EXISTINGP\n ? scheme.MinAmt\n : \"\",\n });\n const params = {\n opt: INVESTMENT_FREQUENCY,\n fund: \"176\",\n };\n this.getInvestmentFrequency(params, \"frequencies\");\n };\n\n getInvestmentFrequency = async (params, label) => {\n const response = await this.props.swpOptions(params);\n if (response) {\n this.setState({\n [label]: response.Dtinformation,\n });\n }\n };\n\n changeFrequency = async (event) => {\n const investmentFrequency = event.target.value;\n let minAmount = \"\";\n let minInstallment = \"\";\n const {\n funds,\n fund,\n folios,\n modes,\n mode,\n folio,\n categories,\n category,\n schemes,\n scheme,\n frequencies,\n } = this.state;\n const state = {\n funds,\n fund,\n folios,\n modes,\n mode,\n folio,\n categories,\n category,\n schemes,\n scheme,\n frequencies,\n };\n if (!investmentFrequency) {\n this.setState({\n ...initialState,\n ...state,\n installments: { value: \"\" },\n sip_end_date: { value: \"\" },\n sip_start_date: { value: \"\" },\n sipDay: { value: \"\" },\n perpetualSip: false,\n investmentFrequency: { value: investmentFrequency },\n });\n return;\n }\n if (this.state.sipType.value === NEW || this.state.sipType.value === NEWP) {\n const minParams = {\n Fund: \"176\",\n Scheme: this.state.scheme.value.value.fm_scheme,\n Trtype: \"SIP\",\n Frequency: event.target.value.FrequencyID,\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 }\n }\n if (\n this.state.sipType.value === EXISTING ||\n this.state.sipType.value === EXISTINGP\n ) {\n const minParams = {\n Fund: \"176\",\n\n Scheme:\n this.state.scheme.value.value.Sch ||\n this.state.scheme.value.value.fm_scheme,\n Trtype: \"SIP\",\n Frequency: event.target.value.FrequencyID,\n };\n\n const response = await this.props.getMinimumAmount(minParams);\n\n if (!!response && !response.error) {\n const { DtData } = response;\n minAmount = DtData[0].minamt;\n minInstallment = DtData[0].mininst;\n }\n }\n\n this.setState({\n investmentFrequency: { value: investmentFrequency },\n installments: { value: \"\" },\n sip_end_date: { value: \"\" },\n sip_start_date: { value: \"\" },\n perpetualSip: false,\n // minAmountValue: {\n // value: this.state.minAmountValue.value,\n // },\n minAmountValue: { value: minAmount },\n minInstallment: minInstallment,\n\n // minimumLumpsumAmout: this.state.minimumLumpsumAmout,\n });\n\n const params = {\n opt: SIP_DAY,\n fund: \"176\",\n astscheme: investmentFrequency.FrequencyID,\n };\n this.getInvestmentFrequency(params, \"sipDays\");\n\n const modeparams = {\n opt: PAYMENT_MODE,\n Fund: \"176\",\n astscheme:\n !!this.props.investorData && !!this.props.investorData.PAN\n ? this.props.investorData.PAN\n : !!this.state && !!this.state.pan\n ? this.state.pan.value\n : \"\",\n customfund: \"176\",\n };\n const res = await this.props.swpOptions(modeparams);\n if (res) {\n const { Dtinformation } = res;\n this.setState({\n modes: Dtinformation,\n });\n }\n };\n changeSipDay = (value) => {\n const sipDay = !!value ? value.value : \"\";\n this.setState({\n sipDay: { value: value },\n installmentAmount: { value: \"\" },\n investmentAmount: { value: \"\" },\n });\n if (!!sipDay) {\n this.getSipEndDate(sipDay);\n } else if (!this.state.installments.value) {\n this.setState({\n sipDay: { value: \"\" },\n installments: {\n isError: true,\n errorMessage: \"Please enter Instalments\",\n },\n });\n this.installmentsField.focus();\n }\n };\n\n getSipEndDate = async (sipDay) => {\n let selectedFrequency = this.state.investmentFrequency.value.FrequencyID;\n console.log(this.state.investmentFrequency);\n let startDate = new Date();\n let endDate = new Date(\"2099-12-31\");\n // (\n // this.state.mode.value === \"KOTM\" ||\n // this.state.mode.value === \"AOTM\"\n // ) ? this.state?.selectedKotm?.value[\"MANDATE END DATE\"] :\n // new Date(\"2099-12-31\");\n let monthsDifference =\n (endDate.getFullYear() - startDate.getFullYear()) * 12 +\n (endDate.getMonth() - startDate.getMonth());\n let noofFrequency =\n selectedFrequency == \"Monthly\"\n ? monthsDifference - 1\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 const params = {\n fund: \"176\",\n sch:\n this.state.scheme.value.value.Sch ||\n this.state.scheme.value.value.fm_scheme,\n StartDate: sipDay,\n Installments: this.state.installments.value,\n Frequency: this.state.investmentFrequency.value.FrequencyID,\n trtype: \"SIP\",\n };\n try {\n const response = await this.props.CalcSIPEnddt(params);\n if (response) {\n const {\n DtData: [dates],\n } = response;\n const { SIP_EndDate, SIP_StartDate } = dates;\n if (!!SIP_EndDate) {\n const reformSIPEndDT = SIP_EndDate.split(\"/\");\n if (parseFloat(reformSIPEndDT[2]) > 2099) {\n this.setState({\n sipDay: { value: \"\" },\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n installments: {\n value: \"\",\n isError: true,\n errorMessage: `Your SIP instalments are going beyond 2099, select lesser than ${noofFrequency}.`,\n },\n });\n this.installmentsField.focus();\n } else if (\n this.state.mode.value === \"KOTM\" ||\n this.state.mode.value === \"AOTM\"\n ) {\n let startDate = SIP_StartDate;\n let endDate = this.state.selectedKotm.value[\"MANDATE END DATE\"];\n let noofFrequency =\n selectedFrequency == \"Monthly\"\n ? monthsDifference - 1\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 const [day, month, year] =\n this.state.selectedKotm.value[\"MANDATE END DATE\"].split(\"/\");\n const [day1, month1, year1] = SIP_EndDate.split(\"/\");\n if (\n new Date(`${month}/${day}/${year}`) <\n new Date(`${month1}/${day1}/${year1}`)\n ) {\n this.setState({\n sipDay: { value: \"\" },\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n installments: {\n value: \"\",\n isError: true,\n errorMessage: `Your SIP instalments are going beyond Mandate End Date(${this.state.selectedKotm.value[\"MANDATE END DATE\"]})}.`,\n },\n });\n this.installmentsField.focus();\n } else {\n this.setState({\n sip_start_date: { value: SIP_StartDate },\n sip_end_date: { value : this.state.selectedKotm.value[\"MANDATE END DATE\"]},\n installments: { value: noofFrequency },\n });\n }\n } else if (parseFloat(reformSIPEndDT[2]) <= 2099) {\n this.setState({\n sip_start_date: { value: SIP_StartDate },\n sip_end_date: !!this.state.perpetualSip\n ? { value: this.state.sip_end_date.value }\n : { value: SIP_EndDate },\n });\n }\n }\n }\n } catch (err) {\n this.setState({\n sipDay: { value: \"\" },\n sip_start_date: { value: \"\" },\n sip_end_date: { value: \"\" },\n installments: {\n value: \"\",\n isError: true,\n errorMessage: `Your SIP instalments are going beyond 2099, select lesser than ${noofFrequency}.`,\n },\n });\n }\n };\n\n showError = (label) => (event) => {\n const {\n [label]: { value },\n } = this.state;\n // if (label === \"investmentAmount\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // label === \"investmentAmount\"\n // ? this.state.minAmountValue.value <\n // this.state.investmentAmount.value\n // ? true\n // : !value\n // : \"\",\n // errorMessage:\n // label === \"investmentAmount\"\n // ? this.state.minAmountValue.value <\n // this.state.investmentAmount.value\n // ? `Investment Amount should be ${this.state.minAmountValue.value}(INR)`\n // : \"\"\n // : \"\"\n // }\n // });\n // }\n // if (label === \"installmentAmount\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // label === \"installmentAmount\"\n // ? this.state.minAmountValue.value <\n // this.state.installmentAmount.value\n // ? true\n // : !value\n // : \"\",\n // errorMessage:\n // label === \"installmentAmount\"\n // ? this.state.minAmountValue.value <\n // this.state.installmentAmount.value\n // ? `Installment Amount should be ${this.state.minAmountValue.value}(INR)`\n // : \"\"\n // : \"\"\n // }\n // });\n // }\n if (label === \"email\") {\n this.setState({\n [label]: {\n value,\n isError: !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.email.value\n )\n ? true\n : !value,\n errorMessage: !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(\n this.state.email.value\n )\n ? `Enter an vaild Email ID`\n : \"\",\n },\n });\n } else if (label === \"code\") {\n if (!/^[+]\\d{1,3}/.test(event.target.value)) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid Country Code\",\n },\n });\n }\n } else if (label === \"mobile\") {\n this.setState({\n [label]: {\n value,\n isError: !/^[6-9]\\d{9}$/.test(this.state.mobile.value)\n ? true\n : !value,\n errorMessage: !/^[6-9]\\d{9}$/.test(this.state.mobile.value)\n ? `Enter a valid Mobile`\n : !value,\n },\n });\n } else if (label === \"investmentAmount\") {\n if (\n +this.state.selectedKotm.value.Amt < +this.state.investmentAmount.value\n ) {\n this.setState({\n investmentAmount: {\n value: \"\",\n isError: true,\n errorMessage: `Lumpsum amount cannot exceed\n mandate registration limit of ${this.state.selectedKotm.value.Amt}.`,\n },\n });\n this.investmentAmount.focus();\n return;\n }\n return;\n } else if (\n +this.state.selectedKotm.value.Amt < +this.state.installmentAmount.value\n ) {\n this.setState({\n installmentAmount: {\n value: \"\",\n isError: true,\n errorMessage: `SIP installment amount cannot exceed\n mandate registration limit of ${this.state.selectedKotm.value.Amt}.`,\n },\n });\n this.installmentAmount.focus();\n return;\n } if (label === \"installments\") {\n let selectedFrequency = this.state.investmentFrequency.value.FrequencyID;\n console.log(this.state.investmentFrequency);\n let startDate = new Date();\n let endDate = new Date(\"2099-12-31\");\n let monthsDifference =\n (endDate.getFullYear() - startDate.getFullYear()) * 12 +\n (endDate.getMonth() - startDate.getMonth());\n let noofFrequency =\n selectedFrequency === \"Monthly\"\n ? monthsDifference - 1\n : selectedFrequency === \"Daily\"\n ? Math.floor((endDate - startDate) / (1000 * 60 * 60 * 24))\n : selectedFrequency === \"Weekly\"\n ? Math.floor((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\n if (value > noofFrequency) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: `Number of installments should not be more than ${noofFrequency}`,\n },\n });\n return;\n } else {\n if (selectedFrequency === \"Daily\" && (value < 92 || value > 365)) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage:\n \"Min instalment should be 92 (3 Months).Max instalment should be one year.Sip should not trigger for Sat,Sun and Holidays\",\n },\n });\n return;\n } else {\n this.setState({\n [label]: {\n value,\n isError:\n !!this.state.investmentFrequency.value &&\n !!this.state.investmentFrequency.value.Minimum_Instalment &&\n this.state.installments.value <\n this.state.investmentFrequency.value.Minimum_Instalment\n ? true\n : !value,\n errorMessage:\n \"No. of installments should be more than the minimum installments\",\n },\n });\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 submit = async () => {\n const {\n sipTypes,\n installments,\n funds,\n fund,\n folio,\n folios,\n arnCode,\n subArnCode,\n invName,\n email,\n subBrokerCode,\n schemeType,\n category,\n mobile,\n categories,\n schemes,\n modes,\n euinNo,\n perpetualSip,\n radioValue,\n minimumLumpsumAmout,\n // installmentAmount,\n transactiontype_flexi,\n minAmount,\n minAmountValue,\n frequencies,\n sipDays,\n investmentAmount,\n disbleEmail,\n disbleMobile,\n multiples,\n code,\n Family_Code_Email,\n Family_Code_Phone,\n transactionType,\n minInstallment,\n kotm,\n selectedKotm,\n umrn,\n ...others\n } = this.state;\n const { location } = this.props;\n const { state } = location;\n let d1, d2;\n const split_enddate = this?.state?.sip_end_date?.value.split(\"/\");\n const split_mandatedate =\n this?.state?.selectedKotm?.value[\"MANDATE END DATE\"]?.split(\"/\");\n d1 = new Date(\n Number(split_enddate[2]),\n Number(split_enddate[1]) - 1,\n Number(split_enddate[0])\n );\n if (this?.state?.selectedKotm?.value[\"MANDATE END DATE\"]?.split(\"/\")) {\n d2 = new Date(\n Number(split_mandatedate[2]),\n Number(split_mandatedate[1]) - 1,\n Number(split_mandatedate[0])\n );\n }\n if (!this.state.installmentAmount.value) {\n this.setState({\n installmentAmount: {\n value: \"\",\n isError: true,\n errorMessage: \"installmentAmount is mandatory\",\n },\n });\n }\n if (!this.state.selectedKotm.value && kotm) {\n this.setState({\n selectedKotm: {\n value: \"\",\n isError: true,\n errorMessage: \"UMRN is mandatory*\",\n },\n });\n }\n if (\n !this.state.Family_Code_Email.value &&\n this.state.sipType.value === NEW\n ) {\n this.setState({\n Family_Code_Email: {\n value: \"\",\n isError: true,\n errorMessage: \"Email Family Description is mandatory*\",\n },\n });\n return;\n }\n if (\n !this.state.Family_Code_Phone.value &&\n this.state.sipType.value === NEW\n ) {\n this.setState({\n Family_Code_Phone: {\n value: \"\",\n isError: true,\n errorMessage: \"Mobile Family Description is mandatory*\",\n },\n });\n return;\n }\n if (!this.state.email.value) {\n this.setState({\n email: {\n value: \"\",\n isError: true,\n errorMessage: \"Email ID is mandatory*\",\n },\n });\n }\n if (!this.state.installments.value && !this.state.perpetualSip) {\n this.setState({\n installments: {\n value: \"\",\n isError: true,\n errorMessage: \"No of Installments is Mandatory\",\n },\n });\n }\n if (!this.state.invName.value) {\n this.setState({\n invName: {\n value: \"\",\n isError: true,\n errorMessage: \"Investor name is mandatory*\",\n },\n });\n }\n 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 }\n if (!this.state.mobile.value) {\n this.setState({\n mobile: {\n value: \"\",\n isError: true,\n errorMessage: \"Mobile is mandatory*\",\n },\n });\n }\n\n if (!this.state.folio.value) {\n this.setState({\n folio: {\n value: \"\",\n isError: true,\n errorMessage: \"Folio is mandatory*\",\n },\n });\n }\n if (!this.state.category.value) {\n this.setState({\n category: {\n value: \"\",\n isError: true,\n errorMessage: \"Category is mandatory*\",\n },\n });\n }\n if (!this.state.investmentAmount.value) {\n this.setState({\n investmentAmount: {\n value: \"\",\n isError: true,\n errorMessage: \"Investment amount is mandatory*\",\n },\n });\n }\n if (!this.state.euinNo.value) {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n },\n });\n }\n\n const keys = Object.keys(others);\n\n const findError = keys.every((key) => !!others[key].value);\n\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: `${key.toLowerCase()} is mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n switch (firstErroredKey) {\n case \"sipType\":\n this.sipTypeField.focus();\n break;\n // case \"fund\":\n // this.fundField.focus();\n // break;\n case \"scheme\":\n this.schemeField.focus();\n break;\n case \"investmentFrequency\":\n this.investmentFrequency.focus();\n break;\n case \"sipDay\":\n this.sipDay.focus();\n break;\n case \"installmentAmount\":\n this.installmentAmount.focus();\n break;\n case \"mode\":\n this.modeField.focus();\n break;\n case \"email\":\n this.emailField.focus();\n break;\n case \"mobile\":\n this.mobileField.focus();\n break;\n }\n } else if (\n invName.value === \"\" &&\n (this.state.sipType.value === NEW || this.state.sipType.value === NEWP)\n ) {\n this.setState({\n invName: {\n value: \"\",\n isError: true,\n errorMessage: \"Investor name is mandatory*\",\n },\n });\n this.invNameField.focus();\n return;\n } else if (others.sipType === EXISTING && !folio.value) {\n this.setState({ folio: { ...folio, isError: true } });\n this.folioField.focus();\n return;\n } else if (\n (others.sipType.value === NEW || schemeType === NEW) &&\n !category.value\n ) {\n this.setState({ category: { ...category, isError: true } });\n this.categoryField.focus();\n return;\n } else if (\n (others.sipType.value === NEW || others.sipType.value === NEWP) &&\n (!email.value ||\n !/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(email.value))\n ) {\n this.setState({\n email: {\n ...email,\n isError: true,\n errorMessage: \"Please enter a valid Email ID\",\n },\n });\n this.emailField.focus();\n return;\n } else if (\n others.sipType.value === NEW &&\n (!mobile.value || !/^[6-9]\\d{9}$/.test(mobile.value))\n ) {\n this.setState({ mobile: { ...mobile, isError: true } });\n this.mobileField.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.sipType.value === NEW || others.sipType.value === EXISTINGP) &&\n (!investmentAmount.value ||\n parseFloat(investmentAmount.value) <\n parseFloat(this.state.minimumLumpsumAmout))\n ) {\n if (\n parseFloat(investmentAmount.value) <\n parseFloat(this.state.minimumLumpsumAmout)\n ) {\n this.setState({\n investmentAmount: {\n value: \"\",\n isError: true,\n errorMessage: `Lumpsum amount should be more than ${this.state.minimumLumpsumAmout}`,\n },\n });\n } else {\n this.setState({\n investmentAmount: { ...investmentAmount, isError: true },\n });\n }\n\n this.investmentAmount.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 !!others.investmentFrequency.value &&\n !!others.investmentFrequency.value.Minimum_Instalment &&\n this.state.installments.value <\n others.investmentFrequency.value.Minimum_Instalment &&\n others.investmentFrequency.value.FrequencyID !== \"Quarterly\" &&\n !this.state.perpetualSip\n ) {\n this.installmentsField.focus();\n this.setState({\n installments: {\n value: \"\",\n isError: true,\n errorMessage: `Please check minimum no. of installments`,\n },\n });\n } else if (\n this.state.minAmountValue.value > this.state.installmentAmount.value\n ) {\n this.setState({\n installmentAmount: {\n value: \"\",\n isError: true,\n errorMessage: `Minimum SIP amount is ${this.state.minAmountValue.value} (₹)`,\n },\n });\n this.installmentAmount.focus();\n return;\n } else if (\n !!others.investmentFrequency.value &&\n this.state.installments.value < 12 &&\n (others.investmentFrequency.value.FrequencyID === \"Quarterly\") &\n !this.state.perpetualSip\n ) {\n this.setState({\n installments: {\n value: \"\",\n isError: true,\n errorMessage: `Please check Minimum No. of Installments `,\n },\n });\n } else if (d1 > d2) {\n this.setState({\n sip_end_date: {\n value: \"\",\n isError: true,\n errorMessage: `SIP end date cannot exceed mandate validity\n date of ${selectedKotm.value[\"MANDATE END DATE\"]}.`,\n },\n });\n return;\n } else {\n const { transactionType } = this.state;\n this.props.setSipDetails(this.state);\n const { location } = this.props;\n const { state } = location;\n if (\n others.sipType.value === NEW ||\n others.sipType.value === NEWP ||\n others.sipType.value === EXISTINGP\n ) {\n const { investorData } = this.props;\n const params = {\n InvestorName: this.state.invName.value || \"\",\n i_entby: this.props.userId,\n trtype: PURCHASE,\n Desci: \"Yes~S~\",\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: investorData.PAN || state.pan,\n Email: this.state.email.value,\n fEmailFlag: this.state.Family_Code_Email.value.value,\n fMobileFlag: this.state.Family_Code_Phone.value.value,\n i_Acno:\n others.sipType.value === EXISTINGP\n ? this.state.folio.value.value\n : \"0\",\n Subbroker: this.state.subBrokerCode.value,\n i_Fund: \"176\",\n i_UntAmtValue:\n this.state.sipType.value === NEW ||\n this.state.sipType.value === EXISTINGP\n ? this.state.investmentAmount.value\n : \"\",\n EUINFlag: this.state.radioValue.value === \"no\" ? NO : YES,\n EuinValid: this.state.radioValue.value === \"no\" ? NO : YES,\n noofinstallments: this.state.installments.value,\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: \"S\",\n sipenddt: new Date(\n this.state.sip_end_date.value.split(\"/\").reverse().join(\"/\")\n ).toLocaleDateString(\"en-US\"),\n sipstartdt: new Date(\n this.state.sip_start_date.value.split(\"/\").reverse().join(\"/\")\n ).toLocaleDateString(\"en-US\"),\n sipfrequency: this.state.investmentFrequency.value.FrequencyID,\n sipamount: this.state.installmentAmount.value,\n ModuleName: \"Webile\",\n paymode: this.state.mode.value,\n countrycode: this.state.code.value,\n subtrtype: !!this.state.transactiontype_flexi ? \"fsip\" : \"\",\n UMRN: this.state.selectedKotm?.value?.UMRNNO,\n };\n const response = await this.props.submitPurchaseData(params);\n\n if (response) {\n const {\n DtData: [purchaseData],\n } = response;\n const confirmationParams = {\n Trtype: PURCHASE,\n fund: \"176\",\n\n Refno: purchaseData.refno,\n ModuleName: \"Webile\",\n };\n const confirmationResponse =\n await this.props.showPurchaseConfirmation(confirmationParams);\n\n if (confirmationResponse) {\n this.props.saveTransactionDetails(this.state);\n this.props.history.push({\n pathname: INVESTOR_URL + \"/sip/digital/transact/confirm\",\n state: {\n title: \"SIP\",\n type: SIP,\n InvestorEmail:\n this.state.sipType.value === NEW ||\n this.state.sipType.value === NEWP\n ? this.state.email.value\n : \"\",\n InvestorMobile:\n this.state.sipType.value === NEW ||\n this.state.sipType.value === NEWP\n ? this.state.mobile.value\n : \"\",\n arnCode: this.state.arnCode.value,\n scheme: {\n Fund: \"176\",\n },\n fEmailFlag: this.state.Family_Code_Email.value,\n fMobileFlag: this.state.Family_Code_Phone.value,\n UMRN: this.state.selectedKotm?.value?.UMRNNO,\n },\n });\n }\n }\n } else {\n this.props.saveTransactionDetails(this.state);\n this.props.history.push({\n pathname: INVESTOR_URL + \"/sip/digital/transact/confirm\",\n state: {\n title: \"SIP\",\n type: SIP,\n InvestorEmail:\n this.state.sipType.value === NEW ||\n this.state.sipType.value === NEWP\n ? this.state.email.value\n : \"\",\n InvestorMobile:\n this.state.sipType.value === NEW ||\n this.state.sipType.value === NEWP\n ? this.state.mobile.value\n : \"\",\n arnCode: this.state.arnCode.value,\n Folio: { value: this.state.folio.value.value },\n scheme: {\n Fund: \"176\",\n },\n UMRN: this.state.selectedKotm.value.UMRNNO,\n },\n });\n }\n }\n };\n\n render() {\n const {\n sipType,\n schemeType,\n fund,\n sipTypes,\n funds,\n folios,\n folio,\n arnCode,\n subArnCode,\n subBrokerCode,\n modes,\n mode,\n categories,\n category,\n schemes,\n scheme,\n euinNo,\n radioValue,\n minAmount,\n frequencies,\n investmentFrequency,\n sipDays,\n sipDay,\n installments,\n sip_end_date,\n sip_start_date,\n installmentAmount,\n investmentAmount,\n email,\n mobile,\n invName,\n Family_Code_Email,\n Family_Code_Phone,\n transactionType,\n kotm,\n selectedKotm,\n } = this.state;\n const { euinList } = this.props;\n const { location } = this.props;\n const { state } = location;\n\n\n return (\n \n \n {!!investmentFrequency.value.FrequencyDescription &&\n investmentFrequency.value.FrequencyDescription === \"Weekly\" &&\n \"For 'weekly' frequency, the SIP start date will be on Wednesday falling on or after the cooling period (currently 30 days) from the date of transaction.\"}\n
\n {this.state?.sipDay?.value?.value &&\n SIP
\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 disabled={true}\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 isError={Family_Code_Email.isError}\n errorMessage={Family_Code_Email.errorMessage}\n />\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 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 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 Perpetual SIP\n
\n \n } \n \n (this.installmentsField = ele)}\n errorMessage={installments.errorMessage}\n disabled={installments.disabled}\n placeholder={installments.placeholder}\n />\n
\n {(this.state.investmentFrequency.value.FrequencyID === \"Monthly\" || this.state.investmentFrequency.value.FrequencyID === \"Quarterly\") &&\n \n \n
\n {/* SIP Transaction Type
\n \n Flexi\n
\n \n
\n Flexi SIP
\n \n
\n \n Freedom SIP
\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 \n The investor has only one active KOTM 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 \n
\n\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 (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.showError(\"installmentAmount\")}\n isShowError={installmentAmount.isError}\n inputref={(ele) => (this.installmentAmount = ele)}\n errorMessage={installmentAmount.errorMessage}\n />\n
\n {(sipType.value === NEW || sipType.value === EXISTINGP) && (\n \n
\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactions, investor }) => {\n const { fundList, token, userId, investorData, communicationDetails } =\n authReducer;\n const { euinList, fundsList, sipDetails = {},transactionDetails } = transactions;\n const { kycData } = investor;\n return {\n fundList,\n token,\n userId,\n euinList,\n investorData,\n communicationDetails,\n fundsList,\n sipDetails,\n kycData,\n transactionDetails\n };\n },\n {\n validateSubBroker,\n swpOptions,\n getNewPurchaseFundList,\n getOtherSchemes,\n getAssetClasses,\n CalcSIPEnddt,\n getCheckPanKotm,\n getCheckPanAotm,\n setSipDetails,\n submitPurchaseData,\n showPurchaseConfirmation,\n getMinimumAmount,\n saveTransactionDetails\n }\n)(Sip);\n\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];\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 saveTransactionDetails,\n} from \"shared/store/actions\";\nimport { NEW_TRANSACTION_URL } from \".\";\nimport IntegrationReactSelect from \"../../forms/autoCompleteInput\";\nimport { textAlign } from \"@material-ui/system\";\nimport { SundaramMutualFund } from \"./newPurchaseForm\";\nimport { INVESTOR_URL } from \"../investors\";\nclass Swp extends Component {\n constructor(props) {\n super(props);\n\n\n this.state = {\n // funds,\n minAmountValue: { value: \"\" },\n fund: { value: {value:\"176\"} },\n folios: [],\n folio: { value: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n swpOption: { value: \"\" },\n swpOptions: [],\n swpFrequency: { value: \"\" },\n swpFrequencyOptions: [],\n withdrawals: { value: \"\" },\n minAmountValue: { 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 });\n } else if (value.value === \"176\") {\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\n async componentDidMount() {\n window.scrollTo({\n behavior:\"smooth\",\n top:0\n })\n const { transactionDetails } = this.props;\n if (!!transactionDetails && (Object.keys(transactionDetails).length > 0)) {\n this.setState(transactionDetails);\n return;\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() === \"176\") {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n this.setState({\n ...this.state,\n fund: { value: { value: \"176\" } },\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 // const banks = this.props.bankDetails.filter(item => item.foliono === 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 === \"176\" && curr.Acno === folio) {\n return [...prev, curr];\n }\n return prev;\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: \"176\",\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: \"176\",\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: \"176\",\n Astscheme:!!event.target.value && !!event.target.value.FrequencyDescription ? event.target.value.FrequencyDescription:\"\"\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 minAmountValue: {\n value: event.target.value.FrequencyID === \"Yearly\" ? 1000 : 500,\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 {\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\"\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: \"176\",\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\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 < 2 ? true : !value,\n errorMessage:\n this.state.withdrawals.value < 2\n ? \"Please enter the vaild number of Withdrawals\"\n : \"\",\n },\n });\n }\n // else if (label === \"amount\") {\n // this.setState({\n // [label]: {\n // value,\n // isError:\n // this.state.minAmountValue.value < this.state.amount.value\n // ? true\n // : !value,\n // errorMessage:\n // this.state.minAmountValue.value < this.state.amount.value\n // ? `Amount should be ${this.state.minAmountValue.value}`\n // : \"\"\n // }\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 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: \"Investment 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 ...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 === \"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 \"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 \"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 }\n } else if (this.state.withdrawals.value < 2) {\n this.setState({\n withdrawals: {\n value: \"\",\n isError: true,\n errorMessage: `Please check the minimum Withdrawals Value`,\n },\n });\n } else if (\n (parseFloat(this.state.amount.value) < this.state.minAmountValue.value ||\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: `Minimum amount is ${this.state.minAmountValue.value}(₹)`,\n },\n });\n } else {\n const {\n funds,\n folios,\n schemes,\n swpFrequencyOptions,\n ...others\n } = this.state;\n this.props.saveTransactionDetails(this.state);\n this.props.history.push({\n pathname: INVESTOR_URL + \"/swp/digital/transact/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 } = this.state;\n return (\n \n
\n ) : (\n \"\"\n )}\n SWP
\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 Minimum Amount (₹)
*/}\n Current Value
\n \n {/*
\n {!!scheme.value ? scheme.value.value.MinAmt : \"\"}
*/}\n {!!scheme.value ? `₹ ${scheme.value.value.CurValue}` : \"\"}
\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}\n value={withdrawals.value}\n errorMessage={withdrawals.errorMessage}\n />\n
\n \n (this.swpFrquencyField = ele)}\n isError={swpFrequency.isError}\n disabled={!withdrawals.value}\n errorMessage={swpFrequency.errorMessage}\n >\n {swpFrequencyOptions.map((item, index) => (\n \n ))}\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 Withdrawal Period
\n \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 \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 // disabled={redemptionType === FULL ? true : false}\n onChange={(event) => this.handleMinimumAmount(event)}\n value={amount.value}\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,transactionDetails } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n bankDetails,\n investorData,\n communicationDetails,\n transactionDetails\n };\n },\n { swpOptions, CalcSIPEnddt, getMinimumAmount,saveTransactionDetails }\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 saveTransactionDetails,\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\";\n\nclass Stp extends Component {\n constructor(props) {\n super(props);\n const { stpDetails, location } = this.props;\n const { state } = location;\n const { transaction } = state || {}; \n this.state = {\n fund: { value: { value: \"176\" } },\n folios: [],\n folio: {\n value: !!transaction\n ? {\n label: transaction.acno,\n value: transaction.acno,\n }\n : \"\",\n },\n schemes: [],\n scheme: {\n value: !!transaction\n ? {\n label: transaction.schemename,\n value: transaction.scheme_code,\n }\n : \"\",\n },\n radioValue: {\n value: !!transaction && transaction.euinopt === \"Y\" ? \"yes\" : \"no\",\n },\n arnCode: { value: this.props.token },\n subArnCode: { value: \"\" },\n euinNo: {\n value:\n !!transaction && transaction.euinopt == \"N\"\n ? transaction.euincode\n : \"\",\n },\n subBrokerCode: { value: \"\" },\n categories: [],\n category: { value: !!transaction ? transaction.category : \"\" },\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 swpFrequency: { vale: \"\" },\n minimumInstallments: \"\",\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: { vale: \"\" },\n schemes: [],\n scheme: { value: \"\" },\n });\n return;\n } else if (value.value === \"176\") {\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: { vale: \"\" },\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 const { transactionDetails } = this.props;\n if (!!transactionDetails && (Object.keys(transactionDetails).length > 0)) {\n this.setState(transactionDetails);\n return;\n }\n this.getFolios();\n if (this.props?.location?.state?.transaction) {\n let schemes = this.schemes(this.props.location.state.transaction.acno);\n const findingScheme = schemes.find(\n (ele) =>\n `176~${ele.Sch}~${ele.Pln}~${ele.Opt}` ===\n this.props.location.state.transaction.scheme_code\n );\n this.setState({\n schemes,\n scheme: {\n value: {\n label: this.props.location.state.transaction.schemename,\n value: findingScheme,\n },\n },\n });\n this.getAssetClasses(this.props.location.state.transaction.acno);\n this.getOtherSchemes(this.props.location.state.transaction.category);\n const params = {\n fund: \"176\",\n opt: \"SWPW\",\n };\n const response = await this.props.swpOptions(params);\n const swpOptionsResponse = response.Dtinformation;\n this.setState({\n swpOptions: swpOptionsResponse,\n });\n }\n const params = {\n opt: \"SF\",\n fund: \"176\",\n astscheme: \"\",\n };\n const sipCycleResponse = await this.props.swpOptions(params);\n const sipCycleResponseOptions = !!sipCycleResponse\n ? sipCycleResponse.Dtinformation\n : \"\";\n this.setState({\n stpDates: sipCycleResponseOptions,\n });\n }\n getFolios = () => {\n const folios = this.props.fundList.reduce((prev, curr) => {\n if (curr.Fund.trim() === \"176\") {\n return [...prev, curr.Acno];\n }\n return prev;\n }, []);\n\n this.setState({\n ...this.state,\n fund: { value: { value: \"176\" } },\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: { vale: \"\" },\n });\n this.validateBrokerCode(\"176\")();\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: \"176\",\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: { vale: \"\" },\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: \"176\",\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() === \"176\" && 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: { vale: \"\" },\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: { vale: \"\" },\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: \"176\",\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 if (!!this.props.location.state.transaction) {\n const findingInScheme = otherSchemes.DtData.find(\n (ele) =>\n ele.fm_schdesc ===\n this.props.location.state.transaction.Switch_in_scheme\n );\n this.setState({\n switchInScheme: {\n value: {\n label: this.props.location.state.transaction.Switch_in_scheme,\n value: findingInScheme,\n },\n },\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: \"176\",\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 (\n label === \"subArnCode\" ||\n (label === \"subBrokerCode\" && 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 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: \"176\",\n StartDate: day,\n installments: this.state.transfers.value,\n Frequency: this.state.swpFrequency.vale,\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 handleChangeTransfers = async (event) => {\n const transferValue = event.target.value;\n const params = {\n fund: \"176\",\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: swpOptionsResponse,\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\"\n : \"Transfers value is mandatory*\",\n },\n swpOptions: swpOptionsResponse,\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\n submit = () => {\n let amountValue;\n const {\n amount,\n transfers,\n sipEndDate,\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 stpDates,\n minimumInstallments,\n ...others\n } = this.state;\n if (!!this.state.amount) {\n amountValue = parseFloat(this.state.amount.value.replace(/,/g, \"\"));\n }\n if (this.state.transfers.value === \"\") {\n this.setState({\n transfers: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter the no of transfers value\",\n },\n });\n }\n if (\n this.state.radioValue.value === \"no\" ||\n this.state.euinNo.value === \"\"\n ) {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n },\n });\n }\n const minAmount = 1000;\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 Date is mandatory\"\n : key === \"swpOption\"\n ? \"STP Option is mandatory*\"\n : `${key} 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 (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 } 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 ) {\n this.setState({\n transfers: {\n value: \"\",\n isError: true,\n errorMessage: \"Please check the no of transfers value\",\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 } 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 this.props.saveTransactionDetails(this.state);\n\n this.props.setStpDetails(this.state);\n\n this.props.history.push({\n pathname: INVESTOR_URL + \"/stp/digital/transact/confirm\",\n state: {\n title: \"STP Payment Summary\",\n type: STP,\n Folio: { value: this.state.scheme.value.value.Acno },\n scheme: { Fund: \"176\" },\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 const minAmount = 1000;\n\n if (label === \"transfers\") {\n this.setState({\n [label]: {\n value,\n isError:\n parseFloat(this.state.transfers.value) <\n parseFloat(this.state.minimumInstallments) ||\n this.state.transfers.value === \"\"\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 with-drawals should be minimum ${this.state.minimumInstallments}`\n : \"\",\n },\n });\n } else if (label === \"amount\") {\n this.setState({\n [label]: {\n value,\n isError:\n amountValue < minAmount &&\n this.state.swpOption.value.Description === \"Fixed\"\n ? true\n : !value,\n errorMessage:\n amountValue < minAmount &&\n this.state.swpOption.value.Description === \"Fixed\"\n ? `Minimum amount should be ${minAmount}(₹)`\n : \"\",\n },\n });\n } else {\n this.setState({\n [label]: {\n value,\n isError: !value,\n },\n });\n }\n };\n\n handleChangeStpFrequency = async (event) => {\n if (event.target.value === this.state.swpFrequency.vale) {\n return;\n } else {\n const transfer = this.state.stpDates.find(\n (ele) => ele.FrequencyID === event.target.value\n );\n const params = {\n opt: \"STPD\",\n fund: \"176\",\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: { vale: event.target.value },\n minimumInstallments: transfer.Minimum_Instalment,\n transfers: { value: \"\" },\n sipCycle: sipCycleResponseOptions,\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 value={amount.value}\n type=\"number\"\n onBlur={this.showError(\"amount\")}\n isShowError={amount.isError}\n errorMessage={amount.errorMessage}\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 = {},transactionDetails } = transactions;\n return {\n fundList,\n token,\n userId,\n euinList,\n stpDetails,\n bankDetails,\n investorData,\n communicationDetails,\n transactionDetails\n };\n },\n {\n validateSubBroker,\n getAssetClasses,\n getOtherSchemes,\n swpOptions,\n setStpDetails,\n CalcSIPEnddt,\n saveTransactionDetails\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 STP
\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 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
\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 (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 type=\"number\"\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 type=\"number\"\n onChange={this.changeValue(\"subBrokerCode\")}\n />\n
\n \n \n \n \n
\n {radioValue.value === \"no\" ? (\n EUIN
\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=\"Select EUIN\"\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 (this.stpFrequencyField = ele)}\n handleChange={this.handleChangeStpFrequency}\n value={this.state.swpFrequency.vale}\n >\n {stpDates.length > 0\n ? stpDates.map((item, index) => (\n \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 />\n
\n\n \n (this.swpDateField = ele)}\n isError={sipDay.isError}\n placeholder=\"STP Date\"\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
\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 {swpOptions.map((item, index) => (\n \n ))}\n \n
\n {swpOption.value.Description === \"Fixed\" ? (\n \n
\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 {label}\n {isError && (\n {`${props.type} not found`}
;\n }\n }\n return component;\n};\n\nfunction Form({\n ui = [],\n submitButtonLabel = '',\n buttonExtraActions = false,\n isCancel = false,\n onCancel,\n cancelButtonLabel = 'Cancel',\n formik,\n parentClass = '',\n ...props\n}) {\n return (\n <>\n \n \n );\n}\n\nexport default Form;\n","import React from \"react\";\nimport { FormControl, InputAdornment, Input } from \"@material-ui/core\";\nimport { useState, useEffect } from \"react\";\nimport { useHistory } from \"react-router\";\n//import { CommercialRootPath } from '../../components/home/commercial/routeConfig';\n//import { useSchemeSearch } from '../../hooks/useSchemeData';\nimport { favLogos } from \"../../logo/logos\";\nimport { _debounce } from \"../../utils/utilityFunctions\";\nimport Image from \"../../components/Image\";\n\nimport \"./searchinput.scss\";\n \nconst Suggestions = ({\n options = [],\n maxItems = 100,\n searchParam,\n}) => {\n const history = useHistory();\n if (!searchParam) return null;\n if (searchParam && !options.length) {\n return (\n- \n {options.slice(0, maxItems).map((ele) => (\n
- \n
\n
\n \n \n ))}\n
![\"icon\"](\"/images/search-icon-dark.svg\"){kind=icon}
\n// ) : (\n// ![\"icon\"](\"/images/search-icon.svg\"){kind=icon}
\n// )}\n// \n// }\n// onFocus={() => setShow(true)}\n// // onBlur={() => {\n// // setShow(false);\n// // setOptions([]);\n// // }}\n// onChange={_debounce(callFilterFuncion, 500, _handleInputChange)}\n// {...rest}\n// />\n// {/* {show && \n {/* { */}\n {/* { */}\n {/* nominees.every((_ele) => !_ele.isEditable) */}\n {/* ? props.history.goBack() */}\n {/* : nominees.map( */}\n {/* (_ele, index) => */}\n {/* _ele.isEditable && cancelFormSubmission(index, `${index}`), */}\n {/* ); */}\n {/* }} */}\n {/* /> */}\n {/* } */}\n
\n );\n }\n ","import React from 'react';\nimport en from '../../../lang/en-us';\nimport {\n accountNumberRegex,\n accountNumberValidation,\n ACCOUNT_TYPE_MASTER_DATA,\n emailRegex,\n isAlphaNumeric,\n MAX_LENGTH_FOR_GUARDIAN_NAME,\n minDateForCalender,\n MODE_OF_HOLDING_MASTER_DATA,\n TAX_RESIDENCY_MASTER_DATA,\n validateIfsc,\n} from '../../../utils/constants';\nimport { getTaxStatusCode } from '../portfolios/utils';\nconst { dashboard, common } = en;\n\n\n\nconst joinName = (name) => {\n if (name) {\n return name.split(' ').join('').toLowerCase();\n }\n return '';\n};\n\nexport const validateName = (oldName, newName) => {\n const match = /\\d/.test(newName);\n if (newName.trim().length < 5) {\n return {\n error: true,\n helperText: dashboard.CorrectionFolios.Selection.Fields.errors.name.minFiveCharacters,\n };\n }\n\n if (match) {\n return {\n error: true,\n helperText: dashboard.CorrectionFolios.Selection.Fields.errors.name.noNumericValues,\n };\n }\n if (joinName(oldName) === joinName(newName)) {\n return {\n error: true,\n helperText: dashboard.CorrectionFolios.Selection.Fields.errors.name.sameNames,\n };\n }\n return { error: false, helperText: '' };\n};\n\nexport const ifscRegex = /^[A-Za-z]{4}0[A-Z0-9a-z]{6}$/;\n\nexport const initSelection = [\n {\n label: dashboard.CorrectionFolios.Selection.Fields.primaryHolder,\n type: 'text',\n isSelected: false,\n newValue: '',\n field: 'investorName',\n validate: ({ value, newValue }) => {\n if (newValue) {\n return validateName(value, newValue);\n }\n return { error: false, helperText: '' };\n },\n handleChangeCondition: (newValue) => {\n if (isAlphaNumeric(newValue) || !newValue) {\n return true;\n }\n },\n }, \n {\n label: dashboard.CorrectionFolios.Selection.Fields.secondHolder,\n field: 'secondHolder',\n type: 'text',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue) {\n return validateName(value, newValue);\n }\n return { error: false, helperText: '' };\n },\n handleChangeCondition: (newValue) => {\n if (isAlphaNumeric(newValue) || !newValue) {\n return true;\n }\n },\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.thirdHolder,\n field: 'thirdHolder',\n type: 'text',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue) {\n return validateName(value, newValue);\n }\n return { error: false, helperText: '' };\n },\n handleChangeCondition: (newValue) => {\n if (isAlphaNumeric(newValue) || !newValue) {\n return true;\n }\n },\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.guardianName,\n field: 'guardian_name',\n type: 'text',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue) {\n return validateName(value, newValue);\n }\n return { error: false, helperText: '' };\n },\n handleChangeCondition: (newValue) => {\n if (isAlphaNumeric(newValue) || !newValue) {\n return true;\n }\n },\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.mobileNo,\n field: 'mobile',\n type: 'number',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue) {\n if (newValue[0] == 0) {\n return {\n error: true,\n helperText:\n dashboard.CorrectionFolios.Selection.Fields.errors.mobile\n .startingWithZero,\n };\n }\n if (/\\D/.test(newValue) || newValue.length !== 10) {\n return {\n error: true,\n helperText:\n dashboard.CorrectionFolios.Selection.Fields.errors.mobile.validNumber,\n };\n }\n return { error: false, helperText: '' };\n }\n return { error: false, helperText: '' };\n },\n handleChangeCondition: (newValue) => {\n if ((/^\\d+$/.test(newValue) || !newValue) && newValue.length < 11) {\n return true;\n }\n },\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.dateOfBirth,\n field: 'dob',\n type: 'dob',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue) {\n const currentDate = new Date();\n if (currentDate < new Date(newValue)) {\n return { error: true, helperText: common.errors.dob.minDOBValidation };\n }\n if (new Date(newValue) < new Date(minDateForCalender())) {\n return { error: true, helperText: common.errors.dob.ageLessThanHundred };\n }\n }\n return { error: false, helperText: '' };\n },\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.bankAccNo,\n field: 'bank_accountNo',\n type: 'text',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue) {\n if (!accountNumberRegex.test(newValue)) {\n return {\n error: true,\n helperText: common.errors.bankErrors.accountNo.regexError,\n };\n }\n }\n return { error: false, helperText: '' };\n },\n handleChangeCondition: (newValue) => {\n if (accountNumberValidation(newValue)) {\n return true;\n }\n },\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.bankAccType,\n field: 'bank_accountType',\n type: 'text',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue && newValue === 'Select') {\n return { error: true, helperText: common.errors.bankErrors.accountType };\n }\n return { error: false, helperText: '' };\n },\n masterData: ACCOUNT_TYPE_MASTER_DATA,\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.bankIfsc,\n field: 'bank_ifsc',\n type: 'text',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue) {\n const match = ifscRegex.test(newValue);\n if (!match) {\n return { error: true, helperText: common.errors.bankErrors.ifsc.regex };\n }\n }\n return { error: false, helperText: '' };\n },\n handleChangeCondition: (newValue) => {\n if (validateIfsc(newValue)) {\n return true;\n }\n return false;\n },\n shouldValidateField: true,\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.taxResidency,\n field: 'taxStatus',\n type: 'text',\n isSelected: false,\n newValue: '',\n masterData: Object.values(getTaxStatusCode),\n validate: ({ value, newValue }) => {\n if (newValue === 'Select') {\n return { error: true, helperText: common.errors.taxResidency };\n }\n return { error: false, helperText: '' };\n },\n },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.modeOfHolding,\n field: 'modeOfHolding',\n type: 'text',\n isSelected: false,\n newValue: '',\n masterData: MODE_OF_HOLDING_MASTER_DATA,\n validate: ({ value, newValue }) => {\n if (newValue === 'Select') {\n return { error: true, helperText: common.errors.modeOfHolding };\n }\n return { error: false, helperText: '' };\n },\n },\n // {\n // label: dashboard.CorrectionFolios.Selection.Fields.dpIdNdClientId,\n // field : 'dpid',\n // type: 'text',\n // isSelected : false,\n // newValue : '',\n // },\n {\n label: dashboard.CorrectionFolios.Selection.Fields.email,\n field: 'email',\n type: 'text',\n isSelected: false,\n newValue: '',\n validate: ({ value, newValue }) => {\n if (newValue && !newValue.match(emailRegex)) {\n return { error: true, helperText: common.errors.email.regex };\n }\n return { error: false, helperText: '' };\n },\n },\n];\n","import React from \"react\";\n// import en from '../../../../lang/en-us';\n// import TextInput from '../../../../lib/TextField';\n// const { dashboard, common } = en;\n// import { useEffect, useState } from 'react';\n// import { connect } from 'react-redux';\n// import { ConsolidateTableRowType } from '../ConsolidationFolios/types';\n// import { BANK } from '../../../../redux-store/types/nct';\n// import { SubmitButton } from '../../../../lib/Button';\n// import { FormControl, FormHelperText, MenuItem, Select } from '@material-ui/core';\n// import {\n// accountNumberRegex,\n// accountNumberValidation,\n// ACCOUNT_TYPE_MASTER_DATA,\n// getBankAddress,\n// ifscRegex,\n// MINOR_MAJOR,\n// validateIfsc,\n// } from '../../../../utils/constants';\n// import { RootStateType } from '../../../../redux-store/reducers';\n// import {\n// fetchIFSCDetails as getIfscDetails,\n// sendPhoneOTP,\n// } from '../../../../redux-store/actions/nct';\n// import { NoteModals } from '../../../../lib/NoteModals';\n// import { useRef } from 'react';\n// import { IfscModal } from '../../../../lib/NoteModals/ifscModal';\n// import { ActionHeader, FaqLink } from '..';\n\n// export type BANK_DETAILS = {\n// label: string;\n// value: string;\n// name: string;\n// fieldValidation?: any;\n// actionOnBlur?: boolean;\n// isDisabled: boolean;\n// shouldValidateField?: boolean;\n// options?: { label: string; value: string | number }[];\n// };\n\n// const initialValues = {\n// accountNo: '',\n// accountType: '',\n// branch: '',\n// city: '',\n// default: '',\n// ifsc: '',\n// micr: '',\n// name: '',\n// neftIfsc: '',\n// pincode: '',\n// };\n\n\n\nexport function ValidationUI({\n isValidating = false,\n onValidationText = 'Validating',\n successfulValidationText = 'Validated',\n}) {\n return (\n \n
\n \n {/*
\n {dashboard.UpdateNominee.UpdateNomineeInfo}
*/}\n\n {nominees.every((_ele) => !_ele.isEditable) && (\n resetForm(ind)}\n handleNomineeChange={(\n key,\n value,\n ind\n ) => handleNomineeChange(key, value, ind)}\n handleAddressCheck={handleAddressCheck}\n saveNominee={(key, value, ind) => {\n const nominee = [...nominees];\n nominee[ind] = {\n ...nominee[ind],\n isEditable: false,\n isNewlyAdded: false,\n isEdited: true,\n };\n setNominees(nominee);\n }}\n nominees={nominees}\n investorName={investorName}\n relations={\n _ele.relation\n ? relationShips.filter((relation) => {\n const addedRelations = nominees\n .map((nominee) => {\n if (nominee.relation !== _ele.relation)\n return nominee.relation;\n })\n .filter((ele) => ele);\n return !addedRelations.includes(relation.label);\n })\n : relationShips.filter((relation) => {\n const addedRelations = nominees.map(\n (_ele) => _ele.relation\n );\n return !addedRelations.includes(relation.label);\n })\n }\n pan={pan || investorData.PAN}\n cancelFormSubmission={cancelFormSubmission}\n />\n )\n )}\n {!noNomineeFlag && nominees.length < 3 && (\n \n )}\n {(nominees?.length > 0 || noNomineeFlag ) && nominees?.every(\n (_ele) => !_ele.isEditable && !_ele.editShare\n ) && (\n setShow(false)}\n />\n \n setShowShareModal({\n show: false,\n text: \"\",\n })\n }\n />\n
\n \n setNoNomineeFlag(!noNomineeFlag)}\n value={noNomineeFlag}\n label={dbCommercial.profileDetails.nominees.noNominee}\n />\n
\n )}\n {!noNomineeFlag && nominees?.length > 0 && \n nominees?.map((_ele, index) =>\n !_ele?.isEditable ? (\n \n
\n ) : (\n \n
\n \n \n
\n \n {\n setNominees((prevState) => {\n const nominees = [...prevState];\n const { initialState, ...nominee } =\n nominees[index];\n nominees[index].initialState = nominee;\n nominees[index].isEditable = true;\n return nominees;\n });\n }}\n />\n {nominees.length > 1 && (\n {\n setShow(true);\n setDeleteIndex(index);\n }}\n />\n )}\n
\n \n
\n \n
\n \n
\n \n {\" \"}\n {dashboard.UpdateNominee.name}\n
\n{_ele?.name}
\n\n
\n \n {dashboard.UpdateNominee.relation}\n
\n\n {_ele?.relation?.slice(0, 1).toUpperCase() +\n _ele?.relation?.slice(1)}\n
\n\n {!_ele?.editShare ? (\n <>\n
\n {/* \n {dashboard.UpdateNominee.share}\n
\n\n {_ele?.share}%\n {/*
\n {\n if (Number(e.target.value) === 0) {\n alert(\"Nominee share should not be 0\");\n return;\n }\n handleNomineeChange(\n \"editShare\",\n false,\n index\n );\n handleNomineeChange(\n \"isEdited\",\n true,\n index\n );\n }}\n // onChange={(e) => {\n // if (Number(e.target.value) <= 100) {\n // handleNomineeChange(\n // 'share',\n // e.target.value,\n // index,\n // )\n // }\n // }}\n />\n {\n handleNomineeChange(\n \"editShare\",\n false,\n index\n );\n handleNomineeChange(\n \"isEdited\",\n true,\n index\n );\n }}\n />\n
\n )}\n \n {!_ele.showDetails ? (\n \n handleNomineeChange(\n \"showDetails\",\n true,\n index\n )\n }\n >\n {dashboard.UpdateNominee.more}\n \n handleNomineeChange(\n \"showDetails\",\n false,\n index\n )\n }\n >\n {dashboard.UpdateNominee.less}\n
*/}\n \n {\n setNominees((prevState) => {\n const nominees = [...prevState];\n const { initialState, ...nominee } =\n nominees[index];\n nominees[index].initialState = nominee;\n nominees[index].isEditable = true;\n nominees[index].isEdited = true;\n return nominees;\n });\n }}\n />\n {nominees.length > 1 && (\n {\n setShow(true);\n setDeleteIndex(index);\n }}\n />\n )}\n
\n \n
\n )}\n \n \n {isValidating ? (\n <>\n
\n {onValidationText}\n \n ) : (\n \n//
\n// );\n// }\n// export default connect(({ authReducer }: RootStateType) => ({ ...authReducer }), {\n// getIfscDetails,\n// sendPhoneOTP,\n// })(MinorStatusEditBank);\n","import React from \"react\";\nimport {\n Button,\n Checkbox,\n FormControl,\n FormControlLabel,\n FormGroup,\n FormHelperText,\n MenuItem,\n Select,\n SwipeableDrawer,\n InputAdornment,\n} from \"@material-ui/core\";\nimport moment from \"moment\";\nimport { useEffect, useState } from \"react\";\nimport en from \"../../../lang/en-us\";\nimport SearchInput from \"../../../lib/SearchInput\";\nimport TextInput from \"../../../lib/TextField\";\nimport { NOMINEE } from \"shared/store/types/nct\";\nimport { sendPhoneOTP, fetchIFSCDetails } from \"shared/store/actions/nct\";\nimport { NOMINEEINFO } from \"../UpdateNominee/update-nominee-edit\";\nimport { initSelection, validateName } from \"./types\";\nimport { connect } from \"react-redux\";\nimport { RootStateType } from \"shared/store/reducers\";\nimport {\n getDateString,\n ifscRegex,\n isAlphaNumeric,\n minDateForCalender,\n OTP_ACTIONS,\n _minDateForCalender,\n DATA_ERROR,\n} from \"../../../utils/constants\";\nimport { ValidationUI } from \"../MinorStatus/minor-status-edit-bank\";\nimport DatePickerInput from \"../../../lib/DatePicker\";\n//import { ActionHeader, FaqLink } from \"..\";\nimport { SubmitButtonWithLoader } from \"../../../lib/Button\";\nimport { getTaxStatusCode } from \"../portfolios/utils\";\nconst { dashboard, common, nctLinks } = en;\n\nconst payloadKeyValues = {\n investorName: \"firstHolder\",\n secondaryHolderName: \"secondHolder\",\n thirdHolderName: \"thirdHolder\",\n guardian_name: \"guardian\",\n mobile: \"mobile\",\n dob: \"dob\",\n taxStatus: \"taxStatus\",\n modeOfHolding: \"modeOfHolding\",\n email: \"email\",\n};\n\nexport const getNameIndex = (index) => {\n if (index === 1) {\n return \"1st\";\n } else if (index === 2) {\n return \"2nd\";\n } else if (index === 3) {\n return \"3rd\";\n }\n};\n\nfunction CorrectionFoliosSelection(props) {\n const { fund = null } = props.location.state || {};\n const [selection, setSelection] =\n useState(initSelection);\n const [selectedItems, setSelectedItems] = useState([]);\n const [nameFields, setNameFields] = useState([\n dashboard.CorrectionFolios.Selection.Fields.primaryHolder,\n dashboard.CorrectionFolios.Selection.Fields.secondHolder,\n dashboard.CorrectionFolios.Selection.Fields.thirdHolder,\n dashboard.CorrectionFolios.Selection.Fields.guardianName,\n ]);\n const [openDrawer, setDrawer] = useState(false);\n const [showLoader, setLoader] = useState(false);\n const [ifscValidation, setValidation] = useState(false);\n const [nomineesShare, setNomineesShare] = useState([]);\n const [searchString, setSearch] = useState(\"\");\n const [error, setError] = useState({\n error: false,\n message: \"\",\n });\n const [validate, setValidate] = useState(false);\n const [loading, setLoading] = useState(false);\n\n const ifscField = selectedItems.find(\n (_ele) => _ele.field === \"bank_ifsc\"\n );\n\n useEffect(() => {\n setLoader(false);\n if (ifscField?.newValue.length === 11) {\n // document.getElementById(\"bank_ifsc\")?.blur();\n checkForCorrectIFSC();\n }\n }, [ifscField?.newValue]);\n\n const nomineeNamesKey = (index) => {\n return `${index}_nominee_name`;\n };\n\n const nomineeSharesKey = (index) => {\n return `${index}_nominee_share`;\n };\n\n useEffect(() => {\n if (!fund) {\n props.history.push(\"/\");\n return;\n }\n const nameFieldsOfNominee = fund.nominees.map(\n (_ele, index) => `Nominee ${index + 1} name`\n );\n setNameFields([...nameFields, ...nameFieldsOfNominee]);\n const fundKeysByRowData = {\n ...fund,\n bank_ifsc: fund?.bank[0]?.ifsc,\n bank_accountNo: fund?.bank[0]?.accountNo,\n bank_accountType: fund?.bank[0]?.accountType,\n guardian_name: fund?.guardian?.name,\n };\n const nomineesNames = fund.nominees.reduce(\n (prev, curr, index) => {\n return {\n ...prev,\n [nomineeNamesKey(index)]: curr.name,\n };\n },\n {}\n );\n\n const nomineesShares = fund.nominees.reduce(\n (prev, curr, index) => {\n return {\n ...prev,\n [nomineeSharesKey(index)]: curr.percent,\n };\n },\n {}\n );\n\n const nomineesNamesData = fund.nominees\n .slice(0, 3)\n .map((_ele, index) => ({\n label: `${getNameIndex(index + 1)} Nominee name`,\n field: `${index}_nominee_name`,\n type: \"text\",\n isSelected: false,\n newValue: \"\",\n validate: ({\n value,\n newValue,\n }) => {\n if (newValue) {\n return validateName(value, newValue);\n }\n return { error: false, helperText: \"\" };\n },\n handleChangeCondition: (newValue) => {\n if (isAlphaNumeric(newValue) || !newValue) {\n return true;\n }\n },\n }));\n const nomineesShareData = fund.nominees\n .slice(0, 3)\n .map((_nominee, index) => ({\n label: `Share of Nominee ${index + 1} (in %)`,\n field: `${index}_nominee_share`,\n type: \"number\",\n isSelected: false,\n isNominee: true,\n handleChangeCondition: (newValue) => {\n if (\n (/^\\d+$/.test(newValue) || !newValue) &&\n Number(newValue) <= 100\n ) {\n return true;\n }\n },\n newValue: \"\",\n validate: ({ value, newValue }) => {\n if (newValue && Number(newValue) === 0) {\n return { error: true, helperText: \"Share should not be zero\" };\n }\n return { error: false, helperText: \"\" };\n },\n }));\n setNomineesShare(nomineesShareData);\n const updateKeysWithRowData = {\n ...fundKeysByRowData,\n ...nomineesNames,\n ...nomineesShares,\n };\n const updatedSelections = [\n ...initSelection,\n ...nomineesNamesData,\n ...nomineesShareData,\n ].map((selector) => ({\n ...selector,\n value:\n updateKeysWithRowData[\n `${\n selector.field === \"taxStatus\" ? \"taxStatusLabel\" : selector.field\n }`\n ], // manupulating taxStatus\n }));\n setSelection(updatedSelections);\n }, []);\n\n const _handleCheckBoxChange = (\n selector,\n index\n ) => {\n setSelectedItems((prevSelections) => {\n return selector.isSelected\n ? [...prevSelections, selector]\n : prevSelections.filter(\n (_selector) => selector.label !== _selector.label\n );\n });\n\n setSelection((prevSelections) => {\n prevSelections[index] = selector;\n return prevSelections;\n });\n if (selector.isNominee) {\n setNomineesShare(\n nomineesShare.map((_ele) => {\n if (_ele.field === selector.field) {\n return {\n ..._ele,\n isSelected: !_ele.isSelected,\n };\n }\n return _ele;\n })\n );\n }\n };\n\n const handleTextInputChange = (value, label) => {\n setSelectedItems(\n selectedItems.map((_ele) => {\n if (_ele.label === label) {\n return {\n ..._ele,\n newValue: value,\n };\n }\n return _ele;\n })\n );\n };\n\n const checkIfShareIsSelected = () => {\n return nomineesShare.some(\n (_ele) => _ele.isSelected\n );\n };\n\n const handleSubmit = async () => {\n const { fund } = props.location.state;\n const nomineeIds = fund.nominees\n .slice(0, 3)\n .map((_ele) => _ele.id);\n const keyValuePairs = selectedItems.reduce(\n (prev, curr) => ({\n ...prev,\n [curr.field]: curr.newValue || \"\",\n }),\n {}\n );\n const selectedFieldPairs = selection.reduce(\n (prev, curr) => ({\n ...prev,\n [curr.field]: \"\",\n }),\n {}\n );\n const correctedData = { ...selectedFieldPairs, ...keyValuePairs };\n const values = Object.keys(\n payloadKeyValues\n ).reduce(\n (prev, curr) => ({\n ...prev,\n [payloadKeyValues[curr]]: correctedData[curr],\n }),\n {}\n );\n const updatedNominees = nomineeIds.length\n ? nomineeIds.map((_ele, index) => ({\n id: _ele,\n name: correctedData[`${index}_nominee_name`],\n percent: correctedData[`${index}_nominee_share`],\n }))\n : [{ id: 1, name: \"\", percent: \"\" }];\n if (checkIfShareIsSelected()) {\n const totalShare = updatedNominees\n .map((_ele) => _ele.percent)\n .reduce((sum = 0, current) => sum + Number(current), 0);\n if (totalShare < 100) {\n alert(\"Total Share is less than 100 %\");\n return;\n }\n if (totalShare > 100) {\n alert(\"Total Share is greater than 100 %\");\n return;\n }\n }\n const data = {\n folio: fund?.folio,\n amc: fund?.amc,\n ...values,\n taxStatus:\n Object.keys(getTaxStatusCode).find(\n (_ele) => getTaxStatusCode[_ele] === values.taxStatus\n ) || \"\",\n bank: {\n accountNo: correctedData[\"bank_accountNo\"],\n accountType: correctedData[\"bank_accountType\"],\n ifsc: correctedData[\"bank_ifsc\"],\n },\n dob: getDateString(correctedData[\"dob\"]),\n nominees: updatedNominees,\n dpId: \"\",\n };\n const { pan = \"\", pekrn = \"\", mobile = \"\" } = props;\n try {\n setLoading(true);\n let res = await props.sendPhoneOTP({\n mobile,\n pan,\n pekrn,\n action: OTP_ACTIONS.correctionFolios,\n });\n props.history.replace(\"correction-folios-otp\", {\n mobile: props.mobile,\n pan: props.pan,\n amc: fund.amc,\n data,\n ...(res || {}).body,\n });\n } catch (err) {\n alert(err.message);\n } finally {\n setLoading(false);\n }\n };\n\n const checkForCorrectIFSC = async () => {\n setValidation(true);\n setLoader(true);\n let ifsc = (\n selectedItems.find(\n (_ele) => _ele.field === \"bank_ifsc\"\n ) || {}\n ).newValue;\n if (ifsc.match(ifscRegex)) {\n const { pan, pekrn, mobile, reqId } = props;\n try {\n let response = await props.fetchIFSCDetails({\n pan,\n pekrn,\n mobile,\n reqId,\n ifscCode: ifsc,\n });\n const { errors = [], data = [] } = (response || {}).body;\n if (errors.length) {\n const [firstError] = errors;\n throw Error(firstError?.message);\n }\n setValidation(false);\n setError({\n error: false,\n message: \"\",\n });\n } catch (e) {\n setLoader(false);\n setValidation(false);\n setError({ error: true, message: e.message });\n }\n } else {\n setLoader(false);\n setValidation(false);\n setError({ error: true, message: common.errors.bankErrors.ifsc.regex });\n }\n };\n\n const handleSearch = (selections) => {\n if (searchString) {\n return selections.filter((_ele) =>\n _ele.label.toLowerCase().includes(searchString.toLowerCase())\n );\n }\n return selections;\n };\n\n const getNames = (\n selectorKey,\n keyList,\n updatedValue,\n oldValue\n ) => {\n if (updatedValue) {\n const filteredNames = keyList.filter(\n (_ele) => _ele !== selectorKey\n );\n const namesData = selectedItems\n .map((_ele) => {\n if (filteredNames.includes(_ele.label)) {\n return _ele.newValue.trim().toLowerCase();\n }\n })\n .filter((ele) => ele);\n if (validateName(oldValue, updatedValue).error) {\n return validateName(oldValue, updatedValue);\n }\n if (namesData.includes(updatedValue.trim().toLowerCase())) {\n return {\n error: true,\n helperText: `${selectorKey} should not be same as other names`,\n };\n }\n return { error: false, helperText: \"\" };\n }\n return { error: false, helperText: \"\" };\n };\n\n const isButtonDisabled = () => {\n return selectedItems.some((_ele) => {\n if (nameFields.includes(_ele.label)) {\n return getNames(_ele.label, nameFields, _ele.newValue, _ele.value)\n .error;\n }\n return false;\n });\n };\n\n const dataSelection = () => {\n return (\n \n//
\n// \n//
\n// \n//
\n// \n// {dashboard.MinorStatus.ReviewDetails.editFolioBank}\n// {/* Put Folio Number HERE */}\n// {targetFunds[0].folio}\n//
\n//\n// {[\n// {\n// label: dashboard.MinorStatus.ReviewDetails.fields.accountNumber,\n// value: bankDetails.accountNo || '',\n// name: 'accountNo',\n// fieldValidation: accountNumberValidation,\n// isDisabled: false,\n// },\n// {\n// label: dashboard.MinorStatus.ReviewDetails.fields.ifsc,\n// value: bankDetails.ifsc || '',\n// name: 'ifsc',\n// actionOnBlur: true,\n// isDisabled: false,\n// shouldValidateField: true,\n// fieldValidation: validateIfsc,\n// },\n// {\n// label: dashboard.MinorStatus.ReviewDetails.fields.bankName,\n// value: bankDetails.name || '',\n// name: 'name',\n// isDisabled: true,\n// },\n// {\n// label: dashboard.MinorStatus.ReviewDetails.fields.accountType,\n// value:\n// bankDetails.accountType ||\n// dashboard.ChangeBank.selectedFolios.fields.accountType,\n// name: 'accountType',\n// isDisabled: false,\n// },\n// {\n// label: dashboard.MinorStatus.ReviewDetails.fields.branch,\n// value: bankDetails.branch || '',\n// name: 'branch',\n// isDisabled: true,\n// },\n// {\n// label: dashboard.MinorStatus.ReviewDetails.fields.city,\n// value: bankDetails.city || '',\n// name: 'city',\n// isDisabled: true,\n// },\n// ].map((_ele: BANK_DETAILS, index: number) =>\n// _ele.name === 'accountType' ? (\n// \n// {\n// handleChange(e.target.value, _ele.name);\n// }}\n// onBlur={removeErrors}\n// // readOnly={true}\n// >\n// \n// {\n// dashboard.ChangeBank.selectedFolios.fields\n// .accountType\n// }\n// \n// {['SAVINGS'].map((type: string) => (\n// \n// ))}\n// \n// \n// {errors[_ele.name]}\n// \n// \n// ) : (\n// <>\n// \n// {\n// if (_ele.fieldValidation) {\n// _ele.fieldValidation(e.target.value)\n// ? handleChange(\n// e.target.value,\n// _ele.name,\n// )\n// : null;\n// return;\n// }\n// handleChange(e.target.value, _ele.name);\n// }}\n// error={!!errors[_ele.name]}\n// helperText={errors[_ele.name]}\n// onBlur={() => removeErrors()}\n// onFocus={() => setErrors({})}\n// disabled={_ele.isDisabled}\n// title={!!_ele.isDisabled ? _ele.value : ''}\n// />\n// {_ele.shouldValidateField && showLoader && (\n// \n// \n// )}\n// \n// \n// ),\n// )}\n//
\n// \n//
\n// {showModal && (\n// \n
\n );\n };\n\n useEffect(() => {\n setSearch(\"\");\n }, [openDrawer]);\n\n return (\n \n setSearch(value)}\n endAdornment={\n searchString.length > 0 ? (\n \n setSearch(\"\")}\n />\n \n ) : null\n }\n />\n
\n {dashboard.CorrectionFolios.Selection.selectionInfo}
\n\n \n {!!handleSearch(selection).length ? (\n handleSearch(selection).map((selector, index) => (\n \n _handleCheckBoxChange(\n {\n ...selector,\n isSelected: checked,\n },\n index\n )\n }\n checked={selector.isSelected}\n name=\"primary-holder\"\n />\n }\n label={selector.label}\n />\n ))\n ) : (\n \n {nctLinks.notMatched}\n \n )}\n \n
\n \n \n {/*
\n );\n}\n\nexport default connect(\n ({ authReducer, portfolio }) => ({\n ...authReducer,\n ...portfolio,\n }),\n { sendPhoneOTP, fetchIFSCDetails }\n)(CorrectionFoliosSelection);\n","import React from \"react\";\nimport {\n FormControl,\n FormHelperText,\n MenuItem,\n Select,\n } from \"@material-ui/core\";\n import { useFormik } from \"formik\";\n import { useCallback, useEffect } from \"react\";\n import en from \"../../../lang/en-us.js\";\n import { CustomRadio } from \"../../../lib/CustomRadio/index.js\";\n import DatePickerInput from \"../../../lib/DatePicker/index.js\";\n import Form, { InputType } from \"../../../lib/Formik/index.js\";\n import TextInput from \"../../../lib/TextField/index.js\";\n import {\n checkForOnlyAlphabets,\n EIGHTEEN_YEARS_IN_MILLISECONDS,\n isAlphaNumericAddress,\n isAlphaNumeric,\n MAX_LENGTH_FOR_PAN,\n MAX_LENGTH_FOR_NOMINEE_NAME,\n MAX_LENGTH_FOR_GUARDIAN_NAME,\n MAX_LENGTH_FOR_ADDRESS,\n minDateForCalender,\n _minDateForCalender,\n } from \"../../../utils/constants\";\n import { getNameIndex } from \"../CorrectionFolios/correction-folios-selection\";\n import { NOMINEEINFO, validationSchemaNominee } from \"./update-nominee-edit\";\n import Image from \"../../Image\";\n import { CheckBoxField } from \"../../../lib/CheckBoxField\";\n const { dashboard, common } = en;\n function AddNomineeForm(props) {\n const { formik } = props;\n const thisYear = new Date().getFullYear();\n \n const resetFieldError = (fieldName) => {\n const { [fieldName]: excldeKey, ...rest } = formik.errors;\n formik.setErrors(rest);\n };\n \n return (\n <>\n \n
\n {/* \n {dataSelection()}\n
\n \n setDrawer(false)}\n onOpen={() => setDrawer(true)}\n >\n {dataSelection()}\n \n
\n \n \n
\n \n
\n \n {dashboard.CorrectionFolios.Selection.selectedFolio}\n {fund?.folio}\n
\n\n {dashboard.CorrectionFolios.Selection.amc}\n {fund?.amcName}\n
\n\n {/*
\n \n
*/}\n {!!selectedItems.length ? (\n {dashboard.CorrectionFolios.Selection.makeSelection}
\n\n {selectedItems.map((selector, index) => (\n
\n ) : (\n \n
\n ))}\n {selector.label}
\n\n \n \n handleTextInputChange(value, selector.label)\n }\n onBlur={() => setValidate(true)}\n >\n \n {selector.masterData?.map((_ele) => (\n \n ))}\n \n \n {validate\n ? selector.validate &&\n selector.validate({\n value: selector.value,\n newValue: selector.newValue,\n }).helperText\n : \"\"}\n \n \n ) : selector.type === \"dob\" ? (\n {\n handleTextInputChange(date, selector.label);\n }}\n minDate={_minDateForCalender()}\n maxDate={moment(new Date()).format(\"YYYY-MM-DD\")}\n error={\n validate\n ? selector.validate &&\n selector.validate({\n value: selector.value,\n newValue: selector.newValue,\n }).error\n : false\n }\n helperText={\n validate\n ? selector.validate &&\n selector.validate({\n value: selector.value,\n newValue: selector.newValue,\n }).helperText\n : \"\"\n }\n />\n ) : (\n \n {\n if (selector.handleChangeCondition) {\n return selector.handleChangeCondition(value)\n ? handleTextInputChange(\n value,\n selector.label\n )\n : null;\n \n }\n handleTextInputChange(value, selector.label);\n }}\n onBlur={() => {\n if (selector.field === \"bank_ifsc\") {\n setError({\n error: true,\n message: \"\",\n });\n checkForCorrectIFSC();\n }\n setValidate(true);\n }}\n onFocus={() => setValidate(false)}\n error={\n validate\n ? selector.field === \"bank_ifsc\"\n ? error.error\n : nameFields.includes(selector.label)\n ? getNames(\n selector.label,\n nameFields,\n selector.newValue,\n selector.value\n ).error\n : selector.validate &&\n selector.validate({\n value: selector.value,\n newValue: selector.newValue,\n }).error\n : false\n }\n helperText={\n validate\n ? selector.field === \"bank_ifsc\"\n ? error.message\n : nameFields.includes(selector.label)\n ? getNames(\n selector.label,\n nameFields,\n selector.newValue,\n selector.value\n ).helperText\n : selector.validate &&\n selector.validate({\n value: selector.value,\n newValue: selector.newValue,\n }).helperText\n : \"\"\n }\n />\n {selector.shouldValidateField && showLoader && (\n \n \n )}\n \n )}\n
\n \n {dashboard.CorrectionFolios.Selection.nameInRecords}\n {selector.type === \"dob\" ? (\n moment(selector.value).format(\"DD/MM/YYYY\")\n ) : (\n {selector.value || \"Not Available\"}\n )}\n
\n {[\n \"bank_accountType\",\n \"taxStatus\",\n \"modeOfHolding\",\n ].includes(selector.field) ? (\n\n
\n )}\n \n {dashboard.CorrectionFolios.Selection.makeSelection}\n
\n\n {dashboard.CorrectionFolios.Selection.makeSelectionMobile}\n
\n\n {!!selectedItems.length && (\n !!_ele.newValue\n ) ||\n selectedItems.some(\n (_ele) => {\n if (_ele.validate) {\n return _ele.validate({\n value: _ele.value,\n newValue: _ele.newValue,\n }).error;\n }\n return false;\n }\n ) ||\n error.error ||\n isButtonDisabled()\n }\n onClick={handleSubmit}\n label={dashboard.CorrectionFolios.Selection.buttonText}\n loading={loading}\n labelWhileLoading={dashboard.OtpScreen.buttonTextWhileLoading}\n >\n )}\n
\n \n \n {\" \"}\n
\n \n {dashboard.UpdateNominee.save}\n \n {/* formik.resetForm()} className=\"clear-nominee\">\n {dashboard.UpdateNominee.clear}\n */}\n \n props.cancelFormSubmission(props.index - 1, formik.values.id)\n }\n className=\"clear-nominee\"\n >\n {dashboard.UpdateNominee.cancel}\n \n
\n {/* {props.index < 3 && (\n \n )} */}\n \n );\n }\n function ScrollToError({ submitting }) {\n useEffect(() => {\n const el = document.querySelector('.Mui-error, [data-error]');\n if (el) {\n const parentEl = el.parentElement ?? el;\n parentEl.scrollIntoView();\n }\n }, [submitting]);\n return null;\n }\n const AddNominee = ({ initialValues = {}, ...props }) => {\n const validate = (values) => {\n const nomineeNames = props.nominees\n .map((_ele, ind) => {\n if (ind !== props.index - 1) {\n return _ele.name?.trim().toLowerCase();\n }\n })\n .filter((name) => name);\n \n const nomineePans = props.nominees\n .map((_ele, ind) => {\n if (ind !== props.index - 1) {\n return _ele.pan?.trim().toLowerCase();\n }\n })\n .filter((pan) => pan);\n const guardianPans = props.nominees\n .map((_ele, ind) => {\n if (ind !== props.index - 1) {\n console.log(\"_ele\",_ele)\n return _ele.guardianPan?.trim().toLowerCase();\n }\n })\n .filter((guardianPan) => guardianPan);\n const guardianNames = props.nominees\n .map((_ele, ind) => {\n if (ind !== props.index - 1) {\n return _ele.guardianName?.trim().toLowerCase();\n }\n })\n .filter((guardianName) => guardianName);\n const thisYear = new Date().getFullYear();\n const nomineeDobYear = new Date(formik.values.dob).getFullYear();\n if (nomineeNames.includes(values.name?.trim().toLowerCase())) {\n return {\n name: `Nominee name should not be same as other nominee names`,\n };\n } else if (\n values.name?.trim().toLowerCase() ===\n props.investorName?.trim().toLowerCase()\n ) {\n return {\n name: `Nominee name can not be investor name`,\n };\n } else if (values.name?.trim().length > MAX_LENGTH_FOR_NOMINEE_NAME) {\n return {\n name: `Nominee name should be less than ${MAX_LENGTH_FOR_NOMINEE_NAME} characters`,\n };\n } else if (guardianNames.includes(values.name.trim().toLowerCase())) {\n return {\n name: `Name should not be same as other guardian names`,\n };\n } else if (guardianNames.includes(values.guardianName.trim().toLowerCase()) || nomineeNames.includes(values.guardianName.trim().toLowerCase())) {\n return {\n guardianName: `Guardian name should not be same as other nominee names and other guardian names`,\n };\n } \n if (values.pan === props.pan) {\n return {\n pan: `Nominee pan should not be the investor pan`,\n };\n }else if (values.guardianPan === props.pan) {\n return {\n guardianPan: `Guardian pan should not be the investor pan`,\n };\n } else if (nomineePans.includes(values.pan?.trim().toLowerCase())) {\n return {\n pan: `Nominee pan should not be same as other nominee pans`,\n };\n } else if (guardianPans.includes(values.pan?.trim().toLowerCase())) {\n return {\n pan: `Nominee pan should not be same as other nominee pans and other guardian pans`,\n };\n } if (guardianPans.includes(values.guardianPan?.trim().toLowerCase()) || nomineePans.includes(values.guardianPan?.trim().toLowerCase())) {\n return {\n guardianPan: `Pan should not be same as other nominee pans and other guardian pans`,\n };\n }\n if (values?.address1?.trim().length > MAX_LENGTH_FOR_ADDRESS) {\n return {\n address1: `Address should be less than ${MAX_LENGTH_FOR_ADDRESS} characters`,\n };\n }\n if (values?.address2?.trim().length > MAX_LENGTH_FOR_ADDRESS) {\n return {\n address2: `Address should be less than ${MAX_LENGTH_FOR_ADDRESS} characters`,\n };\n }\n if (!values.share?.toString()) {\n return {\n share: \"Share is required\",\n };\n } else if (Number(values.share) === 0) {\n return {\n share: \"Nominee share should not be 0\",\n };\n }\n if (values.dob) {\n const selectedDate = new Date(values.dob);\n if (selectedDate.getTime() > new Date().getTime()) {\n return {\n dob: \"Date of birth should not exceed current date\",\n };\n }\n \n if (thisYear - nomineeDobYear < 18) {\n if (!values.guardianName || values.guardianName?.trim().length === 0) {\n return {\n guardianName: `Guardian name is required`,\n };\n }else if (!values.guardianPan) {\n return {\n guardianPan: `Guardian pan is required`,\n };\n } else if (values.guardianPan.length<10) {\n return {\n guardianPan: `Please enter individual pan number`,\n };\n } else if (\n values.guardianName?.trim().length > MAX_LENGTH_FOR_GUARDIAN_NAME\n ) {\n return {\n guardianName: `Guardian name should be less than ${MAX_LENGTH_FOR_GUARDIAN_NAME} characters`,\n };\n } else if (\n values.guardianName?.trim().toLowerCase() ===\n values.name?.trim().toLowerCase()\n ) {\n return {\n guardianName: `Nominee name and Guardian name should not be same`,\n };\n }\n // if (\n // values.guardianPan &&\n // (values.guardianPan === values.pan ||\n // values.guardianPan === props.pan)\n // ) {\n // return {\n // guardianPan:\n // values.pan === values.guardianPan\n // ? `Guardian pan should not same as Nominee pan`\n // : `Guardian pan should not same as Investor pan`,\n // };\n // }\n \n if (values.guardianPan && values.guardianPan === values.pan) {\n return {\n guardianPan:\n values.pan === values.guardianPan\n ? `Guardian pan should not same as Nominee pan`\n : ``,\n };\n }\n }\n }\n \n // if (values.guardianDob) {\n // const selectedDate = new Date(values.guardianDob);\n // if (new Date().getTime() - selectedDate.getTime() < EIGHTEEN_YEARS_IN_MILLISECONDS) {\n // return {\n // guardianDob: 'Guardian of the Nominee should be major',\n // };\n // }\n // if (selectedDate < new Date(minDateForCalender())) {\n // return {\n // guardianDob: common.errors.dob.ageLessThanHundred,\n // };\n // }\n // }\n };\n \n const formik = useFormik({\n initialValues: initialValues,\n onSubmit: () => {\n props.saveNominee(\"isEditable\", false, props.index - 1);\n alert(\"Nominee added successfully\");\n },\n onReset: () => {\n props.handleResetForm(props.index - 1);\n },\n validationSchema: validationSchemaNominee,\n validateOnChange: false,\n validate: validate,\n });\n \n const formFields = [\n {\n component: AddNomineeForm,\n extraProps: props,\n },\n ];\n \n useEffect(() => {\n formik.setValues(initialValues, false);\n }, [initialValues]);\n \n const FormLoad = useCallback(() => {\n return ;\n }, [formik]);\n \n return FormLoad();\n };\n \n export default AddNominee;\n ","import React from \"react\";\nimport { useEffect, useState } from \"react\";\nimport en from \"../../../lang/en-us.js\";\nimport TextInput from \"../../../lib/TextField/index.js\";\nimport AddNominee from \"./addNominee\";\nimport * as yup from \"yup\";\nimport { NoteModals } from \"../../../lib/NoteModals/index.js\";\nimport { connect } from \"react-redux\";\nimport {\n getDate,\n getDateString,\n panRegex,\n _minDateForCalender,\n} from \"../../../utils/constants\";\nimport { getNameIndex } from \"../CorrectionFolios/correction-folios-selection\";\nimport Image from \"../../Image\";\n \nconst {\n dashboard,\n signUp: { form },\n common,\n} = en;\nexport const relationShips = [\n {\n label: \"Mother\",\n value: \"mother\",\n },\n {\n label: \"Son\",\n value: \"son\",\n },\n {\n label: \"Daughter\",\n value: \"daughter\",\n },\n {\n label: \"Father\",\n value: \"father\",\n },\n {\n label: \"Spouse\",\n value: \"spouse\",\n },\n {\n label: \"Others\",\n value: \"others\",\n },\n];\n\nexport const initialValues = {\n relation: \"\",\n name: \"\",\n dob: \"\",\n share: null,\n gender: \"\",\n pan: \"\",\n address1: \"\",\n address2: \"\",\n pincode: \"\",\n city: \"\",\n state: \"\",\n country: \"\",\n guardianName: \"\",\n guardianPan: \"\",\n guardianAddress: \"\",\n guardianDob: \"\",\n};\n\nexport const validationSchemaNominee = yup.object({\n relation: yup.string().required(\"Relation is required\"),\n name: yup\n .string()\n .required(\"Name is required\")\n .test(\"len\", \"Name should have at least 3 letters\", (val) => {\n return val && val.trim().length >= 3;\n }),\n gender: yup.string().required(\"Gender is required\"),\n pan: yup.string().matches(panRegex, form.pan.validations.individualPan),\n address1: yup\n .string()\n .notRequired()\n .test(\"len\", common.spaceNotAllowed, (val) => val?.trim().length !== 0),\n address2: yup\n .string()\n .notRequired()\n .test(\"len\", common.spaceNotAllowed, (val) => val?.trim().length !== 0),\n city: yup\n .string()\n .notRequired()\n .test(\"len\", common.spaceNotAllowed, (val) => val?.trim().length !== 0)\n .max(50, common.cityMaxLength),\n state: yup\n .string()\n .notRequired()\n .test(\"len\", common.spaceNotAllowed, (val) => val?.trim().length !== 0)\n .max(50, common.stateMaxLength),\n pincode: yup.string().length(6, \"Pincode should be of 6 digits\"),\n guardianPan: yup\n .string()\n .notRequired()\n .matches(panRegex, form.pan.validations.individualPan),\n});\n\nexport default function NomineeSummary(props) {\n const { nomineesData = {}, noNomineeFlagAll = false } = props || {};\n const { nominees: data = [], investorName = \"\", verified } = nomineesData;\n const [nominees, setNominees] = useState([]);\n\n useEffect(() => {\n setNominees(\n !!data.length\n ? data.slice(0, 3).map((_ele) => {\n let nomineeState = {\n relation: [\n \"mother\",\n \"son\",\n \"daughter\",\n \"father\",\n \"spouse\",\n ].includes(_ele?.relation?.toLowerCase())\n ? _ele.relation?.toLowerCase()\n : _ele.relation?.toLowerCase()\n ? \"others\"\n : \"\",\n name: _ele.name || \"\",\n dob: getDate(_ele.dob),\n share: _ele.percent,\n pan: _ele.pan,\n gender: _ele?.gender?.toLowerCase(),\n address1: _ele.address?.line1 || \"\",\n address2: _ele.address?.line2 || \"\",\n ..._ele?.address,\n guardianName: _ele.guardian?.name || \"\",\n guardianPan: _ele.guardian?.pan || \"\",\n guardianAddress: _ele.guardian?.address || \"\",\n guardianDob: _ele.guardian?.dob || \"\",\n isEditable: false,\n showDetails: false,\n editShare: false,\n isNewlyAdded: false,\n id: _ele.id,\n isEdited: false,\n };\n return { ...nomineeState, initialState: nomineeState };\n })\n : [\n {\n ...initialValues,\n isEditable: true,\n showDetails: false,\n editShare: false,\n isNewlyAdded: true,\n isEdited: false,\n },\n ]\n );\n }, []);\n\n // useEffect(() => {\n // console.log('hhhagi');\n // }, [nominees]);\n\n return (\n \n {\" \"}\n
\n \n {dashboard.UpdateNominee.save}\n \n {/* formik.resetForm()} className=\"clear-nominee\">\n {dashboard.UpdateNominee.clear}\n */}\n \n {\n resetFieldError(\"relation\");\n props.handleNomineeChange(\"relation\", value, props.index - 1);\n }}\n key={formik.values.relation}\n error={!!formik.errors.relation}\n helperText={formik.errors.relation}\n extraClass={\"nominee-relation-radio\"}\n />\n
\n \n
\n {thisYear - new Date(formik.values.dob).getFullYear() < 18 && (\n \n {\n resetFieldError(\"name\");\n return checkForOnlyAlphabets(e.target.value)\n ? props.handleNomineeChange(\n \"name\",\n e.target.value,\n props.index - 1\n )\n : null;\n }}\n error={!!formik.errors.name}\n helperText={formik.errors.name}\n />\n
\n \n
\n \n {\n resetFieldError(\"dob\");\n props.handleNomineeChange(\"dob\", date, props.index - 1);\n if (\n thisYear - new Date(formik.values.dob).getFullYear() >=\n 18\n ) {\n props.handleNomineeChange(\n \"guardianName\",\n \"\",\n props.index - 1\n );\n props.handleNomineeChange(\n \"guardianPan\",\n \"\",\n props.index - 1\n );\n }\n }}\n minDate={_minDateForCalender()}\n error={!!formik.errors.dob}\n helperText={formik.errors.dob}\n />\n
\n \n {\n resetFieldError(\"share\");\n\n const cleanedValue = e.target.value.replace(/[^0-9.]/g, '');\n\n if (!isNaN(cleanedValue)) {\n const numericValue = Number(cleanedValue);\n\n if (numericValue <= 100) {\n props.handleNomineeChange(\"share\", numericValue, props.index - 1);\n }\n }\n }}\n error={!!formik.errors.share}\n helperText={formik.errors.share}\n/>\n
\n \n {\n resetFieldError(\"gender\");\n props.handleNomineeChange(\"gender\", value, props.index - 1);\n }}\n list={[\n {\n label: \"Male\",\n value: \"male\",\n },\n {\n label: \"Female\",\n value: \"female\",\n },\n {\n label: \"Others\",\n value: \"others\",\n },\n ]}\n key={formik.values.gender}\n error={!!formik.errors.gender}\n helperText={formik.errors.gender}\n />\n
\n \n {\n resetFieldError(\"pan\");\n return isAlphaNumeric(e.target.value) &&\n e.target.value.length <= MAX_LENGTH_FOR_PAN\n ? props.handleNomineeChange(\n \"pan\",\n e.target.value.toUpperCase(),\n props.index - 1\n )\n : null;\n }}\n error={!!formik.errors.pan}\n helperText={formik.errors.pan}\n />\n
\n \n {\n props.handleAddressCheck(props.index - 1, e.target.checked);\n }}\n name=\"addressCheck\"\n value={formik.values.addressCheck}\n label={en.dbCommercial.profileDetails.nominees.addressCheck}\n />\n
\n \n \n {\n resetFieldError(\"address1\");\n if (isAlphaNumericAddress(e.target.value)) {\n props.handleNomineeChange(\n \"address1\",\n e.target.value,\n props.index - 1\n );\n }\n }}\n error={!!formik.errors.address1}\n helperText={formik.errors.address1}\n />\n
\n \n {\n resetFieldError(\"address2\");\n if (isAlphaNumericAddress(e.target.value)) {\n props.handleNomineeChange(\n \"address2\",\n e.target.value,\n props.index - 1\n );\n }\n }}\n error={!!formik.errors.address2}\n helperText={formik.errors.address2}\n />\n
\n \n {\n resetFieldError(\"pincode\");\n return (/^\\d+$/.test(e.target.value) || !e.target.value) &&\n e.target.value.length < 7\n ? props.handleNomineeChange(\n \"pincode\",\n e.target.value,\n props.index - 1\n )\n : null;\n }}\n error={formik.errors.pincode ? true : false}\n helperText={formik.errors.pincode}\n />\n
\n \n {\n resetFieldError(\"city\");\n if (!checkForOnlyAlphabets(e.target.value)) return;\n props.handleNomineeChange(\n \"city\",\n e.target.value,\n props.index - 1\n );\n }}\n error={!!formik.errors.city}\n helperText={formik.errors.city}\n />\n
\n \n {\n resetFieldError(\"state\");\n if (\n !checkForOnlyAlphabets(e.target.value) ||\n e.target.value.length > 20\n )\n return;\n props.handleNomineeChange(\n \"state\",\n e.target.value,\n props.index - 1\n );\n }}\n name={\"state\"}\n error={!!formik.errors.state}\n helperText={formik.errors.state}\n />\n
\n \n
\n \n \n {\n resetFieldError(\"country\");\n props.handleNomineeChange(\n \"country\",\n e.target.value,\n props.index - 1\n );\n }}\n >\n {/* \n {dashboard.UpdateNominee.nomineeFields.country}\n */}\n \n \n \n {formik.errors.country}\n \n \n
\n \n
\n )}\n {dashboard.UpdateNominee.guardianDetailsHeading}
\n\n
\n \n {\n resetFieldError(\"guardianName\");\n return checkForOnlyAlphabets(e.target.value)\n ? props.handleNomineeChange(\n \"guardianName\",\n e.target.value,\n props.index - 1\n )\n : null;\n }}\n error={!!formik.errors.guardianName}\n helperText={formik.errors.guardianName}\n />\n
\n \n {\n resetFieldError(\"guardianPan\");\n return isAlphaNumeric(e.target.value) &&\n e.target.value.length <= MAX_LENGTH_FOR_PAN\n ? props.handleNomineeChange(\n \"guardianPan\",\n e.target.value.toUpperCase(),\n props.index - 1\n )\n : null;\n }}\n error={!!formik.errors.guardianPan}\n helperText={formik.errors.guardianPan}\n />\n
\n {/* \n {\n resetFieldError(\"guardianDob\");\n props.handleNomineeChange(\n 'guardianDob',\n e.target.value,\n props.index - 1,\n )\n }}\n type={'date'}\n inputProps={{\n max: moment(new Date()).format('YYYY-MM-DD'), min: minDateForCalender()\n }}\n InputLabelProps={{ shrink: true }}\n helperText={formik.errors.guardianDob}\n error={!!formik.errors.guardianDob}\n />\n
*/}\n {/* \n \n props.handleNomineeChange(\n 'guardianAddress',\n e.target.value,\n props.index - 1,\n )\n }\n />\n
*/}\n Opted out of nomination
\n ) : !nomineesData.noNominee && nomineesData.nominees.length === 0 ? (\n No nominees selected
\n ) : (\n nominees.map((_ele,index) => (\n \n
\n ))\n )}\n \n );\n}\n","import React from \"react\";\nimport {\n Table,\n TableHead,\n TableCell,\n TableBody,\n // TableContainer,\n Paper,\n TableRow,\n} from '@material-ui/core';\nimport { KeyboardArrowDown, KeyboardArrowUp } from '@material-ui/icons';\nimport { useEffect } from 'react';\nimport en from \"../../../lang/en-us.js\";\nimport NomineeSummary from './nominee-summary';\nimport { connect, useDispatch, useSelector } from 'react-redux';\nimport { RootStateType } from 'shared/store/reducers';\nimport { SubmitButton } from '../../../lib/Button';\nimport { CheckBoxField } from '../../../lib/CheckBoxField';\nimport { saveNominee } from 'shared/store/actions/nct';\nimport Image from '../../Image';\nimport { useHistory } from 'react-router';\n\nconst {\n dashboard,\n dbCommercial,\n signUp: { form },\n common,\n} = en;\n\nexport const BackArrow = ({ header = \"\", history, customStyle }) => {\n return (\n \n
\n \n \n
\n \n
\n \n
\n {_ele.showDetails && (\n \n
\n {dashboard.UpdateNominee.name}
\n{_ele.name}
\n\n
\n {dashboard.UpdateNominee.relation}
\n\n {_ele.relation.slice(0, 1).toUpperCase() +\n _ele.relation.slice(1)}\n
\n\n <>\n
\n {/* */}\n {dashboard.UpdateNominee.share}
\n{_ele.share}%
\n \n![\"icon\"](\"/images/up-arrow-purple.svg\"){kind=icon}
\n \n
\n )}\n \n
\n {dashboard.UpdateNominee.gender}
\n\n {_ele.gender.slice(0, 1).toUpperCase() +\n _ele.gender.slice(1)}\n
\n\n
\n \n {\" \"}\n {dashboard.UpdateNominee.address}\n
\n{_ele.address1}
\n\n history.goBack()} style={{ cursor: \"pointer\" }}>\n
\n );\n};\n\nexport const ActionHeader = ({ header = '', subHeader, history } ) => {\n return (\n \n history.goBack()} style={{ cursor: 'pointer' }}>\n \n \n {header}\n {subHeader && {subHeader}}\n
\n );\n};\n\nfunction SelectedFolios(props) {\n const [currIndex, setCurrentIndex] = React.useState\n
\n );\n}\n\nexport default connect(null)(SelectedFolios);\n","// import store from '../../../../store';\nimport {\n REGISTER_WITH_EMAIL,\n REGISTER_WITH_MOBILE,\n } from \"../../../utils/constants\";\n \n const EMAIL_LISTING_ROUTE = \"/portal/nct/change-email-list\";\n const EMAIL_ENTER_ROUTE = \"/portal/nct/change-email\";\n const EMAIL_OTP_VERIFY = \"/portal/nct/change-email-otp\";\n const REGISTERED_EMAIL_OR_PHONE_VERIFY = \"/portal/nct/change-email-auth\";\n \n export const SUCCESS = \"SUCCESS\";\n \n export const CHANGE_EMAIL_LOGIN_FLOW = [\n EMAIL_LISTING_ROUTE,\n REGISTERED_EMAIL_OR_PHONE_VERIFY,\n EMAIL_ENTER_ROUTE,\n EMAIL_OTP_VERIFY,\n ];\n export const CHANGE_EMAIL_MOBILE_LOGIN_FLOW = [\n EMAIL_ENTER_ROUTE,\n EMAIL_OTP_VERIFY,\n EMAIL_LISTING_ROUTE,\n REGISTERED_EMAIL_OR_PHONE_VERIFY,\n ];\n \n export function getChangeEmailFlow(registerType = REGISTER_WITH_MOBILE) {\n return registerType === REGISTER_WITH_EMAIL\n ? CHANGE_EMAIL_LOGIN_FLOW\n : CHANGE_EMAIL_MOBILE_LOGIN_FLOW;\n }\n ","import store from \"shared/store/api.middleware\";\nimport {\n REGISTER_WITH_EMAIL,\n REGISTER_WITH_MOBILE,\n} from \"../../../utils/constants\";\nimport { getChangeEmailFlow } from \"../ChangeEmail/flow\";\n\nconst MOBILE_LISTING_ROUTE = \"/portal/nct/change-mobile\";\nconst MOBILE_ENTER_ROUTE = \"/portal/nct/change-mobile-new\";\nconst MOBILE_OTP_VERIFY = \"/portal/nct/otp-verification\";\nconst REGISTERED_EMAIL_OR_PHONE_VERIFY = \"/portal/nct/change-mobile-auth\";\n\nexport const SUCCESS = \"SUCCESS\";\n\nexport const MOBILE_LOGIN_FLOW = [\n MOBILE_LISTING_ROUTE,\n REGISTERED_EMAIL_OR_PHONE_VERIFY,\n MOBILE_ENTER_ROUTE,\n MOBILE_OTP_VERIFY,\n];\nexport const EMAIL_LOGIN_FLOW = [\n MOBILE_ENTER_ROUTE,\n MOBILE_OTP_VERIFY,\n MOBILE_LISTING_ROUTE,\n REGISTERED_EMAIL_OR_PHONE_VERIFY,\n];\n\nexport function getChangeMobileFlow(registerType = REGISTER_WITH_MOBILE) {\n return registerType === REGISTER_WITH_EMAIL\n ? EMAIL_LOGIN_FLOW\n : MOBILE_LOGIN_FLOW;\n}\n\nexport function nextScreen(path , nctFlow = \"mobile\") {\n const { authReducer } = store.getState();\n const { userRegisteredWith } = authReducer;\n const flows =\n nctFlow === \"email\"\n ? getChangeEmailFlow(userRegisteredWith)\n : getChangeMobileFlow(userRegisteredWith);\n if (!path) {\n return flows[0];\n }\n const index = flows.findIndex((_flow) => _flow === path);\n if (index + 1 === flows.length) {\n return SUCCESS;\n }\n return flows[index + 1];\n}\n// export function emailRegisteredUser() {\n// const { authReducer } = store.getState();\n// const { userRegisteredWith } = authReducer;\n// return userRegisteredWith === REGISTER_WITH_EMAIL;\n// }\n","import {\n FormControl,\n InputLabel,\n Select,\n MenuItem,\n FormHelperText,\n } from \"@material-ui/core\";\n import { showHelperText } from \"../../../utils/utilityFunctions\";\n import { getRelationShip } from \"../../home/portfolios/utils\";\n import React from \"react\";\n \n export default function EmailRelationship({ emailFormik }) {\n return (\n \n {/* {verifyThrough === VerifyThrough.ESIGN && ( */}\n {/* setNoNomineeFlag(!noNomineeFlag)}\n style={{ paddinTop: 8, paddingBottom : 8 }}\n value={noNomineeFlag}\n label={dbCommercial.noNominee.indNote}\n />\n {/* */}\n \n
\n {/* */}\n
\n */}\n {/*
*/}\n {/* )} */}\n \n !nominee.verified))}\n label={'Submit'}\n onClick={handleSubmit}\n />\n
\n \n
\n );\n }\n \n export default connect(\n ({ authReducer, investor }) => ({\n ...authReducer,\n ...investor,\n }),\n { sendEmailOTP }\n )(ChangeEmail);\n ","import React from 'react';\nimport { Button } from '@material-ui/core';\nimport en from '../../lang/en-us';\nimport { SubmitButton } from '../../lib/Button';\nimport Image from '../Image';\nconst { dashboard } = en;\n\n\n\nexport default function NoFoliosFound({\n info = '',\n extraClass = '',\n icon = 'folios-not-found',\n onClick = null,\n}) {\n return (\n \n
\n \n
\n \n \n {dashboard.changeEmail.subHeading}\n \n
\n {/* {dashboard.changeEmail.subHeadingInfo}
\n\n
\n \n \n Enter New Email\n \n
\n \n
\n \n
\n );\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\n/* eslint-disable jsx-a11y/anchor-is-valid */\n/* eslint-disable react/prop-types */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\n/* eslint-disable react/display-name */\nimport {\n Tooltip,\n Checkbox,\n makeStyles,\n TableHead,\n Table,\n TableRow,\n TableCell,\n TableBody,\n Paper,\n Collapse,\n Radio,\n FormControlLabel,\n SwipeableDrawer,\n} from \"@material-ui/core\";\nimport TableContainer from \"@material-ui/core/TableContainer\"\n// import { Theme, createStyles } from \"@material-ui/core/styles\";\n// import { GridRowData } from \"@material-ui/data-grid\";\nimport { useState, useEffect, useMemo } from \"react\";\nimport React from \"react\";\nimport en from \"../../lang/en-us\";\nimport { CheckBoxField } from \"../CheckBoxField\";\nimport SearchInput from \"../SearchInput\";\nimport Skeleton from \"@material-ui/lab/Skeleton\";\nimport {\n CustomToolTipProps,\n DataTableColumn as _Column,\n TableCellParams as CellParams,\n TableColumn as Column,\n TableProps,\n} from \"./types\";\nimport NoFoliosFound from \"../../components/home/NoFoliosFound\";\nimport Image from \"../../components/Image\";\nconst { dashboard, common } = en;\n\n// export type TableColumn = Column;\n// export type DataTableColumn = _Column;\n// export type TableCellParams = CellParams;\n\nconst useStyles = makeStyles({\n tooltip: {\n backgroundColor: \"#a39cc7\",\n fontSize: 14,\n },\n arrow: {\n color: \"#a39cc7\",\n },\n});\n/**\n * Custoom Tool Tip\n * @param param0\n */\n\nexport function CustomToolTip({ children, ...props }) {\n const classes = useStyles();\n return (\n {info}
*/}\n{info || dashboard.noFoliosFound}
\n {!!onClick &&\n\n {columns.map(\n (\n {\n renderCell,\n field,\n valueGetter,\n Cell,\n fullWidth = false,\n ...column\n },\n _index\n ) => {\n const value = row[`${field}`];\n const GridParams = {\n row,\n id: row.id,\n value,\n colDef: { field, ...column },\n setCollapse,\n collapse,\n index,\n };\n return (\n \n
\n );\n }\n )}\n {column.headerName}
\n\n {Cell\n ? Cell\n : renderCell\n ? renderCell(GridParams)\n : valueGetter\n ? valueGetter(GridParams)\n : value}\n
\n\n \n {renderCollapse ? (\n
\n \n \n );\n };\n const DataRow = ({ row, index }) => {\n const [collapse, setCollapse] = useState(isCollapse);\n const isSelected = !!(selectedRows.find((_row) => _row.id === row.id));\n const renderRow = useMemo(() => {\n return columns.map(\n (\n { renderCell, field, valueGetter, Cell, ...column },\n _index\n ) => {\n const value = row[`${field}`];\n const GridParams = {\n row,\n id: row.id,\n value,\n colDef: { field, ...column },\n setCollapse,\n index,\n collapse,\n };\n return Cell ? (\n \n {renderCollapse({ row, setCollapse })}\n
\n ) : (\n \n
\n );\n };\n\n const _onColumnHeaderClick = (isAllSelected) => {\n if (!isCheckBoxSelectable) {\n return;\n }\n setSelectedRows(() =>\n isAllSelected ? rows.filter((row) => !row.isDisabled) : []\n );\n if (\n !!props.onColumnHeaderClick &&\n typeof props.onColumnHeaderClick === \"function\"\n ) {\n props.onColumnHeaderClick({ isSelected: isAllSelected });\n }\n };\n\n const filteredRows = useMemo(() => {\n const filterKeys = Object.keys(filteredData).filter(\n (key) => key !== \"searchKey\"\n );\n const filtredRowData = rows.reduce((prev, currRow) => {\n const valid = filterKeys.every((_key) => {\n const _filterData = filteredData[_key] || [];\n const value =\n typeof currRow[_key] === \"string\"\n ? currRow[_key]?.toString()?.toLowerCase()\n : currRow[_key];\n if (!_filterData.length) {\n return true;\n }\n if (_key === \"assetType\") {\n let other = false;\n let assetTypes =\n typeof value === \"string\" ? [value?.toUpperCase()] : value; // Modifying assetTypes as array\n if (_filterData.includes(\"other\")) {\n other = assetTypes?.every((assetType) => {\n const _assetType = assetType?.toUpperCase();\n return !(\n _assetType === \"EQUITY\" ||\n _assetType === \"DEBT\" ||\n _assetType === \"LIQUID\"\n );\n });\n }\n return (\n _filterData.some((_assetType) =>\n assetTypes?.includes(_assetType?.toUpperCase())\n ) || other\n );\n }\n if (_filterData.includes(value)) {\n return true;\n }\n });\n if (valid) {\n return [...prev, currRow];\n }\n return prev;\n }, []);\n\n return filteredData.searchKey\n ? filtredRowData.filter((row) =>\n row?.amcName\n ?.toLowerCase()\n ?.includes(filteredData?.searchKey?.toLowerCase())\n )\n : filtredRowData;\n }, [rows, filteredData]);\n const _TableFilters = useMemo(\n () => (\n \n {filteredRows.map((row, index) => (\n
\n \n \n );\n}\n\n/**\n * Filter For The table\n * @param columns\n * @param rows\n * @param onUpdateFilters\n */\nexport function TableFilters({\n columns = [],\n rows = [],\n filterType = null,\n filteredData = {},\n setFilteredData = () => {},\n setFilterType = () => {},\n resetFilters,\n enableSearch = true,\n} ) {\n const [openDrawer, setDrawer] = useState(false);\n\n const _handleChange = (fieldKey, _ele) => {\n const fieldData = filteredData[fieldKey] || [];\n const index = fieldData.findIndex((ele) => ele === _ele);\n const _filteredData =\n index === -1\n ? {\n ...filteredData,\n [fieldKey]: [...fieldData, _ele],\n }\n : {\n ...filteredData,\n [fieldKey]: fieldData.filter((ele) => ele !== _ele),\n };\n setFilteredData(_filteredData);\n \n };\n\n const Filters = useMemo(() => {\n return columns.map((column, index) => (\n \n \n {\n setFilterType(\"\");\n setDrawer(false);\n }}\n onOpen={() => {}}\n className=\"mobile_mode\"\n >\n
\n );\n}\n","import React from 'react';\n// import { GridRowData } from '@material-ui/data-grid';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { TableColumn } from '.';\nimport Skeleton from '@material-ui/lab/Skeleton';\n\n\n\nexport function useTableWithCollapse({\n initialSelectionModal = [],\n initialFilterType = null,\n initialFilterData = {},\n rows = [],\n columns = [],\n loading,\n}) {\n const [selectedRows, setSelectedRows] = useState(initialSelectionModal);\n const [filterType, setFilterType] = useState(null);\n const [filteredData, setFilteredData] = useState({});\n\n const resetTable = useCallback(() => {\n setSelectedRows(initialSelectionModal);\n }, [initialSelectionModal]);\n\n const resetFilters = useCallback(() => {\n setFilterType(initialFilterType);\n setFilteredData(initialFilterData);\n }, [initialFilterType, initialFilterData]);\n\n const tableColumns = useMemo(() => {\n return loading ? columns.map((column) => ({ ...column, Cell: \n \n setFilteredData({ ...filteredData, searchKey: e.target.value })\n }\n />\n )}\n
\n {columns.map((column, index) => {\n const fieldKey = column.filterKey || column.field;\n const dataWithDuplicatedValueKeys = rows.map((row) => row[fieldKey]);\n const data = dataWithDuplicatedValueKeys.reduce((prev, curr) => {\n if (!prev.includes(curr)) {\n return [...prev, curr];\n }\n return prev;\n }, []);\n const values = column.renderStaticFilters?.length\n ? column.renderStaticFilters\n : data;\n return (\n <>\n \n
\n
\n \n \n {values.map((_ele, index) => (\n \n _handleChange(fieldKey, _ele?.toString()?.toLowerCase())\n }\n value={(filteredData[fieldKey] || [])?.includes(\n _ele?.toString()?.toLowerCase()\n )}\n />\n ))}\n
\n \n
\n \n \n );\n })}\n {!!Object.keys(filteredData)\n .filter((key) => key !== \"searchKey\")\n .some((_ele) => !!filteredData[_ele].length) && (\n \n {values.map((_ele, index) => (\n \n _handleChange(fieldKey, _ele?.toString()?.toLowerCase())\n }\n value={(filteredData[fieldKey] || [])?.includes(\n _ele?.toString()?.toLowerCase()\n )}\n />\n ))}\n
\n \n
\n )}\n \n {Object.keys(filteredData).length ? (\n
\n {Object.keys(filteredData).length ? (\n \n ) : (\n {dashboard.ChangeDividend.selectedFilters}
\n ) : (\n{FilterChips()}
\n {row.modeOfHolding === \"1\" ? \"Single\" : \"---\"}
\n);\nexport const mohMap = {\n 1: \"Single\",\n 2: \"Joint\",\n 3: \"Either or Survivor\",\n 4: \"Anyone or Survivor\",\n 5: \"Not applied\",\n};\n\nconst Columns = [\n {\n field: \"id\",\n headerName: \"FOLIO\",\n valueGetter: ({ row }) => row.folio,\n },\n /* {\n field: \"amcName\",\n headerName: \"Fund House\",\n width: 300,\n filterBy: true,\n }, */\n {\n field: \"investorName\",\n headerName: \"PRIMARY HOLDER\",\n width: 200,\n },\n {\n field: \"modeOfHolding\",\n headerName: \"Mode of Holding\",\n valueGetter: ({ row }) => {\n if (row.modeOfHolding === null) {\n return \"NA\";\n }\n const moh = mohMap[row.modeOfHolding];\n if (moh) {\n return moh;\n } else {\n return \"Others\";\n }\n },\n width: 150,\n },\n {\n field: \"nominees\",\n renderCell: _renderNominee,\n headerName: \"NOMINEE Details\",\n width: 150,\n },\n {\n isFilter: true,\n field: \"assetType\",\n headerName: \"Category\",\n filterBy: true,\n renderStaticFilters: [EQUITY, LIQUID, DEBT, OTHER],\n },\n];\n\nconst groupFilteredData = (rowData) => {\n const uniqueEmailMobileMap= {};\n for (let i = 0; i < rowData.length; ++i) {\n const { email, mobile } = rowData[i];\n if (!email || !mobile) continue;\n const currentKey = `${email.trim()}-${mobile.trim()}`;\n if (uniqueEmailMobileMap[currentKey]) {\n uniqueEmailMobileMap[currentKey].push(rowData[i]);\n } else {\n uniqueEmailMobileMap[currentKey] = [rowData[i]];\n }\n }\n return uniqueEmailMobileMap;\n};\n\nconst mobileEmailFilterReducer = (\n state,\n action\n) => {\n const { groupedFilterMap, emailMobileKeys, currentKey } = state;\n switch (action.type) {\n case \"SET_FILTER_MAP\":\n const uniqueKeys = Object.keys(action.payload);\n return {\n ...state,\n groupedFilterMap: action.payload,\n emailMobileKeys: uniqueKeys,\n currentKey: !currentKey && uniqueKeys[0],\n };\n break;\n case \"SET_FILTER_KEY\":\n return {\n ...state,\n currentKey: action.payload,\n };\n break;\n default:\n throw Error(`Invalid action`);\n }\n};\n\nfunction Nominee(props) {\n const [rowData, setRowData] = useState([]);\n const [loading, setLoading] = useState(false);\n\n const [filterState, filterDispatch] = useReducer(mobileEmailFilterReducer, {\n groupedFilterMap: null,\n emailMobileKeys: null,\n currentKey: null,\n });\n const { emailMobileKeys, currentKey, groupedFilterMap } = filterState;\n\n const { selectedRows, setSelectedRows, tableColumns, tableRows, ...filters } =\n useTableWithCollapse({\n rows: currentKey ? groupedFilterMap[currentKey] : rowData,\n columns: Columns,\n loading,\n });\n\n const { userRegisteredWith } = props;\n const dispatch = useDispatch();\n\n useEffect(() => {\n setLoading(true);\n async function callApi() {\n const payload = {\n pan: props.investorData.PAN,\n brokercode: props.token,\n fund:\"176\",\n };\n\n try {\n // await props.getPortfolio(payload);\n const { body: investorDetails = {} } = await props.fetchInvestorDetails(\n payload\n );\n const { success: nomineeFunds = [] } = investorDetails;\n const filters = [\n modeOfHoldingSingle,\n portfoliosByMinorStatus,\n portfoliosByTransactionResource,\n ];\n const funds = getMatchAndUnMatchedFunds(\n filters,\n getInvestorFunds(nomineeFunds),\n true\n ).map((fund) => {\n return { ...fund, error: getErrorMessage(fund, filters) };\n });\n const { nomineeFunds: _nomineeFunds = [], otherFunds = [] } =\n funds.reduce((prev, fund) => {\n if (fund?.nominees?.length) {\n return {\n ...prev,\n nomineeFunds: [...(prev.nomineeFunds ?? []), fund],\n };\n }\n return { ...prev, otherFunds: [...(prev.otherFunds ?? []), fund] };\n }, []);\n setRowData([...otherFunds, ..._nomineeFunds]);\n setLoading(false);\n } catch (err) {\n console.log(\"err\",err)\n console.trace(err);\n alert(err.message);\n }\n }\n callApi();\n return () => {};\n }, []);\n\n useEffect(() => {\n const groupedFilterMap = groupFilteredData(rowData);\n filterDispatch({\n type: \"SET_FILTER_MAP\",\n payload: groupedFilterMap,\n });\n }, [rowData]);\n\n // clear selected rows on changing the value in the filter drop down\n useEffect(() => {\n setSelectedRows([]);\n }, [currentKey]);\n\n const _rederCollapse = ({ row }) => {\n const { nominees = [] } = row;\n return (\n \n \n \n Select Email-Mobile Combination\n
\n */}\n
*/}\n \n );\n}\n\nexport default connect(\n ({ authReducer, investor }) => ({\n ...authReducer,\n ...investor,\n }),\n { fetchInvestorDetails }\n)(Nominee);\n","import { Button } from \"@material-ui/core\";\nimport en from \"../../../lang/en-us.js\";\nimport { useEffect, useState } from \"react\";\nimport { connect } from \"react-redux\";\nimport { getPortfolio } from \"shared/store/actions/portfolio\";\nimport { RootStateType } from \"shared/store/reducers\";\nimport {\n sendPhoneOTP as sendOtp,\n sendEmailOTP,\n updateEmail,\n checkEmail,\n} from \"shared/store/actions/nct\";\nimport {\n getPortfoliosFilteredData,\n portfoliosByMinorStatus,\n portfoliosByModeOfHolding,\n portfoliosByTransactionResource,\n} from \"../../home/portfolios/utils\";\nimport { getErrorMessage, getInvestorFunds } from \"../portfolios/utils\";\nimport { NoteModals } from \"../../../lib/NoteModals/index.js\";\nimport { TableColumn, TableWithCollapse } from \"../../../lib/DataTable/index.js\";\nimport { NOMINEE } from \"shared/store/types/nct\";\nimport {\n UPDATE_EMAIL,\n OTP_ACTIONS,\n REGISTER_WITH_EMAIL,\n} from \"../../../utils/constants\";\nimport NoFoliosFound from \"./../NoFoliosFound\";\nimport { useTableWithCollapse } from \"../../../lib/DataTable/customHooks.js\";\n// import { ActionHeader, FaqLink } from '../index';\nimport { nextScreen } from \"../ChangeMobile/flow\";\nimport { getMatchAndUnMatchedFunds } from \"../../../utils/utilityFunctions\";\nimport { fetchInvestorDetails } from \"shared/store/actions/nct\";\nimport { SubmitButtonWithLoader } from \"../../../lib/Button\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport CustomizedSelect from \"../transactions/customizedSelect\";\nimport React from \"react\";\nimport { BackArrow } from \"../UpdateNominee/SelectedFolios\";\n\nimport { mohMap } from \"../UpdateNominee\";\nconst { dashboard } = en;\nconst columns = [\n { field: \"folio\", headerName: \"Folio\" },\n/* { field: \"amcName\", headerName: \"Fund House\", width: 300 },\n */ { field: \"investorName\", headerName: \"Primary Holder\", width: 250 },\n {\n field: \"modeOfHolding\",\n headerName: \"Mode of Holding\",\n valueGetter: ({ row }) => {\n if (row.modeOfHolding === null) {\n return \"NA\";\n }\n const moh = mohMap[row.modeOfHolding];\n if (moh) {\n return moh;\n } else {\n return \"Others\";\n }\n },\n width: 150,\n },\n { field: \"mobile\", headerName: \"Mobile No.\", width: 150 },\n\n { field: \"email\", headerName: \"Email Address\", width: 200 },\n];\n\nfunction ChangeEmailList(props) {\n const { enteredEmail: email, emailRelationship } = props.location.state || {};\n const [loading, setLoading] = useState(false);\n const [rowData, setRowData] = useState([]);\n const [uniqueMobileNo, setUniqueMobileNo] = useState([]);\n const [selectMobile, setSelectMobile] = useState(\"\");\n const [filteredData, setFilterdData] = useState([]);\n const { tableRows, tableColumns, selectedRows, setSelectedRows } =\n useTableWithCollapse({\n rows: filteredData,\n columns,\n loading,\n });\n const [show, setShow] = useState(false);\n\n const handleSubmit = async () => {\n let userResponse \n const foliosToUpdate = selectedRows.filter(\n (fund) => fund.email !== email\n );\n const param = {\n request_type:\"email_update\",\n folios: foliosToUpdate.map((item) => item.folio.toString()),\n pan: props.investorData.PAN,\n distributor_id: props.token\n }\n let checkresponse \n try {\n checkresponse = await props.checkEmail(param);\n } catch (error) {\n userResponse = window.confirm(\"There is already a pending request to be approved by the Investor. Would you like to anyway proceed with a New NCT request?\");\n }\n if (checkresponse?.message === \"Not a duplicate request\" || userResponse) { try {\n setLoading(true);\n // const goTo = nextScreen(props.match.path, \"email\");\n const { pan = \"\", pekrn = \"\", mobile = \"\" } = props;\n const foliosToUpdate = selectedRows.filter(\n (fund) => fund.email !== email\n );\n // const action = emailRegisteredUser()\n // ? OTP_ACTIONS.changeEmail\n // : OTP_ACTIONS.changeMobile;\n const investorName = props.investorData.invname;\n const investorPan = props.investorData.PAN;\n\n const investor = props.investors.find(\n (item) =>\n item.Name.toLowerCase() === investorName.toLowerCase() ||\n item.Pan.toLowerCase() == investorPan.toLowerCase()\n );\n\n const newData = foliosToUpdate.map((item) => ({\n folio: item.folio,\n amc: item.amc,\n amc_name: item.amcName,\n }));\n\n const payload = {\n email: investor.Email,\n newEmail: email,\n mobile: selectMobile,\n image: null,\n relation: emailRelationship,\n pan: investorPan,\n distributor_id: props.token,\n data: newData,\n };\n\n if (selectMobile === \"N/A\") {\n props.history.replace(\n \"/new-transaction/nct-type/phygital/change-email-document\",\n {\n payload: payload,\n }\n );\n return;\n }\n// console.log(\"payload1\",payload)\n const res = await props.updateEmail(payload);\n\n alert(\n `Request with request Id ${res.req_id} for update email address link has been sent to investor mobile number`\n );\n props.history.push(\"/new-transaction/nct-types\");\n\n // if (foliosToUpdate.length) {\n // let res = await props.sendOtp({\n // pan,\n // pekrn,\n // action: OTP_ACTIONS.changeEmail,\n // });\n // props.history.replace(goTo, {\n // foliosToUpdate: selectedRows.filter((fund) => fund.email !== email),\n // ...(props?.location?.state || {}),\n // action: OTP_ACTIONS.changeEmail,\n // ...(res || {}).body,\n // });\n // }\n } catch (err) {\n alert(err.message);\n } finally {\n setLoading(false);\n } }\n };\n\n // useEffect(() => {\n // if (!(props.email || email)) {\n // props.history.replace(\"/\");\n // }\n // }, []);\n\n useEffect(() => {\n async function fetchPortfolio() {\n try {\n setLoading(true);\n const { pan = \"\", pekrn = \"\", mobile = \"\", reqId = \"\" } = props;\n\n // await props.getPortfolio({\n // pan,\n // pekrn,\n // mobile,\n // reqId,\n // });\n const payload = {\n pan: props.investorData.PAN,\n brokercode: props.token,\n };\n const { body: investorDetails = {} } = await props.fetchInvestorDetails(\n payload\n );\n const { success: nomineeFunds = [] } = investorDetails;\n const filters = [\n portfoliosByModeOfHolding,\n portfoliosByMinorStatus,\n portfoliosByTransactionResource,\n ];\n const funds = getMatchAndUnMatchedFunds(\n filters,\n getInvestorFunds(nomineeFunds),\n true\n ).map((fund) => {\n return { ...fund, error: getErrorMessage(fund, filters) };\n });\n const { nomineeFunds: _nomineeFunds = [], otherFunds = [] } =\n funds.reduce((prev, fund) => {\n if (fund?.nominees?.length) {\n return {\n ...prev,\n nomineeFunds: [...(prev.nomineeFunds ?? []), fund],\n };\n }\n return { ...prev, otherFunds: [...(prev.otherFunds ?? []), fund] };\n }, []);\n\n const rows = [...otherFunds, ..._nomineeFunds].map(\n (item) => ({\n folio: item.folio,\n amc: item.amc,\n amcName: item.amcName,\n email: item.email,\n id: item.id,\n investorName: item.investorName,\n mobile: item.mobile || \"N/A\",\n assetType: item.assetType,\n modeOfHolding: item.modeOfHolding,\n isDisabled: item.isDisabled,\n error: item.error,\n })\n );\n // .filter((item) => item.email != email);\n\n // setRowData([...otherFunds, ..._nomineeFunds]);\n // setSelectedRows([...otherFunds, ..._nomineeFunds]);\n const mobileNumbers = [];\n\n for (let i = 0; i < rows.length; i++) {\n if (rows[i].mobile) {\n const mobile = rows[i].mobile.trim() || \"N/A\";\n if (!mobileNumbers.includes(mobile)) {\n mobileNumbers.push(mobile);\n }\n }\n }\n setUniqueMobileNo(mobileNumbers);\n setRowData(rows);\n // setSelectedRows(rows);\n setLoading(false);\n } catch (err) {\n alert(err.message);\n setLoading(false);\n }\n }\n fetchPortfolio();\n }, []);\n\n useEffect(() => {\n setSelectMobile(uniqueMobileNo[0] || \"\");\n const filteredData = rowData.filter(\n (item) => item.mobile == uniqueMobileNo[0]\n );\n setFilterdData(filteredData);\n // setRowData(filteredData);\n // setSelectedRows(filteredData);\n }, [uniqueMobileNo, rowData]);\n useEffect(() => {\n // console.log(\"selectedRows\",selectedRows,\"tablecolumns\",tableColumns,tableRows);\n })\n\n const handleChangeMobileNumber = (e) => {\n setSelectMobile(e.target.value);\n const filteredData = rowData.filter(\n (item) => item.mobile == e.target.value\n );\n setFilterdData(filteredData);\n // setRowData(filteredData);\n setSelectedRows([]);\n };\n return (\n <>\n \n
\n {/* \n
\n \n {/*
\n \n
\n \n
\n {dashboard.UpdateNominee.UpdateNomineeInfo}
\n\n {loading || rowData.length ? (\n TableBody\n ) : (\n
\n {/* \n
\n \n {\n dispatch({\n type: INITIALIZE_NOMINEE_ARRAY,\n body: { payload: selectedRows },\n });\n props.history.push(\n \"/new-transaction/nct-type/update-ind-nominee\",\n {\n selectedRows,\n }\n );\n }}\n className=\"customBtn\"\n disabled={!selectedRows.length}\n label={dashboard.UpdateNominee.buttonNext}\n />\n
\n \n \n {dashboard.changeEmail.List.emailNote}\n \n \n \n Select Mobile Number\n
\n {/* Folios that do not have the Email ID, as entered in the previous screen, will only be displayed here
*/}\n \n Sundaram Mutual Funds\n
\n\n \n
\n {!!tableRows.length && (\n \n
\n {/* \n \n {!filteredData.length && !loading ? (\n \n row.isDisabled ? row.error : \"\"\n }\n checkBoxEnabled\n toolTipEnabled\n />\n )}\n
\n \n
\n )}\n \n fund.email.toLowerCase() !== email.toLowerCase()\n ).length\n }\n onClick={() => {\n handleSubmit();\n }}\n />\n
\n \n
\n );\n }\n export default connect(\n ({ authReducer, portfolio }) => ({\n ...authReducer,\n ...portfolio,\n }),\n {}\n )(ChangeMobileNew);\n \n // export default {};\n ","import { Button } from \"@material-ui/core\";\nimport en from \"../../../lang/en-us.js\";\nimport { connect } from \"react-redux\";\nimport { RootStateType } from \"shared/store/reducers\";\n// import { getPortfolio } from \"shared/store/actions/portfolio\";\nimport { useEffect, useState } from \"react\";\nimport { RowInfoType } from \"../ChangeEmail/change-email-list\";\nimport {\n getPortfoliosFilteredData,\n portfoliosByMinorStatus,\n portfoliosByModeOfHolding,\n portfoliosByTransactionResource,\n} from \"../../home/portfolios/utils\";\nimport { sendPhoneOTP, updateMobile, checkEmail } from \"shared/store/actions/nct\";\nimport { NoteModals } from \"../../../lib/NoteModals/index.js\";\nimport { maskMobileNumber } from \"../../../utils/utilityFunctions\";\nimport { TableColumn, TableWithCollapse } from \"../../../lib/DataTable/index.js\";\nimport {\n OTP_ACTIONS,\n REGISTER_WITH_MOBILE,\n REGISTER_WITH_EMAIL,\n addDialCode,\n} from \"../../../utils/constants\";\nimport NoFoliosFound from \"../NoFoliosFound\";\nimport { useTableWithCollapse } from \"../../../lib/DataTable/customHooks.js\";\n// import { ActionHeader, FaqLink } from '..';\nimport { nextScreen } from \"./flow\";\nimport { getErrorMessage, getInvestorFunds } from \"../portfolios/utils\";\nimport { getMatchAndUnMatchedFunds } from \"../../../utils/utilityFunctions\";\nimport { fetchInvestorDetails } from \"shared/store/actions/nct\";\nimport { SubmitButtonWithLoader } from \"../../../lib/Button\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport CustomizedSelect from \"../transactions/customizedSelect\";\nimport React from \"react\";\nimport { mohMap } from \"../UpdateNominee\";\n\nconst { dashboard } = en;\n\nconst columns = [\n { field: \"folio\", headerName: \"Folio\" },\n // { field: \"amcName\", headerName: \"Fund House\", width: 350 },\n { field: \"investorName\", headerName: \"Primary Holder\", width: 290 },\n { field: \"email\", headerName: \"Email Address\", width: 200 },\n {\n field: \"modeOfHolding\",\n headerName: \"Mode of Holding\",\n valueGetter: ({ row }) => {\n if (row.modeOfHolding === null) {\n return \"NA\";\n }\n const moh = mohMap[row.modeOfHolding];\n if (moh) {\n return moh;\n } else {\n return \"Others\";\n }\n },\n width: 150,\n },\n {\n field: \"mobile\",\n headerName: \"Mobile Number\",\n width: 150,\n valueGetter: ({ row, ...params }) => maskMobileNumber(row?.mobile),\n },\n];\n\nfunction ChangeMobile(props) {\n const [rowData, setRowData] = useState([]);\n const [loading, setLoading] = useState(false);\n const [uniqueEmailId, setUniqueEmailId] = useState([]);\n const [selectEmail, setSelectEmail] = useState(\"\");\n const [filteredData, setFilterdData] = useState([]);\n const { tableRows, tableColumns, selectedRows, setSelectedRows } =\n useTableWithCollapse({\n rows: filteredData,\n columns,\n loading,\n });\n const [show, setShow] = useState(false);\n const { mobile: newMobile, mobileRelationship } = props.location.state || {};\n\n const handleSubmit = async () => {\n let userResponse \n const foliosToUpdate = selectedRows.filter(\n (fund) => addDialCode(fund.mobile) !== addDialCode(newMobile)\n );\n const param = {\n request_type:\"mobile_update\",\n folios: foliosToUpdate.map((item) => item.folio.toString()),\n pan: props.investorData.PAN,\n distributor_id: props.token\n }\n let checkresponse\n try {\n checkresponse = await props.checkEmail(param);\n }\n catch(err) {\n userResponse = window.confirm(\"There is already a pending request to be approved by the Investor. Would you like to anyway proceed with a New NCT request?\"); \n }\n if(checkresponse?.message === \"Not a duplicate request\" || userResponse ) { if (foliosToUpdate.length) {\n try {\n setLoading(true);\n // const action = emailRegisteredUser()\n // ? OTP_ACTIONS.changeEmail\n // : OTP_ACTIONS.changeMobile;\n const investorName = props.investorData.invname;\n const investorPan = props.investorData.PAN;\n const investor = props.investors?.find(\n (item) =>\n item.Name.toLowerCase() === investorName.toLowerCase() ||\n item.Pan.toLowerCase() == investorPan.toLowerCase()\n );\n\n const newData = foliosToUpdate.map((item) => ({\n folio: item.folio,\n amc: item.amc,\n amc_name: item.amcName,\n }));\n const payload = {\n email: selectEmail,\n newMobile: newMobile,\n mobile: investor.Mobile,\n image: null,\n relation: mobileRelationship,\n pan: investorPan,\n distributor_id: props.token,\n data: newData,\n };\n if (selectEmail === \"N/A\") {\n props.history.replace(\n \"/new-transaction/nct-type/phygital/change-mobile-document\",\n {\n payload: payload,\n }\n );\n return;\n }\n\n const res = await props.updateMobile(payload);\n alert(\n `Request with request Id ${res.req_id} for update Mobile Number link has been sent to investor mobile number`\n );\n props.history.push(\"/new-transaction/nct-types\");\n } catch (err) {\n alert(err.message);\n } finally {\n setLoading(false);\n }\n } }\n };\n\n // Avoid direct navigation to this page if user is registered through email\n const { userRegisteredWith } = props || {};\n useEffect(() => {\n // This page should not be opened by entering the url if registered with Email\n // This page is the first page in the flow, if user is registered with mobile number.\n // But this page comes as 3rd page in the flow when user is email registered\n if (userRegisteredWith == REGISTER_WITH_EMAIL) {\n if (!props.location.state) {\n props.history.replace(\"/\");\n return;\n }\n }\n console.log(\"mobile\" ,props)\n }, []);\n\n useEffect(() => {\n async function fetchPortfolio() {\n try {\n setLoading(true);\n const { pan = \"\", pekrn = \"\", mobile = \"\", reqId = \"\" } = props;\n const payload = {\n pan: props.investorData.PAN,\n brokercode: props.token,\n };\n const { body: investorDetails = {} } = await props.fetchInvestorDetails(\n payload\n );\n const { success: nomineeFunds = [] } = investorDetails;\n const filters = [\n portfoliosByModeOfHolding,\n portfoliosByMinorStatus,\n portfoliosByTransactionResource,\n ];\n const funds = getMatchAndUnMatchedFunds(\n filters,\n getInvestorFunds(nomineeFunds),\n true\n ).map((fund) => {\n return { ...fund, error: getErrorMessage(fund, filters) };\n });\n const { nomineeFunds: _nomineeFunds = [], otherFunds = [] } =\n funds.reduce((prev, fund) => {\n if (fund?.nominees?.length) {\n return {\n ...prev,\n nomineeFunds: [...(prev.nomineeFunds ?? []), fund],\n };\n }\n return { ...prev, otherFunds: [...(prev.otherFunds ?? []), fund] };\n }, []);\n const rows = [...otherFunds, ..._nomineeFunds].map(\n (item) => ({\n folio: item.folio,\n amc: item.amc,\n amcName: item.amcName,\n email: item.email || \"N/A\",\n id: item.id,\n investorName: item.investorName,\n mobile: item.mobile,\n assetType: item.assetType,\n modeOfHolding: item.modeOfHolding,\n isDisabled: item.isDisabled,\n error: item.error,\n })\n );\n\n const emailIds = [];\n\n for (let i = 0; i < rows.length; i++) {\n const mobile = rows[i].email.trim() || \"N/A\";\n if (!emailIds.includes(mobile)) {\n emailIds.push(mobile);\n }\n }\n setUniqueEmailId(emailIds);\n setRowData(rows);\n // setSelectedRows(rows);\n setLoading(false);\n } catch (err) {\n alert(err.message);\n setLoading(false);\n }\n }\n fetchPortfolio();\n }, []);\n\n useEffect(() => {\n setSelectEmail(uniqueEmailId[0] || \"\");\n const filteredData = rowData.filter(\n (item) => item.email == uniqueEmailId[0]\n );\n setFilterdData(filteredData);\n // setRowData(filteredData);\n }, [uniqueEmailId, rowData]);\n\n const handleChangeEmailId = (e) => {\n setSelectEmail(e.target.value);\n const filteredData = rowData.filter((item) => item.email == e.target.value);\n setFilterdData(filteredData);\n // setRowData(filteredData);\n setSelectedRows([]);\n };\n\n return (\n \n
\n \n
\n \n \n {dashboard.ChangeMobile.newMobile.heading}\n {/* {dashboard.ChangeMobile.newMobile.headingSpan} */}\n \n
\n {/* {dashboard.ChangeMobile.newMobile.info}
\n\n \n
\n \n \n Enter New Mobile Number\n \n
\n \n \n {dashboard.changeEmail.buttonText}\n \n
\n \n {/* \n {\" \"}\n {dashboard.ChangeMobile.ChangeMobileInfo}\n \n \n \n Select Email ID\n
\n \n Sundaram Mutual Funds\n
\n\n \n
\n {!!tableRows.length && (\n \n
\n {/* \n \n {!rowData.length && !loading ? (\n \n row.isDisabled ? row.error : \"\"\n }\n checkBoxEnabled\n toolTipEnabled\n />\n )}\n
\n \n
\n )}\n \n fund.mobile !== newMobile)\n .length\n }\n onClick={() => {\n handleSubmit();\n }}\n />\n
\n \n \n \n {isSelected && (\n <>\n \n {selectedFile.name}{\" \"}\n {\n onImageSelected(\"\", \"\");\n setIsSelected(false);\n setSelectedFile({ name: \"\" });\n }}\n />\n \n \n )}\n {/* \n \n \n Signed.docx
*/}\n
\n \n Signed.docx ![\"icon\"](\"/images/close-black.svg\")
\n
*/}\n \n
\n {dashboard.ChangeTaxStatus.uploadDocumentsInfo}
\n {/*{documentFormat}
\nEach File size : {'<'} 2 MB
*/}\n- \n {AndriodUploadOptions.map((ele) => (\n
*/}\n \n \n {showMobile ? \"Mobile\" : \"Email\"}\n \n
\n\n {/* {email ? email : mobile}
\n\n
\n
\n \n \n );\n}\n","import { useState, useEffect } from \"react\";\nimport { connect } from \"react-redux\";\nimport { onSaveImageData } from \"shared/store/actions/nct\";\nimport { RootStateType } from \"shared/store/reducers\";\nimport { ImageSaveType } from \"shared/store/types/nct\";\nimport { OTP_ACTIONS } from \"../../../utils/constants\";\nimport UploadDocumentScreen from \"../UploadDocumentScreen\";\nimport { updateEmail } from \"shared/store/actions/nct\";\nimport { fetchInvestorDetails } from \"shared/store/actions/nct\";\nimport { getMatchAndUnMatchedFunds } from \"../../../utils/utilityFunctions\";\nimport {\n getPortfoliosFilteredData,\n portfoliosByMinorStatus,\n portfoliosByModeOfHolding,\n portfoliosByTransactionResource,\n} from \"../../home/portfolios/utils\";\nimport { getErrorMessage, getInvestorFunds } from \"../portfolios/utils\";\nimport en from \"../../../lang/en-us.js\";\nimport { RowInfoType } from \"./change-email-list\";\n//import InfoIcon from \"@mui/icons-material/Info\";\nimport React from \"react\";\nimport { BackArrow } from \"../UpdateNominee/SelectedFolios\";\nconst { dashboard } = en;\n\nfunction ChangeEmailDocument(props) {\n const [rowData, setRowData] = useState([]);\n const { enteredEmail: email, emailRelationship } = props.location.state || {};\n const [Document, setDocument] = useState\n {/* */}\n\n
\n\n {subheading}
*/}\n\n {/*\n \n {dashboard.changeEmail.UploadDocument.buttonText}\n \n
\n \n \n
\n \n );\n}\nexport default connect(\n ({ authReducer, portfolio, investor }) => ({\n ...authReducer,\n ...portfolio,\n ...investor,\n }),\n { onSaveImageData, updateEmail, fetchInvestorDetails }\n)(ChangeEmailDocument);\n\n// export default {};\n","import { useState, useEffect } from \"react\";\nimport { connect } from \"react-redux\";\nimport en from \"../../../lang/en-us.js\";\nimport { onSaveImageData } from \"shared/store/actions/nct\";\nimport { RootStateType } from \"shared/store/reducers\";\nimport { ImageSaveType } from \"shared/store/types/nct\";\nimport { OTP_ACTIONS } from \"../../../utils/constants\";\nimport UploadDocumentScreen from \"../UploadDocumentScreen\";\nimport { updateMobile } from \"shared/store/actions/nct\";\nimport { RowInfoType } from \"../ChangeEmail/change-email-list\";\nimport { fetchInvestorDetails } from \"shared/store/actions/nct\";\nimport { getMatchAndUnMatchedFunds } from \"../../../utils/utilityFunctions\";\nimport {\n getPortfoliosFilteredData,\n portfoliosByMinorStatus,\n portfoliosByModeOfHolding,\n portfoliosByTransactionResource,\n} from \"../../home/portfolios/utils\";\nimport { getErrorMessage, getInvestorFunds } from \"../portfolios/utils\";\nimport { BackArrow } from \"../UpdateNominee/SelectedFolios\";\nimport React from \"react\";\n\nconst { dashboard } = en;\n\nfunction ChangeMobileDocument(props) {\n const [Document, setDocument] = useState({\n image: { name: \"MOBILE_CHANGE\", format: \"\", content: \"\" },\n });\n const [rowData, setRowData] = useState([]);\n const { mobile: newMobile, mobileRelationship } = props.location.state || {};\n \n const handleImageSelection = (value, format) => {\n setDocument({\n image: {\n ...Document.image,\n format: format,\n content: value,\n },\n });\n };\n\n useEffect(() => {\n if (!props?.location?.state?.isPhygitial) return;\n async function fetchPortfolio() {\n try {\n // setLoading(true);\n const { pan = \"\", pekrn = \"\", mobile = \"\", reqId = \"\" } = props;\n const payload = {\n pan: props.investorData.PAN,\n brokercode: props.token,\n };\n const { body: investorDetails = {} } = await props.fetchInvestorDetails(\n payload\n );\n const { success: nomineeFunds = [] } = investorDetails;\n const filters = [\n portfoliosByModeOfHolding,\n portfoliosByMinorStatus,\n portfoliosByTransactionResource,\n ];\n const funds = getMatchAndUnMatchedFunds(\n filters,\n getInvestorFunds(nomineeFunds),\n true\n ).map((fund) => {\n return { ...fund, error: getErrorMessage(fund, filters) };\n });\n const { nomineeFunds: _nomineeFunds = [], otherFunds = [] } =\n funds.reduce((prev, fund) => {\n if (fund?.nominees?.length) {\n return {\n ...prev,\n nomineeFunds: [...(prev.nomineeFunds ?? []), fund],\n };\n }\n return { ...prev, otherFunds: [...(prev.otherFunds ?? []), fund] };\n }, []);\n const rows = [...otherFunds, ..._nomineeFunds].map(\n (item) => ({\n folio:item.folio,\n amc: item.amc,\n amcName: item.amcName,\n email: item.email || \"N/A\",\n id: item.id,\n investorName: item.investorName,\n mobile: item.mobile,\n assetType: item.assetType,\n })\n );\n setRowData(rows);\n } catch (err) {\n alert(err.message);\n // setLoading(false);\n }\n }\n fetchPortfolio();\n }, []);\n\n const handleSubmission = async () => {\n if (props?.location?.state?.isPhygitial) {\n try {\n const investorName = props.investorData.invname;\n const investorPan = props.investorData.PAN;\n const investor = props.investors.find(\n (item) =>\n item.Name.toLowerCase() === investorName.toLowerCase() ||\n item.Pan.toLowerCase() == investorPan.toLowerCase()\n );\n\n const newData = rowData.map((item) => ({\n folio: item.folio,\n amc: item.amc,\n amc_name: item.amcName,\n }));\n\n const payload = {\n email: investor.Email,\n newMobile: newMobile,\n mobile: investor.Mobile,\n image: Document.image,\n relation: mobileRelationship,\n pan: investorPan,\n distributor_id: props.token,\n data: newData,\n };\n const res = await props.updateMobile(payload);\n alert(res.message);\n props.history.push(\"/new-transaction/nct-types\");\n } catch (err) {\n alert(err.message);\n }\n } else {\n try {\n const payload = {\n ...props.location.state.payload,\n image: Document.image,\n };\n const res = await props.updateMobile(payload);\n\n alert(res.message);\n props.history.push(\"/new-transaction/nct-types\");\n } catch (err) {\n alert(err.message);\n }\n }\n };\n\n // save image in store\n useEffect(() => {\n return () => {\n const imageInfo = {\n data: [Document.image],\n type: \"CHANGE_MOBILE\",\n };\n props.onSaveImageData(imageInfo);\n };\n }, [Document]);\n\n return (\n \n
\n );\n}\n\nexport default connect(\n ({ authReducer, portfolio, investor }) => ({\n ...authReducer,\n ...portfolio,\n ...investor,\n }),\n { onSaveImageData, updateMobile, fetchInvestorDetails }\n)(ChangeMobileDocument);\n","import React, { Component } from \"react\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport CustomizedSelect from \"./customizedSelect\";\nimport {\n getNewPurchaseFundList,\n getFolioSipCancellation,\n getCancellationReason\n} from \"shared/store/actions/investors\";\nimport { connect } from \"react-redux\";\nimport {\n GET_FUNDS_LIST,\n GET_FUNDS_LIST_FAILED,\n GET_FUNDS_LIST_SUCCESS,\n} from \"shared/store/types/investors\";\nimport { DetailsGroup } from \"./newPurchaseConfirm\";\nimport { BUILD_URL } from \"../home\";\nimport { SipCancelModal } from \"../customModal\";\nimport { SundaramMutualFund } from \"./newPurchaseForm\";\n\nclass SipCancellation extends Component {\n constructor(props) {\n super(props);\n this.state = {\n sipTypes: [\n { label: \"SIP\", value: \"SIP\" },\n { label: \"STP\", value: \"STP\" },\n { label: \"SWP\", value: \"SWP\" },\n ],\n funds: [],\n folios: [],\n fund: { value: \"\" },\n sipType: { value: \"\" },\n cancelDetails: {},\n checked: \"\",\n ShowMore: \"\",\n visible: \"\",\n rejectionReasons:[],\n rejectionreasonsOpen:false,\n othersText:{value:\"\"},\n selectedReason:\"\",\n reasonMandatory:false,\n\n };\n }\n async componentDidMount(){\n const response = await this.props.getCancellationReason({txntype:\"SIP\"})\n this.setState({rejectionReasons:response.DtData})\n } \n\n handleSipTypeChange = async (event) => {\n this.setState({\n sipType: { value: event.target.value },\n folios: [],\n funds: [],\n fund: { value: \"176\" },\n });\n const { investorData } = this.props;\n const body = {\n Trtype: event.target.value,\n Pan: investorData.PAN,\n Fund: \"176\",\n invdistflag: \"S\",\n };\n\n const response = await this.props.getFolioSipCancellation(body);\n if (!!response && !!response.DtData && response.DtData.length > 0) {\n this.setState({\n folios: response.DtData,\n fund: { value: \"176\" },\n });\n } else {\n alert(\"No Active Registrations\");\n }\n };\n\n handleFundChange = async (event) => {\n const { sipType } = this.state;\n const { investorData } = this.props;\n this.setState({\n fund: { value: event.target.value },\n });\n\n const body = {\n Trtype: sipType.value,\n Pan: investorData.PAN,\n Fund: \"176\",\n invdistflag: \"S\",\n };\n const response = await this.props.getFolioSipCancellation(body);\n\n if (!!response && !!response.DtData && response.DtData.length > 0) {\n this.setState({\n folios: response.DtData,\n fund: { value: event.target.value },\n });\n } else if (!response) {\n alert(\"No data found for the following pan number\");\n // this.props.history.push(`/investors`);\n }\n };\n\n handleChangeCheckbox = (value) => () => {\n this.setState({\n checked: value,\n });\n };\n onSubmit = () => {\n const { checked, folios, fund, sipType } = this.state;\n\n const Foliodata = !!folios && folios.find((ele) => ele.ihno == checked);\n if (!!Foliodata) {\n this.props.history.push({\n pathname: `/investors/sip-cancellation/digital/transact/confirm`,\n state: {\n folioDetails: Foliodata,\n type: \"Sip cancellation\",\n fundName: \"Sundaram Mutual Fund\",\n sipType: sipType.value,\n },\n });\n }\n };\n\n ShowDetails = (label) => () => {\n if (label === this.state.ShowMore) {\n this.setState({\n ShowMore: \"\",\n });\n } else {\n this.setState({\n ShowMore: label,\n });\n }\n };\n\n pause = (ele) => () => {\n if (ele.pause_flag === \"Y\" && ele.pause_err_msg === \"\") {\n this.props.history.push({\n pathname: `/investors/sip-cancellation/digital/transact/confirm`,\n state: {\n type: \"Sip Pause\",\n pauseDetails: ele,\n scheme: { Fund: \"176\" },\n fundName: \"SUNDARAM MUTUAL FUND\",\n sipType: this.state.sipType.value,\n },\n });\n } else if (!!ele.pause_err_msg) {\n alert(`${ele.pause_err_msg}`);\n }\n };\n\n closeNoModal = () => {\n this.setState({\n open: false,\n rejectionreasonsOpen:false,\n message: \"\",\n notAllowedPopUp: false,\n othersText:{value:\"\"},\n selectedReason:\"\"\n });\n };\n\n\n closeYesModal = () => {\n this.setState({\n open:false,\n rejectionreasonsOpen:true,\n })\n };\n\n closemodelafterrejecttion=()=>{\n if(!this.state.selectedReason || (this.state.selectedReason.includes(\"Others\") && !this.state.othersText.value)){\n this.setState({reasonMandatory:true})\n return;\n }\n if(this.state.selectedReason.includes(\"Others\") && !this.state.othersText.value){\n this.setState({\n othersText: {\n value:\"\",\n isError: true,\n errorMessage: \"Reason is mandatory\",\n },\n });\n return;\n }\n if ( this.state.selectedReason.includes(\"Others\") && this.state.othersText.value.length < 10) {\n this.setState({\n othersText: {\n value:\"\",\n isError: true,\n errorMessage: \"Please enter at least 10 characters\",\n },\n });\n return;\n }\n if( this.state.selectedReason.includes(\"Others\") && this.state.othersText.value.length > 100) {\n this.setState({\n othersText: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter at least 10 characters\",\n },\n });\n return;\n }\n const { cancelDetails } = this.state;\n this.props.history.push({\n pathname: `/investors/sip-cancellation/digital/transact/confirm`,\n state: {\n type: \"Sip cancellation\",\n pauseDetails: cancelDetails,\n scheme: { Fund: this.state.fund.value.amc_code },\n fundName: this.state.fund.value.amc_name,\n sipType: this.state.sipType.value,\n cancellationReason:this.state.selectedReason.includes(\"Others\")?this.state.othersText.value:this.state.selectedReason,\n reasons:this.state.rejectionReasons\n },\n });\n }\n \n\n cancel = (ele) => () => {\n if (\n ele.pause_flag === \"Y\" &&\n ele.pause_err_msg === \"\" &&\n this.state.sipType.value === \"SIP\"\n ) {\n this.setState({\n open: true,\n cancelDetails: ele,\n message: \"Are you sure you want to Cancel? Instead Choose Pause\",\n });\n } else {\n this.props.history.push({\n pathname: `/investors/sip-cancellation/digital/transact/confirm`,\n state: {\n type: \"Sip cancellation\",\n pauseDetails: ele,\n scheme: { Fund: \"176\" },\n fundName: \"SUNDARAM MUTUAL FUND\",\n sipType: this.state.sipType.value,\n },\n });\n }\n };\n handleReasonChange = (e)=>{\n this.setState({selectedReason:e.target.value,reasonMandatory:false,othersText:{value:\"\"}})\n }\n selectedotherreason = (e) => {\n const inputValue = e.target.value.replace(/[^A-Za-z\\s]/g, '');\n if (inputValue.length <= 100) {\n this.setState({ othersText: { value: inputValue } });\n } else if (inputValue.length < 10) {\n this.setState({\n othersText: {\n value: inputValue,\n isError: true,\n errorMessage: \"Please enter at least 10 characters\",\n },\n });\n return;\n } else {\n this.setState({\n othersText: {\n value: inputValue.slice(0, 100),\n isError: true,\n errorMessage: \"Maximum character length is 100\",\n },\n });\n }\n }\n render() {\n const { sipTypes, sipType, folios } = this.state;\n return (\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 {folios.map((ele, index) => (\n \n {ele.pause_flag !== \"N\" &&\n this.state.sipType.value === \"SIP\" && (\n \n \n Pause\n
\n \n )}\n\n \n
\n\n \n
\n )}\n \n \n Select Transaction Type\n
\n \n {NctTypeMap.map(\n (\n { name, path, isPhygitial, phygital, digital, isPhygitalPath },\n i\n ) => (\n {\n history.push(isPhygitial ? isPhygitalPath : path, {\n isPhygitial: isPhygitial,\n });\n }}\n name={name}\n isPhygitial={isPhygitial}\n phygital={phygital}\n digital={digital}\n key={i}\n />\n )\n )}\n
\n \n );\n}\n\nfunction NctTypeCard({\n onClick,\n name,\n isPhygitial,\n phygital,\n digital,\n}) {\n const commonStyle = {\n display: \"flex\",\n justifyContent: \"center\",\n flexGrow: 1,\n fontSize: 13,\n color: \"black\",\n fontFamily: \"Ubuntu-Regular\",\n flexBasis: 0,\n padding: \"15px 0px\",\n cursor: \"pointer\",\n // boxShadow: \"-1px 1px 3px 1px lavender\",\n //padding: \"15px 0px 0px 0px\",\n // borderRadius: 8,\n };\n return (\n \n \n \n {name}\n
\n\n \n
\n \n \n \n eNACH Participating AMCs{\" \"}\n
\n eNACH
\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 \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 {/* \n
\n\n \n \n {this.props.match.path.includes(\"nct-type\") ? null : (\n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer,investor }) => {\n const { investorData, user_pan } = authReducer;\n const {kycData}=investor\n return { investorData, user_pan ,kycData};\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","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 \n
\n {!!this.props.image && (\n {invname || this.props.kycData?.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 {this.props.name}
\n {/* {this.props.name !== \"Pause/Cancellation\" &&\n this.props.name != \"NCT\" &&\n this.props.name != \"eNACH\" ? (\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 \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 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 {\n getNewPurchaseFundList,\n checkKyc,\n getDomains,\n} 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 InputBase from \"@material-ui/core/InputBase\";\nclass EKYC extends Component {\n constructor(props) {\n super(props);\n const { match } = this.props;\n this.state = {\n kycType: { value: \"IKYC\" },\n ipv: { value: \"YES\", errorMessage: \"\" },\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: \"117\" } },\n name: { value: \"\" },\n email: { value: \"\" },\n mobile: { value: \"\" },\n };\n }\n\n async 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 // 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 checkKycStatus = async () => {\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 isShowError: true,\n errorMessage: \"Enter a Valid PAN Number\",\n },\n });\n } else {\n const pan = this.state.pan.value;\n const params = {\n i_pan: pan,\n InvDistFlag: \"S\",\n };\n const response = await this.props.checkKyc(params);\n try {\n const { DtData } = response;\n const { KYCBlock } = DtData[0];\n if (KYCBlock === \"N\") {\n this.setState({\n pan: {\n value: \"\",\n isError: false,\n isShowError: false,\n errorMessage: \"\",\n },\n });\n alert(\"PAN is KYC Registered !\");\n }\n } catch (e) {\n console.log(e);\n }\n }\n };\n submit = async () => {\n const { ipv, open, messageAlert, fund, email, ...others } = 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 === \"kycType\"\n ? \"KYC type\"\n : key === \"fund\"\n ? \"Fund\"\n : key === \"pan\"\n ? \"PAN\"\n : key === \"name\"\n ? \"Name\"\n : key === \"email\"\n ? \"Email Id\"\n : key === \"mobile\"\n ? \"Mobile\"\n : key\n } is mandatory`,\n },\n });\n });\n return;\n } else if (\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 } 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 if (this.state.email.value === \"\") {\n this.setState({\n email: {\n isError: true,\n errorMessage: `(emaild 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.email.value\n ) === false\n ) {\n this.setState({\n email: {\n value: \"\",\n isError: true,\n errorMessage: `(enter a valid email address)`,\n },\n });\n }\n } else if (this.state.name.value === \"\") {\n this.setState({\n name: {\n isError: true,\n errorMessage: \"(Name is Mandatory)\",\n },\n });\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 if (this.state.mobile.value === \"\") {\n this.setState({\n mobile: {\n isError: true,\n errorMessage: `(Mobile no is mandatory)`,\n },\n });\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 isError: true,\n errorMessage: `(enter a valid Mobile number)`,\n },\n });\n }\n } else {\n const { fund, name, email, mobile, pan } = this.state;\n const url = `https://mfs.kfintech.com/ckyc/eKyc.aspx?UserID=2703&AgencyCode=${fund.value.value}&AgencyTransactionID=123&Pan=${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=${fund.value.value}&fromType=DITWEB`;\n\n const params = {\n InvPan: this.state.pan.value,\n InvMobile: mobile.value,\n InvFund: \"176\",\n InvName: name.value,\n DistUserId: this.props.userId,\n InvDistFlag: \"S\",\n Url: \"\",\n };\n const addedParms = {\n IMEI: encodeURIComponent(btoa(\"127.0.0.1\")),\n DistName: encodeURIComponent(btoa(this.props.userId)),\n ArnCode: encodeURIComponent(btoa(this.props.token)),\n APKVer: encodeURIComponent(btoa(\"1.0\")),\n InvEmail: encodeURIComponent(btoa(email.value)),\n };\n const response = await this.props.EKYCMail(params, addedParms);\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 };\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(`/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 render() {\n const { emaildomain, emailhost } = this.props;\n const {\n email,\n name,\n mobile,\n kycType,\n emailPlatform,\n emailSite,\n emailUsername,\n } = 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\nexport default connect(\n ({ authReducer, transactions, dashboard }) => {\n const { token, userId } = authReducer;\n const { fundsList = [] } = transactions;\n const { emaildomain, emailhost } = dashboard;\n return {\n token,\n userId,\n fundsList,\n emaildomain,\n emailhost,\n };\n },\n { getNewPurchaseFundList, EKYCMail, checkKyc, getDomains }\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\";\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
\n \n
\n PAN*
\n \n
\n \n
\n \n
\n \n
\n Name*
\n \n
\n \n
\n \n \n (evt.key === \"e\" || evt.key === \".\" || evt.key === \"-\") &&\n evt.preventDefault()\n }\n type=\"number\"\n value={mobile.value}\n isShowError={mobile.isError}\n errorMessage={mobile.errorMessage}\n />\n
\n \n \n
\n \n {location?.state?.from !== \"view history\" &&
\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 = `/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 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 ...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 (others.password.value === \"\") {\n this.setState({\n password: {\n ...others[\"password\"],\n isError: true,\n errorMessage: `Password is mandatory`,\n },\n });\n this.passwordField.focus();\n return;\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: \"176\",\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 });\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={!!state && !!state.value}\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 \n Password should be at least 8 characters in length and\n should contain at least 1 uppercase letter (A-Z), 1 special\n 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 ) : count > 0 ? (\n \n No Investor PAN found. Please submit Investor PAN\n
\n ) : (\n \n
\n ))}\n Transactions:
\n {transactions.map((transaction, index) => (\n \n
\n\n \n
\n \n {transaction.SchemeDesc}\n
\n \n {transaction.Status === \"Pending\" ||\n transaction.Status ===\n \"Pending payment confirmation\" ||\n transaction.Status === \"Success\" ? (\n \n {transaction.Status === \"Rejected\" ? (\n \n this.props.history.push(\n NEW_TRANSACTION_URL +\n \"/transction-types\"\n )\n }\n />\n ) : (\n \n this.props.history.push(\n NEW_TRANSACTION_URL +\n \"/transction-types\"\n )\n }\n />\n )}\n
\n \n
\n ) : (\n \n )}\n \n
\n No Data Found
\n )}\n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactionHistory, loading }) => {\n const { investorData, userId, token } = authReducer;\n const { count } = loading;\n const { fundsList, transactions } = transactionHistory;\n return { investorData, userId, fundsList, transactions, token, count };\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
\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}\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 {ele.key}
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport Paper from \"@material-ui/core/Paper\";\nimport Table from \"@material-ui/core/Table\";\nimport TableBody from \"@material-ui/core/TableBody\";\nimport TablePagination from \"@material-ui/core/TablePagination\";\nimport TableCell from \"@material-ui/core/TableCell\";\nimport TableHead from \"@material-ui/core/TableHead\";\nimport TableRow from \"@material-ui/core/TableRow\";\nimport { connect } from \"react-redux\";\nimport {\n getInvestorDetails,\n checkKyc,\n userPan,\n storeKYCData,\n clearingFirstTimeInvestorJourney,\n nctTrack,\n storeCurrentPage\n} from \"shared/store/actions\";\nimport { REQ_BY } from \"shared/store/types\";\nimport { INVESTOR_URL } from \"./investors\";\nimport { NEW_TRANSACTION_URL } from \"./transactions\";\nimport { MAILBACK_URL } from \"./mailBackRequest\";\nimport { HISTORY_URL } from \"./transactionHistory\";\nimport { BUILD_URL } from \"./home\";\nimport CustomLoading from \"../home/CustomLoader\";\nimport CustomLoader from \"../forms/customLoader\";\nimport {\n newTransactionActive,\n transactionHistoryActive,\n} from \"../forms/appEssentials\";\n\nclass TableData extends Component {\n constructor(props) {\n super(props);\n this.state = {\n currentPage: 1,\n totalPages: Math.ceil(this.props.investors?.length/ 20),\n isLoading: false,\n };\n }\n\n componentDidUpdate(prevProps) {\n if (prevProps.investors !== this.props.investors) {\n this.setState({\n totalPages: Math.ceil(this.props.investors?.length / 20),\n currentPage: this.props?.currentPage,\n });\n }\n }\n\n goToTransaction = (PAN, Email, mailBackName) => async () => {\n this.props.storeCurrentPage(this.state.currentPage);\n if (Email === \"\" || Email === undefined) {\n alert(\"Email ID not available. Transaction could not be initiated\");\n return;\n }\n await this.props.userPan(PAN);\n await this.props.storeKYCData({});\n await this.props.clearingFirstTimeInvestorJourney();\n const response = await this.getInvestorDetails(PAN);\n if (response) {\n this.props.history.push({\n pathname: `/investors` + \"/transction-types\",\n });\n } else {\n const kycResponse = await this.getKycDetails(PAN);\n if (kycResponse) {\n const {\n DtData: [info],\n } = kycResponse;\n if (info.KYCBlock === \"N\") {\n this.props.history.push({\n pathname: `/investors` + \"/transction-types\",\n });\n }\n }\n }\n };\n\n getInvestorDetails = async (pan) => {\n const params = { PAN: pan, Uid: this.props.userId, ReqBy: REQ_BY };\n const response = await this.props.getInvestorDetails(params);\n return response;\n };\n\n getKycDetails = async (pan) => {\n const params = {\n i_pan: pan,\n fund: \"176\",\n userid: this.props.userId,\n };\n const kycResponse = await this.props.checkKyc(params);\n return kycResponse;\n };\n gotoNctTransaction = (PAN, NAME) => async (e) => {\n const params = { pan: PAN, distributor_id: this.props.token, offSet: 3 };\n this.setState({ isLoading: true });\n const response = await this.props.nctTrack(params);\n if (response) {\n this.props.history.push({\n pathname: `nct-transaction/details/${PAN}`,\n state: { transactions: response, name: NAME, pan: PAN },\n });\n this.setState({ isLoading: false });\n return;\n }\n this.setState({ isLoading: false });\n return;\n };\n\n goToMailBack = (PAN, mailBackName) => async () => {\n const response = await this.getInvestorDetails(PAN);\n if (response) {\n if (mailBackName === \"mailBackSoa\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/mail-back-soa\",\n });\n } else if (mailBackName === \"ELSS\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/ELSS\",\n });\n } else if (mailBackName === \"CAN\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/CAN\",\n });\n } else if (mailBackName === \"CGS\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/CGS\",\n });\n } else if (mailBackName === \"GAS\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/GAS\",\n });\n } else if (mailBackName === \"Networth\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/Networth\",\n });\n } else {\n this.props.history.push({\n pathname:\n MAILBACK_URL +\n \"/investor/investor-selection/consolidated-account-statement\",\n });\n }\n } else {\n const kycResponse = await this.getKycDetails(PAN);\n const {\n DtData: [info],\n } = kycResponse;\n if (info.KYCBlock === \"N\") {\n if (mailBackName === \"mailBackSoa\") {\n this.props.history.push({\n pathname:\n MAILBACK_URL + \"/investor/investor-selection/mail-back-soa\",\n });\n } else if (mailBackName === \"ELSS\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/ELSS\",\n });\n } else if (mailBackName === \"CAN\") {\n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection/CAN\",\n });\n } else {\n this.props.history.push({\n pathname:\n MAILBACK_URL +\n \"/investor/investor-selection/consolidated-account-statement\",\n });\n }\n }\n }\n };\n\n goToTransactionHistory = (PAN) => async () => {\n const response = await this.getInvestorDetails(PAN);\n if (response) {\n this.props.history.push({\n pathname: `${HISTORY_URL}/details/xxxxxxxxxxx`,\n state: { isKyc: true },\n });\n } else {\n const kycResponse = await this.getKycDetails(PAN);\n const {\n DtData: [info],\n } = kycResponse;\n if (info.KYCBlock === \"N\") {\n this.props.history.push({\n pathname: `${HISTORY_URL}/details/xxxxxxxxxxx`,\n state: { isKyc: false },\n });\n }\n }\n };\n previous = () => {\n if (this.state.currentPage > 1) {\n this.setState((pre) => ({ currentPage: pre.currentPage - 1 }));\n }\n };\n next = () => {\n if (this.state.currentPage < this.state.totalPages) {\n this.setState((pre) => ({ currentPage: pre.currentPage + 1 }));\n }\n };\n render() {\n const pathname = this.props.location.pathname;\n const { investors, count, loading,nctInvestors } = this.props;\n const TableHeaders = [\n \"Name\",\n \"PAN\",\n \"KYC/FATCA\",\n pathname.includes(\"investor\") ? \"Email\" : null,\n \"Mobile\",\n `${\n pathname.includes(\"transaction-history\") ||\n pathname.includes(\"nct-transaction\")\n ? \"View Transactions\"\n : \"Action\"\n }`,\n ];\n const sortedData = [...this.props.investors].filter((value, index, self) => {\n return index === self.findIndex((t) => (\n t.Pan === value.Pan\n ));\n }).sort((a, b) => {\n return a.Name.localeCompare(b.Name);\n });\n const isNct =pathname.includes(\"nct\")\n const investorsData = isNct ?nctInvestors :sortedData\n return (\n \n {count > 0 || this.state.isLoading || loading ? (\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 {`<`}\n {`>`}\n {`${this.state.currentPage} of ${this.state.totalPages}`}\n
\n )}\n \n \n {investorsData.map((investor, index) => (\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 \n \n {pathname.includes(\"/new-transaction\") ||\n pathname.includes(\"/mailBackRequest\") ||\n pathname.includes(\"/transaction-history\") ? (\n {investor.Name}\n ) : (\n \n this.props.history.push({\n pathname: `${INVESTOR_URL}/details/${investor.Pan}`,\n state: { PAN: investor.Pan },\n })\n }\n style={{\n borderBottom: \"2px solid #80bce3\",\n paddingBottom: 3,\n fontFamily: \"Ubuntu-Medium\",\n }}\n >\n {investor.Name}\n \n )}\n
\n {investor.Mobile}
\n \n \n \n \n {this.state.errorMessage}\n
\n )}\n \n
\n \n Search\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, { useEffect } from \"react\";\nimport Image from \"../../../../Image\";\nimport { Link } from \"react-router-dom\";\nimport { connect } from \"react-redux\";\n\nconst VerticalStepper = (props) => {\n useEffect(() => {\n console.log(props)\n } , [props]);\n const steps = [\n {\n name: \"investor-details\",\n value: \"Investor Details\",\n image: \"/images/home.png\",\n url: \"/new-investor-transaction/investor-details\",\n data: !!props.applicantparams?.i_dob,\n },\n {\n name: \"fatca-details\",\n value: \"FATCA Details\",\n image: \"/images/ekyc.svg\",\n url: \"/new-investor-transaction/fatca-details\",\n data: (!props.changeMode && !!props.fatcaDetails?.i_income),\n },\n {\n name: \"nominee-details\",\n value: \"Nominee Details\",\n image: \"/images/investor.png\",\n url: \"/new-investor-transaction/nominee-details\",\n data: (!props.changeMode && (!!props.nomineDetails?.i_nominee || !!props.noNominee)),\n },\n {\n name: \"bank-details\",\n value: \"Bank Details\",\n image: \"/images/newtransaction.png\",\n url: \"/new-investor-transaction/bank-details\",\n data: (!props.changeMode &&!!props?.bankDetails)\n },\n {\n name: \"scheme-details\",\n value: \"Scheme Details\",\n image: \"/images/connect.png\",\n url: \"/new-investor-transaction/scheme-details\",\n data: (!props.changeMode && !!props?.schemeDetailsClick)\n },\n ];\n const { active, hide } = props;\n return (\n \n {!hide && (\n <>\n
\n \n ))}\n \n \n {steps.map((step, index) => (\n \n \n \n Step {index + 1}\n \n \n {step.value}\n \n
\n \n \n
\n Note: Please click the \"Submit/Proceed\" button to save the changes. Otherwise, the changes will NOT be saved.
\n \n )}\n \n );\n};\nexport default connect(({ newinvestor }) => {\n const {\n applicantparams,\n schemeDetails,\n fatcaDetails,\n investmentparams,\n nomineDetails,\n noNominee,\n bankDetails,\n schemeDetailsClick,\n changeMode\n } = newinvestor;\n return {\n applicantparams,\n schemeDetails,\n fatcaDetails,\n applicantparams,\n investmentparams,\n nomineDetails,\n noNominee,\n bankDetails,\n schemeDetailsClick,\n changeMode\n };\n})(VerticalStepper);\n","import React from \"react\";\n\nconst CardComponent = (props) => {\n return (\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 = new RegExp(\n \"[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,4}$\"\n);\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]$/\");\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];\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];\n","import React,{Component} from \"react\";\nimport { BUILD_URL } from \"../home/home\";\nimport { Loader_icon } from \"./appEssentials\";\n\n\nexport default class CustomLoader extends Component {\n render () {\n const {display} = this.props\n return (\n {props.title}
\n {props.children}
\n \n
\n \n )\n }\n}\n","import Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControl from \"@material-ui/core/FormControl\";\nimport * as React from \"react\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nexport const RadioButton = (props) => {\n return (\n <>\n \n \n \n
\n \n \n
\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 changeInMode\n} from \"shared/store/actions\";\nimport { panRegex } from \".\";\nimport CustomLoader from \"../../../forms/Loader\";\nimport { KycNotDoneDialog } from \"../../customModal\";\nimport CustomizedSelect from \"../customizedSelect\";\nimport { Input } from \"../../../forms/input\";\nimport { NEW_TRANSACTION_URL } from \"..\";\nimport { RadioButton } from \"./lib/Radiobutton\";\n\nconst FatcaDetails = (props) => {\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 [openModal, setOpenModal] = useState(false);\n const [panverification, setPanverification] = useState(false);\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\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 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 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 \n useEffect(() => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n firstRender();\n console.log(\"fatca render\",tax_resident);\n }, []);\n const firstRender = async () => {\n await getLists();\n await prefillFormValues();\n checkReduxStore();\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 && kycResponse.DtData.length > 0) {\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 setGross_Annual_Income((prev) => {\n return {\n ...prev,\n gross_annual_incomeprimary: { value: GrossAnnualIncome },\n };\n });\n const countryvalue =\n 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 const address = add1 + add2 + add3;\n const convertingcountry = country.toLowerCase();\n const restOfGreeting = convertingcountry.slice(1);\n const convertcountry = convertingcountry[0]?.toUpperCase();\n const newGreeting = convertcountry + restOfGreeting;\n const Address = {\n state: state,\n city: city,\n country: newGreeting,\n pincode: pin,\n address: address,\n };\n props.storeAddress(Address);\n setcountryselected({\n ...countryselected,\n nationality: { value: countryvalue },\n countryofbirth: { value: countryvalue },\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 // 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 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 submit = async () => {\n if (categoryoccupation.categoryoccupationprimary.value == \"\") {\n setCategoryOccupation({\n ...categoryoccupation,\n categoryoccupationprimary: {\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 isError: true,\n errorMessage: \"Select the Annual Income\",\n },\n });\n return;\n }\n if (countryselected.countryofbirth.value == \"\") {\n setcountryselected({\n ...countryselected,\n ...countryselected,\n countryofbirth: {\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 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 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 isError: true,\n errorMessage: \"Enter the Foreign Tax ID No\",\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 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 isError: true,\n errorMessage: \"Select the Annual Income\",\n },\n });\n return;\n }\n if (!countryselected.countryofbirthjoint1.value) {\n setcountryselected({\n ...countryselected,\n countryofbirthjoint1: {\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 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 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 isError: true,\n errorMessage: \"Enter the Foreign Tax ID No\",\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 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 isError: true,\n errorMessage: \"Select the Annual Income\",\n },\n });\n return;\n }\n if (!countryselected.countryofbirthjoint2.value) {\n setcountryselected({\n ...countryselected,\n countryofbirthjoint2: {\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 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 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 isError: true,\n errorMessage: \"Enter the Foreign Tax ID No\",\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 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 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 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 props.changeInMode(false)\n setIsLoading(false);\n props.history.replace(\"/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 : {props.applicantparams?.i_pangno}/{props.applicantparams?.i_fname}
\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\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\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 settax_resident_option({\n ...tax_resident_option,\n primary: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n \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 setforeign_tax_id_no({\n ...foreign_tax_id_no,\n primary: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n isShowError={foreign_tax_id_no.primary.isError}\n errorMessage={tax_resident_option.primary.errorMessage}\n />\n
\n \n \n \n
\n )}\n First Joint Holder : {props.applicantparams?.i_pangno2}/{props.applicantparams?.i_jholder1}
\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 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 setforeign_tax_id_no({\n ...foreign_tax_id_no,\n joint1: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n isShowError={foreign_tax_id_no.joint1.isError}\n errorMessage={tax_resident_option.joint1.errorMessage}\n />\n
\n \n \n \n
\n )}\n Second Joint Holder : {props.applicantparams?.i_pangno3}/{props.applicantparams?.i_jholder2}
\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 \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 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 setforeign_tax_id_no({\n ...foreign_tax_id_no,\n joint2: { value: event.target.value },\n })\n }\n fatcawidth={\"true\"}\n isShowError={foreign_tax_id_no.joint2.isError}\n errorMessage={tax_resident_option.joint2.errorMessage}\n />\n
\n \n \n props.history.replace(\"/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 changeInMode\n }\n)(FatcaDetails);\n","import * as React from \"react\";\nexport const Termsandconditions = () => {\n return (\n <>\n \n The ARN holder has disclosed to me/us all the commissions in the form\n of trail commission or any other mode, payable to him for the\n different competing Schemes of various Mutual Funds from amongst which\n the Scheme is being recommended to me/us.\n
\n\n Disclaimer: The Registrar of the AMC will allot the number of units\n for the total investment amount. The number of Units allotted by the\n Registrar will reflect in your online account statement within 2\n working days.\n
\n \n );\n};\n","import { MenuItem, Checkbox } from \"@material-ui/core\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport CustomizedDialogs from \"../../customModal\";\nimport { Input } from \"../../../forms/input\";\nimport React, { useState, useEffect, useReducer } from \"react\";\nimport { connect, useDispatch } from \"react-redux\";\nimport { Termsandconditions } from \"./lib/Termsandconditions\";\nimport {\n getNewPurchaseFundList,\n validateSubBroker,\n submitLumpsumDetails,\n storeSchemeDetails,\n clearingFirstTimeInvestorJourney,\n storeLumpsum,\n storeLumpsumDetails,\n} from \"shared/store/actions\";\nimport {\n GET_CATEGORY_LIST,\n GET_CATEGORY_LIST_SUCCESS,\n GET_CATEGORY_LIST_FAILED,\n REGULAR,\n STORE_LUMPSUM,\n} from \"shared/store/types\";\nimport IntegrationReactSelect from \"../../../forms/autoCompleteInput\";\nimport { RadioButton } from \"./lib/Radiobutton\";\nimport CustomLoader from \"../../../forms/Loader\";\nimport { format } from \"date-fns\";\nimport CustomizedSelect from \"../customizedSelect\";\nimport CardComponent from \"./lib/CardComponent\";\nconst Lumpsum = (props) => {\n const initialState = {\n Scheme: { value: \"\" },\n Category: { 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 name: \"Scheme Plan\",\n type: \"text\",\n placeholder: \"Select Scheme Plan\",\n isMandatory: true,\n listName: \"schemePlanList\",\n disabled: true,\n display: \"none\",\n },\n ],\n [\n {\n name: \"Scheme Option\",\n type: \"text\",\n placeholder: \"Select Scheme Option\",\n isMandatory: true,\n listName: \"schemeOptionList\",\n disabled: true,\n display: \"none\",\n },\n {\n name: \"Do you want to intentionally leave the EUIN box blank?\",\n type: \"radio\",\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 const [dialog, setDialog] = useState({ open: false, appno: \"\" });\n const [isLoading, setIsLoading] = useState(false);\n const [isChecked, setIsChecked] = useState(false);\n const fetchSchemeList = async () => {\n try {\n const params = {\n plntype: \"Regular\",\n opt: \"S\",\n schemetype: props.lumpsum.Category?.value || formValues.Category?.value,\n fund: \"176\",\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 }));\n setFormValues({\n schemeList: schemeList.filter((item) => {\n return (\n item.plan.toLowerCase() === \"regular\" && item.schemeValue !== \"EB\"\n );\n }),\n });\n if(!!props.lumpsum.Scheme) {\n setFormValues({ multiples : schemeList.find((item) => item.value === props.lumpsum?.Scheme?.value)?.multiples || 1 });\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: \"176\",\n SubAgentCd: \"\",\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 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: \"176\", customfund: \"176\" };\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 fetchSchemeList();\n fetchCategoryList();\n fetchFromstore();\n if(!!props.lumpsum.Scheme){\n fetchSchemeList();\n }\n }, []);\n useEffect(() => {\n fetchSchemeList();\n fetchEuinList();\n }, [formValues.Category.value]);\n useEffect(() => {\n props.storeLumpsum({\n ...formValues,\n type: \"lumpsum\",\n // ct: formValues.Category.value ? formValues.Category.value : \"\",\n })\n } , [formValues.EUINNO.value, formValues.EUIN.value , formValues.Scheme.value , formValues.Category.value , formValues.Amount.value,formValues.Combo,formValues.comboDisclaimer]);\n const fetchFromstore = () => {\n console.log(\"store lumpsum\", props.lumpsum)\n const { Category, Scheme,Amount ,EUINNO , multiples , minimumAmount , EUIN , schemeList,Combo,comboDisclaimer,comboLabel} = props.lumpsum;\n if(!!props.lumpsum?.type && props.lumpsum.type !== \"lumpsum\") {\n return\n }\n const scheme = schemeList ? schemeList.find((item) => item.value === Scheme?.value?.value) : {};\n setFormValues({\n ...formValues,\n Category: { value: Category?.value },\n Scheme: { value: Scheme?.value },\n Amount: { value: Amount?.value || Amount},\n EUINNO: { value: EUINNO?.value ? EUINNO.value : \"no\" },\n multiples: multiples || 1,\n EUIN: EUIN?.value ? { value: EUIN.value } : { value: \"\" },\n schemeList: schemeList ? schemeList : [],\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 Combo:Combo,\n comboDisclaimer:!!comboDisclaimer?comboDisclaimer:\"\",\n comboLabel:!!comboLabel?comboLabel:\"\",\n });\n }\n const handleScheme = (label) => (event) => {\n const { schemeList } = formValues;\n if (label === \"Scheme\") {\n const scheme = schemeList.find((item) => item.value === event.value);\n props.storeLumpsum ({[label]:event,multiples:scheme.multiples})\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: false, comboDisclaimer: scheme.comboDisclaimer,comboLabel:scheme.comboLabel }\n : { comboDisclaimer: \"\",comboLabel:\"\" }\n\n ),\n });\n }\n if (label === \"EUIN\") {\n setFormValues({\n EUIN: { value: event },\n });\n }\n };\n const handleChange = (label) => (event) => {\n console.log(\"label,label\",label,event.target.value,formValues)\n const value = label !== \"Scheme\" ? event.target.value : event.value;\n props.storeLumpsum({ [label]: 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 Combo:false,\n comboDisclaimer:\"\",\n comboLabel:\"\"\n });\n break;\n case \"radioValue\": \n setFormValues({\n EUINNO : {value: formValues.EUINNO.value === \"no\" ? \"yes\" : \"no\"}\n })\n break;\n case \"Combo\": \n setFormValues({\n Combo : !formValues.Combo\n })\n break;\n case \"Amount\":\n 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 default:\n setFormValues({ [label]: { value } });\n }\n };\n const handleBlur = (label) => (event) => {\n const value = event.target.value;\n props.storeLumpsum({ [label]: value })\n }\n const closeModel = () => {\n props.history.push(\"/new-transaction\");\n };\n const gotoTransactionTypes = () => {\n props.history.push(\"/\");\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 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 {\n if (!!formValues.Combo) {\n if (window.confirm(\"You have opted to do a Purchase cum Switch. Do you want to proceed?\")) {\n } else {\n return;\n }\n }\n setIsLoading(true);\n const schemedetails = {\n category: formValues.Category.value,\n i_scheme: formValues.schemeValue,\n schemevalue : formValues.Scheme.value.label,\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 };\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_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: \"S\",\n CustomFund: \"176\",\n i_fund: \"176\",\n combo_flag:!!formValues.Combo?\"Y\":\"N\",\n };\n props.storeLumpsumDetails(paramsLumpsum)\n props.history.replace(\"/new-investor-transaction/confirmation\",{\n type:\"lumpsum\"\n });\n setIsLoading(false);\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 === \"combo\" ? (\n
\n )}\n {!!formValues.comboDisclaimer && (\n \n {!!formValues.comboDisclaimer && (\n \n \n {formValues.comboLabel}\n
\n \n \n ({\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 )\n : (\n <>\n \n {field.name === \"Scheme\"\n ? \"Scheme\"\n : (field.name === \"EUIN\" && formValues.EUINNO.value === \"no\")\n ? \"EUIN Declaration\" : (field.name === \"EUIN\" && formValues.EUINNO.value !== \"no\") ? \"\" : \"Do you want to intentionally leave the EUIN box blank?\"}\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\") && ((field.name !== \"EUIN\" || formValues.EUINNO.value === \"no\") ? (\n NO
\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 {field.name === \"Amount\" && (\n \n Minimum Amount : ₹ {formValues.minimumAmount}\n \n )}\n \n )}\n \n ))}\n \n ))}\n <>\n \n \n props.history.push(\"/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 lumpsum,\n } = newinvestor;\n return {\n schemeDetails,\n token,\n userId,\n euinList,\n fatcaDetails,\n applicantparams,\n investmentparams,\n nomineDetails,\n lumpsum,\n };\n },\n {\n getNewPurchaseFundList,\n validateSubBroker,\n submitLumpsumDetails,\n storeSchemeDetails,\n clearingFirstTimeInvestorJourney,\n storeLumpsum,\n storeLumpsumDetails,\n }\n)(Lumpsum);\n","import { Checkbox, MenuItem } from \"@material-ui/core\";\nimport Radio from \"@material-ui/core/Radio\";\nimport RadioGroup from \"@material-ui/core/RadioGroup\";\nimport FormControlLabel from \"@material-ui/core/FormControlLabel\";\nimport {\n KeyboardDatePicker,\n MuiPickersUtilsProvider,\n} from \"@material-ui/pickers\";\nimport { Termsandconditions } from \"./lib/Termsandconditions\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport React, { useEffect, useReducer, useState } from \"react\";\nimport CustomizedSelect from \"../customizedSelect\";\nimport { Input } from \"../../../forms/input\";\nimport CardComponent from \"./lib/CardComponent\";\nimport CustomizedDialogs from \"../../customModal\";\nimport { connect, useDispatch } from \"react-redux\";\nimport IntegrationReactSelect from \"../../../forms/autoCompleteInput\";\nimport { RadioButton } from \"./lib/Radiobutton\";\nimport {\n getNewPurchaseFundList,\n validateSubBroker,\n swpOptions,\n CalcSIPEnddt,\n storeSchemeDetails,\n getNav,\n getOtherSchemes,\n storeSchemeParams,\n submitSipDetails,\n clearingFirstTimeInvestorJourney,\n storeSipDetails,\n storeSip,\n getCheckPanKotm,\n getCheckPanAotm,\n\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/Loader\";\nimport { format } from \"date-fns\";\nimport { getStoredState } from \"redux-persist\";\nconst LummpsumSip = (props) => {\n const initialState = {\n Scheme: { value: \"\" },\n EUIN: { value: \"\" },\n Category: { value: \"\" },\n \"SIP Day\": { value: \"\" },\n Frequency: { 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 sipDateList: [],\n frequencyList: [],\n EUINNO: { value: \"no\" },\n CategoryList: [],\n planValue: \"\",\n optionValue: \"\",\n schemeValue: \"\",\n multiple: \"\",\n perpetualSip: false,\n umrnList: [],\n UMRN: { value: \"\" },\n\n \"Mode of Registration\": { value: \"\" },\n modeList: [],\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: \"Do you want to intentionally leave the EUIN box blank?\",\n type: \"radio\",\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 name: \"SIP Day\",\n type: \"select\",\n placeholder: \"Select SIP Day\",\n isMandatory: true,\n listName: \"sipDateList\",\n },\n ],\n [\n {\n name: \"Perpetual SIP\",\n type: \"Perpetual\",\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 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: true,\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 formValues[\"Mode of Registration\"].value === \"KOTM\" ||\n formValues[\"Mode of Registration\"].value === \"AOTM\"\n ? false\n : true,\n disabled: formValues.umrnList.length === 1 ? true : false,\n },\n ],\n\n ];\n const [dialog, setDialog] = useState({ open: false, appno: \"\" });\n const [isChecked, setIsChecked] = useState(false);\n const [isLoading, setIsLoading] = useState(false);\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: \"176\" };\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 handleChange = (label) => async (event) => {\n const value = event.target.value;\n console.log(\"label\",label,value)\n if (!value) {\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\n case \"SIP Day\":\n setFormValues({\n [label]: { value },\n \"SIP Period From\": { disabled: false ,value: \"\" },\n \"SIP Period To\": { disabled: false , value: \"\" },\n \"No of Installments\": { value: \"\" },\n });\n break;\n case \"radioValue\":\n setFormValues({\n EUINNO: { value: formValues.EUINNO.value === \"no\" ? \"yes\" : \"no\" },\n });\n break;\n case \"No of Installments\":\n if (\n !!value && formValues.Frequency.value !== \"Daily\" &&\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 } \n break;\n case \"Mode of Registration\":\n if (value === \"KOTM\") {\n fetchUMRNList(\"KOTM\");\n } else {\n setFormValues({\n UMRN: { value: \"\" },\n });\n }\n if (value === \"AOTM\") {\n fetchUMRNList(\"AOTM\");\n } else {\n setFormValues({\n UMRN: { value: \"\" },\n });\n }\n setFormValues({ [label]: { value } });\n break;\n \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 default:\n setFormValues({ [label]: { value } });\n break;\n }\n };\n\n const getSipDates = async (installments) => {\n const StartDate = formValues[\"SIP Day\"].value;\n const sipDateParams = {\n fund: \"176\",\n trtype: \"SIP\",\n StartDate,\n Installments: installments,\n Frequency: formValues.Frequency.value,\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 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 });\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 const validate = (label) => async (event) => {\n const selectedFrequency = formValues[\"Frequency\"].value;\n let startDate = new Date();\n let endDate = selectedFrequency == \"Daily\" ? new Date(`${startDate.getFullYear()}-12-31`) : new Date(\"2099-12-31\");\n let monthsDifference =\n (endDate.getFullYear() - startDate.getFullYear()) * 12 +\n (endDate.getMonth() - startDate.getMonth());\n let noofFrequency =\n selectedFrequency == \"Monthly\"\n ? monthsDifference - 1\n : selectedFrequency == \"Daily\"\n ? Math.floor((endDate-startDate) / (1000 * 60 * 60 * 24))\n : selectedFrequency == \"Weekly\"\n ? Math.floor((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 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 } else if (value && value > noofFrequency) {\n setFormValues({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: `No. of installments should not be more than the ${noofFrequency} installments`,\n }\n })\n return\n } else {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: \"176\",\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 setFormValues({\n sipDateList,\n MinimumInstallements: installment.min,\n perpetualSip: false,\n Frequency: { value },\n \"SIP Day\": { value: \"\" },\n \"SIP Period From\": { value: \"\" },\n \"SIP Period To\": { value: \"\" },\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: \"176\",\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 || 1,\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: \"176\",\n SubAgentCd: \"\",\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: \"176\",\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 fetchUMRNList = async (type) => {\n setIsLoading(true);\n\n const { AMC } = formValues;\n try {\n const params = {\n Fund: \"176\",\n PAN: props.applicantparams.i_pangno,\n Acno: 0,\n };\n const response =\n type === \"KOTM\"\n ? await props.getCheckPanKotm(params)\n : await props.getCheckPanAotm(params);\n const { Table1 } = response;\n const umrnList = Table1.map((item) => ({\n value: item,\n label: item.UMRNNO,\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 if (umrnList.length === 1) {\n setFormValues({ UMRN: { value: umrnList[0].value } });\n }\n setFormValues({ umrnList: umrnList });\n } catch (err) {\n setIsLoading(false);\n }\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: \"176\" };\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 setFrequencyList();\n fetchFromstore();\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 props.storeSip({\n ...formValues,\n type: \"SIP\",\n // ct: formValues.Category.value ? formValues.Category.value : \"\",\n })\n }, [SIP_Date, Frequency , formValues[\"No of Installments\"].value , formValues.Category.value , formValues.EUINNO.value, formValues.EUIN.value , formValues.Scheme.value , formValues.Category.value , formValues.Amount.value , formValues[\"SIP Period To\"].value , formValues[\"SIP Period From\"].value , formValues[\"Lumpsum Amount\"].value , formValues[\"Mode of Registration\"].value , formValues.perpetualSip , isChecked]);\n\n const fetchFromstore = async () => {\n if(!!props.sip?.Category) {\n console.log(\"store lumpsum\", props.sip)\n const { Category, Scheme,Amount ,radioValue , Frequency , EUIN , frequencyList , schemeList} = props.sip;\n setFormValues({\n ...formValues,\n // Category: { value: Category?.value },\n // Scheme: { value: Scheme?.value },\n // Amount: { value: Amount ? Amount : 0 },\n // EUIN: { value: EUIN?.value ? EUIN.value : \"\" },\n // radioValue: { value: radioValue ? radioValue : \"no\" },\n // frequencyList: frequencyList || [],\n // schemeList: schemeList || [],\n // \"SIP Period To\": { value: props.sip[\"SIP Period To\"] ? props.sip[\"SIP Period To\"]?.value : \"\" },\n // \"SIP Period From\": { value: props.sip[\"SIP Period From\"] ? props.sip[\"SIP Period From\"]?.value : \"\" },\n // \"No of Installments\": { value: props.sip[\"No of Installments\"] ? props.sip[\"No of Installments\"]?.value : \"\" },\n // \"SIP Day\": { value: props.sip[\"SIP Day\"]?.value ? props.sip[\"SIP Day\"]?.value : \"\" },\n // Frequency: { value: Frequency?.value },\n ...props.sip\n });\n if(!!props.sip.Category?.value) {\n try {\n setIsLoading(true);\n const schemeParams = {\n schtype: \"Regular\",\n category: Category.value,\n acno: \"0\",\n fundCode: \"176\",\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 || 1,\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 if(!!props.sip[\"SIP Day\"]?.value) {\n // const { frequencyList } = formValues;\n const installment = frequencyList.find((item) => item.value === Frequency.value);\n const frequencyParams = {\n opt: SIP_DAY,\n fund: \"176\",\n astscheme: Frequency.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 setFormValues({\n sipDateList,\n MinimumInstallements: installment.min,\n });\n return\n }\n }\n }\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 day = formValues[\"SIP Day\"].value;\n const formattedDay = day >= 1 && day <= 9 ? `0${day}` : day;\n const End_date = `${formattedDay}/12/2099`\n const End_dt = End_date.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 daysToNextYear = Math.ceil((new Date(new Date().getFullYear() + 1, new Date().getMonth(), new Date().getDate()) - new Date()) / (1000 * 60 * 60 * 24));\n let selectedFrequency = formValues[\"Frequency\"].value;\n let startDate = new Date();\n let EndDate =\n formValues[\"Mode of Registration\"].value === \"KOTM\" ||\n formValues[\"Mode of Registration\"].value === \"AOTM\"\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 && selectedFrequency !== \"Daily\") {\n setFormValues({\n perpetualSip: !perpetualSip,\n \"SIP Period To\": {\n value:\n formValues[\"Mode of Registration\"].value === \"KOTM\" || formValues[\"Mode of Registration\"].value === \"AOTM\"\n ? Umrn_endDate\n : endDate,\n },\n \"No of Installments\": {\n value: Math.floor(noofFrequency),\n },\n });\n } else if (!perpetualSip && selectedFrequency === \"Daily\") {\n const timestamp = parseInt(formValues[\"SIP Period From\"].value);\nconst startDate = new Date(timestamp);\n\nstartDate.setFullYear(startDate.getFullYear() + 1);\nstartDate.setDate(startDate.getDate() - 1);\n\nconst formattedDate = startDate.toLocaleDateString('en-IN', { month: '2-digit', day: '2-digit', year: 'numeric' });\nconst parts = formattedDate.split('/');\nconst conversion = `${parts[1]}/${parts[0]}/${parts[2]}`;\n\n setFormValues({\n perpetualSip: !perpetualSip,\n \"SIP Period To\": {\n value:conversion,\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 \n const gotoTransactionTypes = () => {\n props.history.push(\"/\");\n };\n const dispatch = useDispatch();\n\n const submit = async () => {\n const {\n schemeList,\n euinList,\n CategoryList,\n modeList,\n sipDateList,\n frequencyList,\n MinimumInstallements,\n umrnList,\n MinimumAmount,\n MinimumLumpsumAmount,\n planValue,\n optionValue,\n schemeValue,\n type,\n ct,\n perpetualSip,\n multiple,\n EUIN, \n ...others\n } = formValues;\n let d1, d2;\n console.log(\"formValues\",formValues)\n const split_enddate = format(\n formValues[\"SIP Period To\"].value,\n \"MM/dd/yyyy\"\n ).split(\"/\");\n const split_mandatedate =\n formValues[\"UMRN\"].value[\"MANDATE END DATE\"]?.split(\"/\");\n d1 = new Date(\n Number(split_enddate[2]),\n Number(split_enddate[0]) - 1,\n Number(split_enddate[1])\n );\n if (formValues[\"UMRN\"].value[\"MANDATE END DATE\"]?.split(\"/\")) {\n d2 = new Date(\n Number(split_mandatedate[2]),\n Number(split_mandatedate[1]) - 1,\n Number(split_mandatedate[0])\n );\n }\n const umrn = [\"UMRN\"];\n\n\n const noof = [\"No of Installments\"];\n const lumpsumAmount = [\"Lumpsum Amount\"]\n const values = Object.keys(others);\n const keys = formValues.perpetualSip\n ? values.filter((ele) => !noof.includes(ele))\n : values;\n const finalKeys = type!==\"Lumpsum + SIP\"\n ? values.filter((ele) => !lumpsumAmount.includes(ele))\n : values;\n const final_keys_for_validation =\n formValues[\"Mode of Registration\"].value === \"KOTM\" || formValues[\"Mode of Registration\"].value === \"AOTM\"\n ? finalKeys\n : finalKeys.filter((ele) => !umrn.includes(ele));\n\n const findError = final_keys_for_validation.every((key) => !!others[key].value);\n if (!findError) {\n keys.forEach((key) => {\n !others[key].value &&\n setFormValues({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: `${\n 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 isError: true,\n errorMessage: `Amount should be greater than or equal to Minimum Amount`,\n },\n });\n\n return;\n }else if (\n (formValues[\"Mode of Registration\"].value === \"KOTM\" ||\n formValues[\"Mode of Registration\"].value === \"AOTM\") &&\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 (d1 > d2 && formValues[\"UMRN\"]?.value) {\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 (+others[\"Amount\"].value > 1000000) {\n setFormValues({\n Amount: {\n ...others[\"Amount\"],\n isError: true,\n errorMessage: `Amount should be less than or equal to 1,000,000`,\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 (\n parseInt(others[\"Lumpsum Amount\"].value) <\n parseInt(formValues.MinimumLumpsumAmount)\n ) {\n setFormValues({\n \"Lumpsum Amount\": {\n ...others[\"Lumpsum Amount\"],\n isError: true,\n errorMessage: `Amount should be greater than or equal to Minimum Amount`,\n },\n });\n\n return;\n } else if (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 } \n else if (formValues.EUINNO.value === \"no\" && !EUIN.value) {\n setFormValues({\n EUIN: {\n value: \"\",\n isError: true,\n errorMessage: `Please select EUIN`,\n },\n });\n }\n else {\n setIsLoading(true);\n\n const schemedetails = {\n category: formValues.Category.value,\n schemevalue : formValues.Scheme.value.label,\n sipday:formValues[\"SIP Day\"].value,\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\" ? EUIN.value.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:\n 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\n\n };\n const paramsSip = {\n ...props.applicantparams,\n ...props.investmentparams,\n ...props.fatcaDetails,\n ...schemedetails,\n ...props.nomineDetails,\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: \"S\",\n CustomFund: \"176\",\n i_fund: \"176\",\n };\n props.storeSipDetails(paramsSip)\n props.history.replace(\"/new-investor-transaction/confirmation\",{\n type:\"sip\"\n });\n setIsLoading(false);\n\n }\n };\n return (\n <>\n \n {section.map((field) => (\n \n {field.type === \"select\" ? (\n <>\n \n {formValues[field.listName].map((i, index) => (\n \n {i.label}\n \n ))}\n \n \n { !!formValues.Frequency && field.name === \"Frequency\" &&\n formValues?.Frequency?.value === \"Weekly\" &&\n \"For 'weekly' frequency, the SIP start date will be on Wednesday falling on or after the cooling period (currently 30 days) from the date of transaction.\"}\n
\n \n ) : \n field.type === \"Searchselect\" || field.type === \"radio\" ? (\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 )\n : field.type === \"date\" ? (\n <>\n \n {field.name === \"Scheme\"\n ? \"Scheme\"\n : field.name === \"EUIN\" &&\n formValues.EUINNO.value === \"no\"\n ? \"EUIN Declaration\"\n : field.name === \"EUIN\" &&\n formValues.EUINNO.value !== \"n0\"\n ? \"\"\n : \"Do you want to intentionally leave the EUIN box blank?\"}\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 {\" \"}\n {formValues[field.name].errorMessage}\n
\n )}\n \n {!!formValues[\"No of Installments\"].value && (\n \n \n Perpetual SIP\n
\n \n )}\n \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 &&\n field.name === \"UMRN\" &&\n formValues?.umrnList.length === 1 && (\n \n The investor has only one active mandate.\n \n )}\n\n \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 {formValues[\"UMRN\"].value\n ? formValues[\"UMRN\"].value.Amt\n : \"\"}\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\n ? formValues[\"UMRN\"].value[\"BANK NAME\"]\n : \"\"}\n
{\" \"}\n \n {formValues[\"UMRN\"].value\n ? formValues[\"UMRN\"].value[\"BANK A/C NO\"]\n : \"\"}\n
\n \n \n props.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 sip\n } = newinvestor;\n return {\n token,\n userId,\n euinList,\n schemeparams,\n schemeDetails,\n applicantparams,\n investmentparams,\n fatcaDetails,\n nomineDetails,\n sip\n };\n },\n {\n getNewPurchaseFundList,\n validateSubBroker,\n swpOptions,\n getCheckPanKotm,\n getCheckPanAotm,\n CalcSIPEnddt,\n submitSipDetails,\n storeSchemeDetails,\n storeSchemeParams,\n getOtherSchemes,\n getNav,\n clearingFirstTimeInvestorJourney,\n storeSipDetails,\n storeSip\n }\n)(LummpsumSip);\n","import React, { useEffect, useState } from \"react\";\nimport Lumpsum from \"./Lumpsum\";\nimport LumpsumSip from \"./LumpsumSip\";\nimport {\n getNewPurchaseFundList,\n storeSchemeDetails,\n storeSchemeDetailsClick,\n storeSchemeDetailsScheme,\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 const {schemeDetailsScheme} = props;\n useEffect(() => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n // console.log(props)\n setScheme((schemeDetailsScheme || \"Lumpsum\"))\n props.storeSchemeDetailsClick(true);\n }, []);\n return (\n <>\n \n \n Mode of Transaction *\n \n \n { \n const selectedValue = e.target.value;\n setScheme(selectedValue);\n props.storeSchemeDetailsScheme(selectedValue);\n }}\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 } from \"react-redux\";\nimport { 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 getCountriesList,\n getStatesList,\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n getCitiesList as getCitiesByState,\n getRelationShipList,\n storePan,\n changeInMode,\n checkPAN,\n} from \"shared/store/actions\";\nimport {\n getFieldsFromMap,\n getFieldList,\n $wait,\n checkIfMinor,\n} from \"./lib/utils\";\n\nimport CardComponent from \"./lib/CardComponent\";\nimport CustomLoader from \"../../../forms/Loader\";\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} from \".\";\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 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 the First Joint Holder should not be same as PAN 1\";\n const id = document.getElementById(\"pan_2Field\");\n id.focus();\n } else if (secondPan.length > 3 && secondPan[3] !== \"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 = \"PAN of the Second Joint Holder should not be same as PAN 1\";\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 Second Joint Holder should not be same as First Joint 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\",\n isRequired: true,\n placeholder: \"Enter Name\",\n validate: nameRegex,\n },\n dob: {\n name: \"Date of Birth (As per PAN)\",\n type: \"date\",\n isRequired: true,\n },\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 category: {\n name: \"Category\",\n type: \"select\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n options: categoryOptions,\n },\n countrycode: {\n name: \"Country Code\",\n validate: countryCodeRegex,\n isRequired: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter Country Code\",\n default: \"+91\",\n type: \"countrycode\",\n },\n mobileFamily: {\n name: \"Mobile Family Description\",\n type: \"select\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n default: \"SE\",\n options: familyDescriptionOptions,\n },\n mobile: {\n name: \"Mobile Number\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter Mobile Number\",\n validate: mobileRegex,\n },\n guardianname: {\n name: \"Guardian Name\",\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 guardiandob: {\n name: \"Guardian Date of Birth\",\n type: \"date\",\n isRequired: true,\n hidden: true,\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: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter Address\",\n hidden: true,\n },\n address2: {\n name: \"Address2\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter Address\",\n hidden: true,\n },\n city: {\n name: \"City\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter City\",\n validate: nameRegex,\n hidden: true,\n },\n state: {\n name: \"State\",\n isRequired: investortype.investorType === \"minor\" ? false : true,\n placeholder: \"Enter State\",\n validate: nameRegex,\n hidden: true,\n },\n country: {\n name: \"Country\",\n isRequired: investortype.investorType === \"minor\" ? false : 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 const pan2 = formValues[`pan_${i}`];\n const panNotFilled = !pan2 || errors[`pan_${i}`];\n if (k === \"pan\") {\n field.name =\n i === 2 ? \"PAN of Joint Holder 1\" : \"PAN of Joint 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 \"guardiandob\",\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 isMinorInvestor = investortype.investorType == \"minor\"\n const currentDate = new Date();\n const minAgeDate = new Date();\n minAgeDate.setFullYear(currentDate.getFullYear() - 18); \n const formattedDate = new Date(`${minAgeDate.getMonth() + 1}/${minAgeDate.getDate()}/${minAgeDate.getFullYear()}`);\n\n\n\n\n \n const validate = field.validate;\n let isValid = true;\n let forDifferentMessage1 = true;\n let forDifferentMessage2 = 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 (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(\".\");\n }\n if (isValid && field.key === \"countrycode_1\" && formValues.category_1===\"20\" && value === \"+91\") {\n isValid=false;\n }\n } else if (typeof validate == \"object\" && !!value) {\n const validationRegex = validate;\n isValid = validationRegex.test(value);\n }\n if (field.name===\"Minor PAN\" && value.length===10 && value.charAt(3)!=='P') {\n isValid=false;\n } \n if(field.name===\"Guardian Date of Birth\" && isMinorInvestor){\n const enteredDateObj = new Date(value);\n if (enteredDateObj > formattedDate) {\n isValid=false;\n }\n } \n if(field.name===\"Date of Birth (As per PAN)\" && !isMinorInvestor){\n const enteredDateObj = new Date(value);\n if (enteredDateObj > formattedDate) {\n isValid=false;\n }\n } \n if (field.name===\"Date of Birth (As per PAN)\" && isMinorInvestor) {\n const enteredDateObj = new Date(value);\n if (enteredDateObj > currentDate || enteredDateObj < formattedDate) {\n isValid = false;\n }\n }\n if (\n (field.key === \"guardianpan_1\" && formValues.pan_1 === value) ||\n (field.key === \"pan_1\" && formValues.guardianpan_1 === value)\n ) {\n forDifferentMessage1 = false;\n errorMessage = `Minor PAN and Guardian PAN should not be the same`;\n }\n if (\n (field.key === \"guardianname_1\" && formValues.name_1 === value) ||\n (field.key === \"name_1\" && formValues.guardianname_1 === value)\n ) {\n forDifferentMessage2 = false;\n errorMessage = `Minor Name and Guardian Name should not be the same`;\n }\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 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 setIsLoading(true);\n const { pan } = state;\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 let validDate=\"\"\n if(!!dob){\n const currentDate = new Date();\n let minYear = currentDate.getFullYear() - 18;\n const dateValue = format(new Date(parseInt(dob.substr(6))), \"MM/dd/yyyy\");\n const splitdate = dateValue.split(\"/\");\n const year = splitdate[2];\n validDate = (investortype.investorType !== \"minor\" && year <= minYear) ? dateValue : (investortype.investorType === \"minor\" && year <= minYear) ? \"\" : dateValue;\n }\n const kycFormValues = {\n name_1: name1,\n pan_1: pan,\n dob_1: !!validDate?validDate:\"\",\n email_1: email,\n gender_1: gender,\n mobile_1: mobile.trim(),\n category_1: app_cat === \"22\" ? \"20\" : app_cat,\n status_1: +app_cat === 11 ? \"I\" : +app_cat > 20 ? \"N\" : \"\",\n };\n\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: false,\n };\n });\n } catch (err) {\n setFormValues((prev) => {\n return {\n ...prev,\n pan_1: pan,\n };\n });\n const response = await props.checkKyc({\n fund: \"176\",\n userid: props.userId,\n i_pan: pan,\n });\n const {\n DtData: [info],\n } = response;\n if(!!response?.DtData?.[0]?.invname){\n setFormValues((prev) => {\n return {\n ...prev,\n [`name_1`]: response?.DtData?.[0]?.invname,\n };\n });\n setDisabledFields((prev) => {\n return {\n ...prev,\n [`name_1`]: false,\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(\n NEW_TRANSACTION_URL + `/new-investor/ekyc/${formValues.pan_2}`\n );\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 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_guadianmobile,\n i_guardianemail,\n i_guardianEmailFlag,\n i_guardianMobileFlag,\n i_guardianrelationship,\n i_guardiandob,\n } = applicantparams;\n if (!!props.applicantparams.i_fname) {\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 [`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 [`guardiandob_1`]: i_guardiandob,\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 setInvestorType({\n investorType: typeofinvestor === \"M\" ? \"minor\" : \"individual\",\n });\n }\n setDisabledFields((prev) => {\n return {\n ...prev,\n pan_1: true,\n name_1:false,\n name_2: !!props.applicantparams.i_jholder1 || !!formValues.name_2 !== \"\",\n name_3: !!props.applicantparams.i_jholder2 || !!formValues.name_3 !== \"\",\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 [\"guardiandob_1\"]: formValues.dob_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 name_1:false ,\n pan_1:\n e.target.value === \"individual\" && formValues.pan_1.length === 10\n ? true\n : false,\n };\n });\n };\n const submit = async () => {\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) => !!category ? getStatus(category) : \"\";\n\n try {\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: formValues.fund_1,\n scheme: \"\",\n plan: \"\",\n guardianPan: formValues.guardianpan_1,\n guardianPanDOB: !!formValues.guardiandob_1\n ? convertDateFormat(formValues.guardiandob_1)\n : formValues.guardiandob_1,\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 };\n const panCheckResponse = await props.checkPAN(payload);\n validateResponse(panCheckResponse);\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_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: 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 guard_dob: formValues.guardiandob_1,\n i_guardianpan: formValues.guardianpan_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: \"/new-investor-transaction/fatca-details\",\n state: { formValues: formValues },\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 } else {\n setIsLoading(false);\n }\n } catch (error) {\n setIsLoading(false);\n alert(error.message);\n }\n\n // End of Sumbit, thank you, visit again.\n function validateResponse(response) {\n setIsLoading(false);\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 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 Joint Holder 1 name does not match with PAN record\"\n );\n }\n if (response.JH2_PANNameMatch === \"N\") {\n throw new Error(\n \"Entered Joint Holder 2 name name does not match with PAN record\"\n );\n }\n if (response.G_PANNameMatch === \"N\") {\n throw new Error(\n \"Entered Guardian name does not match with PAN record\"\n );\n }\n if (response.PanDOBMatch === \"N\") {\n throw new Error(\"Entered Primary DOB does not match with PAN record\");\n }\n if (response.JH1_PanDOBMatch === \"N\") {\n throw new Error(\n \"Entered Joint Holder 1 DOB does not match with PAN record\"\n );\n }\n if (response.JH2_PanDOBMatch === \"N\") {\n throw new Error(\n \"Entered Joint 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\nconst convertDateFormat = (originalDate) => {\n const [month, day, year] = originalDate.split(\"/\");\n\n const convertedDate = `${day}/${month}/${year}`;\n\n return convertedDate;\n};\n\n const setFieldValue = (field_key, value) => {\n setFormValues((values) => ({\n ...values,\n [field_key]: value,\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 if(field.type === 'date' && isNaN(Date.parse(e))) {\n setErrors(errors => ({\n ...errors,\n [field.key]: 'Please enter valid date'\n }))\n return;\n }\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 const countryCodeKey = field.key.replace(\"category\", \"countrycode\");\n setFieldValue(countryCodeKey, countryCode);\n }\n if (field.key.includes(\"pan\") && value !== \"\" && (props.nomineDetails?.i_nompan1 === value || props.nomineDetails?.i_nompan2 === value || props.nomineDetails?.i_nompan3 === value ) ) {\n alert(\"Investor and Nominee PAN cannot be same\")\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 parts = e.target.value.split('/')\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: \"176\",\n userid: props.userId,\n i_pan: value,\n });\n const {\n DtData: [info],\n } = response;\n if(!!response?.DtData?.[0]?.invname){\n setFormValues((prev) => {\n return {\n ...prev,\n [`name_${n}`]: response?.DtData?.[0]?.invname,\n };\n });\n setDisabledFields((prev) => {\n return {\n ...prev,\n [`name_${n}`]: false,\n };\n });\n }\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 let validDate=\"\"\n if(!!dob && investortype.investorType !== \"minor\"){\n const currentDate =new Date()\n let minYear = currentDate.getFullYear() - 18\n const dateValue = format(new Date(parseInt(dob.substr(6))), \"MM/dd/yyyy\")\n const splitdate = dateValue.split(\"/\")\n const year = splitdate[2]\n if(year>minYear){\n validDate=\"\" \n } else {\n validDate=dateValue\n }\n } else {\n const currentDate =new Date()\n let minYear = currentDate.getFullYear() - 18\n const dateValue = format(new Date(parseInt(dob.substr(6))), \"MM/dd/yyyy\")\n const splitdate = dateValue.split(\"/\")\n const year = splitdate[2]\n if(year>minYear){\n validDate=dateValue\n } else {\n validDate=\"\"\n }\n }\n const kycFormValues = {\n [`name_${n}`]: name1,\n [`pan_${n}`]: app_pangno,\n [`dob_${n}`]: validDate,\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 if(kycDetails.Dtinformation[0]?.Error_Message !== \"No Data Found\"){\n setFormValues((prev) => {\n return {\n ...prev,\n ...kycFormValues,\n };\n });\n }\n setDisabledFields((prev) => {\n return {\n ...prev,\n [`kycCompleted_${n}`]: true,\n [`status_${n}`]: true,\n [`name_${n}`]: false,\n };\n });\n } catch (error) {\n setFormValues((prev) => {\n return {\n ...prev,\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 \n return (\n console.log(\"formValues\", formValues),\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 props.changeInMode(true)\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 Back\n \n \n Proceed\n \n
\n \n );\n};\n\nexport default connect(\n ({ newinvestor,authReducer }) => {\n const { applicantparams, nomineDetails } = newinvestor;\n const { userId} = authReducer\n return {\n applicantparams,\n nomineDetails,\n userId\n };\n },\n {\n getCountriesList,\n getStatesList,\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n getCitiesByState,\n getRelationShipList,\n storePan,\n changeInMode,\n checkPAN,\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}\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 { $wait, checkIfMinor } from \"./lib/utils\";\nimport CustomLoader from \"../../../forms/Loader\";\nimport {\n getCountriesList,\n storeNomineeDetails,\n storeNonomineeDetails,\n getStatesList,\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n getCitiesList as getCitiesByState,\n getRelationShipList,\n getNomineeDetails,\n} from \"shared/store/actions\";\nimport { format } from \"date-fns\";\n\nimport DateFnsUtils from \"@date-io/date-fns\";\n\nconst NomineeDetails = (props) => {\n const first_nominee_details = {\n name: { value: \"\" },\n pan: { value: \"\" },\n relationship: { value: \"\" },\n otherrelationship: { value: \"\" },\n dob: { value: null },\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 guardianname: { value: \"\" },\n guardianpan: { 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: null },\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 guardianname: { value: \"\" },\n guardianpan: { 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: null },\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 guardianname: { value: \"\" },\n guardianpan: { value: \"\" },\n gaurdianrelationship: { value: \"\" },\n };\n const [isLoading, setIsLoading] = useState(false);\n const [NomineeListShow, setIsNomineeListShow] = useState(true);\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({ nom1 : false, nom2: false, nom3: 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 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 = async (nom) => {\n setsame_as_first_appicant_address({\n ...same_as_first_appicant_address,\n [nom]: !same_as_first_appicant_address[nom],\n });\n if (same_as_first_appicant_address.nom == false) {\n await prefillFormValues();\n if(nom === \"nom1\") {\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 }\n if(nom === \"nom2\") {\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 if(nom === \"nom3\") {\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 }\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\" },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n percentage: { value: \"33\" },\n });\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n percentage: { value: \"34\" },\n });\n setIsLoading(false);\n }\n };\n useEffect(() => {\n firstRender();\n setnominate_yes_or_no(props.noNominee);\n }, []);\n const firstRender = async () => {\n await getLists();\n // await prefillFormValues();\n checkReduxStore();\n };\n useEffect(() => {\n nomineelist();\n }, [nomineeList.length === 0]);\n const nomineelist = async () => {\n await NomineeDetails();\n };\n const checkReduxStore = () => {\n 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 i_sameaddress1,\n i_sameaddress2,\n i_sameaddress3,\n } = nomineDetails;\n setnominate_yes_or_no(props.noNominee);\n console.log(\"nominee\", props);\n setnominee_list(\n !!i_nominee3 ? \"3\" : !!i_nominee2 ? \"2\" : !!i_nominee ? \"1\" : \"\"\n );\n setsame_as_first_appicant_address({ nom1 : !!i_sameaddress1 , nom2 : !!i_sameaddress2, nom3 : !!i_sameaddress3 });\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\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 guardianname: { value: i_nomguardianname1 },\n guardianpan: { 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 guardianname: { value: i_nomguardianname2 },\n guardianpan: { 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 guardianname: { value: i_nomguardianname3 },\n guardianpan: { 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 nomineeList.push({ label: \"Add New Nominee\", value: \"Add New Nominee\" });\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 if (isNaN(Date.parse(event))) {\n if (label === \"dob1\") {\n setfirst_nomineeDetails((form) => ({\n ...form,\n dob: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid date of birth\",\n },\n }));\n } else if (label === \"dob2\") {\n setsecond_nomineeDetails((form) => ({\n ...form,\n dob: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid date of birth\",\n },\n }));\n } else if (label === \"dob3\") {\n setthird_nomineeDetails((form) => ({\n ...form,\n dob: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid date of birth\",\n },\n }));\n }\n return;\n } else if (new Date(event) > new Date()) {\n if (label === \"dob1\") {\n setfirst_nomineeDetails((form) => ({\n ...form,\n dob: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid date of birth\",\n },\n }));\n } else if (label === \"dob2\") {\n setsecond_nomineeDetails((form) => ({\n ...form,\n dob: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid date of birth\",\n },\n }));\n } else if (label === \"dob3\") {\n setthird_nomineeDetails((form) => ({\n ...form,\n dob: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid date of birth\",\n },\n }));\n }\n return;\n }\n const dobarr = [\n { dob: third_nomineeDetails.dob.value },\n { dob: second_nomineeDetails.dob.value },\n { dob: first_nomineeDetails.dob.value },\n ];\n const value = format(new Date(event), \"MM/dd/yyyy\");\n\n const search = dobarr.find((ele) => !!ele.dob && ele.dob === value);\n const oneday = 86400000;\n const today = new Date();\n const datevalue = new Date(value);\n if (isNaN(Date.parse(event))) {\n alert(\"enter\");\n }\n if (label == \"dob1\") {\n if (!!search) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n dob: { value: \"\" },\n });\n alert(\"Nominee Date of Birth cannot be same\");\n return;\n }\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 if (!!search) {\n setfirst_nomineeDetails({\n ...second_nomineeDetails,\n dob: { value: \"\" },\n });\n alert(\"Nominee Date of Birth cannot be same\");\n return;\n }\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 if (!!search) {\n setfirst_nomineeDetails({\n ...third_nomineeDetails,\n dob: { value: \"\" },\n });\n alert(\"Nominee Date of Birth cannot be same\");\n return;\n }\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\") {\n if (RemovingTheNomineeMember.value === \"Add New Nominee\") {\n setfirst_nomineeDetails({ ...first_nominee_details , name : { value: \"\" }});\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected1: event.target.value,\n });\n return;\n }\n if (\n (RemovingTheNomineeMember.value !== \"Add New Nominee\" &&\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\") {\n if (\n label === \"nominee1\" &&\n RemovingTheNomineeMember.value === \"Add New Nominee\"\n ) {\n setfirst_nomineeDetails({ ...first_nominee_details });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected1: event.target.value,\n });\n return;\n }\n if (\n label === \"nominee2\" &&\n RemovingTheNomineeMember.value === \"Add New Nominee\"\n ) {\n setsecond_nomineeDetails({ ...second_nominee_details });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected2: event.target.value,\n });\n return;\n }\n if (\n (RemovingTheNomineeMember.value !== \"Add New Nominee\" &&\n RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected1) ||\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\") {\n if (label == \"nominee1\" && RemovingTheNomineeMember.value === \"Add New Nominee\") {\n setfirst_nomineeDetails({ ...first_nominee_details });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected1: event.target.value,\n });\n return;\n }\n if (label == \"nominee2\" && RemovingTheNomineeMember.value === \"Add New Nominee\") {\n setsecond_nomineeDetails({ ...second_nominee_details });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected2: event.target.value,\n });\n return;\n }\n if (label == \"nominee3\" && RemovingTheNomineeMember.value === \"Add New Nominee\") {\n setthird_nomineeDetails({ ...third_nominee_details });\n setnomineeSelected({\n ...nominees_selected,\n nominee_selected3: event.target.value,\n });\n return;\n }\n if (\n label == \"nominee1\" &&\n RemovingTheNomineeMember.value !== \"Add New Nominee\" &&\n ( RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected3 ||\n RemovingTheNomineeMember.value === nominees_selected.nominee_selected2 )\n ) {\n alert(\"Already this nominee has been selected\");\n return;\n }\n\n if (\n label == \"nominee2\" &&\n RemovingTheNomineeMember.value !== \"Add New Nominee\" &&\n (RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected3 ||\n RemovingTheNomineeMember.value === nominees_selected.nominee_selected1)\n ) {\n alert(\"Already this nominee has been selected\");\n return;\n }\n\n if (\n (label == \"nominee3\" &&\n RemovingTheNomineeMember.value !== \"Add New Nominee\" &&\n RemovingTheNomineeMember.value ===\n nominees_selected.nominee_selected2) ||\n RemovingTheNomineeMember.value === nominees_selected.nominee_selected1\n ) {\n alert(\"Already this nominee has been selected\");\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 }\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 }\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 }\n };\n const showError = (label) => (event) => {\n const regpan = /^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/;\n if (\n label === \"firstNomineePan\" &&\n event.target.value.charAt(3) !== \"P\" &&\n event.target.value.length === 10\n ) {\n alert(\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\"\n );\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"firstNomineePan\" &&\n !regpan.test(event.target.value) &&\n event.target.value.length === 10\n ) {\n alert(\"Enter valid pan\");\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"secondNomineePan\" &&\n event.target.value.charAt(3) !== \"P\" &&\n event.target.value.length === 10\n ) {\n alert(\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\"\n );\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"secondNomineePan\" &&\n !regpan.test(event.target.value) &&\n event.target.value.length === 10\n ) {\n alert(\"Enter valid pan\");\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"thirdNomineePan\" &&\n event.target.value.charAt(3) !== \"P\" &&\n event.target.value.length === 10\n ) {\n alert(\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\"\n );\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"thirdNomineePan\" &&\n !regpan.test(event.target.value) &&\n event.target.value.length === 10\n ) {\n alert(\"Enter valid pan\");\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n pan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"firstNomineeGuardianPan\" &&\n event.target.value.charAt(3) !== \"P\" &&\n event.target.value.length === 10\n ) {\n alert(\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\"\n );\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n guardianpan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"firstNomineeGuardianPan\" &&\n !regpan.test(event.target.value) &&\n event.target.value.length === 10\n ) {\n alert(\"Enter valid pan\");\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n guardianpan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"secondNomineeGuardianPan\" &&\n event.target.value.charAt(3) !== \"P\" &&\n event.target.value.length === 10\n ) {\n alert(\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\"\n );\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n guardianpan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"secondNomineeGuardianPan\" &&\n !regpan.test(event.target.value) &&\n event.target.value.length === 10\n ) {\n alert(\"Enter valid pan\");\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n guardianpan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"thirdNomineeGuardianPan\" &&\n event.target.value.charAt(3) !== \"P\" &&\n event.target.value.length === 10\n ) {\n alert(\n \"Entered PAN Number is not related to Individual PAN Number, So please Enter Individual PAN Number\"\n );\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n guardianpan: { value: \"\" },\n });\n return;\n }\n if (\n label === \"thirdNomineeGuardianPan\" &&\n !regpan.test(event.target.value) &&\n event.target.value.length === 10\n ) {\n alert(\"Enter valid pan\");\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n guardianpan: { value: \"\" },\n });\n return;\n }\n };\n\n const handlePanChange = (details, setDetails, value,label) => {\n const primaryPans = [\n { pan: props.applicantparams.i_pangno },\n ];\n const investorGuardianPan=[\n { pan: props?.applicantparams?.i_guardianpan },\n ]\n const jointHolderPans = [\n { pan: props.applicantparams.i_pangno2 },\n { pan: props.applicantparams.i_pangno3 },\n ];\n \n const nomnieePans = [\n { pan: first_nomineeDetails.pan.value },\n { pan: second_nomineeDetails.pan.value },\n { pan: third_nomineeDetails.pan.value },\n ];\n const gaurdianPans = [\n { pan: first_nomineeDetails.guardianpan.value },\n { pan: second_nomineeDetails.guardianpan.value },\n { pan: third_nomineeDetails.guardianpan.value },\n ];\n \n if (value.length <= 10) {\n let errorMessage = \"\";\n if(label===\"guardianpan\"){\n if (nomnieePans.some((ele) => !!ele.pan && ele.pan === value)) {\n errorMessage = \"Entered PAN cannot be same as other Nominee PAN\";\n }\n if (primaryPans.some((ele) => !!ele.pan && ele.pan === value)) {\n errorMessage = `Entered PAN cannot be same as ${!!props?.applicantparams?.i_guardianpan?.length?\"Minor pan\":\"Primary Holder pan\"}`;\n }\n if (investorGuardianPan.some((ele) => !!ele.pan && ele.pan === value && !!props?.applicantparams?.i_guardianpan?.length)) {\n errorMessage = `Entered PAN cannot be same as Primary Guardian pan`;\n }\n } else {\n if (investorGuardianPan.some((ele) => !!ele.pan && ele.pan === value && !!props?.applicantparams?.i_guardianpan?.length)) {\n errorMessage = `Entered PAN cannot be same as Primary Guardian pan`;\n }\n if (primaryPans.some((ele) => !!ele.pan && ele.pan === value)) {\n errorMessage = \"Entered PAN cannot be same as Primary Holder PAN\";\n } else if (jointHolderPans.some((ele) => !!ele.pan && ele.pan === value)) {\n errorMessage = \"Entered PAN cannot be same as Joint Holders PAN\";\n }else if (nomnieePans.some((ele) => !!ele.pan && ele.pan === value)) {\n errorMessage = \"Entered PAN cannot be same as other Nominee PAN\";\n } else if (gaurdianPans.some((ele) => !!ele.pan && ele.pan === value)) {\n errorMessage = \"Entered PAN cannot be same as other Guardian PAN\";\n }\n }\n \n if (errorMessage) {\n alert(errorMessage);\n if(label===\"pan\"){\n setDetails({\n ...details,\n pan: { value: \"\" },\n });\n } else {\n setDetails({\n ...details,\n guardianpan: { value: \"\" },\n });\n }\n return;\n }\n if(label===\"pan\"){\n setDetails({\n ...details,\n pan: { value: value },\n });\n } else {\n setDetails({\n ...details,\n guardianpan: { value: value },\n });\n }\n }\n };\n \n const handleChangePan = (label) => (event) => {\n const value = event.target.value.toUpperCase();\n switch (label) {\n case \"firstNomineePan\":\n handlePanChange(first_nomineeDetails, setfirst_nomineeDetails, value,\"pan\");\n break;\n case \"secondNomineePan\":\n handlePanChange(second_nomineeDetails, setsecond_nomineeDetails, value,\"pan\");\n break;\n case \"thirdNomineePan\":\n handlePanChange(third_nomineeDetails, setthird_nomineeDetails, value,\"pan\");\n break;\n case \"firstNomineeGuardianPan\":\n handlePanChange(first_nomineeDetails, setfirst_nomineeDetails, value,\"guardianpan\");\n break;\n case \"secondNomineeGuardianPan\":\n handlePanChange(second_nomineeDetails, setsecond_nomineeDetails, value,\"guardianpan\");\n break;\n case \"thirdNomineeGuardianPan\":\n handlePanChange(third_nomineeDetails, setthird_nomineeDetails, value,\"guardianpan\");\n break;\n default:\n break;\n }\n };\n const handleName = (label) => (event) => {\n const value = event.target.value;\n switch (label) {\n case \"nominee1\":\n handleNameChange(first_nomineeDetails, setfirst_nomineeDetails, value,\"name\");\n break;\n case \"nominee2\":\n handleNameChange(second_nomineeDetails, setsecond_nomineeDetails, value,\"name\");\n break;\n case \"nominee3\":\n handleNameChange(third_nomineeDetails, setthird_nomineeDetails, value,\"name\");\n break;\n case \"guardianname1\":\n handleNameChange(first_nomineeDetails, setfirst_nomineeDetails, value,\"guardianname\");\n break;\n case \"guardianname2\":\n handleNameChange(second_nomineeDetails, setsecond_nomineeDetails, value,\"guardianname\");\n break;\n case \"guardianname3\":\n handleNameChange(third_nomineeDetails, setthird_nomineeDetails, value,\"guardianname\");\n break;\n default:\n break;\n }\n };\n const handleNameChange = (details, setDetails, value,label) => {\n const primaryName = [\n { name: props.applicantparams.i_fname },\n ];\n const investorGuardianName=[\n { name: props?.applicantparams?.i_guardianname },\n ]\n const jointHolderNames = [\n { name: props.applicantparams.i_pangno2 },\n { name: props.applicantparams.i_pangno3 },\n ];\n \n const nomnieeNames = [\n { name: first_nomineeDetails.name.value },\n { name: second_nomineeDetails.name.value },\n { name: third_nomineeDetails.name.value },\n ];\n const guardianNames = [\n { name: first_nomineeDetails.guardianname.value },\n { name: second_nomineeDetails.guardianname.value },\n { name: third_nomineeDetails.guardianname.value },\n ];\n let errorMessage = \"\"; \n \n if (primaryName.some((ele) => !!ele.name && ele.name === value)) {\n errorMessage = \"Entered Name cannot be same as Primary Holder Name\";\n } else if (investorGuardianName.some((ele) => !!ele.name && ele.name === value)) {\n errorMessage = \"Entered Name cannot be same as Guardian Name\";\n } else if (nomnieeNames.some((ele) => !!ele.name && ele.name === value)) {\n errorMessage = \"Entered Name cannot be same as other Nominee Name\";\n } else if (guardianNames.some((ele) => !!ele.name && ele.name === value)) {\n errorMessage = \"Entered Name cannot be same as other Guardian Name\";\n }\n \n if (errorMessage) {\n alert(errorMessage);\n if(label===\"name\"){\n setDetails({\n ...details,\n name: { value: \"\" },\n });\n } else {\n setDetails({\n ...details,\n guardianname: { value: \"\" },\n });\n }\n return;\n }\n if(label===\"name\"){\n setDetails({\n ...details,\n name: { value: value },\n });\n } else {\n setDetails({\n ...details,\n guardianname: { value: value },\n });\n }\n };\n \n const handleState = (label) => (event) => {\n if (/^[a-zA-Z ]*$/.test(event.target.value) && label === \"firstState\") {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n state: { value: event.target.value },\n });\n }\n if (/^[a-zA-Z ]*$/.test(event.target.value) && label === \"secondState\") {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n state: { value: event.target.value },\n });\n }\n if (/^[a-zA-Z ]*$/.test(event.target.value) && label === \"thirdState\") {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n state: { value: event.target.value },\n });\n }\n };\n const handleCity = (label) => (event) => {\n if (/^[a-zA-Z ]*$/.test(event.target.value) && label === \"firstCity\") {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n city: { value: event.target.value },\n });\n }\n if (/^[a-zA-Z ]*$/.test(event.target.value) && label === \"secondCity\") {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n city: { value: event.target.value },\n });\n }\n if (/^[a-zA-Z ]*$/.test(event.target.value) && label === \"thirdCity\") {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n city: { value: event.target.value },\n });\n }\n };\n const handlePercentage = (label) => (event) => {\n const value = event.target.value.replace(/[^\\d]/g, \"\");\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 setfirst_nomineeDetails({\n ...first_nomineeDetails,\n percentage:\n label === \"first\"\n ? { value: value }\n : { value: Math.abs(value - 100) / 2 },\n });\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n percentage:\n label === \"second\"\n ? { value: value }\n : { value: Math.abs(value - 100) / 2 },\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 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 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(\n // (ele) => !!ele.name && ele.name.toLowerCase() === value.toLowerCase()\n // );\n // if (!!search) {\n // setfirst_nomineeDetails({\n // ...first_nomineeDetails,\n // name: { value: \"\" },\n // });\n // alert(\"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(\n // (ele) => !!ele.name && ele.name.toLowerCase() === value.toLowerCase()\n // );\n // if (!!search) {\n // setsecond_nomineeDetails({\n // ...second_nomineeDetails,\n // name: { value: \"\" },\n // });\n // alert(\"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(\n // (ele) => !!ele.name && ele.name.toLowerCase() === value.toLowerCase()\n // );\n // if (!!search) {\n // setthird_nomineeDetails({\n // ...third_nomineeDetails,\n // name: { value: \"\" },\n // });\n // alert(\"Nominee Names cannot be same\");\n // return;\n // }\n // setthird_nomineeDetails({\n // ...third_nomineeDetails,\n // name: { value: value },\n // });\n // }\n // };\n const submit = async () => {\n if (!nominate_yes_or_no) {\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.dob.value) {\n // setfirst_nomineeDetails({\n // ...first_nomineeDetails,\n // dob: {\n // value: \"\",\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.guardianname.value == \"\"\n ) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n guardianname: {\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.guardianpan.value)\n ) {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n guardianpan: {\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 (\n 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: first_nomineeDetails.email.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.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.dob.value) {\n // setsecond_nomineeDetails({\n // ...second_nomineeDetails,\n // dob: {\n // value: \"\",\n // isError: true,\n // errorMessage: \"Select the Date of Birth\",\n // },\n // });\n // return;\n // }\n if (\n !!nominee_dateofbirth.second_nominee_dateofbirth &&\n second_nomineeDetails.guardianname.value == \"\"\n ) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n guardianname: {\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.guardianpan.value)\n ) {\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n guardianpan: {\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 (\n 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: second_nomineeDetails.email.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.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.dob.value) {\n // setthird_nomineeDetails({\n // ...third_nomineeDetails,\n // dob: {\n // value: \"\",\n // isError: true,\n // errorMessage: \"Select the Date of Birth\",\n // },\n // });\n // return;\n // }\n if (\n !!nominee_dateofbirth.third_nominee_dateofbirth &&\n third_nomineeDetails.guardianname.value == \"\"\n ) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n guardianname: {\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.guardianpan.value)\n ) {\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n guardianpan: {\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 }\n if (\n 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: third_nomineeDetails.email.value,\n isError: true,\n errorMessage: \"Enter valid Email Id\",\n },\n });\n return;\n }\n }\n }\n\n setIsLoading(true);\n const NomineeDetails = {\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.guardianname.value,\n i_nomguardianpan1: first_nomineeDetails.guardianpan.value,\n i_namguardianrelationship1:\n first_nomineeDetails.gaurdianrelationship.value,\n i_sameaddress1: same_as_first_appicant_address[\"nom1\"],\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.guardianname.value,\n i_nomguardianpan2: second_nomineeDetails.guardianpan.value,\n i_namguardianrelationship2:\n second_nomineeDetails.gaurdianrelationship.value,\n i_sameaddress2: same_as_first_appicant_address[\"nom2\"],\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.guardianname.value,\n i_nomguardianpan3: third_nomineeDetails.guardianpan.value,\n i_namguardianrelationship3:\n third_nomineeDetails.gaurdianrelationship.value,\n i_sameaddress3: same_as_first_appicant_address[\"nom3\"],\n }\n : {}),\n };\n setIsLoading(false);\n props.storeNomineeDetails(NomineeDetails);\n props.storeNonomineeDetails(nominate_yes_or_no);\n props.history.replace(\"/new-investor-transaction/bank-details\");\n };\n console.log(\"nominee_list\",nominee_list)\n return (\n <>\n \n \n {o.name}\n
\n \n
\n {/* {!nominate_yes_or_no && (\n \n
\n )} */}\n \n {!nominate_yes_or_no && (\n \n
\n\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
\n )}\n Nominee 1:
\n \n \n {nomineeList.map((item, index) => (\n \n ))}\n \n
\n )}\n\n \n = 1? false : true\n }\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 // guardianname: { value: event.target.value },\n // })\n // }\n onChange={handleName(\"guardianname1\")}\n\n isShowError={first_nomineeDetails.guardianname.isError}\n errorMessage={\n first_nomineeDetails.guardianname.errorMessage\n }\n />\n
\n )}\n {nominee_dateofbirth.first_nominee_dateofbirth && (\n \n setfirst_nomineeDetails({ ...first_nomineeDetails, guardianpan:{value:event.target.value}})}\n isShowError={first_nomineeDetails.guardianpan.isError}\n errorMessage={\n first_nomineeDetails.guardianpan.errorMessage\n }\n onBlur={showError(\"firstNomineeGuardianPan\")}\n />\n
\n )}\n {nominee_dateofbirth.first_nominee_dateofbirth && (\n \n \n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n gaurdianrelationship: {\n value: event.target.value,\n },\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 if(!emailRegex.test(event.target.value)){\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n email: {\n value: event.target.value,\n isError: true,\n errorMessage: \"Email is not valid\",\n }\n })\n } else {\n setfirst_nomineeDetails({\n ...first_nomineeDetails,\n email: { value: event.target.value },\n }) }}\n }\n isShowError={first_nomineeDetails.email.isError}\n errorMessage={first_nomineeDetails.email.errorMessage}\n />\n
\n \n
\n {!same_as_first_appicant_address.nom1 && (\n \n handleAddress(\"nom1\")}\n />\n Same as First Applicant Address\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 \n
\n \n
\n \n \n {NomineeListShow && (\n \n
\n )}\n \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 = 2? false : true\n }\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 // guardianname: { value: event.target.value },\n // })\n // }\n onChange={handleName(\"guardianname2\")}\n\n isShowError={second_nomineeDetails.guardianname.isError}\n errorMessage={\n second_nomineeDetails.guardianname.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: {\n value: event.target.value,\n },\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 if(!emailRegex.test(event.target.value)){\n setsecond_nomineeDetails({\n ...second_nomineeDetails,\n email: {\n value: event.target.value,\n isError: true,\n errorMessage: \"Email is not valid\",\n }\n })\n } else {\n setsecond_nomineeDetails({\n ...first_nomineeDetails,\n email: { value: event.target.value },\n }) }}\n }\n isShowError={second_nomineeDetails.email.isError}\n errorMessage={second_nomineeDetails.email.errorMessage}\n />\n
\n \n
\n {!same_as_first_appicant_address.nom2 && (\n \n handleAddress(\"nom2\")}\n />\n Same as First Applicant Address\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 \n
\n \n
\n \n \n {NomineeListShow && (\n \n
\n )}\n \n \n \n )}\n \n )}\n Nominee 3:
\n \n \n {nomineeList.map((item, index) => (\n \n ))}\n \n
\n )}\n \n =3 ? 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 // guardianname: { value: event.target.value },\n // })\n // }\n onChange={handleName(\"guardianname3\")}\n\n isShowError={third_nomineeDetails.guardianname.isError}\n errorMessage={\n third_nomineeDetails.guardianname.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: {\n value: event.target.value,\n },\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 if(!emailRegex.test(event.target.value)){\n setthird_nomineeDetails({\n ...third_nomineeDetails,\n email: {\n value: event.target.value,\n isError: true,\n errorMessage: \"Email is not valid\",\n }\n })\n } else {\n setthird_nomineeDetails({\n ...first_nomineeDetails,\n email: { value: event.target.value },\n }) }}\n }\n isShowError={third_nomineeDetails.email.isError}\n errorMessage={third_nomineeDetails.email.errorMessage}\n />\n
\n \n
\n {!same_as_first_appicant_address.nom3 && (\n \n handleAddress(\"nom3\")}\n />\n Same as First Applicant Address\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 \n
\n \n
\n \n \n props.history.replace(\"/new-investor-transaction/fatca-details\")\n }\n >\n BACK\n \n \n PROCEED\n \n
\n \n );\n};\nexport default connect(\n ({ newinvestor }) => {\n const {\n applicantparams,\n fatcaDetails,\n getnomineeDetails,\n nomineDetails,\n address,\n store_pan,\n noNominee,\n } = newinvestor;\n return {\n fatcaDetails,\n applicantparams,\n getnomineeDetails,\n nomineDetails,\n address,\n store_pan,\n noNominee,\n };\n },\n {\n getCountriesList,\n getStatesList,\n storeApplicantParams,\n getKycDetails,\n checkKyc,\n getCitiesByState,\n getRelationShipList,\n storeNomineeDetails,\n storeNonomineeDetails,\n getNomineeDetails,\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\";\nimport CustomLoader from \"../../../forms/Loader\";\nimport CardComponent from \"./lib/CardComponent\";\nimport { MenuItem } from \"@material-ui/core\";\n// import { getBankDetails } from \"../../../../store/actions/newinvestor\";\nimport { getBankDetails } from \"shared/store/actions/newinvestor\";\nimport {\n getBankList,\n storeInvestmentDetails,\n storeInvestmentParams,\n NewinvestorBankDetails,\n bankAccountTypes,\n storeBankClick,\n getAccountTypes,\n storeApplicantParams\n} from \"shared/store/actions/newinvestor\";\nimport { connect } from \"react-redux\";\nimport { validatePennyDrop } from \"shared/store/actions/newinvestor\";\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\n const [formValues, setFormValues] = useReducer(\n (preValues, newValues) => ({ ...preValues, ...newValues }),\n initialState\n );\n const InputFields = [\n [\n { name: \"IFSC\", isMandatory: true, type: \"text\" },\n { name: \"Account Type\", isMandatory: true },\n ],\n [\n // { name: \"MICR Code\", isMandatory: false, type: \"text\" },\n {\n name: \"Bank Name\",\n isMandatory: true,\n type: \"text\",\n disabled: !!formValues.DisablingBankDetails ? true : false,\n },\n {\n name: \"Branch Address\",\n isMandatory: true,\n type: \"text\",\n disabled: !!formValues.DisablingBankDetails ? true : false,\n },\n ],\n [\n {\n name: \"Branch City\",\n isMandatory: true,\n type: \"text\",\n disabled: !!formValues.DisablingBankDetails ? true : false,\n },\n {\n name: \"Branch Pincode\",\n isMandatory: true,\n type: \"number\",\n disabled: !!formValues.DisablingBankDetails ? true : false,\n },\n ],\n [\n { name: \"Account Number\", isMandatory: true, type: \"password\" },\n { name: \"Confirm Account Number\", isMandatory: true, type: \"number\" },\n ],\n ];\n\n useEffect(() => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n props.storeBankClick(true)\n NewinvestorBankDetails();\n const { investmentDetails } = props;\n if (investmentDetails.IFSC) {\n setFormValues({ ...investmentDetails });\n return;\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 response = await props.NewinvestorBankDetails({\n pan: props.applicantparams.i_pangno,\n // pan:\"ABAPM0703H\"\n });\n const banks = !!response.Dtinformation ? response.Dtinformation : [];\n if (response.Dtinformation.length === 0) {\n setFormValues({ BanksListShow: false });\n }\n const bankList = banks.map((bank) => {\n return { label: bank.BankName, value: bank.BankName };\n });\n setBankList([...bankList, { label: \"Add New Bank\", value: \"Add New Bank\" }]);\n if (!!response && response.Dtinformation.length>0) {\n const bankDetails = banks[0];\n if(!!props.investmentDetails.bankselected){\n setbankseleected(props.investmentDetails.bankselected);\n } else {\n setbankseleected(banks[0].BankName);\n }\n \n const formValues = {\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: bankDetails.BankAdd1 + \", \" + bankDetails.BankAdd2 + \" ,\" + 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\": { value: bankDetails.BnkAcType },\n };\n if (props.investmentDetails.IFSC) {\n setFormValues({ ...formValues,...props.investmentDetails });\n } else {\n setFormValues(formValues);\n }\n }\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 };\n\n const handleChange = (label) => (event) => {\n const value = event.target.value;\n switch (label) {\n case \"IFSC\":\n setFormValues({\n [label]: {\n value: value.toUpperCase(),\n isError: !ifscRegex.test(value),\n errorMessage: !value\n ? \"IFSC Number is Mandatory\"\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.getBankDetails({ 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 \"Account Number\": { value: \"\" },\n // \"MICR Code\": { value: MicrNo },\n });\n } catch (error) {\n console.log(error);\n setFormValues({\n ...initialState,\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 value: IFSC.value,\n isError: true,\n errorMessage: !IFSC.value\n ? \"IFSC Number is Mandatory\"\n : \"Enter a valid IFSC Number\",\n },\n });\n }\n };\n const handleBankDetails = async (event) => {\n if(event.target.value === \"Add New Bank\"){ {\n setbankseleected(event.target.value)\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({...initialState, AccountTypes: typeList });\n } else {\n setFormValues({\n ...initialState,\n }); }\n } }else if(event.target.value !== \"Add New Bank\") { 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 const accountNumber = formValues[\"Account Number\"].value;\n const confirmAccountNumber = formValues[\"Confirm Account Number\"].value;\n const isIFSCProvided = !!formValues.IFSC.value;\n const isAccountTypeProvided = !!formValues[\"Account Type\"].value;\n console.log(\"props.applicantparams\",props.applicantparams,formValues)\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 accountNumber &&\n confirmAccountNumber &&\n accountNumber !== confirmAccountNumber\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 (isIFSCProvided && (!isAccountTypeProvided || !accountNumber || !confirmAccountNumber || formValues[\"Bank Name\"].value === \"\" || formValues[\"Branch City\"].value === \"\" || formValues[\"Branch Pincode\"].value === \"\")) {\n const confirmation = window.confirm(\n \"You have not provided all the details. Do you want to proceed?\"\n );\n if (!confirmation) 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 , bankselected });\n props.storeInvestmentParams({ ...invdetails });\n props.history.replace(\"/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(\"/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 getBankDetails,\n storeInvestmentDetails,\n storeBankClick,\n storeInvestmentParams,\n validatePennyDrop,\n getBankList,\n NewinvestorBankDetails,\n bankAccountTypes,\n getAccountTypes,\n storeApplicantParams\n }\n)(BankDetails);\n","import React, { useState } from \"react\";\nimport CardComponent from \"./lib/CardComponent\";\nimport { connect, useDispatch } from \"react-redux\";\nimport { DetailsGroup } from \"../newPurchaseConfirm\";\nimport CustomizedDialogs from \"../../customModal\";\nimport {\n submitLumpsumDetails,\n submitSipDetails,\n clearingFirstTimeInvestorJourney,\n} from \"shared/store/actions\";\nimport CustomLoader from \"../../../forms/customLoader\";\nimport { Checkbox } from \"@material-ui/core\";\n\nconst Confirmation = ({\n location,\n storeLumpsum,\n storeSip,\n history,\n submitLumpsumDetails,\n submitSipDetails,\n noNominee,\n investmentparams\n}) => {\n const dispatch = useDispatch();\n const [dialog, setDialog] = useState({ open: false, appno: \"\" });\n const [type, setType] = useState(\"\");\n const [loader, setLoader] = useState(false);\n\n const data = location.state.type === \"lumpsum\" ? storeLumpsum : storeSip;\n\n const submit = async () => {\n setLoader(true);\n try{\n const response = await (location.state.type === \"lumpsum\"\n ? submitLumpsumDetails(data)\n : submitSipDetails(data));\n const { DtData } = response;\n const { appno, TrType } = DtData[0];\n setType(TrType);\n dispatch(clearingFirstTimeInvestorJourney());\n setLoader(false);\n setDialog({ appno, open: true });\n }catch(e){\n setLoader(false);\n alert(e)\n }\n\n };\n const confirmationMessage = data.i_trtype === \"NEW\"\n ? data.combo_flag === \"Y\"\n ? \"Lumpsum Confirmation (Purchase cum Switch)\"\n : \"Lumpsum Confirmation\"\n : type === \"SIN\"\n ? \"Lumpsum + SIP Confirmation\"\n : \"SIP(Without Payment) Confirmation\";\n return (\n <>\n \n
\n \n
\n )}\n \n
\n \n
\n \n
\n \n
\n \n \n history.push(\"/new-investor-transaction/scheme-details\")\n }\n >\n BACK\n \n \n SUBMIT\n \n history.push(\"/\")}\n Transaction={true}\n transactionStatus={() => history.push(\"/new-transaction\")}\n />\n
\n \n );\n};\n\nexport default connect(\n ({ newinvestor }) => {\n const { storeLumpsum, storeSip , noNominee , investmentparams} = newinvestor;\n return {\n storeLumpsum,\n storeSip,\n noNominee,\n investmentparams\n };\n },\n {\n submitLumpsumDetails,\n submitSipDetails,\n }\n)(Confirmation);\n","import React from \"react\";\nimport { connect } from \"react-redux\";\nimport { Route, Switch } 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\";\nimport Confirmation from \"./Confirmation\";\nconst NewInvestorRegistration = (props) => {\n const { location ,history} = 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 from \"react\";\nimport { Button } from \"@material-ui/core\";\n// import { ActionHeader } from '.';\nimport en from \"../../../lang/en-us.js\";\nconst { dashboard } = en;\n\nexport default function SuccessScreen({\n heading = \"\",\n infospan2 = \"\",\n successMessage = \"\",\n note = \"\",\n info3 = \"\",\n list = [] ,\n handleClick = () => {},\n backNavigation = () => {},\n showTrackStatusButton = true,\n ...props\n}) {\n return (\n <>\n {/* \n
\n \n \n \n
\n \n
\n \n );\n}\n","import React from \"react\";\nimport { Button } from \"@material-ui/core\";\nimport { useEffect } from \"react\";\nimport en from \"../../../lang/en-us.js\";\nimport SuccessScreen from \"./SuccessScreen\";\nconst { dashboard } = en;\n\nexport default function UpdateNomineeSuccess(props) {\n // const { reqId } = props.location.state || {};\n // useEffect(() => {\n // if (!props.location.state) {\n // props.history.push(\"/\");\n // return;\n // }\n // }, []);\n const { succesMessage } = props.location.state.state;\n return (\n \n
\n \n {/*
\n {dashboard.Success.subHeading}
\n{successMessage}
\n{note}
\n\n {/*
\n - \n {list.map((_childProps: any, index: any) => (\n
\n props.history.push(\"/new-transaction\")}\n backNavigation={() => props.history.push(\"/portal/nct\")}\n />\n
\n );\n}\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\";\nimport NctTypes from \"./NctTypes\";\nimport NewInvestorRegistration from \"./newInvestor/NewInvestorRegistration\";\nimport SelectedFolios from \"../UpdateNominee/SelectedFolios\";\nimport UpdateNomineeEdit from \"../UpdateNominee/update-nominee-edit\";\nimport UpdateNomineeSuccess from \"../UpdateNominee/update-nominee-success\";\n\nexport default class TransactionRouter extends Component {\n render() {\n const { history, location } = this.props;\n return (\n \n
\n );\n }\n}\n","import _defineProperty from \"/Users/apple/Documents/dit-react/packages/web/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty\";\nimport React, { Component } from \"react\";\nimport { ALL, GET_FUNDS_LIST, GET_FUNDS_LIST_SUCCESS, GET_FUNDS_LIST_FAILED, GET_CATEGORY_LIST, GET_CATEGORY_LIST_SUCCESS, GET_CATEGORY_LIST_FAILED, GET_SCHEME_LIST, GET_SCHEME_LIST_SUCCESS, GET_SCHEME_LIST_FAILED, REGULAR, PURCHASE, YES, NO } from \"../../store/types\";\nimport { sendNotification } from \"../utils\";\nexport default class CommonNewPurchaseForm extends Component {\n constructor(props) {\n var _this;\n super(props);\n _this = this;\n _defineProperty(this, \"handleChangeValue\", function (label, event) {\n if (label === \"minAmount\" && event.length <= 10) {\n _this.setState({\n [label]: {\n value: event.replace(/^0+/, \"\")\n }\n });\n } else if (label === \"mobile\" && event.length <= 10) {\n _this.setState({\n [label]: {\n value: event\n }\n });\n } else if ((label === \"subArnCode\" || label === \"subBrokerCode\") && event.length <= 15) {\n _this.setState({\n [label]: {\n value: event\n }\n });\n return;\n } else if (label !== \"mobile\" && label !== \"minAmount\" && label !== \"subArnCode\" && label !== \"subBrokerCode\") {\n _this.setState({\n [label]: {\n value: event\n }\n });\n }\n });\n // handleFundChange = async (value) => {\n // this.setState({ fund: { value: value } });\n // if (!value) {\n // this.setState({\n // fund: { value: \"\" },\n // category: { value: \"\" },\n // scheme: { value: \"\" },\n // minCost: \"\",\n // euinNo: { value: \"\" },\n // showSmart: false,\n // });\n // } else if (!!value.value && 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 && !!response.Dtinformation) {\n // this.setState({\n // category: { value: \"\" },\n // scheme: { value: \"\" },\n // minCost: \"\",\n // minAmount: { value: \"\" },\n // euinNo: { value: \"\" },\n // showSmart: false,\n // });\n // }\n // }\n // };\n _defineProperty(this, \"handleCategoryChange\", async function (event) {\n _this.setState({\n category: {\n value: event\n }\n });\n if (!!event) {\n let params = {\n plntype: REGULAR\n };\n params = {\n ...params,\n opt: \"S\",\n schemetype: event.value,\n fund: \"176\"\n };\n const types = [GET_SCHEME_LIST, GET_SCHEME_LIST_SUCCESS, GET_SCHEME_LIST_FAILED];\n const response = await _this.props.getNewPurchaseFundList(params, types);\n if (response) {\n _this.setState({\n category: {\n value: event\n },\n scheme: {\n value: \"\"\n },\n minCost: \"\",\n minAmount: {\n value: \"\"\n },\n showSmart: false\n });\n }\n } else {\n _this.setState({\n category: {\n value: event\n },\n scheme: {\n value: \"\"\n },\n minCost: \"\",\n minAmount: {\n value: \"\"\n },\n showSmart: false\n });\n }\n });\n _defineProperty(this, \"changeScheme\", function (value) {\n const comboScheme = !!value && !!value.value && _this.props.schemeList.find(function (ele) {\n return ele.Scheme_Plan === value.value;\n });\n if (comboScheme.combo_flag === \"Y\") {\n _this.setState({\n combo_purchase_enable: true,\n combo_disclaimer: {\n value: comboScheme.combo_disclaimer\n },\n combo_lable: {\n value: comboScheme.combo_lable\n }\n });\n } else {\n _this.setState({\n combo_purchase_enable: false,\n combo_disclaimer: {\n value: \"\"\n },\n combo_lable: {\n value: \"\"\n }\n });\n }\n _this.setState({\n scheme: {\n value: value,\n isError: false,\n errorMessage: \"\"\n },\n minAmount: {\n value: \"\"\n },\n minCost: !!comboScheme && !!comboScheme.MinAmt ? comboScheme.MinAmt : \"\",\n multiples: !!comboScheme && !!comboScheme.multiples ? comboScheme.multiples : \"\"\n });\n if (!!value) {\n _this.validateBrokerCode();\n }\n });\n _defineProperty(this, \"validateBrokerCode\", async function () {\n if (!!_this.state.subArnCode.value && _this.state.subArnCode.value === _this.state.arnCode.value.split(\"-\")[1]) {\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 {\n subArnCode,\n arnCode\n } = _this.state;\n const params = {\n Fund: \"176\",\n SubAgentCd: !!subArnCode.value ? \"ARN-\".concat(subArnCode.value) : \"\",\n AgentCd: arnCode.value\n };\n const response = await _this.props.validateSubBroker(params);\n if (!!response && !response.DtData) {\n _this.setState({\n subArnCode: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter a valid sub ARN code\"\n }\n });\n }\n });\n _defineProperty(this, \"ComboChange\", function () {\n _this.setState({\n isCombo: !_this.state.isCombo\n });\n });\n _defineProperty(this, \"handleChangeEuin\", async function (ele) {\n _this.setState({\n euinNo: {\n value: ele\n }\n });\n });\n _defineProperty(this, \"FamilyDescriptionEmail\", function (event) {\n _this.setState({\n Family_Code_Email: {\n value: event\n }\n });\n });\n _defineProperty(this, \"FamilyDescriptionPhone\", function (event) {\n _this.setState({\n Family_Code_Phone: {\n value: event\n }\n });\n });\n _defineProperty(this, \"onSubmit\", async function () {\n const {\n arnCode,\n combo,\n subArnCode,\n isCombo,\n radioValue,\n fund,\n invName,\n euinNo,\n minCost,\n subBrokerCode,\n showSmart,\n multiples,\n smart,\n Family_Code_Email,\n Family_Code_Phone,\n code,\n combo_purchase_enable,\n combo_purchase_flag,\n combo_disclaimer,\n combo_lable,\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 if (_this.state.invName.value === \"\") {\n _this.setState({\n invName: {\n value: \"\",\n isError: true,\n errorMessage: \"Investor Name is mandatory*\"\n }\n });\n }\n if (!_this.state.code.value) {\n _this.setState({\n code: {\n value: \"\",\n isError: true,\n errorMessage: \"Country Code is mandatory*\"\n }\n });\n return;\n }\n if (!/^[+][0-9]{1,3}$/.test(_this.state.code.value)) {\n _this.setState({\n code: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter Valid Country Code*\"\n }\n });\n return;\n }\n const keys = Object.keys(others);\n const findError = keys.every(function (key) {\n return !!others[key].value;\n });\n if (!findError) {\n keys.forEach(function (key) {\n !others[key].value && _this.setState({\n [key]: {\n ...others[key],\n isError: true,\n errorMessage: \"\".concat(key === \"category\" ? \"Category\" : key === \"scheme\" ? \"Scheme\" : key === \"minAmount\" ? \"Investment amount\" : key, \" is mandatory*\")\n }\n });\n });\n } else if (invName.value === \"\") {\n _this.setState({\n invName: {\n value: \"\",\n isError: true,\n errorMessage: \"Investor name is mandatory*\"\n }\n });\n } else if (radioValue.value === \"no\" && !euinNo.value) {\n _this.setState({\n euinNo: {\n ...euinNo,\n isError: true\n }\n });\n // this.euinField.focus();\n return;\n } else if (minCost > others.minAmount.value) {\n _this.setState({\n minAmount: {\n ...others[\"minAmount\"],\n isError: true,\n errorMessage: \"Minimum amount is \".concat(minCost)\n }\n });\n // this.minAmountField.focus();\n } else if (/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$/.test(_this.state.emailId.value) === false) {\n _this.setState({\n emailId: {\n ...others[\"emailId\"],\n isError: true,\n errorMessage: \"Enter an vaild Email ID\"\n }\n });\n return;\n } else if (/^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[789]\\d{9}$/.test(_this.state.mobile.value) === false) {\n _this.setState({\n mobile: {\n ...others[\"mobile\"],\n isError: true,\n errorMessage: \"Enter an vaild Mobile No.\"\n }\n });\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 plan = _this.state.scheme.value.value.split(\"~\");\n const params = {\n InvestorName: _this.state.invName.value,\n i_entby: _this.props.userId,\n trtype: PURCHASE,\n Desci: \"Yes~S~\",\n SubbrokerArn: !!_this.state.subArnCode.value ? \"ARN-\".concat(subArnCode.value) : \"\",\n ARNCode: _this.state.arnCode.value,\n EuinCode: _this.state.radioValue.value === \"no\" ? _this.state.euinNo.value.value : \"\",\n i_Userid: _this.props.userId,\n Mobile: _this.state.mobile.value,\n PanNo: !!_this.props.investorData.PAN ? _this.props.investorData.PAN : !!_this.props.pan ? _this.props.pan : \"\",\n Email: _this.state.emailId.value,\n countrycode: _this.state.code.value,\n fEmailFlag: _this.state.Family_Code_Email.value,\n fMobileFlag: _this.state.Family_Code_Phone.value,\n i_Acno: \"0\",\n Subbroker: _this.state.subBrokerCode.value,\n i_Fund: \"176\",\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: \"S\",\n ModuleName: \"Webile\",\n comboswitch: !_this.state.combo_purchase_flag\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: _this.state.fund.value.value,\n Refno: purchaseData.refno,\n ModuleName: \"Webile\"\n };\n const confirmationResponse = await _this.props.showPurchaseConfirmation(confirmationParams);\n if (!!confirmationResponse && !confirmationResponse.response) {\n _this.routing();\n } else if (!!confirmationResponse && !!confirmationResponse.error) {\n sendNotification(\"\".concat(confirmationResponse.error));\n }\n }\n }\n });\n const {\n investorData,\n communicationDetails = [],\n token\n } = this.props;\n const revCD = !!communicationDetails && communicationDetails.length > 0 ? communicationDetails.reverse() : \"\";\n const Xmobile = (revCD || []).find(function (detail) {\n return detail.PAN === investorData.PAN && !!detail.Mobile && !!detail.Fund && detail.Fund.toString().trim() === \"176\";\n });\n const Xemail = (revCD || []).find(function (detail) {\n return detail.PAN === investorData.PAN && !!detail.Fund && detail.Fund.toString().trim() === \"176\" && (!!detail.email || !!detail.Email);\n });\n const Email = !!Xemail && (!!Xemail.email || !!Xemail.Email) ? Xemail.email || Xemail.Email : \"\";\n const Mobile = !!Xmobile && !!Xmobile.Mobile ? Xmobile.Mobile : \"\";\n this.state = {\n emailId: {\n value: Email || \"\"\n },\n mobile: {\n value: Mobile || \"\"\n },\n arnCode: {\n value: token\n },\n invName: {\n value: !!investorData ? investorData.invname : \"\"\n },\n fund: {\n value: \"176\"\n },\n category: {\n value: \"\"\n },\n scheme: {\n value: \"\"\n },\n minAmount: {\n value: \"\"\n },\n subArnCode: {\n value: \"\"\n },\n euinNo: {\n value: \"\"\n },\n radioValue: {\n value: \"no\"\n },\n subBrokerCode: {\n value: \"\"\n },\n isCombo: false,\n combo: {\n flag: \"\",\n disclamier: \"\",\n label: \"\"\n },\n showSmart: false,\n smart: {\n flag: \"yes\"\n },\n Family_Code_Email: {\n value: \"\"\n },\n Family_Code_Phone: {\n value: \"\"\n },\n code: {\n value: \"+91\"\n },\n combo_purchase_enable: false,\n combo_purchase_flag: true,\n combo_disclaimer: {\n value: \"\"\n },\n combo_lable: {\n value: \"\"\n }\n };\n }\n async componentDidMount() {\n const params = {\n opt: \"AT\",\n plntype: REGULAR,\n fund: \"176\"\n };\n const types = [GET_CATEGORY_LIST, GET_CATEGORY_LIST_SUCCESS, GET_CATEGORY_LIST_FAILED];\n await this.props.getNewPurchaseFundList(params, types);\n }\n}\nexport const family_description_codes = [{\n family_description: \"Self\",\n family_code: \"SE\"\n}, {\n family_description: \"Spouse\",\n family_code: \"SP\"\n}, {\n family_description: \"Dependent Children\",\n family_code: \"DC\"\n}, {\n family_description: \"Dependent Siblings\",\n family_code: \"DS\"\n}, {\n family_description: \"Dependent Parents\",\n family_code: \"DP\"\n}, {\n family_description: \"Guardian\",\n family_code: \"GD\"\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} 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\";\nimport { family_description_codes } from \"shared/components/Transactions/newPurchaseForm\";\n\n\nclass NewPurchase extends Component {\n constructor(props) {\n super(props);\n const { investorData, communicationDetails = [], token,location } = 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 const { state } = location;\n const { transaction } = state || {};\n this.state = {\n emailId: { value: !!transaction ? transaction.Email : Email || \"\" },\n mobile: { value: !!transaction ? transaction.mobile : Mobile || \"\" },\n arnCode: { value: token },\n invName: {\n value: !!transaction\n ? transaction.InvName\n : this.props.investorData.invname || this.props.kycData.invname,\n }, \n fund: { value: \"176\" },\n category: { value: !!transaction ? transaction.category : \"\" },\n scheme: {\n value: !!transaction\n ? {\n label: transaction.schemename,\n value: transaction.scheme_code,\n }\n : \"\",\n }, \n minAmount: { value: !!transaction ? transaction.amount : \"\" },\n subArnCode: { value: !!transaction ? transaction.Sub_ARN_code : \"\" },\n euinNo: {\n value:\n !!transaction && transaction.euinopt == \"N\"\n ? transaction.euincode\n : \"\",\n }, \n radioValue: {\n value: !!transaction && transaction.euinopt === \"Y\" ? \"yes\" : \"no\",\n }, \n subBrokerCode: { value: !!transaction ? transaction.subbroker : \"\" },\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 combo_purchase_enable:false,\n combo_purchase_flag: false,\n combo_disclaimer: { value: \"\" },\n combo_lable: { value: \"\" }\n };\n }\n\n async componentDidMount() {\n const params = {\n opt: \"AT\",\n plntype: REGULAR,\n fund: \"176\",\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 if (this.props?.location?.state?.transaction) {\n let params1 = {\n plntype: REGULAR,\n opt: \"S\",\n schemetype: this.state.category.value,\n fund: \"176\",\n };\n const types1 = [\n GET_SCHEME_LIST,\n GET_SCHEME_LIST_SUCCESS,\n GET_SCHEME_LIST_FAILED,\n ];\n await this.props.getNewPurchaseFundList(params1, types1);\n const params2 = {\n Fund: \"176\",\n SubAgentCd: !!this.state.subArnCode.value\n ? `ARN-${this.state.subArnCode.value}`\n : \"\",\n AgentCd: this.state.arnCode.value,\n };\n await this.props.validateSubBroker(params2);\n }\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: \"176\",\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: \"176\",\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 }\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 = !!value && !!value.value && this.props.schemeList.find(\n (ele) => ele.Scheme_Plan === value.value\n );\n if (comboScheme.combo_flag === \"Y\") {\n this.setState({\n combo_purchase_enable: true,\n combo_disclaimer: { value: comboScheme.combo_disclaimer },\n combo_lable: { value: comboScheme.combo_lable }\n })\n }\n else{\n this.setState({\n combo_purchase_enable: false,\n combo_disclaimer: { value: \"\"},\n combo_lable: { value: \"\" }\n })\n }\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: !!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 === \"code\") {\n if (!/^[+]\\d{1,3}/.test(event.target.value)) {\n this.setState({\n [label]: {\n value: event.target.value,\n isError: true,\n errorMessage: \"Enter a valid Country Code\",\n },\n });\n } else {\n this.setState({ [label]: { value: event.target.value } });\n }\n } else if (label === \"mobile\" && event.target.value.length <= 10) {\n this.setState({\n [label]: { value: event.target.value },\n });\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 } 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.minCost > this.state.minAmount.value) {\n this.setState({\n [label]: {\n value,\n isError:\n this.state.minCost > this.state.minAmount.value ? true : !value,\n errorMessage:\n this.state.minCost > this.state.minAmount.value\n ? `(Amount should be ${this.state.minCost})`\n : \"\",\n },\n });\n }\n } else if (label === \"emailId\") {\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.emailId.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.emailId.value\n ) === false\n ? `( *enter an vaild email address )`\n : \"\",\n },\n });\n } else if (label === \"code\") {\n if (!/^[+]\\d{1,3}/.test(event.target.value)) {\n this.setState({\n [label]: {\n value: \"\",\n isError: true,\n errorMessage: \"Enter a valid Country Code\",\n },\n });\n }\n } else if (label === \"mobile\") {\n this.setState({\n [label]: {\n value,\n isError:\n /^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[6-9]\\d{9}$/.test(\n this.state.mobile.value\n ) === false\n ? true\n : !value,\n errorMessage:\n /^(?:(?:\\+|0{0,2})91(\\s*[\\-]\\s*)?|[0]?)?[6-9]\\d{9}$/.test(\n this.state.mobile.value\n ) === false\n ? `(* Enter a valid Phone Number)`\n : !value,\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 const {\n arnCode,\n combo,\n subArnCode,\n isCombo,\n radioValue,\n invName,\n euinNo,\n minCost,\n code,\n subBrokerCode,\n showSmart,\n fund, multiples,\n smart,\n combo_purchase_enable,\n combo_purchase_flag,\n combo_disclaimer,\n combo_lable,\n ...others\n } = this.state;\n const arn = this.state.arnCode.value.split(\"-\");\n if (!/^[+]\\d{1,3}/.test(this.state.code.value)) {\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 }\n if (this.state.euinNo.value === \"\") {\n this.setState({\n euinNo: {\n value: \"\",\n isError: true,\n },\n });\n }\n\n if (this.state.invName.value === \"\") {\n this.setState({\n invName: {\n value: \"\",\n isError: true,\n errorMessage: \"Investor Name is mandatory*\",\n },\n });\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: `${key} is mandatory*`,\n },\n });\n });\n const firstErroredKey = keys.find((key) => !others[key].value);\n console.log(\"firstErroredKey\",firstErroredKey)\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.setState({\n invName: {\n value: \"\",\n isError: true,\n errorMessage: \"Investor Name is mandatory*\",\n },\n });\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 ...others[\"minAmount\"],\n isError: true,\n errorMessage: `Minimum amount should be ${minCost} `\n ,\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 an Vaild Email address`,\n },\n });\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 an Vaild phone Number`,\n },\n });\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 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: \"176\",\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: \"S\",\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 comboswitch:!this.state.combo_purchase_flag\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: \"176\",\n Refno: purchaseData.refno,\n ModuleName: \"Webile\",\n };\n const confirmationResponse = await this.props.showPurchaseConfirmation(\n confirmationParams\n );\n\n\n if (!!confirmationResponse && !confirmationResponse.error) {\n this.props.history.push({\n pathname:\n INVESTOR_URL +\n \"/nfo-new-purchase/digital/transact/confirm\",\n state: {\n title: \"NEW 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: \"176\" },\n type: NEW_PURCHASE,\n arnCode: this.state.arnCode.value,\n fEmailFlag: this.state.Family_Code_Email.value,\n fMobileFlag: this.state.Family_Code_Phone.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 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 ComboFlagChange = (value) => {\n this.setState({\n combo_purchase_flag: !this.state.combo_purchase_flag\n })\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 } = this.state;\n const { location } = this.props;\n const { state } = location;\n return (\n \n
\n New Purchase
\n\n {/* \n
*/}\n\n {/* {!!state && !!state.pan && ( */}\n AMC
\n \n (this.invNameField = ele)}\n disabled={true}\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 inputRef={(ele) => (this.emailfamilyField = ele)}\n isError={Family_Code_Email.isError}\n errorMessage={Family_Code_Email.errorMessage}\n\n />\n
\n {/* )} */}\n Email Family Description
\n \n (this.emailIdField = ele)}\n errorMessage={this.state.emailId.errorMessage}\n />\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 inputRef={(ele) => (this.mobilefamilyField = ele)}\n isError={Family_Code_Phone.isError}\n errorMessage={Family_Code_Phone.errorMessage}\n />\n
\n\n Mobile Family Description
\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 \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 type=\"number\"\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 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
\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 placeholder=\"Select 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 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\n distributor has not charged any advisory fees on this transaction\n
\n )}\n {this.state.combo_purchase_enable &&\n \n
\n }\n \n
\n {this.state.combo_disclaimer.value}
\n \n
\n \n \n \n 3 M\n
\n \n NAV Details\n
\n \n {/* \n 1 M\n
\n \n
*/}\n AMC
\n \n \n {categoryList.map((item, index) => (\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 />\n
\n Scheme
\n \n \n 1 W\n
\n \n
\n \n \n );\n }\n}\n\nexport default connect(\n ({ transactions }) => {\n const { fundsList, schemeList, categoryList } = transactions;\n return { fundsList, schemeList, categoryList };\n },\n { getNewPurchaseFundList, getNavData, removeNavData }\n)(Nav);\n","import React, { Component } from \"react\";\nimport { connect } from \"react-redux\";\nimport {\n getTransactionHistory,\n getTrackDetails,\n RemoveTransactionData,\n} from \"shared/store/actions\";\nimport {\n Table,\n TableHead,\n TableCell,\n TableBody,\n Paper,\n TableRow,\n} from \"@material-ui/core\";\nimport { BUILD_URL } from \"../../forms/appEssentials\";\nimport CustomLoader from \"../../forms/customLoader\";\n\nclass NctDetails extends Component {\n constructor(props) {\n super(props);\n this.state = {\n transactionList: [],\n showError: false,\n openPerformanceModal: false,\n TrackData: [],\n display: false,\n };\n }\n render() {\n const RequestTypes = {\n \"nominee_update\": \"NOMINEE UPDATE\",\n \"email_update\": \"EMAIL UPDATE\",\n \"mobile_update\": \"MOBILE UPDATE\",\n \"dataEntry_update\": \"DATAENTRY UPDATE\",\n \"folio_consolidation\": \"FOLIO CONSOLIDATION\",\n \"idcw_update\": \"IDCWOPTION UPDATE\",\n \"ifsc_update\": \"IFSC UPDATE\",\n \"fatca_update\": \"FATCA UPDATE\",\n \"update_Minor_To_Major\": \"MINOR TO MAJOR UPDATE\",\n \"form15GH_update\": \"FORM15GH UPDATE\",\n \"multibank_update\": \"MULTIBANK UPDATE\",\n \"update_bank_details\": \"BANK DETAILS UPDATE\"\n };\n const { state } = this.props.location;\n const { transactions } = state;\n const { display } = this.state;\n // const finalTransactions = Object.keys(transactions).map(key => transactions[key].length > 0 ? transactions[key][0] : null).filter(item => item !== null);\n const finalTransactions = Object.keys(transactions)\n .flatMap((key) => transactions[key])\n .filter((item) => item !== null);\n return (\n \n {!!finalTransactions && !!finalTransactions.length ? (\n \n \n {!!display ? (\n \n \n ) : (\n
\n );\n }\n}\n\nexport default connect(\n ({ authReducer, transactionHistory }) => {\n const { investorData, userId, token } = authReducer;\n const { fundsList, transactions } = transactionHistory;\n return { investorData, userId, fundsList, transactions, token };\n },\n { getTransactionHistory, getTrackDetails, RemoveTransactionData }\n)(NctDetails);\n\nexport class SingleAmcheader extends Component {\n render() {\n const { name, pan } = this.props.investorData;\n return (\n \n \n \n
\n \n
\n )}\n NCT Transactions
\n No Data Found
\n )}\n \n
\n );\n }\n}\n\n","import React, { Component } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport Investors from \"../investors/InvestorMain\";\nimport NctDetails from \"./nctDetails\";\n\nexport default class NctRouter extends Component {\n render() {\n const { history, location } = this.props;\n return (\n \n
\n \n
\n \n
\n {name}
\n PAN: {pan}
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\n\nexport default class Social extends Component {\n render() {\n return Social
;\n }\n}\n","import React, { Component } from \"react\";\nimport Paper from \"@material-ui/core/Paper\";\nimport MenuItem from \"@material-ui/core/MenuItem\";\nimport { Input } from \"../../forms/input\";\nimport CustomizedSelect from \"../../home/transactions/customizedSelect\";\nimport TextField from \"@material-ui/core/TextField\";\nimport { connect } from \"react-redux\";\nimport { SucesssPopUp } from \"../../home/customModal\";\nimport Signbutton from \"../../forms/button\";\nimport { getDistPostQuery, getComplaint } from \"shared/store/actions/support\";\nconst BUILD_URL = process.env.PUBLIC_URL;\nexport class Support extends Component {\n constructor(props) {\n super(props);\n this.state = {\n supportQueries: { value: \"\" },\n comments: { value: \"\" },\n open: false,\n response: \"\"\n };\n }\n\n componentDidMount() {\n this.props.getDistPostQuery();\n }\n\n handleChangeSupportQueries = event => {\n this.setState({\n supportQueries: { value: event.target.value }\n });\n };\n handleChangeCommentsChange = event => {\n this.setState({\n comments: { value: event.target.value }\n });\n };\n closeModal() {\n this.setState({\n open: false\n });\n this.props.history.push(\"/\");\n }\n\n submit = async () => {\n const {\n supportQueries: { value }\n } = this.state;\n if (!value) {\n this.setState({\n supportQueries: {\n value,\n isError: true,\n errorMessage: \"Please select support query\"\n }\n });\n return;\n }\n if (!this.state.comments.value) {\n this.setState({\n comments: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter a query message\"\n }\n });\n return;\n }\n \n const body = {\n APKVer: \"Mi43Ljc5\\n\",\n AcNo: \"MA==\",\n Agent: \"\",\n AppNo: \"MA==\",\n ChqNo: \"MA==\",\n Comments: btoa(this.state.comments.value),\n EmailID: \"AA==\",\n Fund: \"MA==\",\n IMEI: \"MzU4MTg4MDcyNjA3MDE0\\n\",\n InvName: \"AA==\",\n OS: \"QW5kcm9pZA==\\n\",\n QrySub: \"AA==\",\n ReqBy: \"QQ==\\n\",\n Selqry: btoa(this.state.supportQueries.value),\n TrnDate: \"AA==\",\n convenience: \"\",\n transaction: \"\",\n experience: \"\"\n };\n const response = await this.props.getComplaint(body);\n if (response) {\n const {\n Dtinformation: [info]\n } = response;\n\n this.setState({\n supportQueries: { value: \"\" },\n open: true,\n response: response.Dtinformation[0].Error_Message,\n comments: { value: \"\" }\n });\n }\n };\n\n render() {\n const { supportQueries } = this.state;\n return (\n \n \n
\n \n
\n\n Raise a Query
\n \n
\n \n \n {this.props.supportQueries.map((item, index) => (\n \n ))}\n \n
\n Query Option
\n \n \n {this.state.comments.errorMessage}\n
\n ) : (\n \"\"\n )}\n Query Message (optional)
\n \n
\n \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}\n
\n \n \n \n Your Feedback is important to us. This way we can keep improving our\n Website\n
\n\n Feedback
\n \n \n Convenience\n
\n \n \n Transaction\n
\n \n \n Overall Experience\n
\n\n \n \n {numbers.map((item, index) => (\n \n {item}\n
\n ))}\n \n Not Satisfied
\n Really Satisfied
\n \n \n
\n \n \n
\n \n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { token, userId } = authReducer;\n return {\n token,\n userId\n };\n },\n { getComplaint }\n)(Feedback);\n","import React, { Component } from \"react\";\nimport { withStyles } from \"@material-ui/core/styles\";\nimport { dashboardStyles } 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 { connect } from \"react-redux\";\nimport CustomLoading from \"../CustomLoader\";\n\nclass DisplayCards extends Component {\n render() {\n const { classes } = this.props;\n return (\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: 65,\n minHeight: 65,\n display: \"flex\",\n alignItems: \"center\",\n paddingLeft: 20,\n borderBottom: \"1px solid #E8EFF6\",\n },\n appBar: {\n width: `100%`,\n minHeight: 65,\n maxHeight:65,\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 display: \"flex\",\n width: \"100%\",\n alignItems: \"center\",\n justifyContent: \"flex-end\",\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: 20,\n },\n lastloginmain: {\n color: \"gray\",\n fontSize: 12,\n marginLeft: 5,\n fontFamily: \"Ubuntu-Regular\",\n },\n lastloginsub: {\n color: \"#003d7b\",\n },\n profile: {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n marginTop: 5,\n },\n profileimage: {\n background: \"#C8F0ED\",\n display: \"flex\",\n color: \"#20225B\",\n fontSize: 22,\n fontFamily: \"Ubuntu-Medium\",\n alignItems: \"center\",\n justifyContent: \"center\",\n height: 60,\n width: 60,\n marginRight: 25,\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: \"Ubuntu-Regular\",\n fontSize: 12,\n },\n profileRolesubtext: {\n color: \"#137ebf\",\n fontFamily: \"Ubuntu-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: \"Ubuntu-Medium\",\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: \"Ubuntu-Regular\",\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: \"rgba(24, 42, 70, 0.8)\",\n fontSize: 13,\n marginLeft: 5,\n marginTop: 2,\n fontFamily: \"Ubuntu-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: \"scroll\",\n },\n listImage: {\n marginLeft: 12,\n height: 15,\n },\n listTextActive: {\n fontSize: 14,\n marginLeft: 15,\n color: \"#00579B\",\n fontFamily: \"Ubuntu-Medium\",\n },\n\n listText: {\n fontSize: 15,\n marginLeft: 12,\n color: \"#586a82\",\n fontFamily: \"Ubuntu-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: \"Ubuntu-Regular\",\n },\n count: {\n fontFamily: \"Ubuntu-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 \"FMP Dashboard\",\n \"SIP Dashboard\",\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 {this.props.posterStatus === 0 && (\n \n \n\n \n
\n {this.state.Tab === \"FREQUENT_REPORTS\" && (\n \n {profileData.Distributor_Name} Portfolio\n
\n {!!this.props.tran_enable_flag &&\n this.props.tran_enable_flag === \"N\" && (\n \n this.props.history.push(`/my-earnings`)}\n />\n
\n )}\n \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 {!!AUMPieData.length && (\n \n \n )}\n
\n \n Asset Class Wise Investment Break Up\n
\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\n getSipSummary,\n getAumData,\n getInvestors,\n getInvestorDetails,\n getFrequentMailBackRequest,\n getProfileData,\n PosterOpen,\n getMailbackList,\n }\n)(Dashboard);\n\nexport class SubReports extends Component {\n render() {\n return (\n \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
\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 Note: Only the last 6 month's transactions will be displayed here.
\n \n
\n )}\n\n {tableData.length > 0 ? tableData.map((ele, index) => (\n \n \n
\n )}\n \n \n {tablearray.map((ele, index) => (\n \n {ele}\n
\n ))}\n {this.state.active===NEW_INVESTORS?\"Note: Investors who are registered afresh within last one month will be displayed here.\":null}
\n {!!tableData.length && (\n \n {ele.name}\n
\n \n {ele.pangir}\n
\n\n \n {ele.mobile}\n
\n\n \n {ele.email}\n
\n \n {ele.AUM.toLocaleString(undefined, {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,})}\n
\n \n )): TOTAL AUM(₹) : {totalAUM.toLocaleString(undefined, {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,})}
\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 {this.state.active === SIP_INVESTMENTS && (\n \n
\n )}\n {this.state.tableData.length > 0 && \n \n {this.setState({ filter: e.target.value });\n console.log(this.state.filter,e.target.value)}}\n value={this.state.filter.value}\n style={{ borderRadius: 5, width: \"80px\", height: \"34px\",marginTop: \"30px\" }}\n >\n {this.filterOptions.map((item, index) => (\n \n ))}\n \n this.setState({ searchText: e.target.value })}\n />\n
}\n \n \n this.setState({ filtered: false , searchText: \"\" })}\n style={{\n borderRadius: 5,\n backgroundColor: \"rgba(0, 118, 203, 0.2)\",\n padding: \"20px 0px 0px 10px\",\n }}\n width={50}\n buttontitle=\"Reset\"\n active={true}\n />\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 NFO's 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
\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) {\n const params = {\n Fund: location.fund,\n SubAgentCd: \"\",\n AgentCd: this.props.token,\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) => ele.fund === location.fund\n );\n this.setState({\n FundSchemes: filteredSchemes,\n });\n } else {\n const params = { fund: location.fund };\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) => ele.fund === location.fund\n );\n this.setState({\n FundSchemes: filteredSchemes,\n });\n }\n }\n } else {\n this.props.history.push(`/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: this.props.location.fund,\n scheme: this.state.scheme.value.value,\n userid: this.props.userId,\n invdistflag: \"S\",\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: `/dashboard/nfo-funds`,\n link: this.state.nfoLink,\n fund: location.fund,\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 (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 this.props.onClose && this.props.onClose()}\n className={`mouse-pointer`}\n >\n
\n )}\n \n\n {this.state.loading ? (\n \n Confirm re-initiation of transaction{\" \"}\n {transactionTypeDesc ? `(${transactionTypeDesc})` : \"\"}\n
\n\n {!this.standalone && (\n\n // Transaction re-initiated successfully with the Reference No:{!!this.state.ReferenceNO?this.state.ReferenceNO:\"\"}\n //
\n\n\n \n Pending/Rejected\n
\n \n \n {this.props.count > 0 && this.state.open.active ? (\n \n
\n \n \n \n Active\n
\n \n \n \n {/*
\n \n
\n ) : (\n this.props.count == 0 &&\n this.props.sipTransactions.length == 0 &&\n this.state.open.active && (\n \n {this.props.sipTransactions.map((item, index) => (\n
\n No Data Found
\n )\n )}\n {this.props.count > 0 && this.state.open.pending ? (\n \n \n \n
\n \n
\n ) : (\n this.props.count == 0 &&\n this.props.sipTransactions.length == 0 &&\n this.state.open.pending && (\n \n {this.props.sipTransactions.map((item, index) => (\n
\n No Data Found
\n )\n )}\n \n \n );\n }\n }\n \n export default connect(\n ({ authReducer, transactions, loading }) => {\n const { token } = authReducer;\n const { sipTransactions } = transactions;\n const { count } = loading;\n return {\n token,\n sipTransactions,\n count,\n };\n },\n {\n getSipvalues,\n }\n )(SipTransactions);\n var CurrencyFormat = require(\"react-currency-format\");\n export class DisplaySIPCards extends Component {\n render() {\n return (\n \n {/*
\n \n
\n \n \n );\n }\n }\n export class InvestorTableCardActive extends Component {\n render() {\n const {\n invName,\n Scheme,\n folio_number,\n Number_of_Installments,\n Start_Date_of_SIP,\n End_Date_of_SIP,\n amount,\n Mode_of_Registration,\n URN_UMRNumber,\n Rejection_Reason,\n status,\n active,\n pending,\n Maturity_Date,\n fmp,\n } = this.props;\n return (\n \n {this.props.name}\n
\n {this.props.count >= 0 && this.props.currencyformat ? (\n \n
\n ) : this.props.count >= 0 ? (\n \n
\n ) : (\n \n
\n );\n }\n }\n ","import React, { Component } from \"react\";\nimport { connect } from \"react-redux\";\nimport Card from \"@material-ui/core/Card\";\nimport CustomLoading from \"../CustomLoader\";\nimport { getFMPdata } from \"shared/store/actions\";\nimport { fmp_columns } from \"../../forms/content\";\nimport { Table, TableBody, TableCell, TableRow } from \"@material-ui/core\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { FormatCurrency } from \"../currencyFormatter\";\nimport { DisplaySIPCards } from \"./SipTransactions\";\nimport { InvestorTableCardActive } from \"./SipTransactions\";\n\nexport class FmpTransactions extends Component {\n constructor(props) {\n super(props);\n this.state = {\n fmpvalues: { totalFMPs: \"\", totalvalueofFMPS: \"\" },\n };\n }\n async componentDidMount() {\n const params = {\n agentcode: this.props.token,\n };\n const response = await this.props.getFMPdata(params);\n const data = !!response.DtData[0] ? response.DtData[0] : \"\";\n const { Total_fmp, Total_value } = data;\n this.setState({\n fmpvalues: {\n totalFMPs: !!Total_fmp ? Total_fmp : \"\",\n totalvalueofFMPS: !!Total_value ? Total_value : \"\",\n },\n });\n }\n render() {\n const data = this.props.fmpTransactions || [];\n const sortedData = data.slice().sort((a, b) => {\n if (a.amount === b.amount) {\n // If amount is the same, sort by invname\n return a.invname.localeCompare(b.invname);\n } else {\n // Otherwise, sort by amount\n return b.amount - a.amount;\n }\n });\n const totalAUM = data.reduce((accumulator, currentObject) => {\n const { amount } = currentObject;\n if (!isNaN(amount)) {\n return accumulator + parseFloat(amount);\n }\n return accumulator;\n }, 0);\n return (\n \n
\n {invName}
\n\n
\n \n
\n \n
\n Scheme
\n :\n{!!Scheme ? Scheme : \"NA\"}
\n\n
\n {fmp && (\n \n
\n Folio Number
\n :\n{folio_number}
\n\n
\n )}\n {active && (\n <>\n \n
\n Maturity Date
\n :\n{Maturity_Date}
\n\n
\n \n
\n Number of Installments
\n :\n{Number_of_Installments}
\n\n
\n \n
\n Start Date of SIP
\n :\n{Start_Date_of_SIP}
\n\n
\n \n
\n End Date of SIP
\n :\n{End_Date_of_SIP}
\n\n
\n \n
\n Mode of Registration
\n :\n{Mode_of_Registration}
\n\n
\n \n )}\n \n
\n Bill Id Number
\n :\n{URN_UMRNumber}
\n\n
\n {pending && (\n <>\n \n \n
\n
\n \n Amount :\n
\n\n
\n \n
\n \n
\n Mode of Registration
\n :\n{Mode_of_Registration}
\n\n
\n \n
\n Rejection Reason
\n :\n{Rejection_Reason}
\n\n
\n \n
\n Bill Id Number
\n :\n{URN_UMRNumber}
\n\n
\n \n )}\n \n
\n Status
\n :\n{status}
\n\n \n
\n {this.props.count > 0 ? (\n \n \n \n {/*
\n {data.length > 0 && (\n \n \n TOTAL Amount(₹) :{\" \"}\n {totalAUM.toLocaleString(undefined, {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,\n })}\n \n
\n )}\n \n \n {this.props.fmpTransactions.map((item, index) => (\n
\n \n ) : (\n !!this.props.fmpTransactions &&\n this.props.fmpTransactions.length === 0 &&\n this.props.count === 0 && (\n No Data Found
\n )\n )}\n \n );\n }\n}\n\nexport default connect(\n ({ authReducer, loading, transactions }) => {\n const { token } = authReducer;\n const { fmpTransactions } = transactions;\n const { count } = loading;\n return {\n token,\n count,\n fmpTransactions,\n };\n },\n {\n getFMPdata,\n }\n)(FmpTransactions);\n","import React, { Component } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport Dashboard from \"./dashboardmain\";\nimport TabContainer from \"./tabs\";\nimport ListOfInvestorsTabs from \"./listofInvestorTabs\";\nimport SipSummaryTabContainer from \"./SipSummaryTabContainer\";\nimport NfoFunds from \"./nfoFunds\";\nimport NfoTransact from \"./NfoTransaction\";\nimport ReinitiateConfirm from \"../transactions/ReinitiateConfirm\";\n\nimport SipTransactions from \"./SipTransactions\";\nimport FmpTransactions from \"./FmpTransactions\";\n\nexport default class DashboardRouter extends Component {\n render() {\n const { history, location } = this.props;\n return (\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: \"S\" });\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 = `/mailBackRequest`;\n\nexport default class MailBackComponent extends Component {\n render() {\n return (\n \n
\n );\n }\n}\n\nexport class MailBackBreadCrumb extends Component {\n render() {\n const { name } = this.props;\n return (\n \n \n this.props.history.push({\n pathname: MAILBACK_URL + \"/investor/investor-selection\",\n state: !!this.props.investorData\n ? {\n name:\n !!name && name === \"Mail Back SOA\"\n ? \"mailBackSoa\"\n : name === \"Consolidated Account Statment\"\n ? \"consolidated\"\n : name === \"ELSS Account Statement\"\n ? \"ELSS\"\n : name === \"CAN Based Account Statement\"\n ? \"CAN\"\n : name === \"Capital Gains Account Statement\"\n ? \"CGS\"\n : name === \"Grandfathering Account Statement\"\n ? \"GAS\"\n : name === \"Networth Report\"\n ? \"Networth\"\n : \"Networth\",\n investorData: this.props.investorData,\n }\n : {\n name:\n !!name && name === \"Mail Back SOA\"\n ? \"mailBackSoa\"\n : name === \"Consolidated Account Statment\"\n ? \"consolidated\"\n : name === \"ELSS Account Statement\"\n ? \"ELSS\"\n : name === \"CAN Based Account Statement\"\n ? \"CAN\"\n : name === \"Capital Gains Account Statement\"\n ? \"CGS\"\n : name === \"Grandfathering Account Statement\"\n ? \"GAS\"\n : name === \"Networth Report\"\n ? \"Networth\"\n : \"Networth\",\n },\n })\n }\n >\n Investors Selection\n \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: \"176\",\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: \"176\",\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 \n this.props.history.push(MAILBACK_URL + \"/investor\")\n }\n className=\"breadcrumbs-unselect-label\"\n style={{ cursor: \"pointer\" }}\n >\n Mail Back Types\n \n
\n\n \n {this.props.name === \"Mailback SOA\"\n ? \"Mail Back SOA\"\n : this.props.name}\n
\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\";\nimport { NEW_TRANSACTION_URL } from \"../transactions\";\nimport { MAILBACK_URL } from \".\";\nimport moment from \"moment\";\nimport { MailBackBreadCrumb } from \"./mailback\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../../forms/appEssentials\";\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 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: \"\" },\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 });\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 } 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 } 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(\"/\");\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 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\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: \"176\",\n EmailId: this.state.email.value,\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 } = authReducer;\n // const userid = authReducer.userId;\n return { investorData, userId };\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 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: \"\" },\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 });\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 } 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 } 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(\"/\");\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 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: \"176\",\n EmailId: this.state.email.value,\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 } = authReducer;\n // const userid = authReducer.userId;\n return { investorData, userId };\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(\"/\");\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: `ConfirmSelfPassword 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: `Password does 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 this.state = {\n startDate: {\n value: null,\n error: \"\",\n },\n endDate: { value: null, error: \"\" },\n ConfirmSelfPassword: { value: \"\" },\n selfPassword: { value: \"\" },\n email: { value: \"\" },\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 } 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 } 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( \"/\");\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 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: this.state.email.value,\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
\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 } = authReducer;\n return { investorData, userId, token };\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 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: \"\" },\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 } 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 } 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( \"/\");\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 params = {\n fromdt: \"\",\n todate: \"\",\n trtype: \"GF\",\n PAN: this.state.pan.value,\n Email: this.state.email.value,\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 } = authReducer;\n return { investorData, userId, token };\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 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: \"\" },\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 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 } 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 } 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 });\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(\"/\");\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: `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 let startDateValue;\n startDateValue = new Date().toLocaleDateString(\"en-US\", {\n month: \"2-digit\",\n year: \"numeric\",\n day: \"numeric\",\n });\n\n const params = {\n fromdate: \"01/01/1970\",\n todate: formatDate(new Date()),\n mylp: \"\",\n emailid: this.state.email.value,\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 vaild 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 } = authReducer;\n return { investorData, userId, token };\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 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 Paper from \"@material-ui/core/Paper\";\nimport { Input } from \"../../forms/input\";\nimport Signbutton from \"../../forms/button\";\nimport { connect } from \"react-redux\";\nimport { getProfileData } from \"shared/store/actions/profile\";\nimport { userLogin } from \"shared/store/actions\";\nimport { useParams } from \"react-router\";\nexport const CobrandingCollaterals_URL = `/Cobranding-Collaterals`;\nclass CobrandingCollaterals extends Component {\n constructor(props) {\n super(props);\n this.state = {\n arnCode: { value: \"\" },\n name: { value: \"\" },\n email: { value: \"\" },\n mobile: { value: \"\" },\n };\n }\n async componentDidMount() {\n await this.props.getProfileData({\n Agent: this.props.token,\n UserId: this.props.userId,\n });\n this.setState({\n arnCode: { value: this.props.token },\n name: { value: this.props.profileData.Distributor_Name },\n email: { value: this.props.profileData.Email },\n mobile: { value: this.props.profileData.MobileNo },\n });\n }\n submit = () => {\n const base_url = \"https://www.sundarammutual.com/Co-BrandedCollaterals?\";\n const params = btoa(\n `Type=INVWISE&ARNCODE=${this.state.arnCode.value}&ARNNAME=${this.state.name.value}&EMAIL=${this.state.email.value}&Mobile=${this.state.mobile.value}&ReqRMID=0`\n );\n const main_url = base_url + params;\n window.open(main_url);\n };\n render() {\n const { name, email, arnCode, mobile } = this.state;\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 \n \n
\n );\n }\n}\n\nexport default connect(\n ({ profileReducer, authReducer }) => {\n const { profileData } = profileReducer;\n const { token, userId } = authReducer;\n return {\n profileData,\n token,\n userId,\n };\n },\n {\n getProfileData,\n }\n)(CobrandingCollaterals);\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 NctTransactionHistory from \"./nctHistory\";\nimport Social from \"./social\";\nimport Support from \"./support\";\nimport Settings from \"./settings\";\nimport 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 CobrandingCollaterals from \"./transactions/CobrandingCollaterals\";\nimport NewInvestorRegistration from \"./transactions/newInvestor/NewInvestorRegistration\";\nclass AppRouter extends Component {\n render() {\n return (\n Co-branding Collaterals
\n \n
\n \n
\n \n
\n \n
\n \n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n Mutual fund investments are subject to market risks, read all scheme related documents carefully.\n
{\" \"}\n \n © 2021, Sundaram Asset Management Company Private Limited, 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 , storeCurrentPage , clearingFirstTimeInvestorJourney} 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 { NCTHISTORY_URL } from \"./nctHistory\";\nimport CustomLoading from \"../home/CustomLoader\";\nimport { MyEarnings_URL } from \"./myEarnings\";\nimport { CobrandingCollaterals_URL } from \"./transactions/CobrandingCollaterals\";\n\nimport {\n dashboardActive,\n investorsActive,\n cobrandingInActive,\n cobrandingActive,\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 = `/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 this.props.clearingFirstTimeInvestorJourney();\n if (path === INVESTOR_URL) {\n this.props.storeCurrentPage(1)\n this.props.clearingFirstTimeInvestorJourney();\n }\n };\n\n logOut = () => {\n this.props.userLogout();\n this.props.history.replace( \"/\");\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 \n \n\n \n \n \n 
\n
\n\n \n \n {/* \n \n
\n \n
*/}\n \n\n \n Last login time :{\" \"}\n \n {!!this.props.lastLogin ? (\n this.props.lastLogin\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 Co-Branded Creatives
\n */}\n - \n
\n \n \n Transact\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 {this.images.map((image, index) => {\n console.log('Image link:', image.link); // Debug log\n return (\n \n \n 
\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 { userLogin } from \"shared/store/actions\";\nimport { REQ_BY } from \"shared/store/types\";\nimport { DASHBOARD_URL } from \"../home/dashboard\";\nimport { BUILD_URL } from \"../home/home\";\nimport { PosterDialog } from \"../home/customModal\";\nimport CustomLoader from \"../forms/customLoader\";\nimport Footer from \"./footer\";\nimport { EYE_ICON, EYE_ICON_HIDDEN } from \"../forms/appEssentials\";\nimport {\n carouselImage3,\n large_mid,\n carouselImage4,\n} from \"../forms/appEssentials\";\nclass Login extends Component {\n constructor(props) {\n super(props);\n this.state = {\n username: { value: \"\" },\n password: { value: \"\" },\n showPassword: false,\n PosterOpen: true,\n display: false,\n };\n }\n handleEmpanel = () => {\n window.open(\"https://invwise.sundarammutual.com/distributor-empanelment\");\n };\n changeValue = (label) => (event) => {\n if (event.target.value.length <= 45) {\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 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 };\n\n signIn = async () => {\n try {\n const { showPassword, PosterOpen, display, nonce, ...others } =\n this.state;\n const keys = Object.keys(others);\n const findError = keys.every((key) => {\n return !!this.state[key].value;\n });\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 === \"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\n const payload = {\n username: encrypt(this.state.username.value),\n password: encrypt(this.state.password.value),\n ReqBy: REQ_BY,\n nonce: encrypt(nonce),\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;\n this.setState({\n display: false,\n });\n\n // /new-transaction\n if (DtData[0].tran_enable_flag === \"N\") {\n this.props.history.push(DASHBOARD_URL);\n } else {\n this.props.history.push(`/new-transaction`);\n }\n } else if (!!response && !!response.error) {\n alert(`${response.error}`);\n this.setState({\n display: false,\n username: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid details\",\n },\n password: {\n value: \"\",\n isError: true,\n errorMessage: \"Please enter valid details\",\n },\n });\n }\n }\n } catch (error) {\n alert(error);\n } finally {\n this.setState({ display: false });\n }\n };\n\n keyPress = (label) => (e) => {\n if (e.key === \"Enter\") {\n // Do code here\n if (label === \"username\") {\n this.passwordField.focus();\n } else {\n this.signIn();\n }\n e.preventDefault();\n }\n };\n closePoster = () => {\n this.setState({\n PosterOpen: false,\n });\n };\n\n render() {\n const { username, password } = this.state;\n return (\n \n {/*
\n \n \n \n );\n }\n}\n\nexport default connect(\n ({ authReducer }) => {\n const { token } = authReducer;\n return { token };\n },\n { userLogin }\n)(Login);\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\n// export function AlertUp(message) {\n// return (\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 this.props.history.push(\"/forgot-password\")}\n >\n Forgot Password?\n
\n \n \n 
\n \n
*/}\n \n (this.usernameField = ele)}\n onKeyPress={this.keyPress(\"username\")}\n />\n this.props.history.push(\"/forgot-userid\")}\n >\n Forgot User ID?\n
\n \n \n Please use the{\" \"}\n login details of{\" \"}\n KFINTECH MFS website\n Distributor Services\n
*/}\n SIGN IN
\n {/* \n Note : If you have already registered with KFin-DIT Portal,you\n may use same credentials to login here\n
\n \n
\n \n Already empanelled, but haven’t created an account?{\" \"}\n this.props.history.push(\"/register\")}\n >\n SIGN UP\n \n
\n\n \n
\n {/* \n \n
\n \n Download the app and transact on the go!\n
\n \n \n
\n \n \n
\n \n \n
\n \n \n Terms and Conditions*\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 { 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 { carouselImage3, large_mid } from \"../forms/appEssentials\";\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 this.setState({\n [label]: {\n value,\n isError: !value,\n errorMessage: `${label === \"userId\" ? \"User ID\" : label} is mandatory`,\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 (!isPasswordEqual) {\n this.setState({\n confirmPassword: { ...this.state.confirmPassword, isError: true },\n });\n this.confirmPasswordField.focus();\n return;\n }\n const payload = {\n UserId: this.state.userId.value,\n ARNCode: `ARN-${this.state.arnCode.value}`,\n password: this.state.password.value,\n };\n const response = await this.props.generateOtp(payload);\n if (!!response && !response.error) {\n this.props.history.push({\n pathname: \"/otp\",\n state: { payload: response },\n });\n } else {\n alert(`${response.error}`);\n }\n };\n\n render() {\n const { userId, password, arnCode, confirmPassword } = this.state;\n\n return (\n {message}
\n// \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\";\nimport {carouselImage3,large_mid} from \"../forms/appEssentials\"\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
*/}\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 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(\"/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, reGenerateOtp } 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 { token } =\n !!this.props.location &&\n !!this.props.location.state &&\n !!this.props.location.state.payload\n ? this.props.location.state.payload\n : {};\n this.state = {\n token,\n };\n }\n\n regenerteOtp = async () => {\n const { token } = this.state;\n const params = {\n token,\n };\n const response = await this.props.reGenerateOtp(params);\n if (response) {\n this.setState({\n token,\n });\n alert(\"An Otp has been resent to your registered Mobile Number\");\n }\n };\n\n submitOtp = async (enteredOtp) => {\n const { token } = this.state;\n const nonce = Math.floor(Math.random() * 999999);\n const params = {\n token,\n otp: enteredOtp?.join(\"\"),\n nonce,\n };\n const response = await this.props.registration(params);\n const { nonce: responseNonce } = response;\n\n if (responseNonce !== nonce) {\n alert(\"Unauthorized request\");\n return;\n }\n\n if (response) {\n this.props.history.push(\"./login\");\n } else {\n alert(\"Please enter valid otp\");\n }\n };\n\n render() {\n return (\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