) => {\r\n //Si hay calendas\r\n if (highlightedDays != null && highlightedDays.length > 0) {\r\n const matchedStyles = highlightedDays.reduce((a, v) => {\r\n return isSameDay(date, v.date) ? v.styles : a;\r\n }, {});\r\n\r\n return (\r\n \r\n \r\n \r\n {tipo == \"time\" ?\r\n handleOnChange(newValue)}\r\n renderInput={(props) => handleOnChange(newValue)}\r\n renderInput={(params) =>
\r\n \r\n : \"\"}\r\n\r\n );\r\n}\r\n\r\nOthelloTimer.propTypes = {\r\n currentvalue: PropTypes.object,\r\n fieldname: PropTypes.string,\r\n labelliteral: PropTypes.string,\r\n label: PropTypes.string,\r\n onChange: PropTypes.object,\r\n readonly: PropTypes.bool,\r\n disabled: PropTypes.bool,\r\n visible: PropTypes.bool,\r\n tipo: PropTypes.oneOf([\r\n \"date\",\r\n \"datetime\",\r\n \"time\",\r\n ]),\r\n abrecalendario: PropTypes.oneOf([\r\n \"\",//se abre al obtener el foco\r\n \"No\", //en nigun caso se abre,\r\n \"Hidden\", // Oculta el botón del calendario\r\n \"Calendar\",//hay un boton para abrir el calendario\r\n ]),\r\n showformato: PropTypes.bool,\r\n fullWidth: PropTypes.bool,\r\n calendas: PropTypes.object, //Array de fechas //{ dia: 08/11/2022 , colorrgb : \"#32a852\"} en C# FiltroCalendaModel\r\n};","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport Equalizer from \"@mui/icons-material/Equalizer\";\n\n// core components\nimport Grid from \"@mui/material/Grid\";\n\nimport OthelloBotonera from '../componentsothello/OthelloBotonera.jsx';\r\nimport { DataStatePage, OpcionSiNoEntero, PopUpResult, TipoOthelloFieldGrid} from \"../othelloConstantes.jsx\";\r\nimport OthelloGrid from '../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../componentsothello/OthelloEdit.jsx';\nimport OthelloTimer from \"../componentsothello/OthelloTimer.jsx\";\n\n\r\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\r\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\r\nimport OthelloCheckBox from \"../componentsothello/OthelloCheckBox.jsx\";\r\nimport OthelloTitulo from \"../componentsothello/OthelloTitulo.jsx\";\r\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\r\n\r\nexport default function TramosReservas({ ...props }) {\r\n const { literal, idRol, tipooficina } = props;\n\n const [loading, setLoading] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [datatramos, setdatatramos] = React.useState(null);\n const [datainstalaciones, setdatainstalaciones] = React.useState(null);\n\n const [alert, setalert] = React.useState(null);\n\n const [dataeditando, setdataeditando] = useState(null);\r\n const [indexeditando, setindexeditando] = useState(null);\n\n const [diasCerrando, setdiasCerrando] = useState(null);\n\n const navigate = useNavigate();\r\n\r\n const location = useLocation();\n\n React.useEffect(() => {\r\n\r\n setLoading(false);\r\n getDataPageIniciales();\r\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const getDataPageIniciales = () => {\r\n\r\n fetch('api/Data/GetInstalacionesReserva')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let restramos = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Instalacion,\r\n name: x.descripcion\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n setdatainstalaciones(restramos);\r\n\r\n getDataPage();\r\n });\r\n }\r\n\r\n const getDataPage = () => {\r\n fetch('api/Data/GetTramosReserva')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdatatramos(data);\r\n });\r\n }\r\n\r\n const getDataVaciaTramo = () => {\r\n fetch('api/Data/GetTramoReservaVacio')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdataeditando(data);\r\n setdiasCerrando(data.diasCerrado);\r\n setstatePage(DataStatePage.dsInsert);\r\n\r\n }).catch(error => {\r\n setdataeditando(null);\r\n setdiasCerrando(\"\");\r\n });\r\n }\r\n\r\n const grabarDataPageTramo = (event) => {\r\n\r\n //Altero el valor que tiene el input de dias visualizando\r\n try {\r\n //refs.form[2].value = diasCerrando;\r\n }\r\n catch { }\r\n\r\n let formulario = document.getElementById('formtramos');\r\n let formData = new FormData(formulario);\r\n\r\n var object = {};\r\n formData.forEach((value, key) => { object[key] = value });\r\n if (object != null) {\r\n }\r\n\r\n fetch('api/Data/GrabarReservaTramo', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n\r\n if (indexeditando == -1) {\r\n\r\n var array = [...datatramos];\r\n array.push(res);\r\n setdatatramos(array);\r\n }\r\n else {\r\n var array = [...datatramos];\r\n array[indexeditando] = res;\r\n setdatatramos(array);\r\n }\r\n\r\n setdiasCerrando(res.diasCerrado);\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n setalert(PopUpResult.OK);\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPageTramo = () => {\r\n getDataVaciaTramo();\r\n setindexeditando(-1);\r\n setdiasCerrando(\"\");\r\n }\r\n\r\n const buscarDataPageTramo = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n }\r\n\r\n const cancelarDataPageTramo = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setdiasCerrando(\"\");\r\n setstatePage(DataStatePage.dsSearch);\r\n }\r\n\r\n const deshacerDataPageTramo = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditando == -1)\r\n setstatePage(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n else {\r\n\r\n if (dataeditando != null)\r\n setdiasCerrando(dataeditando.diasCerrado);\r\n\r\n //forceUpdate();\r\n }\r\n }\r\n\n //METODO SOBRE EL GRID \r\n const editGridDataPageTramo = (valor, index) => {\r\n\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n setdiasCerrando(valor.diasCerrado);\r\n setstatePage(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPageTramo = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Tramo);\r\n\r\n fetch('api/Data/EliminarTramoReserva', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n\r\n if (datatramos != null) {\r\n var array = [...datatramos]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n setdatatramos(array);\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n const onChangeDiaCheckBox = (id, valor) => {\r\n\r\n //Si tenemo valor editando\r\n if (dataeditando != null && diasCerrando != null) {\r\n let dias = diasCerrando;\r\n\r\n //Si me dice que se ha seleccionado el check\r\n if (valor) {\r\n\r\n //Si no esta dentro de los dias a visualizar\r\n if (dias.indexOf(id) < 0) {\r\n dias = dias + id;\r\n }\r\n }\r\n //sino, es que debemos eliminarlo\r\n else {\r\n dias = dias.replace(id, \"\");\r\n }\r\n\r\n setdiasCerrando(dias);\r\n }\r\n }\n\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n }\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n function renderSearchTramos(datos) {\n\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"Tramo\", \"Instalacion\", \"Codigo\", \"Descripcion\", \"Pax\"];\r\n\r\n let valoreshow = [\"id_Tramo\", \"id_Instalacion\", \"codigo\", \"descripcion\", \"pax\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"id_Instalacion\", items: datainstalaciones });\r\n\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \n \n
\n \r\n );\n }\n else\n return \"\";\n }\n\r\n let busquedaTramos = loading ?
: renderSearchTramos(datatramos)\r\n\r\n let edicionTramos = statePage == DataStatePage.dsEdit || statePage == DataStatePage.dsInsert ? renderInsertEditTramos(dataeditando) : \"\";\r\n\n let alerta = alert != null ? \n \n \n {alerta}\n \n \n {edicionTramos}\n \n \n \n \n \n \n \r\n \r\n \r\n {busquedaTramos}\r\n \r\n \r\n \n \r\n \n \n );\n}\n\n","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport StoreMallDirectory from \"@mui/icons-material/StoreMallDirectory\";\n\n// core components\nimport Grid from \"@mui/material/Grid\";\nimport Card from \"@mui/material/Card\";\n\n\nimport OthelloBotonera from '../componentsothello/OthelloBotonera.jsx';\r\nimport { DataStatePage, PopUpResult, OpcionSiNo, OpcionTiposInstalacionReserva, OpcionesNominaciones, DriversPasarela, TiposVisualizacionInstalaciones } from \"../othelloConstantes.jsx\";\r\nimport OthelloGrid from '../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../componentsothello/OthelloEdit.jsx';\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\nimport ImageUpload from \"../components/ImageUpload.jsx\";\nimport OthelloTimer from \"../componentsothello/OthelloTimer.jsx\";\n\r\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\r\nimport OthelloCheckBox from \"../componentsothello/OthelloCheckBox.jsx\";\r\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\r\n\n\nexport default function InstalacionReservas({ ...props }) {\r\n const { literal, idRol } = props;\n\n const [loading, setLoading] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [data, setdata] = React.useState(null);\n\n const [alert, setalert] = React.useState(null);\n\n const [dataeditando, setdataeditando] = useState(null);\r\n const [indexeditando, setindexeditando] = useState(null);\n\n const [opcnominaciones, setopcnominaciones] = useState(null);\n\n const navigate = useNavigate();\r\n\r\n const location = useLocation();\n\n React.useEffect(() => {\r\n\r\n setLoading(false);\r\n getDataPage();\r\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const getDataPage = () => {\r\n\r\n fetch('api/Data/GetInstalacionesReserva')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdata(data);\r\n });\r\n }\r\n\r\n const getDataVacia = () => {\r\n\r\n fetch('api/Data/GetInstalacionReservaVacia')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdataeditando(data);\r\n setopcnominaciones(data.opcionesNominacion);\r\n setstatePage(DataStatePage.dsInsert);\r\n\r\n }).catch(error => {\r\n setdataeditando(null);\r\n setopcnominaciones(\"\");\r\n });;\r\n }\r\n\r\n const grabarDataPage = (event) => {\r\n\r\n //Altero el valor que tiene el input de dias visualizando\r\n try {\r\n //refs.form[2].value = opcnominaciones;\r\n }\r\n catch { }\r\n\r\n let formulario = document.getElementById('forminstalacion');\r\n let formData = new FormData(formulario);\r\n\r\n fetch('api/Data/GrabarInstalacionReserva', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n\r\n if (indexeditando == -1) {\r\n\r\n var array = [...data];\r\n array.push(res);\r\n setdata(array);\r\n }\r\n else {\r\n var array = [...data];\r\n array[indexeditando] = res;\r\n setdata(array);\r\n }\r\n\r\n setstatePage(DataStatePage.dsSearch);\r\n setalert(PopUpResult.OK);\r\n \r\n setdataeditando(null);\r\n setindexeditando(null); \r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPage = () => { \r\n getDataVacia();\r\n setindexeditando(-1);\r\n setopcnominaciones(\"\");\r\n }\r\n\r\n\r\n const buscarDataPage = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch); \r\n }\r\n\r\n const cancelarDataPage = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setopcnominaciones(\"\");\r\n setstatePage(DataStatePage.dsSearch);\r\n }\r\n\r\n const deshacerDataPage = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditando == -1)\r\n setstatePage(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n else {\r\n\r\n //Inicializo a los datos que tenia cuando se puso a editar \r\n if (dataeditando != null)\r\n setopcnominaciones(dataeditando.opcionesNominacion);\r\n\r\n //forceUpdate()\r\n }\r\n }\r\n\n //METODO SOBRE EL GRID \r\n const editGridDataPage =(valor, index) => {\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n setopcnominaciones(valor.opcionesNominacion == null || valor.opcionesNominacion == undefined ? \"\" : valor.opcionesNominacion);\r\n setstatePage(DataStatePage.dsEdit); \r\n }\r\n\r\n const deleteGridDataPage = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Instalacion);\r\n\r\n fetch('api/Data/EliminarInstalacionReserva', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n\r\n\r\n if (data != null) {\r\n var array = [...data]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n setdata(array);\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n const onClosePopUpResult = () => {\r\n setalert(\"\");\r\n }\n\n const onChangeOpcionNominacionCheckBox = (id, valor) => {\r\n\r\n //Si tenemo valor editando\r\n if (dataeditando != null && opcnominaciones != null)\r\n {\r\n let nominaciones = opcnominaciones;\r\n\r\n //Si me dice que se ha seleccionado el check\r\n if (valor) {\r\n\r\n //Si no esta dentro de los dias a visualizar\r\n if (nominaciones.indexOf(id) < 0)\r\n {\r\n nominaciones = nominaciones + id;\r\n }\r\n }\r\n //sino, es que debemos eliminarlo\r\n else {\r\n nominaciones = nominaciones.replace(id, \"\");\r\n }\r\n\r\n setopcnominaciones(nominaciones);\r\n }\r\n }\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n function renderSearch(datos) {\n\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"Instalacion\", \"Codigo\", \"Descripcion\"];\r\n\r\n let valoreshow = [\"id_Instalacion\", \"codigo\", \"descripcion\"];\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \n \n
\n \r\n );\n }\n else\n return \"\";\n }\n\r\n let busqueda = loading ?
: renderSearch(data)\r\n\r\n let edicion = statePage == DataStatePage.dsEdit || statePage == DataStatePage.dsInsert ? renderInsertEdit(dataeditando) : \"\";\r\n\n let alerta = alert != null ? \n \n {alerta}\n \n \n {edicion}\n \n \n \n \n \n \n \r\n \r\n \r\n {busqueda}\r\n \r\n \r\n \n \n \n );\n}\n\n","import React, { useState } from \"react\";\r\n\r\nimport { useNavigate, useLocation } from \"react-router-dom\";\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport Feedback from \"@mui/icons-material/Feedback\";\nimport InsertComment from \"@mui/icons-material/InsertComment\";\n\n// core components\nimport Card from \"@mui/material/Card\";\nimport Grid from \"@mui/material/Grid\";\n\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\nimport OthelloBotonera from '../componentsothello/OthelloBotonera.jsx';\r\nimport { TipoOthelloFieldGrid, DataStatePage, TiposPreguntaEncuenta, OpcionVisibilidad, PopUpResult, TiposValidacionEncuenta, TiposEncuenta, OpcionSiNo } from \"../othelloConstantes.jsx\";\r\nimport OthelloGrid from '../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../componentsothello/OthelloEdit.jsx';\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\n\n\nimport ImageUpload from \"../components/ImageUpload.jsx\";\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\nimport Button from \"../components/Button.jsx\";\n\r\n\nexport default function Encuestas({ ...props }) {\r\n const { literal, idRol } = props;\n\n const [loading, setLoading] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [stateQuestionPage, setstateQuestionPage] = React.useState(DataStatePage.dsSearch);\n const [dataenc, setdataenc] = React.useState(null);\n const [dataquestion, setdataquestion] = React.useState(null);\n const [urlencuesta, seturlencuesta] = React.useState(\"\");\n\n const [alert, setalert] = React.useState(null);\n\n const [dataeditando, setdataeditando] = useState(null);\r\n const [indexeditando, setindexeditando] = useState(null);\n\n const [dataquestioneditando, setdataquestioneditando] = useState(null);\r\n const [indexquestioneditando, setindexquestioneditando] = useState(null);\n\r\n React.useEffect(() => {\r\n\r\n setLoading(false);\r\n getDataPage();\r\n }, [loading]);\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n //Metodoso sobre Encuestas\r\n\r\n const getDataPage = () => {\r\n\r\n fetch('api/Data/GetEncuestas')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdataenc(data);\r\n });\r\n }\r\n\r\n const getDataVacia = () => {\r\n\r\n fetch('api/Data/GetEncuestaVacia')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdataeditando(data);\r\n setstatePage(DataStatePage.dsInsert);\r\n\r\n }).catch(error => {\r\n setdataeditando(null);\r\n });;\r\n }\r\n\r\n const grabarDataPage = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formencuesta');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GrabarEncuesta', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n //Si estamos añadiendo uno nuevo lo meto dentro de la lista de regiones\r\n if (indexeditando == -1) {\r\n var array = [...dataenc];\r\n array.push(res);\r\n\r\n setdataenc(array);\r\n }\r\n //Sino, es que estamos editando uno\r\n else {\r\n var array = [...dataenc];\r\n array[indexeditando] = res;\r\n setdataenc(array);\r\n }\r\n\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setdataquestioneditando(null);\r\n setindexquestioneditando(null);\r\n\r\n setstatePage(DataStatePage.dsSearch);\r\n setalert(PopUpResult.OK);\r\n\r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPage = () => {\r\n //LLama a obtener el idioma vacio, que es el que pondra el estado\r\n getDataVacia();\r\n setindexeditando(-1);\r\n }\r\n\r\n const cancelarDataPage = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setdataquestioneditando(null);\r\n setindexquestioneditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n seturlencuesta(\"\");\r\n }\r\n\r\n const deshacerDataPage = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditando == -1) {\r\n setstatePage(DataStatePage.dsSearch);\r\n seturlencuesta(\"\");\r\n }\r\n //Sino, es que estabamos en un item valido\r\n //else \r\n // this.forceUpdate() \r\n }\r\n\r\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n }\r\n\r\n const getUrlEncuesta = (valor) => {\r\n var jsonData = JSON.stringify(valor.id_Encuesta);\r\n\r\n fetch('api/Data/GetUrlEncuesta', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n seturlencuesta(res);\r\n }).catch(error => {\r\n\r\n });\r\n }\r\n\r\n\n //Metodoso sobre Questions\n\r\n const getDataVaciaQuestion = () => {\r\n\r\n var jsonData = JSON.stringify(dataeditando.id_Encuesta);\r\n\r\n fetch('api/Data/GetQuestionVacia', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdataquestioneditando(res);\r\n setstateQuestionPage(DataStatePage.dsInsert);\r\n }).catch(error => {\r\n setdataquestioneditando(null);\r\n });\r\n }\r\n\r\n const grabarDataPageQuestion = (event) => {\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formQuestion');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GrabarQuestion', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n //Si estamos añadiendo uno nuevo lo meto dentro de la lista de regiones\r\n if (indexquestioneditando == -1) {\r\n\r\n var array = [...dataquestion];\r\n array.push(res);\r\n\r\n setdataquestion(array);\r\n }\r\n else {\r\n var array = [...dataquestion];\r\n array[indexquestioneditando] = res;\r\n setdataquestion(array);\r\n }\r\n\r\n setdataquestioneditando(null);\r\n setindexquestioneditando(null);\r\n\r\n setstateQuestionPage(DataStatePage.dsSearch);\r\n seturlencuesta(\"\");\r\n setalert(PopUpResult.OK);\r\n\r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPageQuestion = () => {\r\n //LLama a obtener el idioma vacio, que es el que pondra el estado\r\n getDataVaciaQuestion();\r\n setindexquestioneditando(-1)\r\n }\r\n\r\n const cancelarDataPageQuestion = () => {\r\n setdataquestioneditando(null);\r\n setindexquestioneditando(null);\r\n\r\n setstateQuestionPage(DataStatePage.dsSearch);\r\n\r\n }\r\n\r\n const deshacerDataPageQuestion = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexquestioneditando == -1)\r\n setstateQuestionPage(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n // this.forceUpdate()\r\n }\r\n\n //METODO SOBRE EL GRID ENCUESTAS \r\n const editGridDataPage = (valor, index) => {\r\n\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n\r\n //Al editar otra concreta limpiamos la posible Question seleccionada\r\n setdataquestioneditando(null);\r\n setindexquestioneditando(null);\r\n\r\n //Si no tiene Questions entonces directamente lo pongo en edicion y limpio la lista de Questions\r\n if (valor.tieneQuestions == 0) {\r\n setdataquestion([]);\r\n setstatePage(DataStatePage.dsEdit);\r\n setstateQuestionPage(DataStatePage.dsSearch);\r\n }\r\n //sino, es que tiene Questions, por tanto las pido\r\n else {\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Encuesta);\r\n\r\n fetch('api/Data/GetQuestions', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdataquestion(res);\r\n setstatePage(DataStatePage.dsEdit);\r\n setstateQuestionPage(DataStatePage.dsSearch);\r\n }).catch(error => {\r\n\r\n });\r\n }\r\n }\r\n }\r\n\r\n const deleteGridDataPage = (valor, index) => {\r\n\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Encuesta);\r\n\r\n fetch('api/Data/EliminarEncuesta', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (res) {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n\r\n\r\n if (dataenc != null) {\r\n var array = [...dataenc]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setdataenc(array);\r\n\r\n setdataquestion([]);\r\n setstatePage(DataStatePage.dsSearch);\r\n setstateQuestionPage(DataStatePage.dsSearch);\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n //METODO SOBRE EL GRID QuestionS\r\n const editGridDataPageQuestion = (valor, index) => {\r\n\r\n setdataquestioneditando(valor);\r\n setindexquestioneditando(index);\r\n setstateQuestionPage(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPageQuestion = (valor, index) => {\r\n\r\n if (valor != null) {\r\n\r\n var jsonData = JSON.stringify({ idofi: valor.id_Oficina, idencuesta: valor.id_Encuesta, idquestion: valor.id_Question });\r\n\r\n fetch('api/Data/EliminarQuestion', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataquestioneditando(valor);\r\n setindexquestioneditando(index);\r\n\r\n if (dataquestion != null) {\r\n var array = [...dataquestion]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n setdataquestion(array);\r\n setalert(PopUpResult.OK); \r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n function renderSearch(encuestas) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"Encuesta\", \"Visible\", \"Validacion\", \"Imagen\", \"Preguntas\"];\r\n\r\n let valoreshow = [\"nombre\", \"visible\", \"tipoValidacion\", \"image\", \"tieneQuestions\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"tipoValidacion\", items: TiposValidacionEncuenta });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloImagen, fieldname: \"image\", items: [] });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"visible\", items: OpcionVisibilidad });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \n \n
\n \n {enc != null && enc.id_Encuesta > 0 ? getUrlEncuesta(enc)}>Ver Url Encuesta : \"\"}\n \n \n {urlencuesta != null ? urlencuesta : \"\"}\n \n \n \n \n {infoQuestions}\n \n \n\n \n \r\n );\n }\n else\n return \"\";\n }\n\n function renderOpcionesQuestions() {\n let busquedaQuestions = renderSearchQuestions(dataquestion);\n\n let edicion = stateQuestionPage == DataStatePage.dsEdit || stateQuestionPage == DataStatePage.dsInsert ? renderInsertEditQuestion(dataquestioneditando) : \"\";\n //#99d9b7\n return ( \n \n \n \n {edicion}\n \n \n \n \n \n \n \n \n {busquedaQuestions}\n \n \n
\n );\n }\n\n function renderSearchQuestions(Questions) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"Pregunta\", \"Tipo\", \"Orden Visual\", \"Visible\"];\r\n let valoreshow = [\"pregunta\", \"tipo\", \"ordenVisual\", \"visible\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"tipo\", items: TiposPreguntaEncuenta });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"visible\", items: OpcionVisibilidad });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n {Nombre} \n \n \n \n \n \n \n \r\n
\r\n );\n }\n else\n return \"\";\n }\n\r\n let busqueda = loading ?
: renderSearch(dataenc)\n\n let edicion = statePage == DataStatePage.dsEdit || statePage == DataStatePage.dsInsert ? renderInsertEdit(dataeditando) : \"\";\n\n let alerta = alert != null ? \n \n {alerta}\n \n \n {edicion}\n \n \n \n \n \n \n \r\n \r\n \r\n {busqueda}\r\n \r\n \r\n \n \r\n \n );\n}\n","import React from 'react';\r\n\r\n// nodejs library to set properties for components\nimport PropTypes from \"prop-types\";\r\n\r\nimport { useTranslation } from 'react-i18next';\r\n\r\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Card from \"@mui/material/Card\";\r\nimport MDBox from '../components/MDBox';\r\n\nexport default function OthelloWaiting({ ...props }) {\r\n\r\n const { t } = useTranslation();\r\n\r\n const { label, size } = props;\r\n\r\n let width = size != null && size == \"sm\" ? 120 : \"15rem\";\r\n let font = size != null && size == \"sm\" ? 16 : 18;\r\n\r\n return (\r\n\r\n \r\n \r\n {label != null && label != \"\" ? label : t(\"_cargando\")}\r\n
\r\n
\r\n \r\n \r\n );\r\n}\n\nOthelloWaiting.propTypes = {\n label: PropTypes.string,\n size: PropTypes.oneOf([\n \"\",\n \"sm\",\n ])\n};\n\n","import React from \"react\";\n\n// prop-types is library for typechecking of props\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Card from \"@mui/material/Card\";\nimport Divider from \"@mui/material/Divider\";\nimport Icon from \"@mui/material/Icon\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../components/MDBox\";\nimport MDTypography from \"../components/MDTypography\";\nimport MDButton from \"../components/MDButton\";\nimport Button from '../components/Button.jsx';\n\nimport Link from \"@mui/material/Link\";\n\nfunction OthelloCard({ color, titulo, count, icono, iconofooter, footer, bigtitulo, searching, onClick, categoria, children, smallmode, smallfootermode, vermas })\n{\n\n function renderfooter() {\n\n if (iconofooter == null && footer == null && onClick == null)\n return \"\";\n else\n\n return (<>\r\n \n \n {iconofooter != null ? {iconofooter} : \"\"}\n {footer != null && footer != \"\" ? footer : \"\"}\n {!searching && onClick != null ? info */}\n\n {/* {percentage.amount}*/}\n {/* */}\n {/* {percentage.label}*/}\n {/* {percentage.label}*/}\n \n \r\n );\r\n }\n\n let finalfooter = \"\";//renderfooter();\n\n let btvermas = vermas != null ? Ver mas \n \n \n {icono != null && icono != \"\" ?\n \n \n {icono}\n \n : \n {categoria != null && categoria != \"\" ? {categoria} : \"\"}\n \n {searching ? \n {/*4{count} */}\n \n \n {children != null && children != \"\" ? {children} : \"\"}\n {finalfooter} \n { btvermas} \n \n \n );\n}\n\n// Setting default values for the props of ComplexStatisticsCard\nOthelloCard.defaultProps = {\n color: \"info\",\n percentage: {\n color: \"success\",\n text: \"\",\n label: \"\",\n },\n};\n\n// Typechecking props for the ComplexStatisticsCard\nOthelloCard.propTypes = {\n color: PropTypes.oneOf([\n \"primary\",\n \"secondary\",\n \"info\",\n \"success\",\n \"warning\",\n \"error\",\n \"light\",\n \"dark\",\n ]),\n titulo: PropTypes.string.isRequired,\n count: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n percentage: PropTypes.shape({\n color: PropTypes.oneOf([\n \"primary\",\n \"secondary\",\n \"info\",\n \"success\",\n \"warning\",\n \"error\",\n \"dark\",\n \"white\",\n ]),\n amount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n label: PropTypes.string,\n }),\n icon: PropTypes.node.isRequired,\n};\n\nexport default OthelloCard;\r\n\r\n/*\r\n *\r\n//Creamos un componente stateles, ya que no necesitamos nigun estado y son mas rapidos\r\nfunction OthelloCard({ ...props }) {\r\n const {\r\n classes,\r\n color,\r\n textoicono,\r\n categoria,\r\n titulo,\r\n footer,\r\n children,\r\n bigtitulo,\r\n smallmode,\r\n smallfootermode,\r\n vermas\r\n } = props;\r\n\r\n //Gestion del icono principal\r\n let rendericon = props.icono != null ? : \"\";\r\n\r\n //Gestion del texto que se muestra\r\n let rendercategoria = {categoria}
;\r\n let rendertitulo = bigtitulo != null && bigtitulo == false ? {titulo} : {titulo} ;\r\n\r\n //Gestion del header\r\n let renderheader = smallmode == null || smallmode == false ? {rendericon}{rendercategoria}{rendertitulo}
: {rendericon}{rendercategoria}{rendertitulo}
;\r\n\r\n //Gestion del body\r\n let renderbody = children != null ? {children}
: \"\";\r\n\r\n //Gestion del footer del card\r\n let rendericonfooter = props.iconofooter != null ? Ver mas : \"\"\r\n\r\n let renderfooter =
;\r\n\r\n if (footer != null && footer != \"\") {\r\n if (smallfootermode == null || smallfootermode == false)\r\n renderfooter = {rendericonfooter}{footer}{btvermas}
{rendericonfooter}{footer}{btvermas}
\r\n {renderheader}\r\n {renderbody}\r\n {renderfooter}\r\n \r\n );\r\n}*/","import React from \"react\";\nimport MDTypography from \"../components/MDTypography\";\r\n\n\nexport default function OthelloPrimary(props) {\n \n return ({props.children} );\n}\n\n","import React from 'react';\r\n\r\n// @mui/icons-material\r\n\r\nimport Info from \"@mui/icons-material/Info\";\r\nimport ListAlt from \"@mui/icons-material/ListAlt\";\r\nimport Beenhere from \"@mui/icons-material/Beenhere\";\r\nimport Receipt from \"@mui/icons-material/Receipt\";\r\nimport AddCircle from \"@mui/icons-material/AddCircleOutline\";\r\nimport RemoveCircle from \"@mui/icons-material/RemoveCircleOutline\";\r\n\r\nimport Button from '../components/Button.jsx';\r\n\r\nimport Card from \"@mui/material/Card\";\r\nimport Grid from \"@mui/material/Grid\";\r\n\r\nimport OthelloWaiting from '../componentsothello/OthelloWaiting.jsx';\r\nimport OthelloTimer from '../componentsothello/OthelloTimer';\r\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\r\nimport OthelloCard from '../componentsothello/OthelloCard.jsx';\r\nimport OthelloTitulo from '../componentsothello/OthelloTitulo.jsx';\r\n\r\nimport { TiposBusquedaEstadisticas, TiposPreguntaEncuenta, TipoPreguntaEncuenta, OpcionSiNoEncuesta, OpcionComboBienMalRegularEncuesta, OpcionComboUnoDiezEncuesta, OpcionEstrellasEncuesta } from \"../othelloConstantes.jsx\";\r\n\r\nimport { TipoBusquedaEstadisticas } from '../othelloConstantes.jsx';\r\nimport OthelloEdit from '../componentsothello/OthelloEdit.jsx';\r\nimport OthelloPrimary from '../componentsothello/OthelloPrimary.jsx';\r\nimport OthelloTituloPanelData from '../componentsothello/OthelloTituloPanelData.jsx';\r\n\r\nexport default function EncuestasEstadistica({ ...props })\r\n{\r\n\r\n //Gestion de filtros\r\n const [loadingFiltros, setLoadingFiltros] = React.useState(true);\r\n const [filtros, setFiltros] = React.useState(\"\");\r\n\r\n //Gestion de la lista de entregas traspasos\r\n const [loading, setLoading] = React.useState(false);\r\n const [data, setData] = React.useState(null);\r\n\r\n const [questionOpen, setQuestionOpen] = React.useState([]);\r\n\r\n //EFECTOS\r\n\r\n React.useEffect(() => {\r\n fetch('api/Data/GetFiltrosEncuestasEstadisticas')\r\n .then(response => response.json())\r\n .then(data => {\r\n setFiltros(data);\r\n setLoadingFiltros(false);\r\n }).catch(error => {\r\n\r\n });\r\n\r\n }, [loadingFiltros]);\r\n \r\n\r\n function getDataPage() {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formbusqueda');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n setLoading(true);\r\n\r\n fetch('api/Data/GetEncuestasEstadisticas', {\r\n method: 'POST',\r\n body: formData,\r\n\r\n }).then(response => response.json()).then(res => {\r\n\r\n setData(res);\r\n setLoading(false);\r\n\r\n }).catch(error => {\r\n setData(null);\r\n setLoading(false);\r\n });\r\n }\r\n\r\n const onChangeEncuesta = (valor) => {\r\n if (valor != null) {\r\n let nuevo = { ...filtros }\r\n nuevo.tipobusqueda = valor;\r\n setFiltros(nuevo);\r\n }\r\n }\r\n\r\n const onChangeTipo = (valor) =>\r\n {\r\n if (valor != null)\r\n {\r\n let nuevo = { ...filtros }\r\n nuevo.tipobusqueda = valor;\r\n setFiltros(nuevo);\r\n }\r\n }\r\n\r\n const OnBuscarClick = () =>\r\n {\r\n getDataPage();\r\n }\r\n\r\n const onClickCollapse = (index) =>\r\n {\r\n if (index != null && index >= 0)\r\n {\r\n let existe = questionOpen.includes(index);\r\n\r\n if (existe) {\r\n let nuevo = [];\r\n questionOpen.forEach(x => {\r\n if (x != index)\r\n nuevo.push(x);\r\n });\r\n\r\n setQuestionOpen(nuevo);\r\n }\r\n else {\r\n var array = [...questionOpen]; \r\n \r\n array.push(index);\r\n setQuestionOpen(array); \r\n }\r\n }\r\n }\r\n\r\n // render\r\n\r\n function renderParametrosBusqueda() {\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 function renderInfoDetallePregunta(question, tiposinpuntuacion) {\r\n\r\n let resdata = \"\";\r\n let array = [];\r\n\r\n if (question.tipo == TipoPreguntaEncuenta.ComboUnoDiez)\r\n array = OpcionComboUnoDiezEncuesta;\r\n else if (question.tipo == TipoPreguntaEncuenta.ComboBienMalRegular)\r\n array = OpcionComboBienMalRegularEncuesta;\r\n else if (question.tipo == TipoPreguntaEncuenta.Estrellas)\r\n array = OpcionEstrellasEncuesta;\r\n else if (question.tipo == TipoPreguntaEncuenta.SiNo)\r\n array = OpcionSiNoEncuesta;\r\n else if (question.tipo == TipoPreguntaEncuenta.Combo || TipoPreguntaEncuenta.PreSelecOpcion || question.tipo == TipoPreguntaEncuenta.Provincias || question.tipo == TipoPreguntaEncuenta.Paises)\r\n {\r\n if (question.resultados != null && question.resultados.length > 0) \r\n question.resultados.forEach(x => {\r\n if (x.resultexto != null)\r\n array.push({ valor: x.resultexto, name: x.resultexto })\r\n }); \r\n } \r\n\r\n if (array != [])\r\n {\r\n resdata = array.map(x =>\r\n {\r\n let valor = 0;\r\n\r\n if (question.resultados != null && question.resultados.length > 0)\r\n {\r\n let resvalor = tiposinpuntuacion ? question.resultados.find(y => y.resultexto == x.valor) : question.resultados.find(y => y.puntuacion == x.valor);\r\n\r\n if (resvalor != null)\r\n valor = resvalor.respuestas;\r\n }\r\n\r\n return \r\n \r\n {x.name} \r\n
\r\n \r\n {valor} respuestas\r\n
\r\n \r\n });\r\n }\r\n\r\n return {resdata}
;\r\n }\r\n\r\n function renderInfoPreguntaOpen(question, tiposinpuntuacion) {\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Detalle de los resultados
); \r\n }\r\n\r\n function renderInfoPreguntas() {\r\n \r\n if (data.preguntas != null && data.preguntas.length > 0) {\r\n\r\n let res = data.preguntas.map((x, index) =>\r\n { \r\n let open = questionOpen != null && questionOpen.length > 0 && questionOpen.includes(index);\r\n let tiposinpuntuacion = x.tipo == TipoPreguntaEncuenta.Combo || TipoPreguntaEncuenta.PreSelecOpcion || x.tipo == TipoPreguntaEncuenta.Provincias || x.tipo == TipoPreguntaEncuenta.Paises || x.tipo == TipoPreguntaEncuenta.TextoLibre;\r\n\r\n return <>\r\n
\r\n {tiposinpuntuacion ? \"\" :
{x.valMedia.toFixed(2)} }
onClickCollapse(index)}>{open ? \r\n
{x.pregunta}
\r\n
\r\n {open ? renderInfoPreguntaOpen(x, tiposinpuntuacion) : \"\" }\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\n }\r\n else\r\n return \"\"; \r\n }\r\n\r\n function renderInfoEstadisticas() {\r\n\r\n return (\r\n !loading && data != null ? \r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {renderInfoPreguntas()} \r\n \r\n :\r\n \r\n \r\n \r\n \r\n {loading ? < OthelloWaiting /> : \"Seleccione los paramateros busqueda\"}\r\n
\r\n \r\n \r\n );\r\n }\r\n\r\n let paramsbsuqueda = renderParametrosBusqueda();\r\n\r\n let infoestadisticas = renderInfoEstadisticas();\r\n\r\n\r\n return (<>\r\n {paramsbsuqueda}\r\n {infoestadisticas} \r\n );\r\n}\r\n\r\n\r\nEncuestasEstadistica.propTypes = {\r\n\r\n\r\n}","import React from 'react';\r\n\r\n\r\n// @mui/icons-material\r\n\r\nimport Info from \"@mui/icons-material/Info\";\r\nimport ListAlt from \"@mui/icons-material/ListAlt\";\r\nimport Beenhere from \"@mui/icons-material/Beenhere\";\r\nimport Receipt from \"@mui/icons-material/Receipt\";\r\nimport AddCircle from \"@mui/icons-material/AddCircleOutline\";\r\nimport RemoveCircle from \"@mui/icons-material/RemoveCircleOutline\";\r\n\r\nimport Button from '../components/Button.jsx';\r\nimport Card from \"@mui/material/Card\";\r\nimport Grid from \"@mui/material/Grid\";\r\n\r\nimport OthelloWaiting from '../componentsothello/OthelloWaiting.jsx';\r\nimport OthelloTimer from '../componentsothello/OthelloTimer';\r\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\r\nimport OthelloCard from '../componentsothello/OthelloCard.jsx';\r\nimport OthelloTitulo from '../componentsothello/OthelloTitulo.jsx';\r\n\r\nimport { TiposBusquedaEstadisticas, TiposPreguntaEncuenta, TipoPreguntaEncuenta, OpcionSiNoEncuesta, OpcionComboBienMalRegularEncuesta, OpcionComboUnoDiezEncuesta, OpcionEstrellasEncuesta } from \"../othelloConstantes.jsx\";\r\n\r\n\r\n\r\nimport { TipoBusquedaEstadisticas } from '../othelloConstantes.jsx';\r\n\r\nimport nacionalidades from \"../assets/nacionalidades.json\";\r\nimport OthelloTituloPanelData from '../componentsothello/OthelloTituloPanelData.jsx';\r\n\r\nexport default function EncuestasEstadisticaFiltradas({ ...props }) {\r\n\r\n //Gestion de filtros\r\n const [loadingFiltros, setLoadingFiltros] = React.useState(true);\r\n const [filtros, setFiltros] = React.useState(\"\");\r\n\r\n //Gestion de la lista de entregas traspasos\r\n const [loading, setLoading] = React.useState(false);\r\n const [data, setData] = React.useState(null); \r\n\r\n const [resultadosFiltros, setResultadosFiltros] = React.useState(null); \r\n\r\n const [filtrospreguntas, setFiltrosPreguntas] = React.useState(null);\r\n\r\n //EFECTOS\r\n\r\n React.useEffect(() => {\r\n fetch('api/Data/GetFiltrosEncuestasEstadisticas')\r\n .then(response => response.json())\r\n .then(data => {\r\n setFiltros(data);\r\n setLoadingFiltros(false);\r\n }).catch(error => {\r\n\r\n });\r\n\r\n }, [loadingFiltros]);\r\n \r\n\r\n function getDataPage() {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formbusqueda');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n setLoading(true);\r\n\r\n fetch('api/Data/GetEncuestasEstadisticas', {\r\n method: 'POST',\r\n body: formData,\r\n\r\n }).then(response => response.json()).then(res => {\r\n\r\n setData(res);\r\n setLoading(false);\r\n\r\n }).catch(error => {\r\n setData(null);\r\n setLoading(false);\r\n });\r\n }\r\n\r\n const onChangeEncuesta = (valor) => {\r\n if (valor != null) {\r\n let nuevo = { ...filtros }\r\n nuevo.tipobusqueda = valor;\r\n setFiltros(nuevo);\r\n }\r\n }\r\n\r\n const onChangeTipo = (valor) =>\r\n {\r\n if (valor != null)\r\n {\r\n let nuevo = { ...filtros }\r\n nuevo.tipobusqueda = valor;\r\n setFiltros(nuevo);\r\n }\r\n }\r\n\r\n const OnBuscarClick = () =>\r\n {\r\n getDataPage();\r\n }\r\n\r\n const OnBuscarSegunFiltrosRespuestasClick = () => {\r\n\r\n let formulario = document.getElementById('formbusqueda');\r\n let formData = new FormData(formulario);\r\n var object = {};\r\n formData.forEach((value, key) => { object[key] = value });\r\n\r\n //Obtengo los datos\r\n let formulariofiltros = document.getElementById('formbusquedaquestions');\r\n let formDatafiltros = new FormData(formulariofiltros);\r\n\r\n var objectfitros = [];\r\n formDatafiltros.forEach((value, key) => objectfitros.push({ id_question: key, valor: value }));\r\n\r\n object.filtros = objectfitros;\r\n\r\n setFiltrosPreguntas(objectfitros);\r\n\r\n var jsonData = JSON.stringify(object);\r\n\r\n fetch('api/Data/GetEncuestasEstadisticasFiltradas', {\r\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\r\n\r\n }).then(response => response.json()).then(res => {\r\n setResultadosFiltros(res);\r\n\r\n }).catch(error => {\r\n\r\n }); \r\n } \r\n\r\n function renderParametrosBusqueda() {\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 function renderCombosPreguntas() {\r\n\r\n if (data.preguntas != null && data.preguntas.length > 0) {\r\n\r\n let res = data.preguntas.map((y, index) =>\r\n {\r\n if (y.tipo == TipoPreguntaEncuenta.TextoLibre)\r\n return \"\";\r\n else {\r\n let array = [];\r\n\r\n array.push({ valor: \"-1\", name: \"Todos\" });\r\n\r\n if (y.tipo == TipoPreguntaEncuenta.Combo || TipoPreguntaEncuenta.PreSelecOpcion || y.tipo == TipoPreguntaEncuenta.Provincias || y.tipo == TipoPreguntaEncuenta.Paises) {\r\n if (y.resultados != null && y.resultados.length > 0)\r\n y.resultados.forEach(x => {\r\n if (x.resultexto != null)\r\n array.push({ valor: x.resultexto, name: x.resultexto })\r\n });\r\n }\r\n else {\r\n let arrayIni = [];\r\n\r\n if (y.tipo == TipoPreguntaEncuenta.ComboUnoDiez)\r\n arrayIni = OpcionComboUnoDiezEncuesta;\r\n else if (y.tipo == TipoPreguntaEncuenta.ComboBienMalRegular)\r\n arrayIni = OpcionComboBienMalRegularEncuesta;\r\n else if (y.tipo == TipoPreguntaEncuenta.Estrellas)\r\n arrayIni = OpcionEstrellasEncuesta;\r\n else if (y.tipo == TipoPreguntaEncuenta.SiNo)\r\n arrayIni = OpcionSiNoEncuesta;\r\n\r\n array = arrayIni.filter(x => y.resultados.some(z => z.puntuacion == x.valor)); \r\n array.push({ valor: \"-1\", name: \"Todos\" });\r\n }\r\n\r\n\r\n let dataquestion = filtrospreguntas != null && filtrospreguntas.length > 0 ? filtrospreguntas.find(x => x.id_question == y.id_Question) : null;\r\n\r\n return \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n }\r\n else\r\n return \"\";\r\n }\r\n\r\n function renderFiltroPreguntasInfoEstadistica() {\r\n return !loading && data != null ? renderCombosPreguntas() : \"\";\r\n }\r\n\r\n function renderInfoEstadisticas() {\r\n\r\n return (\r\n !loading && resultadosFiltros != null ?\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n Se han encontrado {resultadosFiltros.totalCumplenFiltros} encuenta/s que cumplen con los filtros indicados. \r\n
\r\n \r\n \r\n \r\n \r\n : \"\");\r\n }\r\n\r\n let paramsbsuqueda = renderParametrosBusqueda();\r\n\r\n let filtroestadisticas = renderFiltroPreguntasInfoEstadistica();\r\n\r\n let infoEstadisticas = renderInfoEstadisticas();\r\n\r\n\r\n\r\n return (<>\r\n {paramsbsuqueda}\r\n {filtroestadisticas} \r\n {infoEstadisticas}\r\n );\r\n}\r\n\r\n\r\nEncuestasEstadisticaFiltradas.propTypes = {\r\n\r\n\r\n}","import React, { useState } from \"react\";\n\nimport { useTranslation } from 'react-i18next';\n\n// nodejs library to set properties for components\nimport PropTypes from \"prop-types\";\n\nimport SwipeableViews from \"react-swipeable-views\";\n\nimport Tabs from '@mui/material/Tabs';\nimport Tab from '@mui/material/Tab';\n\n// core components\nimport Grid from \"@mui/material/Grid\";\nimport MDBox from \"./MDBox\";\n\n\nexport default function NavPills({ ...props }) {\n\n \n const {\n tabs,\n direction,\n color,\n horizontal,\n alignCenter\n } = props;\n\n\n const [active, setactive] = useState(props.active);\n\n const handleChange = (event, active) => {\n setactive(active);\n\n if (props.onChangeIndexPill != null)\n props.onChangeIndexPill(active);\n };\n\n const handleChangeIndex = index => {\n setactive(index);\n\n };\n\n \n const tabButtons = (\n \n {tabs.map((prop, key) => {\n var icon = {};\n if (prop.tabIcon !== undefined) {\n icon[\"icon\"] = \n );\n\n const tabContent = (\n \n
\n {tabs.map((prop, key) => {\n return (\n \n \n {prop.tabContent}\n \n
\n );\n })}\n \n \n {tabButtons} \n {tabContent} \n \n ) : (\n \n {tabButtons}\n {tabContent}\n
\n );\n}\n\n\n\nNavPills.defaultProps = {\n active: 0,\n color: \"primary\"\n};\n\nNavPills.propTypes = {\n // index of the default active pill\n active: PropTypes.number,\n tabs: PropTypes.arrayOf(\n PropTypes.shape({\n tabButton: PropTypes.string,\n tabIcon: PropTypes.func,\n tabContent: PropTypes.node\n })\n ).isRequired,\n color: PropTypes.oneOf([\n \"primary\",\n \"warning\",\n \"danger\",\n \"success\",\n \"info\",\n \"rose\"\n ]),\n direction: PropTypes.string,\n horizontal: PropTypes.shape({\n tabsGrid: PropTypes.object,\n contentGrid: PropTypes.object\n }),\n alignCenter: PropTypes.bool,\n onChangeIndexPill: PropTypes.object,\n};\n\n/*\nclass NavPills extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n active: props.active\n };\n }\n handleChange = (event, active) => {\n this.setState({ active });\n\n if (this.props.onChangeIndexPill != null)\n this.props.onChangeIndexPill(active);\n };\n handleChangeIndex = index =>\n {\n this.setState({ active: index }); \n };\n render() {\n const {\n classes,\n tabs,\n direction,\n color,\n horizontal,\n alignCenter\n } = this.props;\n const flexContainerClasses = classNames({\n [classes.flexContainer]: true,\n [classes.horizontalDisplay]: horizontal !== undefined\n });\n const tabButtons = (\n \n {tabs.map((prop, key) => {\n var icon = {};\n if (prop.tabIcon !== undefined) {\n icon[\"icon\"] = \n
\n {tabs.map((prop, key) => {\n return (\n \n {prop.tabContent}\n
\n );\n })}\n \n \n {tabButtons} \n {tabContent} \n \n ) : (\n \n {tabButtons}\n {tabContent}\n
\n );\n }\n}*/\n\n\n//export default withStyles(navPillsStyle)(NavPills);\n","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport Place from \"@mui/icons-material/Place\";\nimport LocalOffer from \"@mui/icons-material/LocalOffer\";\nimport TouchApp from \"@mui/icons-material/TouchApp\";\nimport Info from \"@mui/icons-material/Info\";\nimport Collections from \"@mui/icons-material/Collections\";\nimport StoreMallDirectory from \"@mui/icons-material/StoreMallDirectory\";\n\n// core components\nimport Grid from \"@mui/material/Grid\";\nimport Card from \"@mui/material/Card\";\n\n\nimport OthelloBotonera from '../componentsothello/OthelloBotonera.jsx';\r\nimport { DataStatePage, Categorias, OpcionVisibilidadPoi, OpcionSiNo, OpcionSiNoChar, TipoOthelloFieldGrid, TipoArea, ModosVisualizaNotifica, Roles, PopUpResult, TipoEntrega } from \"../othelloConstantes.jsx\";\r\n\r\nimport { getCurrentDataFormulario } from \"../othelloFunciones.jsx\";\r\n\r\nimport OthelloGrid from '../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../componentsothello/OthelloEdit.jsx';\n\n\nimport NavPills from \"../components/NavPills.jsx\";\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\nimport ImageUpload from \"../components/ImageUpload.jsx\";\nimport Button from \"../components/Button.jsx\";\n\n\nimport OthelloTimer from \"../componentsothello/OthelloTimer.jsx\";\r\nimport OthelloCheckBox from \"../componentsothello/OthelloCheckBox.jsx\";\r\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\r\nimport OthelloTitulo from \"../componentsothello/OthelloTitulo.jsx\";\r\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\n\nexport default function Pois({ ...props }) {\r\n const { literal, idRol, tipooficina } = props;\n\n const [currenturl, setcurrenturl] = React.useState(\"\");\n\n const [loading, setLoading] = React.useState(true);\n const [loadingediting, setloadingediting] = React.useState(true);\n\n const [modoagenda, setmodoagenda] = React.useState(false);\n const [areaagenda, setareaagenda] = React.useState(null);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [statePageImagenExtra, setstatePageImagenExtra] = React.useState(DataStatePage.dsSearch);\n const [statePageAccion, setstatePageAccion] = React.useState(DataStatePage.dsSearch);\n const [statePagePromocion, setstatePagePromocion] = React.useState(DataStatePage.dsSearch);\n\n const [datapois, setdatapois] = React.useState(null);\n\n const [idiomas, setidiomas] = React.useState([]);\n const [idiomascombo, setidiomascombo] = React.useState([]); \n const [regiones, setregiones] = React.useState([]);\n const [areas, setareas] = React.useState([]);\n const [areascombo, setareascombo] = React.useState([]);\n const [subareas, setsubareas] = React.useState([]);\n const [tiposactividad, settiposactividad] = React.useState(null);\n\n const [areaselected, setareaselected] = React.useState(null);\n const [tipoactividadselected, settipoactividadselected] = React.useState(null);\n const [changingarea, setchangingarea] = React.useState(false);\n\n const [alert, setalert] = React.useState(null);\n\n const [dataeditando, setdataeditando] = useState(null);\r\n const [indexeditando, setindexeditando] = useState(null);\n\n const [dataeditandoImagenExtra, setdataeditandoImagenExtra] = useState(null);\r\n const [indexeditandoImagenExtra, setindexeditandoImagenExtra] = useState(null);\n\n const [dataeditandoAccion, setdataeditandoAccion] = useState(null);\r\n const [indexeditandoAccion, setindexeditandoAccion] = useState(null);\n\n const [dataeditandoPromocion, setdataeditandoPromocion] = useState(null);\r\n const [indexeditandoPromocion, setindexeditandoPromocion] = useState(null);\n\n const [diasVisualizando, setdiasVisualizando] = useState(null);\n\n const navigate = useNavigate();\r\n\r\n const { search } = useLocation();\r\n \n React.useEffect(() => {\r\n\r\n if (currenturl != \"\" && currenturl != window.location.href) {\r\n setdatapois(null);\r\n setLoading(true);\r\n }\r\n });\n\n React.useEffect(() => {\r\n\r\n setcurrenturl(window.location.href);\r\n\r\n let EsAgenda= window.location.pathname.indexOf(\"/admin/noticias\") !== -1\r\n\r\n setmodoagenda(EsAgenda);\r\n\r\n getDataPage(EsAgenda);\r\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const setIdPoiTiendaSelected = (selected) => {\r\n\r\n if (selected != null) {\r\n var jsonData = JSON.stringify({ id_poi: selected.id_Poi, nombre: selected.title });\r\n\r\n fetch('api/Data/SetIDPoiTiendaSelected', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n //Si hubo error\r\n if (res) {\r\n //navigate('/admin/dashtienda');\r\n //props.history.push('/admin/dashtienda')\r\n window.location.assign('/admin/dashtienda');\r\n }\r\n }).catch(error => {\r\n\r\n });\r\n }\r\n }\r\n\r\n //Metodos Sobre POIS\r\n\r\n const OnBuscarClick = () => {\r\n \r\n getDataPoisPage(modoagenda);\r\n }\r\n \r\n const getDataPage = (esagenda) =>\r\n {\r\n if (tiposactividad == null || (tiposactividad != null && tiposactividad.length == 0)) {\r\n fetch('api/Data/GetTiposActividad')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let resactividades = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.iD_Actividad,\r\n name: x.descripcion\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n settiposactividad(resactividades);\r\n });\r\n }\r\n\r\n if (idiomas == null || (idiomas != null && idiomas.length == 0)) {\r\n\r\n fetch('api/Data/GetIdiomas')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let residiomas = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.idioma,\r\n name: x.descripcion\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n let idiomasCombo = [...residiomas];\r\n idiomasCombo.push({ id_Oficina: -1, idioma: \"\", name: \"Todos\", valor: \"\" })\r\n\r\n setidiomas(residiomas);\r\n setidiomascombo(idiomasCombo);\r\n });\r\n }\r\n\r\n if (regiones == null || (regiones != null && regiones.length == 0)) {\r\n\r\n fetch('api/Data/GetRegiones')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let resregiones = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Region,\r\n name: x.nombreRegion\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n setregiones(resregiones);\r\n });\r\n }\r\n \r\n fetch('api/Data/GetAreas')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let resareas = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Area,\r\n name: x.cod_Area\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n let areasCombo = [...resareas];\r\n areasCombo.push({ id_Oficina: -1, id_Area: 0, cod_Area :\"Todas\", name: \"Todas\", valor: \"\" })\r\n\r\n setareas(resareas);\r\n setareascombo(areasCombo)\r\n\r\n if (esagenda) {\n if (resareas != null && resareas.length > 0) {\n let finalareaagenda = resareas.find(x => x.tipoArea == TipoArea.Agenda);\n\n if (finalareaagenda != null)\n setareaagenda(finalareaagenda);\n }\n }\r\n });\r\n \r\n if (subareas == null || (subareas != null && subareas.length == 0)) {\r\n\r\n fetch('api/Data/GetSubAreasOficina')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let ressubareas = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_SubArea,\r\n name: x.descripcion\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n setsubareas(ressubareas);\r\n });\r\n }\r\n \r\n getDataPoisPage(esagenda);\r\n\r\n setLoading(false);\r\n }\r\n\r\n const getDataPoisPage = (esagenda) =>\r\n {\r\n let jsonFinal = \"\";\r\n\r\n if (esagenda != null && esagenda) {\r\n jsonFinal = { idioma : \"\", id_area : null, modoagenda: esagenda }\r\n }\r\n else\r\n {\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formbusqueda');\r\n\r\n let jsonDataForm = getCurrentDataFormulario(formulario);\r\n\r\n jsonFinal = { ...jsonDataForm, modoagenda: esagenda };\r\n }\r\n\r\n //Si estamos en modo agenda\r\n var jsonData = JSON.stringify(jsonFinal);\r\n\r\n fetch('api/Data/GetPois', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdatapois(res);\r\n }).catch(error => {\r\n\r\n });\r\n\r\n\r\n }\r\n\r\n const getDataVacia = () => {\r\n\r\n fetch('api/Data/GetPoiVacio')\r\n .then(response => response.json())\r\n .then(data =>\r\n {\r\n setindexeditando(-1);\r\n setdiasVisualizando(data.diasVisualizar);\r\n\r\n if (areas != null && areas.length > 0)\r\n data.id_Area = areas[0].id_Area;\r\n\r\n setdataeditando(data);\r\n setstatePage(DataStatePage.dsInsert)\r\n setloadingediting(false);\r\n setareaselected(data.id_Area > 0 ? data.id_Area : null); \r\n }).catch(error => {\r\n setindexeditando(null);\r\n setdiasVisualizando(\"\");\r\n setdataeditando(null);\r\n setstatePage(DataStatePage.dsSearch)\r\n setloadingediting(true);\r\n });;\r\n }\r\n\r\n const grabarDataPage = (event) => {\r\n\r\n //Altero el valor que tiene el input de dias visualizando\r\n try {\r\n //refs.form[2].value = diasVisualizando;\r\n }\r\n catch { }\r\n\r\n //Obtengo los datos\r\n //const data = new FormData(refs.form);\r\n let formulario = document.getElementById('formpois');\r\n let formData = new FormData(formulario);\r\n\r\n //Guardo en un auxiliar los otros valores\r\n let aux = dataeditando;\r\n\r\n fetch('api/Data/GrabarPoi', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n //Le asocio los otros valores que no han sido modificados, ya que le dio a grabar la zona de poi\r\n res.acciones = aux.acciones;\r\n res.imagenesExtras = aux.imagenesExtras;\r\n res.promociones = aux.promociones;\r\n\r\n\r\n if (indexeditando == -1) {\r\n\r\n var array = [...datapois];\r\n array.push(res);\r\n setdatapois(array);\r\n }\r\n else {\r\n var array = [...datapois];\r\n array[indexeditando] = res;\r\n setdatapois(array);\r\n }\r\n\r\n setdiasVisualizando(res.diasVisualizar);\r\n setdataeditando(res); \r\n setalert(PopUpResult.OK);\r\n \r\n //autoCloseAlert();\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPage = () => \r\n {\r\n cancelarDataPage();\r\n //LLama a obtener el idioma vacio, que es el que pondra el estado\r\n getDataVacia();\r\n setindexeditando(-1);\r\n setdiasVisualizando(\"\");\r\n }\r\n\r\n const cancelarDataPage = () => {\r\n setindexeditando(null);\r\n setdiasVisualizando(\"\");\r\n setdataeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n setloadingediting(true);\r\n }\r\n\r\n const deshacerDataPage = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditando == -1)\r\n { \r\n setdataeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n setloadingediting(true);\r\n }\r\n //Sino, es que estabamos en un item valido\r\n else {\r\n //Inicializo a los datos que tenia cuando se puso a editar el poi\r\n if (dataeditando != null)\r\n setdiasVisualizando(dataeditando.diasVisualizar);\r\n\r\n //Actualizo la pantalla\r\n //forceUpdate()\r\n }\r\n }\r\n\r\n const onChangeArea = (valor) => {\r\n if (areaselected != valor) {\r\n\r\n var object = {};\r\n let formulario = document.getElementById('formpois');\r\n let formData = new FormData(formulario);\r\n formData.forEach((value, key) => { object[key] = value });\r\n\r\n var final =\r\n {\r\n ...object,\r\n lat: object.latStringAux,\r\n lon: object.lonStringAux,\r\n imagenesExtras: dataeditando.imagenesExtras,\r\n acciones: dataeditando.acciones,\r\n promociones: dataeditando.promociones,\r\n diasVisualizar: diasVisualizando\r\n }\r\n\r\n setdataeditando(final);\r\n setareaselected(valor);\r\n }\r\n }\r\n\r\n const onLimpiarFechaNotificado = (idpoi) => {\r\n if (idpoi > 0) {\r\n var jsonData = JSON.stringify(idpoi);\r\n\r\n fetch('api/Data/LimpiarFechaNotificadoPoi', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n let valor = dataeditando;\r\n valor.notificado = null;\r\n setdataeditando(valor);\r\n }\r\n }).catch(error => {\r\n\r\n });\r\n }\r\n }\r\n\r\n const onChangeDiaCheckBox = (id, valor) => {\r\n\r\n //Si tenemo valor editando\r\n if (dataeditando != null && diasVisualizando != null) {\r\n let diasvisu = diasVisualizando;\r\n\r\n //Si me dice que se ha seleccionado el check\r\n if (valor) {\r\n\r\n //Si no esta dentro de los dias a visualizar\r\n if (diasvisu.indexOf(id) < 0) {\r\n diasvisu = diasvisu + id;\r\n }\r\n }\r\n //sino, es que debemos eliminarlo\r\n else {\r\n diasvisu = diasvisu.replace(id, \"\");\r\n }\r\n\r\n setdiasVisualizando(diasvisu);\r\n }\r\n }\r\n\r\n const onClosePopUpResult = () => {\r\n setalert(\"\");\r\n }\r\n\r\n //Metodo sobre Imagenes Extras\r\n\r\n const getDataVaciaImagenExtra = () => {\r\n\r\n var jsonData = JSON.stringify(dataeditando.id_Poi);\r\n\r\n fetch('api/Data/GetImagenExtraVacia', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res =>\r\n {\r\n setdataeditandoImagenExtra(res);\r\n setstatePageImagenExtra(DataStatePage.dsInsert);\r\n }).catch(error => {\r\n setdataeditandoImagenExtra(null);\r\n });\r\n }\r\n\r\n const grabarDataPageImagenExtra = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formextras');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(refs.form);\r\n\r\n fetch('api/Data/GrabarImagenExtra', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n let editandofinal = dataeditando;\r\n\r\n if (editandofinal.imagenesExtras == null)\r\n editandofinal.imagenesfinal = [];\r\n\r\n if (indexeditandoImagenExtra == -1) \r\n editandofinal.imagenesExtras.push(res);\r\n else\r\n editandofinal.imagenesExtras[indexeditandoImagenExtra] = res;\r\n\r\n setdataeditando(editandofinal);\r\n setdataeditandoImagenExtra(null);\r\n setindexeditandoImagenExtra(null);\r\n setstatePageImagenExtra(DataStatePage.dsSearch)\r\n setalert(PopUpResult.OK); \r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPageImagenExtra = () => {\r\n\r\n getDataVaciaImagenExtra();\r\n setindexeditandoImagenExtra(-1); \r\n }\r\n\r\n const cancelarDataPageImagenExtra = () => {\r\n setdataeditandoImagenExtra(null);\r\n setindexeditandoImagenExtra(null);\r\n setstatePageImagenExtra(DataStatePage.dsSearch)\r\n }\r\n\r\n const deshacerDataPageImagenExtra = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditandoImagenExtra == -1)\r\n setstatePageImagenExtra(DataStatePage.dsSearch) \r\n //Sino, es que estabamos en un item valido\r\n //else\r\n //forceUpdate()\r\n }\r\n\r\n //Metodo sobre Acciones\r\n\r\n const getDataVaciaAccion = () => {\r\n\r\n var jsonData = JSON.stringify(dataeditando.id_Poi);\r\n\r\n fetch('api/Data/GetAccionVacia', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n setdataeditandoAccion(res);\r\n setstatePageAccion(DataStatePage.dsInsert)\r\n settipoactividadselected(null); \r\n }).catch(error => {\r\n setdataeditandoAccion(null); \r\n });\r\n }\r\n\r\n const grabarDataPageAccion = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formaccion');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(refs.form); \r\n\r\n fetch('api/Data/GrabarAccion', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n let editandofinal = dataeditando;\r\n\r\n if (editandofinal.acciones == null)\r\n editandofinal.acciones = [];\r\n\r\n if (indexeditandoAccion == -1)\r\n editandofinal.acciones.push(res);\r\n else\r\n editandofinal.acciones[indexeditandoAccion] = res;\r\n\r\n setdataeditando(editandofinal);\r\n setdataeditandoAccion(null);\r\n setindexeditandoAccion(null);\r\n setstatePageAccion(DataStatePage.dsSearch)\r\n setalert(PopUpResult.OK);\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPageAccion = () => {\r\n\r\n getDataVaciaAccion();\r\n setindexeditandoAccion(-1);\r\n }\r\n\r\n const cancelarDataPageAccion = () => {\r\n setdataeditandoAccion(null);\r\n setindexeditandoAccion(null);\r\n setstatePageAccion(DataStatePage.dsSearch)\r\n }\r\n\r\n const deshacerDataPageAccion = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditandoAccion == -1)\r\n setstatePageAccion(DataStatePage.dsSearch)\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n //forceUpdate()\r\n }\r\n\r\n const onChangeTipoActividad = (valor) => {\r\n if (tipoactividadselected != valor)\r\n settipoactividadselected(valor);\r\n }\r\n\r\n //Metodo sobre Promociones\r\n\r\n const getDataVaciaPromocion = () => {\r\n\r\n var jsonData = JSON.stringify(dataeditando.id_Poi);\r\n\r\n fetch('api/Data/GetPromocionVacia', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdataeditandoPromocion(res);\r\n setstatePagePromocion(DataStatePage.dsInsert);\r\n }).catch(error => {\r\n setdataeditandoPromocion(null);\r\n });\r\n }\r\n\r\n const grabarDataPagePromocion = (event) => {\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formpromo');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(refs.form);\r\n\r\n fetch('api/Data/GrabarPromocion', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n let editandofinal = dataeditando;\r\n\r\n if (editandofinal.promociones == null)\r\n editandofinal.promociones = [];\r\n\r\n if (indexeditandoPromocion == -1)\r\n editandofinal.promociones.push(res);\r\n else\r\n editandofinal.promociones[indexeditandoPromocion] = res;\r\n\r\n setdataeditando(editandofinal);\r\n setdataeditandoPromocion(null);\r\n setindexeditandoPromocion(null);\r\n setstatePagePromocion(DataStatePage.dsSearch)\r\n setalert(PopUpResult.OK); \r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPagePromocion = () => {\r\n\r\n getDataVaciaPromocion();\r\n setindexeditandoPromocion(-1);\r\n }\r\n\r\n const cancelarDataPagePromocion = () => {\r\n setdataeditandoPromocion(null);\r\n setindexeditandoPromocion(null);\r\n setstatePagePromocion(DataStatePage.dsSearch)\r\n }\r\n\r\n const deshacerDataPagePromocion = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditandoPromocion == -1)\r\n setstatePagePromocion(DataStatePage.dsSearch)\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n // forceUpdate()\r\n }\r\n\n //METODO SOBRE EL GRID POIS\r\n\r\n const editGridDataPage = (valor, index) => {\r\n\r\n setloadingediting(true);\r\n setdataeditando(null);\r\n //setState({ dataeditando: null, loadingediting: true });\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Poi);\r\n\r\n fetch('api/Data/GetPoi', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setindexeditando(index);\r\n setdiasVisualizando(res.diasVisualizar);\r\n setdataeditando(res);\r\n setstatePage(DataStatePage.dsEdit)\r\n setloadingediting(false);\r\n setareaselected(res.id_Area);\r\n setalert(null); \r\n }).catch(error => {\r\n\r\n });\r\n }\r\n }\r\n\r\n const deleteGridDataPage = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Poi);\r\n\r\n fetch('api/Data/EliminarPoi', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditando(null);\r\n setindexeditando(null); \r\n setdiasVisualizando(\"\");\r\n setstatePage(DataStatePage.dsSearch);\r\n\r\n if (datapois != null) {\r\n var array = [...datapois]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setdatapois(array)\r\n setalert(PopUpResult.OK); \r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n //METODO SOBRE EL GRID IMAGENES EXTRAS\r\n\r\n const editGridDataPageImagenExtra = (valor, index) => {\r\n\r\n setdataeditandoImagenExtra(valor);\r\n setindexeditandoImagenExtra(index);\r\n setstatePageImagenExtra(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPageImagenExtra = (valor, index) =>\r\n {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Extra_Img);\r\n\r\n fetch('api/Data/EliminarImagenExtra', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res)\r\n {\r\n if (dataeditando.imagenesExtras != null) {\r\n var array = [...dataeditando.imagenesExtras]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n let datafinal = dataeditando;\r\n\r\n //Actualizo las promociones con el nuevo valor\r\n datafinal.imagenesExtras = array;\r\n\r\n setdataeditando(datafinal);\r\n\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditandoImagenExtra(null);\r\n setindexeditandoImagenExtra(null);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n //METODO SOBRE EL GRID ACCIONES\r\n\r\n const editGridDataPageAccion = (valor, index) => {\r\n\r\n setdataeditandoAccion(valor);\r\n setindexeditandoAccion(index);\r\n setstatePageAccion(DataStatePage.dsEdit);\r\n settipoactividadselected(valor.activityType);\r\n }\r\n\r\n const deleteGridDataPageAccion = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_PoiAction);\r\n\r\n fetch('api/Data/EliminarAccion', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n if (dataeditando.acciones != null) {\r\n var array = [...dataeditando.acciones]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n let datafinal = dataeditando;\r\n\r\n //Actualizo las promociones con el nuevo valor\r\n datafinal.acciones = array;\r\n\r\n setdataeditando(datafinal);\r\n \r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditandoAccion(null);\r\n setindexeditandoAccion(null);\r\n\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n //METODO SOBRE EL GRID PROMOCIONES\r\n\r\n const editGridDataPagePromocion = (valor, index) => {\r\n\r\n setdataeditandoPromocion(valor);\r\n setindexeditandoPromocion(index);\r\n setstatePagePromocion(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPagePromocion = (valor, index) =>\r\n {\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Promocion);\r\n\r\n fetch('api/Data/EliminarPromocion', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n\r\n if (dataeditando.promociones != null) {\r\n var array = [...dataeditando.promociones]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n let datafinal = dataeditando;\r\n\r\n //Actualizo las promociones con el nuevo valor\r\n datafinal.promociones = array;\r\n\r\n setdataeditando(datafinal);\r\n\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditandoPromocion(null);\r\n setindexeditandoPromocion(null);\r\n\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\r\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n //Metodos render POIS\n\n function renderSearchPOIS(pois)\n {\n let name = tipooficina == 3 ? \"Establecimiento\" : \"Punto de Interes\";\n let cabeceros = idRol == Roles.SuperUsuario ? [name, \"Idioma\", \"Area\", \"Sub Area\", \"Poi\"] : [name, \"Idioma\", \"Area\", \"Sub Area\"];\n let valoreshow = idRol == Roles.SuperUsuario ? [\"title\", \"idioma\", \"id_Area\", \"id_SubArea\", \"id_Poi\"] : [\"title\", \"idioma\", \"id_Area\", \"id_SubArea\"];\n\n if (modoagenda) {\n let Cabecera = areaagenda != null ? areaagenda.cod_Area : \"\";\n\n cabeceros = [Cabecera, \"Notificacion\", \"Poi\"];\n valoreshow = [\"title\", \"fNotificacion\", \"id_Poi\"];\n }\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"idioma\", items: idiomas });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"id_Area\", items: areas });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"id_SubArea\", items: subareas, omitir: true });\r\n\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloDateTime, fieldname: \"fNotificacion\" });\r\n\r\n //Creamos el grid global \r\n return (
:\n (dataeditando != null && dataeditando.id_Poi > 0 ? dataeditando.title : (modoagenda ? \"Nuevo registro\" : \"Nuevo \" + name));\n\n //Si estamos cargando el poi ponemos el buscando, sino, renderizamos los datos generales del poi actual\n let datosGeneralesPoi = loadingediting ?
\r\n : renderInsertEditDatosGenerales(dataeditando)\n\n //Si estamos cargando el poi ponemos el buscando, sino, renderizamos los datos generales del poi actual\n let datosImagenesExtraPoi = loadingediting ?
\r\n : renderOpcionesImagenesExtra(dataeditando.imagenesExtras)\n\n // Si estamos cargando el poi ponemos el buscando, sino, renderizamos los datos generales del poi actual\n let datosAccionesPoi = loadingediting ?
\r\n : renderOpcionesAcciones(dataeditando.acciones)\n\n // Si estamos cargando el poi ponemos el buscando, sino, renderizamos los datos generales del poi actual\n let datosPromocionesPoi = loadingediting ?
\r\n : renderOpcionesPromociones(dataeditando.promociones)\n\n\n let tabs = [];\n\n if (modoagenda) {\n\n tabs = [\n {\n tabButton: \"Datos Generales\",\n tabIcon: Info,\n tabContent: (datosGeneralesPoi)\n }];\n\n if (dataeditando != null && dataeditando.id_Poi > 0) {\n tabs.push(\n {\n tabButton: \"Imagenes Extra\",\n tabIcon: Collections,\n tabContent: (datosImagenesExtraPoi)\n });\n\n tabs.push(\n {\n tabButton: \"Acciones\",\n tabIcon: TouchApp,\n tabContent: (datosAccionesPoi)\n });\n }\n }\n else {\n tabs = [\n {\n tabButton: \"Datos Generales\",\n tabIcon: Info,\n tabContent: (datosGeneralesPoi)\n }];\n\n if (dataeditando != null && dataeditando.id_Poi > 0) {\n tabs.push({\n tabButton: \"Imagenes Extra\",\n tabIcon: Collections,\n tabContent: (datosImagenesExtraPoi)\n });\n tabs.push({\n tabButton: \"Acciones\",\n tabIcon: TouchApp,\n tabContent: (datosAccionesPoi)\n });\n tabs.push({\n tabButton: \"Promociones\",\n tabIcon: LocalOffer,\n tabContent: (datosPromocionesPoi)\n });\n }\n }\n\n\n return (\n \n
\n \r\n );\n }\n else\n return \"\";\n }\n\n //Metodos render datos Generales POI\n\n function renderInsertEditDatosGenerales(poi)\n {\n if (poi != null) {\n let subareasshow = subareas != null ? subareas.filter(x => x.id_Area == areaselected) : null;\n let areaactual = areas != null ? areas.find(x => x.id_Area == areaselected) : null;\n\n return (\n
\n \n \n \n
\n \n {tipooficina == 3 || (poi != null && poi.ventaActiva != null && poi.ventaActiva == 1) ? setIdPoiTiendaSelected(poi)} > : \"\"}\n \n \n
\n
\n \n \n {edicionImagenes}\n \n \n \n \n {busquedaImagenes}\n \n \n
\n );\n }\n\n function renderSearchImagenesExtra( imagenes) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = idRol == Roles.SuperUsuario ? [\"Imagen\", \"ID\"] : [\"Imagen\"];\r\n let valoreshow = idRol == Roles.SuperUsuario ? [\"imageUrl\", \"id_Extra_Img\"] : [\"imageUrl\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloImagen, fieldname: \"imageUrl\", items: [] });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \r\n \r\n );\n }\n else\n return \"\";\n }\n //Metodos render Acciones\n\n function renderOpcionesAcciones( acciones) {\n\n let busquedaacciones = renderSearchAcciones( acciones);\n\n let edicionacciones = statePageAccion == DataStatePage.dsEdit || statePageAccion == DataStatePage.dsInsert ? renderInsertEditAccion( dataeditandoAccion) : \"\";\n\n //#99d9b7\n return (\n \n \n {edicionacciones}\n \n \n \n \n {busquedaacciones}\n \n \n
\n );\n }\n\n function renderSearchAcciones( acciones) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = idRol == Roles.SuperUsuario ? [\"Nombre Accion\", \"Tipo de Accion\", \"Orden Visual\", \"Accion\", \"ID\"] : [\"Nombre Accion\", \"Tipo de Accion\", \"Orden Visual\", \"Accion\"];\r\n let valoreshow = idRol == Roles.SuperUsuario ? [\"label\", \"activityType\", \"ordenVisual\", \"uri\", \"id_PoiAction\"] : [\"label\", \"activityType\", \"ordenVisual\", \"uri\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"activityType\", items: tiposactividad });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \r\n \r\n );\n }\n else\n return \"\";\n }\n\n //Metodos render Promociones\n\n function renderOpcionesPromociones( promos) {\n\n let busquedaPromos = renderSearchPromociones( promos);\n\n let edicionPromos = statePagePromocion == DataStatePage.dsEdit || statePagePromocion == DataStatePage.dsInsert ? renderInsertEditPromocion( dataeditandoPromocion) : \"\";\n\n //#99d9b7\n return (\n \n \n {edicionPromos}\n \n \n \n \n {busquedaPromos}\n \n \n
\n );\n }\n\n function renderSearchPromociones( promos) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = idRol == Roles.SuperUsuario ? [\"Codigo\", \"Promocion\", \"Fecha Final\", \"Activada\", \"ID\"] : [\"Codigo\", \"Promocion\", \"Fecha Final\", \"Activada\"];\r\n let valoreshow = idRol == Roles.SuperUsuario ? [\"codigoPromo\", \"promo\", \"fechValido\", \"activada\", \"id_Promocion\"] : [\"codigoPromo\", \"promo\", \"fechValido\", \"activada\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"activada\", items: OpcionSiNoChar });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloDate, fieldname: \"fechValido\" });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \r\n \r\n );\n }\n else\n return \"\";\n }\n\n function renderParametrosBusqueda() {\r\n\r\n \r\n\r\n return (modoagenda ? \"\" :\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n )\r\n }\n //currentvalue={!loadingFiltros ? filtros.tipobusqueda : 0} \n\r\n let busqueda = loading ?
: renderSearchPOIS(datapois)\n \n let edicion = statePage == DataStatePage.dsEdit || statePage == DataStatePage.dsInsert ? renderInsertEditPOIS() : \"\"; \n\n let alerta = alert != null ? \n \n {alerta}\n \n {paramsbsuqueda}\n \n \n \n \n \n \r\n \r\n \r\n {busqueda}\r\n \r\n \r\n \n \n \n {edicion}\n \r\n \n );\n}\n","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\r\n\r\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport People from \"@mui/icons-material/People\";\nimport Search from \"@mui/icons-material/Search\";\n\n// core components\nimport OthelloGrid from '../componentsothello/OthelloGrid.jsx';\nimport Grid from \"@mui/material/Grid\";\nimport Card from \"@mui/material/Card\";\n\r\nimport { DataStatePage, OpcionSiNoChar, TipoOthelloFieldGrid, PopUpResult, Roles } from \"../othelloConstantes.jsx\";\r\nimport OthelloBotonera from '../componentsothello/OthelloBotonera.jsx';\r\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\r\nimport OthelloEdit from '../componentsothello/OthelloEdit.jsx';\r\nimport Button from \"../components/Button.jsx\";\r\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\r\n\r\nexport default function Usuarios({ ...props }) {\r\n const { literal, idRol, tipooficina } = props;\n\n const [loading, setLoading] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [datausuarios, setdatausuarios] = React.useState(null);\n\n const [alert, setalert] = React.useState(null);\r\n\r\n\r\n const navigate = useNavigate();\r\n\r\n const location = useLocation();\n\n React.useEffect(() => {\r\n\r\n setLoading(false);\r\n getDataPage();\r\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const getDataPage = () => {\r\n //Si es supeusuario entonce busco los usuarios\r\n if (idRol == Roles.SuperUsuario) {\r\n fetch('api/Data/GetUsuarios')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdatausuarios(data)\r\n });\r\n }\r\n //Sino, es que es administrador, y por tanto, solo tendra acceso al meter codigo de cliente\r\n else {\r\n setdatausuarios([]);\r\n }\r\n }\r\n\r\n //METODO SOBRE EL GRID \r\n\r\n const editGridDataPage = (valor, index) => {\r\n\r\n if (valor != null) {\r\n navigate('/admin/profile/?id=' + valor.id_Usuario);\r\n //navigate('/admin/almacen/albaranes', { state: valor });\r\n //props.history.push('/admin/profile/?id=' + valor.id_Usuario);\r\n //window.location.assign('/admin/profile/?id=' + valor.id_Usuario);\r\n }\r\n }\r\n\r\n const nuevoDataPage = () => {\r\n navigate('/admin/profile/?id=-1');\r\n //props.history.push('/admin/profile/?id=-1');\r\n }\r\n\r\n const deleteGridDataPage = (valor, index) =>\r\n {\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Usuario);\r\n\r\n fetch('api/Data/EliminarUsuario', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (res) {\r\n if (datausuarios != null) {\r\n var array = [...datausuarios]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n setdatausuarios(array);\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n const buscarBoton = () =>\r\n { \r\n //Obtengo los datos\r\n let formulario = document.getElementById('formbusqcodigo');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(refs.form);\r\n\r\n fetch('api/Data/BuscarUsuarios', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(data => {\r\n\r\n setdatausuarios(data)\r\n\r\n //setState({ datausuarios: data, loading: false });\r\n\r\n }).catch(error => {\r\n setdatausuarios([])\r\n //setState({ datausuarios: [], loading: false });\r\n });\r\n }\n\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n }\n\r\n function renderFormUsuarios( datos) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"Nombre\", \"Apellidos\", \"DNI/CIF\", , \"E-Mail\", \"Telefono\", \"Codigo\", \"Confirmado\"];\r\n\r\n let valoreshow = [\"nombre\", \"Apellido\", \"NIF_CIF\", , \"eMail\", \"telefono\", \"codigoCliente\", \"confirmado\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"confirmado\", items: OpcionSiNoChar });\r\n\r\n //Creamos el grid global \r\n return (
: renderFormUsuarios(datausuarios);\r\n\r\n let alerta = alert != null ? \n \n {alerta}\n \n {idRol == Roles.SuperUsuario || idRol == Roles.Administrador ?\n \n \n \n \n : \"\"}\n \n \r\n \r\n \r\n {formulario}\r\n \r\n \r\n \n \r\n \n );\r\n}\r\n","import React from 'react';\r\n\r\nimport { Link } from \"react-router-dom\";\r\n\r\nimport CircularProgress from '@mui/material/CircularProgress';\r\n\r\nimport ChartistGraph from \"react-chartist\";\r\n\r\nimport Icon from \"@mui/material/Icon\";\r\nimport MDAlert from '../components/MDAlert';\r\nimport MDTypography from \"../components/MDTypography\";\r\n\r\n// @mui/icons-material\r\nimport Refresh from \"@mui/icons-material/Refresh\";\r\n\r\n// core components\r\nimport Button from \"../components/Button.jsx\";\r\nimport Grid from \"@mui/material/Grid\";\r\nimport Card from \"@mui/material/Card\";\n\r\nimport OthelloGrid from '../componentsothello/OthelloGrid.jsx';\r\nimport OthelloCard from '../componentsothello/OthelloCard.jsx';\r\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\r\nimport OthelloTituloPanelData from '../componentsothello/OthelloTituloPanelData';\r\n\r\nimport { TipoOthelloFieldGrid, Roles, OpcionVisibilidadDashboard } from \"../othelloConstantes.jsx\";\r\n\r\n\r\n\r\nvar Chartist = require(\"chartist\");\nvar delays = 80,\n durations = 500;\nvar delays2 = 80,\n durations2 = 500;\n\r\nvar straightLinesChart = {\n data: {\n labels: [\"'07\", \"'08\", \"'09\", \"'10\", \"'11\", \"'12\", \"'13\", \"'14\", \"'15\"],\n series: [[10, 16, 8, 13, 20, 15, 20, 34, 30]]\n },\n options: {\n lineSmooth: Chartist.Interpolation.cardinal({\n tension: 0\n }),\n low: 0,\n high: 50, // creative tim: we recommend you to set the high sa the biggest value + something for a better look\n chartPadding: {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0\n },\n classNames: {\n point: \"ct-point ct-white\",\n line: \"ct-line ct-white\"\n }\n },\n animation: {\n draw: function (data) {\n if (data.type === \"line\" || data.type === \"area\") {\n data.element.animate({\n d: {\n begin: 600,\n dur: 700,\n from: data.path\n .clone()\n .scale(1, 0)\n .translate(0, data.chartRect.height())\n .stringify(),\n to: data.path.clone().stringify(),\n easing: Chartist.Svg.Easing.easeOutQuint\n }\n });\n } else if (data.type === \"point\") {\n data.element.animate({\n opacity: {\n begin: (data.index + 1) * delays,\n dur: durations,\n from: 0,\n to: 1,\n easing: \"ease\"\n }\n });\n }\n }\n }\n};\n\nvar simpleBarChart = {\n data: {\n labels: [\n \"Jan\",\n \"Feb\",\n \"Mar\",\n \"Apr\",\n \"Mai\",\n \"Jun\",\n \"Jul\",\n \"Aug\",\n \"Sep\",\n \"Oct\",\n \"Nov\",\n \"Dec\"\n ],\n series: [[542, 443, 320, 780, 553, 453, 326, 434, 568, 610, 756, 895]]\n },\n options: {\n seriesBarDistance: 10,\n axisX: {\n showGrid: false\n }\n },\n responsiveOptions: [\n [\n \"screen and (max-width: 640px)\",\n {\n seriesBarDistance: 5,\n axisX: {\n labelInterpolationFnc: function (value) {\n return value[0];\n }\n }\n }\n ]\n ],\n animation: {\n draw: function (data) {\n if (data.type === \"bar\") {\n data.element.animate({\n opacity: {\n begin: (data.index + 1) * delays2,\n dur: durations2,\n from: 0,\n to: 1,\n easing: \"ease\"\n }\n });\n }\n }\n }\n};\r\n\r\nexport default function DashboardMain({ ...props })\r\n{\r\n const { literal, idRol } = props;\r\n\r\n\r\n const [loading, setLoading] = React.useState(false);\r\n const [dataIncidencias, setdataIncidencias] = React.useState(null);\r\n const [dataNotificaciones, setdataNotificaciones] = React.useState(null);\r\n const [dataanalitycs, setdataanalitycs] = React.useState(null);\r\n\r\n const [masfichas, setmasfichas] = React.useState(false);\r\n const [masareas, setmasareas] = React.useState(false);\r\n const [masimagenes, setmasimagenes] = React.useState(false);\r\n\r\n const [pendientesNotificar, setpendientesNotificar] = React.useState(-1);\r\n const [notificarHoy, setnotificarHoy] = React.useState(-1);\r\n\r\n const [franja, setfranja] = React.useState(30); \r\n\r\n React.useEffect(() => {\r\n getDataPage(franja);\r\n setLoading(false);\r\n\r\n }, [loading]);\r\n\r\n\r\n const getDataPage = (dias) => {\r\n fetch('api/Data/GetDatosGlobalesOficina')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n setpendientesNotificar(data.pendientesNotificar);\r\n setnotificarHoy(data.notificarHoy);\r\n setdataIncidencias(data.ultimasIncidencias);\r\n setdataNotificaciones(data.ultimasNotificaciones);\r\n\r\n getDatosAnalitycsOficina(dias);\r\n });\r\n }\r\n\r\n const getDatosAnalitycsOficina = (dias) => {\r\n var jsonData = JSON.stringify(dias);\r\n\r\n fetch('api/Data/GetDatosAnalitycsOficina', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(data => {\r\n setdataanalitycs(data);\r\n setmasfichas(false);\r\n setmasareas(false);\r\n setmasimagenes(false);\r\n }).catch(error => {\r\n\r\n });\r\n }\r\n\r\n\r\n\r\n const editGridDataPage = (valor, index) => {\r\n\r\n\r\n }\r\n\r\n /* METODOS A BORRAR*/\r\n\r\n\r\n const LoadingAgain = () => {\r\n setLoading(true);\r\n getDataPage(franja);\r\n }\r\n\r\n const MasFichas = () => {\r\n setmasfichas(!masfichas);\r\n }\r\n\r\n const MasAreas = () => {\r\n setmasareas(!masareas);\r\n }\r\n\r\n const MasImagenes = () => {\r\n setmasimagenes(!masimagenes);\r\n }\r\n\r\n const onChangeFranja = (valor) => {\r\n if (franja != valor) {\r\n setfranja(valor);\r\n getDataPage(valor);\r\n }\r\n }\r\n\r\n /* FIN METODOS A BORRAR*/\r\n\r\n //Metodo que monta los parametros de busqueda\r\n function MontarParametrosBusqueda() {\r\n\r\n return (\n \r\n \n \n
\r\n \n
\r\n \n \r\n \n
\r\n \r\n )\r\n }\r\n\r\n function renderUltimasIncidenciasRecibidas(datos) {\r\n let valorescabe = [\"Incidencia\", \"Tipo\", \"E-Mail\", \"Hora\", \"Latitud\", \"Longitud\", \"Descripcion\"];\r\n\r\n //Generamos los valores de cada una de las lineas de grid \r\n let valoreshow = [\"nombre\", \"tipoInci\", \"eMail\", \"hora\", \"lat\", \"lon\", \"descripcion\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloDateTime, fieldname: \"hora\" });\r\n\r\n //Creamos el grid global \r\n return (\r\n \n \r\n \n \r\n \n \r\n \n \r\n \r\n \r\n \n \r\n \n \r\n \r\n \r\n \n \r\n \n \r\n \r\n \r\n\r\n //FICHAS VISITADAS\r\n let valorescabe = [\"Nombre\", \"Dispositivo\", \"Total\"];\r\n\r\n let valoreshow = [\"nombre\", \"tipoDispositivo\", \"total\"];\r\n\r\n let datasourceFields = [];\r\n\r\n let fichasVisitadasFinal = [];\r\n\r\n if (datos != null && datos.fichasvistas != null) {\r\n if (!masfichas && datos.fichasvistas.length > 10)\r\n fichasVisitadasFinal = datos.fichasvistas.slice(0, 9);\r\n else\r\n fichasVisitadasFinal = datos.fichasvistas;\r\n }\r\n\r\n let datosFichas = (\n \n \n \n \n {datosFichas}\n \n \n \n \n {masfichas ? \"Ver menos\" : \"Ver mas\"} \n \n \n \n \n \r\n \n \n \n \n \n {datosAreas}\n \n \n \n \n {masareas ? \"Ver menos\" : \"Ver mas\"} \n \n \n \n \n \r\n \n \n \n \n \n {datosImagenes}\n \n \n \n \n {masimagenes ? \"Ver menos\" : \"Ver mas\"} \n \n \n \n \n \r\n \r\n }\r\n\r\n\r\n let incidencias = loading ?
: renderUltimasIncidenciasRecibidas(dataIncidencias);\r\n\r\n let notificaciones = loading ?
: renderUltimasNotificaciones(dataNotificaciones);\r\n\r\n let paramsbsuqueda = MontarParametrosBusqueda(this);\r\n //var date = new Date().getDate();\r\n //var month = new Date().getMonth() + 1;\r\n //var year = new Date().getFullYear();\r\n\r\n\r\n //let dia = date + '-' + month + '-' + year;\r\n\r\n let Analitycs = renderAnalitycs(dataanalitycs);\r\n \r\n return (\r\n \r\n
\r\n \r\n \r\n notifications_active {\" \"}ATMovilidad le da la bienvenida al nuevo gestor de contenidos. \r\n \r\n \r\n \r\n {idRol != Roles.Usuario ?\r\n <>\r\n {paramsbsuqueda}\r\n
\r\n \n \r\n \n \r\n \r\n
\n \n \n \n \n {notificaciones}\n \n \n \n \n \r\n
\n \n \n \n \n {incidencias}\n \n \n \n \n \r\n :\n
\n \r\n \n \n Estamos trabajando para mostrale informacion personalizada sobre sus datos \n
\n \r\n \r\n }\r\n {Analitycs}\r\n
\r\n// \r\n// \r\n// \r\n//
\r\n// \r\n//
Straight Lines Chart \r\n//
Line Chart with Points
\r\n//
\r\n// \r\n// \r\n// \r\n// \r\n//
\r\n// \r\n//
Simple Bar Chart \r\n//
Bar Chart
\r\n//
\r\n// \r\n// \r\n","import React from \"react\";\r\n\r\nimport { GetEstadoString } from \"../../othelloFunciones\";\r\n\r\nimport OthelloComboBox from \"../../componentsothello/OthelloComboBox\";\r\nimport OthelloEdit from \"../../componentsothello/OthelloEdit.jsx\";\r\nimport { TipoEntrega, TiposEntrega} from \"../../othelloConstantes.jsx\";\r\nimport OthelloPrimary from \"../../componentsothello/OthelloPrimary\";\r\n\r\nimport Grid from \"@mui/material/Grid\";\r\nimport Card from \"@mui/material/Card\";\r\n\r\nfunction Pedido({...props })\r\n{\r\n //variables de las propiedas recibidas\r\n const { idpedido} = props;\r\n\r\n const [pedido, setPedido] = React.useState(null);\r\n const [loading, setLoading] = React.useState(true);\r\n\r\n React.useEffect(() => {\r\n\r\n var jsonData = JSON.stringify(idpedido);\r\n\r\n fetch('api/Data/GetPedido', {\r\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\r\n\r\n }).then(response => response.json()).then(data => {\r\n setPedido(data);\r\n setLoading(false)\r\n }).catch(error => {\r\n setPedido(null);\r\n setLoading(false)\r\n });\r\n }, [loading]);\r\n\r\n\r\n let lineas = !loading && pedido != null ? pedido.lineas.map(x => {\r\n\r\n return \r\n
\r\n \r\n {x.nomArticulo} \r\n \r\n \r\n {x.cantidad} \r\n
\r\n \r\n \r\n \r\n {x.precio.toFixed(2)} € \r\n
\r\n \r\n \r\n \r\n {(x.cantidad * x.precio).toFixed(2)} € \r\n
\r\n \r\n \r\n
\r\n {!loading && pedido != null ?\r\n
\r\n
Datos del Pedido \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 {pedido.tipoEntrega == TiposEntrega.EnCasa ?\r\n
\r\n \r\n Datos del Envio \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n : \"\"} \r\n
\r\n \r\n Detalle del Pedido \r\n \r\n {lineas} \r\n
\r\n
\r\n \r\n Total: \r\n \r\n \r\n {pedido.total.toFixed(2)} € \r\n
\r\n \r\n \r\n
: \"\"} \r\n
\r\n \r\n \r\n \r\n CambioEstado(0)} />\r\n \r\n \r\n \r\n \r\n CambioEstado(1)}/>\r\n \r\n \r\n \r\n \r\n CambioEstado(2)} />\r\n \r\n \r\n \r\n \r\n CambioEstado(3)} />\r\n \r\n \r\n \r\n \r\n CambioEstado(4)} />\r\n \r\n \r\n \r\n \r\n CambioEstado(5)} />\r\n \r\n \r\n \r\n \r\n CambioEstado(6)} />\r\n \r\n \r\n \r\n \r\n CambioEstado(7)} />\r\n \r\n \r\n \r\n \r\n CambioEstado(8)} />\r\n \r\n \r\n
\r\n \r\n \r\n );\r\n}\r\n\r\nexport default EstadoPedido;","import React, { useState } from \"react\";\n\r\n\r\n// @mui/material components\n\r\nimport CircularProgress from '@mui/material/CircularProgress';\r\n\r\n// @mui/icons-material\r\nimport DateRange from \"@mui/icons-material/DateRange\";\r\nimport Event from \"@mui/icons-material/Event\";\r\nimport HowToVote from \"@mui/icons-material/HowToVote\";\r\nimport LocalGroceryStore from \"@mui/icons-material/LocalGroceryStore\";\r\nimport Receipt from \"@mui/icons-material/Receipt\";\r\nimport Warning from \"@mui/icons-material/Warning\";\r\nimport Refresh from \"@mui/icons-material/Refresh\";\r\nimport CheckCircleOutlined from \"@mui/icons-material/CheckCircleOutlined\";\r\nimport Visibility from \"@mui/icons-material/Visibility\";\r\n// core components\r\nimport Button from \"../../components/Button.jsx\";\r\nimport OthelloGrid from '../../componentsothello/OthelloGrid.jsx';\r\nimport OthelloCard from '../../componentsothello/OthelloCard.jsx';\r\nimport OthelloModalBase from '../../componentsothello/OthelloModalBase.jsx';\r\n\r\nimport { TipoOthelloFieldGrid, DataStateModal, ModoModal, MessageOthelloBoxButtons, TipoEntrega, DialogOthelloResult } from \"../../othelloConstantes.jsx\";\r\n\r\n// style for this view\r\nimport Pedido from './Pedido.js';\r\nimport EstadoPedido from './EstadoPedido.js';\r\n\r\nimport Grid from \"@mui/material/Grid\";\r\nimport OthelloTituloPanelData from \"../../componentsothello/OthelloTituloPanelData.jsx\";\r\n\r\n\r\nexport default function DashTienda({ ...props }) {\r\n const { literal, idRol, userID } = props;\r\n\r\n const [loading, setLoading] = React.useState(false);\r\n\r\n const [dataPedidos, setdataPedidos] = React.useState(null);\r\n const [pedidosPendientes, setpedidosPendientes] = React.useState(null);\r\n const [pedidosHoy, setpedidosHoy] = React.useState(null);\r\n const [articulosStockBajo, setarticulosStockBajo] = React.useState(null);\r\n const [dataArticulosStock, setdataArticulosStock] = React.useState(null);\r\n\r\n const [stateModal, setstateModal] = React.useState(DataStateModal.dsClosed);\n const [itemmodal, setitemmodal] = React.useState(null);\n const [modomodal, setmodomodal] = React.useState(null);\r\n const [nombretienda, setnombretienda] = React.useState(\"\");\r\n\r\n React.useEffect(() =>\r\n { \r\n getDataNombreTienda();\r\n getDataPage();\r\n setLoading(false);\r\n }, [loading]);\r\n\r\n const getDataPage = () => {\r\n fetch('api/Data/GetDatosGlobalesTienda')\r\n .then(response => response.json())\r\n .then(data => {\r\n setpedidosPendientes(data.pedidosPendientes);\r\n setpedidosHoy(data.pedidosHoy);\r\n setdataPedidos(data.ultimosPedidos);\r\n setarticulosStockBajo(data.articulosStockBajo);\r\n setdataArticulosStock(data.articulosStock);\r\n });\r\n }\r\n\r\n const getDataNombreTienda = () => {\r\n fetch('api/Data/GetNombreTiendaSelected')\r\n .then(response => response.json())\r\n .then(data => {\r\n setnombretienda(data.nombre);\r\n });\r\n }\r\n\r\n const editGridDataPage = (valor, index) =>\r\n {\r\n\r\n\r\n }\r\n\r\n const onclickColumna = (valor, field) =>\n {\n\n if (field != null) {\n if (field == \"tramitado\") {\n setstateModal(DataStateModal.dsOpen);\n setitemmodal(valor);\r\n setmodomodal(field);\n }\n else if (field == \"ver\") {\n setstateModal(DataStateModal.dsOpen);\n setitemmodal(valor);\r\n setmodomodal(field);\r\n } \n }\n }\r\n\r\n const othelloModalResul = (modo, result, valor) =>\r\n {\r\n if (modomodal == \"tramitado\" && result == 1 /*DialogOthelloResult.Ok*/)\r\n {\r\n setstateModal(DataStateModal.dsClosed);\n setitemmodal(null);\r\n setmodomodal(null);\r\n \r\n getDataPage();\r\n }\r\n else {\r\n setstateModal(DataStateModal.dsClosed);\n setitemmodal(null);\r\n setmodomodal(null);\r\n } \r\n }\r\n\r\n /* METODOS A BORRAR*/\r\n\r\n\r\n const LoadingAgain = () => {\r\n setLoading(true);\r\n getDataPage();\r\n }\r\n\r\n /* FIN METODOS A BORRAR*/\r\n\r\n //Metodo que monta los parametros de busqueda\r\n function MontarParametrosBusqueda()\r\n { \r\n return (\n \r\n \n \n
\r\n \n {nombretienda != null ? nombretienda : \"\"} \r\n
\r\n \n
\r\n \r\n )\r\n }\r\n\r\n function renderUltimosPedidos(datos) {\r\n let valorescabe = [\"\", \"\", \"Pedido\", \"Fecha Pedido\", \"Hora Pedido\", \"Entrega\", \"F. Entrega\", \"Cliente\", \"Telefono\", \"Arts\", \"Total\"];\r\n\r\n //Generamos los valores de cada una de las lineas de grid \r\n let valoreshow = [\"tramitado\", \"ver\", \"id_Pedido\", \"fechaPedidoString\", \"horaPedido\", \"tipoEntrega\", \"fechaEntregaString\", \"nombreApellidos\", \"telefono\", \"numArts\", \"total\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"tipoEntrega\", items: TipoEntrega });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"estado\", items: TipoEntrega });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloDateTime, fieldname: \"horaPedido\" });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloCurrency, fieldname: \"total\" });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"tramitado\", icon: CheckCircleOutlined, onclick: onclickColumna });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"ver\", icon: Visibility, onclick: onclickColumna });\r\n\r\n //Creamos el grid global \r\n return (\r\n )\r\n }\r\n }\r\n else\r\n return \"\";\r\n }\r\n\r\n let pedidos = loading ?
: renderUltimosPedidos(dataPedidos);\r\n\r\n let articulosstock = loading ?
: renderArticulosStockBajo(dataArticulosStock);\r\n\r\n let paramsbsuqueda = MontarParametrosBusqueda();\r\n\r\n let modal = \"\";\r\n\r\n if (stateModal != DataStateModal.dsClosed)\r\n modal = renderModalPedido(itemmodal, modomodal);\r\n\r\n return (\r\n \r\n {paramsbsuqueda}\r\n \r\n \n \r\n \n \r\n \n \r\n \r\n \n \n \n \n \n {pedidos}\n \n \n \n \n \r\n \n \n \n \n \n {articulosstock}\n \n \n \n \n \r\n {modal}\r\n
\r\n );\r\n}","import React, { useState } from \"react\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport ViewModule from \"@mui/icons-material/ViewModule\";\n\n// core components\nimport OthelloBotonera from '../../componentsothello/OthelloBotonera.jsx';\r\nimport { DataStatePage, TipoOthelloFieldGrid, Roles, PopUpResult, OpcionVisibilidad, OrdenacionCategoria, OpcionSiNo } from \"../../othelloConstantes.jsx\";\r\nimport OthelloGrid from '../../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../../componentsothello/OthelloEdit.jsx';\nimport ImageUpload from \"../../components/ImageUpload.jsx\";\nimport OthelloPopUpResult from \"../../componentsothello/OthelloPopUpResult.jsx\";\nimport OthelloComboBox from '../../componentsothello/OthelloComboBox.jsx';\n\nimport Grid from \"@mui/material/Grid\";\r\nimport Card from \"@mui/material/Card\";\nimport OthelloTituloPanelData from \"../../componentsothello/OthelloTituloPanelData.jsx\";\r\n\n\nexport default function Categorias({ ...props }) {\r\n const { literal, idRol } = props;\n\n const [loading, setLoading] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [datacategorias, setdatacategorias] = React.useState(null);\n const [nombretienda, setnombretienda] = React.useState(\"\");\n\n const [alert, setalert] = React.useState(null);\n\n const [dataeditando, setdataeditando] = useState(null);\r\n const [indexeditando, setindexeditando] = useState(null);\n\n React.useEffect(() => {\r\n\r\n setLoading(false);\r\n getDataNombreTienda();\r\n getDataPage();\r\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const getDataNombreTienda = () => {\r\n fetch('api/Data/GetNombreTiendaSelected')\r\n .then(response => response.json())\r\n .then(data => {\r\n setnombretienda(data.nombre);\r\n });\r\n }\r\n\r\n const getDataPage = () => {\r\n\r\n fetch('api/Data/GetCategorias')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdatacategorias(data);\r\n });\r\n }\r\n\r\n const getDataVacia = () => {\r\n\r\n fetch('api/Data/GetCategoriaVacia')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdataeditando(data);\r\n setstatePage(DataStatePage.dsInsert);\r\n\r\n }).catch(error => {\r\n setdataeditando(null);\r\n });;\r\n }\r\n\r\n const grabarDataPage = (event) => {\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formcategoria');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GrabarCategoria', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (indexeditando == -1) {\r\n\r\n var array = [...datacategorias];\r\n array.push(res);\r\n setdatacategorias(array);\r\n }\r\n else {\r\n var array = [...datacategorias];\r\n array[indexeditando] = res;\r\n setdatacategorias(array);\r\n }\r\n\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n\r\n setalert(PopUpResult.OK);\r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPage = () => {\r\n\r\n //LLama a obtener el idioma vacio, que es el que pondra el estado\r\n getDataVacia();\r\n setindexeditando(-1);\r\n }\r\n\r\n const buscarDataPage = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n }\r\n\r\n const cancelarDataPage = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n }\r\n\r\n const deshacerDataPage = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditando == -1)\r\n setstatePage(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n // this.forceUpdate()\r\n }\r\n\n //METODO SOBRE EL GRID \r\n const editGridDataPage = (valor, index) => {\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n setstatePage(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPage = (valor, index) => {\r\n\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Categoria);\r\n\r\n fetch('api/Data/EliminarCategoria', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n\r\n if (datacategorias != null) {\r\n var array = [...datacategorias]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n setdatacategorias(array);\r\n\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n }\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n function renderSearch(categoriaes) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = props.idRol == Roles.SuperUsuario ? [\"Categoria\", \"Codigo\", \"Ordenado\", \"Orden Visual\", \"Visible\", \"Icono\", \"Imagen\"] : [\"Codigo\", \"Ordenado\", \"Orden Visual\", \"Visible\", \"Icono\", \"Imagen\"];\r\n let valoreshow = props.idRol == Roles.SuperUsuario ? [\"id_Categoria\", \"codigo\", \"ordenadoPor\", \"ordenVisual\", \"visible\", \"icono\", \"image\"] : [\"codigo\", \"ordenadoPor\", \"ordenVisual\", \"visible\", \"icono\", \"image\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"visible\", items: OpcionVisibilidad });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"ordenadoPor\", items: OrdenacionCategoria });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloImagen, fieldname: \"icono\", items: [] });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloImagen, fieldname: \"image\", items: [] });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \n \n
\n \r\n );\n }\n else\n return \"\";\n }\n\r\n let busqueda = loading ?
: renderSearch(datacategorias)\n\n let edicion = statePage == DataStatePage.dsEdit || statePage == DataStatePage.dsInsert ? renderInsertEdit(dataeditando) : \"\";\n\n let alerta = alert != null ? \n \n {alerta}\n \n \n {edicion}\n \n \n \n \n \n \n \r\n \r\n \r\n {busqueda}\r\n \r\n \r\n \n \n \n );\n}\n\n","import React, { useState } from \"react\";\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport LocalMall from \"@mui/icons-material/LocalMall\";\n\nimport OthelloBotonera from '../../componentsothello/OthelloBotonera.jsx';\r\nimport { DataStatePage, TipoOthelloFieldGrid, Roles, PopUpResult, OpcionVisibilidad } from \"../../othelloConstantes.jsx\";\r\nimport OthelloGrid from '../../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../../componentsothello/OthelloEdit.jsx';\nimport ImageUpload from \"../../components/ImageUpload.jsx\";\nimport OthelloPopUpResult from \"../../componentsothello/OthelloPopUpResult.jsx\";\nimport OthelloCard from '../../componentsothello/OthelloCard';\n\nimport Grid from \"@mui/material/Grid\";\r\nimport Card from \"@mui/material/Card\";\nimport OthelloTituloPanelData from \"../../componentsothello/OthelloTituloPanelData.jsx\";\n\nexport default function Marcas({ ...props }) {\r\n const { literal, idRol } = props;\n\n const [loading, setLoading] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [datamarcas, setdatamarcas] = React.useState(null);\n const [nombretienda, setnombretienda] = React.useState(\"\");\n\n const [alert, setalert] = React.useState(null);\n\n const [dataeditando, setdataeditando] = useState(null);\r\n const [indexeditando, setindexeditando] = useState(null);\n\n React.useEffect (() => {\r\n \r\n getDataNombreTienda();\r\n getDataPage();\r\n setLoading(false);\r\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const getDataNombreTienda = () => {\r\n fetch('api/Data/GetNombreTiendaSelected')\r\n .then(response => response.json())\r\n .then(data => {\r\n setnombretienda(data.nombre);\r\n });\r\n }\r\n\r\n const getDataPage = () => {\r\n\r\n fetch('api/Data/GetMarcas')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdatamarcas(data);\r\n });\r\n }\r\n\r\n const getDataVacia = () => {\r\n\r\n fetch('api/Data/GetMarcaVacia')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdataeditando(data);\r\n setstatePage(DataStatePage.dsInsert);\r\n\r\n }).catch(error => {\r\n setdataeditando(null);\r\n });;\r\n }\r\n\r\n const grabarDataPage = (event) => {\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formmarca');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GrabarMarca', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (indexeditando == -1) {\r\n\r\n var array = [...datamarcas];\r\n array.push(res);\r\n setdatamarcas(array);\r\n }\r\n else {\r\n var array = [...datamarcas];\r\n array[indexeditando] = res;\r\n setdatamarcas(array);\r\n }\r\n\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n\r\n setalert(PopUpResult.OK);\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPage = () => {\r\n\r\n //LLama a obtener el idioma vacio, que es el que pondra el estado\r\n getDataVacia();\r\n setindexeditando(-1);\r\n }\r\n\r\n const buscarDataPage = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n }\r\n\r\n const cancelarDataPage = () => {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n }\r\n\r\n const deshacerDataPage = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditando == -1)\r\n setstatePage(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n // this.forceUpdate()\r\n }\r\n\n //METODO SOBRE EL GRID \r\n const editGridDataPage = (valor, index) => {\r\n\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n setstatePage(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPage = (valor, index) => {\r\n\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Marca);\r\n\r\n fetch('api/Data/EliminarMarca', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditando(valor);\r\n setindexeditando(index);\r\n\r\n if (datamarcas != null) {\r\n var array = [...datamarcas]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n setdatamarcas(array);\r\n\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n }\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n function renderSearch(marcas) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = props.idRol == Roles.SuperUsuario ? [\"Marca\", \"Codigo\", \"Nombre\", \"Icono\", \"Imagen\"] : [\"Codigo\", \"Nombre\", \"Icono\", \"Imagen\"];\r\n let valoreshow = props.idRol == Roles.SuperUsuario ? [\"id_Marca\", \"codigo\", \"nombre\", \"icono\", \"image\"] : [\"codigo\", \"nombre\", \"icono\", \"image\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloImagen, fieldname: \"icono\", items: [] });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloImagen, fieldname: \"image\", items: [] });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \n \n
\r\n \r\n );\n }\n else\n return \"\";\n }\n\r\n let busqueda = loading ?
: renderSearch(datamarcas)\n\n let edicion = statePage == DataStatePage.dsEdit || statePage == DataStatePage.dsInsert ? renderInsertEdit(dataeditando) : \"\";\n\n let alerta = alert != null ? \n \n {alerta}\n \n \n {edicion}\n \n \n \n \n \n \n \r\n \r\n \r\n {busqueda}\r\n \r\n \r\n \n \r\n \n );\n}\n\n","import React, { useState } from \"react\";\n\n// @mui/material components\r\n\r\n// @mui/icons-material\r\nimport Receipt from \"@mui/icons-material/Receipt\";\r\nimport CheckCircleOutlined from \"@mui/icons-material/CheckCircleOutlined\";\r\nimport Visibility from \"@mui/icons-material/Visibility\";\r\n\r\n// @mui/material components\n\r\n\r\nimport CircularProgress from '@mui/material/CircularProgress';\r\n\r\n// core components\r\nimport OthelloGrid from '../../componentsothello/OthelloGrid.jsx';\r\nimport OthelloModalBase from '../../componentsothello/OthelloModalBase.jsx';\r\nimport Pedido from './Pedido.js';\r\nimport EstadoPedido from './EstadoPedido.js';\r\n\r\nimport { TipoOthelloFieldGrid, DataStateModal, ModoModal, MessageOthelloBoxButtons, TipoEntregaCombo, DataStatePage, EstadosPedido, DialogOthelloResult} from \"../../othelloConstantes.jsx\";\r\n\r\nimport Grid from \"@mui/material/Grid\";\r\nimport OthelloTituloPanelData from \"../../componentsothello/OthelloTituloPanelData.jsx\";\r\n\r\nexport default function Pedidos({ ...props })\r\n{\r\n const { literal, idRol } = props;\n\n const [loading, setLoading] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [datapedidos, setdatapedidos] = React.useState(null);\n\n const [stateModal, setstateModal] = React.useState(DataStateModal.dsClosed);\n const [itemmodal, setitemmodal] = React.useState(null);\n const [modomodal, setmodomodal] = React.useState(null);\n const [nombretienda, setnombretienda] = React.useState(\"\"); \n\n React.useEffect(() => {\r\n\r\n setLoading(false);\r\n getDataNombreTienda();\r\n getDataPage();\r\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const getDataNombreTienda = () => {\r\n fetch('api/Data/GetNombreTiendaSelected')\r\n .then(response => response.json())\r\n .then(data =>\r\n {\r\n setnombretienda(data.nombre);\r\n });\r\n }\r\n\r\n const getDataPage = () => {\r\n\r\n fetch('api/Data/GetPedidos')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdatapedidos(data);\r\n });\r\n }\r\n\r\n const onclickColumna = (valor, field) => {\n\n if (field != null) {\n if (field == \"tramitado\") {\n setstateModal(DataStateModal.dsOpen);\n setitemmodal(valor);\r\n setmodomodal(field);\n }\n else if (field == \"ver\") {\n setstateModal(DataStateModal.dsOpen);\n setitemmodal(valor);\r\n setmodomodal(field);\n } \n }\n }\r\n\r\n\r\n const othelloModalResul = (modo, result, valor) => {\r\n\r\n if (modomodal == \"tramitado\" && result == 1 /*DialogOthelloResult.Ok*/) {\r\n\r\n setstateModal(DataStateModal.dsClosed);\n setitemmodal(null);\r\n setmodomodal(null);\r\n\r\n getDataPage();\r\n }\r\n else {\r\n setstateModal(DataStateModal.dsClosed);\n setitemmodal(null);\r\n setmodomodal(null);\r\n } \r\n }\r\n\r\n function renderModalPedido(item, modo) {\r\n if (item != null) {\r\n if (modo == \"tramitado\") {\n return (\r\n )\r\n }\r\n }\r\n else\r\n return \"\";\r\n }\r\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n\n function renderSearch(datos) {\n\n let valorescabe = [\"\", \"\", \"Pedido\", \"Fecha Pedido\", \"Hora Pedido\", \"Estado\", \"Entrega\", \"F. Entrega\", \"Cliente\", \"Telefono\", \"Total\"];\r\n\r\n //Generamos los valores de cada una de las lineas de grid \r\n let valoreshow = [\"tramitado\", \"ver\", \"id_Pedido\", \"fechaPedidoString\", \"horaPedidoString\", \"estado\", \"tipoEntrega\", \"fechaEntregaString\", \"nombreApellidos\", \"telefono\", \"total\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"tipoEntrega\", items: TipoEntregaCombo });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"estado\", items: EstadosPedido });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloCurrency, fieldname: \"total\" });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"tramitado\", icon: CheckCircleOutlined, onclick: onclickColumna });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"ver\", icon: Visibility, onclick: onclickColumna });\r\n\r\n //Creamos el grid global \r\n return (
\r\n : renderSearch(datapedidos);\n\n let modal = \"\";\r\n\r\n if (stateModal != DataStateModal.dsClosed)\r\n modal = renderModalPedido(itemmodal, modomodal);\n \n let namefinal = nombretienda != null ? nombretienda : \"\";\n let pedidosfinal = \"Pedidos\" + namefinal;\n\n return (\n \n {modal}\n \n \n \n \n \n {busqueda}\n \n \n \n \r\n \n \n );\n}","import React, { useState } from \"react\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport LocalGroceryStore from \"@mui/icons-material/LocalGroceryStore\";\nimport Info from \"@mui/icons-material/Info\";\nimport Toc from \"@mui/icons-material/Toc\";\nimport Collections from \"@mui/icons-material/Collections\"; \n\n// core components\nimport OthelloBotonera from '../../componentsothello/OthelloBotonera.jsx';\r\nimport { DataStatePage, OpcionSiNo, TipoOthelloFieldGrid, Roles, PopUpResult, OpcionVisibilidad, Visibilidad, EstadosArticulo } from \"../../othelloConstantes.jsx\";\r\nimport OthelloGrid from '../../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../../componentsothello/OthelloEdit.jsx';\nimport NavPills from \"../../components/NavPills.jsx\";\nimport OthelloComboBox from '../../componentsothello/OthelloComboBox.jsx';\nimport ImageUpload from \"../../components/ImageUpload.jsx\";\n\r\nimport OthelloPopUpResult from \"../../componentsothello/OthelloPopUpResult.jsx\";\r\nimport OthelloTitulo from \"../../componentsothello/OthelloTitulo.jsx\";\r\nimport OthelloTituloPanelData from \"../../componentsothello/OthelloTituloPanelData.jsx\";\r\n\r\nimport Grid from \"@mui/material/Grid\";\r\nimport Card from \"@mui/material/Card\";\r\n\r\n\n\nexport default function Articulos({ ...props }) {\r\n const { literal, idRol } = props;\n\n const [loading, setLoading] = React.useState(true);\n const [loadingediting, setloadingediting] = React.useState(true);\n\n const [statePage, setstatePage] = React.useState(DataStatePage.dsSearch);\n const [statePageDefinicion, setstatePageDefinicion] = React.useState(DataStatePage.dsSearch);\n const [statePageImagenExtra, setstatePageImagenExtra] = React.useState(DataStatePage.dsSearch);\n\n const [datarticulos, setdatarticulos] = React.useState(null);\n const [nombretienda, setnombretienda] = React.useState(\"\");\n\n const [categorias, setcategorias] = React.useState([]);\n const [marcas, setmarcas] = React.useState([]);\n\n const [alert, setalert] = React.useState(null);\n\n const [dataeditando, setdataeditando] = useState(null);\r\n const [indexeditando, setindexeditando] = useState(null);\n\n const [dataeditandoDefinicion, setdataeditandoDefinicion] = useState(null);\r\n const [indexeditandoDefinicion, setindexeditandoDefinicion] = useState(null);\n\n const [dataeditandoImagenExtra, setdataeditandoImagenExtra] = useState(null);\r\n const [indexeditandoImagenExtra, setindexeditandoImagenExtra] = useState(null);\n\n React.useEffect(() => {\r\n\r\n getDataNombreTienda();\r\n getDataPage();\r\n setLoading(false);\r\n }, [loading]);\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n //Metodos Sobre Articulos\r\n\r\n const getDataNombreTienda = () => {\r\n fetch('api/Data/GetNombreTiendaSelected')\r\n .then(response => response.json())\r\n .then(data => {\r\n setnombretienda(data.nombre);\r\n });\r\n }\r\n\r\n const getDataPage = () =>\r\n {\r\n fetch('api/Data/GetCategorias')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let rescategorias = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Categoria,\r\n name: x.codigo\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n setcategorias(rescategorias);\r\n });\r\n\r\n fetch('api/Data/GetMarcas')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let resmarcas = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Marca,\r\n name: x.nombre\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n setmarcas(resmarcas);\r\n });\r\n\r\n fetch('api/Data/BuscarArticulosResumido')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdatarticulos(data);\r\n });\r\n }\r\n\r\n const getDataVacia = () => {\r\n\r\n fetch('api/Data/GetArticuloVacio')\r\n .then(response => response.json())\r\n .then(data =>\r\n {\r\n setindexeditando(-1);\r\n\r\n setdataeditando(data);\r\n setstatePage(DataStatePage.dsInsert);\r\n setloadingediting(false);\r\n\r\n }).catch(error =>\r\n {\r\n setindexeditando(null);\r\n\r\n setdataeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n setloadingediting(true); \r\n });\r\n }\r\n\r\n const grabarDataPage = (event) => {\r\n\r\n //Altero el valor que tiene el input de dias visualizando\r\n //try {\r\n // this.refs.form[2].value = this.diasVisualizando;\r\n //}\r\n //catch { }\r\n\r\n //Obtengo los datos\r\n //const data = new FormData(this.refs.form);\r\n let formulario = document.getElementById('formarticulos');\r\n let formData = new FormData(formulario);\r\n\r\n //Guardo en un auxiliar los otros valores\r\n let aux = dataeditando;\r\n\r\n fetch('api/Data/GrabarArticulo', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n //Le asocio los otros valores que no han sido modificados, ya que le dio a grabar la zona de articulo\r\n res.imagenesExtras = aux.imagenesExtras;\r\n\r\n if (indexeditando == -1) {\r\n\r\n var array = [...datarticulos];\r\n array.push(res);\r\n setdatarticulos(array);\r\n }\r\n else {\r\n var array = [...datarticulos];\r\n array[indexeditando] = res;\r\n setdatarticulos(array);\r\n }\r\n\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n\r\n setalert(PopUpResult.OK); \r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPage = () => {\r\n //LLama a obtener el idioma vacio, que es el que pondra el estado\r\n getDataVacia();\r\n setindexeditando(-1);\r\n }\r\n\r\n const cancelarDataPage = () => {\r\n\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n setloadingediting(true);\r\n }\r\n\r\n const deshacerDataPage = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (this.indexeditando == -1)\r\n {\r\n setdataeditando(null);\r\n setindexeditando(null);\r\n setstatePage(DataStatePage.dsSearch);\r\n setloadingediting(true); \r\n }\r\n //Sino, es que estabamos en un item valido\r\n //else {\r\n // //Inicializo a los datos que tenia cuando se puso a editar el articulo\r\n // if (dataeditando != null)\r\n // this.diasVisualizando = dataeditando.diasVisualizar;\r\n\r\n // //Actualizo la pantalla\r\n // this.forceUpdate()\r\n //}\r\n }\r\n\r\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n }\r\n\r\n\r\n //Metodo sobre Definiciones\r\n\r\n const getDataVaciaDefinicion = () => {\r\n\r\n var jsonData = JSON.stringify(dataeditando.id_Articulo);\r\n\r\n fetch('api/Data/GetArticuloDefVacio', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res =>\r\n {\r\n setdataeditandoDefinicion(res);\r\n setstatePageDefinicion(DataStatePage.dsInsert);\r\n }).catch(error => {\r\n setdataeditandoDefinicion(null);\r\n });\r\n }\r\n\r\n const grabarDataPageDefinicion = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formdefinicion');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GrabarArticuloDef', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (dataeditando.definiciones == null)\r\n dataeditando.definiciones = [];\r\n\r\n //Si estamos añadiendo uno nuevo lo meto dentro de la lista de regiones\r\n if (indexeditandoDefinicion == -1)\r\n dataeditando.definiciones.push(res);\r\n //Sino, es que estamos editando uno\r\n else\r\n dataeditando.definiciones[indexeditandoDefinicion] = res;\r\n\r\n setdataeditandoDefinicion(null);\r\n setindexeditandoDefinicion(null);\r\n\r\n setstatePageDefinicion(DataStatePage.dsSearch);\r\n setalert(PopUpResult.OK); \r\n }).catch(error => {\r\n setalert(PopUpResult.KO); \r\n });\r\n }\r\n\r\n const nuevoDataPageDefinicion = () => {\r\n\r\n getDataVaciaDefinicion();\r\n setindexeditandoDefinicion(-1);\r\n }\r\n\r\n const cancelarDataPageDefinicion = () => {\r\n setdataeditandoDefinicion(null);\r\n setindexeditandoDefinicion(null);\r\n\r\n setstatePageDefinicion(DataStatePage.dsSearch);\r\n }\r\n\r\n const deshacerDataPageDefinicion = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditandoDefinicion == -1)\r\n setstatePageDefinicion(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n // this.forceUpdate()\r\n }\r\n\r\n //Metodo sobre Imagenes Extras\r\n\r\n const getDataVaciaImagenExtra = () => {\r\n\r\n var jsonData = JSON.stringify(dataeditando.id_Articulo);\r\n\r\n fetch('api/Data/GetImagenExtraArticuloVacio', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdataeditandoImagenExtra(res);\r\n setstatePageImagenExtra(DataStatePage.dsInsert);\r\n }).catch(error => {\r\n setdataeditandoImagenExtra(null);\r\n });\r\n }\r\n\r\n const grabarDataPageImagenExtra = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formextras');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GrabarImagenExtra', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (dataeditando.imagenesExtras == null)\r\n dataeditando.imagenesExtras = [];\r\n\r\n //Si estamos añadiendo uno nuevo lo meto dentro de la lista de regiones\r\n if (indexeditandoImagenExtra == -1)\r\n dataeditando.imagenesExtras.push(res);\r\n //Sino, es que estamos editando uno\r\n else\r\n dataeditando.imagenesExtras[indexeditandoImagenExtra] = res;\r\n\r\n setdataeditandoImagenExtra(null);\r\n setindexeditandoImagenExtra(null);\r\n setstatePageImagenExtra(DataStatePage.dsSearch);\r\n setalert(PopUpResult.OK);\r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO); \r\n });\r\n }\r\n\r\n const nuevoDataPageImagenExtra = () => {\r\n\r\n getDataVaciaImagenExtra();\r\n setindexeditandoImagenExtra(-1);\r\n }\r\n\r\n const cancelarDataPageImagenExtra = () => {\r\n setdataeditandoImagenExtra(null);\r\n setindexeditandoImagenExtra(null);\r\n setstatePageImagenExtra(DataStatePage.dsSearch);\r\n }\r\n\r\n const deshacerDataPageImagenExtra = () => {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditandoImagenExtra == -1)\r\n setstatePageImagenExtra(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n // this.forceUpdate()\r\n }\r\n\n //METODO SOBRE EL GRID articuloS\r\n\r\n const editGridDataPage = (valor, index) => {\r\n\r\n setdataeditando(null);\r\n setloadingediting(true);\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify({ idofi: valor.id_Oficina, idpoi: valor.id_Poi, idart: valor.id_Articulo });\r\n\r\n fetch('api/Data/GetArticulo', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n setindexeditando(index);\r\n setdataeditando(res);\r\n setstatePage(DataStatePage.dsEdit);\r\n setloadingediting(false);\r\n setalert(null); \r\n }).catch(error => {\r\n\r\n });\r\n }\r\n }\r\n\r\n const deleteGridDataPage = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify({ idofi: valor.id_Oficina, idpoi: valor.id_Poi, idart: valor.id_Articulo });\r\n\r\n fetch('api/Data/EliminarArticulo', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setindexeditando(index);\r\n setdataeditando(res);\r\n\r\n if (datarticulos != null) {\r\n var array = [...datarticulos]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setdatarticulos(array);\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO); \r\n });\r\n }\r\n }\n\n //METODO SOBRE EL GRID Definiciones\r\n\r\n const editGridDataPageDefinicion = (valor, index) => {\r\n\r\n setdataeditandoDefinicion(valor);\r\n setindexeditandoDefinicion(index);\r\n setstatePageDefinicion(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPageDefinicion = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify({ idofi: valor.id_Oficina, idpoi: valor.id_Poi, idart: valor.id_Articulo, idartdef: valor.id_Art_Def });\r\n\r\n fetch('api/Data/EliminarArticuloDef', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n if (dataeditando.definiciones != null) {\r\n var array = [...dataeditando.definiciones]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Actualizo las promociones con el nuevo valor\r\n dataeditando.definiciones = array;\r\n\r\n setdataeditandoDefinicion(null);\r\n setindexeditandoDefinicion(null);\r\n \r\n //Modificao el estado de data para que refresque la pantalla\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\n\n //METODO SOBRE EL GRID IMAGENES EXTRAS\r\n\r\n const editGridDataPageImagenExtra = (valor, index) => {\r\n\r\n setdataeditandoImagenExtra( valor);\r\n setindexeditandoImagenExtra(index);\r\n setstatePageImagenExtra(DataStatePage.dsEdit);\r\n }\r\n\r\n const deleteGridDataPageImagenExtra = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_Extra_Img);\r\n\r\n fetch('api/Data/EliminarImagenExtra', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n if (dataeditando.imagenesExtras != null) {\r\n var array = [...dataeditando.imagenesExtras]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Actualizo las promociones con el nuevo valor\r\n dataeditando.imagenesExtras = array;\r\n\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditandoImagenExtra(null);\r\n setindexeditandoImagenExtra(null);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\r\n\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\n //Metodos render ARTICULOS\n\n function renderSearchArticulos(articulos) {\n let cabeceros = props.idRol == Roles.SuperUsuario ? [\"Articulo\", \"Inventario\", \"Precio\", \"Categoria\", \"Estado\", \"Art.\"] : [\"Articulo\", \"Inventario\", \"Precio\", \"Categoria\", \"Estado\"]\n let valoreshow = props.idRol == Roles.SuperUsuario ? [\"nombre\", \"cantidad\", \"precioBase\", \"id_Categoria\", \"estado\", \"id_Articulo\"] : [\"nombre\", \"cantidad\", \"precioBase\", \"id_Categoria\", \"estado\"];\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"id_Categoria\", items: categorias });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"visible\", items: OpcionVisibilidad });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"estado\", items: EstadosArticulo });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloCurrency, fieldname: \"precioBase\" });\r\n\r\n\r\n //Creamos el grid global \r\n return (
:\n (dataeditando != null && dataeditando.id_Articulo > 0 ? dataeditando.nombre : \"Nuevo Articulo\");\n\n //Si estamos cargando el articulo ponemos el buscando, sino, renderizamos los datos generales del articulo actual\n let datosGenerales = loadingediting ?
\r\n : renderInsertEditDatosGenerales(dataeditando)\n\n //Si estamos cargando el articulo ponemos el buscando, sino, renderizamos los datos generales del articulo actual\n let datosDefiniciones = loadingediting ?
\r\n : renderOpcionesDefiniciones(dataeditando.definiciones)\n\n //Si estamos cargando el articulo ponemos el buscando, sino, renderizamos los datos generales del articulo actual\n let datosImagenesExtraarticulo = loadingediting ?
\r\n : renderOpcionesImagenesExtra(dataeditando.imagenesExtras)\n\n\n let tabs = [];\n\n tabs = [\n {\n tabButton: \"Datos Generales\",\n tabIcon: Info,\n tabContent: (datosGenerales)\n }];\n\n if (dataeditando != null && dataeditando.id_Articulo > 0) {\n\n tabs.push({\n tabButton: \"Particularidades\",\n tabIcon: Toc,\n tabContent: (datosDefiniciones)\n });\n\n tabs.push({\n tabButton: \"Imagenes Extra\",\n tabIcon: Collections,\n tabContent: (datosImagenesExtraarticulo)\n });\n }\n\n\n return (\n \n
\n \r\n );\n }\n\n //Metodos render datos Generales \n\n function renderInsertEditDatosGenerales(articulo) {\n\n return ()\n }\n\n\n //Metodos render Definiciones\n\n function renderOpcionesDefiniciones(definiciones) {\n\n let busquedaDefiniciones = renderSearchDefiniciones(definiciones);\n\n let edicionDefinicion = statePageDefinicion == DataStatePage.dsEdit || statePageDefinicion == DataStatePage.dsInsert ? renderInsertEditDefinicion(dataeditandoDefinicion) : \"\";\n\n //#99d9b7\n return (\n \n \n {edicionDefinicion}\n \n \n \n \n {busquedaDefiniciones}\n \n \n
\n );\n }\n\n function renderSearchDefiniciones(definiciones) {\n let cabeceros = idRol == Roles.SuperUsuario ? [\"Articulo\", \"Inventario\", \"Precio\", \"Visible\", \"Art.\"] : [\"Articulo\", \"Inventario\", \"Precio\", \"Visible\"]\n let valoreshow = idRol == Roles.SuperUsuario ? [\"descripcion\", \"cantidad\", \"precio\", \"visible\", \"id_Art_Def\"] : [\"descripcion\", \"cantidad\", \"precio\", \"visible\",];\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"visible\", items: OpcionVisibilidad });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \n \r\n
\r\n \r\n );\n }\n else\n return \"\";\n }\n\n //Metodos render Imagenes Extras\n\n function renderOpcionesImagenesExtra(imagenes) {\n\n let busquedaImagenes = renderSearchImagenesExtra(imagenes);\n\n let edicionImagenes = statePageImagenExtra == DataStatePage.dsEdit || statePageImagenExtra == DataStatePage.dsInsert ? renderInsertEditImagenExtra(dataeditandoImagenExtra) : \"\";\n\n //#99d9b7\n return (\n \n \n {edicionImagenes}\n \n \n \n \n {busquedaImagenes}\n \n \n
\n );\n }\n\n function renderSearchImagenesExtra(imagenes) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = props.idRol == Roles.SuperUsuario ? [\"Imagen\", \"ID\"] : [\"Imagen\"];\r\n let valoreshow = props.idRol == Roles.SuperUsuario ? [\"imageUrl\", \"id_Extra_Img\"] : [\"imageUrl\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloImagen, fieldname: \"imageUrl\", items: [] });\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \n \r\n
\r\n \r\n );\n }\n else\n return \"\";\n }\n\n\r\n\r\n let busqueda = loading ?
: renderSearchArticulos(datarticulos)\n\n let edicion = statePage == DataStatePage.dsEdit || statePage == DataStatePage.dsInsert ? renderInsertEditArticulos() : \"\";\n\n let alerta = alert != null ? \n \n {alerta}\n \n \n \n \n \n \n \r\n \r\n \r\n {busqueda}\r\n \r\n \r\n \n \n \n {edicion}\n \r\n \n );\n}\n\n","import React, { useState } from \"react\";\n\r\n// @mui/material components\n\n// @mui/icons-material\nimport Face from \"@mui/icons-material/Face\";\n\n// core components\nimport Grid from \"@mui/material/Grid\";\nimport Card from \"@mui/material/Card\";\n\r\nimport { OpcionSiNo, PopUpResult } from \"../othelloConstantes.jsx\";\r\nimport Button from \"../components/Button.jsx\";\r\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\r\nimport ImageUpload from \"../components/ImageUpload.jsx\";\r\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\r\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\r\n\r\nexport default function Importacion({ ...props }) {\r\n\n\n const [loading, setLoading] = React.useState(true);\n\n const [alert, setalert] = React.useState(null);\n\n const [coordenadasfinal, setcoordenadasfinal] = useState(\"\"); \n\n React.useEffect(() => {\r\n\r\n setLoading(false);\r\n //getDataPage();\r\n }, [loading]);\n\r\n\r\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const ImportacionClick = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formimport');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GrabarImportacion', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n if (res)\r\n setalert(PopUpResult.OK);\r\n else\r\n setalert(PopUpResult.KO);\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const CoordenadasClick = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formkml');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(this.refs.form);\r\n\r\n fetch('api/Data/GetCoordenadasKml', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n setcoordenadasfinal(res.resul);\r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n\r\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n }\r\n\r\n //RENDERIZADO DE LA PAGINA \r\n\r\n let alerta = alert != null ? \n \n {alerta}\n \n \n \n \n \n
\n \n \r\n\r\n \n \n \n \n \r\n \n );\r\n}","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAMAAACahl6sAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAG2YAABzjgAA+swAAIT6AAB5gQAA/RMAADBtAAASKQ0eJk4AAAMAUExURevr7Jydn5manJucnuPj5JiZm9vb3PT09MvLzMLCw5GSlPr6+qeoqdXV1tHR0rW1trW2uKusrbi4urO0tLq6vKiqq7e4uLW2tqGipLm6ury8vr6+vr+/wLu8vM7OztDQ0cjJytjY2dTU1aipqqqrrMXGxqanqKmqq6Wmp9LT062usKSlprS0ta2trra2t6ytrqWmqK2ur66vsK6ur7CwsbOztK+vsK+wsbKys7GxsqOkpqOkpZ6foampq6qqrJ2eoKenqaysraKjpZqbnbi4uaKjpKSlp5eYmqioqqurrKChory8vKGio6amqKCho7Gys7CxsrGysrKzs5+gop+gobS1tbq6u7e3uLCxsbKztLi4uJWWmJaXmba3t7i5ub29vZWXmZSWmLq6upOVl5SVl7m5up6foLq7u7u7vJqcnZOUlpeZm5aYmpKUlry8vZKTlpGTlZCRlJCRk6ytr9bX197e3q+vsb2+v8DAweDh4bOztebm5ujp6e/v756eoP///4CAgIGBgYKCgoODg4SEhIWFhYaGhoeHh4iIiImJiYqKiouLi4yMjI2NjY6Ojo+Pj5CQkJGRkZKSkpOTk5SUlJWVlZaWlpeXl5iYmJmZmZqampubm5ycnJ2dnZ6enp+fn6CgoKGhoaKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq6ysrK2tra6urq+vr7CwsLGxsbKysrOzs7S0tLW1tba2tre3t7i4uLm5ubq6uru7u7y8vL29vb6+vr+/v8DAwMHBwcLCwsPDw8TExMXFxcbGxsfHx8jIyMnJycrKysvLy8zMzM3Nzc7Ozs/Pz9DQ0NHR0dLS0tPT09TU1NXV1dbW1tfX19jY2NnZ2dra2tvb29zc3N3d3d7e3t/f3+Dg4OHh4eLi4uPj4+Tk5OXl5ebm5ufn5+jo6Onp6erq6uvr6+zs7O3t7e7u7u/v7/Dw8PHx8fLy8vPz8/T09PX19fb29vf39/j4+Pn5+fr6+vv7+/z8/P39/f7+/v///zfARREAAAeqSURBVHja7N3xVxJZFMBxQAQVilzPSTslBxcDdwdtBQRBDQUFBYNMDTcoNLAMM7QD23JozvvX94cJZBhQZ+bdO2/26F/Q59wv8K48JwP5n/wY7iH3kHvIPYT6D89bLBazfiF8Y+T09PT09MOHzc3Nd+8yeoTwb99+/PjkSbfj8eN83qYPSCOTOTs7O3veEP69UkcegEIdMpPJCI6zz5/f9p9HPp9//97KMsTwLZO5o2Nh4RmrkHrpmxzHwsICzyLEWSq1IXd1TE6aWYNYSqVSqSRzHpOTDsdDliC2ksBQ4HA4zOxA6iURRJ7DccizAbE9fVpyNXhlXTkcjsNDHxMQKyGEWBV35Tg89Pl8rKTVUtHVoc/n89mYgPBK3686Dt8EIcQwMzOjKUTF+1XHMbG0tLT095s3y8vL77WCqHq/Ehy+Lsdybm9aC4irRKGrLkcut7cXiUTQIS1588jfPo/cXiQSibxGhtTpdyU4kCElyq/zXMdx9AwT0qI+j1zbEQwiQmyUX+fXXR0Fg0EXGsQK1dXRUTAYDIbRIJBdBYNhNIgFsqtgOBx2IkFguwqHQyEcSAu2q3AICwLcVSjEh1oYEPCuQgbix4A4obsK+QmPAwHtKhTy+3+gvEacsF2F/H5/wIAIAevK7/cHAhgQgPNuzzwCgcAiFgSoK3/bgQWhuUdJuwosYkGgu1pcnDdgQCju5wPmMY8CAeyqPY/5+To8BKErPAjY50fb8QIHAnIu6Z7HCxwI0Lmk24ECge8KB4LQ1YuNDYS3X4SuNjbGESAIXW2M40DAuxofH0c4ayF0hQNB6AoJAt8VDgShq/GdHQwIYFfteezMIkCgzrsiBwZkhPp+LulqFgXyB/X9XDoPFEgTviscCE99P+/+/PjlwIAQ6vu5dB4vX2JAALvaaTu8OBCoc0m7q5deHAjYuaQzD68fAwJ3Luk4vC4MyAh4V17vAwxIE7orr9fLY0AIdFde7xpBg8B09cuBCAHtyrvmxoLAdrXm/h0DUgfvas3tdvPQEBdCV2632+3eHgWFwL9ftR12+yYg5CfIfi7pyu3ettvtdkAI2B4lnYfdbndBQiD28wGO9XUwiAFmP5e8zu0CxGOFgrgQu1pf93hcUJA84HlX/DoXIDkoCNB+3r8rj8fjgYIA7ef9u4KGoHXl8XheAUKAzyXdXXlezcFBwM8lXV29moODoHY1BwfB7QoSgtoVIARuj+rXFTAEtCvxPJKPoCBm1K6SyZ9gx3jorrodc0kObh/B7CrJzQJCELviZA1EJsQAtp9LuwKFENA9SjwPbhoSYgbbzwVGl0PeQGT/gg5sP+/tipuFhRCkruQORD5kFPa8qzAsJb/Ehj3v/uqKM8NDSANmPxd11cD5fgS8K5Q/3yOE2L7l9vYWALpKPuI4jsP7M3DhB+JcovyBbmoeJ0K/K45oASG0u0py09pAND7v0oM0qe7nSU4zCKG7R2kJofw5yGsFcVLcz1UOROXztah2pSWE6vkqatUO0qS2n3McFyXaQYiP2h6l0qH6qYCU9nMuGmUBon6P4qLRh9pCrJS6UjsQ9Q+cXKKwR3HRaPQfrSGESlfRFaI5pK7284OKg8aDiyl0tcIEpKV4j6LooPIoaYParlZ4NiBE2X5+7fiXMAIh6rpaIcxAeDVdUXHQem78A/n7ecfRYAlCphXsURTnQfG/JJC/RwkO9iCy9yjBEWcNoqyrlTiTEPldxZmEKOgqHt9iDyL782MlHo9vsQeRtZ9fO5iDyNyjOg72IIq62tqaYg0ib4+6drAJkd3VFJMQBV1NTe2yC5HTFZOQO+9R3fPYZQ4iu6spwcEq5PY9StTV7m6WLYjtVFlXu9nsCDMQi9+ruKtsNptOp9N/WTWHmJ/I2s8l88im0+n0/v7+Qc6mHcSiZI8a4Dg4OFhdVXGnRjHks9I9StpVx7G6uvrpU8yJCHmudD+/cR6CIxaLxR5gQJT/3ufOjljMaDQ6ASHN18q+P5fRVcdhNBqNQ9tWAEhL+ffnCuZhNBqNQ0NDQ0N+qpCmyu85lTu+fEkkEnYLDcio6u/PFXbVcSQSiYTJ5FQFeU7le0518xAcJpPJNKMMUqL0/Tk1h2l4eHh4RB6kPkHlHvKA827HsS/bMXx+nvqtdUcItfvt9OcxfH6eSqVSqa8/boU06d2/AnR8LRaLN0Pq9O6339aVckfqa7FYLB7fBKF0DxlhHsXj42PjQEgIqqspCEehUBgA8dG5347S1fFxoVAo2PpCWrrqqlAoFE5OWn0gBr11VTg5Oan0gdC63w45j1Svo2KVQujdQ8bq6qRSqVQkkAlq95DxuqpUKmUJhNb9dsyuKpVyeVQC0WNX5XK52gOx6LKrcrlabYghE5Tut+N2VS5Xq3YxhNo9ZNyuqtXqhQhipXS/HburavVCDKkzvUcN7qp60QPZ1GtXFxc1EYTV/fwaMmgetV4Iu/v5jV3VarW6CML2fj64q1qt9mc3hPX9fPA8ape9ED3sUX3mcXl5KYboY4/q5xgTQdjfz/t31QvRb1djYz0QvXYlhbC/n/ftqgeinz1KMo8eiG72KKlDBNHPHtXbVT+ILrsaG7vqgei0q6ur770QfXZ19V2A/DcAHpmC7NcZ4/wAAAAASUVORK5CYII=\"","import React from \"react\";\n\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport Link from \"@mui/material/Link\";\n\n// Material Dashboard 2 PRO React base styles\nimport typography from \"../assets/theme/base/typography\";\nimport MDTypography from \"../components/MDTypography\";\nimport MDBox from '../components/MDBox';\n\nexport default function OthelloFooter({ ...props }) {\n const { } = props;\n\n const { size } = typography;\n\n\n var linkcookies = \"/condiciones/info?tipo=C\";\n var linkuso = \"/condiciones/info?tipo=U\";\n var linkcancelacion = \"/condiciones/info?tipo=D\";\n var linkprivacidad = \"/condiciones/info?tipo=P\";\n\n let links = [];\n\n /*var webtexto = \"\";\n\n if (modoVisualizacion == ModoVisualizacionesPay.Tienda)\n webtexto = \"Establecimiento\";\n else if (modoVisualizacion == ModoVisualizacionesPay.Hotel)\n webtexto = \"Hotel\";*/\n\n //links.push({ href: linkhotel, name: webtexto });\n links.push({ href: linkcancelacion, name: \"Politica de Cancelacion\" });\n links.push({ href: linkuso, name: \"Condiciones de Uso\" });\n links.push({ href: linkcookies, name: \"Politica Cookies\" }); \n links.push({ href: linkprivacidad, name: \"Politica de Privacidad\" });\n \n const renderLinks = () =>\n links.map((link) => (\n \n \n {link.name}\n \n \n \n ));\n\n return (\n \n ({\n display: \"flex\",\n flexWrap: \"wrap\",\n alignItems: \"center\",\n justifyContent: \"center\",\n listStyle: \"none\",\n mt: 3,\n mb: 0,\n p: 0,\n\n [breakpoints.up(\"lg\")]: {\n mt: 0,\n },\n })}\n >\n {renderLinks()}\n \n \n );\n}","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\n\n// @mui material components\nimport Avatar from \"@mui/material/Avatar\";\nimport { styled } from \"@mui/material/styles\";\n\nexport default styled(Avatar)(({ theme, ownerState }) => {\n const { palette, functions, typography, boxShadows } = theme;\n const { shadow, bgColor, size } = ownerState;\n\n const { gradients, transparent, white } = palette;\n const { pxToRem, linearGradient } = functions;\n const { size: fontSize, fontWeightRegular } = typography;\n\n // backgroundImage value\n const backgroundValue =\n bgColor === \"transparent\"\n ? transparent.main\n : linearGradient(gradients[bgColor].main, gradients[bgColor].state);\n\n // size value\n let sizeValue;\n\n switch (size) {\n case \"xs\":\n sizeValue = {\n width: pxToRem(24),\n height: pxToRem(24),\n fontSize: fontSize.xs,\n };\n break;\n case \"sm\":\n sizeValue = {\n width: pxToRem(36),\n height: pxToRem(36),\n fontSize: fontSize.sm,\n };\n break;\n case \"lg\":\n sizeValue = {\n width: pxToRem(58),\n height: pxToRem(58),\n fontSize: fontSize.sm,\n };\n break;\n case \"xl\":\n sizeValue = {\n width: pxToRem(74),\n height: pxToRem(74),\n fontSize: fontSize.md,\n };\n break;\n case \"xxl\":\n sizeValue = {\n width: pxToRem(110),\n height: pxToRem(110),\n fontSize: fontSize.md,\n };\n break;\n default: {\n sizeValue = {\n width: pxToRem(48),\n height: pxToRem(48),\n fontSize: fontSize.md,\n };\n }\n }\n\n return {\n background: backgroundValue,\n color: white.main,\n fontWeight: fontWeightRegular,\n boxShadow: boxShadows[shadow],\n ...sizeValue,\n };\n});\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\n\nimport React from \"react\";\n\nimport { forwardRef } from \"react\";\n\n// prop-types is a library for typechecking of props\nimport PropTypes from \"prop-types\";\n\n// Custom styles for MDAvatar\nimport MDAvatarRoot from \"./MDAvatarRoot\";\n\nconst MDAvatar = forwardRef(({ bgColor, size, shadow, ...rest }, ref) => (\n {instalacion.infoUso}
{instalacion.datosAdicionales}
\r\n \r\n onClickInstalacion(item)}>\r\n `${linearGradient(rgba(black.main, 0.25), rgba(black.main, 0.25))}, url(${item.image})` : \"\",\r\n backgroundSize: \"cover\",\r\n backgroundPosition: \"center\"\r\n }}>\r\n \r\n borderRadius.xl }}\r\n >\r\n {renderGetIcono(item.tipo)}\r\n \r\n \r\n \r\n {item.codigo}\r\n \r\n \r\n {item.descripcion}\r\n \r\n \r\n \r\n \r\n \r\n \r\n }\r\n\r\n function renderInstalaciones(dato) {\r\n\r\n let finales = dato != null && dato.instalaciones != null && dato.instalaciones.length > 0 ? dato.instalaciones.map(x => renderInstalacion(x)) : \"\";\r\n\r\n return finales;\r\n }\r\n\r\n function renderSeleccionFecha(i, diainicio) {\r\n let nuevafecha = new Date(diainicio);\r\n nuevafecha.setDate(nuevafecha.getDate() + i);\r\n\r\n let day = nuevafecha.toDateString();\r\n\r\n let abiertofecha = new Date(instalacion.abierto);\r\n let dayabiertofecha = abiertofecha.toDateString();\r\n\r\n let todosTramosCerrado = false;\r\n let diaentero = nuevafecha.getDay();\r\n let dialasemans = \"\";\r\n\r\n if (diaentero == 0)\r\n dialasemans = \"D\";\r\n else if (diaentero == 1)\r\n dialasemans = \"L\";\r\n else if (diaentero == 2)\r\n dialasemans = \"M\";\r\n else if (diaentero == 3)\r\n dialasemans = \"X\";\r\n else if (diaentero == 4)\r\n dialasemans = \"J\";\r\n else if (diaentero == 5)\r\n dialasemans = \"V\";\r\n else if (diaentero == 6)\r\n dialasemans = \"S\";\r\n\r\n if (instalacion != null && instalacion.diasTodosTramosCerrados != null && instalacion.diasTodosTramosCerrados.length > 0 && instalacion.diasTodosTramosCerrados.some(x => x == dialasemans))\r\n todosTramosCerrado = true;\r\n\r\n //Si estamos en una instalacion cualquiera o la fecha que estamos tratabdo es justo la del evento\r\n if ((instalacion.tipo != TiposInstalacionReserva.Evento && instalacion.tipo != TiposInstalacionReserva.Excursiones && !todosTramosCerrado) ||\r\n ((instalacion.tipo == TiposInstalacionReserva.Evento || instalacion.tipo == TiposInstalacionReserva.Excursiones) && dayabiertofecha == day && !todosTramosCerrado))\r\n {\r\n return \r\n onClickFechaReserva(day)}>\r\n \r\n \r\n \r\n today \r\n \r\n \r\n \r\n \r\n {GetDiaSemana(nuevafecha.getDay())}\r\n \r\n \r\n {nuevafecha.getDate()} {GetMes(nuevafecha.getMonth())} {nuevafecha.getUTCFullYear()}\r\n \r\n \r\n \r\n \r\n ; \r\n }\r\n else\r\n return \"\";\r\n }\r\n\r\n function renderSeleccionFechas() \r\n {\r\n var fechasfinal = [];\r\n\r\n if (instalacion != null) {\r\n for (var i = 0; i <= instalacion.diasAntelacion; i++) {\r\n\r\n let datafecha = renderSeleccionFecha(i, data.diaactual);\r\n\r\n if (datafecha != \"\")\r\n fechasfinal.push(datafecha);\r\n }\r\n }\r\n\r\n //version 1\r\n if (fechasfinal != null && fechasfinal.length > 0) {\r\n return \r\n {fechasfinal} \r\n ;\r\n }\r\n else {\r\n return \r\n \r\n No existen fechas disponibles\r\n \r\n ;\r\n }\r\n\r\n //version 2\r\n //return fechasfinal != null && fechasfinal.length > 0 ? fechasfinal : No existen fechas disponibles \r\n (shadow ? lg : \"none\") }} onClick={disable ? \"\" : () => onClickTramoReserva(item)}>\r\n x.id_Tramo == item.id_Tramo) ? \"dark\" : \"white\")}\r\n variant={/*color === \"white\" ? */\"contained\" /*: \"gradient\"*/}\r\n borderRadius=\"xl\"\r\n >\r\n \r\n \r\n {item.horainistring}-{item.horafinstring}\r\n \r\n \r\n \r\n \r\n x.id_Tramo == item.id_Tramo) ? \"white\" : \"dark\"}>\r\n \r\n {item.descripcion}\r\n \r\n \r\n \r\n \r\n \r\n x.id_Tramo == item.id_Tramo) ? \"white\" : \"text\"}\r\n fontWeight=\"regular\"\r\n fontSize={14}\r\n >\r\n {item.pax > 1 ? (item.cantidadDisponible < 0 ? 0 : item.cantidadDisponible) + \" plazas disponibles\" : \"\"}\r\n {infoprecio != \"\" ? <>*/}\r\n {/* onClickTramoReserva(item)}>Seleccionar */}\r\n {/* */}\r\n \r\n \r\n ;\r\n\r\n //return \r\n // \n // \n //
{item.descripcion} \n // \n // \n //
\n // {item.horainistring}-{item.horafinstring}
\n //
\n // {item.pax > 1 ? (item.cantidadDisponible < 0 ? 0 : item.cantidadDisponible) + \" plazas disponibles\" : \"\"} {infoprecio} \n //
\n //
onClickTramoReserva(item)}>Seleccionar \n //
\r\n // \r\n }\r\n \r\n function renderSelecionTramoGrafico(rowindex, colindex, item) {\r\n let res = \"\";\r\n let backColor = \"#ffffff\";\r\n\r\n if (item != null) {\r\n res = item.descripcion;\r\n backColor = item.cantidadDisponible <= 0 ? \"#f5427e\" : \"#42f56f\";\r\n\r\n if (tramo != null && tramo.some(x => x.id_Tramo == item.id_Tramo))\r\n backColor = \"#2abce8\"\r\n }\r\n\r\n return 0 ? () => onClickTramoReserva(item) : null}\r\n style={{\r\n marginBottom: 0.5,\r\n width: widthfilas, height: heightfilas, borderTop: item != null ? '1px solid gray' : \"\", borderLeft: item != null ? '1px solid gray' : \"\", borderRight: item != null ? '1px solid gray' : \"\", borderBottom: item != null ? '1px solid gray' : \"\", backgroundColor: backColor\r\n }}>\r\n {res} \r\n onClickTramoContinuar(tramo[0])}>Continuar Reserva \r\n : \"\"; \r\n\r\n //VISALIZACION GRAFICA\r\n if (InstalacionVisualiazacionGrafica()) {\r\n let finales = [];\r\n let linea = [];\r\n\r\n let rowfinal = 0;\r\n let colfinal = 0;\r\n\r\n tramosdispo.forEach(x => {\r\n if (x.row != null && x.row > rowfinal)\r\n rowfinal = x.row;\r\n\r\n if (x.col != null && x.col > colfinal)\r\n colfinal = x.col;\r\n });\r\n\r\n for (var row = 0; row <= rowfinal; row++) {\r\n linea = [];\r\n\r\n for (var col = 0; col <= colfinal; col++) {\r\n\r\n var data = tramosdispo.find(x => x.col == col && row == x.row);\r\n\r\n linea.push(renderSelecionTramoGrafico(row, col, data));\r\n }\r\n\r\n if (linea != null && linea.length > 0) {\r\n var maxwidth = (colfinal * widthfilas) + 30 + 100;\r\n finales.push({linea} );\r\n }\r\n }\r\n\r\n return \r\n {finales}\r\n {botonContinuar}\r\n ;\r\n }\r\n else {\r\n let final = tramosdispo.map(x => renderSelecionTramo(x));\r\n return \r\n {final} \r\n {botonContinuar}\r\n ;\r\n }\r\n }\r\n else {\r\n return \r\n \r\n No hay opciones disponibles\r\n \r\n ;\r\n }\r\n }\r\n else\r\n return \"\";\r\n //}\r\n //else\r\n // return \r\n // Obteniendo informacion, espere unos instantes\r\n // \r\n {/**/}\r\n {/* */}\r\n Plazas Reservar 1 \r\n \r\n \r\n \r\n {tramoselected.precioReducido > 0 ?\r\n \r\n : \"\"}\r\n {tramoselected.conPrecioCero == 1 ?\r\n \r\n : \"\"\r\n }\r\n \r\n {tramoselected.precioReducido > 0 || tramoselected.conPrecioCero == 1 ?\r\n \r\n \r\n Maximo de plazas disponibles {maxplaza}\r\n \r\n : \"\"}\r\n {tramoselected.infoprecios != null ? <>\r\n \r\n {tramoselected.infoPrecios}\r\n \r\n \r\n : \"\"}\r\n \r\n onClickPlazasReserva(maxplaza)}>Seleccionar \r\n \r\n {/* */}\r\n {/* */}\r\n \r\n ; \r\n }\r\n\r\n function renderPax(indexpax, tipo, opcionesActivas) {\r\n let idpax = tipo + \"_\" + indexpax + \"_\";\r\n\r\n let plazaname = \"\";\r\n\r\n if (tipo == 'E')\r\n plazaname = \"Plaza \";\r\n else if (tipo == 'R')\r\n plazaname = \"Reducida\";\r\n else if (tipo == 'G')\r\n plazaname = \"Gratuita\";\r\n\r\n plazaname = plazaname + (indexpax + 1);\r\n\r\n return <>\r\n \r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Apellidos) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.DNI) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Sexo) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Edad) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Telefono) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Email) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Club) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Direccion) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Procedencia) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.Talla) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n {opcionesActivas.indexOf(OpcionesNominaciones.NumRegistroSanitario) >= 0 ?\r\n\r\n \r\n : \"\"\r\n }\r\n \r\n \r\n \r\n {errornominacion != null && errornominacion != \"\" ? {errornominacion}
: \"\"}\r\n \r\n \r\n ;\r\n }\r\n\r\n function renderNominarPax() {\r\n\n let paxNomina = [];\n\n var indexpax = 0;\n\n if (plazas != null && plazas > 0) {\n for (var i = 0; i < plazas; i++) {\r\n paxNomina.push(renderPax(indexpax, \"E\", instalacion.opcionesNominacion));\n indexpax = indexpax + 1;\n }\n }\n\n if (plazasReducidas != null && plazasReducidas > 0) {\n for (var i = 0; i < plazasReducidas; i++) {\r\n paxNomina.push(renderPax(indexpax, \"R\", instalacion.opcionesNominacion));\n indexpax = indexpax + 1;\n }\n }\n\n if (plazasGratuitas != null && plazasGratuitas > 0) {\n for (var i = 0; i < plazasGratuitas; i++) {\r\n paxNomina.push(renderPax(indexpax, \"G\", instalacion.opcionesNominacion));\n indexpax = indexpax + 1;\n }\n }\n\n return \r\n \r\n \r\n \r\n \r\n \r\n ;\n\n //return \r\n \n \n \r\n Resumen Reserva\r\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {instalacion.latstring != \"0\" && instalacion.lonstring != \"0\" ?\n Ver en Mapa \n : \"\"\n }\n \n \n \n \n \n \n {TotalPrecio > 0 ?\n \n \n \r\n Precio Reserva\r\n \n
{TotalPrecio} Euros \n : \"\"\r\n }\r\n \r\n ;\r\n }\r\n\r\n function renderPagarReserva(user, pago) {\n let formulariopago = \"\";\n\n \n let pagocontado = \"\";\n\n if (pago != null) {\n if (user.id_Rol == Roles.SuperUsuario || user.id_Rol == Roles.Administrador) {\n pagocontado =\n \n Pago Contado \n \n } {/*component={Link} to={pago.urlokcontado}*/ }\n\n //Si estamos con Paygold\n if (pago.driver == \"RedSys\") {\n formulariopago = ({formulariopago} {pagocontado} ;\r\n }\r\n\r\n function renderPasosReserva() {\r\n let paso1 = \"\";\r\n let paso2 = \"\";\r\n let paso3 = \"\";\r\n let paso4 = \"\";\r\n let paso5 = \"\";\r\n let paso6 = \"\";\r\n let paso7 = \"\";\r\n\r\n if (paso >= 1) {\r\n paso1 =\r\n \r\n {getTituloPaso(1, paso)}\r\n {paso == 1 ? renderInstalaciones( data) : \"\"}\r\n \r\n }\r\n\r\n if (paso >= 2) {\r\n paso2 = \r\n {getTituloPaso(2, paso, instalacion.descripcion)}\r\n {paso == 2 ? Volver Volver \r\n }\r\n\r\n if (paso >= 3) {\r\n paso3 = \r\n {getTituloPaso(3, paso, fecha)}\r\n {paso == 3 ? Volver Volver \r\n }\r\n\r\n if (paso >= 4 && InstalacionTieneSeleccionPax()) {\r\n paso4 = \r\n {getTituloPaso(4, paso)}\r\n {paso == 4 ? Volver Volver \r\n }\r\n\r\n if (paso >= 5 && instalacion != null && instalacion.nominarPax == 1) {\r\n\r\n paso5 = \r\n {getTituloPaso(5, paso)}\r\n {paso == 5 ? Volver Volver \r\n }\r\n\r\n if (paso >= 6) {\r\n paso6 = \r\n {getTituloPaso(6, paso)}\r\n {paso == 6 ? renderDatosReserva( props.user) : \"\"}\r\n \r\n }\r\n\r\n if (paso >= 7) {\r\n paso7 = \r\n {getTituloPaso(7, paso)}\r\n Pulse el boton de Realizar el pago y asi completar su reserva
\r\n ATENCION! Las reservas sin pagar seran canceladas automaticamente en el caso de no realizarse el pago.
\r\n {renderPagarReserva(props.user, infopago)} : \"\"}\r\n \r\n }\r\n\r\n return (\r\n \r\n {data != null && data.imagebannerreservas != null && data.imagebannerreservas != \"\" ?\n \n
\n : \"\"\r\n }\r\n {paso1}\r\n {paso2}\r\n {paso3}\r\n {paso4}\r\n {paso5}\r\n {paso6}\r\n {paso7}\r\n \r\n );\r\n }\r\n\r\n\r\n let formulario = loading ?
\r\n : renderPasosReserva(this)\r\n\r\n let alerta = alert != null ? \r\n \n {alerta}\n \r\n {formulario}\r\n \r\n \r\n \r\n}\r\n\r\n//propTypes = {\n// user: PropTypes.object, \n// onResultReserva: PropTypes.object\n//};","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// @mui/icons-material\nimport Face from \"@mui/icons-material/Face\";\nimport Assignment from \"@mui/icons-material/Ballot\";\nimport Dns from \"@mui/icons-material/Dns\";\nimport SettingsRemote from \"@mui/icons-material/SettingsRemote\";\nimport Visibility from \"@mui/icons-material/Visibility\";\nimport Activacion from \"@mui/icons-material/TouchApp\";\nimport Close from \"@mui/icons-material/Close\";\nimport Email from \"@mui/icons-material/Email\";\nimport Payment from \"@mui/icons-material/Payment\";\n\n// core components\nimport Grid from \"@mui/material/Grid\";\n\nimport OthelloBotonera from '../componentsothello/OthelloBotonera.jsx';\r\nimport { DataStatePage, OpcionSiNoChar, RolesUsuarios, ModoAreasPoi, ModoAreaPoi, TipoOthelloFieldGrid, PopUpResult, Roles, DataStateModal, MessageOthelloBoxButtons, ModoModal, EstadoReserva, EstadosReserva, ResultadoReserva, FiltroVerReservas, OpcionSiNo, OpcionSiNoEntero, OpcionVisibilidadReservas, ModoReport } from \"../othelloConstantes.jsx\";\r\nimport OthelloGrid from '../componentsothello/OthelloGrid.jsx';\r\nimport OthelloEdit from '../componentsothello/OthelloEdit.jsx';\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\n\nimport NavPills from \"../components/NavPills.jsx\";\nimport Button from \"../components/Button.jsx\";\nimport ImageUpload from \"../components/ImageUpload.jsx\";\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\nimport OthelloModalBase from '../componentsothello/OthelloModalBase.jsx';\n\nimport OthelloTitulo from '../componentsothello/OthelloTitulo.jsx';\n\nimport { ImprimirListado } from '../othelloFunciones.jsx';\n\nimport avatar from \"../assets/img/default-avatar.png\";\nimport Divider from \"@mui/material/Divider\";\n\r\nimport Reservar from './Reservar.js';\r\nimport Card from \"@mui/material/Card\";\r\nimport OthelloPrimary from '../componentsothello/OthelloPrimary.jsx';\r\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\r\n\r\n\r\n\nexport default function Perfil({ ...props }) {\r\n const { literal, idRol, tipooficina, loginmodoreserva, loginapps, idUser } = props;\n\r\n const { search } = useLocation();\n\n const [loading, setLoading] = React.useState(true);\n const [loadingOficinas, setloadingOficinas] = React.useState(true);\n const [loadingArchivos, setloadingArchivos] = React.useState(true);\n const [loadingAccesosAreasPois, setloadingAccesosAreasPois] = React.useState(true);\n const [loadingRservas, setloadingRservas] = React.useState(true);\n\n const [id_usuario, setid_usuario] = React.useState(0);\n const [statePageOficina, setstatePageOficina] = React.useState(DataStatePage.dsSearch);\n const [statePageArchivos, setstatePageArchivos] = React.useState(DataStatePage.dsSearch);\n\n const [datausuario, setdatausuario] = React.useState(null);\n const [dataoficinas, setdataoficinas] = React.useState(null);\n const [dataAccesosAreasPois, setdataAccesosAreasPois] = React.useState([]);\n const [dataArchivos, setdataArchivos] = React.useState([]);\n const [dataReservas, setdataReservas] = React.useState([]);\n const [stateModal, setstateModal] = React.useState(DataStateModal.dsClosed);\n const [itemmodal, setitemmodal] = React.useState(null);\n const [modomodal, setmodomodal] = React.useState(null);\n\n const [oficinas, setoficinas] = React.useState([]);\n const [areas, setareas] = React.useState([]);\n const [pois, setpois] = React.useState([]);\n\n const [filtroreserva, setfiltroreserva] = React.useState(0);\n const [filtrofranja, setfiltrofranja] = React.useState(0);\n\n const [filtroestado, setfiltroestado] = React.useState(EstadoReserva.Confirmada);\n\n const [dataeditandoOficina, setdataeditandoOficina] = useState(null);\r\n const [indexeditandoOficina, setindexeditandoOficina] = useState(null);\n\n const [dataeditandoArchivo, setdataeditandoArchivo] = useState(null);\r\n const [indexeditandoArchivo, setindexeditandoArchivo] = useState(null);\n\n const [alert, setalert] = React.useState(null);\n const [erroralert, seterroralert] = React.useState(null);\n\n React.useEffect(() => {\n\n let url = search;\r\n\n let params = new URLSearchParams(url);\n let idselected = params.get('id');\n\n if (idselected == null || idselected == 0)\n idselected = idUser;\n\n let SuperUsuario = idRol == Roles.SuperUsuario || idRol == Roles.Administrador;\n \r\n let finalvisua = SuperUsuario ? 0 : \"1\";\r\n let finalfranja = 0\r\n let finalestado = EstadoReserva.Confirmada; \n\n getDataPage(idselected);\n getDataPageOficinas();\r\n getDataPageArchivos();\r\n getDataPageReservas(idselected, finalvisua, finalfranja, finalestado);\n\n }, [loading]);\n\r\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n //Metodo asociados al Usuario\r\n\r\n const getDataPage = (idselected) => {\r\n\r\n var jsonData = JSON.stringify(idselected);\r\n\r\n fetch('api/Data/GetUsuario', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdatausuario(res);\r\n setid_usuario(res.id_Usuario);\r\n setLoading(false);\r\n }).catch(error => {\r\n setdatausuario(null);\r\n setid_usuario(0); \r\n });\r\n }\r\n\r\n const getDataVacia = () => {\r\n\r\n fetch('api/Data/GetUsuarioVacio')\r\n .then(response => response.json())\r\n .then(data => {\r\n setdatausuario(data);\r\n setid_usuario(data.id_Usuario); \r\n }).catch(error => {\r\n setdatausuario(null);\r\n setid_usuario(0); \r\n });;\r\n }\r\n\r\n const grabarDataPage = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formusuario');\r\n let formData = new FormData(formulario);\r\n\r\n fetch('api/Data/GrabarUsuario', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(data => {\r\n if (data != null) {\r\n\r\n if (data.id_Usuario > 0) {\r\n setdatausuario(data);\r\n setid_usuario(data.id_Usuario);\r\n setalert(PopUpResult.OK); \r\n }\r\n //no se grabo, pass -- repetir pass\r\n else\r\n setalert(PopUpResult.KO);\r\n }\r\n else\r\n setalert(PopUpResult.KO);\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const actualizarCodigoCliente = (event) => {\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formactivacion');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(refs.form);\r\n\r\n fetch('api/Data/ActualizaCodigoClienteUsuario', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n setalert(PopUpResult.OK);\r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const grabarPassDataPage = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formusuario');\r\n let formData = new FormData(formulario);\r\n\r\n fetch('api/Data/GuardarNuevaPass', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(data => {\r\n if (data != null && data)\r\n setalert(PopUpResult.OK);\r\n else\r\n setalert(PopUpResult.KO);\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const deshacerDataPage = () => {\r\n \r\n getDataPage(id_usuario);\r\n }\r\n\r\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n seterroralert(null);\r\n }\r\n\r\n const othelloModalResul = (modo, result, valor) =>\r\n {\r\n setalert(null);\r\n seterroralert(null);\r\n setstateModal(DataStateModal.dsClosed);\r\n setitemmodal(null);\r\n setmodomodal(null);\r\n }\r\n\r\n const OnResultReserva = (res, retorno) => {\r\n let error = \"\";\r\n\r\n if (res != PopUpResult.OK) {\r\n if (retorno == ResultadoReserva.OK || ResultadoReserva.OkAFaltaDePago)\r\n error = \"\";\r\n else if (retorno == ResultadoReserva.SinDisponibilidad)\r\n error = \"No hay disponibilidad para los parametros indicados, disculpe las molestias\";\r\n else if (retorno == ResultadoReserva.UsuarioMaxTramosDia)\r\n error = \"No puede realizar mas reservas para dicha dia en la instalacion indicada\";\r\n else\r\n error = retorno;\r\n\r\n setalert(res);\r\n seterroralert(error);\r\n }\r\n else {\r\n setalert(res);\r\n seterroralert(error);\r\n setdataReservas(null);\r\n }\r\n }\r\n\r\n const onclickColumna = (valor, field) => {\n\n if (field == \"btruta\") {\n if (valor != null && valor.ruta != null && valor.ruta != '') {\n window.open(valor.ruta, '_blank');\r\n }\n }\n else if (field == \"ver\") {\n setstateModal(DataStateModal.dsOpen);\n setitemmodal(valor);\r\n setmodomodal(field);\n }\n else if (field == \"pagar\")\n actualizarPagadaConfirmadadReserva(valor);\n else if (field == \"email\")\n EnviarMailReserva(valor);\n else if (field == \"delete\")\n deleteGridDataReservas(valor);\n\n }\r\n\r\n //Metodo asociados a los acceso a oficinas del usuario\r\n\r\n const getDataPageOficinas = () => {\r\n\r\n fetch('api/Data/GetOficinasVirtual')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let resoficinas = data.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Oficina,\r\n name: x.nombreOficina\r\n };\r\n\r\n return val;\r\n\r\n })\r\n\r\n setoficinas(resoficinas);\r\n });\r\n\r\n\r\n var jsonData = JSON.stringify(id_usuario);\r\n\r\n fetch('api/Data/GetAccesoOficinas', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdataoficinas(res);\r\n setloadingOficinas(false);\r\n }).catch(error =>\r\n {\r\n setdataoficinas(null);\r\n setloadingOficinas(true); \r\n });\r\n }\r\n\r\n const getDataVaciaOficina =() => {\r\n\r\n var jsonData = JSON.stringify(datausuario.id_Usuario);\r\n\r\n fetch('api/Data/GetAccesoOficinaVacio', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(data =>\r\n {\r\n setdataeditandoOficina(data);\r\n \r\n setstatePageOficina(DataStatePage.dsInsert);\r\n setdataAccesosAreasPois([]);\r\n setloadingAccesosAreasPois(true);\r\n setareas([]);\r\n setpois([]);\r\n \r\n }).catch(error => {\r\n setdataeditandoOficina(null);\r\n });\r\n }\r\n\r\n const grabarDataPageOficina = (event) => {\r\n\r\n //Altero el valor que tiene el input de dias visualizando\r\n try {\r\n if (oficinas != null && indexeditandoOficina == -1) {\r\n // var item = oficinas.find(x => x.id_Oficina == refs.form[3].value);\r\n\r\n //if (item != null)\r\n // refs.form[2].value = item.nombreOficina;\r\n }\r\n }\r\n catch { }\r\n\r\n //Obtengo los datos\r\n //const data = new FormData(refs.form);\r\n let formulario = document.getElementById('formaccesoficina');\r\n let formData = new FormData(formulario);\r\n\r\n\r\n fetch('api/Data/GrabaAccesoOficina', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (res != null) {\r\n if (oficinas != null) {\r\n var item = oficinas.find(x => x.id_Oficina == res.id_Oficina);\r\n\r\n if (item != null)\r\n res.nomOficina = item.nombreOficina;\r\n }\r\n\r\n if (indexeditandoOficina == -1) {\r\n\r\n var array = [...dataoficinas];\r\n array.push(res);\r\n setdataoficinas(array);\r\n }\r\n else {\r\n var array = [...dataoficinas];\r\n array[indexeditandoOficina] = res;\r\n setdataoficinas(array);\r\n }\r\n\r\n setdataeditandoOficina(null);\r\n setindexeditandoOficina(null);\r\n setstatePageOficina(DataStatePage.dsSearch);\r\n }\r\n\r\n }).catch(error => {\r\n //setState({ submitted: true, error: 2 });\r\n });\r\n }\r\n\r\n const nuevoDataPageOficina = () => {\r\n //LLama a obtener el idioma vacio, que es el que pondra el estado\r\n getDataVaciaOficina();\r\n setindexeditandoOficina(-1);\r\n }\r\n\r\n const cancelarDataPageOficina = () => {\r\n setdataeditandoOficina(null);\r\n setindexeditandoOficina(null);\r\n setstatePageOficina(DataStatePage.dsSearch);\r\n setdataAccesosAreasPois([]);\r\n setloadingAccesosAreasPois(true);\r\n setareas([]);\r\n setpois([]);\r\n }\r\n\r\n const deshacerDataPageOficina = () =>\r\n {\r\n //Si el que estabamos editando era uno nuevo al deshacer nos vamos a la de buqueda\r\n if (indexeditandoOficina == -1)\r\n setstatePageOficina(DataStatePage.dsSearch);\r\n //Sino, es que estabamos en un item valido\r\n //else\r\n // forceUpdate()\r\n }\r\n\r\n //Metodos asociados a los archivos del usuario\r\n\r\n const getDataPageArchivos = () => {\r\n\r\n var jsonData = JSON.stringify(id_usuario);\r\n\r\n fetch('api/Data/GetMisArchivos', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdataArchivos(res);\r\n setloadingArchivos(false);\r\n }).catch(error => {\r\n setdataArchivos(null);\r\n setloadingArchivos(true);\r\n });\r\n }\r\n\r\n const getDataVacioArchivo = () => {\r\n\r\n var jsonData = JSON.stringify(datausuario.id_Usuario);\r\n\r\n fetch('api/Data/GetArchivoVacio', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(data => {\r\n setdataeditandoArchivo(data);\r\n setstatePageArchivos(DataStatePage.dsInsert);\r\n \r\n }).catch(error => {\r\n setdataeditandoArchivo(null);\r\n });\r\n }\r\n\r\n const grabarDataPageArchivos = (event) => {\r\n\r\n //Obtengo los datos\r\n let formulario = document.getElementById('formarchivo');\r\n let formData = new FormData(formulario);\r\n //const data = new FormData(refs.form);\r\n\r\n fetch('api/Data/GrabarMiArchivo', {\n method: 'POST',\n body: formData,\n\n }).then(response => response.json()).then(res => {\r\n\r\n let dataArchivosfinal = dataArchivos;\r\n\r\n if (dataArchivosfinal == null)\r\n dataArchivosfinal = [];\r\n\r\n if (indexeditandoArchivo == -1) {\r\n\r\n var array = [...dataArchivosfinal];\r\n array.push(res);\r\n setdataArchivos(array);\r\n }\r\n else {\r\n var array = [...dataArchivosfinal];\r\n array[indexeditandoArchivo] = res;\r\n setdataArchivos(array);\r\n }\r\n\r\n setdataeditandoArchivo(null);\r\n setindexeditandoArchivo(null);\r\n setstatePageArchivos(DataStatePage.dsSearch);\r\n \r\n setalert(PopUpResult.OK);\r\n\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n const nuevoDataPageArchivo = () => {\r\n\r\n getDataVacioArchivo();\r\n setindexeditandoArchivo(-1);\r\n }\r\n\r\n const cancelarDataPageArchivos = () => {\r\n setdataeditandoArchivo(null);\r\n setindexeditandoArchivo(null);\r\n setstatePageArchivos(DataStatePage.dsSearch);\r\n }\r\n\r\n //Metodos asociados a los archivos del usuario\r\n\r\n const getDataPageReservas = (id_usu, filtrores, filtrofran, filtroest) => {\r\n\r\n var jsonData = JSON.stringify({ id_usuario: id_usu, visualizareserva: filtrores, franja: filtrofran, estado: filtroest });\r\n\r\n fetch('api/Data/GetMisReserva', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setdataReservas(res);\r\n setloadingRservas(false);\r\n }).catch(error => {\r\n setdataReservas(null);\r\n setloadingRservas(true); \r\n });\r\n }\r\n\r\n const onClickBuscarReservas = () => {\r\n\r\n let SuperUsuario = idRol == Roles.SuperUsuario || idRol == Roles.Administrador;\n\r\n //Por defecto ponemos los de un usuario\r\n let finalvisua = \"1\";\r\n let finalfranja = 0\r\n let finalestado = EstadoReserva.Confirmada;\r\n \r\n if (SuperUsuario)\r\n {\r\n let visua = document.getElementById('visualizareserva');\r\n let franja = document.getElementById('franja');\r\n let estado = document.getElementById('estado');\r\n\r\n finalvisua = visua != null && visua.value != null ? visua.value : \"1\";\r\n finalfranja = franja != null && franja.value != null ? franja.value : 0\r\n finalestado = estado != null && estado.value != null ? estado.value : EstadoReserva.Confirmada\r\n } \r\n\r\n setfiltroreserva(finalvisua);\r\n setfiltrofranja(finalfranja);\r\n setfiltroestado(finalestado);\r\n\r\n //LLamo a montar los relojes de realizar de nuevo la busqueda\r\n setloadingRservas(false);\r\n\r\n //LLamamos a obtener los datos de la pagina\r\n getDataPageReservas(id_usuario, finalvisua, finalfranja, finalestado );\r\n }\r\n \r\n const onClickImprimirReservas = () =>\r\n {\r\n let visua = document.getElementById('visualizareserva');\r\n let franja = document.getElementById('franja');\r\n\r\n let visuafin = visua != null && visua.value != null ? visua.value : \"1\";\r\n let franjafin = franja != null && franja.value != null ? franja.value : 0;\r\n\r\n var dataFinalPrint = { id_usuario: id_usuario, visualizareserva: visuafin, franja: franjafin };\r\n\r\n ImprimirListado(ModoReport.Preview, \"ListadoReserva\", dataFinalPrint, \"api/DataListados/GetListadoReservas\", callbackEnvioListadoMail);\r\n }\r\n\r\n const callbackEnvioListadoMail = (data) => {\r\n\r\n if (data != null) {\r\n\r\n }\r\n }\r\n\r\n //METODO SOBRE EL GRID DE ACCESO A OFICINAS\r\n const editGridDataPageOficina = (valor, index) => {\r\n\r\n if (valor.modoAreaPoi != ModoAreaPoi.Total) {\r\n setdataeditandoOficina(valor);\r\n indexeditandoOficina(index);\r\n\r\n var jsonData = JSON.stringify(valor.id_Oficina);\r\n\r\n if (valor.modoAreaPoi == ModoAreaPoi.ModoArea) {\r\n\r\n fetch('api/Data/GetAreasOficina', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n let resareas = res.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Area,\r\n name: x.cod_Area\r\n };\r\n\r\n return val;\r\n\r\n });\r\n\r\n setareas(resareas);\r\n\r\n }).catch(error => {\r\n setareas(null); \r\n });\r\n }\r\n else {\r\n\r\n fetch('api/Data/GetPoisOficina', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n let respois = res.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Poi,\r\n name: x.title\r\n };\r\n\r\n return val;\r\n\r\n });\r\n\r\n setpois(respois);\r\n\r\n }).catch(error => {\r\n setpois(null);\r\n });\r\n }\r\n\r\n\r\n var jsonData = JSON.stringify(valor.id_UsuarioOV);\r\n\r\n fetch('api/Data/GetAccesoPoisAreas', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n setdataAccesosAreasPois(res);\r\n setstatePageOficina(DataStatePage.dsEdit);\r\n setloadingAccesosAreasPois(false);\r\n\r\n }).catch(error => {\r\n setdataAccesosAreasPois([]); \r\n setloadingAccesosAreasPois(true); \r\n });\r\n\r\n\r\n setstatePageOficina(DataStatePage.dsEdit);\r\n }\r\n }\r\n\r\n const deleteGridDataPageOficina = (valor, index) => {\r\n\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_UsuarioOV);\r\n\r\n fetch('api/Data/EliminarAccesoOficina', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res)\r\n {\r\n //Si todo salie correcto limpio los valores de edicion\r\n setdataeditandoOficina( valor);\r\n setindexeditandoOficina(index);\r\n\r\n if (dataoficinas != null) {\r\n var array = [...dataoficinas]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n setdataoficinas(array);\r\n setalert(PopUpResult.OK);\r\n } \r\n }\r\n }).catch(error => {\r\n\r\n });\r\n }\r\n }\r\n\r\n //METODO SOBRE ACCESO AREAS POIS\r\n\r\n const grabarDataAccesosAreasPois = (event) => {\r\n\r\n let formulario = document.getElementById('formaaccesopoisareas');\r\n let data = new FormData(formulario); \r\n\r\n fetch('api/Data/GrabarAccesoPoisAreas', {\n method: 'POST',\n body: data,\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (res != null) {\r\n if (res.modoAreaPoi == ModoAreaPoi.ModoArea) {\r\n if (areas != null) {\r\n var item = areas.find(x => x.id_Area == res.id_PoiArea);\r\n\r\n if (item != null)\r\n res.nomAreaPoi = item.cod_Area;\r\n }\r\n }\r\n else if (res.modoAreaPoi == ModoAreaPoi.ModoPoi) {\r\n if (pois != null) {\r\n var item = pois.find(x => x.id_Poi == res.id_PoiArea);\r\n\r\n if (item != null)\r\n res.nomAreaPoi = item.title;\r\n }\r\n }\r\n\r\n var array = [...dataAccesosAreasPois]; // make a separate copy of the array\r\n\r\n //a�ado el valor\r\n array.push(res);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setdataAccesosAreasPois(array);\r\n }\r\n }).catch(error => {\r\n //setState({ submitted: true, error: 2 });\r\n });\r\n }\r\n\r\n const deleteGridDataAccesosAreasPois = (valor, index) =>\r\n {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify({ usuarioOVSeleccionado: valor.id_UsuarioOV, idPoiAreaSeleccionado: valor.id_PoiArea });\r\n\r\n fetch('api/Data/EliminarAccesosPoisAreas', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n if (dataAccesosAreasPois != null) {\r\n var array = [...dataAccesosAreasPois]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setdataAccesosAreasPois(array);\r\n\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n\r\n }\r\n\r\n //METOSO SOBRE EL GRID DE ARCHIVOS\r\n const deleteGridDataArchivo = (valor, index) => {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify(valor.id_MiArchivo);\r\n\r\n fetch('api/Data/EliminarMiArchivo', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n if (dataArchivos != null) {\r\n var array = [...dataArchivos]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setdataArchivos(array);\r\n\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\r\n\r\n //METOSO SOBRE EL GRID DE RESERVAS\r\n const deleteGridDataReservas = (valor, index) =>{\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify({ Id_Oficina: valor.id_Oficina, Id_Usuario: valor.id_Usuario, localizador: valor.localizador });\r\n\r\n fetch('api/Data/EliminarReservaLocalizador', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res) {\r\n\r\n if (dataReservas != null) {\r\n var array = [...dataReservas]; // make a separate copy of the array\r\n\r\n //Elimino el de index concreto\r\n array.splice(index, 1);\r\n\r\n //Modificao el estado de data para que refresque la pantalla\r\n setdataReservas(array);\r\n\r\n setalert(PopUpResult.OK);\r\n }\r\n }\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\r\n\r\n const actualizarPagadaConfirmadadReserva = (valor, index) =>\r\n {\r\n\r\n if (valor != null) {\r\n if (valor.estado == EstadoReserva.Cancelada || valor.estado == \"Cancelada\") {\r\n var jsonData = JSON.stringify({ Id_Oficina: valor.id_Oficina, Id_Usuario: valor.id_Usuario, localizador: valor.localizador });\r\n\r\n fetch('api/Data/ActualizarPagadaConfirmadaReservaLocalizador', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n setalert(res ? PopUpResult.OK : PopUpResult.KO);\r\n\r\n if (res)\r\n onClickBuscarReservas();\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\r\n }\r\n\r\n const EnviarMailReserva = (valor, index) =>\r\n {\r\n\r\n if (valor != null) {\r\n var jsonData = JSON.stringify({ Id_Oficina: valor.id_Oficina, Id_Usuario: valor.id_Usuario, localizador: valor.localizador });\r\n\r\n fetch('api/Data/EnviarMailReserva', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n setalert(res ? PopUpResult.OK : PopUpResult.KO);\r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n });\r\n }\r\n }\r\n\r\n //METODOS DE RENDERIZADO DE LA PANTALLA\n\r\n //Metodos render Usuario\r\n\r\n function renderFormUsuario( user) {\r\n\r\n if (user != null) {\r\n return (\n \n \n \n \n \n \n \n \n \n \r\n \r\n \r\n );\r\n }\r\n else\r\n return \"\";\r\n }\r\n\r\n function renderActivacionCliente( user) {\r\n\r\n return (\n \n \n \n \n \n \n \n \n \n \r\n \r\n \r\n );\r\n }\r\n\n //Metodos render de acceso a oficinas del usuario\n\n function renderOpcionesAccesosAreasPois( acceso, accesosAreasPois) {\n\r\n let busquedaAccesos = renderSearchAccesosAreasPois( accesosAreasPois);\n\n //let edicionOficinas = statePageOficina == DataStatePage.dsEdit || statePageOficina == DataStatePage.dsInsert ? renderInsertEditOficinas( dataeditandoOficina) : \"\";\n\n return (\n \n \n
\n
\n
Accesos Definidos \n
\n \n \n \n {busquedaAccesos}\n \n \n
\n \n );\n }\n\n function renderSearchAccesosAreasPois( accesos) {\n\r\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"Accesos\"];\r\n let valoreshow = [\"nomAreaPoi\"];\r\n\r\n //Creamos el grid global \r\n return (\n \n \n {edicionOficinas}\n \n \r\n \r\n \n \n \n \n {busquedaOficinas}\n \n \n
\n );\n }\n\n function renderSearchOficinas( oficinas) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"Oficina\", \"Tipo Acceso\", \"Gestion Reservas\", \"Gestion Encuestas\"];\r\n let valoreshow = [\"nomOficina\", \"modoAreaPoi\", \"gestionReservas\", \"gestionEncuestas\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"modoAreaPoi\", items: ModoAreasPoi });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"gestionReservas\", items: OpcionSiNo });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"gestionEncuestas\", items: OpcionSiNo });\r\n\r\n //Creamos el grid global \r\n return (\n \n {\n \n \n {\n acceso != null && acceso.id_UsuarioOV > 0 ? Volver :\n \n \n }\n \r\n \n \n {accesosAreasPois}\n \n \n
\n \r\n );\n }\n else\n return \"\";\n }\r\n\r\n //Render acceso a archivos del usuario\r\n function renderOpcionesArchivos(archivos)\r\n {\r\n let busquedaArchivos = renderSearchArchivos( archivos);\n\n let edicionArchivos = statePageArchivos == DataStatePage.dsEdit || statePageArchivos == DataStatePage.dsInsert ? renderInsertEditArchivo( dataeditandoArchivo) : \"\";\n\n //#99d9b7\n return (\n \n \n {edicionArchivos}\n \n \n \n \n \r\n \n \n \n {\n idRol == Roles.SuperUsuario || idRol == Roles.Administrador ?\n \n : \"\"\n }\n \n {busquedaArchivos}\n \n \n
\n );\r\n }\r\n\r\n function renderSearchArchivos( datos) {\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = [\"\", \"Descripcion\"];\r\n\r\n let valoreshow = [\"btruta\", \"descripcion\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"btruta\", icon: Visibility, onclick: onclickColumna });\r\n\r\n let deleteEvento = idRol == Roles.SuperUsuario || idRol == Roles.Administrador ? deleteGridDataArchivo : null;\r\n\r\n //Creamos el grid global \r\n return (\n \n \n \n \n \r\n \r\n );\n }\n else\n return \"\";\n }\r\n\r\n //Render de las reservas que tiene el usuario activas\r\n\r\n function renderSearchReservas( datos) {\r\n //Generamos los valores de cada una de las lineas de grid\r\n let cabeceros = (idRol == Roles.SuperUsuario || idRol == Roles.Administrador) ?\r\n [\"\", \"\", \"\", \"\", \"Fecha\", \"Reserva\", \"Instalacion\", \"Tramo\", \"Plazas\", \"Precio\", \"Pagada\", \"Estado\", \"Socio\"] :\r\n [\"\", \"\", \"Fecha\", \"Reserva\", \"Instalacion\", \"Tramo\", \"Plazas\", \"Precio\", \"Pagada\", \"Estado\", \"Socio\"];\r\n\r\n let valoreshow = (idRol == Roles.SuperUsuario || idRol == Roles.Administrador) ?\r\n [\"ver\", \"delete\", \"email\", \"pagar\", \"fechastring\", \"localizador\", \"instalacion\", \"tramo\", \"cantidad\", \"precio\", \"pagada\", \"estado\", \"numSocio\"] :\r\n [\"ver\", \"delete\", \"fechastring\", \"localizador\", \"instalacion\", \"tramo\", \"cantidad\", \"precio\", \"pagada\", \"estado\", \"numSocio\"];\r\n\r\n let datasourceFields = [];\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"ver\", icon: Visibility, onclick: onclickColumna });\r\n\r\n if (idRol == Roles.SuperUsuario || idRol == Roles.Administrador) {\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"pagar\", icon: Payment, onclick: onclickColumna, color: \"facebook\" });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"email\", icon: Email, onclick: onclickColumna, color: \"facebook\" });\r\n }\r\n\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloButton, fieldname: \"delete\", icon: Close, color: \"error\", onclick: onclickColumna });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"estado\", items: EstadosReserva });\r\n datasourceFields.push({ tipofield: TipoOthelloFieldGrid.OthelloComboBox, fieldname: \"pagada\", items: OpcionSiNoEntero });\r\n\r\n //Creamos el grid global \r\n\r\n //\n //
\r\n return ();\r\n }\r\n\r\n function renderModalMasInfoReserva( item) {\r\n if (item != null) {\r\n let nomiacion = \"\";\r\n\r\n if (item.dataNominacionResult != null && item.dataNominacionResult.length > 0) {\r\n let resnomiacion = item.dataNominacionResult.map(x =>\r\n \n {x.nombre != null && x.nombre != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.apellidos != null && x.apellidos != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.dni != null && x.dni != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.sexo != null && x.sexo != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.edad != null && x.edad != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.telefono != null && x.telefono != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.email != null && x.email != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.club != null && x.club != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.direccion != null && x.direccion != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.procedencia != null && x.procedencia != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.talla != null && x.talla != \"\" ?\r\n \r\n : \"\"\r\n }\r\n {x.numRegistroSanitario != null && x.numRegistroSanitario != \"\" ?\r\n \r\n : \"\"\r\n }\n \r\n );\r\n\r\n if (resnomiacion != null && resnomiacion != \"\") {\r\n nomiacion = (<>\n \n Datos del Formulario \n \r\n {resnomiacion}\r\n );\r\n }\r\n }\r\n\r\n return (\r\n Resumen Reserva \n \n \n \n \n \n \n \n \n \n \n \r\n \n \n \r\n \n \r\n \r\n \r\n \r\n \r\n \r\n {item.precio > 0 ?\n <>\n \n \n Precio Reserva
{item.precio} Euros - {item.pagada == \"No\" || item.pagado == 0 ? \"A Falta de Pago\" : \"Pagada\"} Las reservas sin pagar seran canceladas automaticamente en el caso de no realizarse el pago.
\n \n \r\n \n \r\n \n : \"\"\r\n }\r\n \n \n Datos de Contacto \n \n \n \n \n \n \n \n \n \n \n \r\n {nomiacion}\r\n )\r\n }\r\n else\r\n return \"\";\r\n }\r\n\r\n //Render de reservar el cliente\r\n function renderReservarCliente( user) {\r\n\r\n }\r\n\r\n let modal = \"\";\r\n \r\n if (stateModal != DataStateModal.dsClosed && modomodal == \"ver\")\r\n modal = renderModalMasInfoReserva( itemmodal);\r\n\r\n let MiPerfilFormulario = loading ?
: renderFormUsuario( datausuario);\r\n\r\n let MisAccesos = loadingOficinas ?
: renderOpcionesOficinas( dataoficinas)\r\n\n let MisReservas = loadingRservas ?
: renderSearchReservas( dataReservas)\n\n let ReservarCliente = datausuario != null && datausuario.id_Usuario > 0 ?
: renderOpcionesArchivos( dataArchivos)\n\n let ActivacionCliente = datausuario != null && datausuario.id_Usuario > 0 ? renderActivacionCliente( datausuario) : \"\"\n\n let alerta = alert != null ? \r\n
\r\n \n {alerta}\n {modal}\n \r\n \n \r\n \r\n \r\n {NombreUsuario}\r\n \r\n \r\n \n \r\n \r\n
\r\n \n \n \n
\n \r\n \r\n \r\n
\n {/*latestVersion*/}\n v. {contextValue != null ? contextValue.latestVersion : \"Sin Indicar\"}\n
\n );\n}\n","import React, { useState, useEffect } from \"react\";\n\nimport Link from \"@mui/material/Link\";\n\nimport { useTranslation } from 'react-i18next';\n\nimport OthelloVersionWeb from \"../componentsothello/OthelloVersionWeb.jsx\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../components/MDBox\";\nimport MDTypography from \"../components/MDTypography\";\nimport MDInput from \"../components/MDInput\";\nimport MDButton from \"../components/MDButton\";\n\r\nimport { CircularProgress } from \"@mui/material\";\r\n\nfunction LoginPage({ ...props }) {\n // const { classes, t } = this.props;\n const { t } = useTranslation();\n\n const [initpage, setInitPage] = useState(true);\n const [version, setVersion] = useState(\"\");\n\n const [submitted, setSubmitted] = useState(false);\n const [error, setError] = useState(0);\n const [errordata, setErrorData] = useState(0);\n const [errorliteral, setErrorLiteral] = useState(0);\n\n const [loading, setLoading] = useState(false);\n\n //const [rememberMe, setRememberMe] = useState(false);\n //const handleSetRememberMe = () => setRememberMe(!rememberMe); \n\n React.useEffect(() => {\r\n fetch('api/Data/GetVersion')\n .then(response => response.json())\n .then(data => {\n\n //if (caches) {\r\n // // Service worker cache should be cleared with caches.delete()\r\n // caches.keys().then(function (names) {\r\n // for (let name of names) caches.delete(name);\r\n // });\r\n //}\n setVersion(data.version)\n setInitPage(false); \n }).catch(error => {\r\n setInitPage(false)\r\n setVersion(\"\")\r\n });\r\n }, [initpage]);\n\n const handleClick = (event) =>\r\n {\r\n event.preventDefault();\r\n\n setLoading(true);\n setErrorData(\"\");\r\n setErrorLiteral(\"\");\n\n let formulario = document.getElementById('formlogin');\n var data = new FormData(formulario);\n\r\n fetch('api/Data/LoginUsuario', {\n method: 'POST',\n body: data,\n }).then(response => response.json()).then(res =>\r\n {\r\n\r\n if (!res)\r\n {\r\n setSubmitted(true);\r\n setError(1);\r\n setErrorData(res.exceptionmessage);\r\n setErrorLiteral(res.exceptionmessagetraducible);\r\n setLoading(false);\r\n } \r\n else {\r\n //this.props.history.push('admin/dashboard')\r\n window.location.assign('/admin/dashboard');\r\n }\r\n }).catch(error => {\r\n setSubmitted(true);\r\n setError(2);\r\n });\r\n }\n\n let errorinfo = \"\";\n\n if (errorliteral != null && errorliteral != \"\")\n errorinfo = {t(errorliteral)} ;\n else if (errordata != null && errordata != \"\")\n errorinfo = {errordata} ;\n\n return (\n \n );\n}\n\nexport default LoginPage;\n\n\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\n\n// @mui material components\nimport { styled } from \"@mui/material/styles\";\nimport LinearProgress from \"@mui/material/LinearProgress\";\n\nexport default styled(LinearProgress)(({ theme, ownerState }) => {\n const { palette, functions } = theme;\n const { color, value, variant } = ownerState;\n\n const { text, gradients } = palette;\n const { linearGradient } = functions;\n\n // background value\n let backgroundValue;\n\n if (variant === \"gradient\") {\n backgroundValue = gradients[color]\n ? linearGradient(gradients[color].main, gradients[color].state)\n : linearGradient(gradients.info.main, gradients.info.state);\n } else {\n backgroundValue = palette[color] ? palette[color].main : palette.info.main;\n }\n\n return {\n \"& .MuiLinearProgress-bar\": {\n background: backgroundValue,\n width: `${value}%`,\n color: text.main,\n },\n };\n});\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\n\nimport React from \"react\";\n\nimport { forwardRef } from \"react\";\n\n// prop-types is a library for typechecking of props\nimport PropTypes from \"prop-types\";\n\n// Material Dashboard 2 PRO React components\nimport MDTypography from \"../MDTypography\";\n\n// Custom styles for MDProgress\nimport MDProgressRoot from \"./MDProgressRoot\";\n\nconst MDProgress = forwardRef(({ variant, color, value, label, ...rest }, ref) => (\n <>\n {label && (\n \n {value}%\n \n )}\n {t(errorliteral)} ;\n else if (errordata != null && errordata != \"\")\n errorinfo = {errordata} ;\n\n return (\n \n );\n}\n\nexport default LoginPage;\n","import React, { useState, useEffect } from \"react\";\n\nimport Link from \"@mui/material/Link\";\n\nimport { useTranslation } from 'react-i18next';\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../components/MDBox\";\nimport MDTypography from \"../components/MDTypography\";\nimport MDInput from \"../components/MDInput\";\nimport MDButton from \"../components/MDButton\";\nimport MDProgress from \"../components/MDProgress/index.js\";\n\nimport avatar from \"../assets/img/default-avatar.png\";\r\nimport { CircularProgress, Grid, LinearProgress } from \"@mui/material\";\n\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\nimport OthelloVersionWeb from \"../componentsothello/OthelloVersionWeb.jsx\";\n\n\nfunction LoginPageReservas({ ...props }) {\n const { t } = useTranslation();\n\n const [loading, setLoading] = useState(false);\n\n const [initpage, setInitPage] = useState(true);\n const [version, setVersion] = useState(\"\");\n const [localidades, setlocalidades] = useState([]);\n const [url, seturl] = useState(\"\");\n\n const [submitted, setSubmitted] = useState(false);\n const [error, setError] = useState(0);\n const [errordata, setErrorData] = useState(0);\n const [errorliteral, setErrorLiteral] = useState(0);\n\n React.useEffect(() => {\n\n getLocalidadesReserva();\n getVersion();\n setInitPage(false);\n\n }, [initpage]);\n\n\n const getVersion = () => {\n fetch('api/Data/GetVersion')\n .then(response => response.json())\n .then(data => {\n setVersion(data.version)\n }).catch(error => {\r\n setVersion(\"\")\r\n });\n }\n\n const getLocalidadesReserva = () => {\r\n fetch('api/Data/GetLocalidadesReservas')\r\n .then(response => response.json())\r\n .then(data => {\r\n\r\n let reslocalidades = [];\r\n\r\n if (data.localidades != null && data.localidades.length > 0) {\r\n reslocalidades = data.localidades.map(x => {\r\n let val =\r\n {\r\n ...x,\r\n valor: x.id_Oficina,\r\n name: x.nombreOficina\r\n };\r\n\r\n return val;\r\n });\r\n }\r\n\r\n setlocalidades(reslocalidades);\r\n seturl(data.urlweb);\r\n }).catch(error => {\r\n //window.location.assign('/authapps/loginreservas');\r\n });\r\n }\n\n const handleClick = (event) => {\r\n event.preventDefault();\r\n\n setLoading(true);\n\n let formulario = document.getElementById('formlogin');\n var data = new FormData(formulario);\r\n\r\n fetch('api/Data/LoginUsuarioAppReserva', {\n method: 'POST',\n body: data,\n\n }).then(response => response.json()).then(res => {\r\n //Si hubo error\r\n if (!res) {\r\n setSubmitted(true);\r\n setError(1);\r\n setLoading(false);\r\n }\r\n else {\r\n //this.props.history.push('admin/dashboard')\r\n window.location.assign('/admin/profile');\r\n }\r\n }).catch(error => {\r\n setSubmitted(true);\r\n setError(2);\r\n setLoading(false);\r\n });\r\n }\n\n let errorinfo = \"\";\n\n if (errorliteral != null && errorliteral != \"\")\n errorinfo = {t(errorliteral)} ;\n else if (errordata != null && errordata != \"\")\n errorinfo = {errordata} ;\n\n return (\n \n );\n\n\n/* let cargando = loading ? \n
\n \n \n \n \n\n \n \n
\r\n {!loading && peticion != null ?\r\n
\r\n Datos de la Peticion \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n : \"\"}\r\n {peticion.tipo == TipoPeticion.Establecimiento ?\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 {peticion.tipo == TipoPeticion.Contacto ?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n : \"\"}\r\n {peticion.tipo == TipoPeticion.Contacto ?\r\n \r\n \r\n \r\n \r\n : \"\"}\r\n\r\n\r\n
\r\n : \"\"}\r\n
\r\n )\r\n else\r\n return \"\";\r\n }\n\r\n\r\n let busqueda = loading ?
: renderSearch(datapeticiones)\n\n\n let modal = \"\";\r\n\r\n if (stateModal != DataStateModal.dsClosed)\r\n modal = renderModalPeticion(itemmodal, modomodal);\n\n let alerta = alert != null ? \n \n {modal}\n \n \n {alerta}\n \n \n \n \n \n \n \r\n \r\n \r\n {busqueda}\r\n \r\n \r\n \n \r\n \n );\n}\n\n","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\n\nimport { Link } from \"react-router-dom\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n\n// @mui/icons-material\nimport Visibility from \"@mui/icons-material/Visibility\";\n\n// core components\nimport Grid from \"@mui/material/Grid\";\n\r\nimport Button from \"../components/Button.jsx\";\r\nimport OthelloTitulo from \"../componentsothello/OthelloTitulo.jsx\";\r\n\r\nimport { ResultadoPagoReserva } from \"../othelloConstantes.jsx\";\r\n\nexport default function ReservaFinPasarela({ ...props }) {\r\n const { literal, idRol, tipooficina, loginmodoreserva, loginapps, idUser } = props;\n\n //Ejmplo de obtener un parametro de la URL \r\n //ID={Id_Oficina}&dt={Resultado.ID_Reserva}.1\n\n const navigate = useNavigate();\n\r\n const { search } = useLocation();\n\n const [loading, setLoading] = React.useState(true);\n\n const [id, setid] = React.useState(-1);\n const [data, setdata] = React.useState(null);\n const [sign, setsign] = React.useState(null);\n const [resultadopago, setresultadopago] = React.useState(null);\n\n React.useEffect(() => {\n\n let url = search;\r\n let params = new URLSearchParams(url);\n\r\n let id = params.get('ID');\n let dt = params.get('dt');\n let sign = params.get('sign');\n\n setid(id);\n setdata(dt);\n setsign(sign);\n\n getDataPage(id, dt, sign);\n }, [loading]);\n\n\n //METODOS GLOBALES DE LA PAGINA\r\n\r\n const getDataPage = (id, data, sign) => {\r\n\r\n if (id != null && data != null && sign != null) {\r\n var jsonData = JSON.stringify({ id: id, data: data, sign: sign });\r\n\r\n fetch('api/Data/ConfirmarDenegarPagoReserva', {\r\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\r\n\r\n }).then(response => response.json()).then(res => {\r\n if (res != null) {\r\n setLoading(false);\r\n setresultadopago(res);\r\n }\r\n else\r\n navigate('/admin/profile');\r\n //this.props.history.push('/admin/profile'); \r\n\r\n }).catch(error => {\r\n navigate('/admin/profile');\r\n //this.props.history.push('/admin/profile'); \r\n });\r\n }\r\n else\r\n navigate('/admin/profile');\r\n //this.props.history.push('/admin/profile');\r\n\r\n }\n\n function renderResultadoPago(resultado) {\r\n\r\n if (resultado != null) {\r\n let pagoOk = resultado.resultadoPago == ResultadoPagoReserva.OK;\r\n\r\n let titulo = pagoOk ? \"Operación realizada con exito\" : \"Operación no completada \";\r\n\r\n return \r\n El proceso de pago de la operación se ha completado correctamente.
:\r\n \r\n El proceso de pago de la operación NO se ha completado correctamente.
}\r\n\r\n Volver \r\n ;\r\n }\r\n else\r\n return \"Cargando\";\r\n }\n\n\r\n let resultado = loading ?
: renderResultadoPago(resultadopago);\r\n\n return (\n \n {resultado}\r\n \n );\n}\n\n","import React, { useState } from \"react\";\n\nimport { Route, Routes, useLocation } from \"react-router-dom\";\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// core components\nimport Card from \"@mui/material/Card\";\n\r\nimport { Helmet } from 'react-helmet'\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData\";\r\n\r\nexport default function CondicionesInfoPage({ ...props }) {\r\n\r\n const { literal } = props;\r\n\r\n const [loading, setLoading] = React.useState(true);\n const [info, setinfo] = React.useState(null);\r\n const [tipo, settipo] = React.useState(null);\r\n\r\n const { search } = useLocation();\n\n React.useEffect(() => {\n\n let url = search;\r\n let params = new URLSearchParams(url);\n let tipoinfo = \"\";\n\n if (params.has('tipo'))\n tipoinfo = params.get('tipo');\n\n settipo(tipoinfo);\n setLoading(false);\n\n getDataPage(tipo);\n\n }, [loading]);\r\n\r\n\r\n const getDataPage = (tipoinfo) => {\r\n\r\n if (tipoinfo != null && (tipoinfo == \"U\" || tipoinfo == \"C\" || tipoinfo == \"D\" || tipoinfo == \"P\")) {\r\n var jsonData = JSON.stringify(tipoinfo);\r\n\r\n fetch('api/Data/GetInfoPoliticaReservar', {\r\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\r\n\r\n }).then(response => response.json()).then(res =>\r\n {\r\n //Si se ha recibido un ok\r\n if (res != null)\r\n setinfo(res); \r\n\r\n }).catch(error => {\r\n });\r\n }\r\n }\n\n let rescargando = loading ?
: \"\";\n\n let nombre = \"\";\n let infoshow = \"\";\n\n if (tipo == \"C\")\n nombre = \"Politica de Cookies\";\n else if (tipo == \"U\")\n nombre = \"Condiciones de Uso\";\n else if (tipo == \"D\")\n nombre = \"Politica de Cancelacion\";\n else if (tipo == \"P\")\n nombre = \"Politica de Privacidad\";\n\n infoshow = info != null ? info.info : \"\"\n\n if (infoshow != null && infoshow != \"\")\n infoshow = infoshow.split(\"\\n\").map((i, key) => { return {i}
; });\n\n return (\n \n
\n {!loading ? nombre : \"Condiciones\"} \n \n {rescargando}\n
\n
{!loading ? nombre : \"\"} \n
\n \n {infoshow}\n
\n \n
({\n p: 3,\n position: \"relative\",\n\n [breakpoints.up(\"xl\")]: {\n marginLeft: miniSidenav ? pxToRem(120) : pxToRem(274),\n transition: transitions.create([\"margin-left\", \"margin-right\"], {\n easing: transitions.easing.easeInOut,\n duration: transitions.duration.standard,\n }),\n },\n })}\n >\n {children}\n \n );\n}\n\n// Typechecking props for the DashboardLayout\nDashboardLayout.propTypes = {\n children: PropTypes.node.isRequired,\n};\n\nexport default DashboardLayout;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\n// @mui material components\nimport Badge from \"@mui/material/Badge\";\nimport { styled } from \"@mui/material/styles\";\n\nexport default styled(Badge)(({ theme, ownerState }) => {\n const { palette, typography, borders, functions } = theme;\n const { color, circular, border, size, indicator, variant, container, children } = ownerState;\n\n const { white, dark, gradients, badgeColors } = palette;\n const { size: fontSize, fontWeightBold } = typography;\n const { borderRadius, borderWidth } = borders;\n const { pxToRem, linearGradient } = functions;\n\n // padding values\n const paddings = {\n xs: \"0.45em 0.775em\",\n sm: \"0.55em 0.9em\",\n md: \"0.65em 1em\",\n lg: \"0.85em 1.375em\",\n };\n\n // fontSize value\n const fontSizeValue = size === \"xs\" ? fontSize.xxs : fontSize.xs;\n\n // border value\n const borderValue = border ? `${borderWidth[3]} solid ${white.main}` : \"none\";\n\n // borderRadius value\n const borderRadiusValue = circular ? borderRadius.section : borderRadius.md;\n\n // styles for the badge with indicator={true}\n const indicatorStyles = (sizeProp) => {\n let widthValue = pxToRem(20);\n let heightValue = pxToRem(20);\n\n if (sizeProp === \"medium\") {\n widthValue = pxToRem(24);\n heightValue = pxToRem(24);\n } else if (sizeProp === \"large\") {\n widthValue = pxToRem(32);\n heightValue = pxToRem(32);\n }\n\n return {\n width: widthValue,\n height: heightValue,\n display: \"grid\",\n placeItems: \"center\",\n textAlign: \"center\",\n borderRadius: \"50%\",\n padding: 0,\n border: borderValue,\n };\n };\n\n // styles for the badge with variant=\"gradient\"\n const gradientStyles = (colorProp) => {\n const backgroundValue = gradients[colorProp]\n ? linearGradient(gradients[colorProp].main, gradients[colorProp].state)\n : linearGradient(gradients.info.main, gradients.info.state);\n const colorValue = colorProp === \"light\" ? dark.main : white.main;\n\n return {\n background: backgroundValue,\n color: colorValue,\n };\n };\n\n // styles for the badge with variant=\"contained\"\n const containedStyles = (colorProp) => {\n const backgroundValue = badgeColors[colorProp]\n ? badgeColors[colorProp].background\n : badgeColors.info.background;\n let colorValue = badgeColors[colorProp] ? badgeColors[colorProp].text : badgeColors.info.text;\n\n if (colorProp === \"light\") {\n colorValue = dark.main;\n }\n return {\n background: backgroundValue,\n color: colorValue,\n };\n };\n\n // styles for the badge with no children and container={false}\n const standAloneStyles = () => ({\n position: \"static\",\n marginLeft: pxToRem(8),\n transform: \"none\",\n fontSize: pxToRem(9),\n });\n\n // styles for the badge with container={true}\n const containerStyles = () => ({\n position: \"relative\",\n transform: \"none\",\n });\n\n return {\n \"& .MuiBadge-badge\": {\n height: \"auto\",\n padding: paddings[size] || paddings.xs,\n fontSize: fontSizeValue,\n fontWeight: fontWeightBold,\n textTransform: \"uppercase\",\n lineHeight: 1,\n textAlign: \"center\",\n whiteSpace: \"nowrap\",\n verticalAlign: \"baseline\",\n border: borderValue,\n borderRadius: borderRadiusValue,\n ...(indicator && indicatorStyles(size)),\n ...(variant === \"gradient\" && gradientStyles(color)),\n ...(variant === \"contained\" && containedStyles(color)),\n ...(!children && !container && standAloneStyles(color)),\n ...(container && containerStyles(color)),\n },\n };\n});\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { forwardRef } from \"react\";\n\n// prop-types is a library for typechecking of props\nimport PropTypes from \"prop-types\";\n\n// Custom styles for the MDBadge\nimport MDBadgeRoot from \"./MDBadgeRoot\";\n\nconst MDBadge = forwardRef(\n ({ color, variant, size, circular, indicator, border, container, children, ...rest }, ref) => (\n \n {children}\n \n )\n);\n\n// Setting default values for the props of MDBadge\nMDBadge.defaultProps = {\n color: \"info\",\n variant: \"gradient\",\n size: \"sm\",\n circular: false,\n indicator: false,\n border: false,\n children: false,\n container: false,\n};\n\n// Typechecking props of the MDBadge\nMDBadge.propTypes = {\n color: PropTypes.oneOf([\n \"primary\",\n \"secondary\",\n \"info\",\n \"success\",\n \"warning\",\n \"error\",\n \"light\",\n \"dark\",\n ]),\n variant: PropTypes.oneOf([\"gradient\", \"contained\"]),\n size: PropTypes.oneOf([\"xs\", \"sm\", \"md\", \"lg\"]),\n circular: PropTypes.bool,\n indicator: PropTypes.bool,\n border: PropTypes.bool,\n children: PropTypes.node,\n container: PropTypes.bool,\n};\n\nexport default MDBadge;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\n\n// react-router-dom components\nimport { Link } from \"react-router-dom\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\nimport React from \"react\";\n\n// @mui material components\nimport { Breadcrumbs as MuiBreadcrumbs } from \"@mui/material\";\nimport Icon from \"@mui/material/Icon\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../MDBox\";\nimport MDTypography from \"../MDTypography\";\n\nfunction Breadcrumbs({ icon, title, route, light }) {\n const routes = route.slice(0, -1);\n\n return (\n \n (light ? white.main : grey[600]),\n },\n }}\n >\n \n {icon} \n \n \n {routes.map((el) => (\n \n {el}\n \n \n ))}\n \n {title.replace(\"-\", \" \")}\n \n \n \n {title.replace(\"-\", \" \")}\n \n \n );\n}\n\n// Setting default values for the props of Breadcrumbs\nBreadcrumbs.defaultProps = {\n light: false,\n};\n\n// Typechecking props for the Breadcrumbs\nBreadcrumbs.propTypes = {\n icon: PropTypes.node.isRequired,\n title: PropTypes.string.isRequired,\n route: PropTypes.oneOfType([PropTypes.string, PropTypes.array]).isRequired,\n light: PropTypes.bool,\n};\n\nexport default Breadcrumbs;\n","function menuItem(theme) {\n const { palette, borders, transitions } = theme;\n\n const { secondary, light, dark } = palette;\n const { borderRadius } = borders;\n\n return {\n display: \"flex\",\n alignItems: \"center\",\n width: \"100%\",\n color: secondary.main,\n borderRadius: borderRadius.md,\n transition: transitions.create(\"background-color\", {\n easing: transitions.easing.easeInOut,\n duration: transitions.duration.standard,\n }),\n\n \"& *\": {\n transition: \"color 100ms linear\",\n },\n\n \"&:not(:last-child)\": {\n mb: 1,\n },\n\n \"&:hover\": {\n backgroundColor: light.main,\n\n \"& *\": {\n color: dark.main,\n },\n },\n };\n}\n\nexport default menuItem;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { forwardRef } from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport MenuItem from \"@mui/material/MenuItem\";\nimport Link from \"@mui/material/Link\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\nimport MDTypography from \"../../MDTypography\";\n\n// custom styles for the NotificationItem\nimport menuItem from \"./styles\";\n\nconst NotificationItem = forwardRef(({ icon, title, ...rest }, ref) => (\n menuItem(theme)}>\n \n \n {icon}\n \n \n {title}\n \n \n \n));\n\n// Typechecking props for the NotificationItem\nNotificationItem.propTypes = {\n icon: PropTypes.node.isRequired,\n title: PropTypes.string.isRequired,\n};\n\nexport default NotificationItem;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nfunction navbar(theme, ownerState) {\n const { palette, boxShadows, functions, transitions, breakpoints, borders } = theme;\n const { transparentNavbar, absolute, light, darkMode } = ownerState;\n\n const { dark, white, text, transparent, background } = palette;\n const { navbarBoxShadow } = boxShadows;\n const { rgba, pxToRem } = functions;\n const { borderRadius } = borders;\n\n return {\n boxShadow: transparentNavbar || absolute ? \"none\" : navbarBoxShadow,\n backdropFilter: transparentNavbar || absolute ? \"none\" : `saturate(200%) blur(${pxToRem(30)})`,\n backgroundColor:\n transparentNavbar || absolute\n ? `${transparent.main} !important`\n : rgba(darkMode ? background.default : white.main, 0.8),\n\n color: () => {\n let color;\n\n if (light) {\n color = white.main;\n } else if (transparentNavbar) {\n color = text.main;\n } else {\n color = dark.main;\n }\n\n return color;\n },\n top: absolute ? 0 : pxToRem(12),\n minHeight: pxToRem(75),\n display: \"grid\",\n alignItems: \"center\",\n borderRadius: borderRadius.xl,\n paddingTop: pxToRem(8),\n paddingBottom: pxToRem(8),\n paddingRight: absolute ? pxToRem(8) : 0,\n paddingLeft: absolute ? pxToRem(16) : 0,\n\n \"& > *\": {\n transition: transitions.create(\"all\", {\n easing: transitions.easing.easeInOut,\n duration: transitions.duration.standard,\n }),\n },\n\n \"& .MuiToolbar-root\": {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n\n [breakpoints.up(\"sm\")]: {\n minHeight: \"auto\",\n padding: `${pxToRem(4)} ${pxToRem(16)}`,\n },\n },\n };\n}\n\nconst navbarContainer = ({ breakpoints }) => ({\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n justifyContent: \"space-between\",\n pt: 0.5,\n pb: 0.5,\n\n [breakpoints.up(\"md\")]: {\n flexDirection: \"row\",\n alignItems: \"center\",\n paddingTop: \"0\",\n paddingBottom: \"0\",\n },\n});\n\nconst navbarRow = ({ breakpoints }, { isMini }) => ({\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n width: \"100%\",\n\n [breakpoints.up(\"md\")]: {\n justifyContent: isMini ? \"space-between\" : \"stretch\",\n width: isMini ? \"100%\" : \"max-content\",\n },\n\n [breakpoints.up(\"xl\")]: {\n justifyContent: \"stretch !important\",\n width: \"max-content !important\",\n },\n});\n\nconst navbarIconButton = ({ typography: { size }, breakpoints }) => ({\n px: 1,\n\n \"& .material-icons, .material-icons-round\": {\n fontSize: `${size.xl} !important`,\n },\n\n \"& .MuiTypography-root\": {\n display: \"none\",\n\n [breakpoints.up(\"sm\")]: {\n display: \"inline-block\",\n lineHeight: 1.2,\n ml: 0.5,\n },\n },\n});\n\nconst navbarDesktopMenu = ({ breakpoints }) => ({\n display: \"none !important\",\n cursor: \"pointer\",\n marginRight:1,\n\n [breakpoints.up(\"xl\")]: {\n display: \"inline-block !important\",\n },\n});\n\nconst navbarMobileMenu = ({ breakpoints }) => ({\n display: \"inline-block\",\n lineHeight: 0,\n\n [breakpoints.up(\"xl\")]: {\n display: \"none\",\n },\n});\n\nexport {\n navbar,\n navbarContainer,\n navbarRow,\n navbarIconButton,\n navbarDesktopMenu,\n navbarMobileMenu,\n};\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { useState, useEffect } from \"react\";\n\n// react-router components\nimport { useLocation, Link } from \"react-router-dom\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// @material-ui core components\nimport AppBar from \"@mui/material/AppBar\";\nimport Toolbar from \"@mui/material/Toolbar\";\nimport IconButton from \"@mui/material/IconButton\";\nimport Menu from \"@mui/material/Menu\";\nimport Icon from \"@mui/material/Icon\";\nimport Search from \"@mui/icons-material/Search\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\nimport MDInput from \"../../MDInput\";\nimport MDBadge from \"../../MDBadge\";\n\n// Material Dashboard 2 PRO React example components\nimport Breadcrumbs from \"../../Breadcrumbs\";\nimport NotificationItem from \"../../Items/NotificationItem\";\nimport Button from '../../Button.jsx';\n\nimport { TipoMensajeWeb, EstadoNotificacionWeb, Roles } from \"../../../othelloConstantes.jsx\";\n//import DialogNotificaciones from \"../../../view/Dialogs/DialogNotificaciones.js\";\n\n\n// Custom styles for DashboardNavbar\nimport {\n navbar,\n navbarContainer,\n navbarRow,\n navbarIconButton,\n navbarDesktopMenu,\n navbarMobileMenu,\n} from \"./styles\";\n\n// Material Dashboard 2 PRO React context\nimport {\n useMaterialUIController,\n setTransparentNavbar,\n setMiniSidenav,\n setOpenConfigurator,\n} from \"../../../context\";\n\r\n\r\n\nfunction DashboardNavbar({ absolute, light, isMini, rutasactual, oficina, idRol, loginmodoreserva, loginapps }) {\n const [navbarType, setNavbarType] = useState();\n const [controller, dispatch] = useMaterialUIController();\n const { miniSidenav, transparentNavbar, fixedNavbar, openConfigurator, darkMode } = controller;\n const [openMenu, setOpenMenu] = useState(false);\n const route = useLocation().pathname.split(\"/\").slice(1);\n\n const [notificaciones, setNotificaciones] = useState(null);\n const [id_msj_web, setIdMsjWeb] = useState(null);\n\n useEffect(() => {\n // Setting the navbar type\n if (fixedNavbar) {\n setNavbarType(\"sticky\");\n } else {\n setNavbarType(\"static\");\n }\n\n // A function that sets the transparent state of the navbar.\n function handleTransparentNavbar() {\n setTransparentNavbar(dispatch, (fixedNavbar && window.scrollY === 0) || !fixedNavbar);\n }\n\n /** \n The event listener that's calling the handleTransparentNavbar function when \n scrolling the window.\n */\n window.addEventListener(\"scroll\", handleTransparentNavbar);\n\n // Call the handleTransparentNavbar function to set the state with the initial value.\n handleTransparentNavbar();\n\n // Remove event listener on cleanup\n return () => window.removeEventListener(\"scroll\", handleTransparentNavbar);\n }, [dispatch, fixedNavbar]);\n\n const handleMiniSidenav = () => setMiniSidenav(dispatch, !miniSidenav);\n const handleConfiguratorOpen = () => setOpenConfigurator(dispatch, !openConfigurator);\n\n const getNotificacionesResumido = () => {\n\n /* var jsonData = JSON.stringify({ tipo: [TipoMensajeWeb.Excepcion, TipoMensajeWeb.Aviso], modulo: \"\" });\n\n fetch('api/NotificacionesData/GetNotificacionesResumido', {\n method: 'POST',\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json',\n },\n body: jsonData\n\n }).then(response => response.json()).then(res => {\n setNotificaciones(res);\n }).catch(error => {\n\n });*/\n }\n\n const handleOpenMenu = (event) => {\n setOpenMenu(event.currentTarget);\n getNotificacionesResumido();\n }\n\n const handleCloseMenu = () => setOpenMenu(false);\n\n const handleCloseDialogNotificaciones = (result) => {\n setIdMsjWeb(0);\n getNotificacionesResumido();\n }\n\n const handleClickNotificacion = (result) => {\n if (result != null && result > 0) {\n setIdMsjWeb(result);\n }\n }\n\n // Render the notifications menu\n const renderMenu = () => {\n\n let final = \"\";\n\n final = {\n notificaciones != null && notificaciones.length > 0 ? notificaciones.map(x => addalert : \"\")} title={x.titulo} onClick={() => handleClickNotificacion(x.id_msj_web)} />) :\n //< MenuItem onClick={() => click(x.id_msj_web)} className={dropdownItem}>{x.estado != EstadoNotificacionWeb.Leido ? email} title=\"Sin Notificaciones\" />\n }\n \n\n return final;\n }\n\n // Styles for the navbar icons\n const iconsStyle = ({ palette: { dark, white, text }, functions: { rgba } }) => ({\n color: () => {\n let colorValue = light || darkMode ? white.main : dark.main;\n\n if (transparentNavbar && !light) {\n colorValue = darkMode ? rgba(text.main, 0.6) : text.main;\n }\n\n return colorValue;\n },\n });\n\n let dialogmensaje = \"\";\n\n if (id_msj_web != null && id_msj_web > 0)\n dialogmensaje = \"\";// navbar(theme, { transparentNavbar, absolute, light, darkMode })}\n >\n navbarContainer(theme)}>\n navbarRow(theme, { isMini })}> \n \n \n {miniSidenav ? \"menu_open\" : \"menu\"}\n \n \n onKeyDownBoton(prop.id, prop.permiso)}> : \"\"}*/}\n {/*{idRol != Roles.UsuarioApp && !loginmodoreserva && !loginapps ? onKeyDownBoton(prop.id, prop.permiso)}> : \"\"}*/} \n {idRol != Roles.UsuarioApp && !loginmodoreserva && !loginapps ? {getTitleOficina()} : \"\"}\n {idRol != Roles.UsuarioApp && !loginmodoreserva && !loginapps ? \n {isMini ? null : (\n navbarRow(theme, { isMini })}>\n {/**/}\n {/* */}\n \n \n logout \n \n \n \n \n {miniSidenav ? \"menu_open\" : \"menu\"}\n \n \n {/**/}\n {/* settings */}\n {/**/}\n \n {numnoti > 0 ?\n \n notifications \n : notifications }\n \n {renderMenu()}\n {dialogmensaje}\n \n \n )}\n \n \n );\n}\n\n// Setting default values for the props of DashboardNavbar\nDashboardNavbar.defaultProps = {\n absolute: false,\n light: false,\n isMini: false,\n};\n\n// Typechecking props for the DashboardNavbar\nDashboardNavbar.propTypes = {\n absolute: PropTypes.bool,\n light: PropTypes.bool,\n isMini: PropTypes.bool,\n};\n\nexport default DashboardNavbar;\n","export default __webpack_public_path__ + \"static/media/logo_atm2x.b4784398.png\";","import React, { useState, useEffect } from \"react\";\n\n// react-router components\nimport { Route, Routes, useLocation /*, Navigate*/ } from \"react-router-dom\";\n//import { Router, Route, Switch, Redirect } from \"react-router-dom\";\n\n// @mui material components\nimport { ThemeProvider } from \"@mui/material/styles\";\nimport CssBaseline from \"@mui/material/CssBaseline\";\nimport Icon from \"@mui/material/Icon\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../components/MDBox\";\n\n// Material Dashboard 2 PRO React example components\nimport Sidenav from \"../components/Sidenav\";\nimport Configurator from \"../components/Configurator\";\n\n// Material Dashboard 2 PRO React themes\nimport theme from \"../assets/theme\";\n\n// Material Dashboard 2 PRO React Dark Mode themes\n/*import themeDark from \"./assets/theme-dark\";*/\n\n// Material Dashboard 2 PRO React contexts\nimport { useMaterialUIController, setMiniSidenav, setOpenConfigurator, setOpenBarraVertical } from \"../context\";\n\nimport { useTranslation } from 'react-i18next';\n\n// core components\nimport Footer from \"../components/Footer\";\n\nimport { getCurrentRouteMain, getRoutesTienda } from \"../routes.js\";\n\nimport DashboardLayout from \"../components/LayoutContainers/DashboardLayout\";\nimport DashboardNavbar from \"../components/Navbars/DashboardNavbar\";\n\nimport logo from \"../assets/img/logo_atm2x.png\";\n\nimport { Helmet } from 'react-helmet'\n\nexport default function LayaoutAdmin() {\n const [controller, dispatch] = useMaterialUIController();\n const {\n miniSidenav,\n layout,\n openConfigurator,\n sidenavColor,\n transparentSidenav,\n whiteSidenav,\n darkMode,\n } = controller;\n\n const [onMouseEnter, setOnMouseEnter] = useState(false);\n const { pathname } = useLocation();\n\n // Open sidenav when mouse enter on mini sidenav\n const handleOnMouseEnter = () => {\n if (miniSidenav && !onMouseEnter) {\n setMiniSidenav(dispatch, false);\n setOnMouseEnter(true);\n }\n };\n\n // Close sidenav when mouse leave mini sidenav\n const handleOnMouseLeave = () => {\n if (onMouseEnter) {\n setMiniSidenav(dispatch, true);\n setOnMouseEnter(false);\n }\n };\n\n // Change the openConfigurator state\n const handleConfiguratorOpen = () => setOpenConfigurator(dispatch, !openConfigurator);\n \n // Setting page scroll to 0 when changing the route\n useEffect(() => {\n document.documentElement.scrollTop = 0;\n document.scrollingElement.scrollTop = 0;\n }, [pathname]);\n\n const { t } = useTranslation(); \n \n const [loading, setLoading] = useState(true);\n const [image, setImage] = useState(null);\n const [imageUsuario, setImageUsuario] = useState(null);\n const [nameUsuario, setNameUsuario] = useState(\"\");\n\n const [routes, setroutes] = useState([]);\n \n const [idoficinaselected, setidoficinaselected] = useState(-1);\n const [oficina, setoficina] = useState(\"\");\n const [idRol, setidRol] = useState(-1);\n const [idUser, setidUser] = useState(-1);\n const [areaAgenda, setareaAgenda] = useState(\"\");\n const [conincidencia, setconincidencia] = useState(false);\n const [conareaprivada, setconareaprivada] = useState(false);\n const [idoficinareserva, setidoficinareserva] = useState(0);\n const [loginmodoreserva, setloginmodoreserva] = useState(false);\n const [loginapps, setloginapps] = useState(false); \n const [tipooficina, settipooficina] = useState(0);\n const [idpoitienda, setidpoitienda] = useState(0);\n const [gestionreservas, setgestionreservas] = useState(0);\n const [gestionencuestas, setgestionencuestas] = useState(0);\n \n \n React.useEffect(() => {\n fetch('api/Data/GetCurrentUser')\n .then(response => response.json())\n .then(data =>\n {\n if (data != null)\n {\n if (data != null && oficina != data.nameoficina || nameUsuario != data.userconected || idoficinaselected != data.idoficinaselected)\n {\n setidoficinaselected(data.idoficinaselected);\n setNameUsuario(data.userconected);\n setoficina(data.nameoficina);\r\n setidRol(data.idRol);\r\n setidUser(data.idUser)\r\n setareaAgenda(data.areaAgenda); setconincidencia(data.conincidencia)\r\n setconareaprivada(data.conareaprivada);\r\n setidoficinareserva(data.idoficinareserva);\r\n setloginmodoreserva(data.loginmodoreserva);\r\n setloginapps(data.loginapps);\r\n settipooficina(data.tipooficina);\r\n setidpoitienda(data.idpoitienda);\r\n setgestionreservas(data.gestionreservas);\r\n setgestionencuestas(data.gestionencuestas);\n\n //Rutas \n getCurrentRoute(data.userconected, data.idRol, data.idUser, data.areaAgenda, data.conincidencia, data.conareaprivada, data.loginmodoreserva, data.loginapps, data.tipooficina, data.gestionreservas, data.gestionencuestas, true);\n }\n else if (data != null && idpoitienda != data.idpoitienda)\r\n {\r\n setidpoitienda(data.idpoitienda);\n getCurrentRoute(data.userconected, data.idRol, data.userconected, data.idUser, data.areaAgenda, data.conincidencia, data.conareaprivada, data.loginmodoreserva, data.loginapps, data.tipooficina, data.gestionreservas, data.gestionencuestas, true);\n }\n\n setLoading(false);\n }\n else\n window.location.assign('/auth/login');\n }).catch(error => {\n // window.location.assign('/auth/login');\n });\n\n }, [loading]);\n\n React.useEffect(() => {\n //Si no estamos cargando la pagina\n if (!loading && nameUsuario != \"\") {\n //Si hay aplicacion guardadas indicamos las rutas actuales\n /* if (aplicaciones != null && aplicaciones.length > 0)\n getCurrentRoute(idRol, idUser, areaAgenda, conincidencia, conareaprivada, loginmodoreserva, loginapps, tipooficina, gestionreservas, gestionencuestas); \n //sino, es que no tenemos los datos cargados, y por tanto inicializamos\n else\n setLoading(true);*/\n\n //Tratamos la sessiones\n getHaySessionUsuario();\n }\n\n });\n\n const getHaySessionUsuario = () => {\n\n fetch('api/Data/HaySessionUsuario')\n .then(response => response.json())\n .then(data => {\n if (data == null || (data != null && data < 0))\n window.location.assign('/auth/login');\n else if (data != null && data > 0 && data != idoficinaselected)\n setLoading(true);\n }).catch(error => {\n });\n }\n\n const getRoutes = (allRoutes) => {\n return allRoutes.map((route) => {\n //si es un item collapse hacemos route de los hijos\n if (route.collapse)\n return getRoutes(route.collapse);\n\n if (route.route) {\n\n /* return ej campo={prop.rtlName}\n render={(props) => \n \n {\"Aplicaciones Turisticas en Movilidad\"} \n \n {layout === \"dashboard\" && (\n <>\n \n \n {getRoutes(routes)}\n \n \n \n \n \n \n );\n}","/**\r\n All of the routes for the Material Dashboard 2 PRO React are added here,\r\n You can add a new route, customize the routes and delete the routes here.\r\n\r\n Once you add a new route on this file it will be visible automatically on\r\n the Sidenav.\r\n\r\n For adding a new route you can follow the existing routes in the routes array.\r\n 1. The `type` key with the `collapse` value is used for a route.\r\n 2. The `type` key with the `title` value is used for a title inside the Sidenav.\r\n 3. The `type` key with the `divider` value is used for a divider between Sidenav items.\r\n 4. The `name` key is used for the name of the route on the Sidenav.\r\n 5. The `key` key is used for the key of the route (It will help you with the key prop inside a loop).\r\n 6. The `icon` key is used for the icon of the route on the Sidenav, you have to add a node.\r\n 7. The `collapse` key is used for making a collapsible item on the Sidenav that contains other routes\r\n inside (nested routes), you need to pass the nested routes inside an array as a value for the `collapse` key.\r\n 8. The `route` key is used to store the route location which is used for the react router.\r\n 9. The `href` key is used to store the external links location.\r\n 10. The `title` key is only for the item with the type of `title` and its used for the title text on the Sidenav.\r\n 10. The `component` key is used to store the component of its route.*/\r\n\r\nimport React from \"react\";\n\r\nimport Oficina from \"./view/Oficina.js\";\r\nimport Oficinas from \"./view/Oficinas.js\";\r\nimport Regiones from \"./view/Regiones.js\";\r\nimport Idiomas from \"./view/Idiomas.js\";\r\nimport Areas from \"./view/Areas.js\";\r\nimport Incidencias from \"./view/Incidencias.js\";\r\nimport TramosReserva from \"./view/TramosReservas.js\";\r\nimport InstalacionReservas from \"./view/InstalacionReservas.js\"\r\nimport Encuestas from \"./view/Encuestas.js\";\r\nimport EncuestasEstadistica from \"./view/EncuestasEstadisticas.js\";\r\nimport EncuestasEstadisticasFiltradas from \"./view/EncuestasEstadisticasFiltradas.js\";\r\n\r\nimport Pois from \"./view/Pois.js\";\r\nimport Usuarios from \"./view/Usuarios.js\";\r\n\r\nimport Dashboard from \"./view/Dashboard.js\";\r\n\r\nimport DashTienda from \"./view/Tienda/DashTienda.js\";\r\nimport Categorias from \"./view/Tienda/Categorias.js\";\r\nimport Marcas from \"./view/Tienda/Marcas.js\";\r\nimport Pedidos from \"./view/Tienda/Pedidos.js\";\r\nimport Articulos from \"./view/Tienda/Articulos.js\";\r\n\r\nimport Importacion from \"./view/Importacion.js\";\r\nimport Perfil from \"./view/Perfil.js\";\r\nimport LoginPage from \"./view/LoginPage.jsx\";\r\nimport LoginPageApps from \"./view/LoginPageApps.jsx\";\r\nimport LoginPageReservas from \"./view/LoginPageReservas.jsx\";\r\nimport { Roles, TipoOficina, OpcionSiNo } from \"./othelloConstantes.jsx\";\r\nimport Peticiones from \"./view/Peticiones.js\";\r\nimport ReservaFinPasarela from \"./view/ReservaFinPasarela.js\";\r\nimport CondicionesInfoPage from \"./view/CondicionesInfoPage.js\";\r\n\r\nimport Icon from \"@mui/material/Icon\";\r\nimport MDAvatar from \"./components/MDAvatar\";\r\n\nimport imageUsuario from \"./assets/img/default-avatar.png\";\n\n\nexport function getCurrentRouteSinUso(literal, nameUser) {\n return [\n {\r\n type: \"collapse\",\r\n name: nameUser,\r\n key: nameUser,\r\n icon: dashboard ,\r\n component: business_center ,\r\n component: business_center ,\r\n component: language ,\r\n component: landscape ,\r\n component: nearme ,\r\n component: place ,\r\n component: language ,\r\n component: howtovote ,\r\n component: group ,\r\n component: person ,\r\n component: keyboard_return ,\r\n component: person ,\r\n component: person ,\r\n component: person ,\r\n component: person ,\r\n component: dashboard ,\r\n component: business_center ,\r\n component: person ,\r\n component: dashboard ,\r\n component: business_center ,\r\n component: language ,\r\n component: landscape ,\r\n component: near_me ,\r\n component: place ,\r\n component: forum ,\r\n component: how_to_vote ,\r\n component: import_contacts ,\r\n component: book ,\r\n collapse: [\r\n {\r\n type: \"estandar\",\r\n path: \"/instalaciones\",\r\n name: literal(\"_instalaciones\"),\r\n icon: storemalldirectory ,\r\n component: dns ,\r\n component: article ,\r\n collapse: [\r\n {\r\n type: \"estandar\",\r\n path: \"/definicion\",\r\n name: literal(\"_encuestas\"),\r\n icon: assignment ,\r\n component: equalizer ,\r\n component: equalizer ,\r\n component: group ,\r\n component: dashboard ,\r\n component: view_module ,\r\n component: local_mall ,\r\n component: local_grocery_store ,\r\n component: receipt ,\r\n component: keyboard_return ,\r\n component: \n \n {name}\n \n \n keyboard_arrow_down \n \n \n {children && (\n \n {children}\n \n )}\n \n );\n}\n\n// Setting default values for the props of DefaultNavbarLink\nDefaultNavbarLink.defaultProps = {\n openHandler: false,\n closeHandler: false,\n children: false,\n collapseStatus: false,\n light: false,\n};\n\n// Typechecking props for the DefaultNavbarLink\nDefaultNavbarLink.propTypes = {\n name: PropTypes.string.isRequired,\n openHandler: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),\n closeHandler: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),\n children: PropTypes.node,\n collapseStatus: PropTypes.bool,\n light: PropTypes.bool,\n};\n\nexport default DefaultNavbarLink;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\n// prop-types is a library for typechecking of props\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport Icon from \"@mui/material/Icon\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\nimport MDTypography from \"../../MDTypography\";\n\nfunction DefaultNavbarCategory({ icon, title }) {\n return (\n \n \n {typeof icon === \"string\" ? {icon} : icon}\n \n \n {title}\n \n \n );\n}\n\n// Typechecking props for the DefaultNavbarCategory\nDefaultNavbarCategory.propTypes = {\n icon: PropTypes.node.isRequired,\n title: PropTypes.string.isRequired,\n};\n\nexport default DefaultNavbarCategory;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { useState } from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport Popper from \"@mui/material/Popper\";\nimport Grow from \"@mui/material/Grow\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\n\n// Material Dashboard 2 PRO React context\nimport { useMaterialUIController } from \"../../../context\";\n\nfunction DefaultNavbarMenu({ open, close, placement, children, style }) {\n const [controller] = useMaterialUIController();\n const { darkMode } = controller;\n\n const [anchor, setAnchor] = useState(false);\n\n const openMenu = () => setAnchor(open);\n const closeMenu = () => setAnchor(false);\n return (\n \n {({ TransitionProps }) => (\n \n darkMode ? background.card : white.main,\n }}\n >\n \n {children}\n \n \n )}\n \n );\n}\n\n// Setting default values for the props of DefaultNavbarMenu\nDefaultNavbarMenu.defaultProps = {\n placement: \"bottom-start\",\n style: {},\n};\n\n// Typechecking props for the DefaultNavbarMenu\nDefaultNavbarMenu.propTypes = {\n open: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]).isRequired,\n close: PropTypes.oneOfType([PropTypes.func, PropTypes.bool, PropTypes.object]).isRequired,\n placement: PropTypes.string,\n children: PropTypes.node.isRequired,\n style: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n};\n\nexport default DefaultNavbarMenu;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { Fragment } from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// react-router components\nimport { Link } from \"react-router-dom\";\n\n// @mui material components\nimport Grid from \"@mui/material/Grid\";\nimport MenuItem from \"@mui/material/MenuItem\";\nimport Divider from \"@mui/material/Divider\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../../MDBox\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbarCategory from \"../DefaultNavbarCategory\";\nimport DefaultNavbarMenu from \"../DefaultNavbarMenu\";\n\n// Material Dashboard 2 PRO React context\nimport { useMaterialUIController } from \"../../../../context\";\n\nfunction PagesMenu({ routes, open, close, mobileMenu }) {\n const [controller] = useMaterialUIController();\n const { darkMode } = controller;\n\n const renderPagesMenuRoute = (routeName) =>\n routes.map(\n ({ key, name, icon, collapse }) =>\n key === routeName && (\n \n \n \n {collapseName}\n \n \n ))}\n \n )\n );\n\n const renderMenuContent = (\n \n darkMode ? background.card : white.main,\n }}\n >\n \n \n {renderPagesMenuRoute(\"dashboards\")}\n {renderPagesMenuRoute(\"users\")} \n \n \n \n \n \n {renderPagesMenuRoute(\"extra\")}\n {renderPagesMenuRoute(\"projects\")} \n \n \n \n \n \n \n {renderPagesMenuRoute(\"account\")}\n {renderPagesMenuRoute(\"profile\")} \n \n \n \n \n );\n\n return mobileMenu ? (\n renderMenuContent\n ) : (\n \n {renderMenuContent}\n \n );\n}\n\n// Setting default values for the props of PagesMenu\nPagesMenu.defaultProps = {\n mobileMenu: false,\n open: false,\n close: false,\n};\n\n// Typechecking props for the PagesMenu\nPagesMenu.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.object).isRequired,\n open: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\n close: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\n mobileMenu: PropTypes.bool,\n};\n\nexport default PagesMenu;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React, { useState } from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// react-router components\nimport { Link } from \"react-router-dom\";\n\n// @mui material components\nimport MenuItem from \"@mui/material/MenuItem\";\nimport Icon from \"@mui/material/Icon\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../../MDBox\";\nimport MDTypography from \"../../../MDTypography\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbarMenu from \"../DefaultNavbarMenu\";\n\nfunction AuthenticationMenu({ routes, open, close, mobileMenu })\n{\n const renderAuthenticationMenuRoute = (routeName) =>\n routes.map(({ key, name, icon, collapse }) => {\n let template;\n\n const [menu, setMenu] = false;//useState(false);\n const openMenu = ({ currentTarget }) => setMenu(currentTarget);\n const closeMenu = () => setMenu(false);\n\n if (key === routeName && !mobileMenu) {\n template = (\n \n {icon} \n {name} \n chevron_right \n \n {collapse.map(({ key: collapseKey, name: collapseName, route }) => (\n \n {collapseName}\n \n ))}\n \n \n );\n } else if (key === routeName && mobileMenu) {\n template = (\n \n \n \n {icon} \n \n {name}\n \n {collapse.map(({ key: collapseKey, name: collapseName, route }) => (\n \n {collapseName}\n \n ))}\n \n );\n }\n\n return template;\n });\n\n const renderMenuContent = (\n \n {renderAuthenticationMenuRoute(\"sign-in\")}\n {renderAuthenticationMenuRoute(\"sign-up\")}\n {renderAuthenticationMenuRoute(\"reset-password\")}\n {renderAuthenticationMenuRoute(\"lock\")}\n {renderAuthenticationMenuRoute(\"2-step-verification\")}\n {renderAuthenticationMenuRoute(\"error\")}\n \n );\n\n return mobileMenu ? (\n renderMenuContent\n ) : (\n \n {renderMenuContent}\n \n );\n}\n\n// Setting default values for the props of AuthenticationMenu\nAuthenticationMenu.defaultProps = {\n mobileMenu: false,\n open: false,\n close: false,\n};\n\n// Typechecking props for the AuthenticationMenu\nAuthenticationMenu.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.object).isRequired,\n open: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\n close: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\n mobileMenu: PropTypes.bool,\n};\n\nexport default AuthenticationMenu;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// react-router components\nimport { Link } from \"react-router-dom\";\n\n// @mui material components\nimport MenuItem from \"@mui/material/MenuItem\";\nimport Icon from \"@mui/material/Icon\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../../MDBox\";\nimport MDTypography from \"../../../MDTypography\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbarMenu from \"../DefaultNavbarMenu\";\n\nfunction ApplicationsMenu({ routes, open, close, mobileMenu }) {\n const renderApplicationsMenuRoute = (routeName) =>\n routes.map(\n ({ key, collapse }) =>\n key === routeName &&\n collapse.map(({ key: collapseKey, route, name, icon }) => (\n \n \n {typeof icon === \"string\" ? {icon} : icon}\n \n {name}\n \n \n \n ))\n );\n\n return mobileMenu ? (\n {renderApplicationsMenuRoute(\"applications\")} \n ) : (\n \n {renderApplicationsMenuRoute(\"applications\")}\n \n );\n}\n\n// Setting default values for the props of ApplicationsMenu\nApplicationsMenu.defaultProps = {\n mobileMenu: false,\n open: false,\n close: false,\n};\n\n// Typechecking props for the ApplicationsMenu\nApplicationsMenu.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.object).isRequired,\n open: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\n close: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\n mobileMenu: PropTypes.bool,\n};\nexport default ApplicationsMenu;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { Fragment } from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// react-router components\nimport { Link } from \"react-router-dom\";\n\n// @mui material components\nimport Grid from \"@mui/material/Grid\";\nimport MenuItem from \"@mui/material/MenuItem\";\nimport Divider from \"@mui/material/Divider\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../../MDBox\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbarCategory from \"../DefaultNavbarCategory\";\nimport DefaultNavbarMenu from \"../DefaultNavbarMenu\";\n\nfunction EcommerceMenu({ routes, open, close, mobileMenu }) {\n const renderEcommerceMenuRoute = (routeName) =>\n routes.map(\n ({ key, name, icon, collapse }) =>\n key === routeName && (\n \n \n \n {collapseName}\n \n \n ))}\n \n )\n );\n\n const renderMenuContent = (\n \n \n \n {renderEcommerceMenuRoute(\"orders\")}\n {renderEcommerceMenuRoute(\"general\")} \n \n \n \n \n {renderEcommerceMenuRoute(\"products\")} \n \n \n \n );\n\n return mobileMenu ? (\n renderMenuContent\n ) : (\n \n {renderMenuContent}\n \n );\n}\n\n// Setting default values for the props of EcommerceMenu\nEcommerceMenu.defaultProps = {\n mobileMenu: false,\n open: false,\n close: false,\n};\n\n// Typechecking props for the EcommerceMenu\nEcommerceMenu.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.object).isRequired,\n open: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\n close: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\n mobileMenu: PropTypes.bool,\n};\nexport default EcommerceMenu;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport MenuItem from \"@mui/material/MenuItem\";\nimport Icon from \"@mui/material/Icon\";\nimport Link from \"@mui/material/Link\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../../MDBox\";\nimport MDTypography from \"../../../MDTypography\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbarMenu from \"../DefaultNavbarMenu\";\n\nfunction DocsMenu({ routes, open, close, mobileMenu }) {\n const renderDocsMenuRoute = (routeName) =>\n routes.map(\n ({ key, collapse }) =>\n key === routeName &&\n collapse.map(({ key: collapseKey, href, name, icon, description }) => (\n \n \n {typeof icon === \"string\" ? (\n {icon} \n ) : (\n {icon} \n )}\n \n \n {name}\n \n \n {description}\n \n \n \n \n ))\n );\n\n return mobileMenu ? (\n renderDocsMenuRoute(\"docs\")\n ) : (\n \n {renderDocsMenuRoute(\"docs\")}\n \n );\n}\n\n// Setting default values for the props of DocsMenu\nDocsMenu.defaultProps = {\n mobileMenu: false,\n open: false,\n close: false,\n};\n\n// Typechecking props for the DocsMenu\nDocsMenu.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.object).isRequired,\n open: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\n close: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\n mobileMenu: PropTypes.bool,\n};\n\nexport default DocsMenu;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { useState } from \"react\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport Menu from \"@mui/material/Menu\";\n// import Grid from \"@mui/material/Grid\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbarLink from \"./DefaultNavbarLink\";\n\n// DefaultNavbar dropdown menus\nimport PagesMenu from \"./Menus/PagesMenu\";\nimport AuthenticationMenu from \"./Menus/AuthenticationMenu\";\nimport ApplicationsMenu from \"./Menus/ApplicationsMenu\";\nimport EcommerceMenu from \"./Menus/EcommerceMenu\";\nimport DocsMenu from \"./Menus/DocsMenu\";\n\nfunction DefaultNavbarMobile({ routes, open, close }) {\n const { width } = open && open.getBoundingClientRect();\n const [openCollapse, setOpenCollapse] = useState(false);\n\n const handleSepOpenCollapse = (name) =>\n openCollapse === name ? setOpenCollapse(false) : setOpenCollapse(name);\n\n return (\n \n \n handleSepOpenCollapse(\"pages\")}\n >\n \n \n \n handleSepOpenCollapse(\"authentication\")}\n >\n \n \n \n handleSepOpenCollapse(\"applications\")}\n >\n \n \n \n handleSepOpenCollapse(\"ecommerce\")}\n >\n \n \n \n handleSepOpenCollapse(\"docs\")}\n >\n \n \n \n \n \n );\n}\n\n// Typechecking props for the DefaultNavbarMenu\nDefaultNavbarMobile.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.object).isRequired,\n open: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]).isRequired,\n close: PropTypes.oneOfType([PropTypes.func, PropTypes.bool, PropTypes.object]).isRequired,\n};\n\nexport default DefaultNavbarMobile;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { useState, useEffect } from \"react\";\n\n// react-router components\nimport { Link } from \"react-router-dom\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport Container from \"@mui/material/Container\";\nimport Icon from \"@mui/material/Icon\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\nimport MDTypography from \"../../MDTypography\";\nimport MDButton from \"../../MDButton\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbarLink from \"./DefaultNavbarLink\";\nimport DefaultNavbarMobile from \"./DefaultNavbarMobile\";\n\n// Material Dashboard 2 PRO React base styles\nimport breakpoints from \"../../../assets/theme/base/breakpoints\";\n\n// DefaultNavbar dropdown menus\nimport PagesMenu from \"./Menus/PagesMenu\";\nimport AuthenticationMenu from \"./Menus/AuthenticationMenu\";\nimport EcommerceMenu from \"./Menus/EcommerceMenu\";\nimport ApplicationsMenu from \"./Menus/ApplicationsMenu\";\nimport DocsMenu from \"./Menus/DocsMenu\";\n\n// Material Dashboard 2 PRO React context\nimport { useMaterialUIController } from \"../../../context\";\n\nfunction DefaultNavbar({ routes, transparent, light, action }) {\n const [controller] = useMaterialUIController();\n const { darkMode } = controller;\n\n const [pagesMenu, setPagesMenu] = useState(false);\n const [authenticationMenu, setAuthenticationMenu] = useState(false);\n const [ecommerceMenu, setEcommerceMenu] = useState(false);\n const [applicationsMenu, setApplicationsMenu] = useState(false);\n const [docsMenu, setDocsMenu] = useState(false);\n const [mobileNavbar, setMobileNavbar] = useState(false);\n const [mobileView, setMobileView] = useState(false);\n\n const openPagesMenu = ({ currentTarget }) => setPagesMenu(currentTarget);\n const closePagesMenu = () => setPagesMenu(false);\n const openAuthenticationMenu = ({ currentTarget }) => setAuthenticationMenu(currentTarget);\n const closeAuthenticationMenu = () => setAuthenticationMenu(false);\n const openEcommerceMenu = ({ currentTarget }) => setEcommerceMenu(currentTarget);\n const closeEcommerceMenu = () => setEcommerceMenu(false);\n const openApplicationsMenu = ({ currentTarget }) => setApplicationsMenu(currentTarget);\n const closeApplicationsMenu = () => setApplicationsMenu(false);\n const openDocsMenu = ({ currentTarget }) => setDocsMenu(currentTarget);\n const closeDocsMenu = () => setDocsMenu(false);\n const openMobileNavbar = ({ currentTarget }) => setMobileNavbar(currentTarget.parentNode);\n const closeMobileNavbar = () => setMobileNavbar(false);\n\n useEffect(() => {\n // A function that sets the display state for the DefaultNavbarMobile.\n function displayMobileNavbar() {\n if (window.innerWidth < breakpoints.values.lg) {\n setMobileView(true);\n setMobileNavbar(false);\n } else {\n setMobileView(false);\n setMobileNavbar(false);\n }\n }\n\n /** \n The event listener that's calling the displayMobileNavbar function when \n resizing the window.\n */\n window.addEventListener(\"resize\", displayMobileNavbar);\n\n // Call the displayMobileNavbar function to set the state with the initial value.\n displayMobileNavbar();\n\n // Remove event listener on cleanup\n return () => window.removeEventListener(\"resize\", displayMobileNavbar);\n }, []);\n\n return (\n \n ({\n backgroundColor: transparent\n ? transparentColor.main\n : rgba(darkMode ? background.sidenav : white.main, 0.8),\n backdropFilter: transparent ? \"none\" : `saturate(200%) blur(30px)`,\n })}\n >\n \n \n Material Dashboard PRO\n \n \n \n \n {action &&\n (action.type === \"internal\" ? (\n \n \n {action.label}\n \n \n ) : (\n \n \n {action.label}\n \n \n ))}\n \n {mobileNavbar ? \"close\" : \"menu\"} \n \n \n \n );\n}\n\n// Setting default values for the props of DefaultNavbar\nDefaultNavbar.defaultProps = {\n transparent: false,\n light: false,\n action: false,\n};\n\n// Typechecking props for the DefaultNavbar\nDefaultNavbar.propTypes = {\n routes: PropTypes.arrayOf(PropTypes.object).isRequired,\n transparent: PropTypes.bool,\n light: PropTypes.bool,\n action: PropTypes.oneOfType([\n PropTypes.bool,\n PropTypes.shape({\n type: PropTypes.oneOf([\"external\", \"internal\"]).isRequired,\n route: PropTypes.string.isRequired,\n color: PropTypes.oneOf([\n \"primary\",\n \"secondary\",\n \"info\",\n \"success\",\n \"warning\",\n \"error\",\n \"dark\",\n \"light\",\n ]),\n label: PropTypes.string.isRequired,\n }),\n ]),\n};\n\nexport default DefaultNavbar;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\nimport { useEffect } from \"react\";\n\n// react-router-dom components\nimport { useLocation } from \"react-router-dom\";\n\n// prop-types is a library for typechecking of props.\nimport PropTypes from \"prop-types\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\n\n// Material Dashboard 2 PRO React context\nimport { useMaterialUIController, setLayout } from \"../../../context\";\n\nfunction PageLayout({ background, children }) {\n const [, dispatch] = useMaterialUIController();\n const { pathname } = useLocation();\n\n useEffect(() => {\n setLayout(dispatch, \"page\");\n }, [pathname]);\n\n return (\n \n {children}\n \n );\n}\n\n// Setting default values for the props for PageLayout\nPageLayout.defaultProps = {\n background: \"default\",\n};\n\n// Typechecking props for the PageLayout\nPageLayout.propTypes = {\n background: PropTypes.oneOf([\"white\", \"light\", \"default\"]),\n children: PropTypes.node.isRequired,\n};\n\nexport default PageLayout;\n","/**\n=========================================================\n* Material Dashboard 2 PRO React - v2.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard-pro-react\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\nCoded by www.creative-tim.com\n\n =========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n*/\nimport React from \"react\";\n\n// prop-types is a library for typechecking of props\nimport PropTypes from \"prop-types\";\n\n// @mui material components\nimport Grid from \"@mui/material/Grid\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../../MDBox\";\nimport MDTypography from \"../../MDTypography\";\n\n// Material Dashboard 2 PRO React example components\nimport DefaultNavbar from \"../../Navbars/DefaultNavbar\";\nimport PageLayout from \"../PageLayout\";\n\n// Material Dashboard 2 PRO React page layout routes\n//import pageRoutes from \"page.routes\";\n\n// Material Dashboard 2 PRO React context\nimport { useMaterialUIController } from \"../../../context\";\n\nfunction IllustrationLayout({ header, title, description, illustration, children, xlsize, heightauto }) {\n const [controller] = useMaterialUIController();\n const { darkMode } = controller;\n\n return (\n \n {/*\n darkMode ? background.default : white.main,\n }}\n >\n \n \n \n \n \n {!header ? (\n <>\n \n \n {title}\n \n \n \n {description}\n \n \n ) : (\n header\n )}\n \n {children} \n \n \n \n \n );\n}\n\n// Setting default values for the props of IllustrationLayout\nIllustrationLayout.defaultProps = {\n header: \"\",\n title: \"\",\n description: \"\",\n illustration: \"\",\n};\n\n// Typechecking props for the IllustrationLayout\nIllustrationLayout.propTypes = {\n header: PropTypes.node,\n title: PropTypes.string,\n description: PropTypes.string,\n children: PropTypes.node.isRequired,\n illustration: PropTypes.string,\n};\n\nexport default IllustrationLayout;\n","import React from 'react';\r\n\r\n// nodejs library to set properties for components\nimport PropTypes from \"prop-types\";\r\n\r\nimport { useTranslation } from 'react-i18next';\r\n\r\n\r\nimport CookieConsent from \"react-cookie-consent\";\r\n\nexport default function OthelloCookieConsent({ ...props }) {\r\n\r\n const { t } = useTranslation();\r\n\r\n const { } = props;\r\n\r\n \r\n return (\n {t(\"_consentimientocookies\")}\n \r\n );\r\n}\n\nOthelloCookieConsent.propTypes = {\n \n};\n","import React from \"react\";\nimport MDBox from \"../components/MDBox\";\nimport MDTypography from \"../components/MDTypography\";\r\n\n\nexport default function ErrorPage() { \n return (\n \n \n \n \n 404\n \n \n \n \n age not found :(\n \n \n \n \n Ooooups! Looks like you got lost.\n \n \n \n \n );\n}\n","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\r\n\nimport { useTranslation } from 'react-i18next';\n\nimport OthelloVersionWeb from \"../componentsothello/OthelloVersionWeb.jsx\";\n\n// Material Dashboard 2 PRO React components\nimport MDBox from \"../components/MDBox\";\nimport MDTypography from \"../components/MDTypography\";\nimport MDInput from \"../components/MDInput\";\nimport MDButton from \"../components/MDButton\";\n\nimport Link from \"@mui/material/Link\";\n\nimport Button from \"../components/Button.jsx\";\n\nimport { CircularProgress } from \"@mui/material\";\n\nimport Grid from \"@mui/material/Grid\";\n\n\nexport default function RememberPass({ ...props }) {\n // const { classes, t } = this.props;\n const { t } = useTranslation();\n\n const navigate = useNavigate();\n\n const [submitted, setsubmitted] = useState(false);\n const [error, seterror] = useState(0); \n const [modoapps, setmodoapps] = useState(window.location.pathname.indexOf(\"/authapps\") !== -1)\n\n const [loading, setLoading] = useState(false);\n\n const handleClick = (event) =>\n {\n event.preventDefault();\r\n\n let formulario = document.getElementById('formlogin');\r\n let data = new FormData(formulario);\n\r\n setLoading(true);\r\n\r\n fetch('api/Data/RecordarPassUsuario', {\n method: 'POST',\n body: data,\n\n }).then(response => response.json()).then(res => {\r\n //Si hubo error\r\n if (!res)\r\n {\r\n setLoading(false); \r\n setsubmitted(true);\r\n seterror(1);\r\n }\r\n else {\r\n if (modoapps)\r\n window.location.assign('/authapps/loginapp');\r\n //navigate('/authapps/loginapp');\r\n //this.props.history.push('/authapps/loginapp');\r\n else\r\n window.location.assign('/auth/login');\r\n //navigate('auth/login');\r\n //this.props.history.push('/auth/login');\r\n //window.location.assign('/admin/dashboard');\r\n }\r\n }).catch(error => {\r\n setsubmitted(true);\r\n seterror(2);\r\n });\r\n }\n\n const handleCancekClick = () =>\n {\n if (modoapps)\r\n window.location.assign('/authapps/loginapp'); \r\n else\r\n window.location.assign('/auth/login');\n \n //props.history.push('/auth/login');\n }\n\n return (\n \n );\n}\n","/**\n All of the routes for the Material Dashboard 2 PRO React are added here,\n You can add a new route, customize the routes and delete the routes here.\n\n Once you add a new route on this file it will be visible automatically on\n the Sidenav.\n\n For adding a new route you can follow the existing routes in the routes array.\n 1. The `type` key with the `collapse` value is used for a route.\n 2. The `type` key with the `title` value is used for a title inside the Sidenav.\n 3. The `type` key with the `divider` value is used for a divider between Sidenav items.\n 4. The `name` key is used for the name of the route on the Sidenav.\n 5. The `key` key is used for the key of the route (It will help you with the key prop inside a loop).\n 6. The `icon` key is used for the icon of the route on the Sidenav, you have to add a node.\n 7. The `collapse` key is used for making a collapsible item on the Sidenav that contains other routes\n inside (nested routes), you need to pass the nested routes inside an array as a value for the `collapse` key.\n 8. The `route` key is used to store the route location which is used for the react router.\n 9. The `href` key is used to store the external links location.\n 10. The `title` key is only for the item with the type of `title` and its used for the title text on the Sidenav.\n 10. The `component` key is used to store the component of its route.\n*/\r\nimport React from \"react\";\r\nimport ErrorPage from \"./view/ErrorPage.js\";\r\n\r\nimport LoginPage from \"./view/LoginPage.jsx\";\r\nimport RememberPass from \"./view/RememberPass.js\";\r\n\r\n\r\n\nvar dashRoutesAuth = [\n {\n path: \"/rememberpass\",\n name: \"ATMovilidad Mobile Apps recuperacion password\",\n component: \n \n Aplicaciones Turisticas en Movilidad \n \n \n {getRoutes(routes)}\n \n \n \n \n \n \n Bienvenido a ATMovilidad Mobile Apps \n \n \n {getRoutes(routes)}\n \n \n \n \n \r\n 0 ? props.items : []}\r\n value={valueselected != null ? valueselected : (multiple != null && multiple ? [] : null )}\r\n getOptionLabel={(option) => option[getCampoBusqueda(indexcampoBusqueda)]}\r\n onChange={onTagsChange} \r\n defaultValue={null}\r\n renderOption={(props, option, { selected }) => (\r\n \r\n {multiple != null && multiple ?\r\n {option[x.fieldname]}
)\r\n : {option.name} \r\n }\r\n )}\r\n renderInput={(params) => \r\n
\r\n {visibefield ? {getFieldLiteralName(indexcampoBusqueda)}
: null}\r\n \r\n );\r\n}\r\n\r\n\r\nOthelloEditComboBox.propTypes = {\r\n\r\n labelliteral: PropTypes.string,\r\n label: PropTypes.string,\r\n fieldname: PropTypes.string,\r\n currentvalue: PropTypes.object,\r\n readonly: PropTypes.bool, \r\n items: PropTypes.object.isRequired, //Los items debe implementar IFiltroModel\r\n //Evento que salta al seleccionar un item\r\n onChange: PropTypes.object,\r\n //Array de clse { fieldname: \"campo\", fieldliteralname: \"_nombre\", width : 250 }\r\n othellocolumnas: PropTypes.object, \r\n //Para tratar si es una lista de checks\r\n multiple: PropTypes.bool \r\n}; ","import {\n container,\n cardTitle,\n whiteColor,\n grayColor\n} from \"../../material-dashboard-pro-react.jsx\";\n\nconst loginPageStyle = theme => ({\n container: {\n ...container,\n zIndex: \"4\",\n [theme.breakpoints.down(\"sm\")]: {\n paddingBottom: \"100px\"\n }\n },\n cardTitle: {\n ...cardTitle,\n color: whiteColor\n },\n textCenter: {\n textAlign: \"center\"\n },\n justifyContentCenter: {\n justifyContent: \"center !important\"\n },\n customButtonClass: {\n \"&,&:focus,&:hover\": {\n color: whiteColor\n },\n marginLeft: \"5px\",\n marginRight: \"5px\"\n },\n inputAdornment: {\n marginRight: \"18px\"\n },\n inputAdornmentIcon: {\n color: grayColor[6]\n },\n cardHidden: {\n opacity: \"0\",\n transform: \"translate3d(0, -60px, 0)\"\n },\n cardHeader: {\n marginBottom: \"20px\"\n },\n socialLine: {\n padding: \"0.9375rem 0\"\n }\n});\n\nexport default loginPageStyle;\n","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\n\nimport PropTypes from \"prop-types\";\n\nimport { Link } from \"react-router-dom\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\n\n// core components\nimport Grid from \"@mui/material/Grid\";\nimport Card from \"@mui/material/Card\";\n\nimport Button from \"../components/Button.jsx\";\n\nimport OthelloComboBox from '../componentsothello/OthelloComboBox.jsx';\nimport OthelloEditComboBox from '../componentsothello/OthelloEditComboBox.jsx';\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\nimport OthelloModalBase from \"../componentsothello/OthelloModalBase.jsx\";\n\nimport loginPageStyle from \"../assets/jss/material-dashboard-pro-react/views/loginPageStyle.jsx\";\n\nimport nacionalidades from \"../assets/nacionalidades.json\";\nimport provincias from \"../assets/provincias.json\";\n\n\nimport { DialogOthelloResult, TipoPreguntaEncuenta, OpcionComboBienMalRegularEncuesta, OpcionEstrellasEncuesta, OpcionSiNoEncuesta, OpcionComboUnoDiezEncuesta, PopUpResult, Visibilidad, TipoValidacionEncuenta, DataStateModal, ModoModal} from \"../othelloConstantes.jsx\";\nimport OthelloEdit from \"../componentsothello/OthelloEdit.jsx\";\r\n\r\nimport { Helmet } from 'react-helmet'\r\nimport OthelloPrimary from \"../componentsothello/OthelloPrimary.jsx\";\r\nimport OthelloTituloPanelData from \"../componentsothello/OthelloTituloPanelData.jsx\";\nimport MDBox from \"../components/MDBox/index.js\";\r\n\nexport default function FormularioEncuesta({ ...props }) {\r\n const { literal, idRol, tipooficina, loginmodoreserva, loginapps, idUser } = props;\n\n //ejemplo url\n //https://gestor.ovtspain.es/formulario/encuesta?id={Id_Oficina}-{tokenid}&data={dataencodedbase64}\"\n\n const navigate = useNavigate();\n\r\n const { search } = useLocation();\n\n const [loading, setLoading] = React.useState(true);\n\n const [idofi, setidofi] = React.useState(-1);\n const [idenc, setidenc] = React.useState(-1);\n const [preselecccion, setpreseleccion] = React.useState(\"\");\n const [data, setdata] = React.useState(null);\n const [encuesta, setencuesta] = React.useState(null);\n\n const [guardandoencuesta, setguardandoencuesta] = React.useState(false);\n const [encuestafinalizada, setencuestafinalizada] = React.useState(false);\n const [validado, setvalidado] = React.useState(false);\n const [stateModal, setstateModal] = React.useState(DataStateModal.dsClosed);\n const [modomodal, setmodomodal] = React.useState(null);\n\n const [codigo, setcodigo] = React.useState(\"\");\n const [dataeditando, setdataeditando] = React.useState(null);\n\n const [alert, setalert] = React.useState(null);\n const [alertaopcion, setalertaopcion] = React.useState(null);\n\n const getColumnasProvincias = () => { \r\n return [{ fieldname: \"name\", fieldliteralname: \"_nombre\", width: 300 }]\r\n } \n\n React.useEffect(() => {\n\n let url = search;\r\n let params = new URLSearchParams(url);\n\n let identificador = params.get('id');\n let dt = params.get('data'); \n\n let idsplit = identificador.split('-');\n\n setidofi(idsplit[0]);\n setidenc(idsplit[1]);\n\n let preselec = \"\";\n\n if (idsplit.length >= 2) {\n preselec = idsplit[2]; \n setpreseleccion(preselec);\n }\n\n setdata(dt);\n \n getDataPage(idsplit[0], idsplit[1], preselec, dt);\n }, [loading]);\n\n const getDataPage = (idofi, idenc, preselec, data) => {\n if (idofi != null && data != null && idenc != null) {\n var jsonData = JSON.stringify({ idofi: idofi, idenc: idenc, data: data, preselected: preselec });\r\n\r\n fetch('api/Data/GetEncuestaFormulario', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (res != null) {\r\n setencuesta(res);\r\n setLoading(false);\r\n }\r\n else {\r\n setencuesta({ id_Encuesta: -1 });\r\n setLoading(false);\r\n }\r\n }).catch(error => {\r\n setencuesta({ id_Encuesta: -1 });\r\n setLoading(false);\r\n });\n }\n }\n\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n setalertaopcion(null);\r\n }\n\n const othelloModalResul = (modo, result, valor) =>\r\n {\r\n if (result == DialogOthelloResult.OK) {\r\n var object = \"\";\r\n let formulariovalida = document.getElementById('formvalidacion');\r\n let formvalida = new FormData(formulariovalida);\r\n formvalida.forEach((value, key) => { object += value + \"|\" });\r\n\r\n codigo = object;\r\n\r\n if (object != \"\")\r\n SendEncuesta();\r\n else {\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(\"\");\r\n }\r\n }\r\n else {\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(\"\");\r\n } \r\n }\n\n const SendEncuesta = () => {\r\n\r\n let res = \"\";\r\n let formulario = document.getElementById('formencuesta');\r\n let formdata = new FormData(formulario);\r\n let tipovalidacion = -1;\r\n\r\n var object = {};\r\n formdata.forEach((value, key) => {\r\n\r\n res += key + '=' + value + '|';\r\n\r\n if (key == \"tipovalidacion\")\r\n tipovalidacion = value;\r\n\r\n object[key] = value;\r\n });\r\n\r\n //Guardo los datos introducidos por el usuario\r\n setdataeditando({ ...object });\r\n\r\n if (res != null && res != \"\") {\r\n if (stateModal == DataStateModal.dsClosed && encuesta.tipoValidacion != TipoValidacionEncuenta.SinValidacion) {\r\n setstateModal(DataStateModal.dsOpen);\r\n setmodomodal(\"login\");\r\n }\r\n else {\r\n var jsonData = JSON.stringify({ idofi: encuesta.id_Oficina, idenc: encuesta.id_Encuesta, codigo: codigo, data: res, tipovalidacion: tipovalidacion });\r\n\r\n setguardandoencuesta(true);\r\n\r\n fetch('api/Data/GuardarEncuesta', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res != null) {\r\n //Si hubo error\r\n if (res.grabada) {\r\n setalert(PopUpResult.OK);\r\n setguardandoencuesta(false);\r\n setencuestafinalizada(true);\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n }\r\n else {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(res.error);\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n }\r\n }\r\n else {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(\"Error interno al grabar la encuesta\");\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n }\r\n \r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(\"Error interno al grabar la encuesta\");\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n });\r\n }\r\n }\r\n else {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(\"Error interno al grabar la encuesta\");\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n } \r\n }\n\n function getPreguntaSegunTipo(id, tipo, valor, opcionesCombo, rowsTextoLibre, defaultValue)\n {\n if (tipo == TipoPreguntaEncuenta.ComboBienMalRegular)\n return 0 ? opcionesCombo[0].valor : \"\")} />\n else if (tipo == TipoPreguntaEncuenta.TextoLibre)\n return 0 ? opcionesCombo[0].valor : \"\")} /> \n else\n return \"\";\n }\n\n\n function renderPreguntasEncuestas(encuesta) {\n\n let res = encuesta.preguntas.map(x => {\n\r\n let id = x.id_Question + \"_\" + x.tipo + \"_\" + x.pregunta;\r\n\r\n let valor = dataeditando != null ? dataeditando[id] : null;\r\n\r\n let opcionesCombo = (x.tipo == TipoPreguntaEncuenta.Combo || x.tipo == TipoPreguntaEncuenta.PreSelecOpcion) && x.opciones != null && x.opciones != \"\" ? x.opciones.split(\"|\") : \"\";\r\n let combofinal = [];\r\n\r\n if (opcionesCombo != null && opcionesCombo.length > 0) {\r\n opcionesCombo.forEach(y => combofinal.push({ valor: y, name: y }));\r\n }\r\n\r\n let rowsTextoLibre = x.tipo == TipoPreguntaEncuenta.TextoLibre && x.opciones != null && x.opciones != \"\" ? parseInt(x.opciones, 3) : 3;\r\n\r\n let visibilidad = true;\n let valorpreselected = -1;\n\n if (x.tipo == TipoPreguntaEncuenta.PreSelecOpcion && preselecccion != null && combofinal != null && combofinal.length > 0)\n {\r\n if (combofinal.some(x => x.valor.toLowerCase() == preselecccion.toLowerCase()))\r\n {\r\n valorpreselected = combofinal.find(x => x.valor.toLowerCase() == preselecccion.toLowerCase()).valor;\r\n visibilidad = false;\r\n }\r\n }\r\n\r\n if (visibilidad) {\r\n return <>\n \n {x.pregunta} \n {getPreguntaSegunTipo(id, x.tipo, valor, combofinal, rowsTextoLibre, x.defaultValue)}\n \r\n \r\n }\r\n else {\r\n return \n \n {encuesta.visible == Visibilidad.Si ?\n : Encuesta no disponibile en estos momentos
\n }\n \n )\n }\n else\n return No se pudo mostrar el formulario, intentelo mas tarde
\n }\n\n function renderModalValidacionLogin()\n {\n return (\n Realice la validacion de su encuesta mediante Login );\n }\n\n let cargando = loading ?
: \"\"; \n\n let alertafinal = alert != null ? \n {alertafinal}\n {modal}\n \n {!loading ? encuesta.nombreOficina + \" - \" + encuesta.nombre : \"Encuesta\"} \n \n \n {!loading ? encuesta.nombreOficina + \" \" + (preselecccion != null && preselecccion != \"\" ? \" - \"+ preselecccion: \"\" ): \"\"} \n {loading ? cargando : renderFormularioEncuesta(encuesta, encuestafinalizada)}\n
\n );\n}\n","import React from \"react\";\r\nimport ErrorPage from \"./view/ErrorPage\";\r\n\r\nimport FormularioEncuesta from \"./view/FormularioEncuesta\";\r\n\r\n\nvar dashRoutesFormularios = [\n {\n path: \"/encuesta\",\n name: \"Encuesta\",\n component: \n \n Encuesta Satisfaccion \n \n \n {getRoutes(routes)}\n \n \n \n \n );\n}\n\nexport default LayoutFormularios;","export default __webpack_public_path__ + \"static/media/back4.de63dc9f.jpg\";","export default __webpack_public_path__ + \"static/media/ejemplo.50931e3c.jpg\";","import React, { useState } from \"react\";\n\nimport { useNavigate, useLocation } from \"react-router-dom\";\n\nimport { Link } from \"react-router-dom\";\n\n// @mui/material components\n\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Divider from \"@mui/material/Divider\";\n\nimport back1 from \"../assets/images/back1.png\";\nimport back2 from \"../assets/images/back2.png\";\nimport back3 from \"../assets/images/back3.png\";\nimport back4 from \"../assets/images/back4.jpg\";\nimport ejemplo from \"../assets/images/ejemplo.jpg\";\n\n// core components\nimport Grid from \"@mui/material/Grid\";\nimport Icon from \"@mui/material/Icon\";\nimport Room from \"@mui/icons-material/Room\";\nimport CheckCircleOutline from \"@mui/icons-material/CheckCircleOutline\";\nimport AutoStories from \"@mui/icons-material/AutoStories\";\nimport QuestionAnswer from \"@mui/icons-material/QuestionAnswer\";\nimport TipsAndUpdates from \"@mui/icons-material/TipsAndUpdates\";\n\nimport ImageUpload from \"../components/ImageUpload.jsx\";\n\nimport OthelloPopUpResult from \"../componentsothello/OthelloPopUpResult.jsx\";\nimport OthelloModalBase from \"../componentsothello/OthelloModalBase.jsx\";\nimport OthelloMensaje from \"../componentsothello/OthelloMensaje\";\n\n\nimport { DialogOthelloResult, TipoPreguntaEncuenta, PopUpResult, Visibilidad, TipoValidacionEncuenta, DataStateModal, ModoModal, MessageOthelloBoxButtons } from \"../othelloConstantes.jsx\";\nimport { GetGoogleMaps } from \"../othelloFunciones.jsx\";\n\nimport OthelloEdit from \"../componentsothello/OthelloEdit.jsx\";\r\n\r\nimport { Helmet } from 'react-helmet'\r\nimport OthelloPrimary from \"../componentsothello/OthelloPrimary.jsx\";\nimport MDBox from \"../components/MDBox/index.js\";\r\nimport MDTypography from \"../components/MDTypography/index.js\";\r\nimport MDButton from \"../components/MDButton/index.js\";\r\nimport MDBadge from \"../components/MDBadge/index.js\";\r\nimport MDInput from \"../components/MDInput/index.js\";\r\nimport MDAvatar from \"../components/MDAvatar/index.js\";\r\n\r\n\r\n\nexport default function FormularioJuego({ ...props }) {\r\n const { literal, idRol, tipooficina, loginmodoreserva, loginapps, idUser } = props;\n\n //ejemplo url\n //https://gestor.ovtspain.es/formulario/encuesta?id={Id_Oficina}-{tokenid}&data={dataencodedbase64}\"\n\n const navigate = useNavigate();\n\r\n const { search } = useLocation();\n\n const [loading, setLoading] = React.useState(true);\n\n const [height, setHeight] = React.useState(1024);\n const [idofi, setidofi] = React.useState(-1);\n const [idenc, setidenc] = React.useState(-1); \n const [data, setdata] = React.useState(null);\n const [encuesta, setencuesta] = React.useState(null);\n\n const [mapaopen, setmapaopen] = React.useState(false);\n const [pistasopen, setpistasopen] = React.useState(false);\n const [pistashowed, setpistashowed] = React.useState(0);\n\n const [currentstepiniciojuego, setcurrentstepiniciojuego] = React.useState(-1);\n\n const [modoinfoinicial, setmodoinfoinicial] = React.useState(true);\n const [modoinforespuestaok, setmodoinforespuestaok] = React.useState(false);\n const [currentstep, setcurrentstep] = React.useState(-1);\n const [stateModalReiniciar, setstateModalReiniciar] = React.useState(DataStateModal.dsClosed);\n\n const [guardandoencuesta, setguardandoencuesta] = React.useState(false);\n const [encuestafinalizada, setencuestafinalizada] = React.useState(false);\n const [validado, setvalidado] = React.useState(false);\n const [stateModal, setstateModal] = React.useState(DataStateModal.dsClosed);\n const [modomodal, setmodomodal] = React.useState(null);\n\n const [codigo, setcodigo] = React.useState(\"\");\n const [dataeditando, setdataeditando] = React.useState(null);\n\n const [alert, setalert] = React.useState(null);\n const [alertaopcion, setalertaopcion] = React.useState(null); \n\n React.useEffect(() =>\n {\n let url = search;\r\n let params = new URLSearchParams(url);\n\n let identificador = params.get('id');\n let dt = params.get('data'); \n\n let idsplit = identificador.split('-');\n\n setidofi(idsplit[0]);\n setidenc(idsplit[1]); \n setHeight(window.innerHeight);\n\n setdata(dt);\n \n getDataPage(idsplit[0], idsplit[1], dt);\n }, [loading]);\n \n const getDataPage = (idofi, idenc, data) => {\n if (idofi != null && data != null && idenc != null) {\n var jsonData = JSON.stringify({ idofi: idofi, idenc: idenc, data: data, preselected: \"\" });\r\n\r\n fetch('api/Data/GetEncuestaFormulario', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n\r\n if (res != null) {\r\n setencuesta(res);\r\n setLoading(false);\r\n }\r\n else {\r\n setencuesta({ id_Encuesta: -1 });\r\n setLoading(false);\r\n }\r\n }).catch(error => {\r\n setencuesta({ id_Encuesta: -1 });\r\n setLoading(false);\r\n });\n }\n }\n\n const onClosePopUpResult = () => {\r\n setalert(null);\r\n setalertaopcion(null);\r\n }\n\n const othelloModalResul = (modo, result, valor) =>\r\n {\r\n if (result == DialogOthelloResult.OK) {\r\n var object = \"\";\r\n let formulariovalida = document.getElementById('formvalidacion');\r\n let formvalida = new FormData(formulariovalida);\r\n formvalida.forEach((value, key) => { object += value + \"|\" });\r\n\r\n codigo = object;\r\n\r\n if (object != \"\")\r\n SendEncuesta();\r\n else {\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(\"\");\r\n }\r\n }\r\n else {\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(\"\");\r\n } \r\n }\n\n const othelloModalResulReiniciar = (modo, result, valor) => {\r\n if (result == DialogOthelloResult.OK)\r\n window.location.reload();\r\n\r\n setstateModalReiniciar(DataStateModal.dsClosed);\r\n }\n\n const NextStepInicioJuego = () => {\n \n let paso = currentstepiniciojuego + 1;\n\n if (paso <= 3)\n setcurrentstepiniciojuego(paso);\n else\n setcurrentstep(0);\n }\n \n\n const NextQuestion = () => {\n\n if (modoinfoinicial) {\n setmodoinfoinicial(false);\r\n }\n else {\n let paso = currentstep + 1;\n setmodoinforespuestaok(false);\n setmodoinfoinicial(true);\n setcurrentstep(paso);\n }\n }\n\n const ResponderPregunta = (e) =>\n {\n if (encuesta != null && encuesta.id_Encuesta > 0) {\n if (encuesta.visible == Visibilidad.Si) {\r\n if (encuesta.preguntas != null && encuesta.preguntas.length > 0) {\r\n let pistaActual = encuesta.preguntas[currentstep];\n\n if (pistaActual != null) {\n\r\n let respuesta = document.getElementById('respuesta');\r\n\r\n if (respuesta != null && respuesta.value != null && respuesta.value != \"\")\r\n {\r\n //Si la respuesta es correcta\r\n if (respuesta.value.toLowerCase() == pistaActual.defaultValue.toLowerCase())\r\n {\r\n setmapaopen(false);\n setpistasopen(false);\n setpistashowed(0);\r\n setmodoinforespuestaok(true);\r\n /* let paso = currentstep + 1;\n setmapaopen(false);\n setpistasopen(false);\n setpistashowed(0);\n setmodoinfoinicial(true);\n setcurrentstep(paso);*/\r\n }\r\n else {\r\n\r\n }\r\n }\r\n }\n }\r\n }\r\n } \n }\n\n const ReiniciarJuego = (e) =>\n {\n setstateModalReiniciar(DataStateModal.dsOpen);\n }\n\n const BotonMapa = (e) => {\n\n setmapaopen(!mapaopen);\n }\n\n \n const BotonPistas = (e) => {\n\n setpistasopen(!pistasopen);\n }\n\n const NextPistas = () => {\n\n setpistashowed(pistashowed +1);\n }\n\n const SendEncuesta = () => {\r\n\r\n let res = \"\";\r\n let formulario = document.getElementById('formencuesta');\r\n let formdata = new FormData(formulario);\r\n let tipovalidacion = -1;\r\n\r\n var object = {};\r\n formdata.forEach((value, key) => {\r\n\r\n res += key + '=' + value + '|';\r\n\r\n if (key == \"tipovalidacion\")\r\n tipovalidacion = value;\r\n\r\n object[key] = value;\r\n });\r\n\r\n //Guardo los datos introducidos por el usuario\r\n setdataeditando({ ...object });\r\n\r\n if (res != null && res != \"\") {\r\n if (stateModal == DataStateModal.dsClosed && encuesta.tipoValidacion != TipoValidacionEncuenta.SinValidacion) {\r\n setstateModal(DataStateModal.dsOpen);\r\n setmodomodal(\"login\");\r\n }\r\n else {\r\n var jsonData = JSON.stringify({ idofi: encuesta.id_Oficina, idenc: encuesta.id_Encuesta, codigo: codigo, data: res, tipovalidacion: tipovalidacion });\r\n\r\n setguardandoencuesta(true);\r\n\r\n fetch('api/Data/GuardarEncuesta', {\n method: 'POST',\r\n headers: {\r\n 'Accept': 'application/json',\r\n 'Content-Type': 'application/json',\r\n },\r\n body: jsonData\n\n }).then(response => response.json()).then(res => {\r\n if (res != null) {\r\n //Si hubo error\r\n if (res.grabada) {\r\n setalert(PopUpResult.OK);\r\n setguardandoencuesta(false);\r\n setencuestafinalizada(true);\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n }\r\n else {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(res.error);\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n }\r\n }\r\n else {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(\"Error interno al grabar la encuesta\");\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n }\r\n \r\n }).catch(error => {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(\"Error interno al grabar la encuesta\");\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n });\r\n }\r\n }\r\n else {\r\n setalert(PopUpResult.KO);\r\n setguardandoencuesta(false);\r\n setalertaopcion(\"Error interno al grabar la encuesta\");\r\n setstateModal(DataStateModal.dsClosed);\r\n setmodomodal(null);\r\n } \r\n }\n\r\n function renderInicioJuego() {\r\n\r\n let textoShow = \"\";\r\n\r\n if (currentstepiniciojuego == -1)\r\n textoShow = \"\";\r\n else if (currentstepiniciojuego == 0)\r\n textoShow = encuesta.infoInicial;\r\n else if (currentstepiniciojuego == 1)\r\n textoShow = encuesta.descripcion;\r\n else if (currentstepiniciojuego == 2)\r\n textoShow = encuesta.infoAdicional;\r\n else if (currentstepiniciojuego == 3)\r\n textoShow = \"Siempre tienes las opcion de utilizar las pista que te proporciona. Basta con pulsar el boton de la bombilla.Tambien tienes el boton de mapa para que no os perdais. \n NextStepInicioJuego(e)} fullWidth>\n Continuar\n \n ;\r\n else\r\n return \r\n \n \n {encuesta.nombre}\n \n \r\n \r\n \r\n {textoShow}\r\n \r\n \r\n \n NextStepInicioJuego(e)} fullWidth>\n Continuar\n \n \r\n ;\r\n }\r\n\n function renderPreguntasJuego()\n {\n if (encuesta.preguntas != null && encuesta.preguntas.length > 0)\r\n {\r\n let pasoActual = encuesta.preguntas[currentstep];\r\n\n return (<>\n {renderCabeceroOpcionesJuego()}\n {renderInfoInicialPregunta(pasoActual)}\n {renderPreguntasPistas(pasoActual)}\r\n {renderZonaContestarPreguntas(pasoActual)}\r\n );\r\n }\r\n else\r\n return El juego no tiene ninguna prueba disponibile en estos momentos
\n }\n\n function renderCabeceroOpcionesJuego()\n {\n if (modoinfoinicial && currentstep == 0)\n return \"\";\n else {\n let PistasItem = [];\r\n\r\n encuesta.preguntas.forEach((x, index) => { PistasItem.push(\n \n ReiniciarJuego(e)}>\r\n home \r\n \n \n \n \n modoinfoinicial || modoinforespuestaok ? null : BotonMapa(e)} >\r\n room \r\n \n \n \n modoinfoinicial || modoinforespuestaok ? null : BotonPistas(e)} >\r\n tips_and_updates \r\n \n \n \n \n \n {PistasItem} \n \r\n ;\r\n }\r\n }\n\n function renderInfoInicialPregunta(pistaActual)\n {\n if (modoinfoinicial)\r\n {\r\n if (mapaopen) {\r\n return renderMapaUbicacion(pistaActual);\r\n }\r\n else {\r\n return \r\n \n \n Introduccion\n \n \r\n \r\n \r\n {pistaActual.infoInicial}\r\n \r\n \r\n \r\n BotonMapa(e)}\r\n /*src={logoMille}*/\r\n alt={\"\"}\r\n size=\"lg\"\r\n variant=\"rounded\"\r\n bgColor={\"secondary\"}\r\n sx={{ p: 5, mt: 2, mb: 2, mr: 0, borderRadius: ({ borders: { borderRadius } }) => borderRadius.xl }}\r\n >\r\n \r\n \n NextQuestion(e)} fullWidth>\n Continuar\n {/*Continuar */}\r\n {/*chevron_right */}\n \n \r\n ;\r\n }\r\n }\r\n else\r\n return \"\";\r\n }\n\n function renderMapaUbicacion(pistaActual)\n { \n return <>\r\n \n \n \n BotonMapa(e)}>\r\n undo \r\n \n \n \n \n \n \n {GetGoogleMaps(pistaActual != null ? pistaActual.lat : 0, pistaActual != null ? pistaActual.lon : 0)}\r\n
\n \n \n }\n\n function renderPreguntasPistas(pistaActual) {\n\r\n if (modoinfoinicial)\r\n return \"\";\r\n else {\r\n let infoPreguntaPista = \"\";\r\n\r\n if (modoinforespuestaok) {\r\n return \r\n \n borderRadius.xl }}\r\n >\r\n \n RespuestaCORRECTA \n \n\n \r\n \n \n {pistaActual.defaultValue}\n \n \r\n \r\n \r\n {pistaActual.infoAdicional}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \n NextQuestion(e)} fullWidth>\n Continuar\n \n \r\n ;\r\n }\r\n else if (mapaopen) {\r\n return renderMapaUbicacion(pistaActual);\r\n }\r\n else {\r\n if (pistasopen) {\r\n\r\n let opcionesCombo = pistaActual.tipo == TipoPreguntaEncuenta.Pista && pistaActual.opciones != null && pistaActual.opciones != \"\" ? pistaActual.opciones.split(\"|\") : \"\";\r\n let combofinal = [];\r\n\r\n if (opcionesCombo != null && opcionesCombo.length > 0) {\r\n\r\n opcionesCombo.forEach((y, index) => {\r\n\r\n if (pistashowed >= index) {\r\n\r\n let texto = pistashowed == (opcionesCombo.length - 2) ? \"vemos la respuesta?\" : \"vemos la siguiente pista?\";\r\n\r\n combofinal.push(<>< MDTypography variant=\"body2\" fontWeight=\"regular\" color=\"black\" fontSize={15}>\r\n {y}\r\n \r\n {pistashowed == index && pistashowed < (opcionesCombo.length - 1) ? NextPistas(e)}>{texto} : \r\n {pistaActual.descripcion}\r\n \r\n }\r\n\r\n return \r\n \n \r\n \n borderRadius.xl }}\r\n > \r\n {pistasopen ? : \n {pistasopen ? \"Pistas\" : \"Informacion\"}\n \n \r\n \r\n {infoPreguntaPista}\r\n \r\n \n \n \r\n }\r\n }\r\n }\n\n function renderZonaContestarPreguntas(pistaActual)\n {\n if (modoinfoinicial)\r\n return \"\";\r\n else {\n if (mapaopen || modoinforespuestaok)\n return \"\";\n else {\n return \n \n borderRadius.xl }}\r\n >\r\n \n Adivina\n \n \n \n \n \n \n ResponderPregunta(e)} >\r\n touch_app \r\n \n \n \n ;\r\n }\n }\n }\n\n function renderJuego() {\n\n if (encuesta != null && encuesta.id_Encuesta > 0)\n {\n if (encuesta.visible == Visibilidad.Si)\n {\r\n //Si aun no estamos en el juego, es que vamos a explicarlo\r\n if (currentstep == -1)\r\n return renderInicioJuego();\r\n else\r\n return renderPreguntasJuego();\r\n }\n else\n return El juego no disponibile en estos momentos
\n }\n else\n return No se pudo cargar el juego, intentelo mas tarde
\n }\n\n function renderModalValidacionLogin()\n {\n return (\n Debe logarse para poder empezar a jugar );\n }\n\n let cargando = loading ?
: \"\"; \n\n let alertafinal = alert != null ? \n {alertafinal}\n {modal}\n {modalReinicia}\n \n {!loading ? encuesta.nombre : \"Disfruta del Juego\"} \n \n {/**/}\n {/* {!loading ? encuesta.nombreOficina + \" \" + (preselecccion != null && preselecccion != \"\" ? \" - \"+ preselecccion: \"\" ): \"\"} */}\n {loading ? cargando : renderJuego()}\n \n );\n}\n","import React from \"react\";\r\nimport ErrorPage from \"./view/ErrorPage\";\r\n\r\nimport FormularioJuego from \"./view/FormularioJuego\";\r\n\r\n\nvar dashRoutesFormularios = [\n {\n path: \"/play\",\n name: \"Juego\",\n component: \n \n Disfruta de los mejores Juegos \n \n \n {getRoutes(routes)}\n \n );\n}\n\nexport default LayoutJuego;","import React from \"react\";\r\n\r\nimport CondicionesInfoPage from \"./view/CondicionesInfoPage\";\r\nimport ErrorPage from \"./view/ErrorPage\";\r\n\nvar dashRoutesCondiciones = [ \n {\n path: \"/info\",\n name: \"Condiciones\",\n component: \n \n Condiciones Reservar \n \n \n {getRoutes(routes)}\n \n \n \n \n );\n}\n\n\nexport default LayoutCondicionesReservar;","import React from 'react';\nimport ko from 'knockout';\nimport 'devexpress-reporting/dx-webdocumentviewer';\n\n// nodejs library to set properties for components\nimport PropTypes from \"prop-types\";\n\nexport class OthelloReportViewer extends React.Component {\n constructor(props) {\n super(props);\n\n this.uri = window.location.origin+\"|\";\n this.listado = props.listado != null && props.listado != \"\" ? props.listado : \"DefaultReport\";\n this.dataurl = props.data != null && props.data != \"\" ? \"|\" + props.data : \"\";\n\n this.reportUrl = ko.observable(this.uri+ this.listado + (this.dataurl != \"\" ? this.dataurl : \"\"));\n\n this.requestOptions = {\n //host: \"http://localhost:53550/\",\n invokeAction: \"DXXRDV\" \n }; \n }\n render() {\n return (
);\n }\n componentDidMount() {\n ko.applyBindings({\n reportUrl: this.reportUrl ,\n //viewerModel: this.previewModel,\n requestOptions: this.requestOptions\n }, this.refs.viewer);\n }\n componentWillUnmount() {\n ko.cleanNode(this.refs.viewer);\n }\n};\n\n\nOthelloReportViewer.propTypes = {\n //Nombre del listado a mostrar\n listado: PropTypes.string,\n data: PropTypes.object\n}","import React from 'react';\r\nimport { OthelloReportViewer } from './OthelloReportViewer';\r\nimport OthelloWaiting from './OthelloWaiting';\r\n\r\nexport default function CPageReportViewer({ ...props })\r\n{ \r\n //Gestion de la lista de entregas traspasos\r\n const [loading, setLoading] = React.useState(true);\r\n \r\n const [data, setData] = React.useState(\"\");\r\n const [listado, setListado] = React.useState(\"\");\r\n \r\n\r\n React.useEffect(() =>\r\n {\r\n var listado = localStorage.getItem(\"pageListado\");\r\n var data = localStorage.getItem(\"pageData\");\r\n \r\n if (listado != null && listado != \"\")\r\n setListado(listado);\r\n\r\n if (data != null && data != \"\")\r\n setData(data);\r\n \r\n setLoading(false);\r\n\r\n }, [loading]);\r\n \r\n return (\r\n \r\n {loading ?
\r\n ); \r\n}\r\n\r\nCPageReportViewer.propTypes = {\r\n\r\n\r\n}\r\n","import React, { useEffect } from \"react\";\n\n// react-router components\nimport { Route, Routes, useLocation, Navigate } from \"react-router-dom\";\n\nimport { createBrowserHistory } from \"history\";\n\n// @mui material components\nimport { ThemeProvider } from \"@mui/material/styles\";\nimport CssBaseline from \"@mui/material/CssBaseline\";\r\n\r\n// Material Dashboard 2 PRO React themes\nimport theme from \"./assets/theme\";\r\n\r\nimport LayoutAdmin from './layouts/LayoutAdmin';\r\nimport LayoutAuth from './layouts/LayoutAuth';\r\nimport LayoutAuthApps from './layouts/LayoutAuthApps';\r\nimport LayoutFormularios from './layouts/LayoutFormularios';\r\nimport LayoutJuego from './layouts/LayoutJuego';\r\nimport OthelloClearCache from \"./componentsothello/OthelloClearCache.jsx\";\r\nimport LayoutCondicionesReservar from './layouts/LayoutCondicionesReservar';\r\n\r\nimport CPageReportViewer from './componentsothello/CPageReportViewer';\r\n\r\nimport './report.css'\r\n\nexport default function App() {\n\n const { pathname } = useLocation();\n\n const hist = createBrowserHistory();\n\n // Setting page scroll to 0 when changing the route\n useEffect(() => {\n document.documentElement.scrollTop = 0;\n document.scrollingElement.scrollTop = 0;\n }, [pathname]);\n\n\r\n let direccion = \"/auth/login\";\r\n\r\n if (window.location.href.includes(\"gestor.ovtspain.es\"))\r\n direccion = \"/auth/login\";\r\n else if (window.location.href.includes(\"reservas.ovtspain.es\"))\r\n direccion = \"/authapps/loginreservas\";\r\n else if (window.location.href.includes(\"account.ovtspain.es\"))\r\n direccion = \"/authapps/loginapp\";\n\n return (\n \n \n \n );\n}\r\n\r\n","// In production, we register a service worker to serve assets from local cache.\r\n\r\n// This lets the app load faster on subsequent visits in production, and gives\r\n// it offline capabilities. However, it also means that developers (and users)\r\n// will only see deployed updates on the \"N+1\" visit to a page, since previously\r\n// cached resources are updated in the background.\r\n\r\n// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.\r\n// This link also includes instructions on opting out of this behavior.\r\n\r\nconst isLocalhost = Boolean(\r\n window.location.hostname === 'localhost' ||\r\n // [::1] is the IPv6 localhost address.\r\n window.location.hostname === '[::1]' ||\r\n // 127.0.0.1/8 is considered localhost for IPv4.\r\n window.location.hostname.match(\r\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\r\n )\r\n);\r\n\r\nexport default function register () {\r\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\r\n // The URL constructor is available in all browsers that support SW.\r\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location);\r\n if (publicUrl.origin !== window.location.origin) {\r\n // Our service worker won't work if PUBLIC_URL is on a different origin\r\n // from what our page is served on. This might happen if a CDN is used to\r\n // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374\r\n return;\r\n }\r\n\r\n window.addEventListener('load', () => {\r\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\r\n\r\n if (isLocalhost) {\r\n // This is running on localhost. Lets check if a service worker still exists or not.\r\n checkValidServiceWorker(swUrl);\r\n } else {\r\n // Is not local host. Just register service worker\r\n registerValidSW(swUrl);\r\n }\r\n });\r\n }\r\n}\r\n\r\nfunction registerValidSW (swUrl) {\r\n navigator.serviceWorker\r\n .register(swUrl)\r\n .then(registration => {\r\n registration.onupdatefound = () => {\r\n const installingWorker = registration.installing;\r\n installingWorker.onstatechange = () => {\r\n if (installingWorker.state === 'installed') {\r\n if (navigator.serviceWorker.controller) {\r\n // At this point, the old content will have been purged and\r\n // the fresh content will have been added to the cache.\r\n // It's the perfect time to display a \"New content is\r\n // available; please refresh.\" message in your web app.\r\n console.log('New content is available; please refresh.');\r\n } else {\r\n // At this point, everything has been precached.\r\n // It's the perfect time to display a\r\n // \"Content is cached for offline use.\" message.\r\n console.log('Content is cached for offline use.');\r\n }\r\n }\r\n };\r\n };\r\n })\r\n .catch(error => {\r\n console.error('Error during service worker registration:', error);\r\n });\r\n}\r\n\r\nfunction checkValidServiceWorker (swUrl) {\r\n // Check if the service worker can be found. If it can't reload the page.\r\n fetch(swUrl)\r\n .then(response => {\r\n // Ensure service worker exists, and that we really are getting a JS file.\r\n if (\r\n response.status === 404 ||\r\n response.headers.get('content-type').indexOf('javascript') === -1\r\n ) {\r\n // No service worker found. Probably a different app. Reload the page.\r\n navigator.serviceWorker.ready.then(registration => {\r\n registration.unregister().then(() => {\r\n window.location.reload();\r\n });\r\n });\r\n } else {\r\n // Service worker found. Proceed as normal.\r\n registerValidSW(swUrl);\r\n }\r\n })\r\n .catch(() => {\r\n console.log(\r\n 'No internet connection found. App is running in offline mode.'\r\n );\r\n });\r\n}\r\n\r\nexport function unregister () {\r\n if ('serviceWorker' in navigator) {\r\n navigator.serviceWorker.ready.then(registration => {\r\n registration.unregister();\r\n });\r\n }\r\n}\r\n","import i18n from \"i18next\";\r\nimport { initReactI18next } from \"react-i18next\";\r\n\r\nimport translationES from './assets/translations/es.json';\r\nimport translationEN from './assets/translations/en.json';\r\nimport translationFR from './assets/translations/fr.json';\r\nimport translationIT from './assets/translations/it.json';\r\nimport translationDE from './assets/translations/de.json';\r\n\r\n// the translations\r\nconst resources = {\r\n en: {\r\n translation: translationEN\r\n },\r\n es: {\r\n translation: translationES\r\n },\r\n fr: {\r\n translation: translationFR\r\n },\r\n it: {\r\n translation: translationIT\r\n },\r\n de: {\r\n translation: translationDE\r\n }\r\n};\r\n\r\ni18n\r\n .use(initReactI18next) // passes i18n down to react-i18next\r\n .init({\r\n resources,\r\n fallbackLng: 'es',\r\n lng: \"es\",\r\n\r\n keySeparator: false, // we do not use keys in form messages.welcome\r\n\r\n interpolation: {\r\n escapeValue: false // react already safes from xss\r\n }\r\n });\r\n\r\nexport default i18n;\r\n\r\n//---------------------------------\r\n// i18n\r\n// .use(initReactI18next) // passes i18n down to react-i18next\r\n// .init({\r\n// resources,\r\n// lng: \"en\",\r\n\r\n// keySeparator: false, // we do not use keys in form messages.welcome\r\n\r\n// interpolation: {\r\n// escapeValue: false // react already safes from xss\r\n// }\r\n// });\r\n\r\n\r\n//-----------------------------------\r\n//i18n\r\n// .use(initReactI18next)\r\n// .init({\r\n// resources: {\r\n// en,\r\n// fr,\r\n// it,\r\n// de,\r\n// es,\r\n// },\r\n// fallbackLng: 'en',\r\n// debug: process.env.NODE_ENV !== 'production',\r\n// ns: ['translations'],\r\n// defaultNS: 'translations',\r\n// keySeparator: false,\r\n// interpolation: {\r\n// escapeValue: false,\r\n// formatSeparator: ',',\r\n// },\r\n// react: {\r\n// wait: true,\r\n// },\r\n// });\r\n\r\n\r\n","import 'bootstrap/dist/css/bootstrap.css';\r\nimport React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport { BrowserRouter } from 'react-router-dom';\r\nimport App from './App';\r\nimport registerServiceWorker from './registerServiceWorker';\r\nimport './i18n.js';\r\n\r\nimport { MaterialUIControllerProvider } from \"./context/index.js\";\r\n\r\nimport { ClearBrowserCacheBoundary } from 'react-clear-browser-cache';\r\n//import ErrorBoundary from './ErrorBoundary';\r\n\r\nconst baseUrl = document.getElementsByTagName('base')[0].getAttribute('href');\r\nconst rootElement = document.getElementById('root');\r\n\r\nReactDOM.render(\r\n \r\n \r\n \r\n \r\n \r\n ,\r\n rootElement);\r\n\r\nregisterServiceWorker();"],"sourceRoot":""} 
: 
}\n