\n \n \n \n \n {icon && (\n \n {icon}\n \n )}\n \n \n {title}\n \n \n {subtitle && (\n \n \n {subtitle}\n \n \n )}\n \n \n \n
\n \n )\n}\n","export const destinations = [\n {\n id: 0,\n code: 'PAY_DEBTS',\n title: 'Pagar deudas',\n subtitle: '',\n icon: 'AttachMoney',\n selected: false,\n },\n {\n id: 1,\n code: 'EXPAND_YOUR_HOME',\n title: 'Ampliar tu hogar',\n subtitle: '',\n icon: 'HomeWork',\n selected: false,\n },\n {\n id: 2,\n code: 'REPAIR_YOUR_CAR',\n title: 'Reparar tu auto',\n subtitle: '',\n icon: 'DirectionsCar',\n selected: false,\n },\n {\n id: 3,\n code: 'CAPITAL_YOUR_BUSINESS',\n title: 'Capital para tu negocio',\n subtitle: '',\n icon: 'BusinessCenterIcon',\n selected: false,\n },\n {\n id: 4,\n code: 'TRAVELS_AND_TOURISM',\n title: 'Viajes y turismo',\n subtitle: '',\n icon: 'Airplanemode',\n selected: false,\n },\n {\n id: 5,\n code: 'OTHER_PURPOSES',\n title: 'Otros fines',\n subtitle: '',\n icon: 'Beenhere',\n selected: false,\n }\n ]","import React, { useCallback, useState } from 'react'\nimport Grid from '@mui/material/Grid'\nimport { Box } from '../box'\nimport { destinations } from '../../constants/destinoPrestamo/index'\nimport { useDispatch } from 'react-redux'\nimport { setDestinationState } from 'context/reducer/quota'\n\nimport {\n AttachMoney,\n BusinessCenterOutlined,\n HomeWorkOutlined,\n DirectionsCarOutlined,\n BeenhereOutlined,\n AirplanemodeActiveOutlined,\n} from '@mui/icons-material'\n\nexport const Destination: React.FC<{isMobile: boolean}> = ({isMobile}) => {\n const [options, setOptions] = useState(destinations)\n const dispatch = useDispatch()\n\n const icons = [\n \n \n ¿Qué destino tendrá el préstamo?\n \n \n {options.map((item: any, index) => (\n \n \n ))}\n \n
\n )\n}\n","import React from 'react'\nimport { ExpandMore } from '@mui/icons-material'\nimport { AccordionSummary, Grid } from '@mui/material'\n\nimport { withStyles } from '@mui/styles';\n\nconst MuiAccordionSummary = withStyles({\n root: {\n borderRightWidth: 0,\n borderLeftWidth: 0,\n margin: 0,\n marginTop: '16px',\n },\n expanded: {\n minHeight: '30px !important',\n },\n content: {\n margin: 0,\n '&$expanded': {\n margin: '0',\n padding: '0',\n },\n },\n expandIcon: {\n marginRight: 0,\n paddingTop: 0,\n },\n})(AccordionSummary)\n\nexport const Summary: React.FC<{ open: number; index: number; term: any }> = ({\n open,\n index,\n term,\n}) => {\n return (\n \n \n {headerText}\n \n
\n )\n}","import React, { FC } from 'react'\nimport { useSelector } from 'react-redux'\nimport { RootState } from 'context'\nimport { AppState } from 'interfaces/app'\nimport Info from '@mui/icons-material/Info'\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\nimport Tooltip from '@mui/material/Tooltip'\nimport './index.css'\n\nexport interface CustomTooltipProps {\n tooltipText?: string\n}\n\nexport const CustomTooltip: FC\n\t\t\t
\n \n *Valores referenciales, no son considerados como una oferta formal de\n préstamo.\n
\n
\n La oferta definitiva está sujeta al cumplimiento de las condiciones y\n políticas referentes a capacidad de pago.\n \n
\n )\n}\n","import React from 'react'\nimport { Features } from './features'\nimport { DetailHeader } from './detail-header'\nimport { DetailItem } from './detail-item'\nimport { Condition } from './condition'\nimport { animated } from 'react-spring'\nimport useFadeInFromAvobe from 'hooks/useFadeInFromAvobe'\n\nexport const CreditDetail: React.FC<{ term: any }> = ({ term }) => {\n const props = useFadeInFromAvobe(0)\n\n return (\n \n
\n La oferta definitiva está sujeta al cumplimiento de las condiciones y\n políticas referentes a capacidad de pago.\n \n
\n {term.quotaText && (\n \n
\n
\n \n )}\n
\n )\n}\n","export const credit = {\n rate: 15.60/100,\n terms: [ 12, 24, 36, 48, 60 ],\n paymentPeriod: 12,\n} ","import { credit } from 'constants/credit'\n\n/* Fornula para el calculo de la cuota en base a un plazo, capital inicial y tasa de interes\n A = VP ((i(1 + i)^n) / ((1 + i)^n – 1))\n*/\nexport const quotaFormula = (amount: string) => {\n const regex = /\\./g\n const capital = parseInt(amount.replace(regex, ''),10)\n return credit.terms.map((term) => {\n return quotaSingleFormula(capital, term)\n })\n}\n\nexport const quotaSingleFormula = (capital: number, term: number) => {\n const efectiveRate = credit.rate / credit.paymentPeriod\n const numerator = efectiveRate * Math.pow(1 + efectiveRate, term)\n const denominator = Math.pow(1 + efectiveRate, term) - 1\n const quota = capital * (numerator / denominator)\n const queotaWithInsurance = quota + ((1.1232 / 100) * capital * 30) / 360\n const totalInterest = calcTotalInterest(term, capital, quota)\n const insurance = totalInterest * (10.83 / 100) \n const totalAPagar =\n capital +\n parseFloat(totalInterest.toFixed(2)) +\n parseFloat(insurance.toFixed(2))\n const numberFormater = new Intl.NumberFormat('de-DE', {\n minimumFractionDigits: 2,\n })\n return {\n capital: capital.toLocaleString('de-DE'),\n term: term,\n quota: numberFormater.format(Number(queotaWithInsurance.toFixed(2))),\n totalInterest: numberFormater.format(Number(totalInterest.toFixed(2))),\n seguro: numberFormater.format(Number(insurance.toFixed(2))),\n total: numberFormater.format(Number(totalAPagar.toFixed(2))),\n }\n}\n\nconst calcTotalInterest = (term: number, capital: number, quota: number) => {\n let balance = capital\n const quotasRate: number[] = []\n for (let i = 0; i < term; i++) {\n const quotaRate = (balance * credit.rate) / credit.paymentPeriod\n balance = balance - (quota - quotaRate)\n quotasRate.push(quotaRate)\n }\n return quotasRate.reduce((a, b) => a + b, 0)\n}\n\n","import React, { useEffect, useState } from 'react'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { animated } from 'react-spring'\nimport { setTermState, setInitialQuota } from 'context/reducer/quota'\nimport { Grid } from '@mui/material'\nimport { RootState } from 'context'\nimport { quotaSingleFormula } from 'utils/quotaFormula'\nimport { QuotaState } from 'interfaces/quota'\nimport { CreditDetail } from '../credit-detail'\nimport { DEBOUNCE_TIMER } from 'constants/index'\nimport './index.css'\nimport useFadeInFromAvobe from 'hooks/useFadeInFromAvobe'\n\nexport const TermInput = () => {\n const dispatch = useDispatch()\n const props = useFadeInFromAvobe(0)\n\n const { amount } = useSelector\n
\n
\n \n \n \n \n \n \n \n \n Meses\n
\n \n\n \n \n {inputError && (\n \n \n Escribe entre 3 y 60 meses para simular\n \n
\n \n Valor no permitido, ingresa un número entre 3 y 60 meses.\n
\n )}\n {term && {quota.term} meses con cuotas de $ {quota.quota}*
\n :\n {quota.term} meses\n }\n \n ),\n subtitle: (\n <>\n {isMobile ?\n \n Total a pagar:{' '}\n $ {quota.total}*{' '}\n
:\n <>\n Cuotas: $ {quota.quota} \n Total: $ {quota.total}{' '}\n \n }\n \n ),\n isCalculated: true,\n quotaText: quota.quota,\n capital: quota.capital,\n interes: quota.totalInterest,\n seguro: quota.seguro,\n total: quota.total,\n term: quota.term,\n }\n }),\n {\n title: (\n <>\n Otro\n \n ),\n subtitle: (\n <>\n
Personaliza tu plazo
\n \n ),\n term: 'otro',\n },\n ]\n\n const [open, setOpen] = useState(3)\n useEffect(() => {\n const currentTerm = quotas[open]\n if (open !== -1 && open < quotas.length) {\n dispatch(setInitialQuota(currentTerm?.quota))\n dispatch(setTermState(`${currentTerm?.term}`))\n }\n }, [open, quotas, dispatch])\n\n const onClick = (value: any, isOpen: boolean) => {\n setOpen(value)\n if (isOpen) {\n setOpen(-1)\n }\n }\n\n return (\n \n
\n )\n}\n","import React from 'react'\nimport { ButtonConfig } from 'interfaces/quota/';\n\n\ninterface Props {\n confirmButtonConfig: ButtonConfig\n}\n\nexport const Button: React.FC\n \n {confirmButtonConfig.value}\n \n
\n );\n}\n","import { RootState } from 'context';\nimport { AppState } from 'interfaces/app';\nimport React from 'react'\nimport { useSelector } from 'react-redux';\n\nexport const Header: React.FC = () => {\n\n const { isMobile } = useSelector\n \n ¿Cuánto dinero necesitas?\n \n
\n );\n}\n","import { RootState } from 'context'\nimport { setAmount } from 'context/reducer/quota'\nimport React, { useState, useEffect } from 'react'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { AppState } from 'interfaces/app'\nimport { debounceTime, filter, tap, map } from 'rxjs/operators'\nimport { Subject } from 'rxjs'\nimport { DEBOUNCE_TIMER } from 'constants/index'\nconst input$ = new Subject()\n\nexport const InputAmount: React.FC = () => {\n const { isMobile } = useSelector\n \n Escribe un valor entre mínimo $300 y máximo $40.000.\n \n
\n )\n}\n","import React from 'react'\nimport { Button } from './components/button';\nimport { Header } from './components/header';\nimport { InputAmount } from './components/inputAmount';\nimport { ButtonConfig, QuotaState } from 'interfaces/quota';\nimport { useDispatch, useSelector } from 'react-redux';\nimport { RootState } from 'context';\nimport { quotaFormula } from 'utils/quotaFormula';\nimport { setQuotas } from 'context/reducer/quota';\nimport { AppState } from '../../../../../interfaces/app/index';\n\nexport const Amount: React.FC = () => {\n\n const { amount } = useSelector\n \n
\n\n \n
\n );\n\n}\n","import React, { useEffect, useMemo, useState } from 'react'\nimport Container from '@mui/material/Container'\nimport Grid from '@mui/material/Grid'\nimport { animated, useSpring } from 'react-spring'\nimport { useDispatch, useSelector } from 'react-redux'\nimport { IQuota, QuotaState } from 'interfaces/quota'\nimport { AppState } from 'interfaces/app'\nimport { setQuotas } from 'context/reducer/quota'\nimport { RootState } from 'context'\nimport { Quota } from './quota'\nimport { Amount } from './amountDestination'\nimport simulatorImage from 'assets/images/login/SimulatorImage-min.jpg'\n\ninterface DrawSimulatorProps {\n quotas: IQuota[]\n amount: string\n}\n\nconst DrawSimulator: React.FC\n 
\n {isMobile\n ?\n \n }\n
\n )\n}\n\nexport default Simulator\n"],"sourceRoot":""}