setOpen(false)}\r\n onOpen={() => setOpen(true)}\r\n open={open}\r\n size=\"tiny\"\r\n >\r\n {t(\"data_protection.title\")}\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n :\r\n \r\n \r\n
\r\n \r\n \r\n :\r\n \r\n \r\n
\r\n \r\n \r\n :\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n closeModal()}\r\n />\r\n \r\n \r\n )}\r\n \r\n );\r\n}\r\n","import React, { useContext, useState } from \"react\";\r\nimport { useParams } from 'react-router-dom';\r\nimport { Fade } from \"react-awesome-reveal\";\r\n\r\nimport { format } from \"date-fns\";\r\n\r\nimport { Trans } from \"react-i18next\";\r\n\r\nimport { DateTimeContext } from \"../context/DateTimeContext\";\r\nimport { AuthContext } from \"../context/AuthContext\";\r\nimport { Button, Segment, Header, Icon } from \"semantic-ui-react\";\r\nimport LoadingComponent from \"./LoadingComponent\";\r\nimport { TimeSlotContext } from \"../context/TimeSlotContext\";\r\nimport { ServiceContext } from \"../context/ServiceContext\";\r\nimport { setInfoAboutCitizen } from \"../providers/CalendarProvider\";\r\n\r\nexport default function ConfirmMessage({\r\n onHandleChangeData,\r\n onHandleChangeDate,\r\n}) {\r\n const [startDate] = useContext(DateTimeContext);\r\n const [values] = useContext(AuthContext);\r\n // eslint-disable-next-line\r\n const [serviceValues, setValues] = useContext(ServiceContext);\r\n const { organization, service} = useParams();\r\n const [showDateTimeMessage, setDateTimeMessage] = useState(true);\r\n const [showConfirmMessage, setShowConfirmMessage] = useState(false);\r\n const [isLoading, setIsLoading] = useState(false);\r\n const [errorMessage, setErrorMessage] = useState(false);\r\n const [errorMessageText, setErrorMessageText] = useState(\"\");\r\n const [timeSlot] = useContext(TimeSlotContext);\r\n\r\n const d = new Date(startDate);\r\n const date = d.toISOString().split(\"T\")[0];\r\n const time = d.toTimeString().split(\" \")[0];\r\n const id = `${date}T${time}`;\r\n\r\n const slotId = timeSlot.reduce(\r\n // eslint-disable-next-line\r\n (a, o) => (o.start === id && a.push(o.id), a),\r\n []\r\n );\r\n\r\n const {\r\n nom,\r\n cognom,\r\n segon_cognom,\r\n email,\r\n telefon,\r\n dni,\r\n idType,\r\n observations,\r\n postalCode\r\n } = values;\r\n const { category } = {\r\n category: serviceValues.value || service,\r\n };\r\n const citizen = {\r\n slotId: `${slotId}`,\r\n serviceCode: `${category}`,\r\n zipCode: postalCode,\r\n attendees: [\r\n {\r\n isOrganizer: true,\r\n type: \"Citizen\",\r\n name: nom,\r\n surname: cognom,\r\n secondSurname: segon_cognom,\r\n email: email,\r\n phone: telefon,\r\n id: dni,\r\n idType: idType,\r\n culture: \"es-CA\",\r\n },\r\n ],\r\n observations: observations,\r\n isOtpAvailable: true\r\n };\r\n\r\n const getServiceText = () => {\r\n const service = window.location.pathname.split(\"/\")[2];\r\n if(service == null){\r\n return (\r\n <>\r\n \r\n \r\n \r\n {serviceValues.text}\r\n
\r\n \r\n )\r\n }\r\n }\r\n\r\n const handleSubmit = async () => {\r\n setIsLoading(true);\r\n\r\n try {\r\n const response = await setInfoAboutCitizen(citizen);\r\n\r\n if (response?.status === 400 || response?.status === 500) {\r\n throw new Error(response.data[0].message);\r\n }\r\n\r\n setIsLoading(false);\r\n setShowConfirmMessage(true);\r\n } catch (error) {\r\n setErrorMessageText(error.toString());\r\n\r\n setIsLoading(false);\r\n setErrorMessage(true);\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n {showDateTimeMessage && (\r\n <>\r\n \r\n }\r\n />\r\n\r\n \r\n {getServiceText()}\r\n \r\n \r\n {\" \"}\r\n {format(startDate, \"dd-MM-yyyy\")}{\" \"}\r\n \r\n \r\n {\" \"}\r\n \r\n {format(startDate, \"HH:mm\")}{\" \"}\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n
\r\n
\r\n \r\n {nom} {cognom} {segon_cognom}\r\n
\r\n \r\n
\r\n \r\n \r\n
{telefon}
\r\n
\r\n {email}
\r\n \r\n
\r\n \r\n \r\n
{dni}
\r\n
\r\n\r\n \r\n \r\n \r\n {observations}
\r\n \r\n \r\n }\r\n color=\"red\"\r\n basic\r\n size=\"medium\"\r\n className=\"button\"\r\n onClick={() => onHandleChangeData && onHandleChangeData()}\r\n >\r\n }\r\n color=\"red\"\r\n basic\r\n size=\"medium\"\r\n className=\"button\"\r\n onClick={() => onHandleChangeDate && onHandleChangeDate()}\r\n >\r\n }\r\n size=\"big\"\r\n negative\r\n onClick={() => {\r\n setDateTimeMessage(false);\r\n\r\n handleSubmit();\r\n }}\r\n >\r\n \r\n \r\n \r\n )}\r\n {isLoading ? (\r\n \r\n ) : (\r\n <>\r\n {showConfirmMessage && (\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 negative\r\n size=\"big\"\r\n style={{ margin: \"15px\", marginTop: \"20px\" }}\r\n onClick={() => window.location.reload(false)}\r\n >\r\n \r\n )}\r\n \r\n )}\r\n {errorMessage && (\r\n \r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n \r\n
\r\n
\r\n }\r\n negative\r\n size=\"big\"\r\n style={{ margin: \"15px\" }}\r\n onClick={() => window.location.reload(false)}\r\n >\r\n \r\n )}\r\n \r\n );\r\n}\r\n","import React, { useContext } from \"react\";\r\nimport { Fade } from \"react-awesome-reveal\";\r\n\r\nimport { Trans } from \"react-i18next\";\r\n\r\nimport { format } from \"date-fns\";\r\nimport { DateTimeContext } from \"../context/DateTimeContext\";\r\nimport { Button, Segment } from \"semantic-ui-react\";\r\nimport { ServiceContext } from \"../context/ServiceContext\";\r\n\r\nexport default function FirstConfirmMessage({\r\n onHandleClickBack,\r\n onHandleClickNext,\r\n}) {\r\n const [startDate] = useContext(DateTimeContext);\r\n const [serviceValues, setValues] = useContext(ServiceContext);\r\n const { category } = {\r\n category: serviceValues.value,\r\n };\r\n\r\n const getServiceText = () => {\r\n const service = window.location.pathname.split(\"/\")[2];\r\n if(service == null){\r\n return (\r\n <>\r\n \r\n \r\n \r\n {serviceValues.text}\r\n
\r\n \r\n )\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n {getServiceText()}\r\n \r\n \r\n {\" \"}\r\n {format(startDate, \"dd-MM-yyyy\")}{\" \"}\r\n \r\n \r\n {\" \"}\r\n \r\n {format(startDate, \"HH:mm\")}{\" \"}\r\n \r\n \r\n \r\n\r\n \r\n }\r\n style={{ height: \"50px\" }}\r\n size=\"big\"\r\n className=\"button\"\r\n onClick={() => onHandleClickBack && onHandleClickBack()}\r\n >\r\n }\r\n size=\"big\"\r\n negative\r\n icon=\"chevron right\"\r\n labelPosition=\"right\"\r\n onClick={() => {\r\n onHandleClickNext && onHandleClickNext();\r\n }}\r\n >\r\n \r\n \r\n \r\n );\r\n}\r\n","import React, { useState, useContext, useEffect } from \"react\";\r\n\r\nimport { Trans } from \"react-i18next\";\r\nimport { useTranslation } from \"react-i18next\";\r\n\r\nimport { DateTimeContext } from \"../context/DateTimeContext\";\r\nimport { format } from \"date-fns\";\r\nimport { Fade } from \"react-awesome-reveal\";\r\n\r\nimport { useOnScreen } from \"../hooks/useOnScreen\";\r\n\r\nimport SelectForm from '../components/SelectService';\r\n//import SelectForm from '../components/SelectArea';\r\nimport TimeSelect from '../components/TimeSelect';\r\nimport DateSelect from '../components/Calendar';\r\nimport CitaPreviaForm from '../components/form/CitaPreviaForm';\r\nimport ConfirmMessage from '../components/ConfirmMessage';\r\nimport FirstConfirmMessage from '../components/FirstConfirmMessage';\r\nimport { UIContext } from '../context/UIContext';\r\n\r\nimport \"../App.css\";\r\nimport Screens from \"../constants/Screens\";\r\nimport { useParams } from \"react-router\";\r\n\r\nconst CreateDate = () => {\r\n const [startDate, setStartDate] = useContext(DateTimeContext);\r\n const { organization, service } = useParams();\r\n\r\n const { currentForm, nextPage, clearFormAndBack, setCurrentForm } = useContext(UIContext);\r\n\r\n const [ref, visible] = useOnScreen({\r\n root: document.querySelector(\"#root\"),\r\n rootMargin: \"0px\",\r\n });\r\n\r\n useEffect(() => {\r\n if(service != undefined){\r\n setCurrentForm(Screens.CALENDAR)\r\n console.log(currentForm);\r\n }\r\n }, [])\r\n\r\n return (\r\n <>\r\n <>\r\n {currentForm == Screens.SELECT_FORM && (\r\n \r\n )}\r\n \r\n\r\n \r\n {currentForm == Screens.CALENDAR && (\r\n \r\n )}\r\n
\r\n\r\n \r\n {currentForm == Screens.TIME_SELECT && (\r\n <>\r\n \r\n \r\n \r\n \r\n )}\r\n
\r\n\r\n {currentForm == Screens.FIRST_DATE_TIME_MESSAGE && (\r\n \r\n clearFormAndBack([Screens.CALENDAR, Screens.TIME_SELECT])\r\n }\r\n onHandleClickNext={nextPage}\r\n />\r\n )}\r\n {currentForm == Screens.CITA_PREVIA_FORM && (\r\n \r\n )}\r\n\r\n <>\r\n {currentForm == Screens.CONFIRM_MESSAGE && (\r\n \r\n clearFormAndBack([Screens.CITA_PREVIA_FORM])\r\n }\r\n onHandleChangeDate={() =>\r\n clearFormAndBack([Screens.CALENDAR, Screens.TIME_SELECT])\r\n }\r\n />\r\n )}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default CreateDate;\r\n","import { useEffect, useRef, useState } from \"react\";\r\n\r\nexport const useOnScreen = (options) => {\r\n const ref = useRef();\r\n const [visible, setVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n const observer = new IntersectionObserver(([entry]) => {\r\n setVisible(entry.isIntersecting);\r\n }, options);\r\n\r\n if (ref.current) observer.observe(ref.current);\r\n\r\n return () => {\r\n if (ref.current) observer.unobserve(ref.current);\r\n };\r\n }, [ref, options]);\r\n\r\n return [ref, visible];\r\n};\r\n","import React, { useEffect, useState } from \"react\";\r\n\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { useHistory, useParams } from \"react-router-dom\";\r\n\r\nimport axios from \"axios\";\r\nimport { Trans } from \"react-i18next\";\r\n\r\nimport { Fade } from \"react-awesome-reveal\";\r\nimport {\r\n Button,\r\n Modal,\r\n Message,\r\n Input,\r\n Header,\r\n Icon,\r\n Segment,\r\n} from \"semantic-ui-react\";\r\n\r\nconst CancelMeeting = (props) => {\r\n const history = useHistory();\r\n const params = useParams();\r\n const { t } = useTranslation();\r\n\r\n const { meeting } = params;\r\n const { slot } = params;\r\n const [organization, setOrganization] = useState();\r\n\r\n const [day, setDay] = useState();\r\n const [month, setMonth] = useState();\r\n const [year, setYear] = useState();\r\n const [hour, setHour] = useState();\r\n const [minute, setMinute] = useState();\r\n\r\n const [open, setOpen] = useState(false);\r\n\r\n const [phone, setPhone] = useState(\"\");\r\n\r\n const [cancel, setCancel] = useState(false);\r\n const [error, setError] = useState(false);\r\n const [errorCode, setErrorCode] = useState(\"\");\r\n const [errorMessage, setErrorMessage] = useState(\"\");\r\n\r\n useEffect(() => {\r\n getInfoFromUrl();\r\n getOrganizationFromId();\r\n hiddenMessage();\r\n });\r\n\r\n const hiddenMessage = () => {\r\n if (error) {\r\n setTimeout(() => {\r\n setError(false);\r\n }, 3000);\r\n }\r\n };\r\n\r\n const getOrganizationFromId = async () => {\r\n const url = `${process.env.REACT_APP_API_URL}Organization/${meeting}/${slot}`;\r\n\r\n await fetch(url)\r\n .then((response) => response.json())\r\n .then((response) => {\r\n setOrganization(response);\r\n });\r\n };\r\n\r\n const getInfoFromUrl = async () => {\r\n setYear(slot.slice(0, 4));\r\n setMonth(slot.slice(4, 6));\r\n setDay(slot.slice(6, 8));\r\n setHour(slot.slice(9, 11));\r\n setMinute(slot.slice(11, 13));\r\n };\r\n\r\n const validatePhone = () => {\r\n const regex = new RegExp(\"^[+]*[(]{0,1}[0-9]{1,4}[)]{0,1}[-s./0-9]*$\");\r\n\r\n return regex.test(phone);\r\n };\r\n\r\n const handleSubmit = async () => {\r\n const url = `${process.env.REACT_APP_API_URL}Calendar/${slot}/${meeting}`;\r\n const prefixPhone = `+34${phone}`;\r\n\r\n await setPhone(prefixPhone);\r\n\r\n if (validatePhone()) {\r\n try {\r\n await axios\r\n .delete(url, { params: { phone: prefixPhone } })\r\n .then(async (response) => {\r\n if (response.status || response.ok) await setCancel(true);\r\n\r\n throw new Error();\r\n });\r\n } catch (error) {\r\n } finally {\r\n setOpen(false);\r\n }\r\n } else {\r\n alert(\"Telefono invalido\");\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n {error ? (\r\n
\r\n {t(\"cancel.error.title\")}\r\n {t(\"cancel.error.message\")}
\r\n \r\n ERROR {errorCode}: {errorMessage}\r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n
\r\n {t(\"cancel.title\")}\r\n
\r\n {t(\"cancel.title2\")}\r\n
\r\n \r\n \r\n \r\n {meeting}\r\n \r\n ?\r\n \r\n \r\n \r\n {t(\"cancel.day\")} {day}-{month}-{year}{\" \"}\r\n {t(\"cancel.hour\")} {hour}:{minute}\r\n \r\n
\r\n \r\n
\r\n
\r\n }\r\n color=\"red\"\r\n basic\r\n size=\"big\"\r\n style={{ width: \"100px\" }}\r\n className=\"button\"\r\n onClick={() => window.location.reload(false)}\r\n >\r\n setOpen(false)}\r\n onOpen={() => setOpen(true)}\r\n open={open}\r\n style={{\r\n minWidth: \"200px\",\r\n maxWidth: \"400px\",\r\n display: \"flex\",\r\n textAlign: \"center\",\r\n justifyContent: \"center\",\r\n }}\r\n trigger={\r\n \r\n {t(\"cancel.open_modal\")}\r\n \r\n }\r\n >\r\n {t(\"cancel.titleModal\")}\r\n\r\n \r\n \r\n \r\n \r\n {t(\"cancel.message_modal\")}\r\n
\r\n {t(\"cancel.message_modal2\")}\r\n
\r\n setPhone(event.target.value)}\r\n />\r\n {phone !== \"\" ? (\r\n \r\n {t(\"cancel.confirm\")}\r\n \r\n ) : (\r\n \r\n {t(\"cancel.confirm\")}\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 CancelMeeting;\r\n","import React, { useState, useEffect, useRef } from 'react';\r\nimport LogoGeneralitat from \"../gencat-nuevo-completo-w.svg\";\r\nimport { Dropdown, Menu } from 'semantic-ui-react';\r\nimport i18n from \"../config/i18n\";\r\nimport 'semantic-ui-css/semantic.min.css';\r\n\r\nimport { Trans } from \"react-i18next\";\r\n\r\nexport default function Header({\r\n inverted = true,\r\n content = ,\r\n}) {\r\n\r\n const [language, setLanguage] = useState(i18n.language || '');\r\n\r\n useEffect(() => {\r\n const storedLanguage = localStorage.getItem(\"language\");\r\n if (storedLanguage && storedLanguage !== language) {\r\n i18n.changeLanguage(storedLanguage);\r\n setLanguage(storedLanguage);\r\n }\r\n }, [language, i18n]);\r\n\r\n const changeLanguage = (lng) => {\r\n i18n.changeLanguage(lng);\r\n localStorage.setItem(\"language\", lng);\r\n setLanguage(lng);\r\n };\r\n\r\n const dropdownRef = useRef(null);\r\n\r\n return (\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport { Dimmer, Loader, Menu } from \"semantic-ui-react\";\r\nimport LogoGeneralitat from \"../logo_generalitat_blanc.svg\";\r\n\r\nimport { Trans } from \"react-i18next\";\r\n\r\nexport default function Footer({\r\n inverted = true,\r\n content = ,\r\n}) {\r\n const version = `${process.env.REACT_APP_VERSION_TAG}`;\r\n return (\r\n \r\n );\r\n}\r\n","import React, { useState, useContext } from \"react\";\r\nimport { BrowserRouter, Route, Switch } from \"react-router-dom\";\r\nimport { Trans, useTranslation } from \"react-i18next\";\r\n\r\nimport CreateDate from \"./components/CreateDate\";\r\nimport CancelMeeting from \"./components/CancelMeeting\";\r\nimport Header from \"./components/Header\";\r\nimport Footer from \"./components/Footer\";\r\n\r\nimport \"./App.css\";\r\n\r\nimport \"semantic-ui-css/semantic.min.css\";\r\n\r\nimport \"react-datepicker/dist/react-datepicker.css\";\r\nimport DateSelect from \"./components/Calendar\";\r\n\r\nfunction App() {\r\n const { t } = useTranslation();\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n
\r\n {t('title')}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default App;\r\n","import React, { Suspense, useEffect, useRef, useState } from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport \"./index.css\";\r\nimport App from \"./App\";\r\nimport \"./web.config\";\r\n\r\nimport { DateTimeContextProvider } from \"./context/DateTimeContext\";\r\nimport { AuthContextProvider } from \"./context/AuthContext\";\r\nimport { TimeSlotContextProvider } from \"./context/TimeSlotContext\";\r\nimport { UIContextProvider } from \"./context/UIContext\";\r\nimport { ServiceContextProvider } from \"./context/ServiceContext\";\r\n\r\nimport {useTranslation } from \"react-i18next\";\r\nimport i18n from \"./config/i18n\";\r\nimport { I18nextProvider } from \"react-i18next\";\r\n\r\n\r\n\r\nReactDOM.render(\r\n \r\n \r\n \r\n \r\n \r\n Loading...}>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n ,\r\n document.getElementById(\"root\")\r\n);\r\n"],"sourceRoot":""}