\r\n \r\n )\r\n}\r\n\r\nexport default Footer;","export default __webpack_public_path__ + \"static/media/activate.24eb29fd.png\";","export default __webpack_public_path__ + \"static/media/airplanebubble.70abb4b0.png\";","export default __webpack_public_path__ + \"static/media/housebubble.5851973a.png\";","export default __webpack_public_path__ + \"static/media/lifestylepack.dd43b61b.png\";","import React, { Component } from 'react';\r\nimport {Link} from 'react-router-dom';\r\nimport $ from 'jquery';\r\nimport Nav from './navigation.js'\r\nimport Button from 'react-bootstrap/Button';\r\nimport padi from '../images/PADI.png';\r\nimport padiCircle from '../images/padi-circle.png';\r\nimport Carousel from 'react-bootstrap/Carousel';\r\nimport Carousel1 from 'react-bootstrap/Carousel';\r\nimport Form from 'react-bootstrap/Form';\r\nimport focus from '../images/focus.png';\r\nimport carBubble from '../images/car-bubble.png';\r\nimport financialAdvise from '../images/advise.png';\r\nimport Footer from './footer';\r\nimport activate from '../images/activate.png';\r\nimport airplaneBubble from '../images/airplanebubble.png';\r\nimport houseBubble from '../images/housebubble.png';\r\nimport lifestyleChoices from '../images/lifestylepack.png'; \r\nimport Modal1 from 'react-bootstrap/Modal';\r\nimport Modal from 'react-bootstrap/Modal';\r\n\r\n\r\nclass home extends Component { \r\n\r\n\r\n constructor(props){\r\n super(props)\r\n this.state={\r\n\r\n setup:false,\r\n firstname:\"\",\r\n lastname:\"\", \r\n gender:\"\",\r\n loader:false\r\n \r\n }\r\n\r\n this.setupPadi = this.setupPadi.bind(this);\r\n this.closeSetupPadi = this.closeSetupPadi.bind(this);\r\n this.backToTop = this.backToTop.bind(this);\r\n this.submitFullName = this.submitFullName.bind(this)\r\n this.backToMail = this.backToMail.bind(this);\r\n this.backToFullname = this.backToFullname.bind(this);\r\n this.validateEmail = this.validateEmail.bind(this);\r\n\r\n \r\n\r\n }\r\n \r\n \r\n componentDidMount(){ \r\n window.scrollTo(0, 0)\r\n this.navigationCheck();\r\n this.backToTop();\r\n this.backToFullname()\r\n\r\n }\r\n\r\n\r\n componentDidUpdate(){\r\n this.submitFullName()\r\n this.backToFullname()\r\n // this.submitGender()\r\n \r\n //this.setGenderValue()\r\n \r\n this.backToMail()\r\n \r\n }\r\n \r\n \r\n validateEmail(inputText)\r\n {\r\n var mailformat = /^\\w+([\\.-]?\\w+)*@\\w+([\\.-]?\\w+)*(\\.\\w{2,3})+$/;\r\n if(inputText.match(mailformat))\r\n {\r\n alert(\"Valid email address!\");\r\n\r\n return true\r\n \r\n }\r\n else\r\n {\r\n alert(\"You have entered an invalid email address!\");\r\n return false\r\n }\r\n }\r\n\r\n\r\n navigationCheck(){ \r\n\r\n \r\n $(document).scroll(function(){ \r\n\r\n if($(window).scrollTop() > 1){\r\n\r\n let nav = document.getElementById('nav1')\r\n \r\n nav.style.backgroundColor = 'rgba(17,101,173,0.85)'\r\n\r\n console.log(\"one\")\r\n }else{\r\n let nav = document.getElementById('nav1')\r\n \r\n nav.style.backgroundColor = 'transparent'\r\n console.log(\"two\")\r\n }\r\n\r\n }) \r\n\r\n }\r\n\r\n\r\n async submitFullName(){\r\n\r\n $('#submitFullName').click(function(){\r\n\r\n\r\n if($('.fullname').val() === \"\"){\r\n return alert('Please add a value')\r\n }\r\n\r\n this.setState({\r\n loader:true\r\n })\r\n //update state with values\r\n this.setState({\r\n firstname: $('.fullname').val(),\r\n lastname: $('.fullname').val()\r\n },async () => { \r\n\r\n//submit data values to server \r\n\r\n\r\nconst fullname = {\r\n firstname: this.state.firstname,\r\n lastname: this.state.lastname\r\n}\r\n\r\nlet firstname = this.state.firstname\r\n\r\nlet text2 = \"Great to meet you \" + firstname + \". Ok, next I'm going to need an address to send you details on your progress towards the retirement of your dreams!\"\r\n \r\n\r\n\r\nconsole.log(fullname)\r\n\r\n const pushFullName= await fetch('https://calculator.palpensions.com:44304/padi/user/personal/data/storefullname', { \r\n\r\n method:\"POST\",\r\n headers:{\r\n \"content-type\":\"application/JSON\"\r\n },\r\n body:JSON.stringify(fullname),\r\n mode:\"cors\",\r\n credentials:'include' \r\n })\r\n\r\n .then(response => response.json())\r\n .then(response => {\r\n \r\n\r\n console.log(response)\r\n\r\n this.setState({\r\n loader:false\r\n })\r\n\r\n $('#fullName').fadeOut('slow', function(){ \r\n \r\n $('#emailAddy').fadeIn('slow', function(){ \r\n\r\n let padiTalk = document.getElementById('padi-talk')\r\n padiTalk.innerHTML = text2 })\r\n\r\n\r\n $('#emailSubmission').click( async function(){ \r\n\r\n\r\n if($('#email').val() === \"\"){\r\n return alert('Please add a value')\r\n }\r\n\r\n\r\n if(!this.validateEmail($('#email').val())){\r\n return false\r\n } \r\n\r\n\r\n this.setState({\r\n loader:true\r\n })\r\n \r\n const emailData = { \r\n email: $('#email').val()\r\n } \r\n \r\n console.log(this.state.firstname)\r\n let firstname = this.state.firstname\r\n \r\n let text3 = \"Got it \" + firstname + \". I just sent you my first letter. Oops!! One last thing before we proceed. What is your gender?\"\r\n \r\n \r\n //forward email to api\r\n \r\n\r\n const pushEmail= await fetch('https://calculator.palpensions.com:44304/padi/user/personal/data/storeemailaddress', { \r\n\r\n method:\"POST\",\r\n headers:{\r\n \"content-type\":\"application/JSON\"\r\n },\r\n body:JSON.stringify(emailData),\r\n mode:\"cors\",\r\n credentials:'include' \r\n })\r\n \r\n .then(response => response.json())\r\n .then(response => { \r\n this.setState({\r\n loader:false\r\n })\r\n \r\n $('#emailAddy').fadeOut('slow', function(){ \r\n \r\n $('#gender').fadeIn('slow', function(){ \r\n\r\n let padiTalk = document.getElementById('padi-talk')\r\n padiTalk.innerHTML = text3 \r\n\r\n\r\n \r\n\r\n \r\n $('#Submission').click(async function(){ \r\n\r\n if($('.gender').val() === \"\"){\r\n return alert('Please add a value')\r\n }\r\n \r\n this.setState({\r\n loader:true\r\n })\r\n const genderData = {\r\n gender: $('.gender').val()\r\n }\r\n\r\n console.log(genderData)\r\n \r\n const pushGender= await fetch('https://calculator.palpensions.com:44304/padi/user/personal/data/storegender', { \r\n\r\n method:\"POST\",\r\n headers:{\r\n \"content-type\":\"application/JSON\"\r\n },\r\n body:JSON.stringify(genderData),\r\n mode:\"cors\",\r\n credentials:'include' \r\n })\r\n \r\n .then(response => response.json())\r\n .then(response => { \r\n this.setState({\r\n loader:false\r\n })\r\n \r\n $('#details-row').fadeOut('slow', function(){ \r\n \r\n $('#info-row').fadeIn('slow', function(){ \r\n \r\n \r\n \r\n \r\n \r\n })\r\n \r\n })\r\n \r\n })\r\n \r\n \r\n \r\n }.bind(this))\r\n \r\n }.bind(this))\r\n \r\n \r\n }.bind(this))\r\n \r\n })\r\n \r\n \r\n }.bind(this))\r\n\r\n\r\n \r\n\r\n \r\n }.bind(this))\r\n\r\n \r\n\r\n \r\n })\r\n\r\n\r\n\r\n })\r\n\r\n \r\n\r\n }.bind(this))\r\n}\r\n\r\n\r\n\r\nbackToFullname(){\r\n\r\n $('#backToFullname').click(function(){ \r\n \r\n let firstname = this.state.firstname\r\n \r\n let text1 = \" Hi, I’m PADI! What's your name? \"\r\n \r\n \r\n $('#emailAddy').fadeOut('slow', function(){ \r\n \r\n $('#fullName').fadeIn('slow', function(){ \r\n \r\n let padiTalk = document.getElementById('padi-talk')\r\n padiTalk.innerHTML = text1 \r\n \r\n })\r\n \r\n })\r\n \r\n }.bind(this))\r\n \r\n }\r\n\r\n\r\nbackToMail(){\r\n\r\n $('#backToMail').click(function(){ \r\n\r\n let firstname = this.state.firstname\r\n\r\n let text2 = \"Great to meet you \" + firstname + \". Ok, next I'm going to need an address to send you details on your progress towards the retirement of your dreams!\"\r\n \r\n \r\n $('#gender').fadeOut('slow', function(){ \r\n \r\n $('#emailAddy').fadeIn('slow', function(){ \r\n \r\n let padiTalk = document.getElementById('padi-talk')\r\n padiTalk.innerHTML = text2 \r\n \r\n })\r\n\r\n })\r\n\r\n }.bind(this))\r\n \r\n}\r\n\r\n\r\n\r\n backToTop(){\r\n $(\"#test, #activate\").on(\"click\", function() {\r\n console.log(\"clicked\")\r\n $(window).scrollTop(0);\r\n });\r\n }\r\n\r\n\r\n setupPadi(){\r\n this.setState({ \r\n setup:true\r\n })\r\n }\r\n\r\n closeSetupPadi(){\r\n this.setState({ \r\n setup:false\r\n})\r\n }\r\n \r\n \r\n render(){\r\n \r\n \r\n return(\r\n \r\n\r\n <> \r\n \r\n\r\n
\r\n
\r\n\r\n
\r\n
\r\n \r\n\r\n
\r\n Hey, I’m PADI!\r\n Sticking to your personal finance\r\n plans for the future\r\n can be difficult, but I'm \r\n here to help!\r\n
\r\n
\r\n
\r\n
\r\n
\r\n Who better to tell about the future\r\n
\r\n \r\n
\r\n of your dreams than your PAL. \r\n
\r\n
\r\n\r\n
\r\n
\r\n Take your PADI on a journey into your life. By providing\r\n information on your current contributions and retirement \r\n aspirations, your PADI will provide financial advisory to help you \r\n achieve the life you aspire to post retirement.\r\n
\r\n
\r\n\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n\r\n\r\n
\r\n\r\n \r\n\r\n \r\n \r\n
\r\n\r\n
\r\n\r\n\r\n {/*----------end of section 1---------*/}\r\n\r\n\r\n
\r\n\r\n
\r\n
\r\n \r\n Hey, I’m PADI!\r\n Sticking to your financial\r\n plans for the future\r\n can be difficult, but I am \r\n here to help!\r\n\r\n
\r\n
\r\n\r\n
\r\n \r\n
\r\n
\r\n
\r\n It takes just 3 simple steps to make me\r\n
\r\n \r\n
\r\n your PAL for life. \r\n
\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n Introduce yourself \r\n
\r\n
\r\n Introduce yourself to your PADI by providing basic personal \r\n information.\r\n
\r\n \r\n \r\n
\r\n\r\n
\r\n \r\n \r\n \r\n
\r\n Make your lifestyle choices\r\n
\r\n
\r\n Your PADI will walk you through a simple \r\n conversation to understand your current pension\r\n contributions and retirement aspirations\r\n
\r\n \r\n \r\n
\r\n\r\n
\r\n \r\n \r\n \r\n
\r\n Receive financial insights\r\n
\r\n
\r\n Get an immediate analysis of your contributions against your retirement lifestyle. \r\n Receive a recommendation on how to plan your retirement finances based on your personality test.\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n\r\n {/*----------end of section 2---------*/}\r\n\r\n\r\n
\r\n \r\n
\r\n
\r\n Not sure about your retirement lifestyle choices?\r\n
\r\n \r\n
\r\n Learn about your financial personality \r\n
\r\n
\r\n
\r\n \r\n
\r\n\r\n\r\n
\r\n\r\n\r\n \r\n
\r\n\r\n\r\n
\r\n\r\n {/*----------end of section 3---------*/}\r\n\r\n
\r\n
\r\n
\r\n Some beneftis of having a PADI!\r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n
Focus
\r\n
Keep your retirement aspirations in view always. Never lose sight of the retirement of your dreams
\r\n \r\n \r\n \r\n \r\n\r\n
\r\n
\r\n\r\n\r\n {/*----------end of section 4---------*/}\r\n\r\n
\r\n\r\n\r\n \r\n\r\n );\r\n\r\n }\r\n\r\n}\r\n\r\nexport default formB","export default __webpack_public_path__ + \"static/media/housing.01383970.png\";","export default __webpack_public_path__ + \"static/media/feeding.cb571bad.png\";","export default \"data:image/png;base64,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\"","export default __webpack_public_path__ + \"static/media/vehicle.10a403f4.png\";","export default __webpack_public_path__ + \"static/media/utility.aa20d6bc.png\";","export default __webpack_public_path__ + \"static/media/leisure.cd4265dc.png\";","export default __webpack_public_path__ + \"static/media/maleExtravagant.9d55a8d8.jpg\";","export default __webpack_public_path__ + \"static/media/maleModerate.d52a48c7.jpg\";","export default __webpack_public_path__ + \"static/media/maleConservative.6f5d8dad.jpg\";","export default __webpack_public_path__ + \"static/media/femaleExtravagant.b85fee79.jpg\";","export default __webpack_public_path__ + \"static/media/femaleModerate.a44ea679.jpg\";","export default __webpack_public_path__ + \"static/media/femaleConservative.aba179bd.jpg\";","import React, {Component} from \"react\";\r\nimport {Link} from \"react-router-dom\";\r\nimport $ from 'jquery';\r\nimport Form from 'react-bootstrap/Form';\r\nimport Button from \"react-bootstrap/Button\";\r\nimport padiCircle from '../images/padi-circle.png';\r\nimport Plotly from 'plotly.js-dist';\r\nimport transparent from '../images/transparent.png';\r\nimport Card from \"react-bootstrap/Card\";\r\nimport Nav from \"./navigation.js\";\r\nimport Footer from './footer.js';\r\nimport housing from '../images/housing.png';\r\nimport feeding from '../images/feeding.png';\r\nimport healthcare from '../images/healthCare.png';\r\nimport vehicle from '../images/vehicle.png';\r\nimport utility from '../images/utility.png';\r\nimport leisure from '../images/leisure.png';\r\nimport savings from '../images/potSize.png';\r\nimport maleExtravagantBanner from '../images/maleExtravagant.jpg';\r\nimport maleModerateBanner from '../images/maleModerate.jpg';\r\nimport maleConservativeBanner from '../images/maleConservative.jpg';\r\nimport femaleExtravagantBanner from '../images/femaleExtravagant.jpg';\r\nimport femaleModerateBanner from '../images/femaleModerate.jpg';\r\nimport femaleConservativeBanner from '../images/femaleConservative.jpg';\r\nimport numeral from 'numeral';\r\nimport Modal1 from 'react-bootstrap/Modal';\r\nimport Modal from 'react-bootstrap/Modal';\r\nimport moment from 'moment';\r\nimport Badge from 'react-bootstrap/Badge';\r\n\r\n\r\n\r\nclass report extends Component{\r\n\r\n\r\n constructor(props){\r\n super(props)\r\n this.state={\r\n update:false,\r\n loader:true,\r\n firstname:\"\",\r\n male:false,\r\n female:false,\r\n banner:\"\",\r\n desiredPensionPot:\"\",\r\n currentFutureValue:\"\",\r\n yearsToRetirement:\"\",\r\n avcValue:\"\",\r\n currentPensionPot:\"\",\r\n dob:\"\",\r\n currentContribution:\"\",\r\n expectedBenefit:\"\",\r\n lumpSum:\"\",\r\n conservativeHealthAllocation: \"\",\r\n conservativeHealthPercentage: \"\",\r\n moderateHealthAllocation: \"\",\r\n moderateHealthPercentage: \"\",\r\n extravagantHealthAllocation: \"\",\r\n extravagantHealthPercentage: \"\",\r\n conservativeFeedingAllocation: \"\",\r\n conservativeFeedingPercentage: \"\",\r\n moderateFeedingAllocation: \"\",\r\n moderateFeedingPercentage: \"\",\r\n extravagantFeedingAllocation: \"\",\r\n extravagantFeedingPercentage: \"\",\r\n conservativeHousingAllocation: \"\",\r\n conservativeHousingPercentage: \"\",\r\n moderateHousingAllocation : \"\",\r\n moderateHousingPercentage : \"\",\r\n extravagantHousingAllocation : \"\",\r\n extravagantHousingPercentage : \"\",\r\n conservativeTransportationAllocation:\"\",\r\n conservativeTransportationPercentage: \"\",\r\n moderateTransportationAllocation : \"\",\r\n moderateTransportationPercentage: \"\",\r\n extravagantTransportationAllocation: \"\",\r\n extravagantTransportationPercentage: \"\",\r\n conservativeUtilityAllocation: \"\",\r\n conservativeUtilityPercentage: \"\",\r\n moderateUtilityAllocation: \"\",\r\n moderateUtilityPercentage: \"\",\r\n extravagantUtilityAllocation: \"\",\r\n extravagantUtilityPercentage:\"\",\r\n conservativeLeisureAllocation: \"\",\r\n conservativeLeisurePercentage: \"\",\r\n moderateLeisureAllocation: \"\",\r\n moderateLeisurePercentage: \"\",\r\n extravagantLeisureAllocation: \"\",\r\n extravagantLeisurePercentage:\"\" ,\r\n conservativeSavingsPercentage:\"\",\r\n moderateSavingsPercentage:\"\",\r\n extravagantSavingsPercentage:\"\",\r\n personalityIndex:\"\",\r\n personalityHeading:\"\",\r\n personalityStory:\"\", \r\n personalitySubHeading:\"\", \r\n totalPersonalityScore:\"\"\r\n\r\n }\r\n\r\n\r\n this.retrieveUsername = this.retrieveUsername.bind(this)\r\n this.retrieveFinancialData = this.retrieveFinancialData.bind(this)\r\n this.backToTop = this.backToTop.bind(this);\r\n this.FindAVC = this.FindAVC.bind(this);\r\n this.pmt = this.pmt.bind(this);\r\n this.FV = this.FV.bind(this);\r\n this.openUpdate = this.openUpdate.bind(this)\r\n this.closeUpdate = this.closeUpdate.bind(this)\r\n this.updateUserResults = this.updateUserResults.bind(this)\r\n this.formatNumeral = this.formatNumeral.bind(this)\r\n this.personalityProcessing = this.personalityProcessing.bind(this)\r\n this.navigationCheck = this.navigationCheck.bind(this)\r\n\r\n }\r\n\r\n async componentDidMount(){\r\n this.navigationCheck()\r\n window.scrollTo(0, 0)\r\n this.retrieveUsername()\r\n await this.retrieveFinancialData()\r\n await this.personalityProcessing()\r\n\r\n \r\n this.backToTop()\r\n \r\n let contr= parseInt(20145.43)\r\n console.log(this.FindAVC(contr))\r\n console.log(this.pmt(0.1/12,480,2000000,20000000,0))\r\n console.log(this.FV(0.1/12,480,-contr,2000000,0))\r\n \r\n\r\n }\r\n\r\n async componentDidUpdate(){\r\n \r\n }\r\n\r\n\r\n openUpdate(){ \r\n this.setState({ \r\n update: true \r\n }, () => {\r\n $('.contribution').val(this.state.currentContribution)\r\n $('.savings').val(this.state.currentPensionPot)\r\n $('.aspiration').val(this.state.desiredPensionPot)\r\n $('.retirement').val(this.state.yearsToRetirement)\r\n console.log(this.state.dob)\r\n this.updateUserResults()\r\n this.formatNumeral()\r\n \r\n })\r\n }\r\n\r\n\r\n\r\n closeUpdate(){ \r\n this.setState({ \r\n update: false\r\n })\r\n }\r\n\r\n \r\n\r\n navigationCheck(){ \r\n\r\n \r\n $(document).scroll(function(){ \r\n let nav = document.getElementById('nav1')\r\n if($(window).scrollTop() > 1){\r\n \r\n \r\n \r\n nav.style.backgroundColor = 'rgba(255,255,255,0.85)'\r\n \r\n console.log(\"one\")\r\n }else{\r\n \r\n nav.style.backgroundColor = 'transparent'\r\n console.log(\"two\")\r\n }\r\n \r\n }) \r\n \r\n }\r\n\r\n\r\n async updateUserResults(){ \r\n \r\n $('.resultUpdate').click(async function(){ \r\n //get all input field values\r\n let currentContribution = numeral($('.contribution').val()).value()\r\n let desiredPensionPot = numeral($('.aspiration').val()).value()\r\n let currentPensionPot = numeral($('.savings').val()).value()\r\n let yearsToRetirement = $('.retirement').val()\r\n \r\n\r\n let resultUpdateObject = { \r\n currentContribution, \r\n desiredPensionPot,\r\n currentPensionPot,\r\n yearsToRetirement,\r\n }\r\n\r\n console.log(resultUpdateObject)\r\n alert(\"start\")\r\n\r\n const pushUpdateData = await fetch('https://calculator.palpensions.com:44304/padi/user/financial/Data/updateResult', { \r\n method:\"POST\",\r\n headers:{\r\n \"content-type\":\"application/JSON\"\r\n },\r\n body: JSON.stringify(resultUpdateObject),\r\n mode:\"cors\",\r\n credentials:'include' \r\n })\r\n \r\n .then(response => response.json())\r\n .then(response => { \r\n\r\n console.log(\"updated\")\r\n console.log(response)\r\n let positiveAVCValue = response.avcValue\r\n\r\n this.setState({\r\n\r\n desiredPensionPot: numeral(response.desiredPensionPot).format(0,0),\r\n currentFutureValue : numeral(response.currentFutureValue).format(0,0),\r\n yearsToRetirement : response.yearsToRetirement,\r\n avcValue : numeral(positiveAVCValue).format(0,0),\r\n currentContribution: numeral(response.currentContribution).format(0,0),\r\n currentPensionPot : numeral(response.currentPensionPot).format(0,0),\r\n update: false,\r\n\r\n }, ()=>{ \r\n window.location.replace(\"https://palCalc.palpensions.com/Padi/setup/advisory/results\")\r\n })\r\n\r\n\r\n })\r\n\r\n\r\n\r\n\r\n }.bind(this))\r\n\r\n }\r\n\r\n backToTop(){\r\n $(\"#reportScroll\").on(\"click\", function() {\r\n console.log(\"clicked\")\r\n $(window).scrollTop(800);\r\n });\r\n }\r\n\r\n\r\n async formatNumeral(){\r\n $('.contribution').keyup(function(){ \r\n let formatedValue = numeral($('.contribution').val()).format(0,0)\r\n console.log(formatedValue)\r\n $('.contribution').val(formatedValue)\r\n \r\n });\r\n\r\n\r\n $('.savings').keyup(function(){ \r\n let formatedValue = numeral($('.savings').val()).format(0,0)\r\n console.log(formatedValue)\r\n $('.savings').val(formatedValue)\r\n \r\n });\r\n \r\n $('.aspiration').keyup(function(){ \r\n let formatedValue = numeral($('.aspiration').val()).format(0,0)\r\n console.log(formatedValue)\r\n $('.aspiration').val(formatedValue)\r\n \r\n });\r\n \r\n\r\n }\r\n\r\n\r\n async retrieveFinancialData(){ \r\n const pullFinancialData = await fetch('https://calculator.palpensions.com:44304/padi/user/financial/data/getfinancialfeedback', { \r\n method:\"POST\",\r\n headers:{\r\n \"content-type\":\"application/JSON\"\r\n },\r\n mode:\"cors\",\r\n credentials:'include' \r\n })\r\n\r\n .then(response => response.json())\r\n .then(response => { \r\n \r\n console.log(response)\r\n if(response.personalityIndex.personalityIndex){\r\n console.log(response.personalityIndex.personalityIndex)\r\n \r\n\r\n\r\n let positiveAVCValue = response.financialBasics.avcValue\r\n\r\n //fill update form with user details\r\n\r\n \r\n\r\n\r\n\r\n this.setState({ \r\n personalityIndex: response.personalityIndex.personalityIndex,\r\n totalPersonalityScore: response.personalityIndex.totalPersonalityScore,\r\n desiredPensionPot: numeral(response.financialBasics.desiredPensionPot).format(0,0),\r\n currentFutureValue : numeral(response.financialBasics.currentFutureValue).format(0,0),\r\n yearsToRetirement : response.financialBasics.yearsToRetirement,\r\n avcValue : numeral(positiveAVCValue).format(0,0),\r\n currentContribution: numeral(response.financialBasics.currentContribution).format(0,0),\r\n currentPensionPot : numeral(response.financialBasics.currentPensionPot).format(0,0),\r\n expectedBenefit: numeral(response.financialBasics.expectedBenefit).format(0,0),\r\n lumpSum: numeral(response.financialBasics.lumpSum).format(0,0),\r\n conservativeHealthAllocation: numeral(response.conservativeHealth.allocation).format(0,0),\r\n conservativeHealthPercentage: numeral(response.conservativeHealth.percentage).format(0,0),\r\n moderateHealthAllocation: numeral(response.moderateHealth.allocation).format(0,0),\r\n moderateHealthPercentage: numeral(response.moderateHealth.percentage).format(0,0),\r\n extravagantHealthAllocation: numeral(response.extravagantHealth.allocation).format(0,0),\r\n extravagantHealthPercentage: numeral(response.extravagantHealth.percentage).format(0,0),\r\n conservativeFeedingAllocation: numeral(response.conservativeFeeding.allocation).format(0,0),\r\n conservativeFeedingPercentage: numeral(response.conservativeFeeding.percentage).format(0,0),\r\n moderateFeedingAllocation: numeral(response.moderateFeeding.allocation).format(0,0),\r\n moderateFeedingPercentage: numeral(response.moderateFeeding.percentage).format(0,0),\r\n extravagantFeedingAllocation: numeral(response.extravagantFeeding.allocation).format(0,0),\r\n extravagantFeedingPercentage: numeral(response.extravagantFeeding.percentage).format(0,0),\r\n conservativeHousingAllocation: numeral(response.conservativeHousing.allocation).format(0,0),\r\n conservativeHousingPercentage: numeral(response.conservativeHousing.percentage).format(0,0),\r\n moderateHousingAllocation : numeral(response.moderateHousing.allocation).format(0,0),\r\n moderateHousingPercentage : numeral(response.moderateHousing.percentage).format(0,0),\r\n extravagantHousingAllocation : numeral(response.extravagantHousing.allocation).format(0,0),\r\n extravagantHousingPercentage : numeral(response.extravagantHousing.percentage).format(0,0),\r\n conservativeTransportationAllocation: numeral(response.conservativeTransportation.allocation).format(0,0),\r\n conservativeTransportationPercentage: numeral(response.conservativeTransportation.percentage).format(0,0),\r\n moderateTransportationAllocation : numeral(response.moderateTransportation.allocation).format(0,0),\r\n moderateTransportationPercentage: numeral(response.moderateTransportation.percentage).format(0,0),\r\n extravagantTransportationAllocation: numeral(response.extravagantTransportation.allocation).format(0,0),\r\n extravagantTransportationPercentage: numeral(response.extravagantTransportation.percentage).format(0,0),\r\n conservativeUtilityAllocation: numeral(response.conservativeUtility.allocation).format(0,0),\r\n conservativeUtilityPercentage: numeral(response.conservativeUtility.percentage).format(0,0),\r\n moderateUtilityAllocation: numeral(response.moderateUtility.allocation).format(0,0),\r\n moderateUtilityPercentage: numeral(response.moderateUtility.percentage).format(0,0),\r\n extravagantUtilityAllocation: numeral(response.extravagantUtility.allocation).format(0,0),\r\n extravagantUtilityPercentage: numeral(response.extravagantUtility.percentage).format(0,0),\r\n conservativeLeisureAllocation: numeral(response.conservativeLeisure.allocation).format(0,0),\r\n conservativeLeisurePercentage: numeral(response.conservativeLeisure.percentage).format(0,0),\r\n moderateLeisureAllocation: numeral(response.moderateLeisure.allocation).format(0,0),\r\n moderateLeisurePercentage: numeral(response.moderateLeisure.percentage).format(0,0),\r\n extravagantLeisureAllocation: numeral(response.extravagantLeisure.allocation).format(0,0),\r\n extravagantLeisurePercentage: numeral(response.extravagantLeisure.percentage).format(0,0),\r\n conservativeSavingsPercentage: numeral(response.conservativeSavings.percentage).format(0,0),\r\n moderateSavingsPercentage: numeral(response.moderateSavings.percentage).format(0,0),\r\n extravagantSavingsPercentage: numeral(response.extravagantSavings.percentage).format(0,0),\r\n loader:false\r\n }, () =>{ \r\n console.log(response.personalityIndex)\r\n var data = [\r\n {\r\n domain: { x: [0, 1], y: [0, 1] },\r\n value: this.state.totalPersonalityScore,\r\n title: { text: \"Financial Personality Guage\", font:{color:\"#23b7af\", family:\"Bauhaus\", size:20}},\r\n type: \"indicator\",\r\n mode: \"gauge+number\",\r\n delta: { reference: 400 },\r\n number:{font:{color:\"#23b7af\", family:\"Bauhaus\"}},\r\n gauge: { axis: { range: [null, 100] }, bordercolor: '#005aa1', bar:{color:\"#23b7af\"}, bgColor:\"#005aa1\" }\r\n }\r\n ];\r\n\r\n var config = {responsive: true}\r\n \r\n var layout = { width:\"\", height:\"\"};\r\n Plotly.newPlot('scoreLine', data, layout, config);\r\n })\r\n\r\n }else{\r\n\r\n window.location.href = \"https://palcalc.palpensions.com/Padi/setup/advisory/results\"\r\n }\r\n \r\n })\r\n\r\n \r\n\r\n\r\n }\r\n\r\n\r\n\r\n async retrieveUsername(){\r\n\r\n\r\n const pullFirstname= await fetch('https://calculator.palpensions.com:44304/padi/user/personal/data/getfirstname', { \r\n method:\"POST\",\r\n headers:{\r\n \"content-type\":\"application/JSON\"\r\n },\r\n mode:\"cors\",\r\n credentials:'include' \r\n })\r\n\r\n .then(response => response.json())\r\n .then(response => { \r\n\r\n console.log(response)\r\n this.setState({ \r\n\r\n firstname: response.firstname,\r\n male: response.male,\r\n female:response.female\r\n })\r\n\r\n })\r\n \r\n }\r\n\r\n\r\n\r\n async pmt(rate_per_period, number_of_payments, present_value, future_value, type){\r\n if(rate_per_period != 0.0){\r\n // Interest rate exists\r\n var q = Math.pow(1 + rate_per_period, number_of_payments);\r\n let ans= (rate_per_period * (future_value + (q * present_value))) / ((-1 + q) * (1 + rate_per_period * (type)));\r\n return parseInt(ans)\r\n } else if(number_of_payments != 0.0){\r\n // No interest rate, but number of payments exists\r\n return -(future_value + present_value) / number_of_payments;\r\n }\r\n \r\n return 0;\r\n }\r\n \r\n\r\n async FindAVC(currentPensionPot){\r\n let payment =await this.pmt(0.1/12,480,2000000,20000000,0)\r\n console.log(typeof payment)\r\n console.log(typeof currentPensionPot)\r\n\r\n let p = await parseInt(payment)\r\n console.log(typeof p)\r\n \r\n \r\n let Avc = currentPensionPot - p\r\n\r\n console.log(Avc)\r\n\r\n \r\n \r\n }\r\n\r\n\r\n\r\n async personalityProcessing(){\r\n //personalitydescision \r\n let conservativeRecommendation = document.getElementById('conservativeRecommendation')\r\n let moderateRecommendation = document.getElementById('moderateRecommendation')\r\n let extravagantRecommendation = document.getElementById('extravagentRecommendation')\r\n \r\n if(this.state.personalityIndex === 1){\r\n $('#conservativeRecommendation').fadeIn()\r\n this.setState({\r\n personalityHeading: \"The Conservative Type\" ,\r\n personalitySubHeading: \"Retire to a life \",\r\n personalityStory:\"Regardless of how wealthy you are or may become, your natural habits ensure you always have more than you require. You are satisfied with the company of your family or being engaged by a hobby of your choosing. Friends are important and you keep them around but are not directed by their actions and they have the least impact on your finances. You are extremely particular about things like food, health and vacations and most of the time prefer to be fully in control of these parts of your life.\"\r\n })\r\n \r\n if(this.state.male){\r\n this.setState({\r\n banner: maleConservativeBanner\r\n })\r\n }\r\n\r\n if(this.state.female){\r\n this.setState({\r\n banner: femaleConservativeBanner\r\n })\r\n }\r\n\r\n\r\n }else if(this.state.personalityIndex === 2){\r\n $('#moderateRecommendation').fadeIn()\r\n\r\n this.setState({\r\n personalityHeading: \"The Moderate Type\" ,\r\n personalitySubHeading: \"Retire to a life of quality not quantity\",\r\n personalityStory:\"You understand that life is meant to be lived but you are conscious to not let yourself go overboard. Giving yourself a treat is important to you and you do not opt for anything but the best when it comes to matters relating to your wellbeing. Slightly extroverted friends and family are a big deal and creating time to schedule activities is not considered an expense but an investment in a quality life.\"\r\n \r\n })\r\n\r\n\r\n if(this.state.male){\r\n this.setState({\r\n banner: maleModerateBanner\r\n })\r\n }\r\n\r\n if(this.state.female){\r\n this.setState({\r\n banner: femaleModerateBanner\r\n })\r\n}\r\n\r\n\r\n }else if(this.state.personalityIndex === 3){\r\n $('#extravagantRecommendation').fadeIn()\r\n \r\n this.setState({\r\n personalityHeading: \"The Extravagant Type\" ,\r\n personalitySubHeading: \"Retire to a life of self exploration\",\r\n personalityStory:\"You are financially savvy but intentional about choosing to give your impulses the freedom to express. The largest impact on your finances comes from this need to explore unconditionally. You maintain a network who appreciate this approach towards life. Living for today is scary to some but not you. You have a strong belief in your ability to maintain a life that is both premium and financially secure. You love life and see no reason to not live… to the fullest.\"\r\n \r\n })\r\n\r\n if(this.state.male){\r\n this.setState({\r\n banner: maleExtravagantBanner\r\n })\r\n }\r\n\r\n if(this.state.female){\r\n this.setState({\r\n banner: femaleExtravagantBanner\r\n })\r\n }\r\n }\r\n }\r\n\r\n\r\n async FV(rate, nper, pmt, pv, type) {\r\n var pow = Math.pow(1 + rate, nper),\r\n fv;\r\n if (rate) {\r\n fv = (pmt*(1+rate*type)*(1-pow)/rate)-pv*pow;\r\n } else {\r\n fv = -1 * (pv + pmt * nper);\r\n }\r\n return fv.toFixed(0);\r\n }\r\n\r\n\r\n\r\n\r\n\r\n render(){\r\n\r\n\r\n \r\n\r\n let breakdownIntro\r\n let breakdown \r\n\r\n console.log(this.state.avcValue)\r\n\r\n if(parseInt(this.state.avcValue) > 0) { \r\n\r\n breakdownIntro =
\r\n
\r\n Whoop!!! {this.state.firstname}!\r\n
\r\n
\r\n from my understanding of your retirement aspirations\r\n
\r\n \r\n
\r\n you are going to achieve the retirement of your dreams \r\n
\r\n\r\n
\r\n\r\n breakdown =
\r\n \r\n
\r\n Your minimum balance at retirement would be\r\n
\r\n\r\n
\r\n N{this.state.currentFutureValue}\r\n \r\n
\r\n\r\n \r\n
\r\n and, based on my understanding of your goals, you are ready to live the life you aspire towards post retirement and\r\n have extra for further investments. At retirement you can expect a likely lump sum payment of \r\n
\r\n\r\n
\r\n N{this.state.lumpSum}\r\n \r\n
\r\n\r\n
\r\n before your monthly pension payments commence.\r\n
\r\n from my understanding of your retirement aspirations\r\n
\r\n \r\n
\r\n you will need to contribute N{positiveAVCValue} extra monthly \r\n
\r\n\r\n
\r\n\r\n breakdown =
\r\n \r\n
\r\n Your desired balance at retirement is\r\n
\r\n\r\n
\r\n N{this.state.desiredPensionPot}\r\n \r\n
\r\n\r\n
\r\n and your future total savings will be \r\n
\r\n\r\n
\r\n N{this.state.currentFutureValue}\r\n \r\n
\r\n \r\n
\r\n based on my understanding of your goals, you will need to top up by\r\n
\r\n\r\n
\r\n N{positiveAVCValue}/month \r\n \r\n
\r\n
\r\n from next month, to live the retirement of your dreams in {this.state.yearsToRetirement}years.\r\n We recommend that you subscribe to the Additional Voluntary Contribution Product (AVC) in order to \r\n top-up your monthly savings.\r\n
{this.state.firstname}, adjust and save your information
\r\n \r\n \r\n \r\n
\r\n\r\n
\r\n\r\n
\r\n\r\n
\r\n Current Monthly Contribution\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n\r\n
\r\n\r\n\r\n
\r\n\r\n
\r\n\r\n
\r\n Current Pension Pot size\r\n
\r\n\r\n \r\n\r\n\r\n\r\n
\r\n\r\n \r\n\r\n\r\n\r\n
\r\n\r\n\r\n
\r\n\r\n
\r\n\r\n
\r\n Desired Pension Pot Size\r\n
\r\n\r\n \r\n\r\n\r\n
\r\n\r\n \r\n\r\n\r\n\r\n
\r\n\r\n
\r\n\r\n
\r\n\r\n
\r\n No of years to Retirement\r\n
\r\n\r\n \r\n\r\n\r\n
\r\n\r\n
\r\n\r\n\r\n
\r\n\r\n
\r\n \r\n \r\n\r\n
\r\n\r\n\r\n\r\n \r\n\r\n\r\n\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n\r\n\r\n )\r\n\r\n}\r\n }\r\n\r\n\r\n\r\n}\r\n\r\nexport default report","import logo from './logo.svg';\r\nimport './App.css';\r\nimport '../node_modules/bootstrap/dist/css/bootstrap.css';\r\nimport '../node_modules/bootstrap/dist/js/bootstrap.js';\r\nimport $ from 'jquery';\r\nimport home from './components/home.js';\r\nimport nav from './components/navigation.js';\r\nimport form from './components/form.js';\r\nimport formB from './components/formB.js';\r\nimport report from './components/report.js';\r\nimport { BrowserRouter as Router, Switch, Route, Link } from \"react-router-dom\";\r\nfunction App() {\r\n return (\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n\r\n );\r\n}\r\n\r\nexport default App;\r\n","const reportWebVitals = onPerfEntry => {\r\n if (onPerfEntry && onPerfEntry instanceof Function) {\r\n import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\r\n getCLS(onPerfEntry);\r\n getFID(onPerfEntry);\r\n getFCP(onPerfEntry);\r\n getLCP(onPerfEntry);\r\n getTTFB(onPerfEntry);\r\n });\r\n }\r\n};\r\n\r\nexport default reportWebVitals;\r\n","import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport {BrowserRouter} from 'react-router-dom';\r\nimport './index.css';\r\nimport $ from 'jquery';\r\nimport App from './App';\r\nimport reportWebVitals from './reportWebVitals';\r\n\r\nReactDOM.render(\r\n\r\n \r\n , document.getElementById('root')\r\n);\r\n\r\n// If you want to start measuring performance in your app, pass a function\r\n// to log results (for example: reportWebVitals(console.log))\r\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\r\nreportWebVitals();\r\n"],"sourceRoot":""}
\r\n\r\n 
\r\n 
\r\n 
\r\n 
\r\n 
\r\n\r\n 
\r\n\r\n\r\n\r\n 
\r\n