\n
\n );\n }\n}\n","import styled from 'styled-components';\nimport { rem } from 'polished';\n\n// Components \nimport { LoaderHooly } from \"../../components\";\n\n// Styles\nimport { theme } from '../../theme';\n\n// Images\nimport bg from '../../images/hooly-login-bg.svg';\n\nexport const LoginWrapper = styled.div`\n\tbackground: #fff;\n\theight: 100%;\n\twidth: 100%;\n\tdisplay: flex;\n`;\n\nexport const LoginLogoWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 40%;\n\tbackground-image: url(${bg});\n\tbackground-color: ${theme.primary};\n\tbackground-repeat: no-repeat;\n\tbackground-size: cover;\n\n\tp {\n\t\ttext-align: center;\n\t\tfont-size: ${rem('24px')};\n\t\tfont-weight: 700;\n\t\tmargin-top: ${rem('36px')};\n\t\tcolor: ${theme.white};\n\t}\n`;\n\nexport const LoginFormWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 60%;\n\n\tp {\n\t\tfont-size: ${rem('16px')};\n\t\ttext-align: center;\n\t}\n\n\th3 {\n\t\ttext-align: center;\n\t}\n\n\tform {\n\t\twidth: 50%;\n\t}\n`;\n\nexport const RutHolder = styled.span`\n\tdisplay: block;\n\tbackground-color: #5e6a73;\n\tborder-radius: ${rem('16px')};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tcolor: ${theme.white};\n\tfont-size: ${rem('18px')};\n\tfont-weight: 700;\n\tpadding: ${rem('6px')} ${'16px'};\n\tmargin: ${rem('24px')} ${'0px'};\n`;\n\nexport const Arrow = styled.i`\n\tpadding-right: ${rem('8px')};\n\ttransform: translateY(100%);\n\tcolor: ${theme.primary};\n\tcursor: pointer;\n`;\n\nexport const ChangePasswordWrapper = styled.div`\n\tcursor:pointer;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\t&:hover {\n\t\tcolor: ${theme.primary};\n }\n`;\nexport const WrapperHeadContent = styled.div`\n\tdisplay: flex;\n flex-direction: row;\n align-items: flex-start;\n`;","import React from \"react\";\n\nfunction AsPasswordInput(InputComponent) {\n return class extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n rightText: \"Mostrar\",\n rightIcon: \"hly-show-eye\",\n type: \"password\",\n };\n }\n\n onLeftIconClicked = () => {\n this.setState({ rightText: \"Ocultar\", type: \"text\", rightIcon: \"hly-hide-eye\" });\n\n setTimeout(() => {\n this.setState({ rightText: \"Mostrar\", type: \"password\", rightIcon: \"hly-show-eye\" });\n }, 2000);\n };\n\n render() {\n const { rightText, rightIcon, type } = this.state;\n return (\n Home
\nesperando\n \n ☺️\n \n
Para acceder a tu cuenta, completa los datos
\n\n \n\n ¿Olvidaste tu contraseña?\n \n Recupérala!\n
\n\n \n setSignInValues({ ...signInValues, accountLoginStep: 2 })}\n />\n \n No puedes recuperar la
\n contraseña, ya que tu RUT no
\n está registrado en hooly\n \n \n\n setSignInValues({ ...signInValues, accountLoginStep: 1 })}\n />\n
\n \n contraseña, ya que tu RUT no
\n está registrado en hooly\n
\n \n \n Te hemos enviado un código de
\n verificación al email
\n {email}
\n Llegará en unos minutos, revísalo
\n y copia el código para crear una
\n nueva contraseña.\n \n \n\n\n changeStep(1)}\n />\n
\n \n verificación al email
\n {email}
\n Llegará en unos minutos, revísalo
\n y copia el código para crear una
\n nueva contraseña.\n
\n \n Se ha realizado
\n exitosamente el cambio
\n de contraseña! 🥳\n \n backLogin()}\n />\n
\n \n exitosamente el cambio
\n de contraseña! 🥳\n
creada con éxito 🥳\n
Sólo falta un paso más 👌, conecta tu cuenta
de Salesforce para acceder a Hooly
Salesforce\n
Has cambiado tus datos de Salesforce
ingrésalos nuevamente para acceder a Hooly
\n Con nuestra herramienta aumentarás tu
productividad y podrás\n ayudar a
nuestros clientes en su proceso de
cambio\n
\n Recuerda saludar en nombre de AFP Capital\n \n 🙋🏻\n \n
\n ) : (\n\n Listo para volver a ayudar a nuestros clientes? Pon Ready y\n vamos! 👏\n
\n ))}\n\n Cuando el cliente este convencido podrás\n
enviar un link para que realice el cambio\n
\n El mensaje se ha enviado 👏. Si el cliente no\n
ha recibido el mensaje puedes reintentar el\n
envío\n
\n para iniciar el cambio 📲\n
\n link de cambio 👌\n
\n mensaje 🙌\n
\n
\n )\n }\n}\n\nclass CallManager extends Component {\n constructor(props) {\n super(props);\n\n this.state = {\n count: 0,\n isConnectionMuted: false,\n linkHasBeenSent: false,\n isCallAccepted: false,\n fullLeadHistory: []\n };\n\n this.device = new Device();\n this.connection = null;\n this.arrayResult = [];\n }\n\n TimerFormat(time) {\n let seconds = time % 60;\n let minutes = Math.floor(time / 60);\n minutes = minutes.toString().length === 1 ? \"0\" + minutes : minutes;\n seconds = seconds.toString().length === 1 ? \"0\" + seconds : seconds;\n return minutes + ':' + seconds;\n }\n\n handleTimerStart() {\n this.timer = setInterval(() => {\n const newCount = this.state.count + 1;\n this.setState(\n {count: newCount >= 0 ? newCount : 0}\n );\n }, 1000);\n }\n\n handleTimerCountup(seconds) {\n this.setState({\n count: seconds,\n running: true\n })\n }\n\n handleTimerStop() {\n if(this.timer) {\n clearInterval(this.timer);\n this.setState(\n {running:false}\n );\n }\n }\n \n handleTimerReset() {\n this.setState(\n {count: 0}\n );\n }\n\n async componentDidMount() {\n // Get a twilio token to build the call\n try {\n\n const twilioToken = await (await getTwilioToken()).data;\n\n // Setup the device with the token\n this.device.setup(twilioToken.token, twilioSetup);\n\n // Create handlers for device events\n this.device.on(\"ready\", () => {\n if (this.connection) {\n return;\n }\n\n this.connection = this.device.connect({\n number: formatNumber(this.props.lead.phone_number),\n leadId: this.props.lead.id,\n executiveHoolyUsername: getUsernameInToken()\n });\n\n // Register event in case call is accepted\n this.connection.on(\"accept\", () => {\n // Increase the contact attempts\n this.handleTimerStart();\n try {\n if (this.props.lead.id && !parse(window.location.href).manualCallerId) {\n (async () => {\n await increaseContactAttempts(\n this.props.lead.id,\n this.props.lead.contact_attempts\n );\n \n await updateContactStatus(this.props.lead.id, true);\n })();\n }\n } catch (error) {\n console.log(error);\n }\n\n this.setState({ isCallAccepted: true }, () => {\n this.connection.status();\n });\n });\n });\n\n\n // Register event when device is disconnected\n this.device.on(\"disconnect\", async () => {\n this.props.callDisconnected();\n executiveStatusService.changeStatus(Statuses.MANAGEMENT.id);\n\n this.device.disconnectAll();\n this.device.destroy();\n \n this.connection.disconnect();\n \n if (this.props.lead.id && !parse(window.location.href).manualCallerId) {\n await updateContactStatus(this.props.lead.id, false).catch(error => {\n console.log(error); \n });\n }\n\n });\n\n // Register event when error is registered\n this.device.on(\"error\", error => {\n console.log(error);\n });\n\n // Getting Lead History.\n let fullLeadHistory = null;\n fullLeadHistory = await (await getLeadHistory(this.props.lead.id)).data;\n\n this.setState({ fullLeadHistory: fullLeadHistory });\n\n console.log('[i] critical');\n console.log(fullLeadHistory);\n } catch (error) {\n console.log(error);\n }\n }\n\n pauseCall = () => {\n this.connection.mute(!this.connection.isMuted());\n this.setState({ isCallMuted: this.connection.isMuted() });\n };\n\n hangUp = () => {\n const status = this.connection.status();\n\n if (status !== \"closed\") {\n this.device.disconnectAll();\n this.device.destroy();\n }\n };\n\n onSendLink = async (origin) => {\n const { first_name, phone_number } = this.props.lead;\n\n this.props.toggleModal(\n {this.format(time)}
\n\n
{'Lead ' + record.status + ' '}
{' ' + moment.utc(record.createdAt).local().format(\"DD/MM/YYYY\") + ' '}{' ' + moment.utc(record.createdAt).local().format(\"HH:mm\")}
\n {record.notes}
\n \n )\n };\n\n render() {\n const { lead } = this.props;\n const { count } = this.state;\n const { isCallMuted, linkHasBeenSent, isCallAccepted, fullLeadHistory } = this.state;\n \n return (\n \n
Lead sin historial.
\n \n )}\n \n {campaign && (\n \n \n Campaña / Anuncio \n {campaign} \n \n \n )}\n\n \n \n Journey Digital \n {journey || \"Sin información\"} \n \n \n\n \n \n Fecha y hora de Lead \n \n Fecha: {created_date.split(\" \")[0] || \"Sin información\"} • Hora:{\" \"}\n {created_date.split(\" \")[1]\n ? created_date.split(\" \")[1] + \" \" + created_date.split(\" \")[2]\n : \"Sin Información\"}\n \n \n \n
\n );\n};\n\nexport default OriginInfo;\n","import React, { Component } from \"react\";\nimport * as moment from \"moment\";\nimport { Row, Col } from \"react-grid-system\";\nimport { Formik } from \"formik\";\nimport * as Yup from \"yup\";\nimport styled from \"styled-components\";\nimport { rem } from \"polished\";\nimport { parse } from \"search-params\";\nimport { connect } from \"react-redux\";\n\n// Actions\nimport { ADD_SNACKBAR, DIRTY_VALUES } from \"../../../../../../constants/actionTypes\";\n\n// Component\nimport { Input, Select, Button } from \"hooly-ui-kit\";\n\n// Styles\n\n// Services\nimport {\n updateLead,\n updateLeadInfoForScheduling,\n getUserDataWithRut,\n} from \"../../../../../../services\";\n\n// Utils\nimport {\n formatRut,\n formatNumber,\n firstFormatDate,\n formatRutWithoutDots,\n formatDate,\n} from \"../../../../../../utils/formatters\";\n\nimport { validateRut } from \"../../../../../../utils/validators\";\n\nconst LeadSchema = Yup.object().shape({\n first_name: Yup.string()\n .min(2, \"El nombre ingresado no es válido\")\n .matches(new RegExp(/^([^0-9]*)$/), {\n message: \"Debes ingresar un nombre válido\",\n }),\n last_name: Yup.string()\n .min(2, \"El apellido ingresado no es válido\")\n .matches(new RegExp(/^([^0-9]*)$/), {\n message: \"Debes ingresar un apellido válido\",\n }),\n birth_date: Yup.string().test(\n \"Test Date is valid date\",\n \"Debes ingresar una fecha válida\",\n (value) => {\n if (!value) {\n return true;\n }\n\n return (\n moment(value, \"DD/MM/YYYY\").isValid() &&\n moment(value, \"DD/MM/YYYY\").isBefore(moment(), \"day\")\n );\n }\n ),\n rut: Yup.string().test(\n \"Test RUT\",\n \"Debes ingresar un RUT válido\",\n (value) => {\n if (!value) {\n return true;\n }\n\n return validateRut(value);\n }\n ),\n phone_number: Yup.string()\n .max(12, \"El maximo de digito son 12\")\n .matches(new RegExp(/^[0-9*#+]+$/), {\n message: \"Debes ingresar un numero válido\",\n }),\n email: Yup.string().email(\"Debes ingresar un correo electrónico válido\"),\n});\n\nconst LeadFormForm = styled.form`\n width: 100%;\n\n button {\n width: 100%;\n\n &:disabled {\n box-shadow: none;\n }\n }\n\n input,\n label {\n color: white;\n }\n\n select {\n color: white;\n }\n\n .Input--Wrapper,\n .Select--Wrapper {\n border: ${rem(\"3px\")} solid #5e5e5e;\n }\n`;\n\nexport const afps = [\n {\n value: \"Capital\",\n text: \"Capital\",\n },\n {\n value: \"Cuprum\",\n text: \"Cuprum\",\n },\n {\n value: \"Habitat\",\n text: \"Habitat\",\n },\n {\n value: \"Modelo\",\n text: \"Modelo\",\n },\n {\n value: \"Planvital\",\n text: \"Planvital\",\n },\n {\n value: \"Provida\",\n text: \"Provida\",\n },\n {\n value: \"Uno\",\n text: \"Uno\",\n },\n];\n\nclass LeadForm extends Component {\n constructor(props) {\n super(props);\n this.state = {\n values_object: {\n first_name: this.props.lead.first_name || \"\",\n last_name: this.props.lead.last_name || \"\",\n email: this.props.lead.email || \"\",\n phone_number: formatNumber(this.props.lead.phone_number) || \"\",\n birth_date: firstFormatDate(this.props.lead.birth_date) || \"\",\n current_afp: this.props.lead.current_afp || \"\",\n gender: this.props.lead.gender || \"\",\n rut: formatRut(this.props.lead.rut) || \"\",\n },\n };\n }\n\n _retrieveUserData = async (fieldSetter, event) => {\n const rut = event.target.value;\n\n fieldSetter(\"rut\", formatRut(rut));\n \n try {\n if (!validateRut(rut)) \n return;\n \n const user = await getUserDataWithRut(formatRutWithoutDots(rut))\n const {\n givenNames,\n lastName,\n secondLastName,\n currentAfp,\n birthDate,\n gender,\n } = user.data.userPersonalData;\n\n fieldSetter(\"first_name\", givenNames);\n fieldSetter(\"last_name\", `${lastName} ${secondLastName}`);\n fieldSetter(\n \"current_afp\",\n currentAfp === \"PlanVital\" ? \"Planvital\" : currentAfp\n );\n fieldSetter(\"birth_date\", birthDate);\n fieldSetter(\"gender\", gender === \"M\" ? \"Masculino\" : \"Femenino\");\n \n \n } catch (error) {\n console.log(error);\n this.props.addSnackbar({\n \n id: \"notOk\",\n text: `No hay información para el RUT ingresado 😮`,\n type: \"notOk\",\n seconds: 3000,\n });\n } \n };\n\n render() {\n return (\n \n puedes volver a llamar a este cliente\n
¿quieres continuar?\n
{errors.products}
\n ) : (\n Marca los productos cambiados
\n )}\n\n \n {\n console.log(event);\n this.onCheckStateChanged(event);\n setFieldValue(\"apo\", event.checkState);\n }}\n />\n\n {\n console.log(event);\n this.onCheckStateChanged(event);\n setFieldValue(\"apv\", event.checkState);\n }}\n />\n
\n\n \n {\n console.log(event);\n this.onCheckStateChanged(event);\n setFieldValue(\"account_two\", event.checkState);\n }}\n />\n\n {\n console.log(event);\n this.onCheckStateChanged(event);\n setFieldValue(\"deposit_agree\", event.checkState);\n }}\n />\n
\n \n )}\n\n Información Cliente
\n(Datos opcionales)
\ndel\n Journey del cliente en tiempo real\n
\n this.onReCall('dialer')} />\n
\n\n Puedes reintentar para ver si tienes clientes que antender
\nEstamos trabajando en resolverlo
\nCuando agendes clientes para llamarlos aparecerán aquí
)}\n\n {noSchedulings && search && (Verifica si escribiste bien el Nº telefónico
)}\n \nnuestros clientes 👌
\n
\n }\n \n )\n}\n\nexport default connect(mapStateToProps, mapDispatchToProps)(LeadsFilter);","import * as React from \"react\";\nimport { motion } from \"framer-motion\";\n\nconst variants = {\n open: {\n y: 0,\n opacity: 1,\n transition: {\n delay: 1,\n y: { stiffness: 1000, velocity: -100 }\n }\n },\n closed: {\n y: 50,\n opacity: 0,\n transition: {\n y: { stiffness: 1000 }\n }\n }\n};\n\nexport const MenuItem = ({ text }) => {\n\n return (\n \n filtrado por\n
\n\n {/* {buildFilterPrint(queryFilter)} */}\n {buildFilterPrint(afp, \"afp\")}\n {buildFilterPrint(campana, \"campana\")}\n {buildFilterPrint(status, \"status\")}\n {buildFilterPrint(age, \"age\")}\n {buildFilterPrint(dates, \"date\")}\n\n {text.title}\n
\n\n \n {text.subtitle}\n \n \n );\n \n};\n","import * as React from \"react\";\nimport { motion } from \"framer-motion\";\nimport { MenuItem } from \"./MenuItem\";\n\nconst variants = {\n open: {\n transition: { staggerChildren: 0.07, delayChildren: 0.2 }\n },\n closed: {\n transition: { staggerChildren: 0.05, staggerDirection: -1 }\n }\n};\n\nexport const Navigation = props => {\n const { list } = props;\n console.log(\"Navigation: \", list);\n\n return (\n <> \nPuedes reintentar con otros datos
\nInformación Cliente (Datos opcionales)
\nSi no está en los leads automáticos puedes llamar ingresando un número
\n