\r\n {url !== \"\" ? (\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default OptionNav;\r\n","import React from \"react\";\r\nimport OptionNav from \"../OptionNav/OptionNav\";\r\nimport \"./AppMenu.css\";\r\n\r\nfunction TopMenu({ name, options, ...props }) {\r\n const root = process.env.REACT_APP_CMS_STATIC;\r\n\r\n return (\r\n \r\n
\r\n )}\r\n \r\n {options.map((option, index) => {\r\n\r\n return (\r\n
\r\n );\r\n}\r\nexport default TopMenu;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport \"./AppMenu.css\";\r\n\r\nOptionAppMenu.propTypes = {\r\n imgSrc: PropTypes.string,\r\n name: PropTypes.string,\r\n title: PropTypes.string,\r\n mini: PropTypes.bool,\r\n url: PropTypes.string,\r\n showImgIcon: PropTypes.bool,\r\n onClick: PropTypes.func,\r\n};\r\n\r\nfunction OptionAppMenu({\r\n imgSrc = \"http://placehold.jp/00bab4/ffffff/36.4x36.4.png\",\r\n name = \"\",\r\n title = \"\",\r\n mini = false,\r\n url = \"\",\r\n onClick = () => {},\r\n ...props\r\n}) {\r\n return (\r\n \r\n {mini ? (\r\n ☰\r\n ) : (\r\n 
\r\n )}\r\n {title}\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default OptionAppMenu;\r\n","import { useState, useEffect } from \"react\";\r\n\r\nconst useMediaQuery = (query) => {\r\n const [matches, setMatches] = useState(false);\r\n\r\n useEffect(() => {\r\n const media = window.matchMedia(query);\r\n if (media.matches !== matches) {\r\n setMatches(media.matches);\r\n }\r\n const listener = () => setMatches(media.matches);\r\n window.addEventListener(\"resize\", listener);\r\n return () => window.removeEventListener(\"resize\", listener);\r\n }, [matches, query]);\r\n\r\n return matches;\r\n}\r\n\r\nexport default useMediaQuery;","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport './AppMenu.css';\r\n\r\nSectionAppTitle.propTypes = {\r\n imgSrc:PropTypes.string,\r\n title:PropTypes.string,\r\n};\r\n\r\nfunction SectionAppTitle({\r\n imgSrc=\"http://placehold.jp/00bab4/ffffff/36.4x36.4.png\", \r\n title=\"\", \r\n ...props\r\n}) {\r\n const isMobile = useMediaQuery('(max-width: 1279px)');\r\n return (\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default SectionAppTitle;","import { MD5 } from \"crypto-js\";\r\n\r\nexport const md5Hash = (str) => {\r\n return MD5(str).toString();\r\n};\r\n\r\nexport const getAnonymPass = () => {\r\n var f = new Date();\r\n var day = (\"0\" + f.getDate()).slice(-2).toString();\r\n var month = (\"0\" + (f.getMonth() + 1)).slice(-2).toString();\r\n var year = f.getFullYear().toString();\r\n var key = \"grupo\" + day + \"cs\" + month + \"ahorro\" + year + \"credito\";\r\n var pass = md5Hash(key);\r\n return pass;\r\n};\r\n\r\nexport const capitalize = (word) => {\r\n return word[0].toUpperCase() + word.slice(1);\r\n};\r\n\r\nexport const setCache = (key, value) => {\r\n localStorage.setItem(key, JSON.stringify(value));\r\n};\r\n\r\nexport const getCache = (key) => {\r\n let content = localStorage.getItem(key);\r\n return content !== null\r\n ? localStorage.getItem(key).replace(/['\"]+/g, \"\")\r\n : null;\r\n};\r\n\r\nexport const orderArray = (array, field) => {\r\n return array.sort(function (a, b) {\r\n if (a.field < b.field) {\r\n return -1;\r\n }\r\n if (a.field > b.field) {\r\n return 1;\r\n }\r\n return 0;\r\n });\r\n};\r\n\r\nexport const replaceAll = (text, busca, reemplaza) => {\r\n while (text.toString().indexOf(busca) !== -1)\r\n text = text.toString().replace(busca, reemplaza);\r\n return text;\r\n};\r\n\r\nexport const cleanValue = (value) => {\r\n value = replaceAll(value, \".\", \"\");\r\n value = replaceAll(value, \",\", \"\");\r\n value = replaceAll(value, \";\", \"\");\r\n value = replaceAll(value, \"-\", \"\");\r\n value = replaceAll(value, \"_\", \"\");\r\n value = replaceAll(value, \"/\", \"\");\r\n value = replaceAll(value, \"+_\", \"\");\r\n value = replaceAll(value, \"*\", \"\");\r\n value = replaceAll(value, \"|\", \"\");\r\n value = replaceAll(value, \"°\", \"\");\r\n value = replaceAll(value, \"!\", \"\");\r\n value = replaceAll(value, \"#\", \"\");\r\n value = replaceAll(value, \"$\", \"\");\r\n value = replaceAll(value, \"%\", \"\");\r\n value = replaceAll(value, \"&\", \"\");\r\n value = replaceAll(value, \"\\\\\", \"\");\r\n value = replaceAll(value, \"(\", \"\");\r\n value = replaceAll(value, \")\", \"\");\r\n value = replaceAll(value, \"=\", \"\");\r\n value = replaceAll(value, \"'\", \"\");\r\n value = replaceAll(value, \"¿\", \"\");\r\n value = replaceAll(value, \"'\", \"\");\r\n value = replaceAll(value, \"?\", \"\");\r\n value = replaceAll(value, \"{\", \"\");\r\n value = replaceAll(value, \"}\", \"\");\r\n value = replaceAll(value, \"[\", \"\");\r\n value = replaceAll(value, \"]\", \"\");\r\n\r\n value = value.split(\" \");\r\n let values = value.filter((val) => val !== \"\");\r\n return values;\r\n};\r\n\r\nexport const remAccents = (cadena) => {\r\n var chars = {\r\n á: \"a\",\r\n é: \"e\",\r\n í: \"i\",\r\n ó: \"o\",\r\n ú: \"u\",\r\n à: \"a\",\r\n è: \"e\",\r\n ì: \"i\",\r\n ò: \"o\",\r\n ù: \"u\",\r\n ñ: \"n\",\r\n Á: \"A\",\r\n É: \"E\",\r\n Í: \"I\",\r\n Ó: \"O\",\r\n Ú: \"U\",\r\n À: \"A\",\r\n È: \"E\",\r\n Ì: \"I\",\r\n Ò: \"O\",\r\n Ù: \"U\",\r\n Ñ: \"N\",\r\n };\r\n var expr = /[áàéèíìóòúùñ]/gi;\r\n var res = cadena.replace(expr, function (e) {\r\n return chars[e];\r\n });\r\n return res;\r\n};\r\n\r\nexport const objectToQueryString = (obj) => {\r\n var str = [];\r\n for (var p in obj)\r\n if (obj.hasOwnProperty(p)) {\r\n str.push(encodeURIComponent(p) + \"=\" + encodeURIComponent(obj[p]));\r\n }\r\n return str.join(\"&\");\r\n};\r\n\r\nexport function isObjEmpty(obj) {\r\n for (var prop in obj) {\r\n if (obj.hasOwnProperty(prop)) return false;\r\n }\r\n\r\n return true;\r\n}\r\n\r\nexport const getYoutubeVideoId = (url) => {\r\n const regex =\r\n /^.*(?:(?:youtu\\.be\\/|v\\/|vi\\/|u\\/\\w\\/|embed\\/)|(?:(?:watch)?\\?v(?:i)?=|&v(?:i)?=))([^#&?]*).*/;\r\n let result = url.match(regex);\r\n return result[1];\r\n};\r\n\r\n// ref is a reference to a HTML element we want to scroll\r\nexport const scrollToSection = (ref) => {\r\n if (ref.current) {\r\n window.scrollTo({\r\n top: ref.current.offsetTop,\r\n behavior: \"smooth\",\r\n });\r\n }\r\n};\r\n\r\n//Separar los valores de una hora, para obtener por separado, la hora, el minuto y el segundo.\r\n//Params: fullHour:hora completa en formato hh:mm:ss\r\n//outputSegment: segmento de salida: 1=hora, 2=minutos, 3=segundos\r\n\r\nexport const disjoinTime = (fullHour, outputSegment) => {\r\n var time = fullHour,\r\n matchesStart = time.toLowerCase().match(/(\\d{1,2}):(\\d{2}):(\\d{2})/),\r\n hour = parseInt(matchesStart[1]) + (matchesStart[3] === \"pm\" ? 12 : 0),\r\n min = parseInt(matchesStart[2]),\r\n sec = parseInt(matchesStart[3]);\r\n\r\n if (outputSegment === 3) {\r\n return sec;\r\n } else if (outputSegment === 2) {\r\n return min;\r\n } else if (outputSegment === 1) {\r\n return hour;\r\n } else {\r\n return fullHour;\r\n }\r\n //output = (parseInt(matches[1]) + (matches[3] === 'pm' ? 12 : 0)) + ':' + matches[2]+ ':' + matches[3];\r\n};\r\n\r\n//num es un string\r\nexport const maskCurrency = (num) => {\r\n let newNum = parseFloat(num).toFixed(2);\r\n\r\n let array = newNum.split(\".\");\r\n return (\r\n array[0].replace(/\\D/g, \"\").replace(/\\B(?=(\\d{3})+(?!\\d))/g, \" \") +\r\n \",\" +\r\n array[1]\r\n );\r\n};\r\n\r\nexport const maskNumber = (num) => {\r\n return num.replace(/\\D/g, \"\");\r\n};\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport PropTypes from \"prop-types\";\r\nimport SectionAppTitle from \"./SectionAppTitle\";\r\nimport { Link } from \"react-router-dom\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport { remAccents } from \"@helpers/utils\";\r\nimport { isNull, isUndefined, isEmpty } from \"lodash\";\r\nimport \"./AppMenu.css\";\r\n\r\nSectionAhorro.propTypes = {\r\n title: PropTypes.string,\r\n setShow: PropTypes.func,\r\n closeLeft: PropTypes.func,\r\n sectionIcon: PropTypes.string,\r\n};\r\n\r\nfunction SectionAhorro({\r\n title,\r\n setShow = () => {},\r\n closeLeft = () => {},\r\n sectionIcon = \"\",\r\n ...props\r\n}) {\r\n const isMobile = useMediaQuery(\"(max-width: 1279px)\");\r\n\r\n const [sectionCols, setSectionCols] = useState([]);\r\n\r\n //Selectores del Estado\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { mainMenuSections } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { aCCreditosPersonales } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito?.creditosPersonales\r\n );\r\n const { aCCreditosHipotecarios } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito?.creditosHipotecarios\r\n );\r\n const { aCCreditosProductivos } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito?.creditosProductivos\r\n );\r\n const { aCAhorroProgramado } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito?.ahorrosProgramados\r\n );\r\n const { aCInversion } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito?.inversiones\r\n );\r\n const { planesAsistencia } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito\r\n );\r\n const { tarjetasCredito } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito\r\n );\r\n const { bienesBanner } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito\r\n );\r\n const { serviahorro } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito?.AhorroYCredito\r\n );\r\n\r\n const DATA_INVENTORY = {\r\n aCCreditosPersonales: aCCreditosPersonales,\r\n aCCreditosHipotecarios: aCCreditosHipotecarios,\r\n aCCreditosProductivos: aCCreditosProductivos,\r\n aCAhorroProgramado: aCAhorroProgramado,\r\n aCInversion: aCInversion,\r\n planesAsistencia: planesAsistencia,\r\n tarjetasCredito: tarjetasCredito,\r\n bienesBanner: bienesBanner,\r\n serviahorro: serviahorro,\r\n };\r\n\r\n useEffect(() => {\r\n let columnas = {\r\n columna1: [],\r\n columna2: [],\r\n columna3: [],\r\n columna4: [],\r\n columna5: [],\r\n };\r\n let claves = Object.keys(columnas);\r\n let setCols = [];\r\n\r\n for (let i = 0; i < claves.length; i++) {\r\n let clave = claves[i];\r\n let index = i + 1;\r\n\r\n mainMenuSections.forEach((sec) => {\r\n sec.columna === index && columnas[clave].push(sec);\r\n });\r\n\r\n columnas[clave].sort(function (a, b) {\r\n return a.fila - b.fila;\r\n });\r\n setCols.push(columnas[clave]);\r\n }\r\n setSectionCols(setCols);\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n const simpleSubMenuBuilder = (\r\n selector,\r\n mainUriName,\r\n title,\r\n conListado = true\r\n ) => {\r\n const curStartSection =\r\n rutas && rutas?.filter((uri) => uri?.name === mainUriName);\r\n const rootUri =\r\n !isEmpty(curStartSection) && curStartSection[0]?.url.includes(\"/:id\")\r\n ? curStartSection[0]?.url.replace(\"/:id\", \"\")\r\n : curStartSection[0]?.url;\r\n const options =\r\n !isUndefined(selector) &&\r\n selector?.map((item) => {\r\n let newUri = \"\";\r\n newUri = !isUndefined(item?.ruta)\r\n ? item?.ruta.contentItems[0].url.toLowerCase()\r\n : !isUndefined(item?.idCredito)\r\n ? item?.idCredito\r\n : !isUndefined(item?.idCreditoProductivo)\r\n ? item?.idCreditoProductivo\r\n : !isUndefined(item?.idAhorro)\r\n ? item?.idAhorro\r\n : !isUndefined(item?.idInversion)\r\n ? item?.idInversion\r\n : !isUndefined(item?.titulo)\r\n ? remAccents((item?.titulo).replace(/ /gi, \"-\").toLowerCase())\r\n : \"#\";\r\n\r\n newUri = newUri.includes(\"/\") ? newUri.replace(\"/\", \"\") : newUri;\r\n const items = { title: item?.titulo || item.nombre, url: newUri };\r\n return items;\r\n });\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n {title}
\r\n \r\n {\r\n setShow(false);\r\n closeLeft();\r\n }}\r\n >\r\n {title}\r\n \r\n
\r\n - \r\n {options &&\r\n options.map((option, index) => {\r\n const uri = option.url.includes(\"/\")\r\n ? \"/\" + option.url\r\n : !isUndefined(rootUri)\r\n ? rootUri + \"/\" + option.url\r\n : option.url;\r\n return (\r\n
\r\n
\r\n );\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n {section.url ? (\r\n {\r\n setShow(false);\r\n closeLeft();\r\n }}\r\n >\r\n {section?.displayText}\r\n \r\n ) : (\r\n
\r\n\r\n {!isEmpty(section?.aCOpcionesSeccionPersonalizada.contentItems) && (\r\n \r\n {section?.displayText}\r\n
\r\n )}\r\n - \r\n {section?.aCOpcionesSeccionPersonalizada.contentItems.map(\r\n (opCustom, index) => {\r\n return (\r\n
\r\n
\r\n );\r\n })}\r\n \r\n \r\n );\r\n}\r\n\r\nexport default SectionAhorro;\r\n","import React from 'react';\r\nimport SectionAppTitle from './SectionAppTitle';\r\nimport { Link } from 'react-router-dom';\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport './AppMenu.css';\r\n\r\nfunction SectionSeguros({title, sectionIcon, ...props}) {\r\n const isMobile = useMediaQuery('(max-width: 1279px)');\r\n return (\r\n <>\r\n \r\n {col.map((sec, index) => {\r\n return
\r\n {renderSection(sec, index)}
;\r\n })}\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nexport default SectionSeguros;","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport SectionAppTitle from './SectionAppTitle';\r\nimport { Link } from 'react-router-dom';\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport './AppMenu.css';\r\n\r\nSectionSobre.propTypes = {\r\n title:PropTypes.string,\r\n setShow:PropTypes.func,\r\n closeLeft:PropTypes.func,\r\n sectionIcon:PropTypes.string\r\n};\r\n\r\nfunction SectionSobre({\r\n title, \r\n setShow=()=>{}, \r\n closeLeft=()=>{},\r\n sectionIcon=\"\",\r\n ...props\r\n}) {\r\n const isFullHD = useMediaQuery('(min-width: 1920px)');\r\n const isMidLaptop = useMediaQuery('(min-width: 1366px)');\r\n const isMobile = useMediaQuery('(max-width: 1279px)');\r\n\r\n return (\r\n <>\r\n - \r\n
- Inicio \r\n
- Seguro de Vida \r\n
- Seguro por Desempleo \r\n
- Seguro de Responsabilidad Civil \r\n
- Seguro de Automóvil \r\n
- Seguro de Gastos Médicos \r\n
- Seguro de Incendio Hogar \r\n
- Seguro de Incendio Comercial \r\n
- Seguro de Incendio Multirriesgo \r\n
- Seguro de Riesgos de Trabajo \r\n
- Seguro Multirriesgo Pymes \r\n
- Seguro de Estudiantes \r\n
- Seguro de Viaje \r\n
- Seguro de Equipo Electrónico \r\n
- Seguro de Bicicletas \r\n
- Seguro de Vida Individual \r\n
- Realiza tus Gestiones \r\n
- Acerca de la Corredora de Seguros \r\n
\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default SectionSobre;","import React, { useState } from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport Offcanvas from \"react-bootstrap/Offcanvas\";\r\n//import OptionAppMenu from \"./OptionAppMenu\";\r\nimport SectionAhorro from \"./SectionAhorro\";\r\nimport SectionSeguros from \"./SectionSeguros\";\r\nimport SectionSobre from \"./SectionSobre\";\r\nimport OptionNav from \"../OptionNav/OptionNav\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport \"./AppMenu.css\";\r\n\r\nLeftSecondaryMenu.propTypes = {\r\n name: PropTypes.string,\r\n title: PropTypes.string,\r\n section: PropTypes.number,\r\n closeLeft: PropTypes.func,\r\n iconUrl: PropTypes.string,\r\n};\r\n\r\nfunction LeftSecondaryMenu({\r\n name = \"\",\r\n title = \"\",\r\n section = 0,\r\n closeLeft = () => {},\r\n iconUrl = \"\",\r\n ...props\r\n}) {\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const isPhone = useMediaQuery(\"(max-width: 767px)\");\r\n\r\n const [show, setShow] = useState(false);\r\n\r\n const handleClose = () => setShow(false);\r\n\r\n const showSectionMenu = (section, title) => {\r\n if (section === 1) {\r\n return (\r\n \r\n
\r\n QUIENES SOMOS
\r\n - \r\n
- {setShow(false); closeLeft()}}>Inicio \r\n
- {setShow(false); closeLeft()}}>Perfil Corporativo \r\n
- {setShow(false); closeLeft()}}>Misión, Visión y Valores \r\n
- {setShow(false); closeLeft()}}>Reconocimientos, Certificaciones y Galardones \r\n
- {setShow(false); closeLeft()}}>Afiliaciones y Alianzas \r\n
- {setShow(false); closeLeft()}}>Estructura Organizacional \r\n
\r\n
\r\n \r\n
\r\n \r\n
\r\n {/*SOSTENIBILIDAD
\r\n - \r\n
- {setShow(false); closeLeft()}}>Gestión de la Sostenibilidad \r\n
- {setShow(false); closeLeft()}}>Proyectos de Responsabilidad Social \r\n
- {setShow(false); closeLeft()}}>Compromisos Sociales y Ambientales \r\n
- {setShow(false); closeLeft()}}>Sistema de Gestión Integrado \r\n
\r\n
*/}\r\n GOBIERNO CORPORATIVO
\r\n - \r\n
- {setShow(false); closeLeft()}}>Organigrama \r\n
- {setShow(false); closeLeft()}}>Carta Corporativa \r\n
- {setShow(false); closeLeft()}}>Informe Anual de Gobierno Corporativo \r\n
- {setShow(false); closeLeft()}}>Código de Gobierno Corporativo \r\n
\r\n
\r\n {/*GOBIERNO CORPORATIVO
\r\n - \r\n
- {setShow(false); closeLeft()}}>Organigrama \r\n
- {setShow(false); closeLeft()}}>Carta Corporativa \r\n
- {setShow(false); closeLeft()}}>Informe Anual de Gobierno Corporativo \r\n
- {setShow(false); closeLeft()}}>Código de Gobierno Corporativo \r\n
\r\n
*/}\r\n INFORMES
\r\n - \r\n
- {setShow(false); closeLeft()}}>Reporte de GRI del Grupo CS \r\n
\r\n \r\n \r\n {isPhone ? (\r\n
\r\n );\r\n}\r\n\r\nexport default LeftSecondaryMenu;\r\n","import React, { useState } from \"react\";\r\nimport Offcanvas from \"react-bootstrap/Offcanvas\";\r\nimport OptionAppMenu from \"./OptionAppMenu\";\r\nimport LeftSecondaryMenu from \"./LeftSecondaryMenu\";\r\nimport OptionNav from \"../OptionNav/OptionNav\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport \"./AppMenu.css\";\r\n\r\nfunction LeftMenu({ name, type, section, menuOptions, ...props }) {\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const [show, setShow] = useState(false);\r\n\r\n const ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\n const handleClose = () => setShow(false);\r\n const toggleShow = () => setShow((s) => !s);\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n ) : (\r\n showSectionMenu(section, title)\r\n )}\r\n \r\n \r\n \r\n {showSectionMenu(section, title)}\r\n
\r\n \r\n {menuOptions.map((option, index) =>\r\n option.displayText === \"Ahorro Y Crédito\" ? (\r\n
\r\n \r\n \r\n
\r\n : isTablet ? \r\n \r\n {logos.length > 0 && (\r\n \r\n
\r\n \r\n {showH1 && (\r\n Grupo CS Coopeservidores
\r\n )}\r\n \r\n );\r\n}\r\n\r\nexport default SecondaryNavBar;\r\n","import {\r\n GET_CMS_SITE_SECONDARY_NAV,\r\n GET_CMS_SITE_SECONDARY_NAV_ERROR,\r\n} from \"./types\";\r\nimport CMSService from \"../../services/cms.service\";\r\n\r\nexport function getSecondaryNavContent() {\r\n return function (dispatch) {\r\n try {\r\n return CMSService.reqSecondaryNav()\r\n .then((data) => {\r\n dispatch(\r\n {\r\n type: GET_CMS_SITE_SECONDARY_NAV,\r\n payload: data.data\r\n })\r\n });\r\n }\r\n catch (error) {\r\n return (dispatch) => {\r\n dispatch({\r\n type: GET_CMS_SITE_SECONDARY_NAV_ERROR,\r\n });\r\n }\r\n }\r\n };\r\n}","import React, { useEffect, useState } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport * as CMSActions from \"./store/actions\";\r\nimport { animations } from \"react-animation\";\r\n\r\nfunction BannerCert(props) {\r\n const dispatch = useDispatch();\r\n const [certificaciones, setCertificaciones] = useState([]);\r\n\r\n const { contentCertificaciones } = useSelector(\r\n ({ certificaciones }) => certificaciones.certificaciones\r\n );\r\n\r\n useEffect(() => {\r\n !contentCertificaciones && dispatch(CMSActions.getCertificaciones());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (contentCertificaciones) {\r\n let certs = contentCertificaciones.certificacion;\r\n certs.sort(function (a, b) {\r\n if (a.textoalternativo > b.textoalternativo) {\r\n return 1;\r\n }\r\n if (a.textoalternativo < b.textoalternativo) {\r\n return -1;\r\n }\r\n return 0;\r\n });\r\n setCertificaciones(certs);\r\n }\r\n }, [contentCertificaciones]);\r\n\r\n const root = process.env.REACT_APP_CMS_STATIC;\r\n const items = (\r\n <>\r\n {certificaciones.map((certificacion, index) => (\r\n\r\n
\r\n ))}\r\n \r\n );\r\n return (\r\n \r\n {items}\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default BannerCert;\r\n","const root = process.env.REACT_APP_API_GRAPHQL;\r\nconst bannerRoute =\r\n root +\r\n \"?query={aCBannerBackground{bG4KDesktopIpadLandscape{urls} bGIpadPortrait{urls} bGMobile{urls}} aCBannerButtonConsultarImage{botonConsultar{urls} url{url text}} aCBannerButtonWhatsappImage{whatsappLogo{urls} url{url}} aCBannerMainImage{mainImage{urls} mainImage2x{urls} mainImage3x{urls}} aCBannerText{linea1{html} linea2{html} linea3{html} linea4{html} linea5{html}}}\";\r\n\r\nexport default bannerRoute;","/* eslint-disable import/no-anonymous-default-export */\r\nimport axios from \"axios\";\r\nimport * as Config from \"./config\";\r\n\r\nasync function reqBanner(token) { \r\n\tconst API_URI_BANNER = Config.bannerRoute;\r\n const response = await axios.get(API_URI_BANNER, {\r\n headers: { Authorization: \"Bearer \" + token },\r\n }); \r\n return response.data; \r\n}\r\n\r\nexport default {reqBanner};","import React, { useEffect, useState } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport Parser from \"html-react-parser\";\r\nimport * as CMSActions from \"./store/actions\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport { animations } from \"react-animation\";\r\nimport \"./BannerHero.css\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction BannerHero(props) {\r\n const dispatch = useDispatch();\r\n\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const isDesktop = useMediaQuery(\"(min-width: 992px)\");\r\n const isIpadPortrait = useMediaQuery(\"(max-width: 992px)\");\r\n const isIphoneLandscape = useMediaQuery(\"(max-width: 576px)\");\r\n\r\n const [backgroundImage, setBackgroundImage] = useState([]);\r\n const [heroImage, setHeroImage] = useState(\"\");\r\n const [buttonConsultar, setButtonConsultar] = useState({});\r\n //const [buttonWhatsapp, setButtonWhatsapp] = useState([]);\r\n const [bannerText, setBannerText] = useState([]);\r\n\r\n const { contentBanner } = useSelector(({ banner }) => banner.banner);\r\n\r\n useEffect(() => {\r\n !contentBanner && dispatch(CMSActions.getBanner());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (contentBanner) {\r\n setBackgroundImage(contentBanner.aCBannerBackground);\r\n setBannerText(contentBanner.aCBannerText);\r\n setHeroImage(contentBanner.aCBannerMainImage[0]?.mainImage?.urls[0]);\r\n // Validación para crear el botón consultar\r\n contentBanner.aCBannerButtonConsultarImage &&\r\n contentBanner.aCBannerButtonConsultarImage[0]?.url &&\r\n contentBanner.aCBannerButtonConsultarImage[0]?.url.url &&\r\n contentBanner.aCBannerButtonConsultarImage[0]?.botonConsultar.urls[0] &&\r\n setButtonConsultar({\r\n url: contentBanner.aCBannerButtonConsultarImage[0].url.url,\r\n img: contentBanner.aCBannerButtonConsultarImage[0].botonConsultar\r\n .urls[0],\r\n alt: contentBanner.aCBannerButtonConsultarImage[0].url.text,\r\n });\r\n //setButtonWhatsapp(contentBanner.aCBannerButtonWhatsappImage);\r\n }\r\n }, [contentBanner]);\r\n\r\n const bgImage = () => {\r\n let cls = \"\";\r\n if (isIphoneLandscape) {\r\n cls = `url(\"${ROOT + backgroundImage[0]?.bGMobile?.urls[0]}\")`;\r\n } else if (isIpadPortrait) {\r\n cls = `url(\"${ROOT + backgroundImage[0]?.bGIpadPortrait?.urls[0]}\")`;\r\n } else if (isDesktop) {\r\n cls = `url(\"${\r\n ROOT + backgroundImage[0]?.bG4KDesktopIpadLandscape?.urls[0]\r\n }\")`;\r\n }\r\n return cls;\r\n };\r\n\r\n const contenedorL4L5YConsultar = () => {\r\n let cls = \"\";\r\n if (isIphoneLandscape) {\r\n cls = \"d-flex flex-column\";\r\n } else if (isIpadPortrait || isDesktop || is4K) {\r\n cls = \"d-flex\";\r\n }\r\n return cls;\r\n };\r\n\r\n const mainImage = (\r\n <>\r\n {backgroundImage && (\r\n <>\r\n \r\n {bannerText[0]?.linea1 && (\r\n
\r\n \r\n \r\n {Parser(bannerText[0]?.linea1?.html)}\r\n
\r\n )}\r\n {bannerText[0]?.linea2 && (\r\n \r\n {Parser(bannerText[0]?.linea2?.html)}\r\n
\r\n )}\r\n {bannerText[0]?.linea3 && (\r\n \r\n {Parser(bannerText[0]?.linea3?.html)}\r\n
\r\n )}\r\n \r\n {(bannerText[0]?.linea4 || bannerText[0]?.linea5) && (\r\n \r\n {bannerText[0]?.linea4 && (\r\n
\r\n )}\r\n {buttonConsultar && buttonConsultar.url && buttonConsultar.img && (\r\n \r\n {Parser(bannerText[0]?.linea4?.html)}\r\n
\r\n )}\r\n {bannerText[0]?.linea5 && (\r\n \r\n {Parser(bannerText[0]?.linea5?.html)}\r\n
\r\n )}\r\n \r\n \r\n
\r\n )}\r\n \r\n {heroImage && (\r\n
\r\n \r\n \r\n )}\r\n \r\n );\r\n\r\n return (\r\n \r\n {mainImage}\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default BannerHero;","import {\r\n GET_CMS_BANNER,\r\n GET_CMS_BANNER_ERROR\r\n} from \"./types\";\r\nimport CMSService from \"../../services/cms.service\";\r\n\r\nexport function getBanner() {\r\n return function (dispatch) {\r\n try { \r\n return CMSService.reqBanner()\r\n .then((data) => { \r\n dispatch(\r\n {\r\n type: GET_CMS_BANNER,\r\n payload: data\r\n })\r\n });\r\n }\r\n catch (error) {\r\n return (dispatch) => {\r\n dispatch({\r\n type: GET_CMS_BANNER_ERROR,\r\n });\r\n }\r\n }\r\n };\r\n}","import React, { useEffect, useState } from \"react\";\r\nimport Parser from \"html-react-parser\";\r\nimport { useSelector } from \"react-redux\";\r\n//import { useHistory } from \"react-router-dom\";\r\nimport { animations } from \"react-animation\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport \"./Productos.css\";\r\n\r\nconst root = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction ProductosAhorroCredito(props) {\r\n //let history = useHistory();\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const isFullHD = useMediaQuery(\"(min-width: 1920px)\");\r\n const isMidLaptop = useMediaQuery(\"(min-width: 1366px)\");\r\n const isIpadLandscape = useMediaQuery(\"(min-width: 1024px)\");\r\n const isIpadPortrait = useMediaQuery(\"(min-width: 768px)\");\r\n const isIphoneX = useMediaQuery(\"(min-width: 375px)\");\r\n const isXSmall = useMediaQuery(\"(max-width: 374px)\");\r\n const [products, setProducts] = useState([]);\r\n\r\n const { productos } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n useEffect(() => {\r\n setProducts(productos);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [productos]);\r\n\r\n //Styles\r\n const contenedorStyle = () => {\r\n let cls = \"\";\r\n if (isXSmall) {\r\n cls = \"d-flex flex-wrap flex-column justify-content-center\";\r\n }\r\n if (isIphoneX) {\r\n cls =\r\n \"contenedortablet-productos d-flex flex-wrap justify-content-around\";\r\n }\r\n if (isIpadPortrait) {\r\n cls =\r\n \"contenedortablet-productos d-flex flex-wrap justify-content-around\";\r\n }\r\n if (isIpadLandscape) {\r\n cls =\r\n \"contenedortablet-productos d-flex flex-wrap justify-content-around\";\r\n }\r\n if (isMidLaptop) {\r\n cls = \"d-flex flex-wrap justify-content-around\";\r\n }\r\n if (isFullHD) {\r\n cls = \"contenedordesktop-productos d-flex justify-content-between\";\r\n }\r\n if (is4K) {\r\n cls = \"contenedor-productos d-flex justify-content-between\";\r\n }\r\n return cls;\r\n };\r\n\r\n return (\r\n \r\n \r\n {products &&\r\n products.map((prod, index) => {\r\n return (\r\n \r\n \r\n
\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default ProductosAhorroCredito;\r\n","const ROOT = process.env.REACT_APP_API_GRAPHQL;\r\nconst imageLinksFooterRoute =\r\n ROOT +\r\n \"?query={redesSociales(status: PUBLISHED){titulo bag{contentItems{... on RedSocial{displayText imagen{urls} nombre uRL{text url}}}}} logoFooter(status: PUBLISHED){logo{urls}} saladePrensa(status: PUBLISHED){titulo logoPrensa{urls} logoPrensaLink{text url} logoWhatsapp{urls} logoWhatsappLink{text url}}}\";\r\nconst textLinksFooterRoute =\r\n ROOT +\r\n \"?query={footerLeftLinks(status: PUBLISHED){ahorroyCredito{text url} seguros{text url} sobreelGrupoCS{text url}} footerCenterLinks(status: PUBLISHED){mapadelSitio{text url} novaHub{text url}} footerRightLinks(status: PUBLISHED){correoGeneral{text url} mapadeSucursales{text url} privacidadyUsodeDatos{text url}}}\";\r\nconst logoSitioWebRoute =\r\n ROOT + \"?query={aCLogoUnaSolaTinta(status: PUBLISHED){logo{urls}}}\";\r\nconst footerRoute = { imageLinksFooterRoute, textLinksFooterRoute, logoSitioWebRoute };\r\n\r\nexport default footerRoute;\r\n","import axios from \"axios\";\r\nimport * as Config from \"./config\";\r\n\r\nasync function reqImageLinksFooter(token) {\r\n const API_URL_IMAGE_LINKS_FOOTER = Config.footerRoute.imageLinksFooterRoute;\r\n try {\r\n const response = await axios.get(API_URL_IMAGE_LINKS_FOOTER, {\r\n headers: { Authorization: \"Bearer \" + token },\r\n });\r\n return response.data;\r\n } catch (error) {\r\n console.error(error);\r\n return error;\r\n }\r\n}\r\n\r\nasync function reqTextLinksFooter(token) {\r\n const API_URL_TEXT_LINKS_FOOTER = Config.footerRoute.textLinksFooterRoute;\r\n try {\r\n const response = await axios.get(API_URL_TEXT_LINKS_FOOTER, {\r\n headers: { Authorization: \"Bearer \" + token },\r\n });\r\n return response.data;\r\n } catch (error) {\r\n console.error(error);\r\n return error;\r\n }\r\n}\r\n\r\nasync function reqLogoSitioWebFooter(token) {\r\n const API_URL_LOGO_SITIO_WEB = Config.footerRoute.logoSitioWebRoute;\r\n const response = await axios.get(API_URL_LOGO_SITIO_WEB, {\r\n headers: { Authorization: \"Bearer \" + token },\r\n });\r\n return response.data;\r\n}\r\n\r\n//eslint-disable-next-line\r\nexport default {\r\n reqImageLinksFooter,\r\n reqTextLinksFooter,\r\n reqLogoSitioWebFooter\r\n};\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport * as CMSActions from \"./store/actions\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport \"./Footer.css\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\nconst VERSION = process.env.REACT_APP_VERSION;\r\nconst HOST_GRUPO = process.env.REACT_APP_HOST_GRUPO_CS;\r\n\r\nfunction Footer(props) {\r\n const dispatch = useDispatch();\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const isDesktop = useMediaQuery(\"(min-width: 1024px)\");\r\n const isMobile = useMediaQuery(\"(max-width: 767px)\");\r\n\r\n const [social, setSocial] = useState([]);\r\n const [logoGrupoCSFooter, setLogoGrupoCSFooter] = useState(\"\");\r\n const [logoSitioFooter, setLogoSitioFooter] = useState(\"\");\r\n const [press, setPress] = useState([]);\r\n\r\n const [leftLinks, setLeftLinks] = useState([]);\r\n const [centerLinks, setCenterLinks] = useState([]);\r\n const [rightLinks, setRightLinks] = useState([]);\r\n\r\n const { token } = useSelector(({ Base }) => Base.Token);\r\n const { imageLinks } = useSelector(({ footer }) => footer.footer);\r\n const { textLinks } = useSelector(({ footer }) => footer.footer);\r\n const { logoSitioWeb } = useSelector(({ footer }) => footer.footer);\r\n\r\n useEffect(() => {\r\n if (token) {\r\n !imageLinks && dispatch(CMSActions.getImageLinksFooter(token));\r\n !textLinks && dispatch(CMSActions.getTextLinksFooter(token));\r\n !logoSitioWeb && dispatch(CMSActions.getLogoSitioWebFooter(token));\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [token]);\r\n\r\n useEffect(() => {\r\n if (imageLinks) {\r\n setSocial(imageLinks.redesSociales[0].bag.contentItems);\r\n setLogoGrupoCSFooter(ROOT + imageLinks.logoFooter[0].logo.urls[0]);\r\n setPress(imageLinks.saladePrensa);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [imageLinks]);\r\n\r\n useEffect(() => {\r\n if (textLinks) {\r\n function iterateObject(object) {\r\n let result = [];\r\n let keys = Object.keys(object);\r\n for (let i = 0; i < keys.length; i++) {\r\n let clave = keys[i];\r\n let value = object[clave];\r\n result.push(value);\r\n }\r\n return result;\r\n }\r\n let leftTextLinks = iterateObject(textLinks.footerLeftLinks[0]);\r\n let centerTextLinks = iterateObject(textLinks.footerCenterLinks[0]);\r\n let rightTextLinks = iterateObject(textLinks.footerRightLinks[0]);\r\n setLeftLinks(leftTextLinks);\r\n setCenterLinks(centerTextLinks);\r\n setRightLinks(rightTextLinks);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [textLinks]);\r\n\r\n useEffect(() => {\r\n logoSitioWeb &&\r\n logoSitioWeb.aCLogoUnaSolaTinta.length > 0 &&\r\n logoSitioWeb.aCLogoUnaSolaTinta[0].logo.urls.length > 0 &&\r\n setLogoSitioFooter(\r\n ROOT + logoSitioWeb.aCLogoUnaSolaTinta[0].logo.urls[0]\r\n );\r\n }, [logoSitioWeb]);\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n {Parser(prod.displayText)}\r\n \r\n
\r\n \r\n {Parser(prod.descripcion.html)}\r\n
\r\n \r\n );\r\n })}\r\n \r\n {logoSitioFooter && (\r\n
\r\n )}\r\n \r\n \r\n 
\r\n \r\n
\r\n )}\r\n {logoSitioFooter && logoGrupoCSFooter && (\r\n \r\n )}\r\n {logoGrupoCSFooter && (\r\n \r\n \r\n 
\r\n \r\n
\r\n )}\r\n \r\n Versión {VERSION} | © {new Date().getFullYear()} Derechos\r\n Reservados\r\n
\r\n \r\n ) : null}\r\n Sala de Prensa
\r\n {press && press.length > 0 && (\r\n <>\r\n {press[0].logoPrensaLink &&\r\n press[0].logoPrensaLink.url &&\r\n press[0].logoPrensa &&\r\n press[0].logoPrensa.urls[0] && (\r\n \r\n \r\n
\r\n )}\r\n \r\n )}\r\n \r\n \r\n \r\n \r\n {link.text}\r\n \r\n
\r\n )\r\n );\r\n })}\r\n \r\n {isDesktop ? (\r\n \r\n \r\n {link.text}\r\n \r\n
\r\n )\r\n );\r\n })}\r\n \r\n ) : null}\r\n \r\n \r\n {link.text}\r\n \r\n
\r\n )\r\n );\r\n })}\r\n \r\n \r\n {isDesktop ? null : (\r\n <>\r\n \r\n {centerLinks &&\r\n centerLinks.map((link, index) => {\r\n return (\r\n link.url !== null && (\r\n
\r\n \r\n \r\n {link.text}\r\n \r\n
\r\n )\r\n );\r\n })}\r\n \r\n {(logoSitioFooter || logoGrupoCSFooter) && (\r\n
\r\n \r\n )}\r\n \r\n \r\n {logoSitioFooter && (\r\n
\r\n )}\r\n \r\n \r\n
\r\n )}\r\n {logoSitioFooter && logoGrupoCSFooter && (\r\n \r\n )}\r\n {logoGrupoCSFooter && (\r\n \r\n \r\n \r\n \r\n
\r\n )}\r\n \r\n Versión {VERSION} | © {new Date().getFullYear()} Derechos\r\n Reservados\r\n
\r\n \r\n
\r\n \r\n Total: {totalCount} Registros.\r\n
\r\n \r\n \r\n \r\n \r\n \r\n {paginationRange.map((pageNumber, index) => {\r\n if (pageNumber === DOTS) {\r\n return (\r\n \r\n …\r\n \r\n );\r\n }\r\n\r\n return (\r\n onPageChange(pageNumber)}\r\n >\r\n {pageNumber}\r\n \r\n );\r\n })}\r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n 
Chat\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ChatButton;\r\n","import React from \"react\";\r\nimport Parser from \"html-react-parser\";\r\nimport PropTypes from \"prop-types\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport { isNull } from \"lodash\";\r\nimport \"./FeaturesTable.css\";\r\n\r\nFeaturesTable.propTypes = {\r\n headers: PropTypes.array,\r\n rows: PropTypes.array,\r\n footnote: PropTypes.string,\r\n featureColumnHeaderBGColor: PropTypes.string,\r\n featureColumnHeaderFontColor: PropTypes.string,\r\n featureCellBGColorAccent: PropTypes.string,\r\n featureCellBGColor: PropTypes.string,\r\n featureCellFontColor: PropTypes.string,\r\n columnHeaderBGColor: PropTypes.string,\r\n columnHeaderFontColor: PropTypes.string,\r\n cellBGColorAccent: PropTypes.string,\r\n cellBGColor: PropTypes.string,\r\n cellFontColor: PropTypes.string,\r\n};\r\n\r\n//Ejemplo del Formato del Header, titulo y ancho porcentual de columna\r\n/*headers={[\r\n {title:\"Servicio\", columnWidthPct:\"50%\", columnWidthPhonePct:\"40%\"},\r\n {title:\"Límite de suma\", columnWidthPct:\"25%\", columnWidthPhonePct:\"30\"},\r\n {title:\"Eventos\", columnWidthPct:\"25%\", columnWidthPhonePct:\"30\"}\r\n]}*/\r\n\r\nfunction FeaturesTable({\r\n headers = [],\r\n rows = [],\r\n footnote,\r\n featureColumnHeaderBGColor = \"#001a70\",\r\n featureColumnHeaderFontColor = \"#fff\",\r\n featureCellBGColorAccent = \"#DCDCDC\",\r\n featureCellBGColor = \"#E6E6E6\",\r\n featureCellFontColor = \"#222\",\r\n columnHeaderBGColor = \"#d7de00\",\r\n columnHeaderFontColor = \"#001a70\",\r\n cellBGColorAccent = \"#e7ea91\",\r\n cellBGColor = \"#ebedb5\",\r\n cellFontColor = \"#222222\",\r\n ...props\r\n}) {\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const isFullHD = useMediaQuery(\"(min-width: 1920px)\");\r\n const isMidLaptop = useMediaQuery(\"(min-width: 1366px)\");\r\n const isIpadLandscape = useMediaQuery(\"(min-width: 1024px)\");\r\n const isIpadPortrait = useMediaQuery(\"(min-width: 768px)\");\r\n const isIphoneX = useMediaQuery(\"(min-width: 375px)\");\r\n const isXSmall = useMediaQuery(\"(max-width: 374px)\");\r\n\r\n const tableHeader = (index) => {\r\n let cls = {};\r\n cls.fontFamily = \"Montserrat\";\r\n cls.fontWeight = \"bold\";\r\n cls.fontStretch = \"normal\";\r\n cls.fontStyl = \"normal\";\r\n cls.letterSpacing = \"normal\";\r\n cls.textAlign = \"center\";\r\n\r\n if (isXSmall) {\r\n cls.minHeight = \"50px\";\r\n cls.fontSize = \"14px\";\r\n cls.lineHeight = 0.57;\r\n }\r\n\r\n if (isIphoneX) {\r\n cls.minHeight = \"50px\";\r\n cls.fontSize = \"13px\";\r\n cls.lineHeight = 0.57;\r\n }\r\n\r\n if (isIpadPortrait) {\r\n cls.minHeight = \"44px\";\r\n cls.fontSize = \"16px\";\r\n cls.lineHeight = 0.81;\r\n }\r\n\r\n if (isIpadLandscape) {\r\n cls.minHeight = \"48px\";\r\n cls.fontSize = \"20px\";\r\n cls.lineHeight = 0.9;\r\n }\r\n\r\n if (isMidLaptop) {\r\n cls.height = \"61px\";\r\n cls.fontSize = \"24px\";\r\n cls.lineHeight = 1;\r\n }\r\n\r\n if (isFullHD) {\r\n cls.minHeight = \"87px\";\r\n cls.fontSize = \"32px\";\r\n cls.lineHeight = 1.13;\r\n }\r\n\r\n if (is4K) {\r\n cls.minHeight = \"87px\";\r\n cls.fontSize = \"32px\";\r\n cls.lineHeight = 1.13;\r\n }\r\n\r\n if (index === 0) {\r\n cls.backgroundColor = featureColumnHeaderBGColor;\r\n cls.color = featureColumnHeaderFontColor;\r\n } else {\r\n cls.backgroundColor = columnHeaderBGColor;\r\n cls.color = columnHeaderFontColor;\r\n cls.lineHeight = 1.0;\r\n }\r\n return cls;\r\n };\r\n\r\n const textStyle = () => {\r\n let cls = {};\r\n\r\n cls.fontFamily = \"Montserrat\";\r\n cls.fontWeight = 600;\r\n cls.fontStretch = \"normal\";\r\n cls.fontStyl = \"normal\";\r\n cls.letterSpacing = \"normal\";\r\n cls.textAlign = \"left\";\r\n\r\n if (isXSmall) {\r\n cls.padding = \"8px\";\r\n cls.fontSize = \"12px\";\r\n }\r\n\r\n if (isIphoneX) {\r\n cls.padding = \"12px\";\r\n cls.fontSize = \"12px\";\r\n }\r\n\r\n if (isIpadPortrait) {\r\n cls.padding = \"12px 12px 12px 11px\";\r\n cls.minHeight = \"43px\";\r\n cls.fontSize = \"14px\";\r\n }\r\n\r\n if (isIpadLandscape) {\r\n cls.padding = \"12px 16px 12px 15px\";\r\n cls.minHeight = \"46px\";\r\n cls.fontSize = \"16px\";\r\n }\r\n\r\n if (isMidLaptop) {\r\n cls.padding = \"16px 21px 16px 20px\";\r\n cls.minHeight = \"60px\";\r\n cls.fontSize = \"20px\";\r\n }\r\n\r\n if (isFullHD) {\r\n cls.padding = \"27px 30px 20px\";\r\n cls.minHeight = \"87px\";\r\n cls.fontSize = \"24px\";\r\n }\r\n\r\n if (is4K) {\r\n cls.padding = \"27px 30px 20px\";\r\n cls.minHeight = \"87px\";\r\n cls.fontSize = \"24px\";\r\n }\r\n\r\n return cls;\r\n };\r\n\r\n const tableCell = (index, isColumnFeature) => {\r\n let cls = {};\r\n cls = textStyle();\r\n\r\n if (isColumnFeature) {\r\n cls.backgroundColor =\r\n index % 2 === 0 ? featureCellBGColorAccent : featureCellBGColor;\r\n cls.color = featureCellFontColor;\r\n cls.textAlign = \"left\";\r\n } else {\r\n cls.backgroundColor = index % 2 === 0 ? cellBGColorAccent : cellBGColor;\r\n cls.color = cellFontColor;\r\n cls.textAlign = \"right\";\r\n }\r\n return cls;\r\n };\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n {footnote &&
\r\n \r\n );\r\n}\r\n\r\nexport default FeaturesTable;\r\n","import React from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport Meta from \"@components/Meta/Meta\";\r\n\r\nconst NotFound = () => (\r\n <>\r\n | \r\n | \r\n );\r\n })}\r\n
|---|
| \r\n {idx + 1 === 1 || idx + 1 === idx + 1 + headers.length ? (\r\n | \r\n ))}\r\n
{Parser(footnote)}
}\r\n \r\n
\r\n \r\n);\r\n\r\nexport default NotFound;","import React from 'react'\r\nimport ContentLoader from 'react-content-loader'\r\n\r\nconst ImageViewerLoader = props => (\r\n 404 - Contenido no encontrado!
\r\nLa dirección URL que buscas NO EXISTE!!
\r\n 🏠 VOLVER AL INICIO\r\n \r\n {!showSpinner ? ( \r\n
\r\n );\r\n}\r\n\r\nexport default ImageViewer;","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAMAAAC7IEhfAAAAdVBMVEVHcEwAurPr+/kAv68DurUAubYMvbcAurTu+/oDurUAurQGu7Xa9fUAubQAubPH8O9V0c216+oAu7RHzckAubNr19Ns19M7ycUAurUAurT////A7u1/3dnw+/tBzMfp+fgQvrhg1NEkxL6a5OGy6ulx2dXg9/X3My4JAAAAGXRSTlMAkPQQ4ifa8fH5oNDysE7ZwNx4yK/BwdBgQXxrAgAAAahJREFUOMulletygyAQhXVUcKImXtOeTaVoNO//iEXQImqSmXb/BMw3e7jsHjzPiaisE6hI6jLynkbkhxOEcP7xj9ngNGVqCtJRNExNT8GeO3PwPKZVxLn6dN5yKl3lYBqtVFJXtga/0EFcOOq1fA2WErVuaDJlqNe6bJL9wjrG0cgzq/4JntIOpHtncnLMOwo4zPpcUIj+26wTPJiFK1rA2yo6GJAqIx6Bx6/BmGO6Ix850YG0ihmkHL4CQ8T0OiPFCNXVIaF3IDGlXaKhd9LUoPQyFO8zFsi8BLQBRyG6wQUJiQcH1NH3ciNNgAfmZuzwUMO+dzOGCgxdUMhpKOQe3EobcC+93cxxRrWZ7fEcgtPx7A78SHo68Mi5QtyXyQO9e4VuUWBc/ktXoC6KbZml80TuyswW7l0IIXszFqoVROsUrm0FszTdUoNdLNGHTrhqLpMWN9XhECsTWJpL1S5P7XchW+qlndt2/TUAE62ExGD9h83COjJtKQs5DPbuUubYVJA9N6nM9Uj/me35fzXS2ZrZdbHm62TNfvAfs5+fj8w8H9n2+fgBPSR5T5zcenwAAAAASUVORK5CYII=\"","import React from \"react\";\r\nimport Parser from \"html-react-parser\";\r\nimport PropTypes from \"prop-types\";\r\nimport { animations } from \"react-animation\";\r\nimport Image from \"react-bootstrap/Image\";\r\nimport \"./TextoYTitulo.css\";\r\nimport IconoDownload from \"./../../assets/img/download/Download Icon.png\";\r\n\r\nTextoYTitulo.propTypes = {\r\n title: PropTypes.string,\r\n subtitle: PropTypes.string,\r\n text: PropTypes.string,\r\n mainImage: PropTypes.string,\r\n titleLinks: PropTypes.string,\r\n downloadLinks: PropTypes.array,\r\n borderTopColor: PropTypes.string,\r\n heightsm: PropTypes.bool,\r\n};\r\n\r\nfunction TextoYTitulo({\r\n title,\r\n subtitle,\r\n text,\r\n mainImage,\r\n titleLinks = \"Descargas\",\r\n downloadLinks,\r\n borderTopColor = \"#001a70\",\r\n heightsm,\r\n ...props\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 {!isEmpty(arrImages) && arrImages.map((image, index) => {\r\n return (\r\n
\r\n \r\n {onHover(event)}}\r\n style={{width:\"247px\", height:\"203px\"}}\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\nCargando Album
\r\n
\r\n {subtitle ? (\r\n <>\r\n \r\n {Parser(text)}\r\n\r\n {mainImage && (\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default TextoYTitulo;","export default __webpack_public_path__ + \"static/media/Btn_FullHD.8696be22.png\";","export default __webpack_public_path__ + \"static/media/Btn_iPad.0adeb680.png\";","import React, { useEffect, useState } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { getInfoChat } from \"./Store/Actions/chat-button.actions\";\r\nimport TextoYTitulo from \"@components/TextoYTitulo/TextoYTitulo\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport \"./chatform.css\";\r\nimport { isEmpty, isUndefined } from \"lodash\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport Btn_FullHD from \"assets/img/iniciarChat/Btn_FullHD.png\";\r\nimport Btn_iPad from \"assets/img/iniciarChat/Btn_iPad.png\";\r\nimport Btn_iPhone from \"assets/img/iniciarChat/Btn_iPhone.png\";\r\nimport { remAccents } from \"@helpers/utils\";\r\nimport moment from \"moment\";\r\nimport \"moment/locale/es\";\r\n\r\nmoment.locale(\"es\");\r\n\r\nconst CHAT_EN_LINEA_URL = \"chat/formulario\"; //process.env.REACT_APP_CHAT_LINEA_URL\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\n\r\nfunction ChatForm() {\r\n const dispatch = useDispatch();\r\n\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const isFullHD = useMediaQuery(\"(min-width: 1920px)\");\r\n const isMidLaptop = useMediaQuery(\"(min-width: 1366px)\");\r\n const isIpadLandscape = useMediaQuery(\"(min-width: 1024px)\");\r\n const isIpadPortrait = useMediaQuery(\"(min-width: 768px)\");\r\n\r\n const [tituloInfo, setTituloInfo] = useState(\"\");\r\n const [info, setInfo] = useState(\"\");\r\n const [horario, setHorario] = useState(\"\");\r\n const [status, setStatus] = useState(false);\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { textoInformativo } = useSelector(({ Base }) => Base.Chat);\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"Chat\" && route?.identificadorSitio === \"AC\");\r\n\r\n useEffect(() => {\r\n dispatch(getInfoChat());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(textoInformativo)) {\r\n let texto = textoInformativo[0]?.texto?.html?.toString();\r\n let titulo = textoInformativo[0]?.titulo?.html?.toString();\r\n let horarioStr = textoInformativo[0]?.horario?.html?.toString();\r\n\r\n setTituloInfo(titulo);\r\n setInfo(texto);\r\n setHorario(horarioStr);\r\n checkStatusButton();\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [textoInformativo]);\r\n\r\n const checkStatusButton = () => {\r\n if (!isEmpty(textoInformativo)) {\r\n //obtenemos el nombre del día actual sin tildes y con inicial mayúscula.\r\n const dayBase = moment().locale(\"es\").format(\"dddd\");\r\n const dayStr = dayBase.toString();\r\n var dayStrName = dayStr.charAt(0).toUpperCase() + dayStr.slice(1);\r\n dayStrName = remAccents(dayStrName);\r\n\r\n //obtenemos la lista de nombres de campos del Selector \"textoInformativo\".\r\n const daysKeys = Object.keys(textoInformativo[0]);\r\n\r\n //filtramos los nombres de campos para obtener los que contengan el nombre del día.\r\n const daySchedule = daysKeys.filter((item) => item.includes(dayStrName));\r\n //Filtramos los campos por nombre para obtener la hora de inicio y fin, que contengan el nombre del día.\r\n const filteredSchedule = Object.keys(textoInformativo[0])\r\n .filter((key) => daySchedule.includes(key))\r\n .reduce((obj, key) => {\r\n obj[key] = textoInformativo[0][key];\r\n return obj;\r\n }, {});\r\n\r\n //Obtenemos los valores de inicio y fin del rango de horario.\r\n const scheduleRange = Object.entries(filteredSchedule);\r\n const scheduleRangeFrom = scheduleRange[0];\r\n const scheduleRangeTo = scheduleRange[1];\r\n\r\n //Obtenemos por separado la hora y minuto actual.\r\n let curTime = moment().locale(\"es\").format(\"LTS\");\r\n\r\n //validamos que la hora esté en el rango.\r\n let result =\r\n moment(curTime, \"HH:mm:ss\").isAfter(\r\n moment(scheduleRangeFrom[1], \"HH:mm:ss\")\r\n ) &&\r\n moment(curTime, \"HH:mm:ss\").isBefore(\r\n moment(scheduleRangeTo[1], \"HH:mm:ss\")\r\n );\r\n\r\n setStatus(result);\r\n }\r\n };\r\n\r\n const renderButton = () => {\r\n if (status) {\r\n let btnImage =\r\n is4K || isFullHD || isMidLaptop\r\n ? Btn_FullHD\r\n : isIpadLandscape || isIpadPortrait\r\n ? Btn_iPad\r\n : Btn_iPhone;\r\n const res =\r\n \"{Parser(title)}
\r\n {Parser(subtitle)}
\r\n \r\n ) : (\r\n {Parser(title)}
\r\n )}\r\n\r\n
\r\n )}\r\n\r\n {downloadLinks && (\r\n \r\n
\r\n )}\r\n {titleLinks}
\r\n \r\n {downloadLinks.map((lnk, index) => (\r\n
\r\n \r\n
\r\n ))}\r\n \r\n
\r\n \r\n \r\n {lnk.name}\r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default TipoCambio;","export const GET_INFO_CHAT = \"GET_INFO_CHAT\";\r\n","const rootCMS = process.env.REACT_APP_API_GRAPHQL;\r\nexport const chatInfoRoute = rootCMS + '?query={aCChatContenido(status: PUBLISHED){titulo{html} texto{html} horario{html} horarioDomingoInicio hararioDomingoFin horarioLunesInicio horarioLunesFinal horarioMartesInicio horarioMartesFinal horarioMiercolesInicio horarioMiercolesFin horarioJuevesInicio horarioJuevesFin horarioViernesInicio horarioViernesFin horarioSabadoInicio horarioSabadoFin mensajeFueradeHorario{html} textoChatIniciado{html} textoChat{html} titulodelformulario{html}}}';\r\n","/* eslint-disable import/no-anonymous-default-export */\r\nimport axios from \"axios\";\r\nimport { chatInfoRoute } from \"./chat-button.configs\";\r\n\r\nexport async function reqInfoChat() {\r\n const response = await axios.get(chatInfoRoute);\r\n return response.data;\r\n}\r\n","import { \r\n GET_INFO_CHAT\r\n} from \"./chat-button.types\";\r\nimport * as chatButtonService from \"../../Services/chat-button.services\";\r\n\r\nexport function getInfoChat() {\r\n return function (dispatch) {\r\n try { \r\n return chatButtonService.reqInfoChat()\r\n .then((data) => { \r\n dispatch(\r\n {\r\n type: GET_INFO_CHAT,\r\n payload: data\r\n })\r\n });\r\n }\r\n catch (error) {\r\n return (dispatch) => {\r\n dispatch({\r\n type: GET_INFO_CHAT,\r\n payload:-1\r\n });\r\n }\r\n }\r\n };\r\n}","import React, { useEffect } from \"react\";\r\nimport { Helmet } from \"react-helmet\";\r\n\r\nexport const ChatDesol = ({ payload, url }) => {\r\n useEffect(() => {\r\n const { detail, email, id, idType, name } = payload;\r\n const tiposIdentificacion = {\r\n 1: \"Física\",\r\n 2: \"Jurídica\",\r\n 3: \"Extranjero Residente\"\r\n };\r\n\r\n setTimeout(() => {\r\n window.MyG2C.API.chatAsk(`\r\n Asunto: ${detail}\r\n {title}
\r\n {longDateStr}
\r\n COMPRA {curSymbol}{compra}
\r\n VENTA {curSymbol}{venta}
\r\n TBP {tasaBasicaPasiva}%
\r\n \r\n Datos del cliente:\r\n
- \r\n
- Nombre: ${name} \r\n
- Email: ${email} \r\n
- Tipo de identificación: ${tiposIdentificacion[idType]} \r\n
- Número de identificación: ${id} \r\n
\r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { getInfoChat } from \"./Store/Actions/chat-button.actions\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport { animations } from \"react-animation\";\r\nimport Button from \"react-bootstrap/Button\";\r\nimport * as Yup from \"yup\";\r\nimport { Formik, Form, Field } from \"formik\";\r\nimport { maskNumber } from \"../../../../@helpers/utils\";\r\nimport \"./bootstrap.css\";\r\nimport \"./chatFormulario.css\";\r\nimport { ChatDesol } from \"./ChatDesol\";\r\nimport { isEmpty } from \"lodash\";\r\nimport Parser from \"html-react-parser\";\r\nimport moment from \"moment\";\r\nimport \"moment/locale/es\";\r\nimport { remAccents } from \"@helpers/utils\";\r\nimport Swal from \"sweetalert2\";\r\nmoment.locale(\"es\");\r\n\r\nfunction ChatFormulario() {\r\n const dispatch = useDispatch();\r\n const BORDER_TOP_COLOR = \"#d7de00\";\r\n const [changeValue, setChangeValue] = useState(true);\r\n const [maskId, setMaskId] = useState(9);\r\n const [formato, setFormato] = useState(\"Formato: 123456789\");\r\n const [url, setUrl] = useState(process.env.REACT_APP_CHAT_SERVICIO_CLIENTE_URL);\r\n const { textoInformativo } = useSelector(({ Base }) => Base.Chat);\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const defRoute = rutas?.filter((route) => route?.name === \"ChatForm\" && route?.identificadorSitio === \"AC\");\r\n const [tituloInfo, setTituloInfo] = useState(\"\");\r\n const [info, setInfo] = useState(\"\");\r\n const [textoChatIniciado, setTextoChatIniciado] = useState(\"\");\r\n const [status, setStatus] = useState(false);\r\n const [mensajeFueraHorario, setMensajeFueraHorario] = useState(\"\");\r\n\r\n const [initialValues, setInitialValues] = useState({\r\n idType: \"1\",\r\n id: \"\",\r\n name: \"\",\r\n email: \"\",\r\n typeChat: \"1\",\r\n detail: \"\",\r\n });\r\n const schemaValidation = Yup.object().shape({\r\n idType: Yup.string().required(\"Dato requerido\"),\r\n id: Yup.string()\r\n .required(\"Dato requerido\")\r\n .typeError(\"Solo permite números [0-9]\")\r\n .min(\r\n maskId,\r\n \"Favor revisar la cantidad ya que contiene valores menores a \" +\r\n maskId +\r\n \" caracteres\"\r\n ),\r\n name: Yup.string().required(\"Dato requerido\"),\r\n email: Yup.string()\r\n .required(\"Dato requerido\")\r\n .email(\"Ingrese un correo válido\"),\r\n typeChat: Yup.string()\r\n .label(\"Favor seleccionar el tipo de chat correcto\")\r\n .typeError(\"Favor seleccionar el tipo de chat correcto\"),\r\n detail: Yup.string().required(\"Dato requerido\"),\r\n });\r\n\r\n const onChangeIdType = (e) => {\r\n if (e === \"1\") {\r\n setMaskId(9);\r\n setFormato(\"Formato: 123456789\");\r\n } else if (e === \"2\") {\r\n setMaskId(10);\r\n setFormato(\"Formato: 3123123456\");\r\n } else if (e === \"3\") {\r\n setMaskId(12);\r\n setFormato(\"Formato: 1NNNCCCCCCDV\");\r\n }\r\n };\r\n\r\n const urlChange = (e) => {\r\n if (e.target.value === \"1\") {\r\n setUrl(process.env.REACT_APP_CHAT_SERVICIO_CLIENTE_URL);\r\n } else {\r\n setUrl(process.env.REACT_APP_CHAT_COBROS_URL);\r\n }\r\n };\r\n\r\n const checkStatusButton = () => {\r\n if (!isEmpty(textoInformativo)) {\r\n //obtenemos el nombre del día actual sin tildes y con inicial mayúscula.\r\n const dayBase = moment().locale(\"es\").format(\"dddd\");\r\n const dayStr = dayBase.toString();\r\n var dayStrName = dayStr.charAt(0).toUpperCase() + dayStr.slice(1);\r\n dayStrName = remAccents(dayStrName);\r\n\r\n //obtenemos la lista de nombres de campos del Selector \"textoInformativo\".\r\n const daysKeys = Object.keys(textoInformativo[0]);\r\n\r\n //filtramos los nombres de campos para obtener los que contengan el nombre del día.\r\n const daySchedule = daysKeys.filter((item) => item.includes(dayStrName));\r\n //Filtramos los campos por nombre para obtener la hora de inicio y fin, que contengan el nombre del día.\r\n const filteredSchedule = Object.keys(textoInformativo[0])\r\n .filter((key) => daySchedule.includes(key))\r\n .reduce((obj, key) => {\r\n obj[key] = textoInformativo[0][key];\r\n return obj;\r\n }, {});\r\n\r\n //Obtenemos los valores de inicio y fin del rango de horario.\r\n const scheduleRange = Object.entries(filteredSchedule);\r\n const scheduleRangeFrom = scheduleRange[0];\r\n const scheduleRangeTo = scheduleRange[1];\r\n\r\n //Obtenemos por separado la hora y minuto actual.\r\n let curTime = moment().locale(\"es\").format(\"LTS\");\r\n\r\n //validamos que la hora esté en el rango.\r\n let result =\r\n moment(curTime, \"HH:mm:ss\").isAfter(\r\n moment(scheduleRangeFrom[1], \"HH:mm:ss\")\r\n ) &&\r\n moment(curTime, \"HH:mm:ss\").isBefore(\r\n moment(scheduleRangeTo[1], \"HH:mm:ss\")\r\n );\r\n\r\n return result;\r\n } else {\r\n return false;\r\n }\r\n };\r\n\r\n const handleStartChat = () => {\r\n const estatusHorario = checkStatusButton();\r\n if(estatusHorario) {\r\n setChangeValue(!changeValue);\r\n } else {\r\n Swal.fire({\r\n title: '¡Lo sentimos!',\r\n text: 'El chat se encuentra fuera de horario',\r\n icon: 'warning',\r\n })\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n dispatch(getInfoChat());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(textoInformativo)) {\r\n let texto = textoInformativo[0]?.textoChat?.html?.toString();\r\n let titulo = textoInformativo[0]?.titulodelformulario?.html?.toString();\r\n let textoIniciado = textoInformativo[0]?.textoChatIniciado?.html?.toString();\r\n let mensajeFueraHorarioStr = textoInformativo[0]?.mensajeFueradeHorario?.html?.toString();\r\n\r\n setTituloInfo(titulo);\r\n setInfo(texto);\r\n setTextoChatIniciado(textoIniciado);\r\n setStatus(checkStatusButton());\r\n setMensajeFueraHorario(mensajeFueraHorarioStr);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [textoInformativo]);\r\n\r\n return (\r\n \r\n \r\n {status ? (\r\n <>\r\n {changeValue ? (\r\n <>\r\n {\r\n handleStartChat()\r\n }}\r\n >\r\n {({ setFieldValue, errors, touched }) => (\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 ChatFormulario;\r\n","import React, { useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport * as CMSActions from \"../../store/actions\";\r\nimport TextoYTitulo from \"@components/TextoYTitulo/TextoYTitulo\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\n\r\nfunction HomeAhorro(props) {\r\n const dispatch = useDispatch();\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n const { historia } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n dispatch(CMSActions.getHistoria());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"AhorroCredito\");\r\n\r\n const historyItems = (\r\n <>\r\n {historia &&\r\n historia?.aCHistoria?.map((item, index) => (\r\n {Parser(tituloInfo)}
\r\n{Parser(info)}
\r\n {Parser(textoChatIniciado)}
\r\n {Parser(mensajeFueraHorario)}
\r\n )}\r\n \r\n \r\n ![{serviahorro?.data?.serviahorro[0]?.titulo}/]({root+serviahorro?.data?.serviahorro[0]?.botonEnlaceImagen?.urls[0]})
\r\n \r\n
\r\n \r\n }\r\n \r\n );\r\n}\r\n\r\nexport default Serviahorro;\r\n","import React from \"react\";\r\nimport Parser from \"html-react-parser\";\r\nimport PropTypes from \"prop-types\";\r\nimport IconoDownload from \"./../../assets/img/download/Download Icon.png\";\r\n\r\nimport \"./CardTypeFolder.css\";\r\n\r\nconst CardTypeFolder = ({\r\n titleStyle = { width: \"fit-content\" },\r\n title,\r\n description = \"\",\r\n files = [],\r\n compactDescription = false,\r\n borderTopColor,\r\n ...props\r\n}) => {\r\n return (\r\n <>\r\n \r\n \r\n {description && (\r\n \r\n {Parser(description)}\r\n \r\n )}\r\n {files && (\r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nCardTypeFolder.propTypes = {\r\n titleStyle: PropTypes.object,\r\n title: PropTypes.string.isRequired,\r\n description: PropTypes.string,\r\n files: PropTypes.array,\r\n borderTopColor: PropTypes.string,\r\n};\r\n\r\nexport default CardTypeFolder;\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { isEmpty } from \"lodash\";\r\nimport PropTypes from \"prop-types\";\r\nimport Parser from \"html-react-parser\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport CardTypeFolder from \"@components/CardTypeFolder/CardTypeFolder\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\n\r\nimport \"./InversionesInfo.css\";\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nconst InversionesInfo = ({ inversion, borderTopColor, ...props }) => {\r\n const [meta, setMeta] = useState({});\r\n const [itemsBreadcrumb, setItemsBreadcrumb] = useState([]);\r\n const [investment] = useState(inversion);\r\n const [detailTitleStyle, setDetailTitleStyle] = useState({\r\n minWidth: \"225px\",\r\n maxWidth: \"75%\",\r\n width: \"fit-content\",\r\n });\r\n\r\n const isDesktop = useMediaQuery(\"(min-width: 992px)\");\r\n const isIpadPortrait = useMediaQuery(\"(max-width: 992px)\");\r\n const isIphoneLandscape = useMediaQuery(\"(max-width: 576px)\");\r\n\r\n const getWidthTitle = () => {\r\n if (isIphoneLandscape) {\r\n setDetailTitleStyle({\r\n minWidth: \"178\",\r\n maxWidth: \"100%\",\r\n width: \"fit-content\",\r\n });\r\n } else if (isIpadPortrait || isIphoneLandscape) {\r\n setDetailTitleStyle({\r\n minWidth: \"225px\",\r\n maxWidth: \"75%\",\r\n width: \"fit-content\",\r\n });\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n getWidthTitle();\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [isDesktop, isIpadPortrait, isIphoneLandscape]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(inversion)) {\r\n setMeta((m) => {\r\n return {\r\n ...m,\r\n title: inversion.title,\r\n description: inversion.description,\r\n url: `/${inversion.idInversion}`,\r\n };\r\n });\r\n\r\n if (inversion.prevRoute) {\r\n setItemsBreadcrumb([\r\n {\r\n url: \"#\" /*inversion.prevRoute[0].url*/,\r\n text: inversion.prevRoute[0].text,\r\n },\r\n ]);\r\n } else {\r\n setItemsBreadcrumb([\r\n { url: `${inversion.idInversion}`, text: inversion.title },\r\n ]);\r\n }\r\n }\r\n }, [inversion]);\r\n\r\n return (\r\n <>\r\n \r\n
\r\n {title}
\r\n\r\n {files.map((file, index) => (\r\n
\r\n )}\r\n \r\n
\r\n ))}\r\n \r\n
\r\n \r\n \r\n {file.fileName}\r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nInversionesInfo.propTypes = {\r\n inversion: PropTypes.object.isRequired,\r\n borderTopColor: PropTypes.string,\r\n};\r\n\r\nexport default InversionesInfo;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { isEmpty } from \"lodash\";\r\nimport InversionesInfo from \"@components/InversionesInfo/InversionesInfo\";\r\nimport { history } from \"@helpers/history\";\r\nimport { isObjEmpty } from \"@helpers/utils\";\r\n\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\n\r\nfunction Inversiones(props) {\r\n const {\r\n match: { params },\r\n } = props;\r\n const [idInversion, setIdInversion] = useState(\"\");\r\n const [inversion, setInversion] = useState({});\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { inversiones } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n setIdInversion(params?.id);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n const defRoute = rutas?.filter((route) => route?.name === \"Inversiones\");\r\n\r\n const prevRoute = defRoute.map((route) => {\r\n return {\r\n url: route.url.replace(\"/:id\", \"\"),\r\n text: route.h1,\r\n };\r\n });\r\n if (!isEmpty(idInversion) && !isEmpty(inversiones)) {\r\n let promise = new Promise((resolve, reject) => {\r\n let normalizeInversion = [];\r\n let resMatch = {};\r\n if (!isEmpty(inversiones?.aCInversion)) {\r\n normalizeInversion = inversiones.aCInversion.map((inv) => ({\r\n ...inv,\r\n idInversion: inv.idInversion.toLowerCase().replaceAll(\" \", \"-\"),\r\n rutaPrevia: prevRoute,\r\n }));\r\n resMatch =\r\n normalizeInversion &&\r\n normalizeInversion.filter(\r\n (inv) => inv.idInversion === idInversion\r\n )[0];\r\n }\r\n resolve(resMatch);\r\n });\r\n\r\n promise.then((res) => {\r\n !isEmpty(res) ?\r\n setInversion({\r\n title: res.titulo,\r\n description: res.descripcion?.html,\r\n details: res.bag?.contentItems,\r\n files: res.archivos?.contentItems,\r\n prevRoute: res.rutaPrevia,\r\n })\r\n : isObjEmpty(inversion) && history.push('/no-encontrado') \r\n });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [inversiones, idInversion]);\r\n\r\n return (\r\n <>\r\n {!isEmpty(idInversion) && !isEmpty(inversion) && (\r\n \r\n
\r\n {investment.title}
\r\n \r\n {Parser(investment.description)}\r\n \r\n\r\n {investment.details &&\r\n investment.details.map((detail, index) => (\r\n {\r\n return {\r\n fileName: file.tituloEnlace,\r\n fileURL: ROOT + file.archivo.urls[0],\r\n };\r\n })\r\n }\r\n borderTopColor={borderTopColor}\r\n />\r\n )}\r\n
\r\n \r\n {contactenos?.accontactenos[0]?.bag.contentItems &&\r\n contactenos?.accontactenos[0]?.bag.contentItems.map(\r\n (detail, index) => (\r\n
\r\n \r\n )}\r\n \r\n );\r\n\r\n return (\r\n <>\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n {description && (\r\n {title && Parser(title)}
\r\n {subtitle &&{subtitle}
}\r\n{Parser(description)}
\r\n )}\r\n {buttons && buttons.length > 0 && (\r\n \r\n {buttons.map((button, index) => (\r\n \r\n
\r\n )}\r\n \r\n 
\r\n
\r\n \r\n ))}\r\n \r\n
\r\n )}\r\n {mainImage && mainImage.img && (\r\n {title && Parser(title)}
\r\n\r\n 
\r\n
\r\n )}\r\n \r\n );\r\n};\r\n\r\nBasicBanner.propTypes = {\r\n backgroundImage: PropTypes.object,\r\n mainImage: PropTypes.object,\r\n title: PropTypes.string,\r\n subtitle: PropTypes.string,\r\n description: PropTypes.string,\r\n buttons: PropTypes.array,\r\n};\r\n\r\nexport default BasicBanner;\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport Parser from \"html-react-parser\";\r\nimport { isEmpty } from \"lodash\";\r\nimport BasicBanner from \"@components/BasicBanner/BasicBanner\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport * as CMSActions from \"app/@Base/store/actions\";\r\nimport * as CMSActionsAhorro from \"../../store/actions\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\n\r\nimport \"./Sucursales.css\";\r\n\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nconst Sucursales = () => {\r\n const dispatch = useDispatch();\r\n const [banner, setBanner] = useState({});\r\n const [button, setButton] = useState({});\r\n const [provinces, setProvinces] = useState([]);\r\n const [services, setServices] = useState([]);\r\n const [branchOffices, setBranchOffices] = useState([]);\r\n const [filters, setFilters] = useState({});\r\n const [searching, setSearching] = useState(false);\r\n\r\n const isDesktop = useMediaQuery(\"(min-width: 992px)\");\r\n const isIpadPortrait = useMediaQuery(\"(max-width: 992px)\");\r\n const isIphoneLandscape = useMediaQuery(\"(max-width: 576px)\");\r\n\r\n //Selectores de estado\r\n const { loggedUser } = useSelector(({ Base }) => Base?.User);\r\n const { provincias } = useSelector(({ Base }) => Base.Catalogos);\r\n const { servicios } = useSelector(({ Base }) => Base.Catalogos);\r\n const { sucursales } = useSelector(({ Base }) => Base.Catalogos);\r\n const { sucursalesCMS } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n const { cantones } = useSelector(({ Base }) => Base.Catalogos);\r\n const { distritos } = useSelector(({ Base }) => Base.Catalogos);\r\n\r\n const defRoute = {\r\n title: \"Sucursales | Ahorro y Crédito\",\r\n description: \"Encuentre la información de todas las sucursales de nuestra institución.\"\r\n }\r\n\r\n useEffect(() => {\r\n dispatch(CMSActionsAhorro.getCMSSucursales());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n const { token } = loggedUser;\r\n if (token) {\r\n isEmpty(provincias) && dispatch(CMSActions.getProvincias(token));\r\n isEmpty(servicios) && dispatch(CMSActions.getServicios(token));\r\n isEmpty(sucursales) && dispatch(CMSActions.getSucursales(token));\r\n isEmpty(cantones) && dispatch(CMSActions.getCantones(token));\r\n isEmpty(distritos) && dispatch(CMSActions.getDistritos(token));\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [loggedUser]);\r\n\r\n //Accediendo y asignando datos.\r\n useEffect(() => {\r\n !isEmpty(provincias) && setProvinces(provincias);\r\n }, [provincias]);\r\n\r\n useEffect(() => {\r\n !isEmpty(servicios) && setServices(servicios);\r\n }, [servicios]);\r\n\r\n useEffect(() => {\r\n !isEmpty(sucursales) && setBranchOffices(sucursales);\r\n }, [sucursales]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(sucursalesCMS)) {\r\n let backgroundImage;\r\n let mainImage = {\r\n img:\r\n ROOT + sucursalesCMS.aCSucursalBannerBackground[0].heroImage.urls[0],\r\n alt: \"Sucursales\",\r\n };\r\n let title = sucursalesCMS.aCSucursalBannerBackground[0].copyText;\r\n\r\n let buttonImage = \"\";\r\n\r\n if (isIphoneLandscape) {\r\n backgroundImage =\r\n ROOT +\r\n sucursalesCMS.aCSucursalBannerBackground[0].imagendefondoMovil\r\n .urls[0];\r\n buttonImage =\r\n ROOT + sucursalesCMS.aCBotonComoLlegar[0].imagenMovil.urls[0];\r\n } else if (isIpadPortrait) {\r\n backgroundImage =\r\n ROOT +\r\n sucursalesCMS.aCSucursalBannerBackground[0].imagendeFondoIpadPortrait\r\n .urls[0];\r\n buttonImage = ROOT + sucursalesCMS.aCBotonComoLlegar[0].imagen.urls[0];\r\n } else if (isDesktop) {\r\n backgroundImage =\r\n ROOT +\r\n sucursalesCMS.aCSucursalBannerBackground[0].imagendeFondo.urls[0];\r\n buttonImage = ROOT + sucursalesCMS.aCBotonComoLlegar[0].imagen.urls[0];\r\n }\r\n\r\n setBanner({\r\n backgroundImage: {\r\n img: backgroundImage,\r\n alt: \"Banner de Sucursales\",\r\n },\r\n mainImage: mainImage,\r\n title: title,\r\n });\r\n setButton({\r\n img: buttonImage,\r\n alt: \"¿Cómo Llegar?\",\r\n });\r\n }\r\n }, [sucursalesCMS, isIphoneLandscape, isIpadPortrait, isDesktop]);\r\n\r\n const filterBranchOffices = () => {\r\n if (!isEmpty(filters)) {\r\n let filtersEmpty = true;\r\n let branchOfficesFiltered = [];\r\n // Recorre cada filtro ingresado\r\n Object.keys(filters).forEach((key) => {\r\n // valida si posee filtro de provincia, y un valor valido.\r\n if (\r\n key === \"Province\" &&\r\n !isEmpty(filters[key]) &&\r\n +filters[key] !== 0\r\n ) {\r\n filtersEmpty = false;\r\n if (branchOfficesFiltered.length === 0) {\r\n branchOfficesFiltered = [\r\n ...branchOfficesFiltered,\r\n ...sucursales.filter(\r\n (branchOffice) => branchOffice.IdProvincia === +filters[key]\r\n ),\r\n ];\r\n } else {\r\n branchOfficesFiltered = branchOfficesFiltered.filter(\r\n (branchOffice) => branchOffice.IdProvincia === +filters[key]\r\n );\r\n }\r\n // si no tiene resultados termina el filtrado.\r\n if (branchOfficesFiltered.length === 0) {\r\n // dispatch(\r\n // infoNotification({\r\n // title: Messages.NOTIF_TITLE_SEARCH,\r\n // message: Messages.NO_RESULTS,\r\n // })\r\n // );\r\n return;\r\n }\r\n } else if (\r\n key === \"Service\" &&\r\n !isEmpty(filters[key]) &&\r\n +filters[key] !== 0\r\n ) {\r\n //Valida si tiene el filtro de nombre y un valor valido.\r\n filtersEmpty = false;\r\n if (branchOfficesFiltered.length === 0) {\r\n branchOfficesFiltered = [\r\n ...branchOfficesFiltered,\r\n ...sucursales.filter((branchOffice) =>\r\n branchOffice.Servicios.find(\r\n (service) => service === +filters[key]\r\n )\r\n ),\r\n ];\r\n } else {\r\n branchOfficesFiltered = branchOfficesFiltered.filter(\r\n (branchOffice) =>\r\n branchOffice.Servicios.find(\r\n (service) => service === +filters[key]\r\n )\r\n );\r\n }\r\n // si no tiene resultados termina el filtrado.\r\n if (branchOfficesFiltered.length === 0) {\r\n // dispatch(\r\n // infoNotification({\r\n // title: Messages.NOTIF_TITLE_SEARCH,\r\n // message: Messages.NO_RESULTS,\r\n // })\r\n // );\r\n return;\r\n }\r\n }\r\n });\r\n\r\n // Si los filtros estaban vacios devuelve todas las sucursales o caso contrario las filtradas\r\n filtersEmpty\r\n ? setBranchOffices(sucursales)\r\n : setBranchOffices(branchOfficesFiltered);\r\n } else {\r\n setBranchOffices(sucursales);\r\n // dispatch(\r\n // warningNotification({\r\n // title: Messages.NOTIF_TITLE_SEARCH,\r\n // message: Messages.NO_SEARCH_CRITERIA,\r\n // })\r\n // );\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (searching) {\r\n filterBranchOffices();\r\n setSearching(false);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [searching]);\r\n\r\n const filterHandler = (event) => {\r\n setFilters({ ...filters, [event.target.name]: event.target.value });\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default Sucursales;\r\n","import React, { useState, useEffect, useMemo } from \"react\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { isEmpty } from \"lodash\";\r\nimport BasicBanner from \"@components/BasicBanner/BasicBanner\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Pagination from \"@components/Pagination/Pagination\";\r\nimport * as CMSActions from \"app/@Base/store/actions\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport * as CMSActionsAhorro from \"../../store/actions\";\r\nimport phone_icon from \"../../../../../../assets/img/phone_icon.png\";\r\nimport website_icon from \"../../../../../../assets/img/website_icon.png\";\r\nimport facebook_icon from \"../../../../../../assets/img/facebook_icon.png\";\r\nimport instagram_icon from \"../../../../../../assets/img/instagram_icon.png\";\r\n\r\nimport \"./Convenios.css\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\nconst PAGE_SIZE = 10;\r\n\r\nconst Convenios = () => {\r\n const dispatch = useDispatch();\r\n const [banner, setBanner] = useState({});\r\n const [contractTypes, setContractTypes] = useState([]);\r\n const [contracts, setContracts] = useState([]);\r\n const [filters, setFilters] = useState({});\r\n const [searching, setSearching] = useState(false);\r\n const [currentPage, setCurrentPage] = useState(1);\r\n\r\n const filteredContracts = useMemo(() => {\r\n const firstPageIndex = (currentPage - 1) * PAGE_SIZE;\r\n const lastPageIndex = firstPageIndex + PAGE_SIZE;\r\n return contracts?.slice(firstPageIndex, lastPageIndex);\r\n }, [currentPage, contracts]);\r\n\r\n const isDesktop = useMediaQuery(\"(min-width: 992px)\");\r\n const isIpadPortrait = useMediaQuery(\"(max-width: 992px)\");\r\n const isIphoneLandscape = useMediaQuery(\"(max-width: 576px)\");\r\n\r\n //Selectores de estado\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { loggedUser } = useSelector(({ Base }) => Base?.User);\r\n const { tiposConvenios } = useSelector(({ Base }) => Base.Catalogos);\r\n const { convenios } = useSelector(({ Base }) => Base.Catalogos);\r\n const { conveniosCMS } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"Convenios\");\r\n\r\n useEffect(() => {\r\n dispatch(CMSActionsAhorro.getCMSConvenios());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n const { token } = loggedUser;\r\n if (token) {\r\n isEmpty(tiposConvenios) && dispatch(CMSActions.getTiposConvenios(token));\r\n isEmpty(convenios) && dispatch(CMSActions.getConvenios(token));\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [loggedUser]);\r\n\r\n useEffect(() => {\r\n !isEmpty(tiposConvenios) && setContractTypes(tiposConvenios);\r\n }, [tiposConvenios]);\r\n\r\n useEffect(() => {\r\n !isEmpty(convenios) && setContracts(convenios);\r\n }, [convenios]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(conveniosCMS)) {\r\n let backgroundImage;\r\n let mainImage = {\r\n img: ROOT + conveniosCMS.aCBannerConvenios[0].heroImage.urls[0],\r\n alt: \"Convenios\",\r\n };\r\n let title = conveniosCMS.aCBannerConvenios[0].copyText?.html;\r\n let description = conveniosCMS.aCBannerConvenios[0].descripcion?.html;\r\n\r\n if (isIphoneLandscape) {\r\n backgroundImage =\r\n ROOT + conveniosCMS.aCBannerConvenios[0].imagendefondoMovil.urls[0];\r\n } else if (isIpadPortrait) {\r\n backgroundImage =\r\n ROOT + conveniosCMS.aCBannerConvenios[0].imagendeFondoIpad.urls[0];\r\n } else if (isDesktop) {\r\n backgroundImage =\r\n ROOT + conveniosCMS.aCBannerConvenios[0].imagendefondo.urls[0];\r\n }\r\n\r\n setBanner({\r\n backgroundImage: {\r\n img: backgroundImage,\r\n alt: \"Banner de Convenios\",\r\n },\r\n mainImage: mainImage,\r\n title: title,\r\n description: description,\r\n });\r\n }\r\n }, [conveniosCMS, isIphoneLandscape, isIpadPortrait, isDesktop]);\r\n\r\n const filterContracts = () => {\r\n if (!isEmpty(filters)) {\r\n let filtersEmpty = true;\r\n let contractsFiltered = [];\r\n // Recorre cada filtro ingresado\r\n Object.keys(filters).forEach((key) => {\r\n // valida si posee filtro de tipo de convenio, y un valor valido.\r\n if (\r\n key === \"ContractType\" &&\r\n !isEmpty(filters[key]) &&\r\n +filters[key] !== 0\r\n ) {\r\n filtersEmpty = false;\r\n if (contractsFiltered.length === 0) {\r\n contractsFiltered = [\r\n ...contractsFiltered,\r\n ...convenios.filter(\r\n (convenio) => convenio.IdTipoConvenio === +filters[key]\r\n ),\r\n ];\r\n } else {\r\n contractsFiltered = contractsFiltered.filter(\r\n (convenio) => convenio.IdProvincia === +filters[key]\r\n );\r\n }\r\n // si no tiene resultados termina el filtrado.\r\n if (contractsFiltered.length === 0) {\r\n return;\r\n }\r\n }\r\n });\r\n // Si los filtros estaban vacios devuelve todos los convenios o caso contrario las filtradas\r\n filtersEmpty ? setContracts(convenios) : setContracts(contractsFiltered);\r\n } else {\r\n setContracts(convenios);\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (searching) {\r\n filterContracts();\r\n setSearching(false);\r\n setCurrentPage(1);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [searching]);\r\n\r\n const filterHandler = (event) => {\r\n setFilters({ ...filters, [event.target.name]: event.target.value });\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
\r\n Buscar sucursales por:
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n {provinces.map((item, index) => {\r\n return (\r\n \r\n );\r\n })}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {services.map((item, index) => {\r\n return (\r\n \r\n );\r\n })}\r\n \r\n
\r\n \r\n setSearching(true)}\r\n >\r\n Buscar\r\n \r\n
\r\n \r\n {branchOffices &&\r\n branchOffices.map((branchOffice, index) => (\r\n
\r\n ))}\r\n \r\n \r\n \r\n {Parser(branchOffice.Descripcion)}\r\n \r\n
\r\n \r\n
\r\n {branchOffice.Nombre}
\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 Convenios;\r\n","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAYCAYAAAARfGZ1AAAABHNCSVQICAgIfAhkiAAAAoBJREFUSEutlU9oE0EUxr/ZjUFttSgkm/RQRKoHwVbBggeRCuLRmygUe5BKqTRspBdB0PYg9iLGJAWpUPQgHvSkB0VBDwVFQfGg3hS9uJHSPwTTVpPM9NtNYpvupjabLgRmJ/N+38z33psViJgpCAxACB2VR0FCyfvIJHv/zfkYCLSafwGxyRWrUICVcM/XISIQNXPc9VbPmMViC2ZS2Tp4VUtt+A/C2zwBeRzEVOKjf3ir+ZK2HPMEKNkPKznuHx6NJ5hQ0xMg5RMm9aR/uGGehoYHtEa4k6q+wFroAsbn/QgIhM0O6GKSu99eBXDKEYPIJG5zXvmDtwzsQFPwLX3fs6LOC5DyCn4lr/uBVmJKVtiNpIlBZ2zv2AFnbwB3FzcAHt8FoT479a4wyeY52gi0euf2WzR+h773cbSAP8VuTKfeNSqwXCFG7DB07RW93wypvmFe60L25kwjAivKrzuAaGea1vQ7vkONwrp1eYPgNmaYAnMfaM9+ChR4M/Ygs/MR5ylW/+NuHCN2HJr2vNRUahb5Yg+m0k9roptjIfx+PQe8z69e44bbK4x4H7vWvhaaeIIcIM/Csh4DD4vLANoYPnAOuhrjRnLM0zNW3BtI8ZWxWY6/e8MxrMGYvcTOvVaqfWVfu2lYP0cowPufT9jshQ4b3Ow6ldPd6lMNeHl5xBxi8FWeYFtZ5AVkcQhK7yT4Hv/T1srE2nDw6JGOE4RM8GeUBaadL9fqu8hD5T/wckToQjsCwTH6c6TmV8s33Am8uAVGwa6kUQrsW09hrm/nVSQn2Wdoy3lWRTuUiHAc8EhqwQe8gjkVRCjUBqHvhqbTLnWIIntZuswNL0ApJ5YA9Ke83/I9yzYAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAWpJREFUWEftl79Lw1AQx7/3WlAoFqpQtZPgqKuCg9hAN/8MRxENuLl0cXII1cX/xEW0/hg6CuKqmxpRERFEMO+8BEOIWhIwJRnebcm9971PvjzuXgg5B+VcHwagYA7U18eheAtKzYChMj0fBA2tr6BpGw8dN9SOHKjao6jwgZyK+UwL/xLjHt7UMl6dZz8VAdRXF1AuH8uroQEDfMDTTbh7vTjAhL0k9neD4pqauHdO+oAQqis1VIZHoL13uPuP/o5E6EifRd8K9SMH/gBgiUThFAtIAgbAOGAcMA4UxgHpgwBbuOucJrbigXRChifzRgCcs4IBTNqLYk1X5qN/D7iQ+8BLijbffwmzByL52jC4Js9zovsJ0hZud89/jOO1aZRKhwIw9a/CSZuZb6BVC65zHQdAW6Hx1JLkjpDOfjuRJJc+Hxw+XMoI34Q7dgS0gxFOaGxkMnLTk8RWchEAbLEjr9Dmx8Q4kL8DX4QyJ4fckz+qAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAABHNCSVQICAgIfAhkiAAAAeNJREFUOE9jZJAouMLAxKDNQE3w//8NRgapgv/UNBNq1n+yDWZjZWbg5mJnYGRkYPj77x/D9++/GX79/gtzI+kGs7MxM1iaKDKYG8ozSIjyMjAyMTD8+PGHYfu+6wwHT9wlz2BmJkaGyABDhoJUBwYDbWkGZmagqUDw4+dvhrru7Qzd0/eTZ7ChrjTD5OYgBktjBQYmJoihVDE4PdaKobHEg0FchBds4MYdlxjWbb/M8OfvP4YLV58yXLv1kjwXV+W5MFTmuDDwcLODDZAzbWB4/OwjtkRFWuRVAw2uQDJYTK+W4fXbL+QZzM7OwiAJjH0QyE60YciKs2Hg4mID8409exnevfsKDor3H78zfP32i/ig0FITZ2gt9wZrUFMSBWMWFmYwf/v+6ww/f/5hePPuC8PC1acZjpy6T7zBdhbKDAfX5mDzLlzs+u2XDCVNGxm2AdMyFBAOY2IMPn3hEUN+3XqG42cfEG+whBgvg68LpIzyctZi8HTUYGBnZwXzixs3MHz+8pPhxevPDEdP32d49+Eb8QYDiwJ4DqvMdWYoy3KGJzcpo3qG12++MPz//x9YXqCUZYSDAjlwqZrcRg3Gmm4HSRhL5l9lYGDUwJu1oJIgF1fmujBwQ0s3MV1chdD/WwC2Pe5144mBxwAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAABHNCSVQICAgIfAhkiAAAA+ZJREFUOE+lVWFoU1cU/u57Ly+twdimrU06QWSjDlcrwtoyZWP6ayKICjJ0KIUxqY1NU6ebLTKrw9VtiG3dKlSrItsvQcuQ1R/9IaKDSbdOmWOwiYxJ172m0q1Nmibv3ev3YrW6xijswiUv957z3e/c75xzBTLjTQOBymqYaIIQr0MgAAWD3+LB/lOGUoq2Nm3HaHENadWJ2G/fAX1TdCRoSeU7MMR+bs6j0SCgBqFhFBAqJzCUgEQRwStpu5x+CTiiDdbQWXKLrIBXfEUAE1J9jkTya4x3x3IDPr5LYr6XiuDL3whN281DNKTkewLByDmGvJqgB/F3sgvoTj83aEG0AF77DbL2wk59D493LTSxj3jXBUKNwwz/FuKTb2dhyqtqMOE3fDDTeVC2QEpPYjweB85MoTSyjiBtnKWw5S7IVD/Bu8i5SqCsMUW2HRju3PMkU1fQJSEYZhV0VcXDX+Qd8iBxB442QKGuk20lNP19LpdASUb8by+C/hYe1OQyltSoBUOdh2eAXUEXL4Jm1kJo6wnoI+A/0/t+/ia5dhEp5zy8RhmkY0AlL8M6aSEUbeTeJ2QcpfJqL4Y6Pp12pKD1C+DR6wi6mWu/cH4LR92EkLQVFdC1txgBM0H1ImW3417XXdo8yKBQUyOJtmUBbvBivk4R1Mc0uwNpH4KVHpgRdbsHxeYyGNqHPOQVSIplJS5xP5Eb2N8UgE/ugVJkKz7D8OSJ2ZlC8FLvVt4vwdV52OkOjHQN5wYu3lkGQ2+n0WKGH8ZI59Ws6VcaroFw7cSfkLIZ1rHbuYGL6l6Ax3QdyilKPawvrmUFDjZU06aDe3fh2M1k/Htu4LlhVpHBELGJTA7Dmjo1+yqYNcGlWyhuCyX7BrY4ilj7X88QrzYPJYXroMsDLM9fkXYOIZa6MQPupuKSChieDwi0HLa2HyPxi88Wj/GhILoQeTLMz40U50cK2QfIW2ToptTL/HXTrZpF0Ycp/QjG2v+YnW5ZC6SVVTdaDlO8S/A1rCSdIPcyoQpRmAGRsp8a9GBk/s9Aq/1Ih1A0Ol0g/6OkxwpYGI+BuujByMGHJW1l+u/E2BaMn2UPfmKwN2zPR4nhZ2r5oBwBZcYRS7C8uycfhf/QZd6OQswxe/j3NbdXXODHSubsR7ACJ2cxyJpr2RZdUZduY0W28qJuCBRHVsGD0+xQTqbRTzrnMP7lf5nnhneZmsYGgu5m9HP4WNUz1DXsDeW10LGX6ptE+IHzJypPsZ7jaVIywDutoM+rBJVs+kfZX3qmH8tN+SgKroSphZlsNQxlLg11OuRmyreUw+GcoM8Ar/M4YF9hFU7cB1Jwt+FjtgtEAAAAAElFTkSuQmCC\"","import React, { useState, useEffect } from \"react\";\r\nimport { isEmpty } from \"lodash\";\r\nimport PropTypes from \"prop-types\";\r\nimport Parser from \"html-react-parser\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport CardTypeFolder from \"@components/CardTypeFolder/CardTypeFolder\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\n\r\nimport \"./CreditInfo.css\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nconst CreditInfo = ({ credito, borderTopColor, ...props }) => {\r\n const [meta, setMeta] = useState({});\r\n const [itemsBreadcrumb, setItemsBreadcrumb] = useState([]);\r\n const [detailTitleStyle, setDetailTitleStyle] = useState({\r\n minWidth: \"225px\",\r\n maxWidth: \"75%\",\r\n width: \"fit-content\",\r\n });\r\n const [btnSolicite, setBtnSolicite] = useState({});\r\n const [btnCalcule, setBtnCalcule] = useState({});\r\n\r\n const isDesktop = useMediaQuery(\"(min-width: 992px)\");\r\n const isIpadPortrait = useMediaQuery(\"(max-width: 992px)\");\r\n const isIphoneLandscape = useMediaQuery(\"(max-width: 576px)\");\r\n\r\n const getCorrectImageSize = (listImages) => {\r\n let cls = \"\";\r\n if (isIphoneLandscape) {\r\n cls = listImages.imagen3x.urls[0];\r\n } else if (isIpadPortrait) {\r\n cls = listImages.imagen2x.urls[0];\r\n } else if (isDesktop) {\r\n cls = listImages.imagen.urls[0];\r\n }\r\n return cls;\r\n };\r\n\r\n const getWidthTitle = () => {\r\n if (isIphoneLandscape) {\r\n setDetailTitleStyle({\r\n minWidth: \"178\",\r\n maxWidth: \"100%\",\r\n width: \"fit-content\",\r\n });\r\n } else if (isIpadPortrait || isIphoneLandscape) {\r\n setDetailTitleStyle({\r\n minWidth: \"225px\",\r\n maxWidth: \"75%\",\r\n width: \"fit-content\",\r\n });\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (!isEmpty(credito.btnSolicite)) {\r\n setBtnSolicite({\r\n url: credito.btnSolicite.url,\r\n alt: credito.btnSolicite.alt,\r\n img: ROOT + getCorrectImageSize(credito.btnSolicite.images),\r\n });\r\n }\r\n if (!isEmpty(credito.btnCalcule)) {\r\n setBtnCalcule({\r\n url: credito.btnCalcule.url,\r\n alt: credito.btnCalcule.alt,\r\n img: ROOT + getCorrectImageSize(credito.btnCalcule.images),\r\n });\r\n }\r\n getWidthTitle();\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [\r\n isDesktop,\r\n isIpadPortrait,\r\n isIphoneLandscape,\r\n credito.btnSolicite,\r\n credito.btnCalcule,\r\n ]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(credito)) {\r\n setMeta((m) => {\r\n return {\r\n ...m,\r\n title: credito.title,\r\n description: credito.description,\r\n url: `/${credito.id}`,\r\n };\r\n });\r\n\r\n if (credito.prevRoute) {\r\n setItemsBreadcrumb([\r\n {\r\n url: credito.prevRoute[0].url,\r\n text: credito.prevRoute[0].text,\r\n },\r\n ]);\r\n } else {\r\n setItemsBreadcrumb([{ url: `${credito.id}`, text: credito.title }]);\r\n }\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [credito]);\r\n\r\n const buttons = (\r\n \r\n
\r\n Buscar convenios por:
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n {contractTypes.map((item, index) => {\r\n return (\r\n \r\n );\r\n })}\r\n \r\n
\r\n \r\n setSearching(true)}\r\n >\r\n Buscar\r\n \r\n
\r\n \r\n {!isEmpty(filteredContracts) ? (\r\n <>\r\n {filteredContracts.map((contract, index) => (\r\n setCurrentPage(page)}\r\n />\r\n \r\n ) : (\r\n
\r\n \r\n
\r\n ))}\r\n \r\n
\r\n {contract.Titulo}
\r\n \r\n
\r\n \r\n
\r\n \r\n {contract.Descripcion}\r\n
\r\n \r\n Datos de contacto:\r\n
\r\n {contract.Telefono && (\r\n \r\n \r\n
\r\n )}\r\n \r\n {contract.SitioWeb && (\r\n \r\n \r\n \r\n
\r\n \r\n No se han encontrado convenios.\r\n
\r\n )}\r\n \r\n
\r\n );\r\n\r\n return (\r\n <>\r\n \r\n {!isEmpty(btnSolicite) && (\r\n
\r\n \r\n \r\n
\r\n )}\r\n {!isEmpty(btnCalcule) && (\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\nCreditInfo.propTypes = {\r\n credito: PropTypes.object.isRequired,\r\n borderTopColor: PropTypes.string,\r\n};\r\n\r\nexport default CreditInfo;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { isEmpty, isUndefined } from \"lodash\";\r\nimport CreditInfo from \"@components/CreditInfo/CreditInfo\";\r\nimport { history } from \"@helpers/history\";\r\nimport { isObjEmpty } from \"@helpers/utils\";\r\n\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\n\r\nfunction CreditosPersonales(props) {\r\n const {\r\n match: { params },\r\n } = props;\r\n const [idCredito, setIdCredito] = useState(\"\");\r\n const [credit, setCredit] = useState({});\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { creditosPersonales } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n setIdCredito(params?.id);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n const defRoute = rutas?.filter(\r\n (route) => route?.name === \"Creditos Personales Listado\"\r\n );\r\n\r\n const prevRoute = defRoute.map((route) => {\r\n return {\r\n url: route.url.replace(\"/:id\", \"\"),\r\n text: route.h1,\r\n };\r\n });\r\n\r\n if (!isEmpty(idCredito) && !isEmpty(creditosPersonales)) {\r\n let promise = new Promise((resolve, reject) => {\r\n let normalizeCredits = [];\r\n let resMatch = {};\r\n if (!isEmpty(creditosPersonales?.aCCreditosPersonales)) {\r\n normalizeCredits = creditosPersonales.aCCreditosPersonales.map(\r\n (credito) => ({\r\n ...credito,\r\n idCredito: credito.idCredito.toLowerCase().replaceAll(\" \", \"-\"),\r\n rutaPrevia: prevRoute,\r\n })\r\n );\r\n resMatch =\r\n normalizeCredits &&\r\n normalizeCredits.filter(\r\n (credito) => credito.idCredito === idCredito\r\n )[0];\r\n }\r\n if (\r\n !isEmpty(creditosPersonales?.aCCreditosPersonales) &&\r\n !isEmpty(creditosPersonales?.aCBotonSoliciteSuCredito)\r\n ) {\r\n resMatch = {\r\n ...resMatch,\r\n btnSolicite: {\r\n images: creditosPersonales.aCBotonSoliciteSuCredito[0],\r\n url: resMatch?.urlFormularioSoliciteCredito?.url,\r\n alt: resMatch?.urlFormularioSoliciteCredito?.text,\r\n },\r\n };\r\n }\r\n if (\r\n !isEmpty(creditosPersonales?.aCCreditosPersonales) &&\r\n !isEmpty(creditosPersonales?.aCBotonCalculesuCredito)\r\n ) {\r\n resMatch = {\r\n ...resMatch,\r\n btnCalcule: {\r\n images: creditosPersonales.aCBotonCalculesuCredito[0],\r\n url: \"/\",\r\n alt: \"Calcule su Crédito\",\r\n },\r\n };\r\n }\r\n resolve(resMatch);\r\n });\r\n\r\n promise.then((res) => { \r\n !isUndefined(res.btnSolicite.url) && !isEmpty(res)\r\n ? setCredit({\r\n id: res.idCredito,\r\n title: res.titulo,\r\n description: res.descripcion?.html,\r\n details: res.bag?.contentItems,\r\n btnSolicite: res.btnSolicite,\r\n btnCalcule: res.btnCalcule,\r\n prevRoute: res.rutaPrevia,\r\n }) \r\n : isObjEmpty(credit) && history.push('/no-encontrado')\r\n });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [creditosPersonales, idCredito]); \r\n\r\n return (\r\n <>\r\n {!isEmpty(credit) && (\r\n \r\n
\r\n {credito.title}
\r\n \r\n {Parser(credito.description)}\r\n \r\n\r\n {credito.details &&\r\n credito.details.map((detail, index) => (\r\n
\r\n {buttons}\r\n \r\n
\r\n );\r\n\r\n return (\r\n <>\r\n \r\n {!isEmpty(btnSolicite) && (\r\n
\r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nAhorrosInfo.propTypes = {\r\n ahorro: PropTypes.object.isRequired,\r\n borderTopColor: PropTypes.string,\r\n};\r\n\r\nexport default AhorrosInfo;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { isEmpty, isUndefined } from \"lodash\";\r\nimport AhorrosInfo from \"@components/AhorrosInfo/AhorrosInfo\";\r\nimport { history } from \"@helpers/history\";\r\nimport { isObjEmpty } from \"@helpers/utils\";\r\n\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\n\r\nfunction AhorrosProgramados(props) {\r\n const {\r\n match: { params },\r\n } = props;\r\n const [idAhorro, setIdAhorro] = useState(\"\");\r\n const [ahorro, setAhorro] = useState({});\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { ahorrosProgramados } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n setIdAhorro(params?.id);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n const defRoute = rutas?.filter(\r\n (route) => route?.name === \"Ahorros Listado\"\r\n );\r\n\r\n const prevRoute = defRoute.map((route) => {\r\n return {\r\n url: route.url.replace(\"/:id\", \"\"),\r\n text: route.h1,\r\n };\r\n });\r\n\r\n if (!isEmpty(idAhorro) && !isEmpty(ahorrosProgramados)) {\r\n let promise = new Promise((resolve, reject) => {\r\n let normalizeAhorro = [];\r\n let resMatch = {};\r\n if (!isEmpty(ahorrosProgramados?.aCAhorroProgramado)) {\r\n normalizeAhorro = ahorrosProgramados.aCAhorroProgramado.map(\r\n (ahorro) => ({\r\n ...ahorro,\r\n idAhorro: ahorro.idAhorro.toLowerCase().replaceAll(\" \", \"-\"),\r\n rutaPrevia: prevRoute,\r\n })\r\n );\r\n resMatch =\r\n normalizeAhorro &&\r\n normalizeAhorro.filter((ahorro) => ahorro.idAhorro === idAhorro)[0];\r\n }\r\n if (\r\n !isEmpty(ahorrosProgramados?.aCAhorroProgramado) &&\r\n !isEmpty(ahorrosProgramados?.aCBotonAhorro)\r\n ) {\r\n resMatch = {\r\n ...resMatch,\r\n btnSolicite: {\r\n image: ahorrosProgramados.aCBotonAhorro[0],\r\n url: resMatch?.urlFormularioSoliciteAqui?.url,\r\n alt: resMatch?.urlFormularioSoliciteAqui?.text,\r\n },\r\n };\r\n }\r\n resolve(resMatch);\r\n });\r\n\r\n promise.then((res) => {\r\n !isUndefined(res.btnSolicite.url) && !isEmpty(res)\r\n ? setAhorro({\r\n id: res.idAhorro,\r\n title: res.titulo,\r\n description: res.descripcion?.html,\r\n details: res.bag?.contentItems,\r\n btnSolicite: res.btnSolicite,\r\n prevRoute: res.rutaPrevia,\r\n })\r\n : isObjEmpty(ahorro) && history.push('/no-encontrado')\r\n });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [ahorrosProgramados, idAhorro]);\r\n\r\n return (\r\n <>\r\n {!isEmpty(ahorro) && (\r\n \r\n
\r\n {ahorro.title}
\r\n \r\n {Parser(ahorro.description)}\r\n \r\n\r\n {ahorro.details &&\r\n ahorro.details.map((detail, index) => (\r\n
\r\n {button}\r\n \r\n \r\n
\r\n \r\n );\r\n\r\n return (\r\n <>\r\n \r\n
\r\n\r\n \r\n
\r\n {titulo}
\r\n\r\n \r\n {renderCosto()}\r\n\r\n
\r\n ) : null}\r\n \r\n \r\n {is4K || isFullHD ? null : (\r\n \r\n
\r\n {is4K || isFullHD ? (\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default PlanAsistencia;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport Parser from \"html-react-parser\";\r\nimport { animations } from \"react-animation\";\r\nimport \"./FeaturesListing.css\";\r\n\r\nconst root = process.env.REACT_APP_CMS_STATIC;\r\n\r\nFeaturesListing.propTypes = {\r\n features: PropTypes.array,\r\n validateCustomButtons: PropTypes.bool, //valida si el feature contiene los tags de mostrarEnDetalle y/o mostrarEnListado (Asistencias)\r\n};\r\n\r\nfunction FeaturesListing({\r\n features = [],\r\n validateCustomButtons = false,\r\n ...props\r\n}) {\r\n return (\r\n \r\n
\r\n )}\r\n\r\n {!isUndefined(BOTONES) && (\r\n \r\n {BOTONES &&\r\n BOTONES.map((button, index) => {\r\n return (\r\n button.mostrarEnDetalle && (\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 FeaturesListing;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport FeaturesListing from \"@components/FeaturesListing/FeaturesListing\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport Meta from \"@components/Meta/Meta\";\r\n\r\nconst root = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction PlanesAsistenciaListado(props) {\r\n const [matches, setMatches] = useState([]);\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n const { planesAsistencia } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n const defRoute = rutas?.filter(\r\n (route) => route?.name === \"Planes de Asistencia Listado\"\r\n );\r\n\r\n useEffect(() => {\r\n const curSection =\r\n rutas && rutas.filter((uri) => uri.name === \"Planes de Asistencia\");\r\n const rootUri = curSection && curSection[0]?.url;\r\n\r\n let items =\r\n planesAsistencia &&\r\n planesAsistencia.map((plan) => ({\r\n title: plan?.nombre,\r\n image: root + plan?.imagen?.urls[0],\r\n // url:(plan?.nombre).replace(/ /gi,\"-\").toLowerCase(),\r\n url: rootUri.replace(\r\n \"/:id\",\r\n \"/\" + (plan?.nombre).replace(/ /gi, \"-\").toLowerCase()\r\n ),\r\n description: plan?.resumenPlan?.html,\r\n buttons: plan?.botones?.contentItems,\r\n }));\r\n\r\n setMatches(items);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [planesAsistencia]);\r\n\r\n return (\r\n \r\n
\r\n \r\n {feature.url ? (\r\n {Parser(feature.title)}\r\n ) : (\r\n Parser(feature.title)\r\n )}\r\n
\r\n \r\n\r\n
\r\n );\r\n}\r\n\r\nexport default PlanesAsistenciaListado;\r\n","import React, {useEffect, useState} from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { isEmpty, isUndefined } from \"lodash\";\r\nimport { history } from \"@helpers/history\";\r\nimport PlanAsistencia from './PlanAsistencia';\r\nimport PlanesAsistenciaListado from \"./PlanesAsistenciaListado\";\r\nimport { animations } from \"react-animation\";\r\n\r\nfunction PlanesAsistenciaContainer(props) {\r\n const { match: { params } } = props;\r\n const [ viewDetail, setViewDetail ] = useState(0);\r\n const [matches, setMatches] = useState([])\r\n\r\n const {rutas} = useSelector(\r\n ({Base}) => Base.ContenidoCMS\r\n )\r\n\r\n const {planesAsistencia} = useSelector(\r\n ({AhorroYCredito}) => AhorroYCredito.AhorroYCredito\r\n )\r\n\r\n useEffect(() => {\r\n const defRoute = rutas?.filter(\r\n (route) => route?.name === \"Planes de Asistencia Listado\"\r\n );\r\n \r\n const prevRoute = defRoute.map(route => {\r\n return {\r\n url:route.url,\r\n text:route.title\r\n }\r\n })\r\n \r\n let promise = new Promise((resolve, reject) => {\r\n const idPlan=params?.id;\r\n let normalizePlans= planesAsistencia && planesAsistencia?.map(plan => ({...plan, nombre: (plan?.nombre).replace(/ /gi,\"-\").toLowerCase(), titulo:plan?.nombre, rutaPrevia:prevRoute})); \r\n let resMatch = normalizePlans && normalizePlans?.filter(plan => plan.nombre === idPlan); \r\n\r\n resolve(resMatch);\r\n });\r\n\r\n promise.then(resultado => {\r\n if(!isUndefined(resultado)){\r\n if(isUndefined(params.id)){\r\n setViewDetail(2)\r\n }else{\r\n if(!isEmpty(resultado)){\r\n setMatches(resultado)\r\n setViewDetail(1)\r\n }else{\r\n setViewDetail(3)\r\n }\r\n }\r\n \r\n }\r\n })\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n },[planesAsistencia]);\r\n\r\n useEffect(() => {\r\n viewDetail === 3 && history.push('/no-encontrado')\r\n },[viewDetail]);\r\n\r\n const renderResultView = () => { \r\n return viewDetail === 1 ?\r\n ({defRoute[0].h1}
\r\n\r\n ![](\" +\r\n root +\r\n tip?.icono?.urls[0] +\r\n \")
\"\r\n }\r\n borderTopColor=\"#D7DE00\"\r\n heightsm={true}\r\n />\r\n \r\n );\r\n });\r\n return content;\r\n };\r\n\r\n const mobileContent = () => {\r\n const content =\r\n tips &&\r\n tips.map((tip, index) => {\r\n return \"\" +\r\n tip?.descripcion?.html +\r\n \"
\" +\r\n tip?.descripcion?.html +\r\n \"
Firme su tarjeta en el reverso del plástico.
No acepte ayuda de personas que no conozca cuando use el cajero automático, ni comparta su clave de identificación o PIN a terceros.
Evite llevar la clave de identificación en el mismo lugar que su tarjeta.
Conserve los vouchers cada vez que realice un pago en los comercios o cuando retire dinero de los cajeros automáticos.
\r\n
\r\n\r\n \r\n \r\n {Parser(descripcion)}\r\n
\r\n \r\n {titulo}\r\n
\r\n\r\n {!isEmpty(features) &&\r\n features.map((feat, index) => {\r\n return (\r\n
\r\n { files && files.length > 0 && (\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n {imagenTarjeta && (\r\n 
\r\n )}\r\n
\r\n \r\n {!isEmpty(botones) &&\r\n botones.map((boton, index) => {\r\n return (\r\n boton.ruta.text !== \"Más Información\" && (\r\n
\r\n \r\n {boton.ruta.text === \"Tips de Seguridad\" ? (\r\n \r\n
\r\n )\r\n );\r\n })}\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n {desktopContent()}
\r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default TarjetasListado;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { isEmpty, isUndefined } from \"lodash\";\r\nimport { history } from \"@helpers/history\";\r\nimport Tarjeta from \"./Tarjeta\";\r\nimport TarjetasListado from \"./TarjetasListado\";\r\nimport { remAccents } from \"@helpers/utils.js\";\r\nimport { animations } from \"react-animation\";\r\n\r\nfunction TarjetasContainer(props) {\r\n const {\r\n match: { params },\r\n } = props;\r\n const [viewDetail, setViewDetail] = useState(0);\r\n const [matches, setMatches] = useState([]);\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n const { tarjetasCredito } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n const defRoute = rutas?.filter(\r\n (route) => route?.name === \"Tarjetas Listado\"\r\n );\r\n\r\n const prevRoute = defRoute.map((route) => {\r\n return {\r\n url: route.url,\r\n text: route.title,\r\n };\r\n });\r\n let promise = new Promise((resolve, reject) => {\r\n const idCard = params?.id;\r\n let normalizeCards =\r\n tarjetasCredito &&\r\n tarjetasCredito?.map((card) => ({\r\n ...card,\r\n nombre: remAccents((card?.titulo).replace(/ /gi, \"-\").toLowerCase()),\r\n rutaPrevia: prevRoute,\r\n }));\r\n let resMatch =\r\n normalizeCards &&\r\n normalizeCards?.filter((card) => card.nombre === idCard);\r\n resolve(resMatch);\r\n });\r\n\r\n promise.then((resultado) => {\r\n if (!isUndefined(resultado)) {\r\n if (isUndefined(params.id)) {\r\n setViewDetail(2);\r\n } else {\r\n if (!isEmpty(resultado)) {\r\n setMatches(resultado);\r\n setViewDetail(1);\r\n } else {\r\n setViewDetail(3);\r\n }\r\n }\r\n }\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [tarjetasCredito]);\r\n\r\n useEffect(() => {\r\n viewDetail === 3 && history.push(\"/no-encontrado\");\r\n }, [viewDetail]);\r\n\r\n const renderResultView = () => {\r\n return viewDetail === 1 ? (\r\n {defRoute[0].h1}
\r\n\r\n
\r\n );\r\n}\r\n\r\nexport default CreditosPersonalesListado;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport FeaturesListing from \"@components/FeaturesListing/FeaturesListing\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport { remAccents } from \"@helpers/utils.js\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction CreditosHipotecariosListado(props) {\r\n const [matches, setMatches] = useState([]);\r\n const [credsData, setCredsData] = useState([]);\r\n const [btnSoliciteCredito, setBtnSoliciteCredito] = useState(\"\");\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n const { creditosHipotecarios } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n const defRoute = rutas?.filter(\r\n (route) => route?.name === \"Creditos Hipotecarios Listado\"\r\n );\r\n\r\n const prevRoute = defRoute.map((route) => {\r\n return {\r\n url: route.url,\r\n text: route.h1,\r\n };\r\n });\r\n\r\n useEffect(() => {\r\n if (\r\n creditosHipotecarios &&\r\n creditosHipotecarios.aCBotonSoliciteSuCredito &&\r\n creditosHipotecarios.aCBotonSoliciteSuCredito[0]?.imagen\r\n ) {\r\n setBtnSoliciteCredito(\r\n creditosHipotecarios.aCBotonSoliciteSuCredito[0].imagen.urls[0]\r\n );\r\n }\r\n\r\n let promise = new Promise((resolve, reject) => {\r\n let hipotecarios = creditosHipotecarios?.aCCreditosHipotecarios;\r\n let normalizeCreds =\r\n hipotecarios &&\r\n hipotecarios?.map((cred) => ({\r\n ...cred,\r\n nombre: remAccents((cred?.titulo).split(\" \").join(\"\").toLowerCase()),\r\n rutaPrevia: prevRoute,\r\n }));\r\n resolve(normalizeCreds);\r\n });\r\n\r\n promise.then((resultado) => setMatches(resultado));\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [creditosHipotecarios]);\r\n\r\n useEffect(() => {\r\n const curSection =\r\n rutas && rutas.filter((uri) => uri.name === \"CreditosHipotecarios\");\r\n const rootUri = curSection && curSection[0]?.url;\r\n\r\n let items =\r\n matches &&\r\n matches.map((cred) => {\r\n const credUri = cred?.rutaPrevia[0]?.url + \"/\" + cred?.idCredito;\r\n const botones = [\r\n {\r\n ruta: { url: credUri },\r\n imagen: { urls: [encodeURI(\"/CSCMS/media/Boton Mas Info.png\")] },\r\n },\r\n ];\r\n cred?.urlFormularioSoliciteCredito &&\r\n cred?.urlFormularioSoliciteCredito.url &&\r\n btnSoliciteCredito &&\r\n botones.push({\r\n ruta: { url: cred?.urlFormularioSoliciteCredito.url },\r\n imagen: { urls: [btnSoliciteCredito] },\r\n });\r\n return {\r\n title: cred?.titulo,\r\n image: ROOT + cred?.imagen.urls[0],\r\n url: rootUri.replace(\"/:id\", \"/\" + cred.idCredito),\r\n description: cred?.resumen?.html,\r\n buttons: botones,\r\n };\r\n });\r\n\r\n setCredsData(items);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [matches, btnSoliciteCredito]);\r\n\r\n return (\r\n {defRoute[0].h1}
\r\n\r\n
\r\n );\r\n}\r\n\r\nexport default CreditosHipotecariosListado;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport FeaturesListing from \"@components/FeaturesListing/FeaturesListing\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport { remAccents } from \"@helpers/utils.js\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction CreditosProductivosListado(props) {\r\n const [matches, setMatches] = useState([]);\r\n const [credsData, setCredsData] = useState([]);\r\n const [btnSoliciteCredito, setBtnSoliciteCredito] = useState(\"\");\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n const { creditosProductivos } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n const defRoute = rutas?.filter(\r\n (route) => route?.name === \"Creditos Productivos Listado\"\r\n );\r\n\r\n const prevRoute = defRoute.map((route) => {\r\n return {\r\n url: route.url,\r\n text: route.h1,\r\n };\r\n });\r\n\r\n useEffect(() => {\r\n if (\r\n creditosProductivos &&\r\n creditosProductivos.aCBotonSoliciteSuCredito &&\r\n creditosProductivos.aCBotonSoliciteSuCredito[0]?.imagen\r\n ) {\r\n setBtnSoliciteCredito(\r\n creditosProductivos.aCBotonSoliciteSuCredito[0].imagen.urls[0]\r\n );\r\n }\r\n let promise = new Promise((resolve, reject) => {\r\n let productivos = creditosProductivos?.aCCreditosProductivos;\r\n let normalizeCreds =\r\n productivos &&\r\n productivos?.map((cred) => ({\r\n ...cred,\r\n nombre: remAccents((cred?.titulo).split(\" \").join(\"\").toLowerCase()),\r\n rutaPrevia: prevRoute,\r\n }));\r\n\r\n resolve(normalizeCreds);\r\n });\r\n\r\n promise.then((resultado) => setMatches(resultado));\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [creditosProductivos]);\r\n\r\n useEffect(() => {\r\n const curSection =\r\n rutas && rutas.filter((uri) => uri.name === \"CreditosProductivos\");\r\n const rootUri = curSection && curSection[0]?.url;\r\n\r\n let items =\r\n matches &&\r\n matches.map((cred) => {\r\n const credUri =\r\n cred?.rutaPrevia[0]?.url + \"/\" + cred?.idCreditoProductivo;\r\n\r\n const botones = [\r\n {\r\n ruta: { url: credUri },\r\n imagen: { urls: [encodeURI(\"/CSCMS/media/Boton Mas Info.png\")] },\r\n },\r\n ];\r\n cred?.urlformulariosolicitesucredito &&\r\n cred?.urlformulariosolicitesucredito.url &&\r\n btnSoliciteCredito &&\r\n botones.push({\r\n ruta: { url: cred?.urlformulariosolicitesucredito.url },\r\n imagen: { urls: [btnSoliciteCredito] },\r\n });\r\n return {\r\n title: cred?.titulo,\r\n image: ROOT + cred?.imagen.urls[0],\r\n url: rootUri.replace(\"/:id\", \"/\" + cred.idCreditoProductivo),\r\n description: cred?.resumen?.html,\r\n buttons: botones,\r\n };\r\n });\r\n\r\n setCredsData(items);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [matches, btnSoliciteCredito]);\r\n\r\n return (\r\n {defRoute[0].h1}
\r\n\r\n
\r\n );\r\n}\r\n\r\nexport default CreditosProductivosListado;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport FeaturesListing from \"@components/FeaturesListing/FeaturesListing\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport { remAccents } from \"@helpers/utils.js\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction AhorrosProgramadosListado(props) {\r\n const [matches, setMatches] = useState([]);\r\n const [ahorrosData, setAhorrosData] = useState([]);\r\n const [btnSolicite, setBtnSolicite] = useState(\"\");\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n const { ahorrosProgramados } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"Ahorros Listado\");\r\n\r\n const prevRoute = defRoute.map((route) => {\r\n return {\r\n url: route.url,\r\n text: route.h1,\r\n };\r\n });\r\n\r\n useEffect(() => {\r\n ahorrosProgramados &&\r\n ahorrosProgramados.aCBotonAhorro &&\r\n ahorrosProgramados.aCBotonAhorro[0]?.imagen &&\r\n setBtnSolicite(ahorrosProgramados.aCBotonAhorro[0].imagen.urls[0]);\r\n let promise = new Promise((resolve, reject) => {\r\n let ahorros = ahorrosProgramados?.aCAhorroProgramado;\r\n let normalizeAhorros =\r\n ahorros &&\r\n ahorros?.map((ahorr) => ({\r\n ...ahorr,\r\n nombre: remAccents((ahorr?.titulo).split(\" \").join(\"\").toLowerCase()),\r\n rutaPrevia: prevRoute,\r\n }));\r\n\r\n resolve(normalizeAhorros);\r\n });\r\n\r\n promise.then((resultado) => setMatches(resultado));\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [ahorrosProgramados]);\r\n\r\n useEffect(() => {\r\n const curSection = rutas && rutas.filter((uri) => uri.name === \"Ahorros\");\r\n const rootUri = curSection && curSection[0]?.url;\r\n\r\n let items =\r\n matches &&\r\n matches.map((ahorr) => {\r\n const ahorroUri = ahorr?.rutaPrevia[0]?.url + \"/\" + ahorr?.idAhorro;\r\n\r\n const botones = [\r\n {\r\n ruta: { url: ahorroUri },\r\n imagen: { urls: [encodeURI(\"/CSCMS/media/Boton Mas Info.png\")] },\r\n },\r\n ];\r\n ahorr?.urlFormularioSoliciteAqui &&\r\n ahorr?.urlFormularioSoliciteAqui.url &&\r\n btnSolicite &&\r\n botones.push({\r\n ruta: { url: ahorr?.urlFormularioSoliciteAqui.url },\r\n imagen: { urls: [btnSolicite] },\r\n });\r\n return {\r\n title: ahorr?.titulo,\r\n image: ROOT + ahorr?.imagen.urls[0],\r\n url: rootUri.replace(\"/:id\", \"/\" + ahorr.idAhorro),\r\n description: ahorr?.resumen?.html,\r\n buttons: botones,\r\n };\r\n });\r\n\r\n setAhorrosData(items);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [matches, btnSolicite]);\r\n\r\n return (\r\n {defRoute[0].h1}
\r\n\r\n
\r\n );\r\n}\r\n\r\nexport default AhorrosProgramadosListado;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { isEmpty } from \"lodash\";\r\nimport PropTypes from \"prop-types\";\r\nimport \"./ProvinciaCantonDistrito.css\";\r\n\r\nProvinciaCantonDistrito.propTypes = {\r\n getLocality: PropTypes.func, //funcion que devuelve la localidad seleccionada. Ejemplo: getLocality(provincia,canton, distrito)\r\n clearLocality: PropTypes.bool,\r\n};\r\n\r\nfunction ProvinciaCantonDistrito({\r\n getLocality = () => {},\r\n clearLocality,\r\n ...props\r\n}) {\r\n const [curProvince, setCurProvince] = useState([]);\r\n const [curCanton, setCurCanton] = useState([]);\r\n const [curDistrito, setCurDistrito] = useState([]);\r\n const [curCantones, setCurCantones] = useState([]);\r\n const [curDistritos, setCurDistritos] = useState([]);\r\n\r\n //Selectores de estado\r\n const { provincias } = useSelector(({ Base }) => Base.Catalogos);\r\n const { cantones } = useSelector(({ Base }) => Base.Catalogos);\r\n const { distritos } = useSelector(({ Base }) => Base.Catalogos);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(curProvince)) {\r\n getLocality(curProvince, [], []);\r\n const curProv = curProvince[0]?.Id;\r\n let currentCantones = cantones.filter(\r\n (canton) => canton.IdProvincia === curProv\r\n );\r\n setCurCantones(currentCantones);\r\n } else {\r\n getLocality([], [], []);\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [curProvince]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(curCanton)) {\r\n getLocality(curProvince, curCanton, []);\r\n const curCant = curCanton[0]?.Id;\r\n let currentDistritos = distritos.filter(\r\n (distrito) => distrito.IdCanton === curCant\r\n );\r\n setCurDistritos(currentDistritos);\r\n } else {\r\n getLocality(curProvince, [], []);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [curCanton]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(curDistrito)) {\r\n getLocality(curProvince, curCanton, curDistrito);\r\n } else {\r\n getLocality(curProvince, curCanton, []);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [curDistrito]);\r\n\r\n const handleChangeProvincia = (event) => {\r\n const idProv = parseInt(event.target.value);\r\n if (idProv > 0) {\r\n let currentProvincia = provincias.filter((prov) => prov.Id === idProv);\r\n setCurProvince(currentProvincia);\r\n setCurCantones([]);\r\n setCurCanton([]);\r\n setCurDistritos([]);\r\n setCurDistrito([]);\r\n } else {\r\n setCurProvince([]);\r\n setCurCantones([]);\r\n setCurCanton([]);\r\n setCurDistritos([]);\r\n setCurDistrito([]);\r\n }\r\n };\r\n\r\n const handleChangeCanton = (event) => {\r\n const idCanton = parseInt(event.target.value);\r\n if (idCanton > 0) {\r\n let currentCanton = cantones.filter((canton) => canton.Id === idCanton);\r\n setCurCanton(currentCanton);\r\n setCurDistritos([]);\r\n setCurDistrito([]);\r\n } else {\r\n setCurCanton([]);\r\n setCurDistritos([]);\r\n setCurDistrito([]);\r\n }\r\n };\r\n\r\n const handleChangeDistrito = (event) => {\r\n const idDist = parseInt(event.target.value);\r\n if (idDist > 0) {\r\n let currentDistrito = distritos.filter((dist) => dist.Id === idDist);\r\n setCurDistrito(currentDistrito);\r\n } else {\r\n setCurDistrito([]);\r\n }\r\n };\r\n\r\n return (\r\n {defRoute[0].h1}
\r\n\r\n
\r\n );\r\n}\r\n\r\nexport default ProvinciaCantonDistrito;\r\n","import React, { useLayoutEffect, useState } from \"react\";\r\nimport { useSelector } from \"react-redux\";\r\nimport { isEmpty, isUndefined } from \"lodash\";\r\nimport PropTypes from \"prop-types\";\r\nimport Spinner from 'react-bootstrap/Spinner';\r\nimport ProvinciaCantonDistrito from \"@components/ProvinciaCantonDistrito/ProvinciaCantonDistrito\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport {objectToQueryString} from \"@helpers/utils.js\";\r\nimport \"./Bienes.css\";\r\n\r\nSearchFormBienes.propTypes = {\r\n buildParams:PropTypes.func,\r\n loading:PropTypes.bool,\r\n setCurBien: PropTypes.func,\r\n};\r\n\r\nfunction SearchFormBienes({buildParams=()=>{}, loading, setCurBien, ...props}) {\r\n const is4K = useMediaQuery('(min-width: 3840px)');\r\n const isFullHD = useMediaQuery('(min-width: 1920px)');\r\n const isMidLaptop = useMediaQuery('(min-width: 1366px)');\r\n\r\n //Declaración de constantes de métodos de estado\r\n const [searching, setSearching] = useState(false);\r\n const [valores, setValores] = useState({});\r\n const [clearLocality, setClearLocality] = useState(true)\r\n\r\n const {tiposBien} = useSelector(\r\n ({Base}) => Base.Catalogos\r\n );\r\n\r\n useLayoutEffect(()=>{\r\n setSearching(loading)\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [loading]); \r\n\r\n const getLocality=(provincia, canton, distrito) =>{\r\n let values=valores; \r\n const prov=!isEmpty(provincia) ? provincia[0]?.Id : 0;\r\n const cant=!isEmpty(canton) ? canton[0]?.Id : 0;\r\n const dist=!isEmpty(distrito) ? distrito[0]?.Id : 0; \r\n \r\n prov === 0 ? delete values.IdProvincia : values={...values, IdProvincia:prov}\r\n cant === 0 ? delete values.IdCanton : values={...values, IdCanton:cant}\r\n dist === 0 ? delete values.IdDistrito : values={...values, IdDistrito:dist} \r\n \r\n setValores(values)\r\n setClearLocality(true)\r\n }\r\n\r\n const handleChange=(event)=>{\r\n let values=valores;\r\n \r\n (isUndefined(event.target.value) || event.target.value === \"\" || event.target.value === 0 || event.target.value === '0') ? \r\n delete values[event.target.name]\r\n : values={...values, [event.target.name]: event.target.value} \r\n setValores(values);\r\n }\r\n\r\n const handleSubmit=()=>{ \r\n setCurBien(0)\r\n const query=objectToQueryString(valores)\r\n buildParams(query) \r\n setClearLocality(true)\r\n }\r\n\r\n const renderButtonBuscar=()=>(\r\n \r\n \r\n handleChangeProvincia(e)}\r\n value={setCurProvince[0]?.Id}\r\n >\r\n \r\n {provincias?.map((item, index) => {\r\n return (\r\n \r\n );\r\n })}\r\n \r\n
\r\n \r\n \r\n handleChangeCanton(e)}\r\n value={setCurCanton[0]?.Id}\r\n >\r\n \r\n {curCantones.map((item, index) => {\r\n return (\r\n \r\n );\r\n })}\r\n \r\n
\r\n \r\n \r\n handleChangeDistrito(e)}\r\n value={setCurDistrito[0]?.Id}\r\n >\r\n \r\n {curDistritos.map((item, index) => {\r\n return (\r\n \r\n );\r\n })}\r\n \r\n
\r\n \r\n {searching ?\r\n \r\n : \r\n \r\n }\r\n
\r\n )\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default SearchFormBienes;","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA8AAAAMcAQMAAACl5F6MAAAABlBMVEW8vsDn6OnyCdevAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEbUlEQVR4AezBMQEAAADCoPVP7WsIoAcAAAAAAAAAAAAAAAAAAAAAAIydO0iOk4eCAGyVXNEuukF0FB1NHE1H0RG0ZEHRf5A99WYMk1T+Kvolw+vVjBf+CkMLoRCFWQkuqCquB3QOOQKrCpwBKJ1i6Jxk/EzTubaArgAHQOeyjhu8aMEafUrYolLjLRMfLrpw5cMYadeBnTLcrwN7ZXi+DhyuCi8GG/xy8Gyw3SRe7n7cLzfnajah5z87keFJ//lYf0WAAq+vv+rDX+fir+zpr2Xqr95qrle/ywr9OxX+/nF19fGRmR/yrzCJCudRqNHiNDHhIlquTBgCF2aX3V2BwYT9nUYdNoNojnqjiKJ56q0xiRaok4EsWqQO2EW0RJ3wQbTMvDc6iFaYswEvkx5Hnf8E0Tx1xhcfj3gh1lhOLHVWnx8vLvBq/FAnYpGBhwEElVfjhyETjVjj5bFanATpLrHIcpDkIstpJRdZLmRykaW63CLLMZKLLGeVXGS5jvlFluZKq8k1lnGMXGMZuck1lnsVu8ZydybXWOYj5BrLDIxcY5lz8mrML/JupPIC02osf3tyjeVqY9dYikys8QlTAUIsFovFYrFYLJaIP8hq8D4GG2ywwQYbbLDBBhtssMEGG2ywwQYb3N9+G/ePwQYbbLDBBhtssMEGG5yhA3ugqcARmFXgDKwqcAGgAsu+J1zYy94UXDjIRxosH+crwUm2euHCWX43Fy7YciUYI9N1YIeRavDpsMdIM9jgs+BOh4PBavA3ras6aMFRC06TEpyrLsy/H5emBKOrwvxZpsOsA3ssOk8SQQ9edZ4WI6DzfJwU4Ym/FCE7ofFXfQoJlnUugRsHdl9GTKBzlxRF6vzVW9kngr5eLTB5hT6MUhPgLfdDRhwQCQ79TQXe756tAWcp10XgIuMYF8aWxoedLtz5sB/wzIeDLrzw4QiRqHBSgOvnwLWFCrc7eCLCbnwrXFh2ZMdHKhEOyx3ciHBch8OHE2TtCZ0IZ0wCz1S4jhGTDhc0ecN9IcLja/qEVwIswqwC+/H3zfgMDw7j95cbPBFg+YEKnIaGWyoNzpvmcEujws0rwGX7LnCnwWOgDLhlZsFuaJEP+zFCC7yw4DCAhFtWFhwHl/lwwpeowRMJzlpw+QpXEgwl2O3gxoH9Du4cOOzgmQNHLTjt4OXF4byDVw5csAsHhhLssM/EgD32qQw4aMER+zQtuDPgpAVn7DMz4IJ9FgYMJdgdwSsB9jgKAQ5acDyEJy24ng8nLTgfwu18uBzC/XwYSrA7hmfCeyCHWU6Hw18Gr4R3fY5zOpy04PwEngj/KfYw9WwYSrB7BjfCW4qH6a8Kh2fwTHgF9jDLyXDSgvMzeKW8UX6Uk2Eowe45PL0m7J/D9VQ4aMG/isH/JwYbbLDBBhtssMEGG2ywtz3K/2tvDmQAAAAABvlbn+NbCSQWi8VisVgsFovFYrFYLBYvAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEHVJjR5bJLd8AAAAASUVORK5CYII=\"","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport placeholder from \"assets/img/placeholder.png\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport { animations } from \"react-animation\";\r\nimport { maskCurrency } from \"@helpers/utils\";\r\n\r\nBienPreview.propTypes = {\r\n idBien: PropTypes.number,\r\n tipoBien: PropTypes.string,\r\n expediente: PropTypes.string,\r\n precio: PropTypes.string,\r\n descripcion: PropTypes.string,\r\n imagenUrl: PropTypes.string,\r\n imagenBotonVerDetalle: PropTypes.string,\r\n setCurBien: PropTypes.func,\r\n};\r\n\r\nfunction BienPreview({\r\n idBien,\r\n tipoBien,\r\n expediente,\r\n precio,\r\n descripcion,\r\n imagenUrl = placeholder,\r\n imagenBotonVerDetalle,\r\n setCurBien,\r\n ...props\r\n}) {\r\n const isIpadPortrait = useMediaQuery(\"(min-width: 768px)\");\r\n const isIphoneX = useMediaQuery(\"(min-width: 375px)\");\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n handleChange(e)}\r\n >\r\n \r\n {tiposBien && tiposBien?.map((item, index) => {\r\n return (\r\n \r\n );\r\n })}\r\n \r\n
\r\n \r\n \r\n handleChange(e)}\r\n />\r\n
\r\n \r\n
\r\n {searching &&\r\n \r\n \r\n handleChange(e)}/>\r\n
\r\n \r\n \r\n handleChange(e)}/>\r\n
\r\n {renderButtonBuscar()}\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 BienPreview;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport { Carousel } from \"react-bootstrap\";\r\nimport { isUndefined } from \"lodash\";\r\nimport placeholder from \"assets/img/placeholder.png\";\r\n\r\nBienCarousel.propTypes = {\r\n listaImagenes:PropTypes.array,\r\n};\r\n\r\nfunction BienCarousel({\r\n listaImagenes,\r\n ...props\r\n}) {\r\n \r\n return (\r\n \r\n {tipoBien} {expediente}\r\n
\r\n \r\n ₡ {precio ? maskCurrency(precio) : 0}\r\n
\r\n \r\n {descripcion}\r\n
\r\n \r\n setCurBien(idBien)}\r\n />\r\n
\r\n \r\n ${otrasSenas}\r\n
\r\n `;\r\n const seccionMapa = `\r\n \r\n \r\n \r\n
\r\n `;\r\n return `\r\n \r\n ${seccionInicial}\r\n ${latitud !== null && longitud !== null ? seccionMapa : \"\"}\r\n
\r\n `;\r\n };\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n {bienInfo.TipoBien} {bienInfo.NumeroExpediente}\r\n
\r\n \r\n ₡ {maskCurrency(bienInfo.Precio)}\r\n {/* ₡ {new Intl.NumberFormat(\"es-CR\").format(bienInfo.Precio)} */}\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 BienDetalle;\r\n","import React, { useEffect, useState, useMemo } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { isEmpty, isNull, isUndefined } from \"lodash\";\r\nimport Accordion from \"react-bootstrap/Accordion\";\r\nimport * as CMSActions from \"app/@Base/store/actions\";\r\nimport * as Actions from \"app/@Base/store/actions\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport SearchFormBienes from \"./SearchFormBienes\";\r\nimport BasicBanner from \"@components/BasicBanner/BasicBanner\";\r\nimport BienPreview from \"./BienPreview\";\r\nimport BienDetalle from \"./BienDetalle\";\r\nimport { animations } from \"react-animation\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport placeholder from \"assets/img/placeholder.png\";\r\nimport Pagination from \"@components/Pagination/Pagination\";\r\n\r\nimport \"bootstrap/dist/css/bootstrap.css\";\r\n\r\nconst root = process.env.REACT_APP_CMS_STATIC;\r\nconst PageSize = 10;\r\n\r\nfunction Bienes(props) {\r\n const dispatch = useDispatch();\r\n\r\n const is4K = useMediaQuery(\"(min-width: 3840px)\");\r\n const isDesktop = useMediaQuery(\"(min-width: 992px)\");\r\n const isIpadPortrait = useMediaQuery(\"(max-width: 992px)\");\r\n const isIphoneLandscape = useMediaQuery(\"(max-width: 576px)\");\r\n\r\n const [banner, setBanner] = useState({});\r\n const [listaBienes, setListaBienes] = useState([]);\r\n const [curBien, setCurBien] = useState(0);\r\n const [urlButtonVerDetalle, setUrlButtonVerDetalle] = useState(\"\");\r\n const [showDetalleBien, setShowDetalleBien] = useState(false);\r\n const [loading, setLoading] = useState(false);\r\n const [currentPage, setCurrentPage] = useState(1);\r\n\r\n const filteredBienes = useMemo(() => {\r\n const firstPageIndex = (currentPage - 1) * PageSize;\r\n const lastPageIndex = firstPageIndex + PageSize;\r\n return listaBienes?.slice(firstPageIndex, lastPageIndex);\r\n }, [currentPage, listaBienes]);\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n\r\n const { loggedUser } = useSelector(({ Base }) => Base?.User);\r\n const { provincias } = useSelector(({ Base }) => Base.Catalogos);\r\n const { cantones } = useSelector(({ Base }) => Base.Catalogos);\r\n const { distritos } = useSelector(({ Base }) => Base.Catalogos);\r\n const { tiposBien } = useSelector(({ Base }) => Base.Catalogos);\r\n const { bienes } = useSelector(({ Base }) => Base.Catalogos);\r\n\r\n const { bienesBanner } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"Bienes\");\r\n\r\n useEffect(() => {\r\n const { token } = loggedUser;\r\n buildParams(\"\");\r\n if (token) {\r\n isEmpty(provincias) && dispatch(CMSActions.getProvincias(token));\r\n isEmpty(cantones) && dispatch(CMSActions.getCantones(token));\r\n isEmpty(distritos) && dispatch(CMSActions.getDistritos(token));\r\n isEmpty(tiposBien) && dispatch(CMSActions.getTiposBien(token));\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [loggedUser]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(bienesBanner)) {\r\n let backgroundImage;\r\n let mainImage = {\r\n img: root + bienesBanner?.bannerdeBienes[0]?.heroImage.urls[0],\r\n alt: \"Bienes\",\r\n };\r\n let title = bienesBanner?.bannerdeBienes[0]?.copyText;\r\n\r\n //let buttonImage = \"\";\r\n\r\n if (isIphoneLandscape) {\r\n backgroundImage =\r\n root + bienesBanner?.bannerdeBienes[0]?.imagendefondoMovil.urls[0];\r\n } else if (isIpadPortrait) {\r\n backgroundImage =\r\n root +\r\n bienesBanner?.bannerdeBienes[0]?.imagendeFondoIpadPortrait.urls[0];\r\n } else if (isDesktop) {\r\n backgroundImage =\r\n root + bienesBanner.bannerdeBienes[0]?.imagendefondo.urls[0];\r\n }\r\n\r\n setBanner({\r\n backgroundImage: {\r\n img: backgroundImage,\r\n alt: \"VENTA DE BIENES\",\r\n },\r\n mainImage: mainImage,\r\n title: title,\r\n });\r\n }\r\n }, [bienesBanner, isIphoneLandscape, isIpadPortrait, isDesktop]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(bienes)) {\r\n setListaBienes(bienes);\r\n setLoading(false);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [bienes]);\r\n\r\n useEffect(() => {\r\n if (bienesBanner) {\r\n setUrlButtonVerDetalle(\r\n bienesBanner?.aCBienesBotonVerDetalle &&\r\n root + bienesBanner?.aCBienesBotonVerDetalle[0]?.imagen?.urls[0]\r\n );\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [bienesBanner]);\r\n\r\n useEffect(() => {\r\n curBien > 0 ? setShowDetalleBien(true) : setShowDetalleBien(false);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [curBien]);\r\n\r\n const buildParams = (selection) => {\r\n if (loggedUser) {\r\n const token = loggedUser.token;\r\n setLoading(true);\r\n setListaBienes([]);\r\n !isUndefined(selection) &&\r\n !isNull(selection) &&\r\n dispatch(Actions.getBienesSearch(selection, token)).then((resp) => {\r\n isEmpty(resp) && setLoading(false);\r\n });\r\n }\r\n };\r\n\r\n const showBienDetalle = () => {\r\n const info = listaBienes.filter((bien) => bien.Id === curBien);\r\n const btnSolicitarInfo =\r\n bienesBanner && !isEmpty(bienesBanner?.aCBienesBotonSolicitarInformacion)\r\n ? bienesBanner?.aCBienesBotonSolicitarInformacion[0]\r\n : {};\r\n const btnCotizar =\r\n bienesBanner && !isEmpty(bienesBanner?.aCBienesBotonCotizar)\r\n ? bienesBanner?.aCBienesBotonCotizar[0]\r\n : {};\r\n return (\r\n \r\n {imagenBotonSolicitar !== undefined ? (\r\n window.open(btnSolicitarInfo.enlace)}\r\n />\r\n ) : (<>)}\r\n {imagenBotonCotizar !== undefined ? (\r\n window.open(btnCotizar.enlace)}\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 {showDetalleBien ? (\r\n showBienDetalle()\r\n ) : !isEmpty(listaBienes) ? (\r\n <>\r\n Buscar Bienes Por:
\r\n \r\n Resultados de Bienes\r\n
\r\n\r\n \r\n {filteredBienes?.map((bien, index) => (\r\n 0\r\n ? bien?.ImagenPrincipal\r\n : placeholder\r\n }\r\n imagenBotonVerDetalle={urlButtonVerDetalle}\r\n tipoBien={bien?.TipoBien}\r\n expediente={bien?.NumeroExpediente}\r\n precio={bien?.Precio?.toString()}\r\n descripcion={bien?.Descripcion}\r\n setCurBien={setCurBien}\r\n />\r\n ))}\r\n
\r\n \r\n No se encontraron resultados.
\r\n )}\r\n \r\n );\r\n}\r\n\r\nexport default Bienes;\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport Parser from \"html-react-parser\";\r\nimport { isEmpty, isUndefined } from \"lodash\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport CardTypeFolder from \"@components/CardTypeFolder/CardTypeFolder\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport * as CMSActionsAhorro from \"../../store/actions\";\r\n\r\nimport \"./Afiliacion.css\";\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\n\r\nconst Afiliacion = () => {\r\n const dispatch = useDispatch();\r\n const [membership, setMembership] = useState({});\r\n const [detailTitleStyle, setDetailTitleStyle] = useState({\r\n minWidth: \"225px\",\r\n maxWidth: \"75%\",\r\n width: \"fit-content\",\r\n });\r\n\r\n const isDesktop = useMediaQuery(\"(min-width: 992px)\");\r\n const isIpadPortrait = useMediaQuery(\"(max-width: 992px)\");\r\n const isIphoneLandscape = useMediaQuery(\"(max-width: 576px)\");\r\n\r\n //Selectores de estado\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { afiliacionCMS } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"Afíliese\");\r\n\r\n const getWidthTitle = () => {\r\n if (isIphoneLandscape) {\r\n setDetailTitleStyle({\r\n minWidth: \"178\",\r\n maxWidth: \"100%\",\r\n width: \"fit-content\",\r\n });\r\n } else if (isIpadPortrait || isIphoneLandscape) {\r\n setDetailTitleStyle({\r\n minWidth: \"225px\",\r\n maxWidth: \"75%\",\r\n width: \"fit-content\",\r\n });\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n dispatch(CMSActionsAhorro.getCMSAfiliacion());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n getWidthTitle();\r\n if (!isEmpty(afiliacionCMS)) {\r\n let btnForm;\r\n if (!isEmpty(afiliacionCMS.afiliacion[0].uRLFormularioAfiliacion.url)) {\r\n if (\r\n isIphoneLandscape &&\r\n !isUndefined(afiliacionCMS.afiliacion[0].botonAfiliacionMovil.urls[0])\r\n ) {\r\n btnForm = {\r\n url: afiliacionCMS.afiliacion[0].uRLFormularioAfiliacion.url,\r\n img:\r\n ROOT + afiliacionCMS.afiliacion[0].botonAfiliacionMovil.urls[0],\r\n alt: afiliacionCMS.afiliacion[0].uRLFormularioAfiliacion.text,\r\n };\r\n } else if (\r\n isIpadPortrait &&\r\n !isUndefined(afiliacionCMS.afiliacion[0].botonAfiliacionIpad.urls[0])\r\n ) {\r\n btnForm = {\r\n url: afiliacionCMS.afiliacion[0].uRLFormularioAfiliacion.url,\r\n img: ROOT + afiliacionCMS.afiliacion[0].botonAfiliacionIpad.urls[0],\r\n alt: afiliacionCMS.afiliacion[0].uRLFormularioAfiliacion.text,\r\n };\r\n } else if (\r\n isDesktop &&\r\n !isUndefined(afiliacionCMS.afiliacion[0].botonAfiliacion.urls[0])\r\n ) {\r\n btnForm = {\r\n url: afiliacionCMS.afiliacion[0].uRLFormularioAfiliacion.url,\r\n img: ROOT + afiliacionCMS.afiliacion[0].botonAfiliacion.urls[0],\r\n alt: afiliacionCMS.afiliacion[0].uRLFormularioAfiliacion.text,\r\n };\r\n }\r\n }\r\n\r\n setMembership({\r\n title: afiliacionCMS.afiliacion[0].titulo,\r\n description: afiliacionCMS.afiliacion[0].descripcion.html,\r\n details: afiliacionCMS.afiliacion[0].detalles.contentItems.map(\r\n (detail) => {\r\n return {\r\n title: detail.title,\r\n description: detail.description.html,\r\n };\r\n }\r\n ),\r\n files: afiliacionCMS.afiliacion[0].archivosDescargables?.contentItems\r\n ? afiliacionCMS.afiliacion[0].archivosDescargables?.contentItems.map(\r\n (file) => {\r\n return {\r\n fileName: file.tituloEnlace,\r\n fileURL: ROOT + file.archivo.urls[0],\r\n };\r\n }\r\n )\r\n : [],\r\n buttons: btnForm ? [btnForm] : [],\r\n });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [afiliacionCMS, isIphoneLandscape, isIpadPortrait, isDesktop]);\r\n\r\n const buttons = (\r\n\r\n {membership.buttons &&\r\n membership.buttons.length > 0 &&\r\n membership.buttons.map((button) => (\r\n
\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};\r\n\r\nexport default Afiliacion;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport { animations } from \"react-animation\";\r\nimport \"./DownloadSection.css\";\r\nimport IconoDownload from \"./../../assets/img/download/Download Icon.png\";\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nDownloadSection.propTypes = {\r\n title: PropTypes.string,\r\n downloadLinks: PropTypes.array,\r\n};\r\n\r\nfunction DownloadSection({ title = \"Descargas\", downloadLinks, ...props }) {\r\n function filename(url) {\r\n var rutaAbsoluta = url;\r\n var posicionUltimaBarra = rutaAbsoluta.lastIndexOf(\"/\");\r\n var rutaRelativa = rutaAbsoluta.substring(\r\n posicionUltimaBarra + \"/\".length,\r\n rutaAbsoluta.length\r\n );\r\n return rutaRelativa;\r\n }\r\n\r\n return (\r\n \r\n
\r\n {membership.title}
\r\n \r\n {membership.description && Parser(membership.description)}\r\n \r\n\r\n {membership.details &&\r\n membership.details.map((detail, index) => (\r\n
\r\n {buttons}\r\n \r\n {downloadLinks && (\r\n
\r\n );\r\n}\r\n\r\nexport default DownloadSection;\r\n","import React from \"react\";\r\nimport Parser from \"html-react-parser\";\r\nimport PropTypes from \"prop-types\";\r\nimport { animations } from \"react-animation\";\r\nimport Image from \"react-bootstrap/Image\";\r\nimport DownloadSection from \"@components/DonwloadSection/DownloadSection\";\r\nimport \"./TextTitleWithDownloads.css\";\r\n\r\nTextTitleWithDownloads.propTypes = {\r\n title: PropTypes.string,\r\n subtitle: PropTypes.string,\r\n text: PropTypes.string,\r\n mainImage: PropTypes.string,\r\n titleLinks: PropTypes.string,\r\n downloadSections: PropTypes.array,\r\n borderTopColor: PropTypes.string,\r\n};\r\n\r\nfunction TextTitleWithDownloads({\r\n title,\r\n subtitle,\r\n text,\r\n mainImage,\r\n titleLinks = \"Descargas\",\r\n downloadSections,\r\n borderTopColor = \"#001a70\",\r\n ...props\r\n}) {\r\n return (\r\n \r\n
\r\n )}\r\n {title}
\r\n - \r\n {downloadLinks.map((lnk, index) => (\r\n
- \r\n \r\n\r\n\r\n\r\n \r\n ))}\r\n
\r\n {subtitle ? (\r\n <>\r\n \r\n {Parser(text)}\r\n\r\n {mainImage && (\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default TextTitleWithDownloads;\r\n","import React, { useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport * as AhorroYCreditoActions from \"app/@Content/components/AhorroYCredito/store/actions\";\r\nimport TextTitleWithDownloads from \"@components/TextTitleWithDownloads/TextTileWithDownloads\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\n\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\n\r\nfunction Organizacion(props) {\r\n const dispatch = useDispatch();\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { token } = useSelector(({ Base }) => Base.Token);\r\n\r\n const { organizacion } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n dispatch(AhorroYCreditoActions.getOrganizacion(token));\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"Organizacion\");\r\n const organizacionItems = (\r\n <>\r\n {organizacion && (\r\n {Parser(title)}
\r\n {Parser(subtitle)}
\r\n \r\n ) : (\r\n {Parser(title)}
\r\n )}\r\n\r\n
\r\n )}\r\n\r\n {downloadSections && (\r\n <>\r\n {downloadSections.map((dlsection, index) => {\r\n return dlsection.archivo ? (\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nDelegado.propTypes = {\r\n delegado: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default Delegado;\r\n","import { VALIDATE_DELEGATES, RESET_DELEGATES } from \"./types\";\r\nimport InterconexionService from \"app/@Base/services/interconexion.service\";\r\n\r\nexport function postDelegado(params) {\r\n return function (dispatch) {\r\n try {\r\n return InterconexionService.reqDelegado(params).then((data) => {\r\n dispatch({\r\n type: VALIDATE_DELEGATES,\r\n payload: data.indicador,\r\n });\r\n });\r\n } catch (error) {\r\n return (dispatch) => {\r\n dispatch({\r\n type: VALIDATE_DELEGATES,\r\n payload: false,\r\n });\r\n };\r\n }\r\n };\r\n}\r\n\r\nexport function resetDelegado() {\r\n return function (dispatch) {\r\n dispatch({\r\n type: RESET_DELEGATES,\r\n payload: false,\r\n });\r\n };\r\n}\r\n","import React from \"react\";\r\nimport { useDispatch } from \"react-redux\";\r\nimport DatePicker, { registerLocale } from \"react-datepicker\";\r\nimport es from \"date-fns/locale/es\";\r\nimport { Formik } from \"formik\";\r\nimport * as yup from \"yup\";\r\nimport * as InterconexonActions from \"app/@Base/store/actions\";\r\n\r\nimport \"react-datepicker/dist/react-datepicker.css\";\r\n\r\nregisterLocale(\"es\", es);\r\n\r\nconst MAX_BIRTHDAY = new Date();\r\nMAX_BIRTHDAY.setFullYear(MAX_BIRTHDAY.getFullYear() - 18);\r\n\r\nconst schema = yup.object().shape({\r\n id: yup\r\n .number()\r\n .required(\"Requerido\")\r\n .test(\r\n \"len\",\r\n \"Solo se permiten entre 9 y 15 caracteres\",\r\n (val) =>\r\n val > 0 && val.toString().length >= 9 && val.toString().length <= 15\r\n )\r\n .typeError(\"Solo permite números [0-9]\"),\r\n birthday: yup\r\n .date()\r\n .max(MAX_BIRTHDAY, \"Debe ser mayor de 18 años\")\r\n .required(\"Requerido\")\r\n .typeError(\"Dato requerido\"),\r\n});\r\n\r\nvar inputTypeNumbers = document.querySelectorAll(\"input[type=number]\");\r\nfor (var a = 0; a < inputTypeNumbers.length; a++) {\r\n inputTypeNumbers[a].onwheel = function (event) {\r\n event.target.blur();\r\n };\r\n}\r\n\r\nconst ValidarDelegado = ({ ...props }) => {\r\n const dispatch = useDispatch();\r\n\r\n const handleOnSubmit = (values, action) => {\r\n let newDate = new Date(values.birthday);\r\n newDate.setUTCHours(0, 0, 0, 0);\r\n dispatch(\r\n InterconexonActions.postDelegado({\r\n FechaNacimiento: newDate.toISOString(),\r\n Identificacion: values.id + \"\",\r\n })\r\n );\r\n action.setFieldTouched(\"birthday\", true);\r\n action.setSubmitting(false);\r\n };\r\n\r\n return (\r\n \r\n
\r\n {delegate.title}
\r\n \r\n {Parser(delegate.description)}\r\n \r\n\r\n {delegate.files && delegate.files.length > 0 && (\r\n {\r\n return {\r\n fileName: file.tituloEnlace,\r\n fileURL: ROOT + file.archivo.urls[0],\r\n };\r\n })\r\n }\r\n borderTopColor={BORDER_TOP_COLOR}\r\n />\r\n )}\r\n
\r\n \r\n \r\n {({\r\n values,\r\n dirty,\r\n errors,\r\n touched,\r\n setFieldValue,\r\n handleChange,\r\n handleSubmit,\r\n isSubmitting,\r\n submitCount,\r\n }) => (\r\n \r\n )}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ValidarDelegado;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { isEmpty } from \"lodash\";\r\nimport * as AhorroYCreditoActions from \"app/@Content/components/AhorroYCredito/store/actions\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport Delegado from \"./Delegado\";\r\nimport ValidarDelegado from \"./ValidarDelegado\";\r\n\r\nimport \"./DelegadoContainer.css\";\r\n\r\nconst DelegadoContainer = ({ ...props }) => {\r\n const dispatch = useDispatch();\r\n const [meta, setMeta] = useState({});\r\n \r\n const [delegate, setDelegate] = useState({});\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { isValidDelegate } = useSelector(\r\n ({ Base }) => Base.ContenidoInterconexion\r\n );\r\n\r\n const { delegados } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n const defRoute = rutas?.filter((route) => route?.name === \"Delegados\")[0];\r\n\r\n setMeta((m) => {\r\n return {\r\n ...m,\r\n title: defRoute.title,\r\n description: defRoute.description,\r\n url: defRoute.url,\r\n };\r\n }); \r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (isValidDelegate) {\r\n dispatch(AhorroYCreditoActions.getCMSDelegados());\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [isValidDelegate]);\r\n\r\n useEffect(() => {\r\n if (!isEmpty(delegados)) {\r\n setDelegate({\r\n title: delegados?.aCDelegados[0].titulo,\r\n description: delegados?.aCDelegados[0].descripcion?.html,\r\n // details: res.bag?.contentItems,\r\n files: delegados?.aCDelegados[0].archivosDescargables?.contentItems,\r\n });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [delegados]);\r\n\r\n return (\r\n <>\r\n Delegados
\r\n\r\n
\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default DelegadoContainer;\r\n","import React, { useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport * as CMSActions from \"./../../store/actions/ahorroYCredito.actions\";\r\nimport TextoYTitulo from \"@components/TextoYTitulo/TextoYTitulo\";\r\n//import Routes from \"app/@Routes/Routes\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\nimport './FirmaDigital.css';\r\n\r\nconst root = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction FirmaDigital(props) {\r\n const dispatch = useDispatch();\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n \r\n\r\n const { firmaDigital } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n ); \r\n \r\n useEffect(() => {\r\n dispatch(CMSActions.getFirmaDigital());\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n const defRoute = rutas?.filter((route) => route?.name === \"FirmaDigital\");\r\n\r\n \r\n\r\n return (\r\n <>\r\n \r\n \r\n ![{firmaDigital.aCFirmaDigital[0]?.titulo}/]({root+firmaDigital.aCFirmaDigital[0]?.boton?.urls[0]})
\r\n \r\n
\r\n \r\n }\r\n \r\n );\r\n}\r\n\r\nexport default FirmaDigital;\r\n","import React, { useEffect } from \"react\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport * as AhorroYCreditoActions from \"app/@Content/components/AhorroYCredito/store/actions\";\r\nimport TextTitleWithDownloads from \"@components/TextTitleWithDownloads/TextTileWithDownloads\";\r\nimport Meta from \"@components/Meta/Meta\";\r\nimport Breadcrumbs from \"@components/Breadcrumbs/Breadcrumbs\";\r\n\r\nconst BORDER_TOP_COLOR = \"#d7de00\";\r\n\r\nfunction Reglamentos(props) {\r\n const dispatch = useDispatch();\r\n\r\n const { rutas } = useSelector(({ Base }) => Base.ContenidoCMS);\r\n const { token } = useSelector(({ Base }) => Base.Token);\r\n\r\n const { reglamentos } = useSelector(\r\n ({ AhorroYCredito }) => AhorroYCredito.AhorroYCredito\r\n );\r\n\r\n useEffect(() => {\r\n dispatch(AhorroYCreditoActions.getReglamentos(token));\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n const defRoute = rutas?.filter((route) => route?.name === \"Reglamentos\");\r\n const reglamentosItems = (\r\n <>\r\n {reglamentos && (\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Promociones;\r\n","import React, { useState } from \"react\"\r\nimport Modal from \"react-bootstrap/Modal\";\r\nimport useMediaQuery from \"app/hooks/useMediaQuery\";\r\nimport \"./SobrePagoObligacionesModal.css\"\r\n\r\nfunction SobrePagoObligacionesModal(abrirDefecto = true) {\r\n\r\n const enlaceDocumento = \"https://apiinformativa.cs.fi.cr/CSCMS/media/Comunicado%20pago%20de%20obligaciones.pdf#navpanes=0\"\r\n\r\n const isMobile = useMediaQuery(\"(max-width: 1023px)\")\r\n\r\n const [abrirModal, setAbrirModal] = useState(abrirDefecto)\r\n\r\n return (\r\n <>\r\n \r\n {!isEmpty(filteredPromos) ? (\r\n <>\r\n setCurrentPage(page)}\r\n />\r\n \r\n ) : (\r\n
\r\n }\r\n \r\n {filteredPromos.map((promo, index) => (\r\n
\r\n \r\n
\r\n ))}\r\n \r\n {promo && promo.tituloPromocion.html && (\r\n
\r\n \r\n {Parser(promo.tituloPromocion.html)}\r\n
\r\n )}\r\n \r\n {promo && (\r\n <>\r\n
\r\n {promo && promo.uRLImagenBoton.url && (\r\n \r\n
\r\n {promo.slogan.html && (\r\n \r\n {Parser(promo.slogan.html)}\r\n
\r\n )}\r\n {promo.promocion.html && (\r\n \r\n {Parser(promo.promocion.html)}\r\n
\r\n )}\r\n {promo.descripcion.html && (\r\n \r\n {Parser(promo.descripcion.html)}\r\n
\r\n )}\r\n {promo.nota.html && (\r\n \r\n {Parser(promo.nota.html)}\r\n
\r\n )}\r\n \r\n )}\r\n \r\n \r\n
\r\n )}\r\n \r\n No se han encontrado promociones.\r\n
\r\n )}\r\n \r\n
\r\n ) : (\"\")}\r\n \r\n )\r\n}\r\n\r\nexport default GestionarPagosBanner\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport Parser from \"html-react-parser\";\r\nimport { animations } from \"react-animation\";\r\nimport \"./FeaturesBox.css\";\r\n\r\nFeaturesBox.propTypes = {\r\n titulo: PropTypes.string,\r\n imagenUrl: PropTypes.string,\r\n featUrl: PropTypes.string,\r\n titlePos: PropTypes.string, //top, middle\r\n descripcion: PropTypes.string,\r\n footerNote: PropTypes.string,\r\n showMoreInfoButton: PropTypes.bool,\r\n moreInfoButtonText:PropTypes.string \r\n};\r\n\r\nfunction FeaturesBox({\r\n titulo,\r\n imagenUrl,\r\n featUrl,\r\n titlePos = \"middle\",\r\n descripcion,\r\n footerNote,\r\n showMoreInfoButton,\r\n moreInfoButtonText=\"Más Información\",\r\n ...props\r\n}) {\r\n const onErrorImage = (text) => {\r\n var texto = text.substr(0, 6);\r\n return \"http://placehold.jp/00bab4/ffffff/800x600.png?text=\" + texto;\r\n };\r\n\r\n const openUrl = () => {\r\n window.open(featUrl, \"_blank\");\r\n }\r\n\r\n return (\r\n <>\r\n {titlePos === \"top\" && (\r\n \r\n
\r\n \r\n 
\r\n
\r\n \r\n {Parser(valores.texto.html)}\r\n
\r\n \r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = onErrorImage(titulo);\r\n }}\r\n src={imagenUrl}\r\n alt={titulo}\r\n />\r\n \r\n {Parser(descripcion)}\r\n
\r\n\r\n \r\n \r\n \r\n )}\r\n {titlePos === \"middle\" && (\r\n \r\n \r\n {titulo}\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n {titulo}\r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = onErrorImage(titulo);\r\n }}\r\n src={imagenUrl}\r\n alt={titulo}\r\n />\r\n
\r\n {Parser(descripcion)}
\r\n {showMoreInfoButton && (\r\n \r\n \r\n
\r\n )}\r\n {footerNote && (\r\n \r\n {footerNote}\r\n
\r\n )}\r\n \r\n \r\n )}\r\n \r\n );\r\n}\r\n\r\nexport default FeaturesBox;\r\n","import React from \"react\"\r\nimport { isNull } from 'lodash';\r\nimport FeaturesBox from '../FeaturesBox/FeaturesBox';\r\nimport \"./ComunicadosOficiales.css\"\r\n\r\nconst ROOT = process.env.REACT_APP_CMS_STATIC;\r\n\r\nfunction ComunicadosOficiales({ listaComunicados = [] }) {\r\n\r\n return (\r\n \r\n
\r\n\r\n )\r\n}\r\n\r\nexport default ComunicadosOficiales\r\n","import React, { useEffect } from \"react\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { Route, Router, Switch } from \"react-router-dom\";\r\nimport { history } from \"@helpers/history\";\r\nimport TagManager from \"react-gtm-module\";\r\nimport { animations } from \"react-animation\";\r\nimport \"styles/App.css\";\r\nimport { pushUserData } from \"app/@Base/store/actions/user.actions\";\r\nimport { pushToken } from \"./@Base/store/actions/cmsAuth.actions\";\r\nimport reqLogin from \"app/Auth/services/auth.service\";\r\nimport reqLoginCMS from \"app/Auth/services/auth.serviceCMS\";\r\nimport useCatalogs from \"app/hooks/useCatalogs\";\r\nimport * as components from \"@components\";\r\n\r\nimport { getAnonymPass } from \"@helpers/utils\";\r\n\r\nconst anonymuser = process.env.REACT_APP_ANONYM_CRED;\r\nconst anonympass = getAnonymPass();\r\n\r\n//Template components\r\nconst AppBar = components.AppBar;\r\nconst SecondaryNavBar = components.SecondaryNavBar;\r\nconst Footer = components.Footer;\r\nconst ChatButton = components.ChatButton;\r\nconst ChatForm = components.ChatForm;\r\nconst ChatFormulario = components.ChatFormulario;\r\nconst NotFound = components.NotFound;\r\n\r\n//Content components\r\nconst Home = components.Home;\r\n\r\nconst HomeAhorro = components.HomeAhorro;\r\nconst Serviahorro = components.Serviahorro;\r\nconst Inversiones = components.Inversiones;\r\nconst Contactenos = components.Contactenos;\r\nconst Sucursales = components.Sucursales;\r\nconst Convenios = components.Convenios;\r\nconst CreditosPersonales = components.CreditosPersonales;\r\nconst CreditosHipotecarios = components.CreditosHipotecarios;\r\nconst CreditosProductivos = components.CreditosProductivos;\r\nconst AhorrosProgramados = components.AhorrosProgramados;\r\nconst PlanesAsistenciaContainer = components.PlanesAsistenciaContainer;\r\nconst TarjetasContainer = components.TarjetasContainer;\r\nconst CreditosPersonalesListado = components.CreditosPersonalesListado;\r\nconst CreditosHipotecariosListado = components.CreditosHipotecariosListado;\r\nconst CreditosProductivosListado = components.CreditosProductivosListado;\r\nconst AhorrosProgramadosListado = components.AhorrosProgramadosListado;\r\nconst Bienes = components.Bienes;\r\nconst Afiliacion = components.Afiliacion;\r\nconst Organizacion = components.Organizacion;\r\nconst DelegadoContainer = components.DelegadoContainer;\r\nconst FirmaDigital = components.FirmaDigital;\r\nconst Reglamentos = components.Reglamentos;\r\nconst Promociones = components.Promociones;\r\n\r\nfunction App() {\r\n\r\n const dispatch = useDispatch();\r\n const rutas = [\r\n {\r\n \"name\": \"HomeAhorroYCredito\",\r\n \"keywords\": \"Dinero, dinero, exito, éxito, metas, Metas, objetivos, Objetivo, Ahorro y Crédito, ahorro, credito, crédito, coope, coopeservidores, Coopeservidores\",\r\n \"title\": \"CS Ahorro y Crédito en Costa Rica\",\r\n \"h1\": \"Préstamos y ahorros de manera fácil y sencilla con CS\",\r\n \"description\": \"Alcance sus metas y objetivos personales, solicitando uno de nuestros préstamos personales y ahorros de CS.\",\r\n \"url\": \"/\",\r\n \"component\": \"Home\",\r\n \"identificadorSitio\": \"AC\"\r\n },\r\n {\r\n \"name\": \"Sucursales\",\r\n \"keywords\": \"Sucursales, sucursales, Sucursal, sucursal,\",\r\n \"title\": \"Sucursales | Ahorro y Crédito\",\r\n \"h1\": \"Sucursales\",\r\n \"description\": \"Encuentre la información de todas las sucursales de nuestra institución.\",\r\n \"url\": \"/sucursales\",\r\n \"component\": \"Sucursales\",\r\n \"identificadorSitio\": \"AC\"\r\n }\r\n ]\r\n const { token } = useSelector(({ Base }) => Base.Token);\r\n\r\n const creds = {\r\n username: anonymuser,\r\n password: anonympass,\r\n };\r\n\r\n useEffect(() => {\r\n if (token === \"\") {\r\n reqLoginCMS()\r\n .then((response) => {\r\n dispatch(pushToken(response.access_token));\r\n })\r\n .catch((error) => {\r\n // notificacion\r\n });\r\n }\r\n if (Object.entries(creds).length !== 0) {\r\n reqLogin(creds)\r\n .then((response) => {\r\n dispatch(pushUserData(response));\r\n })\r\n .catch((error) => {\r\n // notificacion\r\n });\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useCatalogs();\r\n\r\n //Inventario de componentes con contenido\r\n const COMPONENTES = {\r\n Home: Home,\r\n HomeAhorro: HomeAhorro,\r\n Serviahorro: Serviahorro,\r\n Inversiones: Inversiones,\r\n Sucursales: Sucursales,\r\n Convenios: Convenios,\r\n CreditosPersonales: CreditosPersonales,\r\n CreditosHipotecarios: CreditosHipotecarios,\r\n CreditosProductivos: CreditosProductivos,\r\n AhorrosProgramados: AhorrosProgramados,\r\n Contactenos: Contactenos,\r\n PlanesAsistenciaContainer: PlanesAsistenciaContainer,\r\n TarjetasContainer: TarjetasContainer,\r\n CreditosPersonalesListado: CreditosPersonalesListado,\r\n CreditosHipotecariosListado: CreditosHipotecariosListado,\r\n AhorrosProgramadosListado,\r\n Afiliacion: Afiliacion,\r\n Bienes: Bienes,\r\n ChatForm: ChatForm,\r\n Organizacion: Organizacion,\r\n CreditosProductivosListado: CreditosProductivosListado,\r\n DelegadoContainer: DelegadoContainer,\r\n FirmaDigital: FirmaDigital,\r\n Reglamentos: Reglamentos,\r\n Promociones: Promociones,\r\n NotFound: NotFound,\r\n ChatFormulario: ChatFormulario,\r\n };\r\n\r\n const COMPONENT_DEFAULT = () => Home;\r\n\r\n const tagManagerArgs = {\r\n gtmId: \"GTM-PVWD6RM\",\r\n };\r\n\r\n TagManager.initialize(tagManagerArgs);\r\n\r\n const getRouting = () => {\r\n if (rutas) {\r\n return rutas.map((ruta, index) => {\r\n return {\r\n name: ruta.name,\r\n title: ruta.title,\r\n h1: ruta.h1,\r\n description: ruta.description,\r\n url: ruta.url,\r\n component: COMPONENTES[ruta.component]\r\n ? COMPONENTES[ruta.component]\r\n : COMPONENT_DEFAULT,\r\n };\r\n });\r\n }\r\n };\r\n\r\n return (\r\n Comunicados oficiales
\r\n\r\n {!isNull(listaComunicados) && listaComunicados.map((item, index) => (\r\n
\r\n \r\n \r\n \r\n {rutas &&\r\n getRouting().map((ruta, index) => {\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n