\r\n TipoCatalogo(e, \"Mayorista\")}\r\n />\r\n \r\n Mayorista\r\n \r\n
\r\n \r\n TipoCatalogo(e, \"Minorista\")}\r\n />\r\n \r\n Minorista\r\n \r\n
\r\n \r\n TipoCatalogo(e, \"Todo\")}\r\n />\r\n \r\n Ambos\r\n \r\n
\r\n \r\n TipoCatalogo(e, \"SinPrecio\")}\r\n />\r\n \r\n Sin precio\r\n \r\n
\r\n \r\n
\r\n setUnidades(!unidades)}\r\n />\r\n \r\n Cantidades\r\n \r\n
\r\n \r\n handleCheck()}\r\n />\r\n \r\n Seleccionar\r\n \r\n
\r\n \r\n setMinUnidades(e.target.value)}\r\n />\r\n \r\n
\r\n \r\n {/* ![\" +\r\n codigo +\r\n \"](\" +\r\n recursosUrlState +\r\n \"/img/Productos/Ref \" +\r\n codigo +\r\n \".webp)
\";\r\n img.onerror = function () {\r\n imagen.innerHTML =\r\n \"![\" +\r\n codigo +\r\n \"](\" +\r\n recursosUrlState +\r\n \"/img/General/base.png)
\";\r\n };\r\n };\r\n\r\n const logOutVendedor = () => {\r\n localStorage.removeItem(\"Vendedor\");\r\n modificarVendedorState(null);\r\n localStorage.removeItem(\"Bodega\");\r\n setBodega(\"3\");\r\n localStorage.removeItem(\"Carrito\");\r\n window.location.href = \"/Preventa\";\r\n }\r\n\r\n const setearBodega = (bodega) => {\r\n console.log(\"Seteando bodega\")\r\n setBodega(bodega);\r\n localStorage.setItem(\"Bodega\", bodega);\r\n window.location.reload();\r\n }\r\n\r\n //Actualiza los states de cliente, el header y el carrito mediante el sessionStorage en caso de reinicio de pagina.\r\n useEffect(() => {\r\n const carritoSession = localStorage.Carrito;\r\n const clienteSession = localStorage.Cliente;\r\n const tipoClienteSession = localStorage.TipoCliente;\r\n const administradorSession = localStorage.Administrador;\r\n if (\r\n headerState[\"Cliente\"] === \"\" &&\r\n tipoClienteSession !== \"undefined\" &&\r\n tipoClienteSession !== \"\"\r\n ) {\r\n var header = JSON.parse(JSON.stringify(headerState));\r\n header[\"Cliente\"] = tipoClienteSession;\r\n modificarHeaderState(header);\r\n }\r\n if (\r\n carrito[\"Accion\"] === \"Recuperar\" &&\r\n carritoSession !== \"undefined\" &&\r\n carritoSession !== undefined &&\r\n carritoSession !== \"\"\r\n ) {\r\n modificarCarritoState({\r\n Accion: \"Activo\",\r\n Carrito: JSON.parse(carritoSession),\r\n });\r\n }\r\n if (\r\n administradorState[\"Recuperar\"] &&\r\n administradorSession !== \"undefined\" &&\r\n administradorSession !== undefined &&\r\n administradorSession !== \"\"\r\n ) {\r\n modificarAdministradorState(JSON.parse(administradorSession));\r\n }\r\n if (\r\n clienteState[\"Accion\"] === \"Recuperar\" &&\r\n clienteSession !== undefined &&\r\n clienteSession !== \"undefined\" &&\r\n clienteSession !== \"\"\r\n ) {\r\n modificarClienteState({\r\n ...JSON.parse(clienteSession),\r\n Accion: \"Activo\",\r\n });\r\n }\r\n });\r\n\r\n //Retorna el precio ingresado sin signos de peso ni puntos.\r\n // const arreglarPrecio = (precio) => {\r\n // var separacion = precio;\r\n // if (precio.indexOf(\"$\") !== -1) separacion = precio.split(\" \")[1];\r\n // var separacion2 = separacion.split(\".\");\r\n // return parseInt(separacion2[0] + separacion2[1]);\r\n // };\r\n\r\n const calcularDescuento = (precio, descuento) => {\r\n const precioInt = parseInt(precio);\r\n const descuentoAplicar = parseInt(descuento);\r\n return precioInt - precioInt * (descuentoAplicar / 100);\r\n };\r\n const consultar = (e) => {\r\n if (consultaLupa.value !== \"\") {\r\n obtenerProductosFiltro(consultaLupa.value);\r\n cerrarFiltros();\r\n }\r\n };\r\n const consultarConEnter = (e) => {\r\n if (e.key === \"Enter\" && consultaLupa.value !== \"\") {\r\n obtenerProductosFiltro(consultaLupa.value);\r\n cerrarFiltros();\r\n }\r\n };\r\n //Esta funcion reemplaza el 'webp' por 'png' en un string\r\n const cambioPng = (url) => {\r\n return url.replace(/webp/g, \"png\");\r\n };\r\n\r\n const opaco =\r\n headerState[\"Cliente\"] === \"Mayoristas\" ||\r\n LandingHeader[\"Estado\"] ||\r\n ViewDetalle[\"Estado\"]\r\n ? \"rgb(255, 255, 255, 255)\"\r\n : \"rgb(0, 0, 0, 0)\";\r\n\r\n return (\r\n <>\r\n {headerState[\"Cliente\"] === \"Mayoristas\" ? (\r\n \r\n
\r\n\r\n \r\n Venta mayorista a partir de 6 prendas\r\n
\r\n\r\n {/*
\r\n \r\n \r\n ) : (\r\n \r\n \r\n Follow Us:\r\n \r\n
*/}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n )}\r\n\r\n \r\n
\r\n \r\n \r\n {/* Envíos gratis a partir de $100.000 - Aplica compras minoristas */}\r\n
\r\n\r\n
\r\n {\r\n RutaActual !== \"/Mayoristas\" ? \r\n cerrarFiltros()}\r\n style={{ cursor: \"pointer\" }}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-izquierda-negro.png\";\r\n }}\r\n />\r\n
\r\n {/* \r\n
*/}\r\n\r\n \r\n
\r\n \r\n \r\n Buscar\r\n \r\n escribiendo(e)}\r\n onKeyPress={(e) => consultarConEnter(e)}\r\n autoComplete=\"off\"\r\n >\r\n\r\n consultar(e)}\r\n >\r\n
\r\n\r\n {\r\n RutaActual !== \"/Mayoristas\" && !vendedor ? \r\n
: null\r\n }\r\n \r\n \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(srcLogo);\r\n }}\r\n >\r\n \r\n
\r\n\r\n \r\n {localStorage.getItem(\"Vendedor\") ? (\r\n <>\r\n \r\n llevarAMinorista()}\r\n >\r\n MINORISTAS\r\n \r\n \r\n \r\n llevarAMayorista()}\r\n >\r\n MAYORISTAS\r\n \r\n \r\n\r\n
\r\n \r\n {/* {setearBodega(\"3\")}} >Bodega: Principal */}\r\n {/* {setearBodega(\"6\")}} >Bodega: Preventa */}\r\n {/* {setearBodega(\"2\")}} >Bodega: Cali */}\r\n {/* {setearBodega(\"4\")}} >Bodega: Bogotá */}\r\n Salir\r\n
\r\n \r\n ) : null}\r\n\r\n \r\n llevarAAyuda()} style={{ padding: \"0.2rem\" }}>\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Header/botones/ayuda-negro.png\";\r\n }}\r\n >\r\n
\r\n\r\n \r\n \r\n \r\n {cantidadTotal > 0 ? (\r\n
\r\n \r\n ))}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(srcBolsa);\r\n }}\r\n >\r\n \r\n {cantidadTotal}\r\n \r\n
\r\n - \r\n
\r\n {carrito[\"Carrito\"].map((producto) => (\r\n \r\n
\r\n \r\n \r\n \r\n comprobarImgProducto(\r\n producto[\"Codigo\"],\r\n producto[\"Talla\"]\r\n )\r\n }\r\n />\r\n
\r\n \r\n \r\n {\r\n return comprobarEnter(e);\r\n }}\r\n tabIndex=\"-1\"\r\n style={{\r\n fontSize: 25,\r\n marginLeft: 15,\r\n marginRight: 10,\r\n marginBottom: 10,\r\n }}\r\n onClick={() => disminuirCantidad(producto)}\r\n >\r\n -\r\n \r\n \r\n {producto[\"Cantidad\"]}\r\n \r\n {\r\n return comprobarEnter(e);\r\n }}\r\n tabIndex=\"-1\"\r\n style={{\r\n fontSize: 25,\r\n marginLeft: 10,\r\n marginRight: 10,\r\n marginBottom: 10,\r\n }}\r\n id={producto[\"Codigo\"] + producto[\"Talla\"]}\r\n onClick={(e) =>\r\n aumentarCantidad(producto, e)\r\n }\r\n >\r\n +\r\n \r\n borrarElemento(producto)}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Header/botones/papelera-negro.png\";\r\n }}\r\n />\r\n
\r\n \r\n Categoria: {producto[\"Categoria\"]}\r\n
\r\n\r\n Codigo: {producto[\"Codigo\"]}\r\n
\r\n\r\n Talla: {producto[\"Talla\"]}\r\n
\r\n\r\n Precio Und:{\" \"}\r\n {formatNumber(\r\n headerState[\"Cliente\"] === \"Mayoristas\"\r\n ? producto.DescuentoMayorista !== 0\r\n ? calcularDescuento(\r\n producto[\"PrecioMayorista\"],\r\n producto[\"DescuentoMayorista\"]\r\n )\r\n : producto[\"PrecioMayorista\"]\r\n : producto.DescuentoMinorista !== 0\r\n ? calcularDescuento(\r\n producto[\"PrecioMinorista\"],\r\n producto[\"DescuentoMinorista\"]\r\n )\r\n : producto[\"PrecioMinorista\"]\r\n )}\r\n
\r\n\r\n
\r\n \r\n \r\n ) : (\r\n \r\n
\r\n\r\n \r\n Total: $ {formatNumber(calcularTotalCarrito())}\r\n
\r\n\r\n limpiarCarrito()}\r\n >\r\n LIMPIAR\r\n \r\n
\r\n \r\n llevarAPedido()}\r\n >\r\n PAGAR\r\n \r\n
\r\n - \r\n
\r\n ¿Aún no añades nada al carrito?\r\n
\r\n\r\n {id < 5 ? (\r\n
\r\n );\r\n};\r\n\r\nexport default Carousel;\r\n","//Zona de importacion de componentes externos.\r\nimport React, { useRef, useEffect } from \"react\";\r\nimport { Scroll } from \"scroll-utility\";\r\nimport ReactPixel from \"react-facebook-pixel\";\r\n\r\n//Zona de importacion de componentes internos.\r\nimport Carousel from \"./Carousel\";\r\nimport { useGlobalContext } from \"../../providers/GlobalStatesProviders\";\r\n\r\nfunction Index({\r\n headerState,\r\n modificarHeaderState,\r\n radioButtons,\r\n modificarRadioButtons,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n // clienteState,\r\n // modificarClienteState,\r\n actualizarSessionStorage,\r\n}) {\r\n const { clienteState, modificarClienteState } = useGlobalContext();\r\n\r\n /*Los siguientes states son para la lista de banner (Carousel) que se visualiza en el Index\r\n En total son 5 carousels, cada uno tiene los siguientes atributos:\r\n id: Numero de referencia.\r\n srcImagen: ubicacion de almacenamiento de cada imagen del carousel.\r\n srcBoton: ubicacion de almacenamiento de cada imagen del boton central de cada carousel.\r\n displayArriba: estado de visualizacion de la flecha que apunta hacia arriba en cada carousel.\r\n displayAbajo: estado de visualizacion de la flecha que apunta hacia abajo en cada carousel.\r\n */\r\n ReactPixel.track(\"Home\", \"ViewContent\");\r\n const carousels = [\r\n {\r\n id: 1,\r\n srcImagen: recursosUrlState + \"/img/Index/web/carousel/fondo1\",\r\n displayArriba: \"none\",\r\n displayAbajo: \"in-line\",\r\n },\r\n {\r\n id: 2,\r\n srcImagen: recursosUrlState + \"/img/Index/web/carousel/fondo2\",\r\n displayArriba: \"in-line\",\r\n displayAbajo: \"in-line\",\r\n },\r\n {\r\n id: 3,\r\n srcImagen: recursosUrlState + \"/img/Index/web/carousel/fondo3\",\r\n displayArriba: \"in-line\",\r\n displayAbajo: \"in-line\",\r\n },\r\n {\r\n id: 4,\r\n srcImagen: recursosUrlState + \"/img/Index/web/carousel/fondo4\",\r\n displayArriba: \"in-line\",\r\n displayAbajo: \"in-line\",\r\n },\r\n {\r\n id: 5,\r\n srcImagen: recursosUrlState + \"/img/Index/web/carousel/fondo5\",\r\n displayArriba: \"in-line\",\r\n displayAbajo: \"none\",\r\n },\r\n ];\r\n\r\n const radioSeleccionado = {\r\n width: \"15px\",\r\n height: \"15px\",\r\n };\r\n\r\n const radioSinSeleccionar = {\r\n width: \"11px\",\r\n height: \"11px\",\r\n };\r\n\r\n //Contantes que hacen referencia a cada uno de los carousels del index, con el que se hara uso para la manipulacion de su visualizacion.\r\n const refCarousel1 = useRef(null);\r\n const refCarousel2 = useRef(null);\r\n const refCarousel3 = useRef(null);\r\n const refCarousel4 = useRef(null);\r\n const refCarousel5 = useRef(null);\r\n\r\n //Se extraen los atributos del state radioButtons, en total 5, cada uno con sus propiedades css.\r\n const { radio1, radio2, radio3, radio4, radio5 } = radioButtons;\r\n\r\n //Funciones para el desplazamiento auntomatico de los carousels con estilo de movimiento smooth.\r\n //Esta funcion hace que el scroll del usuario se desplace automáticamentehacia el carousel indicado.\r\n const scrollToC1 = () =>\r\n refCarousel1.current.scrollIntoView({ behavior: \"smooth\" });\r\n const scrollToC2 = () =>\r\n refCarousel2.current.scrollIntoView({ behavior: \"smooth\" });\r\n const scrollToC3 = () =>\r\n refCarousel3.current.scrollIntoView({ behavior: \"smooth\" });\r\n const scrollToC4 = () =>\r\n refCarousel4.current.scrollIntoView({ behavior: \"smooth\" });\r\n const scrollToC5 = () =>\r\n refCarousel5.current.scrollIntoView({ behavior: \"smooth\" });\r\n\r\n //Toma la posicion relativa de cada uno de los carousels por la que mediante esta, determina cual esta viendo el usuario actualmente y\r\n //se cambian las propiedades del state de radioButtons para determinar cual es el que se debe mostrar seleccionado.\r\n const revisar = () => {\r\n const relativePositionC1 = new Scroll().getRelativeElementPosition(\"#car1\");\r\n const relativePositionC2 = new Scroll().getRelativeElementPosition(\"#car2\");\r\n const relativePositionC3 = new Scroll().getRelativeElementPosition(\"#car3\");\r\n const relativePositionC4 = new Scroll().getRelativeElementPosition(\"#car4\");\r\n const relativePositionC5 = new Scroll().getRelativeElementPosition(\"#car5\");\r\n if (\r\n (relativePositionC5 === 1 && relativePositionC4 !== -0) ||\r\n relativePositionC5 === -0\r\n ) {\r\n modificarRadioButtons({\r\n radio1:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio2:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio3:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio4:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio5: recursosUrlState + \"/img/Index/web/botones/radioSeleccion.webp\",\r\n });\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Email/45441614379749154.png\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState + \"/img/Index/web/botones/flecha-derecha-negro.webp\",\r\n displayBuscar: \"none\",\r\n displayMenu: \"Index\",\r\n color: \"negro\",\r\n Seccion: \"\",\r\n Cliente: headerState[\"Cliente\"],\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n } else if (\r\n (relativePositionC4 === 1 &&\r\n relativePositionC3 !== -0 &&\r\n relativePositionC5 !== -0) ||\r\n relativePositionC4 === -0\r\n ) {\r\n modificarRadioButtons({\r\n radio1:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio2:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio3:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio4: recursosUrlState + \"/img/Index/web/botones/radioSeleccion.webp\",\r\n radio5:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n });\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Header/logos/logo-blanco.webp\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-derecha-blanca.webp\",\r\n displayBuscar: \"none\",\r\n displayMenu: \"Index\",\r\n color: \"blanco\",\r\n Seccion: \"Accesorios\",\r\n Cliente: headerState[\"Cliente\"],\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n } else if (\r\n (relativePositionC3 === 1 &&\r\n relativePositionC2 !== -0 &&\r\n relativePositionC4 !== -0) ||\r\n relativePositionC3 === -0\r\n ) {\r\n modificarRadioButtons({\r\n radio1:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio2:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio3: recursosUrlState + \"/img/Index/web/botones/radioSeleccion.webp\",\r\n radio4:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio5:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n });\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Header/logos/logo-blanco.webp\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-derecha-blanca.webp\",\r\n displayBuscar: \"none\",\r\n displayMenu: \"Index\",\r\n color: \"blanco\",\r\n Seccion: \"Inferior\",\r\n Cliente: headerState[\"Cliente\"],\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n } else if (\r\n (relativePositionC2 === 1 &&\r\n relativePositionC1 !== -0 &&\r\n relativePositionC3 !== -0) ||\r\n relativePositionC2 === -0\r\n ) {\r\n modificarRadioButtons({\r\n radio1:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio2: recursosUrlState + \"/img/Index/web/botones/radioSeleccion.webp\",\r\n radio3:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio4:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio5:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n });\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Header/logos/logo-blanco.webp\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-derecha-blanca.webp\",\r\n displayBuscar: \"none\",\r\n displayMenu: \"Index\",\r\n color: \"blanco\",\r\n Seccion: \"Superior\",\r\n Cliente: headerState[\"Cliente\"],\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n } else if (\r\n (relativePositionC1 === 1 && relativePositionC2 !== -0) ||\r\n relativePositionC1 === -0\r\n ) {\r\n modificarRadioButtons({\r\n radio1: recursosUrlState + \"/img/Index/web/botones/radioSeleccion.webp\",\r\n radio2:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio3:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio4:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n radio5:\r\n recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.webp\",\r\n });\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Header/logos/logo-blanco.webp\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-derecha-blanca.webp\",\r\n displayBuscar: \"in-line\",\r\n displayMenu: \"Index\",\r\n color: \"blanco\",\r\n Seccion: \"New\",\r\n Cliente: headerState[\"Cliente\"],\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n }\r\n };\r\n\r\n //Mediante el parametro car se determina a que carousel se debe desplazar automaticamente.\r\n const onChangeValue = (car) => {\r\n switch (car) {\r\n case \"1\":\r\n scrollToC1();\r\n break;\r\n case \"2\":\r\n scrollToC2();\r\n break;\r\n case \"3\":\r\n scrollToC3();\r\n break;\r\n case \"4\":\r\n scrollToC4();\r\n break;\r\n case \"5\":\r\n scrollToC5();\r\n break;\r\n default:\r\n scrollToC1();\r\n break;\r\n }\r\n };\r\n\r\n //Mediante el parametro url se determina la url de respuesta sustituyendo el 'webp' por el 'png'.\r\n const cambioPng = (url) => {\r\n return url.replace(/webp/g, \"png\");\r\n };\r\n const CambioProductos = (mercado) => {\r\n actualizarSessionStorage(\"TipoCliente\", mercado);\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Email/45441614379749154.png\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState + \"/img/Index/web/botones/flecha-derecha-negro.png\",\r\n displayBuscar: \"in-line\",\r\n displayMenu: \"Index\",\r\n color: \"negro\",\r\n Seccion: headerState[\"Seccion\"],\r\n Cliente: mercado,\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Email/45441614379749154.png\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState + \"/img/Index/web/botones/flecha-derecha-negro.webp\",\r\n displayBuscar: \"in-line\",\r\n displayMenu: \"Index\",\r\n color: \"negro\",\r\n Seccion: headerState[\"Seccion\"],\r\n Cliente: mercado,\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n };\r\n //Funcion que se ejecuta cada vez que se inicia este componente.\r\n //Si al iniciar la ruta del Index el campo de registro se encutra hablitado en true, este\r\n //se cambia a false y se actualiza tambien en el localStorage.\r\n useEffect(() => {\r\n CambioProductos(\"Minoristas\");\r\n if (headerState[\"Cliente\"] !== \"\") {\r\n modificarHeaderState({\r\n ...headerState,\r\n Cliente: \"\",\r\n });\r\n actualizarSessionStorage(\"TipoCliente\", \"\");\r\n }\r\n if (clienteState[\"Registro\"]) {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n Registro: false,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n Registro: false,\r\n });\r\n }\r\n }, []);\r\n\r\n /* La vista del Index se compone de la siguiente estructura: \r\n Carousel 1 (LO NUEVO)\r\n Carousel 2 (SUPERIOR)\r\n Carousel 3 (INFERIOR)\r\n Carousel 4 (ACCESORIOS)\r\n Carousel 5 (REDES)\r\n A cada carousel se le envia el correspondiente del state de carousels.\r\n Tambien se maneja el sistema de radioButtons.\r\n */\r\n return (\r\n \r\n CambioProductos(\"Minoristas\")}>\r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(imagenFlechaArriba);\r\n }}\r\n />\r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(imagenFlechaAbajo);\r\n }}\r\n />\r\n
\r\n ) : (\r\n \r\n \r\n
\r\n \r\n CambioProductos(\"Minoristas\")}>\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = srcImagen + \"Web.png\";\r\n }}\r\n />\r\n CambioProductos(\"Minoristas\")}>\r\n CambioProductos(\"Mayoristas\")}\r\n >\r\n
\r\n\r\n \r\n \r\n MINORISTAS\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(imagenFlechaIzquierda);\r\n }}\r\n />\r\n
\r\n \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(imagenFlechaDerecha);\r\n }}\r\n />\r\n \r\n MAYORISTAS\r\n \r\n
\r\n \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = srcImagen + \"Movil.png\";\r\n }}\r\n />\r\n \r\n CambioProductos(\"Minoristas\")}\r\n >\r\n MINORISTAS\r\n \r\n \r\n \r\n CambioProductos(\"Mayoristas\")}\r\n >\r\n MAYORISTAS\r\n \r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(imagenFlechaArriba);\r\n }}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(imagenFlechaAbajo);\r\n }}\r\n >\r\n
\r\n )}\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = srcImagen + \"Web.png\";\r\n }}\r\n />\r\n
\r\n\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = srcImagen + \"Movil.png\";\r\n }}\r\n />\r\n
\r\n \r\n BÚSCANOS EN REDES\r\n
\r\n\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(\r\n recursosUrlState + \"/img/Index/web/botones/fb.png\"\r\n );\r\n }}\r\n >\r\n \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(\r\n recursosUrlState + \"/img/Index/web/botones/ins.png\"\r\n );\r\n }}\r\n >\r\n \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(\r\n recursosUrlState + \"/img/Index/web/botones/pint.png\"\r\n );\r\n }}\r\n >\r\n \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(\r\n recursosUrlState + \"/img/Index/web/botones/wpp.png\"\r\n );\r\n }}\r\n >\r\n \r\n
\r\n \r\n scrollToC2()}\r\n headerState={headerState}\r\n modificarHeaderState={modificarHeaderState}\r\n recursosUrlState={recursosUrlState}\r\n modificarRecursosUrlState={modificarRecursosUrlState}\r\n actualizarSessionStorage={actualizarSessionStorage}\r\n />\r\n
\r\n\r\n \r\n scrollToC1()}\r\n toCarouselDown={() => scrollToC3()}\r\n headerState={headerState}\r\n modificarHeaderState={modificarHeaderState}\r\n recursosUrlState={recursosUrlState}\r\n modificarRecursosUrlState={modificarRecursosUrlState}\r\n actualizarSessionStorage={actualizarSessionStorage}\r\n />\r\n
\r\n\r\n \r\n scrollToC2()}\r\n toCarouselDown={() => scrollToC4()}\r\n headerState={headerState}\r\n modificarHeaderState={modificarHeaderState}\r\n recursosUrlState={recursosUrlState}\r\n modificarRecursosUrlState={modificarRecursosUrlState}\r\n actualizarSessionStorage={actualizarSessionStorage}\r\n />\r\n
\r\n\r\n \r\n scrollToC3()}\r\n toCarouselDown={() => scrollToC5()}\r\n headerState={headerState}\r\n modificarHeaderState={modificarHeaderState}\r\n recursosUrlState={recursosUrlState}\r\n modificarRecursosUrlState={modificarRecursosUrlState}\r\n actualizarSessionStorage={actualizarSessionStorage}\r\n />\r\n
\r\n\r\n \r\n scrollToC4()}\r\n headerState={headerState}\r\n modificarHeaderState={modificarHeaderState}\r\n recursosUrlState={recursosUrlState}\r\n modificarRecursosUrlState={modificarRecursosUrlState}\r\n actualizarSessionStorage={actualizarSessionStorage}\r\n />\r\n
\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nexport default Index;\r\n","//Zona de importacion de componentes externos.\r\nimport React, { useEffect, useState } from \"react\";\r\nimport swal from \"sweetalert\";\r\n\r\n//Zona de importacion de componentes internos.\r\nimport axios from \"axios\";\r\n\r\n//Zona de importacion de Css.\r\nimport \"./static/css/GrupoTallas/Tallas.css\";\r\n\r\nconst GrupoTallas = ({\r\n ViewDetalle,\r\n carrito,\r\n modificarCarritoState,\r\n producto,\r\n errorState,\r\n modificarErrorState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n headerState,\r\n modificarHeaderState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n actualizarSessionStorage,\r\n tallasState,\r\n modificarTallasState,\r\n mostar,\r\n vendedor,\r\n modificarVendedorState,\r\n Bodega,\r\n setBodega,\r\n}) => {\r\n const [tallas, setTallas] = useState([]);\r\n const [tallaSeleccionada, setTallaSelecionada] = useState([]);\r\n const [cantidad, setCantidad] = useState(0);\r\n const [adicion, setAdicion] = useState(0);\r\n\r\n /** Control del input de cantidades para que no se puedan ingresar mas de dos digitos */\r\n const handleChange = (e) => {\r\n const value = e.target.value;\r\n if (/^\\d{0,3}$/.test(value)) { // Limitar a 3 dígitos\r\n setAdicion(value);\r\n }\r\n };\r\n\r\n //Se realiza la peticion para la verificacion de un producto solicitando la cantidad de este en bodega.\r\n const ConsultarBodega = async (idProducto, codBodega) => {\r\n let res = -100;\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Agregando producto...\",\r\n });\r\n }\r\n // if (idProducto.indexOf(\"GU\") !== -1 || idProducto.indexOf(\"GFU\") !== -1)\r\n // if (idProducto.slice(-1) === \"U\")\r\n // idProducto = idProducto.slice(0, -1);\r\n\r\n\r\n let rutaVerificacion = \"/Api/Manager/VerificarProducto/\" + idProducto\r\n if (localStorage.getItem(\"Vendedor\")) {\r\n rutaVerificacion = \"/Api/Manager/VerificarProducto/\" + idProducto + `/${codBodega}`\r\n }\r\n\r\n await axios\r\n .get(\r\n apiUrlState + rutaVerificacion,\r\n {},\r\n {}\r\n )\r\n .then((response) => {\r\n if (response.data.existe) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"])\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n res = response.data.cantidad;\r\n return response.data.cantidad;\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"])\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Talla no disponible para esta referencia.\",\r\n });\r\n return -100;\r\n }\r\n })\r\n .catch(function (err) {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.error_message,\r\n });\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n }\r\n });\r\n return res;\r\n };\r\n\r\n //Retorna el precio ingresado sin signos de peso ni puntos.\r\n const arreglarPrecio = (precio) => {\r\n var separacion = precio;\r\n if (precio.indexOf(\"$\") !== -1) separacion = precio.split(\" \")[1];\r\n var separacion2 = separacion.split(\".\");\r\n return parseInt(separacion2[0] + separacion2[1]);\r\n };\r\n\r\n //Se realiza la validacion en bodega para aumentar en 1 la cantidad en carrito de este, si no existe lo crea.\r\n //Actualiza el state del carrito y tambien el sessionStorage.\r\n const adicionar = async (talla, cantidadActual) => {\r\n if (tallaSeleccionada.length !== 0) {\r\n let cantidadReal = tallaSeleccionada.Cantidad; // await ConsultarBodega(producto.Referencia + talla, producto.CodBodega);\r\n if (cantidadActual + 1 <= cantidadReal) {\r\n let crear = true;\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n if (producto.Referencia + talla === carrito[\"Carrito\"][i][\"id\"]) {\r\n carrito[\"Carrito\"][i][\"Cantidad\"] += 1;\r\n crear = false;\r\n }\r\n }\r\n if (crear) {\r\n const productoNuevo = {\r\n _id: producto._id,\r\n id: producto.Referencia + talla,\r\n Nombre: producto.Nombre,\r\n Codigo: producto.Referencia,\r\n Talla: talla,\r\n Bodega: producto.CodBodega,\r\n Categoria: producto.Categoria.Categoria,\r\n PrecioMinorista: arreglarPrecio(producto.PrecioMinorista),\r\n PrecioMayorista: arreglarPrecio(producto.PrecioMayorista),\r\n // PrecioMayoristaSinIva: Math.round(parseFloat(producto.PrecioMayoristaSinIva)),\r\n DescuentoMayorista: producto.DescuentoMayorista,\r\n DescuentoMinorista: producto.DescuentoMinorista,\r\n Cantidad: 1,\r\n };\r\n const carritoNew = [...carrito[\"Carrito\"], productoNuevo];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n } else {\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n }\r\n }\r\n }\r\n };\r\n\r\n /** Agrega las cantidades del input al carrito validando existencias */\r\n const adicionarV = async (talla, cantidadActual, cantidadAdicion) => {\r\n let undAdicion = cantidadAdicion;\r\n if (tallaSeleccionada.length !== 0) {\r\n let cantidadReal = await ConsultarBodega(producto.Referencia + talla, producto.CodBodega);\r\n if (cantidadActual + parseInt(undAdicion) <= cantidadReal) {\r\n auxAdicionarV(talla, undAdicion)\r\n setAdicion(1);\r\n } else {\r\n undAdicion = cantidadReal - cantidadActual;\r\n if(undAdicion > 0) {\r\n swal({\r\n title: \"Aviso\",\r\n text: `La cantidad solicitada de la referencia ${producto.Referencia + talla} no está disponible.\r\n Se agregarán ${undAdicion} de ${cantidadAdicion} al carrito, desea continuar?`,\r\n icon: \"info\",\r\n buttons: {\r\n cancel: {\r\n text: \"No\",\r\n value: null,\r\n visible: true,\r\n closeModal: true,\r\n },\r\n confirm: {\r\n text: \"Si\",\r\n value: true,\r\n visible: true,\r\n closeModal: true\r\n }\r\n }\r\n }).then(response => {\r\n if(response) {\r\n auxAdicionarV(talla, undAdicion)\r\n }\r\n setAdicion(1);\r\n });\r\n } else {\r\n if(obtenerCantidadTallaProductoActual(tallaSeleccionada.label) == 0) {\r\n swal({\r\n title: \"¡Importante!\",\r\n text: `La referencia ${producto.Referencia + talla} no será agregada al carrito,\r\n es posible que esté agotada. Si se presenta la novedad con todas las referencias,\r\n solicite soporte.`,\r\n icon: \"warning\",\r\n });\r\n }\r\n }\r\n }\r\n }\r\n };\r\n\r\n const auxAdicionarV = (talla, cantidadAdicion) => {\r\n let crear = true;\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n if (producto.Referencia + talla === carrito[\"Carrito\"][i][\"id\"]) {\r\n carrito[\"Carrito\"][i][\"Cantidad\"] += parseInt(cantidadAdicion);\r\n crear = false;\r\n }\r\n }\r\n if (crear) {\r\n const productoNuevo = {\r\n _id: producto._id,\r\n id: producto.Referencia + talla,\r\n Nombre: producto.Nombre,\r\n Codigo: producto.Referencia,\r\n Talla: talla,\r\n Bodega: producto.CodBodega,\r\n Categoria: producto.Categoria.Categoria,\r\n PrecioMinorista: arreglarPrecio(producto.PrecioMinorista),\r\n PrecioMayorista: arreglarPrecio(producto.PrecioMayorista),\r\n DescuentoMayorista: producto.DescuentoMayorista,\r\n DescuentoMinorista: producto.DescuentoMinorista,\r\n Cantidad: parseInt(cantidadAdicion),\r\n };\r\n const carritoNew = [...carrito[\"Carrito\"], productoNuevo];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n } else {\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n }\r\n }\r\n\r\n const obtenerCantidadTallaProductoActual = (talla) => {\r\n const productoFiltrado = carrito[\"Carrito\"].filter(\r\n (prod) => prod[\"id\"] === producto.Referencia + talla\r\n );\r\n return productoFiltrado.length > 0 ? productoFiltrado[0][\"Cantidad\"] : 0;\r\n };\r\n\r\n const ObtenerTallas = () => {\r\n let tallas = [];\r\n for (let talla of producto.Variantes[0].Tallas) {\r\n if (talla.Cantidad > 0) {\r\n tallas.push({\r\n value: talla._id,\r\n label: talla.Talla,\r\n image:\r\n recursosUrlState + \"/img/Filtros/\" + talla.Talla + \"-blanco.webp\",\r\n Cantidad: talla.Cantidad,\r\n estado: false,\r\n });\r\n }\r\n }\r\n setTallas(tallas);\r\n //modificarTallasState(tallas);\r\n };\r\n\r\n //Recibe el evento de seleccion o deseleccion de las tallas y modifica su state\r\n const changeSelectedTalla = (value, talla) => {\r\n let temp = tallas;\r\n setAdicion(1);\r\n temp = temp.map((element) => {\r\n return { ...element, estado: value === element.value ? true : false };\r\n });\r\n setCantidad(talla.Cantidad);\r\n setTallaSelecionada(talla);\r\n setTallas(temp);\r\n };\r\n\r\n useEffect(() => {\r\n ObtenerTallas();\r\n }, []);\r\n\r\n return (\r\n \r\n onChangeValue(\"1\")}\r\n style={\r\n radio1.indexOf(\"Seleccion\") !== -1\r\n ? radioSeleccionado\r\n : radioSinSeleccionar\r\n }\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(radio1);\r\n }}\r\n />\r\n
\r\n \r\n onChangeValue(\"2\")}\r\n style={\r\n radio2.indexOf(\"Seleccion\") !== -1\r\n ? radioSeleccionado\r\n : radioSinSeleccionar\r\n }\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(radio2);\r\n }}\r\n />\r\n
\r\n \r\n onChangeValue(\"3\")}\r\n style={\r\n radio3.indexOf(\"Seleccion\") !== -1\r\n ? radioSeleccionado\r\n : radioSinSeleccionar\r\n }\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(radio3);\r\n }}\r\n />\r\n
\r\n \r\n onChangeValue(\"4\")}\r\n style={\r\n radio4.indexOf(\"Seleccion\") !== -1\r\n ? radioSeleccionado\r\n : radioSinSeleccionar\r\n }\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(radio4);\r\n }}\r\n />\r\n
\r\n \r\n onChangeValue(\"5\")}\r\n style={\r\n radio5.indexOf(\"Seleccion\") !== -1\r\n ? radioSeleccionado\r\n : radioSinSeleccionar\r\n }\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(radio5);\r\n }}\r\n />\r\n
\r\n \r\n {/* changeSelectedTalla(talla.value, talla)}\r\n \r\n />\r\n ))}\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default GrupoTallas;\r\n","//Zona de importacion de componentes externos.\r\nimport React, { useEffect, useState } from \"react\";\r\n\r\n//Zona de importacion de componentes internos.\r\nimport GrupoTallas from \"./GrupoTallas\";\r\nimport { Link } from \"react-router-dom\";\r\nimport \"./static/css/Producto/producto.css\";\r\n\r\nconst Producto = ({\r\n ViewDetalle,\r\n cliente,\r\n index,\r\n producto,\r\n carrito,\r\n modificarCarritoState,\r\n headerState,\r\n modificarHeaderState,\r\n errorState,\r\n modificarErrorState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n actualizarSessionStorage,\r\n tallasState,\r\n modificarTallasState,\r\n refNoCatalogoState,\r\n modificarRefNoCatalogoState,\r\n vendedor,\r\n modificarVendedorState,\r\n Bodega,\r\n setBodega,\r\n checkedProductos,\r\n setCheckedProductos,\r\n}) => {\r\n const [tallas, setTallas] = useState([]);\r\n const [selectedProductId, setSelectedProductId] = useState(null);\r\n const [individualChecked, setIndividualChecked] = useState(true);\r\n\r\n const handleProductSelect = (productId) => {\r\n //setSelectedProductId(productId);\r\n localStorage.setItem(\"selectedProductId\", productId);\r\n //history.push(`/products/${productId}`);\r\n };\r\n\r\n useEffect(() => {\r\n\r\n const storedProductId = localStorage.getItem(\"selectedProductId\");\r\n // console.log(\"asigna id \", storedProductId)\r\n if (storedProductId) {\r\n setSelectedProductId(storedProductId);\r\n }\r\n }, []);\r\n\r\n useEffect(() => {\r\n const rutaCompleta = window.location.pathname;\r\n const partesRuta = rutaCompleta.split('/');\r\n const Mercado = partesRuta[1];\r\n const element = document.getElementById(selectedProductId);\r\n if (element && Mercado === \"Mercado\") {\r\n element.scrollIntoView({ behavior: \"instant\" }); // para animar la visualizacion { behavior: 'smooth' })\r\n setTimeout(() => {\r\n //localStorage.removeItem(\"selectedProductId\");\r\n }, 30000);\r\n }\r\n }, [selectedProductId]);\r\n //let tallas1; //Aqui se guardaran las cantidades de cada talla del producto.\r\n //let tallasL1; //Aqui se guardara una lisra con las tallas dependientes del producto.\r\n //Retorna un json con las tallas correspondientes igualadas a 0 segun la categoria del product ingresado.\r\n /*const queListaTalla = (producto) => {\r\n return (producto[\"Categoria\"] === \"CAMISETA\" || \r\n producto[\"Categoria\"] === \"CAMISETA VALTIMORT\" || \r\n producto[\"Categoria\"] === \"HOODIE\" ||\r\n producto[\"Categoria\"] === \"JOGGER\" ||\r\n producto[\"Categoria\"] === \"POLO\" ||\r\n producto[\"Categoria\"] === \"POLO SAMBARLOT\") ? {\"S\": 0, \"M\": 0, \"L\": 0, \"XL\": 0, \"XXL\": 0} \r\n \r\n : ((producto[\"Categoria\"] === \"GORRA\" ||\r\n producto[\"Categoria\"] === \"GAFAS\") ? {\"U\": 0} \r\n : ((producto[\"Categoria\"] === \"JEAN\" &&\r\n producto[\"Genero\"] === \"MUJER\") ? {\"30\": 0, \"32\": 0, \"34\": 0, \"36\": 0, \"38\": 0} \r\n : {\"6\": 0, \"8\": 0, \"10\": 0, \"12\": 0, \"14\": 0}))\r\n }*/\r\n //Esta funcion comprueba si existe la imagen en version jpg del producto, en caso que no, se lanza la imagen de respaldo general 'base'.\r\n\r\n const comprobarImgProducto = (codigo) => {\r\n const imagen = document.getElementById(codigo);\r\n let img = document.createElement(\"img\");\r\n img.src = recursosUrlState + \"/img/Productos/Ref \" + codigo + \".jpg\";\r\n imagen.innerHTML =\r\n \"Tallas disponibles
*/}\r\n\r\n {tallas?.map((talla, index) => (\r\n\r\n {cantidad === 0 ? (\r\n \r\n adicionar(\r\n tallaSeleccionada.label,\r\n obtenerCantidadTallaProductoActual(tallaSeleccionada.label)\r\n )\r\n }\r\n style={{\r\n height: \"auto\",\r\n width: \"100%\",\r\n marginTop: \"-9px\",\r\n }}\r\n alt=\"agregar\"\r\n />\r\n )}\r\n \r\n adicionar(\r\n tallaSeleccionada.label,\r\n obtenerCantidadTallaProductoActual(tallaSeleccionada.label)\r\n )\r\n }\r\n style={{\r\n height: \"auto\",\r\n width: \"80%\",\r\n marginTop: \"-23px\",\r\n }}\r\n alt=\"agregar\"\r\n />\r\n )}\r\n
\r\n \r\n ! Última unidad disponible¡\r\n
\r\n ) : (\r\n\r\n {cantidad + \" \"} unidades disponibles\r\n
\r\n )}\r\n {tallaSeleccionada.length !== 0 ? (\r\n obtenerCantidadTallaProductoActual(tallaSeleccionada.label) ===\r\n cantidad ? (\r\n\r\n Cantidad Maxima en tu carrito\r\n
\r\n ) : (\r\n <>\r\n {vendedor? (\r\n\r\n handleChange(e)}\r\n min={1}\r\n />\r\n \r\n adicionarV(\r\n tallaSeleccionada.label,\r\n obtenerCantidadTallaProductoActual(tallaSeleccionada.label),\r\n adicion\r\n )\r\n }\r\n >\r\n AGREGAR AL CARRITO\r\n \r\n
\r\n ) : (\r\n \r\n {obtenerCantidadTallaProductoActual(tallaSeleccionada.label) +\r\n \" \"}{\" \"}\r\n Unidades en tu carrito\r\n
\r\n \r\n )\r\n ) : mostar ? (\r\n <>\r\n {vendedor? (\r\n\r\n handleChange(e)}\r\n min={1}\r\n />\r\n \r\n adicionarV(\r\n tallaSeleccionada.label,\r\n obtenerCantidadTallaProductoActual(tallaSeleccionada.label),\r\n adicion\r\n )\r\n }\r\n >\r\n AGREGAR AL CARRITO\r\n \r\n
\r\n ) : (\r\n \r\n {obtenerCantidadTallaProductoActual(tallaSeleccionada.label) +\r\n \" \"}{\" \"}\r\n Unidades en tu carrito\r\n
\r\n \r\n ) : null}\r\n![\" +\r\n codigo +\r\n \"](\" +\r\n recursosUrlState +\r\n \"/img/Productos/Ref \" +\r\n codigo +\r\n \".jpg)
\";\r\n img.onerror = function () {\r\n imagen.innerHTML =\r\n \"![\" +\r\n codigo +\r\n \"](\" +\r\n recursosUrlState +\r\n \"/img/General/base2.png)
\";\r\n };\r\n };\r\n\r\n /*\r\n //Revisa si una lista de tallas contiene la talla ingresada.\r\n const existeTallaNombre = (talla, arreglo) => {\r\n for(var i = 0; i < arreglo.length; i++){\r\n if(arreglo[i] === talla)\r\n return true;\r\n }\r\n return false;\r\n }*/\r\n\r\n const rotacionFlecha = (codigo) => {\r\n var listaClases = document.getElementById(\"Flecha\" + codigo);\r\n if (listaClases.classList.contains(\"giroFlechaArriba\")) {\r\n listaClases.classList.remove(\"giroFlechaArriba\");\r\n listaClases.classList.add(\"giroFlechaAbajo\");\r\n } else {\r\n listaClases.classList.remove(\"giroFlechaAbajo\");\r\n listaClases.classList.add(\"giroFlechaArriba\");\r\n }\r\n };\r\n\r\n /*\r\n //Se crea la lista de las talla de cada producto, si contiene la talla L, se condiciona si se debe añadir la talla XXL, XXXL o XXXXL a la lista.\r\n if(producto !== \"\"){\r\n let tallasP1 = producto[\"productos\"][0][\"Cantidad\"];\r\n var t1Temp = Object.keys(tallasP1);\r\n tallasL1 = t1Temp;\r\n if(t1Temp[0] === \"L\"){\r\n tallasL1 = [\"S\", \"M\", \"L\", \"XL\"];\r\n if(existeTallaNombre(\"XXL\", t1Temp))\r\n tallasL1.push(\"XXL\");\r\n if(existeTallaNombre(\"XXXL\", t1Temp))\r\n tallasL1.push(\"XXXL\");\r\n if(existeTallaNombre(\"XXXXL\", t1Temp))\r\n tallasL1.push(\"XXXXL\");\r\n }\r\n tallas1 = tallasP1;\r\n }*/\r\n\r\n //Añade el punto de miles al precio ingresado y lo retorna.\r\n const formatNumber = (amount) => {\r\n var temp = Math.round(amount) + \"\";\r\n var i = temp.length - 3;\r\n while (i > 0) {\r\n temp = temp.substring(0, i) + \".\" + temp.substring(i);\r\n i -= 3;\r\n }\r\n return \" \" + temp;\r\n };\r\n\r\n //Retorna el precio ingresado sin signos de peso ni puntos.\r\n const arreglarPrecio = (precio) => {\r\n var separacion = precio;\r\n if (precio.indexOf(\"$\") !== -1) separacion = precio.split(\" \")[1];\r\n var separacion2 = separacion.split(\".\");\r\n return parseFloat(separacion2[0] + separacion2[1]);\r\n };\r\n\r\n const calcularDescuento = (precio, descuento) => {\r\n const precioInt = arreglarPrecio(precio);\r\n const descuentoAplicar = parseFloat(descuento);\r\n return formatNumber(precioInt - precioInt * (descuentoAplicar / 100));\r\n };\r\n\r\n const ObtenerTallas = () => {\r\n let tallas = [];\r\n for (let talla of producto.Variantes[0].Tallas) {\r\n if (talla.Cantidad > 0) {\r\n tallas.push({\r\n value: talla._id,\r\n label: talla.Talla,\r\n image:\r\n recursosUrlState + \"/img/Filtros/\" + talla.Talla + \"-blanco.webp\",\r\n Cantidad: talla.Cantidad,\r\n estado: false,\r\n });\r\n }\r\n }\r\n setTallas(tallas);\r\n //modificarTallasState(tallas);\r\n };\r\n\r\n const almacenarReferencias = async (e, producto) => {\r\n const value = e.target.checked;\r\n setIndividualChecked(!individualChecked);\r\n if (!value) {\r\n await modificarRefNoCatalogoState([...refNoCatalogoState, producto]);\r\n } else {\r\n let productosCatalogoTemp = refNoCatalogoState.filter(\r\n (prod) => prod.Referencia !== producto.Referencia\r\n );\r\n await modificarRefNoCatalogoState(productosCatalogoTemp);\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n setIndividualChecked(checkedProductos)\r\n }, [checkedProductos])\r\n \r\n\r\n //State que contendra el json de cantidades del producto.\r\n //const [tallas1State, modificarTallas1State] = useState(queListaTalla(producto));\r\n\r\n //Estructura del producto:\r\n // Imagen.\r\n // Categoria del producto.\r\n // Codigo producto.\r\n // Componente grupo de tallas.\r\n\r\n useEffect(() => {\r\n ObtenerTallas();\r\n }, []);\r\n return (\r\n \r\n {producto !== \"\" && producto[\"Codigo\"] !== \"salta\" ? (\r\n <>\r\n
\r\n \r\n {headerState[\"Cliente\"] === \"Minoristas\" ? (\r\n handleProductSelect(producto.Referencia)}\r\n >\r\n e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n {headerState[\"BotonCatalogo\"] ? (\r\n \r\n almacenarReferencias(e, producto)}\r\n >\r\n
\r\n ) : null}\r\n \r\n )}\r\n \r\n {/* 
*/}\r\n e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n
\r\n \r\n ) : (\r\n <>\r\n \r\n {producto.Categoria.Categoria} {producto.Marca.Marca}{\" \"}\r\n {producto.Genero.Genero}{producto.Medidas !== \"SinDefinir\"? ` - ${producto.Medidas}` : \"\"}\r\n
\r\n \r\n REF {producto.Referencia}\r\n
\r\n \r\n \r\n {headerState[\"Cliente\"] === \"Minoristas\" ? (\r\n producto.DescuentoMinorista !== 0 ? (\r\n \r\n
\r\n \r\n \r\n ) : null}\r\n {/* \r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Medidas/medidas\" +\r\n producto.Categoria.Categoria +\r\n producto.Genero.Genero +\r\n producto.Medidas +\r\n \".png\";\r\n }}\r\n />\r\n
\r\n \r\n rotacionFlecha(producto.Referencia)}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n \r\n Mas información\r\n \r\n
\r\n\r\n \r\n Material: \r\n {\" \"}\r\n {producto.Descripcion}\r\n
\r\n\r\n \r\n Cuidados especiales: \r\n {\" \"}\r\n Lavar en lavadora con agua fria 30ºC, ciclo delicado con\r\n colores similares, lavar con jabón suave, no exprimir.\r\n
\r\n\r\n
\r\n )}\r\n\r\n {/* {\r\n \r\n {headerState[\"Cliente\"] !== \"Minoristas\" ? (\r\n 
e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n ) : (\r\n handleProductSelect(producto[0].Referencia)}\r\n >\r\n e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n \r\n )}\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default ProductoV2;\r\n","import React, { useState, useEffect, useRef } from 'react'\r\nimport axios from 'axios';\r\nimport swal from \"sweetalert\";\r\nimport \"../static/css/Producto/modalCompra.css\"\r\nimport \"animate.css\"\r\n\r\nconst CompraRapida = ({\r\n apiUrlState,\r\n productoCompra,\r\n setProductoCompra,\r\n activado,\r\n setActivado,\r\n carrito,\r\n modificarCarritoState,\r\n actualizarSessionStorage,\r\n spinnerState,\r\n modificarSpinnerState,\r\n errorState,\r\n modificarErrorState,\r\n}) => {\r\n\r\n const recursosUrlState = \"https://hosting.dkda.com.co/AppWeb\";\r\n const [imgVarianteUrl, setImgVarianteUrl] = useState(\"\"); // Url de la imagen de la variante\r\n const [selectVariante, setSelectVariante] = useState(null); // Variante seleccionada\r\n const [tallas, setTallas] = useState([]); // Contiene la lista de tallas de una variante\r\n const [selectTalla, setSelectTalla] = useState(null); // Talla seleccionada en modal\r\n const [cantidad, setCantidad] = useState(1); // Cantidad segun talla en el input\r\n const updateTalla = useRef(true);\r\n const ruta = useRef(window.location.pathname);\r\n\r\n const cambiarState = () => {\r\n setActivado(false);\r\n setCantidad(1);\r\n setProductoCompra(null);\r\n }\r\n\r\n const handleVariante = (variante) => {\r\n setImgVarianteUrl(`${recursosUrlState}/img/Productos/Ref ${variante.Referencia}.webp`);\r\n setSelectVariante(variante);\r\n setCantidad(1)\r\n };\r\n\r\n const changeSelectedTalla = (value, talla) => {\r\n updateTalla.current = false;\r\n let temp = tallas;\r\n setCantidad(1);\r\n temp = temp.map((element) => {\r\n return { ...element, estado: value === element.value ? true : false };\r\n });\r\n // setCantidad(talla.Cantidad);\r\n setSelectTalla(talla);\r\n setTallas(temp);\r\n };\r\n\r\n const handleCantidad = (accion) => {\r\n if(accion === \"add\" && cantidad < selectTalla.Cantidad) {\r\n setCantidad(cantidad + 1);\r\n } else if(accion === \"sub\" && cantidad > 1) {\r\n setCantidad(cantidad - 1);\r\n }\r\n }\r\n\r\n const handleChange = (e) => {\r\n const value = e.target.value;\r\n if (/^\\d{0,3}$/.test(value)) { // Limitar a 3 dígitos\r\n setCantidad(value);\r\n }\r\n };\r\n\r\n const ObtenerTallas = () => {\r\n let tallas = [];\r\n for (let talla of selectVariante.Variantes[0].Tallas) {\r\n if (talla.Cantidad > 0) {\r\n tallas.push({\r\n value: talla._id,\r\n label: talla.Talla,\r\n image:\r\n recursosUrlState + \"/img/Filtros/\" + talla.Talla + \"-blanco.webp\",\r\n Cantidad: talla.Cantidad,\r\n estado: false,\r\n });\r\n }\r\n }\r\n setTallas(tallas);\r\n };\r\n\r\n //Retorna el precio ingresado sin signos de peso ni puntos.\r\n const arreglarPrecio = (precio) => {\r\n var separacion = precio;\r\n if (precio.indexOf(\"$\") !== -1) separacion = precio.split(\" \")[1];\r\n var separacion2 = separacion.split(\".\");\r\n return parseInt(separacion2[0] + separacion2[1]);\r\n };\r\n\r\n /** Agrega las cantidades del input al carrito validando existencias */\r\n const adicionarV = async (talla, cantidadActual, cantidadAdicion) => {\r\n let undAdicion = cantidadAdicion;\r\n if (selectTalla.length !== 0) {\r\n let cantidadReal = selectTalla.Cantidad; // await ConsultarBodega(selectVariante.Referencia + talla, selectVariante.CodBodega);\r\n if (cantidadActual + parseInt(undAdicion) <= cantidadReal) {\r\n auxAdicionarV(talla, undAdicion)\r\n setCantidad(1);\r\n } else {\r\n undAdicion = cantidadReal - cantidadActual;\r\n if(undAdicion > 0) {\r\n swal({\r\n title: \"Aviso\",\r\n text: `La cantidad solicitada de la referencia ${selectVariante.Referencia + talla} no está disponible.\r\n Se agregarán ${undAdicion} de ${cantidadAdicion} al carrito, desea continuar?`,\r\n icon: \"info\",\r\n buttons: {\r\n cancel: {\r\n text: \"No\",\r\n value: null,\r\n visible: true,\r\n closeModal: true,\r\n },\r\n confirm: {\r\n text: \"Si\",\r\n value: true,\r\n visible: true,\r\n closeModal: true\r\n }\r\n }\r\n }).then(response => {\r\n if(response) {\r\n auxAdicionarV(talla, undAdicion)\r\n }\r\n setCantidad(1);\r\n });\r\n } else {\r\n if(obtenerCantidadTallaProductoActual(selectTalla.label) == 0) {\r\n swal({\r\n title: \"¡Importante!\",\r\n text: `La referencia ${selectVariante.Referencia + talla} no será agregada al carrito,\r\n es posible que esté agotada. Si se presenta la novedad con todas las referencias,\r\n solicite soporte.`,\r\n icon: \"warning\",\r\n });\r\n }\r\n }\r\n }\r\n }\r\n };\r\n\r\n const auxAdicionarV = (talla, cantidadAdicion) => {\r\n let crear = true;\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n if (selectVariante.Referencia + talla === carrito[\"Carrito\"][i][\"id\"]) {\r\n carrito[\"Carrito\"][i][\"Cantidad\"] += parseInt(cantidadAdicion);\r\n crear = false;\r\n }\r\n }\r\n if (crear) {\r\n const productoNuevo = {\r\n _id: selectVariante._id,\r\n id: selectVariante.Referencia + talla,\r\n Nombre: selectVariante.Nombre,\r\n Codigo: selectVariante.Referencia,\r\n Talla: talla,\r\n Bodega: selectVariante.CodBodega,\r\n Categoria: selectVariante.Categoria.Categoria,\r\n PrecioMinorista: arreglarPrecio(selectVariante.PrecioMinorista),\r\n PrecioMayorista: arreglarPrecio(selectVariante.PrecioMayorista),\r\n DescuentoMayorista: selectVariante.DescuentoMayorista,\r\n DescuentoMinorista: selectVariante.DescuentoMinorista,\r\n Cantidad: parseInt(cantidadAdicion),\r\n };\r\n const carritoNew = [...carrito[\"Carrito\"], productoNuevo];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n } else {\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n }\r\n }\r\n\r\n const obtenerCantidadTallaProductoActual = (talla) => {\r\n const productoFiltrado = carrito[\"Carrito\"].filter(\r\n (prod) => prod[\"id\"] === selectVariante.Referencia + talla\r\n );\r\n return productoFiltrado.length > 0 ? productoFiltrado[0][\"Cantidad\"] : 0;\r\n };\r\n\r\n //Se realiza la peticion para la verificacion de un producto solicitando la cantidad de este en bodega.\r\n const ConsultarBodega = async (idProducto, codBodega) => {\r\n let res = -100;\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Agregando producto...\",\r\n });\r\n }\r\n let rutaVerificacion = \"/Api/Manager/VerificarProducto/\" + idProducto\r\n if (localStorage.getItem(\"Vendedor\")) {\r\n rutaVerificacion = \"/Api/Manager/VerificarProducto/\" + idProducto + `/${codBodega}`\r\n }\r\n\r\n await axios\r\n .get(\r\n apiUrlState + rutaVerificacion,\r\n {},\r\n {}\r\n )\r\n .then((response) => {\r\n if (response.data.existe) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"])\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n res = response.data.cantidad;\r\n return response.data.cantidad;\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"])\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Talla no disponible para esta referencia.\",\r\n });\r\n return -100;\r\n }\r\n })\r\n .catch(function (err) {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.error_message,\r\n });\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n }\r\n });\r\n return res;\r\n };\r\n\r\n useEffect(() => {\r\n if(productoCompra !== null) {\r\n setImgVarianteUrl(`${recursosUrlState}/img/Productos/Ref ${productoCompra[0].Referencia}.webp`);\r\n setSelectVariante(productoCompra[0]);\r\n setActivado(true);\r\n } \r\n }, [productoCompra])\r\n \r\n useEffect(() => {\r\n if(selectVariante !== null) {\r\n ObtenerTallas();\r\n }\r\n }, [selectVariante])\r\n\r\n useEffect(() => {\r\n if(updateTalla.current) {\r\n setSelectTalla(tallas[0]);\r\n }\r\n }, [tallas])\r\n \r\n \r\n\r\n return (\r\n <>\r\n {activado ? (\r\n e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n ) : (\r\n handleProductSelect(producto[0].Referencia)}\r\n >\r\n e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n \r\n )}\r\n \r\n \r\n
\r\n {toggleVariantes? (\r\n \r\n {producto.map((variante) => (\r\n handleMouseOver(variante.Referencia)}\r\n // onMouseOut={() => handleMouseOut(producto[0].Referencia)}\r\n onError={(e) => e.target.src = `${recursosUrlState}/img/General/base2.png`}\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 Ref {producto[0].RefBase}
\r\n {ruta.current===\"/Mayoristas\"? (\r\n <>\r\n {producto[0].DescuentoMayorista !== 0? (\r\n\r\n
\r\n ) : (\r\n $ {calcularDescuento(\r\n producto[0].PrecioMayorista,\r\n producto[0].DescuentoMayorista\r\n )}\r\n
\r\n$ {producto[0].PrecioMayorista}
\r\n$ {producto[0].PrecioMayorista}
\r\n )}\r\n \r\n ) : (\r\n <>\r\n {producto[0].DescuentoMinorista !== 0? (\r\n\r\n
\r\n ) : (\r\n $ {calcularDescuento(\r\n producto[0].PrecioMinorista,\r\n producto[0].DescuentoMinorista\r\n )}\r\n
\r\n$ {producto[0].PrecioMinorista}
\r\n$ {producto[0].PrecioMinorista}
\r\n )}\r\n \r\n )}\r\n\r\n
\r\n ) : null}\r\n \r\n );\r\n}\r\n\r\nexport default CompraRapida;","//Zona de importacion de componentes externos.\r\nimport React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\nimport ReactPixel from \"react-facebook-pixel\";\r\nimport \"./static/css/footer.css\";\r\n\r\n//Zona de importacion de componentes internos.\r\n\r\nfunction Footer() {\r\n return (\r\n <>\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n
\r\n \r\n
\r\n Ref {productoCompra[0].RefBase}
\r\n {ruta.current===\"/Mayoristas\"? (\r\n <>\r\n {productoCompra[0].DescuentoMayorista !== 0? (\r\n <>\r\n$ {productoCompra[0].PrecioMayorista}
\r\n$ {productoCompra[0].PrecioMayorista * (1 - productoCompra[0].DescuentoMayorista / 100)}
\r\n \r\n ) : (\r\n$ {productoCompra[0].PrecioMayorista}
\r\n )}\r\n \r\n ) : (\r\n <>\r\n {productoCompra[0].DescuentoMinorista !== 0? (\r\n <>\r\n$ {productoCompra[0].PrecioMinorista}
\r\n$ {productoCompra[0].PrecioMinorista * (1 - productoCompra[0].DescuentoMinorista / 100)}
\r\n \r\n ) : (\r\n$ {productoCompra[0].PrecioMinorista}
\r\n )}\r\n \r\n )}\r\n\r\n handleVariante(variante)}\r\n onError={(e) => e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n ))}\r\n
\r\n Colores
\r\n {productoCompra.map((variante) => (\r\n\r\n
\r\n Tallas
\r\n\r\n {tallas.map((talla, index) => (\r\n changeSelectedTalla(talla.value, talla)}\r\n \r\n />\r\n ))}\r\n
\r\n\r\n \r\n \r\n handleChange(e) }\r\n /> \r\n \r\n
\r\n\r\n \r\n adicionarV(\r\n selectTalla.label,\r\n obtenerCantidadTallaProductoActual(selectTalla.label),\r\n cantidad\r\n )}\r\n >\r\n Agregar al carrito\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n );\r\n}\r\nexport default Footer;\r\n","import React from \"react\";\r\nimport { FaExclamationCircle } from \"react-icons/fa\";\r\nimport { Link } from \"react-router-dom\";\r\n\r\nconst NotFoundComponent = ({ redirectTo }) => {\r\n return (\r\n - \r\n {/*
- \r\n
- \r\n
- \r\n
- \r\n
\r\n © Copyright 2024. DK. All rights reserved.\r\n
\r\nNo se encontraron productos para estas características
\r\n\r\n Lo sentimos, intenta aplicar un filtro diferente.\r\n
\r\n {/* \r\n {\" \"}\r\n\r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Mercado;\r\n","//Zona de importacion de componentes externos.\r\nimport React from \"react\";\r\nimport { SlideDown } from \"react-slidedown\";\r\nimport \"react-slidedown/lib/slidedown.css\";\r\n\r\nimport Producto from \"./Producto\";\r\nimport \"./static/css/Mayoristas/Mayoristas.css\";\r\nimport ProductoV2 from \"./ProductoV2\";\r\n\r\nconst ListaProductos = ({\r\n productoCompra,\r\n setProductoCompra,\r\n activado,\r\n setActivado,\r\n productosByRef,\r\n ViewDetalle,\r\n headerState,\r\n modificarHeaderState,\r\n filtrosState,\r\n modificarFiltrosState,\r\n productosState,\r\n modificarProductosState,\r\n tallasState,\r\n modificarTallasState,\r\n coloresState,\r\n modificarColoresState,\r\n marcasState,\r\n modificarMarcasState,\r\n carrito,\r\n modificarCarritoState,\r\n cliente,\r\n errorState,\r\n modificarErrorState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n categoriasHombreState,\r\n modificarCategoriasHombreState,\r\n categoriasMujerState,\r\n modificarCategoriasMujerState,\r\n CatalogoState,\r\n actualizarSessionStorage,\r\n estadoBar,\r\n vendedor,\r\n modificarVendedorState,\r\n Bodega,\r\n setBodega,\r\n}) => {\r\n\r\n return (\r\n ¿Necesitas Ayuda?
\r\n \r\n {/*Subir productos al catalogo por pixel */}\r\n\r\n\r\n
\r\n {vendedor || window.location.pathname === \"/Admin/GeneradorDeCatalogos\"? (\r\n \r\n
\r\n 0 ? \"fila\" : null }>\r\n {productosState[1].length > 0 ? (\r\n productosState[1].map((producto, index) =>\r\n index === 0 ? (\r\n
\r\n\r\n ) : (\r\n // Productos agrupados por referencia\r\n \r\n {headerState[\"displayMenu\"] === \"Index\" ||\r\n productosState[0][\"CambioSeccion\"] !== false ||\r\n window.location.pathname == \"/Admin/GeneradorDeCatalogos\" ||\r\n window.location.pathname == \"/Preventa/Catalogo\" ? (\r\n \r\n \r\n ) : (\r\n <>\r\n )}\r\n
\r\n )}\r\n 0 ? \"fila\" : null }>\r\n {productosState[1].length > 0? (\r\n <>\r\n {Object.keys(productosByRef).map((referencia) => (\r\n
\r\n )}\r\n\r\n \r\n \r\n \r\n
\r\n )}\r\n\r\n \r\n {productosState[1].length > 0 ? (\r\n
\r\n \r\n {productosState[1].length > 0? (\r\n <>\r\n {Object.keys(productosByRef).map((referencia) => (\r\n
\r\n ) : (\r\n \r\n {/* */}\r\n
\r\n )}\r\n {/* {productosState[1].map((producto, index) =>\r\n index === 0 ? (\r\n \r\n
\r\n )\r\n )} */}\r\n \r\n {estadoBar && !spinnerState[\"Desplegar\"] ? (\r\n
\r\n )}\r\n \r\n
\r\n ) : null}\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/General/noHayWeb.jpg\";\r\n }}\r\n />\r\n
\r\n {/* \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/General/noHayMovil.jpg\";\r\n }}\r\n />\r\n
*/}\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default HandlePage","import React, { useState, useEffect } from 'react'\r\nimport \"./static/css/ModalMayoristas.css\"\r\nimport \"animate.css\"\r\n\r\nconst ModalMayoristas = ({\r\n\r\n}) => {\r\n\r\n const [activado, SetActivado] = useState(true);\r\n\r\n const cambiarState = () => {\r\n SetActivado(false);\r\n }\r\n\r\n return (\r\n <>\r\n {activado ? (\r\n \r\n \r\n
\r\n \r\n handleIndex(\"Mayoristas\")}>Mayoristas\r\n
\r\n \r\n
\r\n ) : null}\r\n \r\n );\r\n}\r\n\r\nexport default ModalMayoristas;","//Zona de importacion de componentes externos.\r\nimport React, { useState, useRef, useEffect } from \"react\";\r\nimport axios from \"axios\";\r\nimport ReactPixel from \"react-facebook-pixel\";\r\n//Zona de importacion de componentes internos.\r\nimport ListaProductos from \"./ListaProductos\";\r\nimport { useParams } from \"react-router\";\r\nimport Footer from \"../Footer/Footer\";\r\nimport \"./static/css/Mayoristas/Mayoristas.css\";\r\nimport CarouselInfo from \"../Index/CarouselInfo\";\r\nimport { useGlobalContext } from \"../../providers/GlobalStatesProviders\";\r\nimport CompraRapida from \"./components/ModalCompra\";\r\nimport HandlePage from \"../utils/HandlePage\";\r\n\r\nimport \"./static/css/Mayoristas/Mayoristas.css\";\r\nimport ModalMayoristas from \"../Modal/ModalMayoristas\";\r\n\r\nconst Mayoristas = ({\r\n ViewDetalle,\r\n headerState,\r\n modificarHeaderState,\r\n filtrosState,\r\n modificarFiltrosState,\r\n productosState,\r\n modificarProductosState,\r\n tallasState,\r\n modificarTallasState,\r\n coloresState,\r\n modificarColoresState,\r\n marcasState,\r\n modificarMarcasState,\r\n carrito,\r\n modificarCarritoState,\r\n cliente,\r\n errorState,\r\n modificarErrorState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n // clienteState,\r\n // modificarClienteState,\r\n categoriasHombreState,\r\n modificarCategoriasHombreState,\r\n categoriasMujerState,\r\n modificarCategoriasMujerState,\r\n CatalogoState,\r\n actualizarSessionStorage,\r\n rutaDinamica,\r\n vendedor,\r\n modificarVendedorState,\r\n Bodega,\r\n setBodega,\r\n}) => {\r\n const { clienteState, modificarClienteState } = useGlobalContext();\r\n\r\n /**Productos agrpados por referencia */\r\n const [productosByRef, setProductosByRef] = useState([]);\r\n\r\n /** Modal de compra rapida */\r\n const [activado, setActivado] = useState(false);\r\n\r\n /** Producto seleccionado para mostrar en modal */\r\n const [productoCompra, setProductoCompra] = useState(null)\r\n\r\n let { Categoria, Genero, Subgenero, Marca } = useParams();\r\n //Referencia para el primer producto.\r\n const barCamisetasHombre = useRef(null);\r\n const barCamisetasHombreBasicas = useRef(null);\r\n const barCamisetasHombreEstampadas = useRef(null);\r\n const barCamisetasHombreValtimor = useRef(null);\r\n const barHoodiesHombre = useRef(null);\r\n const barJoggersHombre = useRef(null);\r\n const barPantalonetasHombre = useRef(null);\r\n const barPolosHombre = useRef(null);\r\n const barGorras = useRef(null);\r\n const barCamisetasMujer = useRef(null);\r\n const barHoodiesMujer = useRef(null);\r\n const barJoggersMujer = useRef(null);\r\n const barBlusas = useRef(null);\r\n const barVestidos = useRef(null);\r\n const barLycras = useRef(null);\r\n const barBodys = useRef(null);\r\n const barCamisas = useRef(null);\r\n const barDescuentos = useRef(null);\r\n\r\n // Creamos un state para cada Bar de categoria.\r\n const [estadoBar, actualizarEstadoBar] = useState({\r\n listaCamisetasHombre: false,\r\n listaCamisetasHombreBasicas: false,\r\n listaCamisetasHombreEstampadas: false,\r\n listaCamisetasHombreValtimor: false,\r\n listaHoodiesHombre: false,\r\n listaJoggersHombre: false,\r\n listaPantalonetasHombre: false,\r\n listaPolosHombre: false,\r\n listaGorras: false,\r\n listaCamisetasMujer: false,\r\n listaHoodiesMujer: false,\r\n listaJoggersMujer: false,\r\n listaBlusas: false,\r\n listaVestidos: false,\r\n listaLycras: false,\r\n listaBodys: false,\r\n listaCamisas: false,\r\n listaDescuentos: false,\r\n });\r\n\r\n const [data, actualizarData] = useState({\r\n GORRAS: { Nuevo: false, Descuento: 0 },\r\n BASICAS: { Nuevo: false, Descuento: 0 },\r\n ESTAMPADAS: { Nuevo: false, Descuento: 0 },\r\n VALTIMOR: { Nuevo: false, Descuento: 0 },\r\n MUJER: { Nuevo: false, Descuento: 0 },\r\n POLOS: { Nuevo: false, Descuento: 0 },\r\n BLUSAS: { Nuevo: false, Descuento: 0 },\r\n VESTIDOS: { Nuevo: false, Descuento: 0 },\r\n LYCRAS: { Nuevo: false, Descuento: 0 },\r\n BODYS: { Nuevo: false, Descuento: 0 },\r\n CAMISAS: { Nuevo: false, Descuento: 0 },\r\n PANTALONETAS: { Nuevo: false, Descuento: 0 },\r\n HOODIES_H: { Nuevo: false, Descuento: 0 },\r\n HODDIES_M: { Nuevo: false, Descuento: 0 },\r\n JOGGER_H: { Nuevo: false, Descuento: 0 },\r\n JOGGER_M: { Nuevo: false, Descuento: 0 },\r\n });\r\n\r\n ReactPixel.track(\"HomeMayoristas\", \"ViewContent\");\r\n //Se hace una consulta a la api para obtener los productos segun la seccion ingresada por parametro en la ruta '/Inventario/ConsultarProductos/{Categoria}/{Genero}'\r\n const obtenerProductos = async (\r\n refBar,\r\n categoriaId,\r\n generoId,\r\n marcaId,\r\n subgeneroId,\r\n marcaExcluida\r\n ) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Cargando productos...\",\r\n });\r\n }\r\n let url = apiUrlState + \"/Api/Inventario/GetProductos\";\r\n let data = {\r\n Categorias: [],\r\n Generos: [],\r\n Marcas: [],\r\n Medidas: [],\r\n Tallas: [],\r\n Colores: [],\r\n Subcategoria: [],\r\n ParametroOrdenamiento: \"\",\r\n ProductosNuevos: false,\r\n Descuentos: false,\r\n Todo: false,\r\n Origen: \"Mayorista\"\r\n };\r\n let i;\r\n const categoriaALlamar = categoriaId;\r\n const marcaALlamar = marcaId;\r\n const SubgeneroALlamar = subgeneroId;\r\n const MarcaExcluida = marcaExcluida;\r\n if (categoriaALlamar === \"Descuentos\") {\r\n data[\"Descuentos\"] = true;\r\n } else if (categoriaALlamar !== null) {\r\n if (MarcaExcluida === \"607ed64c521b1c0910a581b3\") {\r\n data[\"Marcas\"].push({ Marca: \"607ed64c521b1c0910a581b4\" });\r\n data[\"Marcas\"].push({ Marca: \"607ed64c521b1c0910a581b5\" });\r\n data[\"Marcas\"].push({ Marca: \"607ed64c521b1c0910a581b6\" });\r\n data[\"Marcas\"].push({ Marca: \"607ed64c521b1c0910a581b7\" });\r\n }\r\n if (marcaALlamar !== null) {\r\n data[\"Marcas\"].push({ Marca: marcaALlamar });\r\n }\r\n if (SubgeneroALlamar !== null) {\r\n data[\"Subcategoria\"].push({ Subcategoria: SubgeneroALlamar });\r\n }\r\n // data[\"Categorias\"].push({ Categoria: categoriaALlamar });\r\n // Mostrar blusas dk en categoria camiseta mujer\r\n if (categoriaALlamar === \"607ed63e521b1c0910a581aa\" && generoId === \"607ed653521b1c0910a581b9\" ){\r\n data[\"Categorias\"].push({ Categoria: categoriaALlamar });\r\n // data[\"Categorias\"].push({ Categoria: \"651aec4251072238a0969749\" });\r\n } else {\r\n data[\"Categorias\"].push({ Categoria: categoriaALlamar });\r\n }\r\n // end mostrar blusas dk en categoria camiseta mujer\r\n if (categoriaALlamar !== \"607ed63e521b1c0910a581ac\")\r\n data[\"Generos\"].push({ Genero: generoId });\r\n } else data[\"ProductosNuevos\"] = true;\r\n\r\n for (i = 0; i < marcasState.length; i++) {\r\n data[\"Marcas\"].push({ Marca: marcasState[i] });\r\n }\r\n for (i = 0; i < tallasState.length; i++) {\r\n data[\"Tallas\"].push({ \"Variantes.Tallas.Talla\": tallasState[i] });\r\n }\r\n for (i = 0; i < coloresState.length; i++) {\r\n data[\"Colores\"].push({ \"Variantes.Color\": coloresState[i] });\r\n }\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Cargando productos...\",\r\n });\r\n }\r\n\r\n await axios\r\n .post(\r\n url,\r\n {\r\n data,\r\n },\r\n {}\r\n )\r\n .then((response) => {\r\n modificarProductosState([\r\n { CambioSeccion: false, Busqueda: false, irInicio: true },\r\n response.data.data,\r\n ]);\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n //refBar.current.scrollIntoView({behavior: \"smooth\"});\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n modificarProductosState([\r\n { CambioSeccion: false, Busqueda: false, irInicio: false },\r\n [],\r\n ]);\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n };\r\n\r\n const obtenerData = async () => {\r\n let url = apiUrlState + \"/Api/Producto/getData\";\r\n await axios.get(url).then((response) => {\r\n actualizarData(response.data[0]);\r\n });\r\n };\r\n //Limpia los states de todos los filtros para no dejar ninguno seleccionado.\r\n const limpiarFiltros = () => {\r\n if (tallasState.length > 0) modificarTallasState([]);\r\n if (coloresState.length > 0) modificarColoresState([]);\r\n if (marcasState.length > 0) modificarMarcasState([]);\r\n };\r\n\r\n //Funcion para actualizar el estado de cada lista de productos.\r\n const actualizarLista = (\r\n queBar,\r\n categoriaId,\r\n generoId,\r\n refBar,\r\n MarcaId,\r\n SubgeneroId,\r\n MarcaExcluida\r\n ) => {\r\n if (queBar === \"listaGorras\") {\r\n ReactPixel.track(\"Gorras\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaPolosHombre\") {\r\n ReactPixel.track(\"Polos\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaCamisetasMujer\") {\r\n ReactPixel.track(\"Camisetas Mujer\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaHoodiesHombre\") {\r\n ReactPixel.track(\"Hoodies Hombre\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaHoodiesMujer\") {\r\n ReactPixel.track(\"Hoodies Mujer\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaPantalonetasHombre\") {\r\n ReactPixel.track(\"Pantalonetas\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaJoggersHombre\") {\r\n ReactPixel.track(\"Joggers Hombre\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaJoggersMujer\") {\r\n ReactPixel.track(\"Joggers Mujer\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaCamisetasHombreBasicas\") {\r\n ReactPixel.track(\"Camisetas Basicas\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaCamisetasHombreEstampadas\") {\r\n ReactPixel.track(\"Camisetas Estampadas\", \"ViewContent\");\r\n }\r\n if (queBar === \"listaCamisetasHombreValtimor\") {\r\n ReactPixel.track(\"Camisetas Valtimor\", \"ViewContent\");\r\n }\r\n\r\n modificarProductosState([\r\n { CambioSeccion: false, Busqueda: false, irInicio: true },\r\n [],\r\n ]);\r\n limpiarFiltros();\r\n if (!estadoBar[queBar]) {\r\n obtenerProductos(\r\n refBar,\r\n categoriaId,\r\n generoId,\r\n MarcaId,\r\n SubgeneroId,\r\n MarcaExcluida\r\n );\r\n }\r\n let estados = {\r\n listaCamisetasHombre: false,\r\n listaCamisetasHombreBasicas: false,\r\n listaCamisetasHombreEstampadas: false,\r\n listaCamisetasHombreValtimor: false,\r\n listaHoodiesHombre: false,\r\n listaJoggersHombre: false,\r\n listaPantalonetasHombre: false,\r\n listaPolosHombre: false,\r\n listaGorras: false,\r\n listaCamisetasMujer: false,\r\n listaHoodiesMujer: false,\r\n listaJoggersMujer: false,\r\n listaBlusas: false,\r\n listaVestidos: false,\r\n listaLycras: false,\r\n listaBodys: false,\r\n listaCamisas: false,\r\n listaDescuentos: false,\r\n };\r\n estados[queBar] = !estadoBar[queBar];\r\n actualizarEstadoBar(estados);\r\n };\r\n\r\n //Ruta landing\r\n const RutaLanding = async () => {\r\n //rutaDinamica = false\r\n\r\n if (Categoria === \"Camiseta\" && Genero === \"Hombre\") {\r\n actualizarLista(\r\n \"listaCamisetasHombre\",\r\n \"607ed63e521b1c0910a581aa\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n null,\r\n null,\r\n null,\r\n barCamisetasHombre\r\n );\r\n }\r\n if (Categoria === \"Camiseta\" && Genero === \"Mujer\") {\r\n actualizarLista(\r\n \"listaCamisetasMujer\",\r\n \"607ed63e521b1c0910a581aa\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barCamisetasMujer\r\n );\r\n }\r\n if (Categoria === \"Gorra\" && Genero === \"Unisex\") {\r\n actualizarLista(\r\n \"listaGorras\",\r\n \"607ed63e521b1c0910a581ac\",\r\n \"607ed653521b1c0910a581bb\",\r\n \"Hombre\",\r\n null,\r\n null,\r\n null,\r\n barGorras\r\n );\r\n }\r\n if (Categoria === \"Hoodie\" && Genero === \"Hombre\") {\r\n actualizarLista(\r\n \"listaHoodiesHombre\",\r\n \"607ed63e521b1c0910a581ad\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n null,\r\n null,\r\n null,\r\n barHoodiesHombre\r\n );\r\n }\r\n if (Categoria === \"Hoodie\" && Genero === \"Mujer\") {\r\n actualizarLista(\r\n \"listaHoodiesMujer\",\r\n \"607ed63e521b1c0910a581ad\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barHoodiesMujer\r\n );\r\n }\r\n if (Categoria === \"Polo\" && Genero === \"Hombre\") {\r\n actualizarLista(\r\n \"listaPolosHombre\",\r\n \"607ed63f521b1c0910a581b1\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n null,\r\n null,\r\n null,\r\n barPolosHombre\r\n );\r\n }\r\n if (Categoria === \"Blusa\") {\r\n actualizarLista(\r\n \"listaBlusas\",\r\n \"651aec4251072238a0969749\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barBlusas\r\n );\r\n }\r\n if (Categoria === \"Vestido\") {\r\n actualizarLista(\r\n \"listaVestidos\",\r\n \"65578d4701bf5211b63d14bc\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barVestidos\r\n );\r\n }\r\n if (Categoria === \"Lycra\") {\r\n actualizarLista(\r\n \"listaLycras\",\r\n \"6525a7906b44bb8bf3323210\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barLycras\r\n );\r\n }\r\n if (Categoria === \"Body\") {\r\n actualizarLista(\r\n \"listaBodys\",\r\n \"655bad5a1cdc932b9e974a01\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barBodys\r\n );\r\n }\r\n if (Categoria === \"Camisa\") {\r\n actualizarLista(\r\n \"listaCamisas\",\r\n \"655bac441cdc932b9e9749ff\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barCamisas\r\n );\r\n }\r\n if (Categoria === \"Pantaloneta\" && Genero === \"Hombre\") {\r\n actualizarLista(\r\n \"listaPantalonetasHombre\",\r\n \"607ed63e521b1c0910a581b0\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n null,\r\n null,\r\n null,\r\n barPantalonetasHombre\r\n );\r\n }\r\n if (Categoria === \"Jogger\" && Genero === \"Hombre\") {\r\n actualizarLista(\r\n \"listaJoggersHombre\",\r\n \"607ed63e521b1c0910a581af\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n null,\r\n null,\r\n null,\r\n barJoggersHombre\r\n );\r\n }\r\n if (Categoria === \"Jogger\" && Genero === \"Mujer\") {\r\n actualizarLista(\r\n \"listaJoggersMujer\",\r\n \"607ed63e521b1c0910a581af\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barJoggersMujer\r\n );\r\n }\r\n if (\r\n Categoria === \"Camiseta\" &&\r\n Genero === \"Hombre\" &&\r\n Marca === \"Valtimor\"\r\n ) {\r\n actualizarLista(\r\n \"listaCamisetasHombreValtimor\",\r\n \"607ed63e521b1c0910a581aa\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n null,\r\n null,\r\n \"607ed64c521b1c0910a581b3\",\r\n barCamisetasHombreValtimor\r\n );\r\n }\r\n if (\r\n Categoria === \"Camiseta\" &&\r\n Genero === \"Hombre\" &&\r\n Subgenero === \"Estampadas\"\r\n ) {\r\n actualizarLista(\r\n \"listaCamisetasHombreEstampadas\",\r\n \"607ed63e521b1c0910a581aa\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n \"607ed64c521b1c0910a581b3\",\r\n \"607ed65a521b1c0910a581bf\",\r\n null,\r\n null,\r\n barCamisetasHombreEstampadas\r\n );\r\n }\r\n if (\r\n Categoria === \"Camiseta\" &&\r\n Genero === \"Hombre\" &&\r\n Subgenero === \"Basicas\"\r\n ) {\r\n actualizarLista(\r\n \"listaCamisetasHombreBasicas\",\r\n \"607ed63e521b1c0910a581aa\",\r\n \"607ed653521b1c0910a581b8\",\r\n \"Hombre\",\r\n \"607ed64c521b1c0910a581b3\",\r\n \"607ed65a521b1c0910a581bd\",\r\n null,\r\n barCamisetasHombreBasicas\r\n );\r\n }\r\n //actualizarEstadoBar(estados);\r\n };\r\n\r\n /** Agrupa los productos por referencia */\r\n const groupBy = (array, keyFunction) => {\r\n return array.reduce((result, item) => {\r\n const key = keyFunction(item);\r\n if (!result[key]) {\r\n result[key] = [];\r\n }\r\n result[key].push(item);\r\n return result;\r\n }, {});\r\n }\r\n\r\n useEffect(() => {\r\n if(productosState[1].length > 0) {\r\n const pAgrupados = groupBy(productosState[1], ({ RefBase }) => RefBase);\r\n setProductosByRef(pAgrupados);\r\n } \r\n }, [productosState])\r\n\r\n useEffect(() => {\r\n var header = JSON.parse(JSON.stringify(headerState));\r\n\r\n if (headerState[\"displayMenu\"] === \"Index\") {\r\n modificarFiltrosState({\r\n Genero: filtrosState[\"Genero\"],\r\n Categoria: filtrosState[\"Categoria\"],\r\n CambioFiltro: false,\r\n CambioCategoria: false,\r\n filtroResumido: false,\r\n posicionFiltros: \"-100%\",\r\n });\r\n const tipoClienteSession = sessionStorage.TipoCliente;\r\n modificarHeaderState({\r\n srcLogo: headerState[\"srcLogo\"],\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha: headerState[\"srcFlecha\"],\r\n displayBuscar: \"in-line\",\r\n displayMenu: \"Productos\",\r\n color: \"negro\",\r\n Seccion: headerState[\"Seccion\"],\r\n Cliente: tipoClienteSession,\r\n BotonCatalogo: CatalogoState,\r\n });\r\n }\r\n if (headerState[\"Cliente\"] === undefined) {\r\n modificarHeaderState({\r\n srcLogo: headerState[\"srcLogo\"],\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha: headerState[\"srcFlecha\"],\r\n displayBuscar: \"in-line\",\r\n displayMenu: \"Productos\",\r\n color: \"negro\",\r\n Seccion: headerState[\"Seccion\"],\r\n Cliente: \"Mayoristas\",\r\n BotonCatalogo: CatalogoState,\r\n });\r\n actualizarSessionStorage(\"TipoCliente\", \"Mayoristas\");\r\n if (header[\"displayBuscar\"] !== \"in-line\") {\r\n header[\"displayBuscar\"] = \"in-line\";\r\n modificarHeaderState(header);\r\n }\r\n RutaLanding();\r\n }\r\n if (clienteState[\"Registro\"]) {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n Registro: false,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n Registro: false,\r\n });\r\n }\r\n });\r\n useEffect(() => {\r\n textoCirculo();\r\n obtenerData();\r\n }, []);\r\n const textoCirculo = () => {\r\n const circulo = document.getElementById(\"circle\");\r\n const circleArray = circulo.textContent.trimStart().split(\"\");\r\n circulo.textContent = \" \";\r\n for (var i = 0; i < circleArray.length; i++) {\r\n circulo.innerHTML +=\r\n '' +\r\n circleArray[i] +\r\n \"\";\r\n }\r\n };\r\n\r\n const images = {\r\n img1: [\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL1.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL12.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL13.webp\",\r\n ],\r\n img2: [\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL21.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL22.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL23.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL24.webp\",\r\n ],\r\n img3: [\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL31.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL32.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL33.webp\",\r\n \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL34.webp\",\r\n ]\r\n\r\n }\r\n /*\r\n //Mediante la referenca del primer producto se desplaza el scroll de forma suave hacia el.\r\n const irInicio = () => {\r\n if(prod1[\"current\"] !== null){\r\n prod1.current.scrollIntoView({behavior: \"smooth\"});\r\n modificarProductosState([{\"CambioSeccion\": false, \"Busqueda\": productosState[0][\"Busqueda\"], \"irInicio\": false}, productosState[1]]);\r\n }\r\n }*/\r\n return (\r\n <>\r\n \r\n
\r\n \r\n X\r\n \r\n
\r\n \r\n
\r\n ¡Mayoristas!
\r\nA partir de 6 unidades, accede a descuentos especiales en todas tus compras.
\r\n¡No te lo pierdas!
\r\n\r\n \r\n \r\n
\r\n
\r\n \r\n ¿Necesitas ayuda?
\r\n \r\n \r\n\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n actualizarLista(\r\n \"listaCamisetasMujer\",\r\n \"607ed63e521b1c0910a581aa\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barCamisetasMujer\r\n )\r\n }\r\n > \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n />\r\n
\r\n Camisetas Mujer
\r\n {data.MUJER.Nuevo ? (\r\n\r\n NEW\r\n
\r\n ) : (\r\n <>\r\n )}\r\n {data.MUJER.Descuento > 0 ? (\r\n{data.MUJER.Descuento}% OFF
\r\n ) : (\r\n <>\r\n )}\r\n\r\n
\r\n
\r\n \r\n \r\n actualizarLista(\r\n \"listaBlusas\",\r\n \"651aec4251072238a0969749\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barBlusas\r\n )\r\n }\r\n > \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n >\r\n
\r\n Blusas
\r\n {data.BLUSAS.Nuevo ? (\r\n\r\n NEW\r\n
\r\n ) : (\r\n <>\r\n )}\r\n {data.BLUSAS.Descuento > 0 ? (\r\n{data.BLUSAS.Descuento}% OFF
\r\n ) : (\r\n <>\r\n )}\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n actualizarLista(\r\n \"listaVestidos\",\r\n \"65578d4701bf5211b63d14bc\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barVestidos\r\n )\r\n }\r\n > \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n >\r\n
\r\n Vestidos
\r\n {data.VESTIDOS.Nuevo ? (\r\n\r\n NEW\r\n
\r\n ) : (\r\n <>\r\n )}\r\n {data.VESTIDOS.Descuento > 0 ? (\r\n{data.VESTIDOS.Descuento}% OFF
\r\n ) : (\r\n <>\r\n )}\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n actualizarLista(\r\n \"listaLycras\",\r\n \"6525a7906b44bb8bf3323210\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barLycras\r\n )\r\n }\r\n > \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n >\r\n
\r\n Lycras
\r\n {data.LYCRAS.Nuevo ? (\r\n\r\n NEW\r\n
\r\n ) : (\r\n <>\r\n )}\r\n {data.LYCRAS.Descuento > 0 ? (\r\n{data.LYCRAS.Descuento}% OFF
\r\n ) : (\r\n <>\r\n )}\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n actualizarLista(\r\n \"listaBodys\",\r\n \"655bad5a1cdc932b9e974a01\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barBodys\r\n )\r\n }\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n >\r\n
\r\n Bodys
\r\n {data.BODYS.Nuevo ? (\r\n\r\n NEW\r\n
\r\n ) : (\r\n <>\r\n )}\r\n {data.BODYS.Descuento > 0 ? (\r\n{data.BODYS.Descuento}% OFF
\r\n ) : (\r\n <>\r\n )}\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n actualizarLista(\r\n \"listaCamisas\",\r\n \"655bac441cdc932b9e9749ff\",\r\n \"607ed653521b1c0910a581b9\",\r\n \"Mujer\",\r\n null,\r\n null,\r\n null,\r\n barCamisas\r\n )\r\n }\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n >\r\n
\r\n Camisas
\r\n {data.CAMISAS.Nuevo ? (\r\n\r\n NEW\r\n
\r\n ) : (\r\n <>\r\n )}\r\n {data.CAMISAS.Descuento > 0 ? (\r\n{data.CAMISAS.Descuento}% OFF
\r\n ) : (\r\n <>\r\n )}\r\n\r\n
\r\n
\r\n \r\n\r\n \r\n \r\n actualizarLista(\r\n \"listaDescuentos\",\r\n \"Descuentos\",\r\n null,\r\n \"hombre\",\r\n null,\r\n null,\r\n null,\r\n barDescuentos\r\n )\r\n }\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\r\n }}\r\n />\r\n
\r\n Rebajas
\r\n20% OFF
\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n );\r\n};\r\nexport default Mayoristas;\r\n","import axios from 'axios'\r\nimport { useForm } from 'react-hook-form'\r\nimport { useState, useEffect, useRef } from 'react'\r\nimport { useGlobalContext } from '../../providers/GlobalStatesProviders'\r\nimport './static/css/Registro/FormRegistro.css'\r\n\r\nconst FormRegistro = ({\r\n apiUrlState,\r\n headerState,\r\n actualizarSessionStorage,\r\n spinnerState,\r\n modificarSpinnerState,\r\n actualizar,\r\n setActualizar,\r\n vendedor,\r\n}) => {\r\n\r\n const { clienteState, modificarClienteState } = useGlobalContext();\r\n\r\n /** Estado para manejo del formulario con react-hook-form */\r\n const { register, handleSubmit, setValue, watch ,formState: {\r\n errors\r\n } } = useForm();\r\n\r\n const [departamentos, setDepartamentos] = useState([]);\r\n const [ciudades, setCiudades] = useState([]);\r\n const [vinculado, setVinculado] = useState(null);\r\n const [sucursales, setSucursales] = useState([]);\r\n const [selectSucursal, setSelectSucursal] = useState(null);\r\n const [consulta, setConsulta] = useState(false);\r\n\r\n /** Controla la ejecucion de consulta de vinculado para \r\n * que no se ejecute con cada pulsacion de teclado */\r\n const timeoutRef = useRef(null);\r\n\r\n/** Habilita la actualizacion de vinculado unicamente cuando\r\n * se valida el formulario */\r\n const step = useRef(false);\r\n\r\n const consultarDepartamentos = async (Pais) => {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Consultando Departamentos...\"\r\n });\r\n await axios\r\n .post(apiUrlState + \"/Api/Departamento/ObtenerDepartamentos\", {\r\n data: {\r\n Pais: Pais,\r\n },\r\n }).then((response)=>{\r\n setDepartamentos(response.data.data);\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Consultando Departamentos...\"\r\n });\r\n }).catch((error)=>{\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Consultando Departamentos...\"\r\n });\r\n // Desplegar error\r\n });\r\n }\r\n\r\n const consultarCiudades = async (Departamento) => {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Consultando Ciudades...\"\r\n });\r\n await axios\r\n .post(apiUrlState + \"/Api/Ciudad/ObtenerCiudades\", {\r\n data: {\r\n Departamento: Departamento,\r\n },\r\n })\r\n .then((response) => {\r\n setCiudades(response.data.data);\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Consultando Ciudades...\"\r\n });\r\n }).catch((error)=> {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Consultando Ciudades...\"\r\n });\r\n // Desplegar error\r\n })\r\n }\r\n\r\n /**Comprueba el numero de documento y consulta para ver\r\n * si es cliente registrado. */\r\n const handleChangeDoc = (e) => {\r\n const value = e.target.value; \r\n const doc = value.replace(/[^0-9]/g, '');\r\n setValue(\"Documento\", doc);\r\n if(doc.length > 5 && doc.length < 14) {\r\n if (timeoutRef.current) {\r\n clearTimeout(timeoutRef.current);\r\n }\r\n timeoutRef.current = setTimeout(()=> {\r\n consultarVinculado(doc);\r\n }, 1000);\r\n }\r\n };\r\n\r\n const consultarVinculado = async (documento) => {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Consultando Cliente...\"\r\n });\r\n // Si se esta digitando una identificación, no utiliza el cliente local\r\n setConsulta(true);\r\n const url = `${apiUrlState}/Api/Usuario/GetInfoUsuarioMgerV2/${documento}`;\r\n const response = await axios.get(url);\r\n if(response.data.existe) {\r\n setVinculado(response.data.data);\r\n setSucursales(response.data.Sucursales);\r\n } else {\r\n setVinculado(\"\");\r\n setVinculado(null);\r\n setSucursales([]);\r\n setSelectSucursal(null);\r\n }\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Consultando Cliente...\"\r\n });\r\n }\r\n\r\n /** Se utiliza solo para setear las sucursales cuando se carga el vinculado\r\n * desde el localStorage\r\n */\r\n const consultarSucursales = async (documento) => {\r\n const url = `${apiUrlState}/Api/Usuario/GetInfoUsuarioMgerV2/${documento}`;\r\n const response = await axios.get(url);\r\n if(response.data.existe) {\r\n setSucursales(response.data.Sucursales);\r\n } else {\r\n setSucursales([]);\r\n }\r\n }\r\n\r\n const handleChangeSucursal = (value) => {\r\n const idSucursal = value;\r\n if(idSucursal !== \"0\") {\r\n const sucursal = sucursales.find(suc => suc.Identificador === idSucursal);\r\n setSelectSucursal(sucursal); \r\n } else {\r\n setSelectSucursal(null);\r\n }\r\n }\r\n\r\n /**\r\n * Diligencia el formulario de vinculado con los datos de la Api o con los\r\n * obtenidos del localStorage.\r\n * @param consultar Boleano para resolver si se llena el form con el vinculado\r\n * o con el cliente local. consultado: true -> Datos desde Api.\r\n */\r\n const llenarFormVinculado = async(consultado) => {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Consultando datos del cliente...\"\r\n });\r\n const storageClient = localStorage.getItem(\"Cliente\");\r\n const clienteLocal = storageClient===\"undefined\"\r\n ? \"\"\r\n : JSON.parse(localStorage.getItem(\"Cliente\"));\r\n if(clienteLocal && !consultado) {\r\n consultarSucursales(clienteLocal.NumeroDocumento);\r\n }\r\n let initialValues = {\r\n Documento: clienteLocal? clienteLocal.NumeroDocumento : '',\r\n TipoDocumento: clienteLocal? clienteLocal.TipoDocumento : '',\r\n Nombre: clienteLocal? clienteLocal.Nombres : '',\r\n Apellido: clienteLocal? clienteLocal.Apellidos : '',\r\n // Sucursal: '0',\r\n Telefono: clienteLocal? clienteLocal.Celular : '',\r\n FechaNacimiento: clienteLocal? clienteLocal.FechaNacimiento : '',\r\n Email: clienteLocal? clienteLocal.Correo : '',\r\n Genero: clienteLocal? clienteLocal.Genero : '',\r\n Pais: clienteLocal? clienteLocal.Pais : '',\r\n Departamento: clienteLocal? clienteLocal.Departamento : '',\r\n Ciudad: clienteLocal? clienteLocal.Ciudad : '',\r\n Direccion: clienteLocal? clienteLocal.Direccion : '',\r\n Barrio: clienteLocal? clienteLocal.Barrio : '',\r\n }\r\n if(consultado) {\r\n let fecha = '';\r\n if(vinculado!=null && vinculado.FechaNacimiento!=undefined) {\r\n fecha = new Date(vinculado.FechaNacimiento).toISOString().split('T')[0];\r\n }\r\n\r\n initialValues = {\r\n // Documento: vinculado? vinculado.NumeroDocumento : \"\",\r\n TipoDocumento: vinculado? vinculado.TipoDocumento : \"\",\r\n Nombre: vinculado? vinculado.Nombres : \"\",\r\n Apellido: vinculado? vinculado.Apellidos : \"\",\r\n // Sucursal: \"0\",\r\n Telefono: vinculado? vinculado.Celular : \"\",\r\n FechaNacimiento: fecha,\r\n Email: vinculado? vinculado.Correo : \"\",\r\n Genero: vinculado? vinculado.Genero : \"\",\r\n Pais: vinculado? vinculado.Ciudad.Departamento.Pais._id : \"\",\r\n Departamento: vinculado? vinculado.Ciudad.Departamento._id : \"\",\r\n Ciudad: vinculado? vinculado.Ciudad._id : \"\",\r\n Direccion: vinculado? vinculado.Direccion : \"\",\r\n Barrio: vinculado? vinculado.Barrio : \"\",\r\n }\r\n }\r\n if(initialValues.Pais !== \"\") {\r\n await consultarDepartamentos(initialValues.Pais);\r\n }\r\n if(initialValues.Departamento !== \"\") {\r\n await consultarCiudades(initialValues.Departamento);\r\n }\r\n Object.keys(initialValues).forEach((key) => {\r\n setValue(key, initialValues[key]);\r\n });\r\n if(vinculado !== null && consultado) {\r\n actualizarClienteState();\r\n }\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Consultando datos del cliente...\"\r\n });\r\n }\r\n\r\n const llenarFormSucursal = async() => {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Consultando sucursal...\"\r\n });\r\n let initialValues = {\r\n Snombre: selectSucursal.Nombres,\r\n Semail: selectSucursal.Correo,\r\n Stelefono: selectSucursal.Celular,\r\n Spais: selectSucursal.Ciudad.Departamento.Pais._id,\r\n Sdepartamento: selectSucursal.Ciudad.Departamento._id,\r\n Sciudad: selectSucursal.Ciudad._id,\r\n Sdireccion: selectSucursal.Direccion,\r\n Sbarrio: selectSucursal.Barrio,\r\n }\r\n await consultarDepartamentos(initialValues.Spais);\r\n await consultarCiudades(initialValues.Sdepartamento);\r\n \r\n Object.keys(initialValues).forEach((key) => {\r\n setValue(key, initialValues[key]);\r\n });\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Consultando sucursal...\"\r\n });\r\n }\r\n\r\n /** Actualiza el State y el localStorage de cliente con los datos\r\n * actuales del formulario */\r\n const actualizarClienteState = () => {\r\n const cliente = {\r\n // ...vinculado,\r\n Registro: false,\r\n Accion: \"Activo\",\r\n Sesion: true, // Revisar cuando no se llena automatico\r\n NumeroDocumento: watch(\"Documento\"),\r\n TipoDocumento: watch(\"TipoDocumento\"),\r\n Nombres: watch(\"Nombre\"),\r\n Apellidos: watch(\"Apellido\"),\r\n Sucursal: !selectSucursal ? \"0\" : selectSucursal.Identificador,\r\n Celular: watch(\"Telefono\"),\r\n FechaNacimiento: watch(\"FechaNacimiento\"),\r\n Correo: watch(\"Email\"),\r\n Genero: watch(\"Genero\"),\r\n Pais: watch(\"Pais\"),\r\n Departamento: watch(\"Departamento\"),\r\n Ciudad: watch(\"Ciudad\"),\r\n Direccion: watch(\"Direccion\"),\r\n Barrio: watch(\"Barrio\"),\r\n };\r\n actualizarSessionStorage(\"Cliente\", JSON.stringify(cliente));\r\n modificarClienteState({...cliente});\r\n }\r\n\r\n const actualizarSucursal = async () => {\r\n if(selectSucursal !== null) {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Actualizando Sucursal...\"\r\n });\r\n const dataSucursal = {\r\n NuevosDatosUsuario: [\r\n {\r\n NumeroDocumento: watch(\"Documento\"),\r\n Correo: watch(\"Semail\"),\r\n Nombres: watch(\"Snombre\"),\r\n Apellidos: \"\",\r\n Celular: watch(\"Stelefono\"),\r\n Pais: watch(\"Spais\"),\r\n Departamento: watch(\"Sdepartamento\"),\r\n Ciudad: watch(\"Sciudad\"),\r\n Direccion: watch(\"Sdireccion\"),\r\n Barrio: watch(\"Sbarrio\"),\r\n TipoTercero: headerState[\"Cliente\"],\r\n Sucursal: selectSucursal.Identificador,\r\n },\r\n ],\r\n }\r\n const url = `${apiUrlState}/Api/Usuario/ActualizarSucursal`;\r\n const response = await axios.post(url, dataSucursal);\r\n // console.log(\"Respuesta update sucursal\", response);\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"Actualizando Sucursal...\"\r\n }); \r\n }\r\n }\r\n\r\n /** Realiza la verificación del fomulario y ejecuta la actualización */\r\n const onSubmit = handleSubmit(async ()=> {\r\n await actualizarSucursal();\r\n actualizarClienteState();\r\n step.current = true;\r\n })\r\n\r\n /** Se ejecuta cuando se cambia el estado de {actualizar} desde \r\n * el componente pedido con el boton continuar compra */\r\n useEffect(() => {\r\n if(actualizar.Ejecucion) {\r\n onSubmit();\r\n setActualizar({...actualizar, Ejecucion: false});\r\n } \r\n }, [actualizar])\r\n \r\n\r\n /** Se ejecuta despues de actualizar la sucursal para que inicie\r\n * la actualizacion de datos del vinculado del componente pedido */\r\n useEffect(() => {\r\n if(step.current) {\r\n setActualizar({...actualizar, Usuario: true});\r\n }\r\n step.current = false;\r\n }, [clienteState]);\r\n\r\n /** Llena el form de vinculado con los datos obtenidos\r\n * desde la Api */\r\n useEffect(() => {\r\n llenarFormVinculado(true);\r\n }, [vinculado])\r\n\r\n /** Llena el form de la sucursal o del cliente\r\n * dependiendo de la sucursal seleccionada. */\r\n useEffect(() => {\r\n if(selectSucursal) {\r\n llenarFormSucursal();\r\n } else {\r\n llenarFormVinculado(consulta)\r\n }\r\n },[selectSucursal])\r\n\r\n /** Si el vinculado tiene sucursales, se selecciona\r\n * alguna por defecto.\r\n */\r\n useEffect(() => {\r\n if(sucursales.length != 0) {\r\n setValue(\"Sucursal\", sucursales[0].Identificador);\r\n handleChangeSucursal(sucursales[0].Identificador);\r\n } else {\r\n setValue(\"Sucursal\", \"0\");\r\n handleChangeSucursal(\"0\");\r\n }\r\n }, [sucursales])\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nexport default FormRegistro;","//Zona de importacion de componentes externos.\r\nimport React, { useEffect } from \"react\";\r\nimport axios from \"axios\";\r\nimport { useLocation } from \"react-router-dom\";\r\nimport FormRegistro from \"./FormRegistro\";\r\nimport { useGlobalContext } from \"../../providers/GlobalStatesProviders\";\r\n//import { Checkbox } from '@material-ui/core;\r\n\r\nconst Registro = ({\r\n headerState,\r\n modificarHeaderState,\r\n pedidoState,\r\n modificarPedidoState,\r\n // clienteState,\r\n // modificarClienteState,\r\n errorState,\r\n modificarErrorState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n actualizarSessionStorage,\r\n actualizar,\r\n setActualizar,\r\n vendedor,\r\n}) => {\r\n const { clienteState, modificarClienteState } = useGlobalContext();\r\n\r\n //const [direccionState, modificarDireccionState] = useState({via: \"\",Nro: \"\",Letra: \"\", Sector: \"\", Cruce: \"\", NroPlaca: \"\", LetraPlaca: \"\", NroPlaca2: \"\" });\r\n const path = useLocation();\r\n //Obtiene todos los datos del clienteState y rellena los inputs del formulario\r\n const llenarInfo = async (usuario, actualizar, datosApi) => {\r\n var usuarioCarga = {\r\n Registro: false,\r\n Accion: \"Activo\",\r\n Sesion: actualizar ? true : usuario[\"Sesion\"],\r\n TipoDocumento: usuario[\"TipoDocumento\"],\r\n NumeroDocumento: usuario[\"NumeroDocumento\"],\r\n Nombres:\r\n usuario[\"Nombres\"] !== \"\"\r\n ? capitalizarPalabras(usuario[\"Nombres\"])\r\n : \"\",\r\n Apellidos:\r\n usuario[\"Apellidos\"] !== \"\"\r\n ? capitalizarPalabras(usuario[\"Apellidos\"])\r\n : \"\",\r\n Correo: usuario[\"Correo\"],\r\n Genero: usuario[\"Genero\"],\r\n Celular: usuario[\"Celular\"],\r\n // FechaNacimiento: datosApi\r\n // ? convertDateFormat(usuario[\"FechaNacimiento\"])\r\n // : usuario[\"FechaNacimiento\"],\r\n // Universidad: usuario[\"Universidad\"],\r\n Pais: datosApi ? usuario.Ciudad.Departamento.Pais._id : usuario[\"Pais\"],\r\n Ciudad: datosApi ? usuario.Ciudad._id : usuario[\"Ciudad\"],\r\n Departamento: datosApi\r\n ? usuario.Ciudad.Departamento._id\r\n : usuario[\"Departamento\"],\r\n Direccion: usuario[\"Direccion\"],\r\n Barrio: usuario[\"Barrio\"],\r\n };\r\n if (usuarioCarga[\"TipoDocumento\"] !== \"\") {\r\n document.getElementById(\"tipoD_input\").value =\r\n usuarioCarga[\"TipoDocumento\"];\r\n document.getElementById(\"tipoD_input\").classList.add(\"correcto\");\r\n document.getElementById(\"tipoD_input\").setAttribute(\"title\", \"\");\r\n } else {\r\n document.getElementById(\"tipoD_input\").value = \"1\"\r\n }\r\n if (usuarioCarga[\"NumeroDocumento\"] !== \"\") {\r\n document.getElementById(\"numeroD_input\").value =\r\n usuarioCarga[\"NumeroDocumento\"];\r\n document.getElementById(\"numeroD_input\").classList.add(\"correcto\");\r\n document.getElementById(\"numeroD_input\").setAttribute(\"title\", \"\");\r\n }\r\n if (usuarioCarga[\"Nombres\"] !== \"\") {\r\n document.getElementById(\"nombres_input\").value = usuarioCarga[\"Nombres\"];\r\n document.getElementById(\"nombres_input\").classList.add(\"correcto\");\r\n document.getElementById(\"nombres_input\").setAttribute(\"title\", \"\");\r\n }\r\n if (usuarioCarga[\"Apellidos\"] !== \"\") {\r\n document.getElementById(\"apellidos_input\").value =\r\n usuarioCarga[\"Apellidos\"];\r\n document.getElementById(\"apellidos_input\").classList.add(\"correcto\");\r\n document.getElementById(\"apellidos_input\").setAttribute(\"title\", \"\");\r\n }else {\r\n document.getElementById(\"apellidos_input\").value = \"\"\r\n }\r\n if (usuarioCarga[\"Correo\"] !== \"\") {\r\n document.getElementById(\"correo_input\").value = usuarioCarga[\"Correo\"];\r\n document.getElementById(\"correo_input\").classList.add(\"correcto\");\r\n document.getElementById(\"correo_input\").setAttribute(\"title\", \"\");\r\n }\r\n if (usuarioCarga[\"Genero\"] !== \"\") {\r\n document.getElementById(\"genero_input\").value = usuarioCarga[\"Genero\"];\r\n document.getElementById(\"genero_input\").classList.add(\"correcto\");\r\n document.getElementById(\"genero_input\").setAttribute(\"title\", \"\");\r\n }\r\n if (usuarioCarga[\"Celular\"] !== \"\") {\r\n document.getElementById(\"celular_input\").value = usuarioCarga[\"Celular\"];\r\n document.getElementById(\"celular_input\").classList.add(\"correcto\");\r\n document.getElementById(\"celular_input\").setAttribute(\"title\", \"\");\r\n }\r\n // if (usuarioCarga[\"FechaNacimiento\"] !== \"\") {\r\n // document.getElementById(\"fechaNacimiento_input\").value =\r\n // cambioFormatoFecha(usuarioCarga[\"FechaNacimiento\"]);\r\n // document\r\n // .getElementById(\"fechaNacimiento_input\")\r\n // .classList.add(\"correctoFecha\");\r\n // document\r\n // .getElementById(\"fechaNacimiento_input\")\r\n // .setAttribute(\"title\", \"\");\r\n // }\r\n // if (path.pathname === \"/Concursonacionaldediseno\" && usuarioCarga[\"Universidad\"] !== \"\") {\r\n // // Solo para el concurso\r\n // document.getElementById(\"universidad_input\").value = usuarioCarga[\"Universidad\"];\r\n // document.getElementById(\"universidad_input\").classList.add(\"correcto\");\r\n // document.getElementById(\"universidad_input\").setAttribute(\"title\", \"\");\r\n // }\r\n if (usuarioCarga[\"Direccion\"] !== \"\") {\r\n document.getElementById(\"direccion_input\").value =\r\n usuarioCarga[\"Direccion\"];\r\n document.getElementById(\"direccion_input\").classList.add(\"correcto\");\r\n document.getElementById(\"direccion_input\").setAttribute(\"title\", \"\");\r\n }\r\n if (usuarioCarga[\"Barrio\"] !== \"\") {\r\n document.getElementById(\"barrio_input\").value = usuarioCarga[\"Barrio\"];\r\n document.getElementById(\"barrio_input\").classList.add(\"correcto\");\r\n document.getElementById(\"barrio_input\").setAttribute(\"title\", \"\");\r\n } else {\r\n document.getElementById(\"barrio_input\").value = \"\";\r\n document.getElementById(\"barrio_input\").classList.add(\"error\");\r\n document.getElementById(\"barrio_input\").setAttribute(\"title\", \"\");\r\n }\r\n if (usuarioCarga[\"Pais\"] !== \"\") {\r\n document.getElementById(\"pais_input\").value = usuarioCarga[\"Pais\"];\r\n document.getElementById(\"pais_input\").classList.add(\"correcto\");\r\n document.getElementById(\"pais_input\").setAttribute(\"title\", \"\");\r\n await insertarDepartamentos(\r\n usuarioCarga[\"Pais\"],\r\n async function (respuesta) {\r\n if (usuarioCarga[\"Departamento\"] !== \"\") {\r\n document.getElementById(\"departamento_input\").value =\r\n usuarioCarga[\"Departamento\"];\r\n document\r\n .getElementById(\"departamento_input\")\r\n .classList.add(\"correcto\");\r\n document\r\n .getElementById(\"departamento_input\")\r\n .setAttribute(\"title\", \"\");\r\n await insertarCiudades(usuarioCarga[\"Departamento\"], function () {\r\n if (usuarioCarga[\"Ciudad\"] !== \"\") {\r\n document.getElementById(\"ciudad_input\").value =\r\n usuarioCarga[\"Ciudad\"];\r\n document\r\n .getElementById(\"ciudad_input\")\r\n .classList.add(\"correcto\");\r\n document\r\n .getElementById(\"ciudad_input\")\r\n .setAttribute(\"title\", \"\");\r\n }\r\n });\r\n }\r\n }\r\n );\r\n }\r\n\r\n actualizarSessionStorage(\"Cliente\", JSON.stringify(usuarioCarga));\r\n if (actualizar) modificarClienteState(usuarioCarga);\r\n };\r\n\r\n //Retorna el string val ingresada con la primera letra mayuscula.\r\n const capitalizarPalabras = (val) => {\r\n var minuscula = val.toLowerCase();\r\n minuscula = minuscula.split(\" \");\r\n var result = \"\";\r\n for (var i = 0; i < minuscula.length; i++) {\r\n result +=\r\n minuscula[i][0].toUpperCase() +\r\n minuscula[i].slice(1) +\r\n (i + 1 < minuscula.length ? \" \" : \"\");\r\n }\r\n return result;\r\n };\r\n\r\n //Retorna la fecha ingresada cambiandole el formato.\r\n const cambioFormatoFecha = (fecha) => {\r\n var partido = fecha.split(\"-\");\r\n return partido[2] + \"-\" + partido[0] + \"-\" + partido[1];\r\n };\r\n\r\n //Inserta los departamentos en el select de departamentos\r\n const insertarDepartamentos = async (CodigoPais, callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Investigando tus antecedentes...\",\r\n });\r\n }\r\n await ConsultarDepartamentos(CodigoPais, function (JsonDepto) {\r\n var departamentos = document.getElementById(\"departamento_input\");\r\n for (let i = departamentos.options.length; i >= 0; i--) {\r\n departamentos.remove(i);\r\n }\r\n var option = document.createElement(\"option\");\r\n option.value = \"\";\r\n option.disabled = true;\r\n option.hidden = true;\r\n option.text = \"Seleccione su departamento\";\r\n departamentos.appendChild(option);\r\n option.disabled = false;\r\n option.hidden = false;\r\n for (var index = 0; index < JsonDepto.length; index++) {\r\n var optionDep = document.createElement(\"option\");\r\n optionDep.value = JsonDepto[index][\"_id\"];\r\n optionDep.text = capitalizarPalabras(JsonDepto[index][\"Nombre\"]);\r\n departamentos.appendChild(optionDep);\r\n }\r\n modificarSpinnerState({ Desplegar: false, Texto: spinnerState[\"texto\"] });\r\n callback({ Estado: true });\r\n });\r\n };\r\n //Inserta los ciudades en el select de ciudad\r\n const insertarCiudades = async (CodigoDepartamento, callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Investigando tus antecedentes...\",\r\n });\r\n }\r\n await ConsultarCiudades(CodigoDepartamento, function (JsonCiudad) {\r\n var ciudades = document.getElementById(\"ciudad_input\");\r\n for (let i = ciudades.options.length; i >= 0; i--) {\r\n ciudades.remove(i);\r\n }\r\n var option = document.createElement(\"option\");\r\n option.value = \"\";\r\n option.disabled = true;\r\n option.hidden = true;\r\n option.selected = true;\r\n option.text = \"Seleccione su ciudad\";\r\n ciudades.appendChild(option);\r\n option.disabled = false;\r\n option.hidden = false;\r\n option.selected = false;\r\n for (var index = 0; index < JsonCiudad.length; index++) {\r\n var optionDep = document.createElement(\"option\");\r\n optionDep.value = JsonCiudad[index][\"_id\"];\r\n optionDep.text = capitalizarPalabras(JsonCiudad[index][\"Nombre\"]);\r\n ciudades.appendChild(optionDep);\r\n }\r\n if (spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Cargando productos...\",\r\n });\r\n }\r\n callback({ Estado: true });\r\n });\r\n };\r\n\r\n //Se realiza una consulta de todos los departamentos segun un pais.\r\n const ConsultarDepartamentos = async (Pais, callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Investigando tus antecedentes...\",\r\n });\r\n }\r\n await axios\r\n .post(apiUrlState + \"/Api/Departamento/ObtenerDepartamentos\", {\r\n data: {\r\n Pais: Pais,\r\n },\r\n })\r\n .then((response) => {\r\n if (!response.data.error) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(response.data.data);\r\n } else {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al consultar Departamentos\",\r\n });\r\n }\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al consultar Departamentos\",\r\n });\r\n }\r\n });\r\n };\r\n\r\n //Se realiza una consulta de todas las ciudades segun un departamento.\r\n const ConsultarCiudades = async (Departamento, callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Investigando tus antecedentes...\",\r\n });\r\n }\r\n await axios\r\n .post(apiUrlState + \"/Api/Ciudad/ObtenerCiudades\", {\r\n data: {\r\n Departamento: Departamento,\r\n },\r\n })\r\n .then((response) => {\r\n if (!response.data.error) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(response.data.data);\r\n } else {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"No hay ciudades para este Departamento\",\r\n });\r\n }\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n };\r\n\r\n //Retorna true si el string ingresado contiene algun numero.\r\n const todoNumeros = (texto) => {\r\n var numeros = \"0123456789\";\r\n for (var i = 0; i < texto.length; i++) {\r\n if (numeros.indexOf(texto.charAt(i), 0) === -1) {\r\n return true;\r\n }\r\n }\r\n return false;\r\n };\r\n\r\n //Retorna true si el string ingresado contiene algun caracter especial.\r\n const tiene_caracter_especial = (texto) => {\r\n var letras = \"abcdefghijklmnñopqrstuvwxyzABCDEFGHIJKLMNÑOPQRSTUVWXYZ \";\r\n texto = texto.toLowerCase();\r\n for (var i = 0; i < texto.length; i++) {\r\n if (letras.indexOf(texto.charAt(i), 0) === -1) {\r\n return true;\r\n }\r\n }\r\n return false;\r\n };\r\n\r\n //Consulta a un usuario en la Bd segun su numero de documento.\r\n const ConsultarUsuario = async (Identificacion, callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Investigando tus antecedentes...\",\r\n });\r\n }\r\n await axios\r\n .get(apiUrlState + \"/Api/Usuario/GetInfoUsuarioMger/\" + Identificacion)\r\n .then((response) => {\r\n // console.log(response)\r\n if (response.data.existe) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(response.data.data);\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(null);\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n };\r\n\r\n //Convierte la fecha ingresada a formato mm/aaaa/dd\r\n function convertDateFormat(string) {\r\n var primerSplit = string.split(\"T\");\r\n var info = primerSplit[0].split(\"-\");\r\n return info[1] + \"-\" + info[2] + \"-\" + info[0];\r\n }\r\n //Funcion principal:\r\n //Detecta que tipo de input se esta rellenando y valida la informacion en este.\r\n //-Corrige escritura automaticamente y bloquea la escritura incorrecta.\r\n //- Insertar el logo de correcto o incorrecto.\r\n //Actualiza el state de Cliente y tambien el sesionStorage.\r\n const validacion = async (e) => {\r\n var elemento = document.getElementById(e.target.id);\r\n if (e.target.value === \"\") {\r\n elemento.setAttribute(\"title\", \"Este campo no puede estar vacío\");\r\n elemento.classList.add(\"error\");\r\n elemento.classList.remove(\"correcto\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n });\r\n } else {\r\n if (e.target.name === \"NumeroDocumento\" || e.target.name === \"Celular\") {\r\n if (todoNumeros(e.target.value)) {\r\n elemento.setAttribute(\r\n \"title\",\r\n \"Este campo no puede contener letras o caracteres especiales, solo numeros\"\r\n );\r\n elemento.classList.add(\"error\");\r\n e.target.value = \"\";\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje:\r\n \"Este campo no puede contener letras o caracteres especiales, solo numeros\",\r\n });\r\n elemento.classList.remove(\"correcto\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n });\r\n } else if (\r\n e.target.name === \"NumeroDocumento\" &&\r\n (e.target.value.length < 6 || e.target.value.length > 13)\r\n ) {\r\n elemento.setAttribute(\r\n \"title\",\r\n \"Este campo no puede contener menos de 6 digitos O mas de 13 digitos\"\r\n );\r\n elemento.classList.add(\"error\");\r\n if (e.target.value.length === 6 || e.target.value.length > 13) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje:\r\n \"Este campo no puede contener menos de 6 digitos O mas de 13 digitos\",\r\n });\r\n }\r\n elemento.classList.remove(\"correcto\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n });\r\n } else if (e.target.name === \"Celular\" && e.target.value.length < 10) {\r\n elemento.setAttribute(\r\n \"title\",\r\n \"Este campo no puede contener menos de 10 digitos\"\r\n );\r\n elemento.classList.add(\"error\");\r\n elemento.classList.remove(\"correcto\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n });\r\n } else {\r\n elemento.setAttribute(\"title\", \"\");\r\n elemento.classList.remove(\"error\");\r\n elemento.classList.add(\"correcto\");\r\n if (e.target.name === \"NumeroDocumento\") {\r\n if (!clienteState[\"Registro\"]) {\r\n var antes = e.target.value;\r\n setTimeout(async function () {\r\n if (antes === e.target.value) {\r\n await ConsultarUsuario(e.target.value, function (usuario) {\r\n if (usuario !== null) llenarInfo(usuario, true, true);\r\n else {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n });\r\n }\r\n });\r\n }\r\n }, 500);\r\n } else {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n });\r\n }\r\n } else {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n });\r\n }\r\n }\r\n } else if (e.target.name === \"Nombre\" || e.target.name === \"Apellido\") {\r\n if (\r\n tiene_caracter_especial(e.target.value) ||\r\n e.target.value.indexOf(\" \", 0) !== -1 ||\r\n e.target.value[0] === \" \" ||\r\n e.target.value[e.target.value.length - 1] === \" \"\r\n ) {\r\n elemento.setAttribute(\r\n \"title\",\r\n \"Este campo no puede contener caracteres especiales, empezar o terminar con 1 espacio, o tener 2 espacios entre palabras\"\r\n );\r\n elemento.classList.add(\"error\");\r\n elemento.classList.remove(\"correcto\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n });\r\n } else {\r\n elemento.classList.remove(\"error\");\r\n elemento.classList.add(\"correcto\");\r\n elemento.setAttribute(\"title\", \"\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: capitalizarPalabras(e.target.value),\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: capitalizarPalabras(e.target.value),\r\n });\r\n }\r\n } else if (e.target.name === \"Correo\") {\r\n if (e.target.value.indexOf(\"@\") < 0) {\r\n elemento.setAttribute(\"title\", \"El Correo debe contener una @\");\r\n elemento.classList.add(\"error\");\r\n elemento.classList.remove(\"correcto\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n });\r\n } else if (\r\n e.target.value.indexOf(\".com\", e.target.value.indexOf(\"@\")) < 0 &&\r\n e.target.value.indexOf(\".cc\", e.target.value.indexOf(\"@\")) < 0 &&\r\n e.target.value.indexOf(\".co\", e.target.value.indexOf(\"@\")) < 0 &&\r\n e.target.value.indexOf(\".es\", e.target.value.indexOf(\"@\")) < 0\r\n ) {\r\n elemento.setAttribute(\r\n \"title\",\r\n 'El correo debe contener \".com\", \".co\" o \".es\" detras de la @'\r\n );\r\n elemento.classList.add(\"error\");\r\n elemento.classList.remove(\"correcto\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: \"\",\r\n });\r\n } else {\r\n elemento.classList.remove(\"error\");\r\n elemento.classList.add(\"correcto\");\r\n elemento.setAttribute(\"title\", \"\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n });\r\n }\r\n } \r\n // else if (e.target.name === \"FechaNacimiento\") {\r\n // var fecha = e.target.value.split(\"-\");\r\n // var hoy = new Date().getFullYear();\r\n // var diferencia = hoy - fecha[0];\r\n // if (diferencia > 90 || diferencia < 10) {\r\n // elemento.setAttribute(\"title\", \"La fecha ingresada es incorrecta\");\r\n // elemento.classList.add(\"errorFecha\");\r\n // elemento.classList.remove(\"correctoFecha\");\r\n // actualizarSessionStorage(\r\n // \"Cliente\",\r\n // JSON.stringify({\r\n // ...clienteState,\r\n // [e.target.name]: \"\",\r\n // })\r\n // );\r\n // modificarClienteState({\r\n // ...clienteState,\r\n // [e.target.name]: \"\",\r\n // });\r\n // } else {\r\n // elemento.classList.remove(\"errorFecha\");\r\n // elemento.classList.add(\"correctoFecha\");\r\n // elemento.setAttribute(\"title\", \"\");\r\n // let fechaReal = convertDateFormat(e.target.value);\r\n // actualizarSessionStorage(\r\n // \"Cliente\",\r\n // JSON.stringify({\r\n // ...clienteState,\r\n // [e.target.name]: fechaReal,\r\n // })\r\n // );\r\n // modificarClienteState({\r\n // ...clienteState,\r\n // [e.target.name]: fechaReal,\r\n // });\r\n // }\r\n // } \r\n else if (e.target.name === \"Pais\") {\r\n insertarDepartamentos(e.target.value, function (respuesta) {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n });\r\n });\r\n } else if (e.target.name === \"Departamento\") {\r\n insertarCiudades(e.target.value, function (respuesta) {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n })\r\n );\r\n\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n });\r\n });\r\n } else {\r\n elemento.classList.remove(\"error\");\r\n elemento.classList.add(\"correcto\");\r\n elemento.setAttribute(\"title\", \"\");\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n [e.target.name]: e.target.value,\r\n });\r\n }\r\n }\r\n };\r\n\r\n /*\r\n const limpiarDireccionState = () => {\r\n modificarDireccionState({via: \"\",Nro: \"\",Letra: \"\", Sector: \"\", Cruce: \"\", NroPlaca: \"\", LetraPlaca: \"\", NroPlaca2: \"\" })\r\n modificarClienteState({...clienteState, \"Direccion\" : \"\"})\r\n estadoInputsDireccion(false);\r\n }*/\r\n\r\n /*\r\n const actualizarDireccion = (e) => {\r\n if(e.target.name === \"Recoger\"){\r\n modificarClienteState({...clienteState, \"Direccion\" : (e.target.checked) ? \"Recoger en la oficina principal\" : \"\"}) \r\n if(!e.target.checked)\r\n estadoInputsDireccion(false);\r\n }else{\r\n modificarDireccionState({...direccionState, [e.target.name] : e.target.value})\r\n modificarClienteState({...clienteState, \"Direccion\" : retornarDireccionCompleta(e)})\r\n }\r\n }*/\r\n\r\n /*\r\n const retornarDireccionCompleta = (e) => {\r\n var direccionCompleta = \"\";\r\n for(var direc in direccionState){\r\n if(direc === e.target.name)\r\n direccionCompleta += ((direc === \"NroPlaca\" && direccionState[direc] !== \"\") ? \"#\" : ((direc === \"NroPlaca2\" && direccionState[direc] !== \"\") ? \"- \" : \"\")) + e.target.value + \" \";\r\n else\r\n direccionCompleta += ((direc === \"NroPlaca\" && direccionState[direc] !== \"\") ? \"#\" : ((direc === \"NroPlaca2\" && direccionState[direc] !== \"\") ? \"- \" : \"\")) + direccionState[direc] + \" \";\r\n }\r\n return direccionCompleta;\r\n }*/\r\n\r\n //Bloquea la escritura de caracteres especiales.\r\n const bloqueoCaracteresEspeciales = (e) => {\r\n var elemento = document.getElementById(e.target.id);\r\n var texto = e.target.value;\r\n if (tiene_caracter_especial(e.key) && e.key !== \" \") {\r\n elemento.value = texto.replace(e.key, \"\");\r\n }\r\n validacion(e);\r\n };\r\n\r\n //Bloquea la escritura de letras.\r\n const bloqueoLetras = (e) => {\r\n var elemento = document.getElementById(e.target.id);\r\n var texto = e.target.value;\r\n if (todoNumeros(e.key) && e.key !== \" \") {\r\n elemento.value = texto.replace(e.key, \"\");\r\n }\r\n validacion(e);\r\n };\r\n\r\n const estadoInputsDireccion = (estado) => {\r\n var ViaInicio = document.getElementById(\"ViaInicio\");\r\n var NumeroVia = document.getElementById(\"NumeroVia\");\r\n var LetraVia = document.getElementById(\"LetraVia\");\r\n var SectorDireccion = document.getElementById(\"SectorDireccion\");\r\n var CruceDireccion = document.getElementById(\"CruceDireccion\");\r\n var NumeroPlaca1 = document.getElementById(\"NumeroPlaca1\");\r\n var NumeroPlaca2 = document.getElementById(\"NumeroPlaca2\");\r\n var LetraPlaca = document.getElementById(\"LetraPlaca\");\r\n ViaInicio.disabled = estado;\r\n NumeroVia.disabled = estado;\r\n LetraVia.disabled = estado;\r\n SectorDireccion.disabled = estado;\r\n CruceDireccion.disabled = estado;\r\n NumeroPlaca1.disabled = estado;\r\n NumeroPlaca2.disabled = estado;\r\n LetraPlaca.disabled = estado;\r\n };\r\n\r\n //Funcion que se ejecuta cada vez que se inicia este componente.\r\n //Pregunta si la barra de busqueda esta disponible y si es asi, la oculta y actualiza el state del Header.\r\n //Pregunta si la accion de Recuperar es true y la pagina es 2, actualiza y rellena los datos del usuario en el formulario.\r\n useEffect(() => {\r\n var header = JSON.parse(JSON.stringify(headerState));\r\n if (header[\"displayBuscar\"] !== \"none\") {\r\n header[\"displayBuscar\"] = \"none\";\r\n header[\"displayFlecha\"] = \"none\";\r\n modificarHeaderState(header);\r\n }\r\n // if (clienteState[\"Accion\"] === \"Recuperar\" && pedidoState[\"Pagina\"] === 2)\r\n // llenarInfo(clienteState, false, false);\r\n // if (clienteState[\"Direccion\"] === \"Recoger en la oficina principal\") {\r\n // estadoInputsDireccion(true);\r\n // }\r\n });\r\n\r\n return (\r\n <>\r\n {false? (\r\n \r\n
\r\n \r\n \r\n \r\n \r\n ) : null}\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 Pago con epayco\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n Te ofrecemos una amplia variedad de medios de pago\r\n
\r\n\r\n Aceptamos más de 22 medios de pago diferentes, tu decides cual\r\n es el más conveniente para tus clientes. ¡Estamos\r\n comprometidos a hacer que el proceso de compra sea lo más\r\n sencillo y seguro posible para nuestros clientes!, si deseas continuar da click en el boton \"IR A PAGAR\".\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {/* \r\n Close\r\n */}\r\n \r\n Cerrar\r\n \r\n \r\n Ir a pagar\r\n \r\n
\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default ModalEpayco;\r\n","import React from \"react\";\r\nimport \"./style.css\";\r\nconst ModalAddi = ({ accion, Mensaje }) => {\r\n return (\r\n <>\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n \r\n \r\n ×\r\n \r\n
\r\n \r\n No es posible finalizar tu compra con ADDI\r\n
\r\n\r\n
\r\n\r\n \r\n
\r\n \r\n Tu compra debe ser superior a $50.000\r\n
\r\n\r\n \r\n Cerrar\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n )}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default ModalAddi;","//Zona de importacion de componentes externos.\r\nimport React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\nimport ReactPixel from \"react-facebook-pixel\";\r\n//Zona de importacion de componentes internos.\r\nimport Registro from \"../Usuario/Registro\";\r\nimport \"./static/css/PedidoNew.css\";\r\n//Zona de importacion de Css.\r\n\r\nimport TagManager from \"react-gtm-module\";\r\n\r\nimport ModalEpayco from \"./components/modal\"\r\n\r\nimport ModalAddi from \"./components/modalAddi\";\r\nimport { useGlobalContext } from \"../../providers/GlobalStatesProviders\";\r\n\r\nconst Pedido = ({\r\n headerState,\r\n modificarHeaderState,\r\n carrito,\r\n modificarCarritoState,\r\n pedidoState,\r\n modificarPedidoState,\r\n // clienteState,\r\n // modificarClienteState,\r\n errorState,\r\n modificarErrorState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n actualizarSessionStorage,\r\n administradorState,\r\n modificarAdministradorState,\r\n vendedor,\r\n modificarVendedorState,\r\n Bodega,\r\n setBodega,\r\n metodoFact,\r\n setMetodoFact,\r\n}) => {\r\n const { clienteState, modificarClienteState } = useGlobalContext();\r\n\r\n //Se extraen los atributos del pedidos State.\r\n const {\r\n Pagina,\r\n Efecty,\r\n EfectyImg,\r\n Baloto,\r\n BalotoImg,\r\n PSE,\r\n PSEImg,\r\n Credito,\r\n CreditoImg,\r\n Contraentrega,\r\n ContraentregaImg,\r\n Consignacion,\r\n ConsignacionImg,\r\n SuperGiros,\r\n SuperGirosImg,\r\n Epayco,\r\n EpaycoImg,\r\n Addi,\r\n AddiImg\r\n } = pedidoState;\r\n\r\n /** State de que sincroniza el formulario con la pagina de pedido\r\n * Usuario: Si es true, el formulario es correcto y se procede a actualizar\r\n * Ejecucion: Envia señal para validar el formulario de registro\r\n */\r\n const [actualizar, setActualizar] = useState({\r\n Usuario: false,\r\n Sucursal: false,\r\n Ejecucion: false,\r\n })\r\n\r\n useEffect(() => {\r\n if(actualizar.Usuario) {\r\n cambioPagina(3);\r\n }\r\n }, [actualizar])\r\n \r\n\r\n const [paymentSuccess, setPaymentSuccess] = useState(false);\r\n const [paymentError, setPaymentError] = useState(false);\r\n //Se definen los estilos dinamicos de cada boton de pagina.\r\n const stylePagina1 =\r\n Pagina === 1 ? { backgroundColor: \"black\", color: \"white\" } : {};\r\n const stylePagina2 =\r\n Pagina === 2 ? { backgroundColor: \"black\", color: \"white\" } : {};\r\n const stylePagina3 =\r\n Pagina === 3 ? { backgroundColor: \"black\", color: \"white\" } : {};\r\n\r\n //Estilos para los botones de pago.\r\n const EfectyBackground = Efecty ? { backgroundColor: \"black\" } : {};\r\n const BalotoBackground = Baloto ? { backgroundColor: \"black\" } : {};\r\n const PSEBackground = PSE ? { backgroundColor: \"black\" } : {};\r\n const CreditoBackground = Credito ? { backgroundColor: \"black\" } : {};\r\n const ConsignacionBackground = Consignacion\r\n ? { backgroundColor: \"black\" }\r\n : {};\r\n const ContarEntregaBackground = Contraentrega\r\n ? { backgroundColor: \"black\" }\r\n : {};\r\n const SuperGirosBackground = SuperGiros ? { backgroundColor: \"black\" } : {};\r\n const EpaycoBackground = Epayco ? { backgroundColor: \"black\" } : {};\r\n\r\n const calcularDescuento = (precio, descuento) => {\r\n const precioInt = parseInt(precio);\r\n const descuentoAplicar = parseInt(descuento);\r\n return precioInt - precioInt * (descuentoAplicar / 100);\r\n };\r\n\r\n //Variable sobre el total del carrito.\r\n const [totalCarritoState, modificarTotalCarritoState] = useState(null);\r\n const [costoExtraPorRecaudo, modificarcostoExtraPorRecaudo] = useState(null);\r\n\r\n //Retorna el total a pagar para el carrito actual.\r\n const calcularTotalCarrito = () => {\r\n let total = 0;\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n total +=\r\n carrito[\"Carrito\"][i][\"Cantidad\"] *\r\n (headerState[\"Cliente\"] === \"Minoristas\"\r\n ? carrito[\"Carrito\"][i][\"DescuentoMinorista\"] !== 0\r\n ? calcularDescuento(\r\n carrito[\"Carrito\"][i][\"PrecioMinorista\"],\r\n carrito[\"Carrito\"][i][\"DescuentoMinorista\"]\r\n )\r\n : carrito[\"Carrito\"][i][\"PrecioMinorista\"]\r\n : carrito[\"Carrito\"][i][\"DescuentoMayorista\"] !== 0\r\n ? calcularDescuento(\r\n carrito[\"Carrito\"][i][\"PrecioMayorista\"],\r\n carrito[\"Carrito\"][i][\"DescuentoMayorista\"]\r\n )\r\n : carrito[\"Carrito\"][i][\"PrecioMayorista\"]);\r\n }\r\n\r\n return parseInt(total);\r\n };\r\n\r\n // useEffect(() => {\r\n // if (paymentSuccess) {\r\n // vaciarCarrito();\r\n // modificarErrorState({\r\n // Error: true,\r\n // Mensaje:\r\n // \"Hemos separado tu compra, realiza el pago en las proximas 48 horas o tu pedido sera eliminado automaticamente. Recuerda enviarnos una foto del comprobante por whatsapp.\",\r\n // Total: \"$\",\r\n // });\r\n // }\r\n // console.log(\"paymentError\")\r\n // if (paymentError) {\r\n // vaciarCarrito();\r\n // modificarErrorState({\r\n // Error: true,\r\n // Mensaje:\r\n // \"Error con el pago\",\r\n // Total: \"$\",\r\n // });\r\n // }\r\n // }, [paymentSuccess, paymentError])\r\n\r\n //Se realiza la peticion para la verificacion de un producto solicitando la cantidad de este en bodega.\r\n const ConsultarBodega = async (Producto, callback) => {\r\n let idProducto = Producto[\"id\"];\r\n const codProducto = Producto.Bodega;\r\n // idProducto = idProducto.slice(-1) === \"U\"? idProducto.slice(0, -1) : idProducto\r\n // let posMarca = Producto.Nombre.indexOf(\"CROATTA\");\r\n // let Marca = posMarca == -1? \"DK\" : \"CROATTA\";\r\n let rutaVerificacion = \"/Api/Manager/VerificarProducto/\" + idProducto\r\n if (localStorage.getItem(\"Vendedor\")) {\r\n rutaVerificacion = \"/Api/Manager/VerificarProducto/\" + idProducto + `/${codProducto}`\r\n }\r\n await axios\r\n .get(\r\n apiUrlState + rutaVerificacion,\r\n {}\r\n )\r\n .then((response) => {\r\n if (response.data.existe) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(response.data.cantidad);\r\n } else {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n }\r\n })\r\n .catch(function (err) {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.Mensaje,\r\n });\r\n }\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n });\r\n };\r\n\r\n const verificarUnidades = async (ref, talla) => {\r\n let disponible = 0;\r\n const url = `${apiUrlState}/Api/Inventario/GetProducto/${ref}`;\r\n await axios.get(url).then((response) => {\r\n if (!response.data.error) {\r\n const tallasProducto = response.data.data.Variantes[0].Tallas;\r\n const tallaBuscada = tallasProducto.find(tallaB => tallaB.Talla === talla);\r\n if (tallaBuscada) {\r\n disponible = tallaBuscada.Cantidad;\r\n }\r\n }\r\n }).catch((error) => {\r\n console.log('Error consulando producto', error);\r\n })\r\n return disponible;\r\n }\r\n\r\n //Disminuye la cantidad de un producto en el carrito en 1 segun la talla ingresada de este.\r\n //Actualiza el state del carrito y tambien el sesion storage.\r\n const disminuirCantidad = (producto) => {\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n if (producto[\"id\"] === carrito[\"Carrito\"][i][\"id\"]) {\r\n if (carrito[\"Carrito\"][i][\"Cantidad\"] - 1 === 0)\r\n carrito[\"Carrito\"].splice(i, 1);\r\n else carrito[\"Carrito\"][i][\"Cantidad\"] -= 1;\r\n }\r\n }\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n };\r\n\r\n //Se realiza la validacion en bodega para aumentar en 1 la cantidad en carrito de este, si no existe lo crea.\r\n //Actualiza el state del carrito y tambien el localStorage.\r\n const aumentarCantidad = async (producto, e, tipo) => {\r\n const disponible = await verificarUnidades(producto.Codigo, producto.Talla)\r\n if (producto[\"Cantidad\"] + 1 <= disponible) {\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n if (producto[\"id\"] === carrito[\"Carrito\"][i][\"id\"]) {\r\n carrito[\"Carrito\"][i][\"Cantidad\"] += 1;\r\n }\r\n }\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n } else {\r\n var elemento = document.getElementById(e.target.id + \"Cantidad\" + tipo);\r\n elemento.classList.add(\"hint--always\");\r\n elemento.classList.add(\"hint--bottom\");\r\n elemento.classList.add(\"hint--bounce\");\r\n setTimeout(function () {\r\n elemento.classList.remove(\"hint--always\");\r\n elemento.classList.remove(\"hint--bottom\");\r\n elemento.classList.remove(\"hint--bounce\");\r\n }, 2000);\r\n }\r\n };\r\n\r\n //Elimina un producto del state del carrito.\r\n const borrarElemento = (producto) => {\r\n carrito[\"Carrito\"] = carrito[\"Carrito\"].filter(\r\n (item) => item[\"id\"] !== producto[\"id\"]\r\n );\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n };\r\n\r\n //Añade el punto de miles al precio ingresado y lo retorna.\r\n const formatNumber = (amount) => {\r\n var temp = amount + \"\";\r\n var i = temp.length - 3;\r\n while (i > 0) {\r\n temp = temp.substring(0, i) + \".\" + temp.substring(i);\r\n i -= 3;\r\n }\r\n return \" \" + temp;\r\n };\r\n\r\n //Segun el tipo, modifica como seleccionado y deselecciona los demas, actualiza el statePedido\r\n const botonPago = (tipo) => {\r\n let letEfecty = tipo === \"Efecty\" ? !Efecty : false;\r\n let letBaloto = tipo === \"Baloto\" ? !Baloto : false;\r\n let letPSE = tipo === \"PSE\" ? !PSE : false;\r\n let letCredito = tipo === \"Credito\" ? !Credito : false;\r\n let letContraEntrega = tipo === \"ContraEntrega\" ? !Contraentrega : false;\r\n let letEpayco = tipo === \"Epayco\" ? !Epayco : false;\r\n let letAddi = tipo === \"Addi\" ? true : false;\r\n\r\n let letEfectyImg = letEfecty\r\n ? recursosUrlState + \"/img/Pedido/efecty-blanco.webp\"\r\n : recursosUrlState + \"/img/Pedido/efecty-negro.webp\";\r\n let letBalotoImg = letBaloto\r\n ? recursosUrlState + \"/img/Pedido/baloto-blanco.webp\"\r\n : recursosUrlState + \"/img/Pedido/baloto-negro.webp\";\r\n let letPSEImg = letPSE\r\n ? recursosUrlState + \"/img/Pedido/pse-blanco.webp\"\r\n : recursosUrlState + \"/img/Pedido/pse-negro.webp\";\r\n let letCreditoImg = letCredito\r\n ? recursosUrlState + \"/img/Pedido/credito-blanco.webp\"\r\n : recursosUrlState + \"/img/Pedido/credito-negro.webp\";\r\n let letContraEntregaImg = letContraEntrega\r\n ? recursosUrlState + \"/img/Pedido/contraentrega-blanco.webp\"\r\n : recursosUrlState + \"/img/Pedido/contraentrega-negro.webp\";\r\n let letEpaycoImg = letEpayco\r\n ? recursosUrlState + \"/img/Pedido/epayco-blanco.png\"\r\n : recursosUrlState + \"/img/Pedido/epayco-negro.png\"; \r\n let letAddiImg = letAddi\r\n ? recursosUrlState + \"/img/Pedido/AddiPago2.png\"\r\n : recursosUrlState + \"/img/Pedido/AddiPago2.png\";\r\n\r\n modificarPedidoState({\r\n Pagina: Pagina,\r\n Efecty: letEfecty,\r\n EfectyImg: letEfectyImg,\r\n Baloto: letBaloto,\r\n BalotoImg: letBalotoImg,\r\n PSE: letPSE,\r\n PSEImg: letPSEImg,\r\n Credito: letCredito,\r\n CreditoImg: letCreditoImg,\r\n Contraentrega: letContraEntrega,\r\n ContraentregaImg: letContraEntregaImg,\r\n Consignacion: Consignacion,\r\n ConsignacionImg: ConsignacionImg,\r\n SuperGiros: SuperGiros,\r\n SuperGirosImg: SuperGirosImg,\r\n Epayco: letEpayco,\r\n EpaycoImg: letEpaycoImg,\r\n Addi: letAddi,\r\n AddiImg: letAddiImg\r\n });\r\n };\r\n\r\n //Realiza un cambio de pagina modificando el statePedido.\r\n const cambioPagina = async (pagina) => {\r\n if (pagina === 3) {\r\n TagManager.dataLayer({\r\n dataLayer: {\r\n event: \"Carrito\",\r\n path: \"/Pedido-Pago\",\r\n },\r\n });\r\n\r\n await actualizarDatosUsuario(async function (respuesta) {\r\n if (respuesta) {\r\n modificarPedidoState({\r\n Pagina: pagina,\r\n Efecty: Efecty,\r\n EfectyImg: EfectyImg,\r\n Baloto: Baloto,\r\n BalotoImg: BalotoImg,\r\n PSE: PSE,\r\n PSEImg: PSEImg,\r\n Credito: Credito,\r\n CreditoImg: CreditoImg,\r\n Contraentrega: Contraentrega,\r\n ContraentregaImg: ContraentregaImg,\r\n Consignacion: Consignacion,\r\n ConsignacionImg: ConsignacionImg,\r\n SuperGiros: SuperGiros,\r\n SuperGirosImg: SuperGirosImg,\r\n Epayco: Epayco,\r\n EpaycoImg: EpaycoImg,\r\n Addi: Addi,\r\n AddiImg: AddiImg\r\n });\r\n }\r\n });\r\n\r\n } else if (pagina === 2) {\r\n TagManager.dataLayer({\r\n dataLayer: {\r\n event: \"Carrito\",\r\n path: \"/Pedido-Datos\",\r\n },\r\n });\r\n modificarPedidoState({\r\n Pagina: pagina,\r\n Efecty: Efecty,\r\n EfectyImg: EfectyImg,\r\n Baloto: Baloto,\r\n BalotoImg: BalotoImg,\r\n PSE: PSE,\r\n PSEImg: PSEImg,\r\n Credito: Credito,\r\n CreditoImg: CreditoImg,\r\n Contraentrega: Contraentrega,\r\n ContraentregaImg: ContraentregaImg,\r\n Consignacion: Consignacion,\r\n ConsignacionImg: ConsignacionImg,\r\n SuperGiros: SuperGiros,\r\n SuperGirosImg: SuperGirosImg,\r\n Epayco: Epayco,\r\n EpaycoImg: EpaycoImg,\r\n Addi: Addi,\r\n AddiImg: AddiImg\r\n });\r\n modificarClienteState({\r\n ...clienteState,\r\n Accion: \"Recuperar\",\r\n });\r\n } else {\r\n modificarPedidoState({\r\n Pagina: pagina,\r\n Efecty: Efecty,\r\n EfectyImg: EfectyImg,\r\n Baloto: Baloto,\r\n BalotoImg: BalotoImg,\r\n PSE: PSE,\r\n PSEImg: PSEImg,\r\n Credito: Credito,\r\n CreditoImg: CreditoImg,\r\n Contraentrega: Contraentrega,\r\n ContraentregaImg: ContraentregaImg,\r\n Consignacion: Consignacion,\r\n ConsignacionImg: ConsignacionImg,\r\n SuperGiros: SuperGiros,\r\n SuperGirosImg: SuperGirosImg,\r\n Epayco: Epayco,\r\n EpaycoImg: EpaycoImg,\r\n Addi: Addi,\r\n AddiImg: AddiImg\r\n });\r\n }\r\n };\r\n\r\n //Revisa que ningun datos del state de cliente este vacio.\r\n const revisionDatosUsuarios = async() => {\r\n for (const dato in clienteState) {\r\n if (dato === \"Apellidos\" && clienteState.TipoDocumento === \"11\") { \r\n } else if(dato === \"FechaNacimiento\" || dato === \"Universidad\") { \r\n } else {\r\n if (clienteState[dato] === \"\") {return [false, dato]};\r\n }\r\n }\r\n return [true, \"\"];\r\n };\r\n\r\n //Segun los datos del state de cliente realiza una actualizacion de este en Contapyme.\r\n const actualizarDatosUsuario = async (callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Actualizando tu datos...\",\r\n });\r\n }\r\n await axios\r\n .post(apiUrlState + \"/Api/Usuario/ActualizarUsuarioMger\", {\r\n NuevosDatosUsuario: [\r\n {\r\n NumeroDocumento: clienteState[\"NumeroDocumento\"],\r\n TipoDocumento: clienteState[\"TipoDocumento\"],\r\n Correo: clienteState[\"Correo\"],\r\n Nombres: clienteState[\"Nombres\"],\r\n Apellidos: clienteState[\"Apellidos\"],\r\n FechaNacimiento: clienteState[\"FechaNacimiento\"],\r\n Celular: clienteState[\"Celular\"],\r\n Genero: clienteState[\"Genero\"],\r\n Pais: clienteState[\"Pais\"],\r\n Departamento: clienteState[\"Departamento\"],\r\n Ciudad: clienteState[\"Ciudad\"],\r\n Direccion: clienteState[\"Direccion\"],\r\n Barrio: clienteState[\"Barrio\"],\r\n TipoTercero: headerState[\"Cliente\"],\r\n Sucursal: \"0\", // para actualizar el usuario\r\n },\r\n ],\r\n })\r\n .then((response) => {\r\n if (!response.data.error) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(true);\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: response.data.message,\r\n });\r\n }\r\n callback(false);\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({ Error: true, Mensaje: \"Revisa Tus Datos.\" });\r\n }\r\n });\r\n };\r\n\r\n //Limpia el state de carrito de todos los productos actuales.\r\n const vaciarCarrito = () => {\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: [] });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify([]));\r\n };\r\n\r\n //Retorna la cantidad de productos en el carrito actual.\r\n const contarProductos = () => {\r\n let cantidad = 0;\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n cantidad += carrito[\"Carrito\"][i][\"Cantidad\"];\r\n }\r\n\r\n return cantidad;\r\n };\r\n\r\n const listaCarrito = () => {\r\n let listaALlevar = [];\r\n for (let i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n // if ( carrito[\"Carrito\"][i][\"id\"].slice(-1) === \"U\") {\r\n if (false) {\r\n listaALlevar.push({\r\n _id: carrito[\"Carrito\"][i][\"_id\"],\r\n Cantidad: carrito[\"Carrito\"][i][\"Cantidad\"],\r\n Nombre: carrito[\"Carrito\"][i][\"Nombre\"],\r\n Codigo: carrito[\"Carrito\"][i][\"Codigo\"],\r\n Referencia: carrito[\"Carrito\"][i][\"Codigo\"],\r\n PrecioMayorista: carrito[\"Carrito\"][i][\"PrecioMayorista\"],\r\n PrecioMinorista: carrito[\"Carrito\"][i][\"PrecioMinorista\"],\r\n Talla: carrito[\"Carrito\"][i][\"Talla\"],\r\n DescuentoMayorista: carrito[\"Carrito\"][i][\"DescuentoMayorista\"],\r\n DescuentoMinorista: carrito[\"Carrito\"][i][\"DescuentoMinorista\"],\r\n });\r\n } else {\r\n listaALlevar.push({\r\n _id: carrito[\"Carrito\"][i][\"_id\"],\r\n Cantidad: carrito[\"Carrito\"][i][\"Cantidad\"],\r\n Nombre: carrito[\"Carrito\"][i][\"Nombre\"],\r\n Codigo: carrito[\"Carrito\"][i][\"id\"],\r\n Referencia: carrito[\"Carrito\"][i][\"Codigo\"],\r\n Bodega: carrito[\"Carrito\"][i][\"Bodega\"],\r\n PrecioMayorista: carrito[\"Carrito\"][i][\"PrecioMayorista\"],\r\n PrecioMinorista: carrito[\"Carrito\"][i][\"PrecioMinorista\"],\r\n Talla: carrito[\"Carrito\"][i][\"Talla\"],\r\n DescuentoMayorista: carrito[\"Carrito\"][i][\"DescuentoMayorista\"],\r\n DescuentoMinorista: carrito[\"Carrito\"][i][\"DescuentoMinorista\"],\r\n });\r\n }\r\n }\r\n\r\n return listaALlevar;\r\n };\r\n\r\n const calcularPedido = async () => {\r\n await axios\r\n .post(apiUrlState + \"/Api/Pedido/CalcularTotalPedido\", {\r\n TipoCliente: headerState.Cliente.toUpperCase(),\r\n Carrito: listaCarrito(),\r\n Cupon: carrito.Cupon !== null ? carrito.Cupon : \"\",\r\n })\r\n .then((response) => {\r\n if (!response.data.error) {\r\n modificarTotalCarritoState(response.data.TotalPedido);\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n }\r\n })\r\n .catch(function (err) {\r\n console.log(\"err\", err);\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n };\r\n\r\n const crearDatosAddi = (response) => {\r\n let newItems = [];\r\n let carrito = listaCarrito();\r\n for(const item of carrito) {\r\n let producto = {\r\n sku: item.Referencia,\r\n name: item.Nombre,\r\n quantity: item.Cantidad,\r\n unitPrice: headerState.Cliente===\"Minoristas\"? item.PrecioMinorista : item.PrecioMayorista, // Revisar\r\n tax: 0,\r\n pictureUrl: `https://hosting.dkda.com.co/AppWeb/img/Productos/Ref%20${item.Referencia}.webp`,\r\n category: \"Ropa\",\r\n brand: \"DK\"\r\n }\r\n newItems.push(producto);\r\n }\r\n\r\n let body = {\r\n orderId: response.data.data.NumeroOperacion,\r\n totalAmount: response.data.TotalPedido,\r\n shippingAmount: 0, // gastos de envio\r\n totalTaxesAmount: 0, // valor del iva\r\n currency: \"COP\",\r\n items: newItems,\r\n client: {\r\n idType: \"CC\",\r\n idNumber: clienteState.NumeroDocumento,\r\n firstName: clienteState.Nombres,\r\n lastName: clienteState.Apellidos,\r\n email: clienteState.Correo,\r\n cellphone: clienteState.Celular,\r\n cellphoneCountryCode: \"+57\",\r\n address: {\r\n lineOne: clienteState.Direccion,\r\n city: clienteState.Ciudad,\r\n \"country\": \"CO\"\r\n }\r\n },\r\n shippingAddress: {\r\n lineOne: clienteState.Direccion,\r\n city: clienteState.Ciudad,\r\n \"country\": \"CO\"\r\n },\r\n billingAddress: {\r\n lineOne: clienteState.Direccion,\r\n city: clienteState.Ciudad,\r\n country: \"CO\"\r\n },\r\n pickUpAddress: {\r\n lineOne: \"\",\r\n city: \"\",\r\n country: \"CO\"\r\n },\r\n allyUrlRedirection: {\r\n logoUrl: \"https://hosting.dkda.com.co/AppWeb/img/Email/45441614379749154.png\", // https://api.dkda.com.co/Api/Marketplaces/Addi/ConfirmacionPago\r\n callbackUrl: \"https://api.dkda.com.co/Api/Marketplaces/Addi/ConfirmacionPago\",\r\n redirectionUrl: \"https://www.dkda.com.co/\"\r\n },\r\n geoLocation: {\r\n latitude: \"\",\r\n longitude: \"\"\r\n }\r\n }\r\n return body;\r\n }\r\n\r\n //Funcion principal:\r\n //Crea la remision en contapyme determinando diferentes casos.\r\n //Define si es remision de mayoristas o minoristas.\r\n //Crea, guarda y procesa la orden.\r\n //Crea el link de pago dependiendo de la eleccion del cliente y de si es mayorista o minorista.\r\n const crearPedido = async () => {\r\n console.log(\"Epayco: \", Epayco)\r\n if (headerState[\"Cliente\"] === \"Mayoristas\" && contarProductos() < 6) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Tu pedido no debe tener menos de 6 unidades\",\r\n });\r\n } else {\r\n TagManager.dataLayer({\r\n dataLayer: {\r\n event: \"Carrito\",\r\n path: \"/Pedido-Final\",\r\n },\r\n });\r\n let bancos = document.getElementById(\"bancos_input\");\r\n bancos = bancos === null ? \"\" : bancos.value;\r\n if (Contraentrega) {\r\n verificarCiudadEnvioRR();\r\n } else if (\r\n Efecty ||\r\n Baloto ||\r\n Epayco ||\r\n Addi ||\r\n (PSE && bancos !== \"A continuación seleccione su banco\") ||\r\n headerState[\"Cliente\"] === \"Mayoristas\"\r\n ) {\r\n const tipoPago = Efecty\r\n ? \"Efecty\"\r\n : Baloto\r\n ? \"Baloto\"\r\n : PSE\r\n ? \"PSE\"\r\n : Epayco\r\n ? \"Epayco\"\r\n : Addi\r\n ? \"Addi\"\r\n : \"Mayoristas\";\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Creando pedido...\",\r\n });\r\n }\r\n await axios\r\n .post(apiUrlState + \"/Api/Manager/Crear/remision\", {\r\n Cliente: {\r\n NumeroDocumento: clienteState.NumeroDocumento,\r\n Sucursal: clienteState.Sucursal,\r\n TipoCliente: headerState.Cliente,\r\n TipoPago: tipoPago,\r\n },\r\n Carrito: listaCarrito(),\r\n MedioDePago: tipoPago.toLowerCase(),\r\n Cupon: carrito.Cupon !== null ? carrito.Cupon : \"\",\r\n Banco: bancos,\r\n Vendedor: vendedor,\r\n Bodega: Bodega,\r\n })\r\n .then(async(response) => {\r\n if (!response.data.error) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n if (headerState[\"Cliente\"] === \"Minoristas\") {\r\n if (Efecty) {\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"este es tu pin\",\r\n Total: response.data.TotalPedido,\r\n pin: response.data.data.pin,\r\n MedioPago: \"Efecty\",\r\n });\r\n } else if (Baloto) {\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"este es tu pin\",\r\n Total: response.data.TotalPedido,\r\n pin: response.data.data.pin,\r\n\r\n MedioPago: \"Baloto\",\r\n });\r\n } else if (Epayco) {\r\n \r\n // modificarErrorState({\r\n // Error: true,\r\n // Mensaje: \"Te redireccionamos a la ventana de pago.\",\r\n // Total: response.data.data.TotalPedido,\r\n // });\r\n //let validateTransaction = false\r\n const data = {\r\n key: '0026d7220b852a0f67c6ed61d2e8c9fd',\r\n amount: response.data.TotalPedido,\r\n name: `DK ${headerState[\"Cliente\"] }`,\r\n description: 'DK',\r\n image: 'https://picsum.photos/200', // URL de la imagen del producto\r\n currency: 'COP',\r\n country: 'CO',\r\n test: false,\r\n external: true,\r\n //response: 'http://localhost', // URL de la página de respuesta\r\n //confirmation: 'http://localhost', // URL de la página de confirmación\r\n acepted: \"https://www.dkda.com.co/Pedido/Confirmacion\",\r\n rejected: \"https://www.dkda.com.co/Pedido/Rechazado\",\r\n pending: \"https://www.dkda.com.co/Pedido/Pendiente\",\r\n // onapproved: () => setPaymentSuccess(true),\r\n // onrejected: () => setPaymentError(true)\r\n };\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Dirigiendo a plataforma de pago...\",\r\n });\r\n // Carga el script de Epayco y muestra el formulario de pago\r\n const handler = window.ePayco.checkout.configure({\r\n key: data.key,\r\n test: data.test,\r\n });\r\n vaciarCarrito();\r\n handler.open(data);\r\n\r\n } else if(Addi) {\r\n await axios\r\n .post(apiUrlState + \"/Api/Marketplaces/Addi/Autenticacion\", {})\r\n .then(async(auth)=>{\r\n let body = crearDatosAddi(response);\r\n let url = await axios\r\n .post(apiUrlState + \"/Api/Marketplaces/Addi/CrearTransaccion\", body);\r\n // window.open(url.data.Respuesta, \"_blank\");\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Te redireccionamos a la ventana de pago Addi.\",\r\n Total: response.data.TotalPedido,\r\n Link: url.data.Respuesta,\r\n });\r\n })\r\n } else {\r\n window.open(response.data.data.UrlPse, \"_blank\");\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Te redireccionamos a la ventana de pago.\",\r\n Total: response.data.data.TotalPedido,\r\n });\r\n }\r\n } else {\r\n if(Addi) {\r\n await axios\r\n .post(apiUrlState + \"/Api/Marketplaces/Addi/Autenticacion\", {})\r\n .then(async(auth)=>{\r\n let body = crearDatosAddi(response);\r\n let url = await axios\r\n .post(apiUrlState + \"/Api/Marketplaces/Addi/CrearTransaccion\", body);\r\n // window.open(url.data.Respuesta, \"_blank\");\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Te redireccionamos a la ventana de pago Addi.\",\r\n Total: response.data.TotalPedido,\r\n Link: url.data.Respuesta,\r\n });\r\n })\r\n }else {\r\n ReactPixel.track(\"Finalizar Compra\", \"Purchase\");\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje:\r\n \"Hemos separado tu compra, realiza el pago en las proximas 48 horas o tu pedido sera eliminado automaticamente. Recuerda enviarnos una foto del comprobante por whatsapp.\",\r\n Total: \"$\" + response.data.TotalPedido,\r\n });\r\n }\r\n }\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (\r\n !errorState[\"Error\"] &&\r\n response.data.Mensaje === \"No es posible generar el pedido.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: response.data.Mensaje,\r\n Referencias: response.data.ProductosNoPermitidos,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n response.data.Mensaje ===\r\n \"Se han agotado algunos productos de tu carrito.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: response.data.Mensaje,\r\n Referencias: response.data.ProductosNoPermitidos,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n response.data.Mensaje !== undefined\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor \",\r\n });\r\n }\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (\r\n !errorState[\"Error\"] &&\r\n err.response.data.Mensaje ===\r\n \"Se han agotado algunos productos de tu carrito.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.Mensaje,\r\n Referencias: err.response.data.ProductosNoPermitidos,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n err.response.data.Mensaje === \"No es posible generar el pedido.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.Mensaje,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n err.response.data.Mensaje !== undefined\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n } else {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Debes seleccionar un medio de pago\",\r\n });\r\n }\r\n }\r\n }\r\n };\r\n\r\n //Esta funcion comprueba si existe la imagen en version jpg del producto, en caso que no, se lanza la imagen de respaldo general 'base'.\r\n const comprobarImgProducto = (codigo, talla) => {\r\n const imagen = document.getElementById(codigo + talla + \"Pedido\");\r\n let img = document.createElement(\"img\");\r\n img.src = recursosUrlState + \"/img/Productos/Ref \" + codigo + \".webp\";\r\n imagen.innerHTML =\r\n \"\r\n
\r\n \r\n \r\n ×\r\n \r\n
\r\n \r\n Finaliza tu compra con ADDI\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n Es simple, rápido y seguro:\r\n
\r\n\r\n ✅ Sin tarjeta de crédito y en minutos.\r\n
\r\n\r\n ✅ Paga tu primera cuota un mes despues de la compra.\r\n
\r\n\r\n ✅ Proceso 100% online. Sin papeleo ni costos ocultos.\r\n
\r\n\r\n {/* \r\n Close\r\n */}\r\n {/* \r\n Cerrar\r\n \r\n \r\n Ir a pagar\r\n */}\r\n
\r\n \r\n \r\n
\r\n \";\r\n img.onerror = function () {\r\n imagen.innerHTML =\r\n \"\";\r\n };\r\n };\r\n\r\n //Redireccion al Mercado.\r\n const volverMercado = () => {\r\n headerState[\"Cliente\"] === \"Mayoristas\"\r\n ? (window.location.href = \"/Mayoristas\")\r\n : (window.location.href = \"/\");\r\n };\r\n\r\n const comprobarCupon = async () => {\r\n let valorCupon = document.getElementById(\"cupon_input\").value;\r\n if (valorCupon !== \"\") {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Revisando tu cupon...\",\r\n });\r\n await axios\r\n .get(apiUrlState + \"/Api/Cupon/ValidarCupon/\" + valorCupon)\r\n .then((response) => {\r\n if (!response.data.error && response.data.existe) {\r\n carrito.Cupon = valorCupon;\r\n calcularPedido();\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n let Nombre = \"Cumpleaños - \" + clienteState[\"Nombres\"];\r\n clienteState[\"Nombres\"] = Nombre;\r\n modificarClienteState(() => {\r\n return { ...clienteState, Nombres: Nombre };\r\n });\r\n\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Tu cupon se canjeo correctamente\",\r\n Cliente: clienteState[\"Nombres\"],\r\n Tipo: response.data.tipo,\r\n Descripcion: response.data.descripcion,\r\n valor: response.data.valor,\r\n });\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Tu cupon es invalido o ha expirado\",\r\n Cliente: clienteState[\"Nombres\"],\r\n });\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n } else {\r\n modificarSpinnerState({ Desplegar: false, Texto: spinnerState[\"texto\"] });\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Si quieres canjear un cupon debes especificar un codigo\",\r\n });\r\n }\r\n };\r\n\r\n const PagoPorConsignacion = async (tipoConsignacion) => {\r\n let mensaje = \"Consignacion \" + tipoConsignacion;\r\n\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: mensaje,\r\n Cliente: clienteState[\"Nombres\"],\r\n Total: await calcularTotalCarrito(),\r\n });\r\n };\r\n\r\n const verificarCiudadEnvioRR = async () => {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"Verificando Disponibilidad\",\r\n });\r\n let ciudad = clienteState[\"Ciudad\"];\r\n let Departamento = clienteState[\"Departamento\"];\r\n let ciudaR = await axios.post(apiUrlState + \"/Api/Pedido/VerificarCiudad\", [\r\n {\r\n _id: ciudad,\r\n },\r\n { Departamento: Departamento },\r\n ]);\r\n let Total = calcularTotalCarrito();\r\n if (Total > 2000000) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Monto NO disponible para RR\",\r\n });\r\n } else if (ciudaR.data[0].Nombre === \"TULUA\") {\r\n let Nombre = \"Recaudo - \" + clienteState[\"Nombres\"];\r\n clienteState[\"Nombres\"] = Nombre;\r\n modificarClienteState(() => {\r\n return { ...clienteState, Nombres: Nombre };\r\n });\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n let CostoEnvioRappi = \"$2.600 pesos a $3.600 pesos\";\r\n if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"AGUACLARA\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"AGUACLARA\")\r\n ) {\r\n CostoEnvioRappi = \"$3.600 pesos a $4.600 pesos\";\r\n } else if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"RIVERA\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"RIVERA\")\r\n ) {\r\n CostoEnvioRappi = \"$4.100 pesos a $6.000 pesos\";\r\n } else if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"COLINA\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"COLINA\")\r\n ) {\r\n CostoEnvioRappi = \"$5.100 pesos\";\r\n } else if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"NARIÑO\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"NARIÑO\")\r\n ) {\r\n CostoEnvioRappi = \"$3.100 pesos a $4.100 pesos\";\r\n } else if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"ESQUINAS\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"ESQUINAS\")\r\n ) {\r\n CostoEnvioRappi = \"$5.100 pesos a $6.000 pesos\";\r\n } else if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"MARINA\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"MARINA\")\r\n ) {\r\n CostoEnvioRappi = \"$20.000 pesos\";\r\n } else if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"TRUJILLO\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"TRUJILLO\")\r\n ) {\r\n CostoEnvioRappi = \"$25.000 pesos\";\r\n } else if (\r\n clienteState[\"Direccion\"].toUpperCase().includes(\"RIOFRIO\") ||\r\n clienteState[\"Barrio\"].toUpperCase().includes(\"RIOFRIO\")\r\n ) {\r\n CostoEnvioRappi = \"$18.000 pesos\";\r\n }\r\n\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Envio Rappi\",\r\n Cliente: clienteState[\"Nombres\"],\r\n EnvioRR: CostoEnvioRappi,\r\n Total: await calcularTotalCarrito(),\r\n });\r\n } else if (ciudaR.data[0].Recaudo) {\r\n let CostoExtraPorRR = 0;\r\n let NuevoTotal = Total;\r\n if (Total > 1 && Total <= 50000) {\r\n CostoExtraPorRR = 2500;\r\n NuevoTotal = CostoExtraPorRR + NuevoTotal;\r\n } else if (Total > 50001 && Total <= 100000) {\r\n CostoExtraPorRR = Total * 0.035;\r\n NuevoTotal = CostoExtraPorRR + NuevoTotal;\r\n } else if (Total > 100001 && Total <= 200000) {\r\n CostoExtraPorRR = Total * 0.032;\r\n NuevoTotal += CostoExtraPorRR;\r\n } else if (Total > 200001 && Total <= 500000) {\r\n CostoExtraPorRR = Total * 0.03;\r\n NuevoTotal = CostoExtraPorRR + NuevoTotal;\r\n } else if (Total > 500001 && Total <= 800000) {\r\n CostoExtraPorRR = Total * 0.027;\r\n NuevoTotal += CostoExtraPorRR;\r\n } else if (Total > 800001) {\r\n CostoExtraPorRR = Total * 0.024;\r\n NuevoTotal += CostoExtraPorRR;\r\n }\r\n\r\n let Nombre = \"Recaudo - \" + clienteState[\"Nombres\"];\r\n clienteState[\"Nombres\"] = Nombre;\r\n modificarClienteState(() => {\r\n return { ...clienteState, Nombres: Nombre };\r\n });\r\n //modificarcostoExtraPorRecaudo(CostoExtraPorRR);\r\n //modificarTotalCarritoState(NuevoTotal);\r\n\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Ciudad Disponible para RR\",\r\n Cliente: clienteState[\"Nombres\"],\r\n EnvioRR: CostoExtraPorRR,\r\n Total: NuevoTotal,\r\n });\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Ciudad NO disponible para RR\",\r\n });\r\n }\r\n };\r\n\r\n //Se ejecuta al inciar el componente.\r\n //Pregunta si la barra de busqueda esta desplegada, si es asi actualiza el componente del header para no desplegarla.\r\n //Si el campo de registro esta activado este se desactiva, actualizando tambien el localStorage.\r\n useEffect(() => {\r\n var header = JSON.parse(JSON.stringify(headerState));\r\n if (header[\"displayBuscar\"] !== \"none\") {\r\n header[\"displayBuscar\"] = \"none\";\r\n header[\"displayFlecha\"] = \"none\";\r\n modificarHeaderState(header);\r\n }\r\n if (clienteState[\"Registro\"]) {\r\n localStorage.setItem(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n Registro: false,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n Registro: false,\r\n });\r\n }\r\n if (totalCarritoState === \"0\" || totalCarritoState === null) {\r\n if (carrito.Cupon !== null) {\r\n modificarTotalCarritoState(calcularPedido());\r\n } else {\r\n modificarTotalCarritoState(calcularTotalCarrito());\r\n }\r\n }\r\n }, []);\r\n\r\n //Esta funcion reemplaza el 'webp' por 'png' en un string\r\n const cambioPng = (url) => {\r\n return url.replace(/webp/g, \"png\");\r\n };\r\n\r\n const mostarPolitica = () => {\r\n modificarErrorState({ Error: true, Mensaje: \"Politica de datos\" });\r\n };\r\n\r\n const PedidoEpayco = async () => {\r\n console.log(\"Entra a contra entrega\")\r\n if (headerState[\"Cliente\"] === \"Mayoristas\" && contarProductos() < 6) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Tu pedido no debe tener menos de 6 unidades\",\r\n });\r\n } else {\r\n await axios\r\n .post(apiUrlState + \"/Api/Manager/Crear/remision\", {\r\n Cliente: {\r\n NumeroDocumento: clienteState.NumeroDocumento,\r\n Sucursal: clienteState.Sucursal,\r\n TipoCliente: headerState.Cliente,\r\n TipoPago: \" \",\r\n },\r\n Carrito: listaCarrito(),\r\n MedioDePago: \"epayco\",\r\n Cupon: carrito.Cupon !== null ? carrito.Cupon : \"\",\r\n Banco: \"bancos\",\r\n Vendedor: vendedor,\r\n Bodega: Bodega,\r\n })\r\n .then((response) => {\r\n if (!response.data.error) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n if (headerState[\"Cliente\"] === \"Minoristas\") {\r\n if (Epayco) {\r\n \r\n // modificarErrorState({\r\n // Error: true,\r\n // Mensaje: \"Te redireccionamos a la ventana de pago.\",\r\n // Total: response.data.data.TotalPedido,\r\n // });\r\n //let validateTransaction = false\r\n const data = {\r\n key: '0026d7220b852a0f67c6ed61d2e8c9fd',\r\n amount: response.data.TotalPedido,\r\n name: `DK ${headerState[\"Cliente\"] }`,\r\n description: 'DK',\r\n image: 'https://picsum.photos/200', // URL de la imagen del producto\r\n currency: 'COP',\r\n country: 'CO',\r\n test: false,\r\n external: true,\r\n //response: 'http://localhost', // URL de la página de respuesta\r\n //confirmation: 'http://localhost', // URL de la página de confirmación\r\n acepted: \"https://www.dkda.com.co/Pedido/Confirmacion\",\r\n rejected: \"https://www.dkda.com.co/Pedido/Rechazado\",\r\n pending: \"https://www.dkda.com.co/Pedido/Pendiente\",\r\n // onapproved: () => setPaymentSuccess(true),\r\n // onrejected: () => setPaymentError(true)\r\n };\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Dirigiendo a plataforma de pago...\",\r\n });\r\n // Carga el script de Epayco y muestra el formulario de pago\r\n const handler = window.ePayco.checkout.configure({\r\n key: data.key,\r\n test: data.test,\r\n });\r\n vaciarCarrito();\r\n handler.open(data);\r\n \r\n } else {\r\n window.open(response.data.data.UrlPse, \"_blank\");\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Te redireccionamos a la ventana de pago.\",\r\n Total: response.data.data.TotalPedido,\r\n });\r\n }\r\n } else {\r\n ReactPixel.track(\"Finalizar Compra\", \"Purchase\");\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje:\r\n \"Hemos separado tu compra, realiza el pago en las proximas 48 horas o tu pedido sera eliminado automaticamente. Recuerda enviarnos una foto del comprobante por whatsapp.\",\r\n Total: \"$\" + response.data.TotalPedido,\r\n });\r\n }\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (\r\n !errorState[\"Error\"] &&\r\n response.data.Mensaje === \"No es posible generar el pedido.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: response.data.Mensaje,\r\n Referencias: response.data.ProductosNoPermitidos,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n response.data.Mensaje ===\r\n \"Se han agotado algunos productos de tu carrito.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: response.data.Mensaje,\r\n Referencias: response.data.ProductosNoPermitidos,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n response.data.Mensaje !== undefined\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor \",\r\n });\r\n }\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (\r\n !errorState[\"Error\"] &&\r\n err.response.data.Mensaje ===\r\n \"Se han agotado algunos productos de tu carrito.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.Mensaje,\r\n Referencias: err.response.data.ProductosNoPermitidos,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n err.response.data.Mensaje === \"No es posible generar el pedido.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.Mensaje,\r\n });\r\n } else if (\r\n !errorState[\"Error\"] &&\r\n err.response.data.Mensaje !== undefined\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n }\r\n\r\n };\r\n\r\n //Propiedad Css para la flecha izq.\r\n const flechaIzquierdaPedido = {\r\n backgroundImage:\r\n \"url(\" +\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-izquierda-negro.webp)\",\r\n };\r\n\r\n /** Actualiza el state de facturación segun lo requiera el vendedor */\r\n const modificarFacturacion = (mod) => {\r\n if (mod == \"add\" && metodoFact.Facturacion < 100) {\r\n setMetodoFact({\r\n Facturacion: metodoFact.Facturacion += 10,\r\n Remision: metodoFact.Remision -= 10,\r\n })\r\n } else if (mod == \"sub\" && metodoFact.Facturacion > 0) {\r\n setMetodoFact({\r\n Facturacion: metodoFact.Facturacion -= 10,\r\n Remision: metodoFact.Remision += 10,\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 cambioPagina(1)}\r\n >\r\n 1\r\n \r\n cambioPagina(2)}\r\n >\r\n 2\r\n \r\n setActualizar({...actualizar, Ejecucion: true})}\r\n >\r\n 3\r\n \r\n
\r\n cambioPagina(1)}>\r\n Resumen de compra\r\n
\r\ncambioPagina(2)}>\r\n Datos de envío\r\n
\r\nsetActualizar({...actualizar, Ejecucion: true})}>\r\n Forma de pago\r\n
\r\n\r\n {Pagina === 1 ? (\r\n \r\n botonPago(\"PSE\")}\r\n alt=\"PSE\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(PSEImg);\r\n }}\r\n >\r\n {PSE ? (\r\n
*/}\r\n \r\n volverMercado()}\r\n style={{ alignSelf: \"flex-start\", width: \"100%\" }}\r\n >\r\n \r\n \r\n Volver al Mercado\r\n \r\n \r\n
\r\n ) : Pagina === 2 ? (\r\n RESUMEN DE TU PEDIDO
\r\n\r\n \r\n \r\n
\r\n
\r\n | \r\n | \r\n \r\n \r\n {producto[\"Nombre\"]}\r\n \r\n | \r\n \r\n {headerState[\"Cliente\"] === \"Minoristas\" ? (\r\n producto.DescuentoMinorista !== 0 ? (\r\n | \r\n \r\n \r\n {producto[\"Talla\"]}\r\n \r\n | \r\n \r\n \r\n \r\n \r\n | \r\n \r\n \r\n {\"$\" +\r\n formatNumber(\r\n producto[\"Cantidad\"] *\r\n (headerState[\"Cliente\"] === \"Minoristas\"\r\n ? producto.DescuentoMinorista !== 0\r\n ? calcularDescuento(\r\n producto[\"PrecioMinorista\"],\r\n producto.DescuentoMinorista\r\n )\r\n : producto[\"PrecioMinorista\"]\r\n : producto.DescuentoMayorista !== 0\r\n ? calcularDescuento(\r\n producto[\"PrecioMayorista\"],\r\n producto.DescuentoMayorista\r\n )\r\n : producto[\"PrecioMayorista\"])\r\n )}\r\n \r\n | \r\n \r\n | \r\n \r\n ))}\r\n {carrito[\"Carrito\"].map((producto) => (\r\n \r\n | \r\n \r\n \r\n {producto[\"Nombre\"]}\r\n \r\n\r\n Talla: {producto[\"Talla\"]}\r\n \r\n {headerState[\"Cliente\"] === \"Minoristas\" ? (\r\n producto.DescuentoMinorista !== 0 ? (\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 {/* cambioPagina(1)}\r\n style={{ alignSelf: \"flex-start\", width: \"100%\" }}\r\n >\r\n \r\n \r\n Volver paso 1\r\n \r\n */}\r\n mostarPolitica()}\r\n >\r\n Recuerda que, al diligenciar el formulario, estas\r\n \r\n {\" \"}\r\n autorizando el tratamiento de tus datos personales.\r\n \r\n \r\n \r\n Información personal\r\n \r\n
\r\n ) : Pagina === 3 ? (\r\n DATOS PARA TU ENVIO
\r\n\r\n {/* cambioPagina(2)}\r\n style={{ alignSelf: \"flex-start\", width: \"100%\" }}\r\n >\r\n \r\n \r\n Volver paso 2\r\n \r\n \r\n \r\n Total Pedido: ${formatNumber(totalCarritoState)}\r\n */}\r\n\r\n {headerState[\"Cliente\"] === \"Minoristas\" ? (\r\n \r\n {/* botonPago(\"Efecty\")}\r\n alt=\"Efecty\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(EfectyImg);\r\n }}\r\n /> */}\r\n {/* botonPago(\"Baloto\")}\r\n alt=\"Baloto\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(BalotoImg);\r\n }}\r\n /> */}\r\n verificarCiudadEnvioRR() /*botonPago(\"ContraEntrega\")*/}\r\n alt=\"Contraentrega\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(ContraentregaImg);\r\n }}\r\n />\r\n {/* botonPago(\"Epayco\")}\r\n alt=\"Epayco\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(ContraentregaImg);\r\n }}\r\n /> */}\r\n
\r\n {/* \r\n VAMOS A FINALIZAR LA COMPRA\r\n
*/}\r\n {/*\r\n \r\n El código para pago se mostrará al finalizar la compra. Ten en\r\n cuenta que el plazo máximo para realizar el pago en cualquier\r\n punto Efecty o Baloto es de 48 horas, pasado este plazo tu\r\n pedido será cancelado automáticamente.\r\n \r\n
\r\n \r\n \r\n \r\n comprobarCupon()}\r\n >\r\n Canjear\r\n \r\n
\r\n \r\n Si tienes un cupón aplicalo aqui:\r\n
\r\nMetódo de Pago
\r\n\r\n\r\n Pagos en efectivo disponibles:{\" \"}\r\n
\r\n\r\n Pagos bancarios disponibles:{\" \"}\r\n
*/}\r\n\r\n Otros Medios de pago\r\n
\r\n\r\n {\r\n botonPago(\"Addi\")\r\n }}\r\n alt=\"ADDI\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(AddiImg);\r\n }}\r\n />\r\n \r\n Paga a 3 cuotas sin intereses con ADDI.\r\n \r\n
\r\n \r\n botonPago(\"Epayco\")}\r\n alt=\"Epayco\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(ContraentregaImg);\r\n }}\r\n />\r\n botonPago(\"Epayco\")}\r\n alt=\"Epayco\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(ContraentregaImg);\r\n }}\r\n />\r\n
\r\n {/* \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n ) : (\r\n <>\r\n )}\r\n \r\n
\r\n )}\r\n \r\n ) : (\r\n <>\r\n )}\r\n \r\n {Pagina === 1 ? (\r\n \r\n Al finalizar tu compra separaremos tu pedido, por favor lee\r\n más abajo para obtener la información de pago.\r\n
\r\n {vendedor? (\r\n\r\n
\r\n ) : null}\r\n Selecciona porcentajes de facturació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 Realiza Tu pago por:
\r\n\r\n
\r\n \r\n
\r\n \r\n PagoPorConsignacion(\"Bancolombia\")}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(ConsignacionImg);\r\n }}\r\n >\r\n \r\n Trasferencia electrónica o consignación por PAC /\r\n corresponsal Bancario\r\n \r\n
\r\n \r\n PagoPorConsignacion(\"Efecty\")}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(EfectyImg);\r\n }}\r\n />\r\n \r\n Consignación via Efecty\r\n \r\n
\r\n\r\n \r\n PagoPorConsignacion(\"SuperGiros\")}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(SuperGirosImg);\r\n }}\r\n />\r\n \r\n Consignación via SuperGiros\r\n \r\n
\r\n \r\n verificarCiudadEnvioRR()}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(ContraentregaImg);\r\n }}\r\n />\r\n \r\n Envío con Pago Contraentrega\r\n \r\n
\r\n \r\n {\r\n botonPago(\"Addi\")\r\n }}\r\n alt=\"ADDI\"\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src = cambioPng(AddiImg);\r\n }}\r\n />\r\n \r\n Paga a 3 cuotas sin intereses con ADDI.\r\n \r\n
\r\n \r\n
\r\n ) : Pagina === 2 ? (\r\n \r\n
\r\n \r\n Total:\r\n
\r\n\r\n ${formatNumber(calcularTotalCarrito())}\r\n
\r\n\r\n cambioPagina(2)}\r\n >\r\n Continuar compra\r\n \r\n
\r\n \r\n
\r\n ) : Pagina === 3 ? (\r\n headerState[\"Cliente\"] === \"Minoristas\" ? (\r\n \r\n
\r\n \r\n Total:\r\n
\r\n\r\n ${formatNumber(calcularTotalCarrito())}\r\n
\r\n\r\n setActualizar({...actualizar, Ejecucion: true})}\r\n >\r\n Continuar compra\r\n \r\n
\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n\r\n \r\n Total:\r\n
\r\n\r\n ${formatNumber(calcularTotalCarrito())}\r\n
\r\n\r\n crearPedido()}\r\n \r\n >\r\n finalizar compra\r\n \r\n
\r\n \r\n
\r\n )\r\n ) : (\r\n <>\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default Pedido;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faCheckCircle } from '@fortawesome/free-solid-svg-icons';\r\n\r\n\r\nconst PaymentConfirmation = () => {\r\n const [Cliente, setCliente ]= useState(null);\r\n useEffect(() => {\r\n const variableFromLocalStorage = localStorage.getItem('Cliente');\r\n setCliente(JSON.parse(variableFromLocalStorage));\r\n console.log(\"Cliente\", JSON.parse(variableFromLocalStorage).NumeroDocumento)\r\n }, []);\r\n\r\n return (\r\n \r\n
\r\n \r\n Total:\r\n
\r\n\r\n ${formatNumber(calcularTotalCarrito())}\r\n
\r\n\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default PaymentConfirmation;","import React, { useState, useEffect } from 'react';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faCheckCircle } from '@fortawesome/free-solid-svg-icons';\r\nimport { FaClock, FaTimesCircle } from 'react-icons/fa';\r\nimport './static/styles.css'\r\n\r\nconst PaymentRejected = (props) => {\r\n const { status, reference, date } = props;\r\n const [Cliente, setCliente] = useState(null);\r\n useEffect(() => {\r\n const variableFromLocalStorage = localStorage.getItem('Cliente');\r\n setCliente(JSON.parse(variableFromLocalStorage));\r\n console.log(\"Cliente\", JSON.parse(variableFromLocalStorage).NumeroDocumento)\r\n }, []);\r\n return (\r\n \r\n
\r\n \r\n ![\"logo\"](\"./logos/logo_yard_sale.svg\")
*/}\r\n \r\n Cuando realices el pago envíanos el\r\n comprobante por WhatsApp al siguiente número{\" \"}\r\n +57 312 656 6283 o haz click en el siguiente{\" \"}\r\n enlace a WhatsApp\r\n \r\n
\r\n */}\r\n Hola {Cliente?.Nombres}
\r\nTu Transaccion se realizó exitosamente
\r\nAhora estamos empacando tu pedido
\r\n¡Gracias por tu compra!
\r\n\r\n window.location.href(\"https://api.whatsapp.com/send?phone=573126566283&text=Hola DK quisiera más información para hacer mi compra\")}\r\n >\r\n Volver al Home\r\n \r\n
\r\n\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default PaymentRejected;","import React, { useState, useEffect } from 'react';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\r\nimport { faCheckCircle } from '@fortawesome/free-solid-svg-icons';\r\nimport { FaClock } from 'react-icons/fa';\r\nimport './static/styles.css'\r\n\r\nconst PaymentPending = () => {\r\n\r\n const [Cliente, setCliente] = useState(null);\r\n useEffect(() => {\r\n const variableFromLocalStorage = localStorage.getItem('Cliente');\r\n setCliente(JSON.parse(variableFromLocalStorage));\r\n console.log(\"Cliente\", JSON.parse(variableFromLocalStorage).NumeroDocumento)\r\n }, []);\r\n\r\n useEffect(() => {\r\n console.log(\"Cliente\", Cliente?.Nombres)\r\n }, [Cliente]);\r\n return (\r\n \r\n \r\n \r\n Pero no te preocupes puedes comunicarte con nosotros al{\" \"}\r\n +57 312 656 6283 o haz click en el siguiente{\" \"}\r\n enlace a WhatsApp\r\n \r\n
\r\n Hola {Cliente?.Nombres}
\r\nTu Transaccion fue rechazada :c
\r\n\r\n window.location.href = \"/\"}\r\n >\r\n Volver al Home\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n );\r\n};\r\n\r\nexport default PaymentPending;","//Zona de importacion de componentes externos.\r\nimport axios from \"axios\";\r\nimport React, { useEffect, useState, useRef } from \"react\";\r\nimport { Modal, useModal, ModalTransition } from \"react-simple-hook-modal\";\r\nimport ReactPixel from \"react-facebook-pixel\";\r\n//Zona de importacion de Css.\r\nimport \"../../static/css/Modal.css\";\r\n\r\nimport TagManager from \"react-gtm-module\";\r\nimport { useGlobalContext } from \"../../providers/GlobalStatesProviders\";\r\n\r\nconst ModalGeneral = ({\r\n // modificarClienteState,\r\n // clienteState,\r\n carrito,\r\n modificarCarritoState,\r\n headerState,\r\n errorState,\r\n modificarErrorState,\r\n recursosUrlState,\r\n actualizarSessionStorage,\r\n apiUrlState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n vendedor,\r\n modificarVendedorState,\r\n Bodega,\r\n setBodega,\r\n metodoFact,\r\n setMetodoFact,\r\n}) => {\r\n const { clienteState, modificarClienteState } = useGlobalContext();\r\n\r\n //Constantes a usar para el componente del modal\r\n const { isModalOpen, openModal, closeModal } = useModal();\r\n const [PedidoCorrecto, modificarPedidoCorrecto] = useState(null);\r\n //Cierra el modal desplegado\r\n const cerrarModal = () => {\r\n modificarErrorState({ Error: false, Mensaje: \"\" });\r\n };\r\n\r\n const disabledRef = useRef(false);\r\n\r\n const handleClick = (tipoCliente) => {\r\n if (!disabledRef.current) {\r\n // Desactiva el evento temporalmente\r\n disabledRef.current = true;\r\n CrearRemision(tipoCliente)\r\n // Habilita el evento después de un tiempo determinado\r\n setTimeout(() => {\r\n disabledRef.current = false;\r\n }, 1000); // Tiempo en milisegundos (en este caso, 1000ms = 1 segundo)\r\n }\r\n };\r\n\r\n const CrearRemision = async (tipoCliente) => {\r\n let ciudad = await nombreCiudad();\r\n let linkPersonalizado;\r\n let pedido;\r\n switch (tipoCliente) {\r\n case \"Contraentrega\":\r\n linkPersonalizado = `https://api.whatsapp.com/send?phone=573126566283&text=Hola soy ${clienteState[\r\n \"Nombres\"\r\n ].slice(10)} ${clienteState[\"Apellidos\"]} de la ciudad de ${\r\n ciudad[0]\r\n } (${ciudad[1]}) deseo recibir mi pedido contraentrega`;\r\n pedido = await crearPedido(\"Contraentrega\", linkPersonalizado);\r\n break;\r\n case \"Rappi\":\r\n linkPersonalizado = `https://api.whatsapp.com/send?phone=573126566283&text=Hola soy ${clienteState[\r\n \"Nombres\"\r\n ].slice(10)} ${clienteState[\"Apellidos\"]} de la ciudad de ${\r\n ciudad[0]\r\n } (${ciudad[1]}) deseo recibir mi pedido contraentrega Rappi`;\r\n pedido = await crearPedido(\"Rappi\", linkPersonalizado);\r\n\r\n break;\r\n case \"Consignacion\":\r\n linkPersonalizado = `https://api.whatsapp.com/send?phone=573126566283&text=Hola soy ${clienteState[\"Nombres\"]} ${clienteState[\"Apellidos\"]} de la ciudad de ${ciudad[0]} (${ciudad[1]}) Realice mi compra por medio de consignacion`;\r\n pedido = await crearPedido(\"Consignacion\", linkPersonalizado);\r\n\r\n break;\r\n\r\n default:\r\n cerrarModal();\r\n break;\r\n }\r\n };\r\n\r\n const listaCarrito = () => {\r\n let listaALlevar = [];\r\n for (let i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n // if (carrito[\"Carrito\"][i][\"id\"].slice(-1) === \"U\") {\r\n if (false) {\r\n listaALlevar.push({\r\n _id: carrito[\"Carrito\"][i][\"_id\"],\r\n Cantidad: carrito[\"Carrito\"][i][\"Cantidad\"],\r\n Nombre: carrito[\"Carrito\"][i][\"Nombre\"],\r\n Codigo: carrito[\"Carrito\"][i][\"Codigo\"],\r\n Referencia: carrito[\"Carrito\"][i][\"Codigo\"],\r\n PrecioMayorista: carrito[\"Carrito\"][i][\"PrecioMayorista\"],\r\n PrecioMinorista: carrito[\"Carrito\"][i][\"PrecioMinorista\"],\r\n Talla: carrito[\"Carrito\"][i][\"Talla\"],\r\n DescuentoMayorista: carrito[\"Carrito\"][i][\"DescuentoMayorista\"],\r\n DescuentoMinorista: carrito[\"Carrito\"][i][\"DescuentoMinorista\"],\r\n });\r\n } else {\r\n listaALlevar.push({\r\n _id: carrito[\"Carrito\"][i][\"_id\"],\r\n Cantidad: carrito[\"Carrito\"][i][\"Cantidad\"],\r\n Nombre: carrito[\"Carrito\"][i][\"Nombre\"],\r\n Codigo: carrito[\"Carrito\"][i][\"id\"],\r\n Referencia: carrito[\"Carrito\"][i][\"Codigo\"],\r\n Bodega: carrito[\"Carrito\"][i][\"Bodega\"],\r\n PrecioMayorista: carrito[\"Carrito\"][i][\"PrecioMayorista\"],\r\n PrecioMinorista: carrito[\"Carrito\"][i][\"PrecioMinorista\"],\r\n // PrecioMayoristaSinIva: carrito[\"Carrito\"][i][\"PrecioMayoristaSinIva\"],\r\n Talla: carrito[\"Carrito\"][i][\"Talla\"],\r\n DescuentoMayorista: carrito[\"Carrito\"][i][\"DescuentoMayorista\"],\r\n DescuentoMinorista: carrito[\"Carrito\"][i][\"DescuentoMinorista\"],\r\n });\r\n }\r\n }\r\n\r\n return listaALlevar;\r\n };\r\n\r\n //Limpia el state de carrito de todos los productos actuales.\r\n const vaciarCarrito = () => {\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: [] });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify([]));\r\n };\r\n const crearPedido = async (tipoPago, linkWhatsapp) => {\r\n let tipoPagoNormalizado = tipoPago === \"Rappi\" ? \"Contraentrega\" : tipoPago;\r\n TagManager.dataLayer({\r\n dataLayer: {\r\n event: \"Carrito\",\r\n path: \"/Pedido-Final\",\r\n },\r\n });\r\n\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Creando pedido...\",\r\n });\r\n }\r\n\r\n await axios\r\n .post(apiUrlState + \"/Api/Manager/Crear/remision\", {\r\n Cliente: {\r\n NumeroDocumento: clienteState.NumeroDocumento,\r\n Sucursal: clienteState.Sucursal,\r\n TipoCliente: headerState.Cliente,\r\n TipoPago: tipoPago,\r\n },\r\n Carrito: listaCarrito(),\r\n MedioDePago: tipoPago.toLowerCase(),\r\n Cupon: carrito.Cupon !== null ? carrito.Cupon : \"\",\r\n Banco: \"\",\r\n Vendedor: vendedor,\r\n Bodega: Bodega,\r\n Facturacion: metodoFact.Facturacion,\r\n })\r\n .then((response) => {\r\n if (!response.data.error) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n ReactPixel.track(\"Finalizar Compra\", \"Purchase\");\r\n vaciarCarrito();\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: `Compra Separada ${tipoPagoNormalizado}`,\r\n link: linkWhatsapp,\r\n });\r\n\r\n modificarPedidoCorrecto(true);\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: response.data.Mensaje,\r\n Referencias: response.data.ProductosNoPermitidos,\r\n tipoPago: tipoPago,\r\n });\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (\r\n err.response.data.Mensaje ===\r\n \"Se han agotado algunos productos de tu carrito.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.Mensaje,\r\n Referencias: err.response.data.ProductosNoPermitidos,\r\n });\r\n } else if (\r\n !err.response.data.Mensaje === \"No es posible generar el pedido.\"\r\n ) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: err.response.data.Mensaje,\r\n });\r\n } else if (err.response.data.Mensaje !== undefined) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n };\r\n\r\n const formatNumber = (amount) => {\r\n let algo = Math.round(amount);\r\n var temp = algo + \"\";\r\n var i = temp.length - 3;\r\n while (i > 0) {\r\n temp = temp.substring(0, i) + \".\" + temp.substring(i);\r\n i -= 3;\r\n }\r\n return \" \" + temp;\r\n };\r\n const nombreCiudad = async () => {\r\n let ciudad = clienteState[\"Ciudad\"];\r\n let Departamento = clienteState[\"Departamento\"];\r\n let ciudaR = await axios.post(apiUrlState + \"/Api/Pedido/VerificarCiudad\", [\r\n {\r\n _id: ciudad,\r\n },\r\n { Departamento: Departamento },\r\n ]);\r\n return [ciudaR.data[0].Nombre, ciudaR.data[0].Departamento.Nombre];\r\n };\r\n //Redirige a la vista /Mercado y se modifica el error State.\r\n const volverMercado = () => {\r\n if (headerState[\"Cliente\"] === \"Minoristas\") window.location.href = \"/\";\r\n else if (headerState[\"Cliente\"] === \"Mayoristas\" && localStorage.getItem(\"Vendedor\")) {\r\n window.location.href = \"/Preventa/Catalogo\";\r\n } else {\r\n window.location.href = \"/Mayoristas\";\r\n }\r\n modificarErrorState({ Error: false, Mensaje: \"\" });\r\n };\r\n const volver = () => {\r\n modificarClienteState({\r\n ...clienteState,\r\n Correo: \"\",\r\n });\r\n modificarErrorState({ Error: false, Mensaje: \"\" });\r\n };\r\n const informacionAdicional = async () => {\r\n let ciudad = await nombreCiudad();\r\n let linkPersonalizado = `https://api.whatsapp.com/send?phone=573126566283&text=Hola soy ${clienteState[\"Nombres\"]} ${clienteState[\"Apellidos\"]} de la ciudad de ${ciudad[0]} (${ciudad[1]}) Realice mi compra por medio de consignacion`;\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: `Compra Separada Consignacion`,\r\n link: linkPersonalizado,\r\n });\r\n };\r\n\r\n const informacionAdicionalPSE = async () => {\r\n let ciudad = await nombreCiudad();\r\n let linkPersonalizado = `https://api.whatsapp.com/send?phone=573126566283&text=Hola soy ${clienteState[\"Nombres\"]} ${clienteState[\"Apellidos\"]} de la ciudad de ${ciudad[0]} (${ciudad[1]}) Realice mi compra por medio de PSE`;\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: `Compra Separada PSE`,\r\n link: linkPersonalizado,\r\n });\r\n };\r\n\r\n const informacionAdicionalAddi = async () => {\r\n let ciudad = await nombreCiudad();\r\n let linkPersonalizado = `https://api.whatsapp.com/send?phone=573126566283&text=Hola soy ${clienteState[\"Nombres\"]} ${clienteState[\"Apellidos\"]} de la ciudad de ${ciudad[0]} (${ciudad[1]}) Realice mi compra por medio de ADDI`;\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: `Compra Separada ADDI`,\r\n link: linkPersonalizado,\r\n });\r\n };\r\n\r\n const volverMercadoAjustado = () => {\r\n // AjustarPedido();\r\n if (headerState[\"Cliente\"] === \"Minoristas\") window.location.href = \"/\";\r\n else window.location.href = \"/Mayoristas\";\r\n modificarErrorState({ Error: false, Mensaje: \"\" });\r\n };\r\n const AjustarPedido = async (tipopago) => {\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n for (var j = 0; j < errorState[\"Referencias\"].length; j++) {\r\n if (\r\n carrito[\"Carrito\"][i][\"Codigo\"] ===\r\n errorState[\"Referencias\"][j][\"Referencia\"]\r\n ) {\r\n if (errorState[\"Referencias\"][j][\"Cantidad\"] > 0) {\r\n disminuirCantidad(\r\n carrito[\"Carrito\"][i],\r\n errorState[\"Referencias\"][j][\"Cantidad\"]\r\n );\r\n } else {\r\n borrarElemento(carrito[\"Carrito\"][i]);\r\n }\r\n }\r\n }\r\n }\r\n //window.location.href = '/Pedido'\r\n modificarErrorState({ Error: false, Mensaje: \"\" });\r\n if (headerState[\"Cliente\"] === \"Mayoristas\") CrearRemision(tipopago);\r\n };\r\n\r\n const AjustarValores = async () => {\r\n let Nombre = clienteState[\"Nombres\"].slice(10);\r\n clienteState[\"Nombres\"] = Nombre;\r\n modificarClienteState({ ...clienteState, Nombres: Nombre });\r\n cerrarModal();\r\n };\r\n\r\n const calcularDescuento = (precio, descuento) => {\r\n const precioInt = parseInt(precio);\r\n const descuentoAplicar = parseInt(descuento);\r\n return precioInt - precioInt * (descuentoAplicar / 100);\r\n };\r\n\r\n //Disminuye la cantidad de un producto en el carrito en 1 segun la talla ingresada de este.\r\n //Actualiza el state del carrito y tambien el sesion storage.\r\n const disminuirCantidad = (producto, cantidad) => {\r\n for (var i = 0; i < carrito[\"Carrito\"].length; i++) {\r\n if (producto[\"id\"] === carrito[\"Carrito\"][i][\"id\"]) {\r\n if (carrito[\"Carrito\"][i][\"Cantidad\"] - 1 === 0)\r\n carrito[\"Carrito\"].splice(i, 1);\r\n else carrito[\"Carrito\"][i][\"Cantidad\"] = cantidad;\r\n }\r\n }\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n };\r\n\r\n //Elimina un producto del state del carrito.\r\n const borrarElemento = (producto) => {\r\n carrito[\"Carrito\"] = carrito[\"Carrito\"].filter(\r\n (item) => item[\"id\"] !== producto[\"id\"]\r\n );\r\n const carritoNew = [...carrito[\"Carrito\"]];\r\n modificarCarritoState({ Accion: \"Activo\", Carrito: carritoNew });\r\n actualizarSessionStorage(\"Carrito\", JSON.stringify(carritoNew));\r\n };\r\n\r\n //Esta funcion comprueba si existe la imagen en version jpg del producto, en caso que no, se lanza la imagen de respaldo general 'base'.\r\n const comprobarImgProducto = (codigo, talla) => {\r\n const imagen = document.getElementById(codigo + talla + \"Pedido\");\r\n let img = document.createElement(\"img\");\r\n img.src = recursosUrlState + \"/img/Productos/Ref \" + codigo + \".webp\";\r\n imagen.innerHTML =\r\n \"\r\n {/* */}\r\n {/* \r\n \r\n Cuando realices el pago envíanos el\r\n comprobante por WhatsApp al siguiente número{\" \"}\r\n +57 312 656 6283 o haz click en el siguiente{\" \"} \r\n enlace a WhatsApp\r\n \r\n
\r\n */}\r\n {/* Hola {Cliente?.Nombres}
\r\nTu Transaccion se encuentra en estado pendiente de pago
\r\n¡Gracias por tu compra!
\r\n\r\n window.location.href = \"/\"}\r\n >\r\n Volver al Home\r\n \r\n
\r\n\r\n \";\r\n img.onerror = function () {\r\n imagen.innerHTML =\r\n \"\";\r\n };\r\n };\r\n\r\n //Si el modal esta cerrado y el errorState es true.\r\n //Si el modal esta abierto y el errorState es false.\r\n useEffect(() => {\r\n if (!isModalOpen && errorState[\"Error\"]) openModal();\r\n else if (isModalOpen && !errorState[\"Error\"]) closeModal();\r\n });\r\n\r\n return (\r\n \r\n \r\n \r\n {errorState[\"Mensaje\"]}\r\n \r\n volverMercado()}\r\n >\r\n Volver Al Mercado\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Talla no disponible para esta referencia.\" ? (\r\n \r\n Discúlpanos\r\n
\r\n\r\n \r\n \r\n Actualmente no contamos con mas disponibilidad de tallas para esta\r\n referencia\r\n \r\n volver()}\r\n >\r\n Volver Al Mercado\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Datos incompletos...\" ? (\r\n \r\n Discúlpanos\r\n
\r\n\r\n \r\n \r\n Datos incompletos o errados por favor verifíca el campo:
\r\n {errorState[\"faltante\"]}\r\n \r\n\r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Politica de datos\" ? (\r\n \r\n Verifica tus Datos\r\n
\r\n\r\n {errorState[\"faltante\"]}\r\n \r\n\r\n
\r\n \r\n Al realizar compras en nuestra tienda online, todo comprador\r\n autoriza el envió de información por medio de correo y mensajería\r\n de texto de parte de DK. y dando cumplimiento de la Ley 1581\r\n de 2012, DK Reconoce y protege el derecho que tienen todas\r\n las personas a conocer, actualizar y rectificar las informaciones\r\n que se hayan recogido sobre ellas en nuestras bases de datos.\r\n \r\n\r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Este campo no puede contener menos de 6 digitos O mas de 13 digitos\" ? (\r\n \r\n Politica de tratamiento de datos personales y envio de publicidad\r\n
\r\n\r\n\r\n \r\n \r\n Este campo no puede contener menos de 6 digitos O mas de 13\r\n digitos.\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Este campo no puede contener letras o caracteres especiales, solo numeros\" ? (\r\n \r\n Verifica tus Datos\r\n
\r\n\r\n \r\n \r\n Este campo no puede contener letras o caracteres especiales, solo\r\n numeros.\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Este campo no puede contener menos de 9 digitos\" ? (\r\n \r\n Verifica tus Datos\r\n
\r\n\r\n \r\n \r\n Este campo no puede contener menos de 9 digitos.\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"La fecha ingresada es incorrecta\" ? (\r\n \r\n Verifica tus Datos\r\n
\r\n\r\n \r\n \r\n La fecha ingresada es incorrecta.\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Revisa Tus Datos.\" ? (\r\n \r\n Verifica tus Datos\r\n
\r\n\r\n \r\n \r\n El correo que has ingresado ya esta en uso por otro usuario.\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Se han agotado algunos productos de tu carrito.\" ? (\r\n \r\n Verifica tus Datos\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n volver()}\r\n >\r\n Volver\r\n \r\n
\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"No es posible generar el pedido.\" ? (\r\n \r\n Algunos productos de tu carrito se han agotado.\r\n
\r\n- \r\n
\r\n {errorState[\"Referencias\"].map((producto) => (\r\n
\r\n \r\n
\r\n ))}\r\n \r\n
\r\n \r\n e.target.src = `${recursosUrlState}/img/General/base2.png`}\r\n />\r\n
\r\n \r\n
\r\n \r\n Referencia: {producto[\"Codigo\"]}\r\n
\r\n\r\n Talla: {producto[\"Talla\"]}\r\n
\r\n\r\n Cantidad Disponible: {producto[\"Cantidad\"]}\r\n
\r\n\r\n Deseas continuar sin estas referencias.\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n volverMercadoAjustado()}\r\n >\r\n NO\r\n \r\n
\r\n \r\n AjustarPedido(errorState[\"tipoPago\"])}\r\n >\r\n SI\r\n \r\n
\r\n \r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Consignacion Bancolombia\" ? (\r\n \r\n Discúlpanos\r\n
\r\n- \r\n {errorState[\"Referencias\"].map((Referencia) => (\r\n
\r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Modal/pin-negro.png\";\r\n }}\r\n />\r\n \r\n Hola {clienteState[\"Nombres\"]}, paga tu pedido en Bancolombia por\r\n medio de una transferencia Electrónica, consignación mediante un\r\n corresponsal bancario o PAC. No directamente en un banco para\r\n evitar el cobro de la transacción que será cargado a tu pedido.\r\n \r\n \r\n Nro Cuenta: 87400006820.
\r\n Tipo de cuenta: Corriente.
\r\n El total a pagar seria $ {formatNumber(errorState[\"Total\"])}{\" \"}\r\n pesos.\r\n \r\n\r\n handleClick(\"Consignacion\")}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Consignacion Efecty\" ||\r\n errorState[\"Mensaje\"] === \"Consignacion SuperGiros\" ? (\r\n \r\n BANCOLOMBIA\r\n
\r\n\r\n Tipo de cuenta: Corriente.
\r\n El total a pagar seria $ {formatNumber(errorState[\"Total\"])}{\" \"}\r\n pesos.\r\n \r\n\r\n
\r\n * El valor del envió lo cancelaras cuando recibas tu pedido.\r\n
\r\n\r\n\r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Modal/pin-negro.png\";\r\n }}\r\n />\r\n \r\n Hola {clienteState[\"Nombres\"]} para el pago por \r\n {errorState[\"Mensaje\"].slice(13)}, debes tener presente que el\r\n valor del envió de dinero corre por tu cuenta, a nosotros debe\r\n llegarnos el valor total del pedido.\r\n \r\n \r\n Jose David Victoria
\r\n CC: 1116250415.
\r\n Tuluá - Valle del cauca.
\r\n el total a pagar seria $ {formatNumber(errorState[\"Total\"])}{\" \"}\r\n Pesos.\r\n \r\n\r\n handleClick(\"Consignacion\")}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Envio Rappi\" ? (\r\n \r\n {errorState[\"Mensaje\"].slice(13)}\r\n
\r\n\r\n CC: 1116250415.
\r\n Tuluá - Valle del cauca.
\r\n el total a pagar seria $ {formatNumber(errorState[\"Total\"])}{\" \"}\r\n Pesos.\r\n \r\n\r\n
\r\n * El valor del envió lo cancelaras cuando recibas tu pedido.\r\n
\r\n\r\n\r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Modal/pin-negro.png\";\r\n }}\r\n />\r\n\r\n \r\n Hola {clienteState[\"Nombres\"].slice(10)} te enviamos tu pedido con\r\n Rappi el cual tiene un costo promedio entre{\" \"}\r\n {errorState[\"EnvioRR\"]}.\r\n \r\n \r\n el total a pagar seria $ {formatNumber(errorState[\"Total\"])}{\" \"}\r\n Pesos.\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Ciudad Disponible para RR\" ? (\r\n \r\n Envio con Recaudo\r\n
\r\n\r\n * El valor del envió lo cancelaras cuando recibas tu pedido.\r\n
\r\n\r\n\r\n ¿Te lo enviamos?\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n AjustarValores()}\r\n >\r\n NO\r\n \r\n
\r\n \r\n handleClick(\"Rappi\")}\r\n >\r\n SI\r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Modal/pin-negro.png\";\r\n }}\r\n />\r\n\r\n \r\n Hola {clienteState[\"Nombres\"].slice(10)} ten en cuenta que este\r\n servicio tiene un costo adicional de $\r\n {formatNumber(errorState[\"EnvioRR\"])}\r\n pesos, este valor es lo que cobraría la trasportadora por\r\n recaudar tu dinero y enviarlo a nosotros.\r\n \r\n \r\n El total a pagar seria\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Ciudad NO disponible para RR\" ? (\r\n \r\n Envio con Recaudo\r\n
\r\n\r\n * El valor del envió lo cancelaras cuando recibas tu pedido.\r\n
\r\n\r\n ¿Te lo enviamos?\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n AjustarValores()}\r\n >\r\n NO\r\n \r\n
\r\n \r\n handleClick(\"Contraentrega\")}\r\n >\r\n SI\r\n \r\n
\r\n \r\n \r\n \r\n Lo sentimos {clienteState[\"Nombres\"]} no contamos con este\r\n servicio para tu ciudad.\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Monto NO disponible para RR\" ? (\r\n \r\n Discúlpanos\r\n
\r\n\r\n \r\n \r\n Por políticas internas de la\r\n transportadora el monto máximo para pedidos contra entrega es de\r\n $2.000.000 COP.\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Compra Separada Consignacion\" ? (\r\n \r\n Lo sentimos\r\n
\r\n\r\n \r\n \r\n {clienteState[\"Nombres\"]} Recuerda que tienes 48 Horas a partir de\r\n este momento para realizar el pago o tu pedido sera eliminado\r\n automaticamente.\r\n \r\n \r\n Cuando realices el pago envíanos el comprobante por WhatsApp al\r\n siguiente número +57 312 656 6283 o haz click en el\r\n siguiente enlace a WhatsApp\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Compra Separada PSE\" ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n volverMercado()}\r\n >\r\n Volver Al Mercado\r\n \r\n
\r\n \r\n (window.location.href = errorState[\"link\"])}\r\n style={{ cursor: \"pointer\" }}\r\n >\r\n WhatsApp\r\n \r\n
\r\n \r\n \r\n\r\n \r\n {clienteState[\"Nombres\"]} Cuando realices el pago envíanos el\r\n comprobante por WhatsApp al siguiente número{\" \"}\r\n +57 312 656 6283 o haz click en el siguiente{\" \"}\r\n enlace a WhatsApp\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Compra Separada ADDI\" ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n volverMercado()}\r\n >\r\n Volver Al Mercado\r\n \r\n
\r\n \r\n (window.location.href = errorState[\"link\"])}\r\n style={{ cursor: \"pointer\" }}\r\n >\r\n WhatsApp\r\n \r\n
\r\n \r\n \r\n\r\n \r\n {clienteState[\"Nombres\"]} Cuando realices el pago envíanos el\r\n comprobante por WhatsApp al siguiente número{\" \"}\r\n +57 312 656 6283 o haz click en el siguiente{\" \"}\r\n enlace a WhatsApp\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Compra Separada Contraentrega\" ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n volverMercado()}\r\n >\r\n Volver Al Mercado\r\n \r\n
\r\n \r\n (window.location.href = errorState[\"link\"])}\r\n style={{ cursor: \"pointer\" }}\r\n >\r\n WhatsApp\r\n \r\n
\r\n \r\n \r\n \r\n {clienteState[\"Nombres\"].slice(10)} Confirmanos que deseas recibir\r\n tu compra con pago contraentrega.Escribenos por WhatsApp al\r\n siguiente número +57 312 656 6283 o haz click en el\r\n siguiente enlace a WhatsApp\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Tu cupon se canjeo correctamente\" ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n volverMercado()}\r\n >\r\n Volver Al Mercado\r\n \r\n
\r\n \r\n (window.location.href = errorState[\"link\"])}\r\n style={{ cursor: \"pointer\" }}\r\n >\r\n WhatsApp\r\n \r\n
\r\n \r\n \r\n \r\n {errorState[\"Cliente\"].split(\"-\")[1]} tu cupón de{\" \"}\r\n {errorState[\"Descripcion\"].toLowerCase()} se valido correctamente\r\n
\r\n {errorState[\"Tipo\"] === \"DESCUENTO\"\r\n ? \"el total de tu compra tendra un \" +\r\n errorState[\"valor\"] +\r\n \"% de descuento.\"\r\n : \"el total de tu compra tendra un descuento de $\" +\r\n errorState[\"valor\"] +\r\n \" pesos.\"}\r\n \r\n\r\n cerrarModal()}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Tu cupon es invalido o ha expirado\" ? (\r\n \r\n Cupón Validado\r\n
\r\n\r\n {errorState[\"Tipo\"] === \"DESCUENTO\"\r\n ? \"el total de tu compra tendra un \" +\r\n errorState[\"valor\"] +\r\n \"% de descuento.\"\r\n : \"el total de tu compra tendra un descuento de $\" +\r\n errorState[\"valor\"] +\r\n \" pesos.\"}\r\n \r\n\r\n
\r\n \r\n \r\n {errorState[\"Cliente\"]} lo sentimos tu cupón es invalido o ya ha\r\n vencido.\r\n
\r\n Escríbenos para validar la información.\r\n \r\n\r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Te redireccionamos a la ventana de pago.\" ? (\r\n \r\n Cupón Validado\r\n
\r\n\r\n Escríbenos para validar la información.\r\n \r\n\r\n
\r\n
\r\n \r\n
\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n \r\n \r\n (window.location.href =\r\n \"https://api.whatsapp.com/send?phone=573126566283&text=Hola DK soy \" +\r\n clienteState[\"Nombres\"] +\r\n \" \" +\r\n clienteState[\"Apellidos\"] +\r\n \" estoy teniendo problemas para canjear un cupon.\")\r\n }\r\n style={{ cursor: \"pointer\" }}\r\n >\r\n WhatsApp\r\n \r\n
\r\n \r\n \r\n \r\n {clienteState[\"Nombres\"]} Te redireccionamos a la ventana de pago\r\n PSE.
\r\n Recuerda permitir las ventanas emergentes y redirecciones en tu\r\n navegador para esta pagina.\r\n
El total a pagar seria\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n\r\n informacionAdicionalPSE()}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Te redireccionamos a la ventana de pago.\" ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n Recuerda permitir las ventanas emergentes y redirecciones en tu\r\n navegador para esta pagina.\r\n
El total a pagar seria\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n\r\n
\r\n \r\n \r\n {clienteState[\"Nombres\"]} Te redireccionamos a la ventana de pago\r\n PSE.
\r\n Recuerda permitir las ventanas emergentes y redirecciones en tu\r\n navegador para esta pagina.\r\n
El total a pagar seria\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n\r\n informacionAdicionalPSE()}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] ===\r\n \"Te redireccionamos a la ventana de pago Addi.\" ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n Recuerda permitir las ventanas emergentes y redirecciones en tu\r\n navegador para esta pagina.\r\n
El total a pagar seria\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n\r\n
\r\n \r\n \r\n {clienteState[\"Nombres\"]} Te redireccionamos a la ventana de pago\r\n ADDI.
\r\n Recuerda regresar a esta pestaña al realizar el pago para continuar con el proceso.\r\n
\r\n Cuando realices el pago puedes dar clic en Aceptar.\r\n
El total a pagar sería\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n \r\n informacionAdicionalAddi()}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Registro exitoso\" ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n Recuerda regresar a esta pestaña al realizar el pago para continuar con el proceso.\r\n
\r\n Cuando realices el pago puedes dar clic en Aceptar.\r\n
El total a pagar sería\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n \r\n
\r\n Pagar con ADDI\r\n
\r\n \r\n\r\n\r\n \r\n \r\n Gracias por tu participación.
\r\n Esperamos ver todo tu talento.
\r\n ¡Muchos éxitos!.\r\n \r\n \r\n }\r\n >\r\n Aceptar\r\n \r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"Bienvenido Vendedor\" ? (\r\n \r\n Tu registro fue exitoso\r\n
\r\n\r\n Esperamos ver todo tu talento.
\r\n ¡Muchos éxitos!.\r\n \r\n \r\n
\r\n \r\n cerrarModal()}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"] === \"este es tu pin\" ? (\r\n \r\n PREVENTA MERCADER\r\n
\r\n\r\n BIENVENID@ {errorState[\"Vendedor\"]}\r\n
\r\n\r\n\r\n \r\n \r\n {clienteState[\"Nombres\"]} tu pin de pago {errorState[\"MedioPago\"]}{\" \"}\r\n es:\r\n
\r\n {errorState[\"pin\"]}\r\n
El total a pagar seria\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n\r\n informacionAdicionalPSE()}\r\n >\r\n Aceptar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"].indexOf(\"Este es tu pin\") < 0 &&\r\n errorState[\"Mensaje\"].indexOf(\r\n \"Te redireccionamos a la ventana de pago.\"\r\n ) < 0 &&\r\n errorState[\"Mensaje\"].indexOf(\"Hemos separado tu compra\") < 0 &&\r\n errorState[\"Mensaje\"].indexOf(\"Tu cupon se canjeo correctamente\") <\r\n 0 &&\r\n errorState[\"Mensaje\"].indexOf(\"Tu cupon es invalido o ha expirado\") <\r\n 0 ? (\r\n \r\n Hemos Separado Tu Compra\r\n
\r\n\r\n {errorState[\"pin\"]}\r\n
El total a pagar seria\r\n $ {formatNumber(errorState[\"Total\"])} Pesos.\r\n \r\n\r\n
\r\n \r\n \r\n {errorState[\"Mensaje\"]}\r\n \r\n cerrarModal()}\r\n >\r\n Cerrar\r\n \r\n
\r\n ) : errorState[\"Mensaje\"].indexOf(\"Tu cupon se canjeo correctamente\") <\r\n 0 &&\r\n errorState[\"Mensaje\"].indexOf(\"Tu cupon es invalido o ha expirado\") <\r\n 0 ? (\r\n \r\n Vaya..\r\n
\r\n\r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Modal/pin-negro.png\";\r\n }}\r\n />\r\n\r\n volverMercado()}\r\n >\r\n Volver a la tienda\r\n \r\n
\r\n ) : (\r\n \r\n Pedido Separado\r\n
\r\n\r\n
\r\n \r\n \r\n {errorState[\"Mensaje\"]}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Total a Pagar\r\n \r\n
\r\n \r\n \r\n {formatNumber(errorState[\"Total\"])}\r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Modal/pin-negro.png\";\r\n }}\r\n />\r\n \r\n {errorState[\"Mensaje\"]} few\r\n \r\n cerrarModal()}\r\n >\r\n Aceptar\r\n \r\n
\r\n )}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default ModalGeneral;\r\n","//Zona de importacion de componentes externos.\r\nimport React, { useEffect, useState } from \"react\";\r\nimport { Link, useHistory } from \"react-router-dom\";\r\nimport axios from \"axios\";\r\n//import { useNavigate } from \"react-router-dom\";\r\n//Zona de importacion de componentes internos.\r\nimport Registro from \"./Registro\";\r\nimport { useGlobalContext } from \"../../providers/GlobalStatesProviders\";\r\n\r\nconst InicioSesion = ({\r\n headerState,\r\n modificarHeaderState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n // clienteState,\r\n // modificarClienteState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n errorState,\r\n modificarErrorState,\r\n pedidoState,\r\n modificarPedidoState,\r\n administradorState,\r\n modificarAdministradorState,\r\n actualizarSessionStorage,\r\n}) => {\r\n const { clienteState, modificarClienteState } = useGlobalContext();\r\n\r\n // states\r\n const [inputs, setInputs] = useState({ email: \"\", password: \"\" });\r\n const [mensaje, setMensaje] = useState();\r\n const [loading, setLoading] = useState(false);\r\n\r\n const { email, password } = inputs;\r\n\r\n const HandleChange = (e) => {\r\n console.log(\"[e.target.name]\", e.target.name)\r\n console.log(\"[e.target.value]\", e.target.value)\r\n setInputs({ ...inputs, [e.target.name]: e.target.value });\r\n };\r\n\r\n const history = useHistory();\r\n\r\n const onSubmit = async (e) => {\r\n console.log(\"ENTRA CLICK\", e.email, password )\r\n e.preventDefault();\r\n if (email !== \"\" && password !== \"\") {\r\n const Usuario = {\r\n email,\r\n password,\r\n };\r\n setLoading(true);\r\n await axios\r\n .post(apiUrlState+\"/Api/auth/signin\", Usuario)\r\n .then((res) => {\r\n const { data } = res;\r\n setMensaje(data.mensaje);\r\n setTimeout(() => {\r\n setMensaje(\"\");\r\n \r\n localStorage.setItem(\"token\", data?.token);\r\n history.push('/Admin/Indicadores')\r\n //navigate(`/welcome`);\r\n }, 1500);\r\n })\r\n .catch((error) => {\r\n console.error(error);\r\n setMensaje(\"email u password incorrecta\");\r\n setTimeout(() => {\r\n setMensaje(\"\");\r\n }, 1500);\r\n });\r\n setInputs({ email: \"\", password: \"\" });\r\n setLoading(false);\r\n }\r\n };\r\n //retorna el string recibido con la primera letra mayuscula.\r\n const capitalizarPalabras = (val) => {\r\n var minuscula = val.toLowerCase();\r\n return val !== \"\" ? minuscula[0].toUpperCase() + minuscula.slice(1) : \"\";\r\n };\r\n\r\n //Funcion principal:\r\n //Esta funcion revisa las credenciales ingresadas, si estas son correctas realiza el inicio de sesion del cliente,\r\n //actualizando el state de Cliente y tambien el localStorage.\r\n const ingresar = async () => {\r\n let usuario = document.getElementById(\"usuario_input\").value;\r\n let contraseña = document.getElementById(\"contraseña_input\").value;\r\n if (usuario === \"\")\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"El ingreso del correo es obligatorio\",\r\n });\r\n else if (contraseña === \"\")\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"El ingreso de la contraseña es obligatorio\",\r\n });\r\n else {\r\n await ConsultarUsuario(contraseña, function (respuesta) {\r\n if (respuesta[\"Existe\"]) {\r\n if (respuesta[\"Email\"].toLowerCase() === usuario.toLowerCase()) {\r\n if (respuesta[\"Documento\"] !== \"1116283149\") {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n Registro: false,\r\n Accion: \"Activo\",\r\n Sesion: true,\r\n TipoDocumento: respuesta[\"TipoDocumento\"],\r\n NumeroDocumento: respuesta[\"NumeroDocumento\"],\r\n Nombres: capitalizarPalabras(respuesta[\"Nombres\"]),\r\n Apellidos: capitalizarPalabras(respuesta[\"Apellidos\"]),\r\n Correo: respuesta[\"Correo\"],\r\n Genero: respuesta[\"Genero\"],\r\n Celular: respuesta[\"Celular\"],\r\n FechaNacimiento: respuesta[\"FechaNacimiento\"],\r\n Pais: respuesta[\"Pais\"],\r\n Ciudad: respuesta[\"Ciudad\"],\r\n Departamento: respuesta[\"Departamento\"],\r\n Direccion: respuesta[\"Direccion\"],\r\n Barrio: respuesta[\"Barrio\"],\r\n })\r\n );\r\n modificarClienteState({\r\n Registro: false,\r\n Accion: \"Activo\",\r\n Sesion: true,\r\n TipoDocumento: respuesta[\"TipoDocumento\"],\r\n NumeroDocumento: respuesta[\"NumeroDocumento\"],\r\n Nombres: capitalizarPalabras(respuesta[\"Nombres\"]),\r\n Apellidos: capitalizarPalabras(respuesta[\"Apellidos\"]),\r\n Correo: respuesta[\"Correo\"],\r\n Genero: respuesta[\"Genero\"],\r\n Celular: respuesta[\"Celular\"],\r\n FechaNacimiento: respuesta[\"FechaNacimiento\"],\r\n Pais: respuesta[\"Pais\"],\r\n Ciudad: respuesta[\"Ciudad\"],\r\n Departamento: respuesta[\"Departamento\"],\r\n Direccion: respuesta[\"Direccion\"],\r\n Barrio: respuesta[\"Barrio\"],\r\n });\r\n } else {\r\n actualizarSessionStorage(\r\n \"Administrador\",\r\n JSON.stringify({\r\n Recuperar: false,\r\n NumeroDocumento: respuesta[\"NumeroDocumento\"],\r\n Nombrse: capitalizarPalabras(respuesta[\"Nombres\"]),\r\n Apellidos: capitalizarPalabras(respuesta[\"Apellidos\"]),\r\n Tipo: \"Vendedor\",\r\n })\r\n );\r\n modificarAdministradorState({\r\n Recuperar: false,\r\n NumeroDocumento: respuesta[\"NumeroDocumento\"],\r\n Nombres: capitalizarPalabras(respuesta[\"Nombres\"]),\r\n Apellidos: capitalizarPalabras(respuesta[\"Apellidos\"]),\r\n Tipo: \"Vendedor\",\r\n });\r\n }\r\n\r\n window.location.href = \"/\";\r\n } else {\r\n modificarErrorState({ Error: true, Mensaje: \"Correo incorrecto\" });\r\n }\r\n } else {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje:\r\n \"El usuario no existe o la contraseña es incorrecta (Recuerda que tu contraseña es tu numero de cedula, sin ningun caracter especial)\",\r\n });\r\n }\r\n });\r\n }\r\n };\r\n\r\n //Esta funcion retorna true si todos los campos del clienteState estan llenos, false si no.\r\n const revisionDatosUsuarios = () => {\r\n for (const dato in clienteState)\r\n if (clienteState[dato] === \"\") return false;\r\n return true;\r\n };\r\n\r\n //Funcion principal:\r\n //Crea a un usuario en la base de datos de la pagina y de contapyme, segun los datos obtenidos y deja la sesion iniciado con este.\r\n const crearUsuario = async (callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Creandote en nuestra base de datos...\",\r\n });\r\n }\r\n await getJWT(async function (token) {\r\n await axios\r\n .post(\r\n apiUrlState + \"/Usuario/CrearUsuarioReact\",\r\n {\r\n TipoDocumento: clienteState[\"TipoDocumento\"],\r\n NumeroDocumento: clienteState[\"NumeroDocumento\"],\r\n Nombres: clienteState[\"Nombres\"],\r\n Apellidos: clienteState[\"Apellidos\"],\r\n Correo: clienteState[\"Correo\"],\r\n Genero: clienteState[\"Genero\"],\r\n Celular: clienteState[\"Celular\"],\r\n Nacimiento: clienteState[\"Nacimiento\"],\r\n Pais: clienteState[\"Pais\"],\r\n Ciudad: clienteState[\"Ciudad\"],\r\n Departamento: clienteState[\"Departamento\"],\r\n Direccion: clienteState[\"Direccion\"],\r\n Barrio: clienteState[\"Barrio\"],\r\n },\r\n {\r\n headers: {\r\n authorization: \"Bearer \" + token[\"token\"],\r\n },\r\n }\r\n )\r\n .then((response) => {\r\n if (response.data.Creado) {\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n Sesion: true,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n Sesion: true,\r\n });\r\n callback(true);\r\n } else {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n callback(false);\r\n }\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n });\r\n };\r\n\r\n //Verifica si el usuario ya esta registrado, si no se crea.\r\n const registrar = async () => {\r\n if (revisionDatosUsuarios()) {\r\n await ConsultarUsuario(\r\n clienteState[\"Documento\"],\r\n async function (usuario) {\r\n if (usuario[\"Existe\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Este usuario ya esta registrado\",\r\n });\r\n } else {\r\n await crearUsuario(async function (respuesta) {\r\n if (respuesta) {\r\n window.location.href = \"/\";\r\n }\r\n });\r\n }\r\n }\r\n );\r\n } else {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Todos los campos son obligatorios\",\r\n });\r\n }\r\n };\r\n\r\n //Obtiene el codigo JWT mediante las credenciales a la api rest.\r\n const getJWT = async (callback) => {\r\n await axios\r\n .post(apiUrlState + \"/auth/get-token/\", {\r\n username: \"CroattaWeb\",\r\n password: \"Since2013\",\r\n })\r\n .then((response) => {\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(response.data);\r\n })\r\n .catch(function (err) {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n };\r\n\r\n //Consulta a un usuario en la Bd segun su numero de documento.\r\n const ConsultarUsuario = async (Identificacion, callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Investigando tus antecedentes...\",\r\n });\r\n }\r\n await getJWT(async function (token) {\r\n await axios\r\n .post(\r\n apiUrlState + \"/Usuario/ConsultaUsuarioReact\",\r\n {\r\n Id: Identificacion,\r\n },\r\n {\r\n headers: {\r\n authorization: \"Bearer \" + token[\"token\"],\r\n },\r\n }\r\n )\r\n .then((response) => {\r\n if (response.status === 200) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(response.data);\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al consultar usuario\",\r\n });\r\n }\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n }\r\n });\r\n });\r\n };\r\n\r\n //Establece el campo de modo registro como false en el clienteState, tambien actualiza la localStorage.\r\n const cambioInicioSesion = () => {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n Registro: false,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n Registro: false,\r\n });\r\n };\r\n\r\n //Establece el campo de modo registro como true en el clienteState, tambien actualiza la localStorage.\r\n const cambioRegistro = () => {\r\n actualizarSessionStorage(\r\n \"Cliente\",\r\n JSON.stringify({\r\n ...clienteState,\r\n Registro: true,\r\n })\r\n );\r\n modificarClienteState({\r\n ...clienteState,\r\n Registro: true,\r\n });\r\n };\r\n\r\n //Funcion que se ejecuta cada vez que se inicia este componente.\r\n //Pregunta si la sesion ya esta iniciada y si es asi redirecciona al /Mercado, tambien actualizando el localStorage.\r\n useEffect(() => {\r\n if (clienteState[\"Sesion\"]) window.location.href = \"/Mercado\";\r\n var header = JSON.parse(JSON.stringify(headerState));\r\n if (header[\"displayBuscar\"] !== \"none\") {\r\n header[\"displayBuscar\"] = \"none\";\r\n header[\"displayFlecha\"] = \"none\";\r\n modificarHeaderState(header);\r\n }\r\n });\r\n\r\n return (\r\n \r\n Informacion cupo\r\n
\r\n\r\n {clienteState[\"Registro\"] ? (\r\n
\r\n );\r\n};\r\n\r\nexport default InicioSesion;\r\n","import React, { useEffect } from \"react\";\r\nimport Footer from \"../Footer/Footer\";\r\n\r\nconst Ayuda = ({\r\n headerState,\r\n modificarHeaderState,\r\n ayudaState,\r\n modificarAyudaState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n}) => {\r\n //Se determina que opcion de ayuda es y se modifica el state de Ayuda.\r\n const opcionAyuda = (opcion) => {\r\n if (opcion === \"Producto\")\r\n modificarAyudaState({ Producto: true, Envio: false, Cambios: false });\r\n else if (opcion === \"Envio\")\r\n modificarAyudaState({ Producto: false, Envio: true, Cambios: false });\r\n else if (opcion === \"Cambios\")\r\n modificarAyudaState({ Producto: false, Envio: false, Cambios: true });\r\n else modificarAyudaState({ Producto: false, Envio: false, Cambios: false });\r\n };\r\n\r\n //Funciona que se ejecuta al iniciar un componente.\r\n //Si la barra de busqueda esta desplegada se oculta y se actualiza el state del Header.\r\n useEffect(() => {\r\n var header = JSON.parse(JSON.stringify(headerState));\r\n if (header[\"displayBuscar\"] !== \"none\") {\r\n header[\"displayBuscar\"] = \"none\";\r\n header[\"displayFlecha\"] = \"none\";\r\n modificarHeaderState(header);\r\n }\r\n });\r\n\r\n return (\r\n \r\n
\r\n ) : (\r\n \r\n \r\n Registro\r\n \r\n
\r\n \r\n cambioInicioSesion()}\r\n style={{ cursor: \"pointer\" }}\r\n >\r\n {\"< Atrás\"}\r\n \r\n
\r\n \r\n registrar()}\r\n >\r\n Registrarme\r\n \r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n cambioRegistro()}\r\n >\r\n ¿Nuevo? Regístrate ahora.\r\n \r\n
\r\n {/*\r\n \r\n \r\n {\"< Volver\"}\r\n \r\n
\r\n */}\r\n \r\n
\r\n \r\n ) : (\r\n \r\n )}\r\n {ayudaState[\"Producto\"] &&\r\n !ayudaState[\"Envio\"] &&\r\n !ayudaState[\"Cambios\"] ? (\r\n \r\n {!ayudaState[\"Producto\"] &&\r\n !ayudaState[\"Envio\"] &&\r\n !ayudaState[\"Cambios\"] ? (\r\n
\r\n \r\n
\r\n Ayuda
\r\n\r\n
\r\n \r\n opcionAyuda(\"Producto\")}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Producto-negro.png\";\r\n }}\r\n >\r\n opcionAyuda(\"Producto\")}\r\n >\r\n
\r\n Producto
\r\n\r\n opcionAyuda(\"Envio\")}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Envio-negro.png\";\r\n }}\r\n >\r\n opcionAyuda(\"Envio\")}\r\n >\r\n
\r\n Envio
\r\n\r\n opcionAyuda(\"Cambios\")}\r\n onError={(e) => {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Cambio-negro.png\";\r\n }}\r\n >\r\n opcionAyuda(\"Cambios\")}\r\n >\r\n
\r\n Cambios y devoluciones
\r\n\r\n
\r\n ) : (\r\n \r\n )}\r\n {!ayudaState[\"Producto\"] &&\r\n ayudaState[\"Envio\"] &&\r\n !ayudaState[\"Cambios\"] ? (\r\n Producto
\r\n\r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Producto-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n
\r\n \r\n En DK puedes encontrar una amplia gama de prendas de\r\n materiales naturales, artificiales y sintéticos. Tanto en\r\n dkda.com.co como en cada producto tendrás información\r\n detalla sobre la composición de cada artículo.\r\n
\r\n opcionAyuda(\"\")}>\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-izquierda-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n Volver\r\n
\r\n\r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Algodon-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n
\r\n ) : (\r\n \r\n )}\r\n {!ayudaState[\"Producto\"] &&\r\n !ayudaState[\"Envio\"] &&\r\n ayudaState[\"Cambios\"] ? (\r\n \r\n
\r\n Envio
\r\n\r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Envio-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n \r\n En DK las opciones de envío pueden varias en función\r\n del destino, la hora de tu compra y la disponibilidad de\r\n los artículos. En el momento de procesar tu compra, te\r\n mostraremos los métodos de envío disponibles, el costo y\r\n la fecha de entrega de tu pedido. Realizamos los envíos\r\n por medio de las principales transportadoras nacionales.\r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Ayuda/Envia.png\";\r\n }}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/InterRapidisimo.png\";\r\n }}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Servientrega.png\";\r\n }}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Ayuda/Deprisa.png\";\r\n }}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src = recursosUrlState + \"/img/Ayuda/Saferbo.png\";\r\n }}\r\n >\r\n
\r\n opcionAyuda(\"\")}>\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-izquierda-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n Volver\r\n
\r\n\r\n
\r\n ) : (\r\n \r\n )}\r\n \r\n
\r\n \r\n Cambios y devoluciones\r\n
\r\n\r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Ayuda/Cambio-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n \r\n Si deseas realizar la devolución de un artículo, solo\r\n podrás hacerlo al siguiente día hábil de haber recibido tu\r\n pedido, de esta forma garantizamos que nuestros productos\r\n no han sido usados ni exhibidos en ninguna tienda antes de\r\n volver con nosotros.\r\n \r\n
\r\n \r\n \r\n En el caso en que la razón de la devolución sea por una\r\n imperfección en el producto, nosotros asumiremos el costo\r\n del envío de este. En un caso contrario, el cliente deberá\r\n asumir este costo.\r\n \r\n
\r\n opcionAyuda(\"\")}>\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-izquierda-negro.png\";\r\n }}\r\n >\r\n
\r\n \r\n Volver\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default Ayuda;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport \"./static/Landing.css\";\r\nimport { useParams } from \"react-router\";\r\nimport axios from \"axios\";\r\nimport { $ } from \"react-jquery-plugin\";\r\n\r\nconst Landing = ({\r\n actualizarSessionStorage,\r\n modificarHeaderState,\r\n recursosUrlState,\r\n headerState,\r\n modificarlandingState,\r\n apiUrlState,\r\n SetLandingHeader,\r\n}) => {\r\n const [Ruta, GetRuta] = useState({ Video: \" \", Categoria: \"\", bool: true });\r\n const [Product, GetProduct] = useState([]);\r\n const [RutaL, GetRutaL] = useState({ Categoria: \"\" });\r\n const [carousels, Getcarousels] = useState({ carouselx: \"carousel\" });\r\n\r\n //\r\n\r\n const CambioProductos = (mercado) => {\r\n actualizarSessionStorage(\"TipoCliente\", mercado);\r\n modificarHeaderState({\r\n srcLogo: recursosUrlState + \"/img/Email/45441614379749154.png\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState + \"/img/Index/web/botones/flecha-derecha-negro.png\",\r\n displayBuscar: \"in-line\",\r\n displayMenu: \"Index\",\r\n color: \"negro\",\r\n Seccion: headerState[\"Seccion\"],\r\n Cliente: mercado,\r\n BotonCatalogo: headerState[\"BotonCatalogo\"],\r\n });\r\n /*$('.carousel').carousel({\r\n ride: true\r\n })*/\r\n };\r\n const activar = () => {\r\n $(\".carousel\").carousel({\r\n ride: true,\r\n });\r\n $(\".carousel\").carousel(\"next\");\r\n };\r\n let { id, Genero } = useParams();\r\n\r\n /*const obtenerSeccion = async(Seccion) => {\r\n const getJWT = async(callback) => {\r\n await axios.post(apiUrlState+\"/auth/get-token/\", {\r\n \"username\": \"CroattaWeb\",\r\n \"password\": \"Since2013\"\r\n }).then(response => {\r\n callback(response.data);\r\n\r\n \r\n }).catch(function(err) {\r\n })\r\n }\r\n getJWT(async function(token){\r\n await axios.get(apiUrlState+\"/Inventario/ConsultarProductos\"+Seccion, {\r\n //...data\r\n }, {\r\n headers: {\r\n \"authorization\": (\"Bearer \" + token[\"token\"]) \r\n }\r\n }).then(response => {\r\n \r\n //GetProduct(response.data)\r\n }).catch(function(err) {\r\n \r\n })\r\n })\r\n }*/\r\n //Ruta landing\r\n const RutaLanding = async () => {\r\n if (id === \"Camiseta\" && Genero === \"Hombre\") {\r\n return [\"607ed63e521b1c0910a581aa\", \"607ed653521b1c0910a581b8\"];\r\n }\r\n if (id === \"Camiseta\" && Genero === \"Niño\") {\r\n return [\"607ed63e521b1c0910a581aa\", \"607ed653521b1c0910a581ba\"];\r\n }\r\n if (id === \"Camiseta\" && Genero === \"Mujer\") {\r\n return [\"607ed63e521b1c0910a581aa\", \"607ed653521b1c0910a581b9\"];\r\n }\r\n if (id === \"Gorra\" && Genero === \"Unisex\") {\r\n return [\"607ed63e521b1c0910a581ac\", \"607ed653521b1c0910a581bb\"];\r\n }\r\n if (id === \"Hoodie\" && Genero === \"Hombre\") {\r\n return [\"607ed63e521b1c0910a581ad\", \"607ed653521b1c0910a581b8\"];\r\n }\r\n if (id === \"Hoodie\" && Genero === \"Mujer\") {\r\n return [\"607ed63e521b1c0910a581ad\", \"607ed653521b1c0910a581b9\"];\r\n }\r\n if (id === \"Polo\" && Genero === \"Hombre\") {\r\n return [\"607ed63f521b1c0910a581b1\", \"607ed653521b1c0910a581b8\"];\r\n }\r\n if (id === \"Pantaloneta\" && Genero === \"Hombre\") {\r\n return [\"607ed63e521b1c0910a581b0\", \"607ed653521b1c0910a581b8\"];\r\n }\r\n if (id === \"Jogger\" && Genero === \"Hombre\") {\r\n return [\"607ed63e521b1c0910a581af\", \"607ed653521b1c0910a581b8\"];\r\n }\r\n if (id === \"Jogger\" && Genero === \"Mujer\") {\r\n return [\"607ed63e521b1c0910a581af\", \"607ed653521b1c0910a581b9\"];\r\n }\r\n\r\n return [\"\", \"\"];\r\n };\r\n const obtenerSeccion2 = async (Seccion) => {\r\n let data = {\r\n Categorias: [],\r\n Generos: [],\r\n Marcas: [],\r\n Medidas: [],\r\n Tallas: [],\r\n Colores: [],\r\n Subcategoria: [],\r\n ParametroOrdenamiento: \"\",\r\n ProductosNuevos: false,\r\n Descuentos: false,\r\n Todo: false,\r\n Origen: \"Landing\"\r\n };\r\n const cateGene = await RutaLanding();\r\n data[\"Categorias\"].push({ Categoria: cateGene[0] });\r\n data[\"Generos\"].push({ Genero: cateGene[1] });\r\n data[\"ProductosNuevos\"] = false;\r\n\r\n await axios\r\n .post(\r\n apiUrlState + \"/Api/Inventario/GetProductos\",\r\n {\r\n data,\r\n },\r\n {}\r\n )\r\n .then((response) => {\r\n GetProduct(response.data.data);\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n };\r\n //position: absolute; transform: translate(-50%, 0%);\r\n /*const jqueryx = () => {\r\n $('.carousel').carousel({\r\n ride: true\r\n })\r\n $('.carousel').carousel('prev');\r\n \r\n }*/\r\n const Condicion = () => {\r\n /*$(\".carousel\").carousel();\r\n $('.carousel').carousel({\r\n ride: \"true\"\r\n })\r\n $(\".item\").click(function(){\r\n $(\".carousel\").carousel(1);\r\n });*/\r\n\r\n GetRutaL({ Categoria: \"/\" + id + \"/\" + Genero });\r\n modificarlandingState({\r\n Display: \"none\",\r\n Posicion: \"50%\",\r\n positionlogo: \"absolute\",\r\n transform: \"translate(-50%, 0%)\",\r\n });\r\n obtenerSeccion2(\"\");\r\n if (id === \"Remarketing\") {\r\n GetRuta({\r\n ...Ruta,\r\n Video: \"https://www.youtube.com/embed/q3W2K772eqM\",\r\n });\r\n }\r\n if (id === \"Gorra\") {\r\n var categGorra = id + \"/Unisex\";\r\n //obtenerSeccion(\"/\"+id)\r\n //obtenerSeccion2(\"\")\r\n GetRuta({\r\n Categoria: categGorra,\r\n Video: \"https://www.youtube.com/embed/q3W2K772eqM\",\r\n });\r\n }\r\n if (id === \"Polo\") {\r\n var categPolo = id + \"/Hombre\";\r\n //obtenerSeccion(\"/\"+categPolo)\r\n GetRuta({\r\n Categoria: categPolo,\r\n Video:\r\n \"https://www.youtube.com/embed/zpOULjyy-n8?rel=0&start=20&controls=1\",\r\n });\r\n }\r\n if (id === \"Camiseta\" && Genero === \"Mujer\") {\r\n var categCamisetaM = id + \"/\" + Genero;\r\n\r\n //obtenerSeccion(\"/\"+categCamisetaM)\r\n GetRuta({\r\n Categoria: categCamisetaM,\r\n Video:\r\n \"https://www.youtube.com/embed/zpOULjyy-n8?rel=0&start=20&controls=1\",\r\n });\r\n }\r\n if (id === \"Camiseta\" && Genero === \"Hombre\") {\r\n var categCamisetaH = id + \"/\" + Genero;\r\n\r\n //obtenerSeccion(\"/\"+categCamisetaH)\r\n GetRuta({\r\n Categoria: categCamisetaH,\r\n Video:\r\n \"https://www.youtube.com/embed/zpOULjyy-n8?rel=0&start=20&controls=1\",\r\n });\r\n }\r\n if (id === \"Hoodie\") {\r\n var categHoodie = id + \"/Hombre\";\r\n //obtenerSeccion(\"/\"+id)\r\n GetRuta({\r\n Categoria: categHoodie,\r\n Video:\r\n \"https://www.youtube.com/embed/zpOULjyy-n8?rel=0&start=20&controls=1\",\r\n });\r\n }\r\n if (id === \"pantaloneta\") {\r\n var categHoodie = id + \"/Hombre\";\r\n //obtenerSeccion(\"/\"+id)\r\n GetRuta({\r\n Categoria: categHoodie,\r\n Video:\r\n \"https://www.youtube.com/embed/zpOULjyy-n8?rel=0&start=20&controls=1\",\r\n });\r\n }\r\n if (id === \"jogger\") {\r\n var categHoodie = id + \"/Hombre\";\r\n //obtenerSeccion(\"/\"+id)\r\n GetRuta({\r\n Categoria: categHoodie,\r\n Video:\r\n \"https://www.youtube.com/embed/zpOULjyy-n8?rel=0&start=20&controls=1\",\r\n });\r\n }\r\n };\r\n useEffect(() => {\r\n //$(\".carousel\").attr(\"data-interval\", \"2000\");\r\n /*$('.carousel').carousel({\r\n pause: \"true\"\r\n });*/\r\n\r\n /*$('.carousel').carousel({\r\n ride: true\r\n })*/\r\n\r\n Condicion();\r\n /*$('.carousel').carousel({\r\n ride: \"true\"\r\n });*/\r\n SetLandingHeader({ Estado: true });\r\n /*$('.carousel').on('touchstart', function(event){\r\n const xClick = event.originalEvent.touches[0].pageX;\r\n $(this).one('touchmove', function(event){\r\n const xMove = event.originalEvent.touches[0].pageX;\r\n const sensitivityInPx = 5;\r\n \r\n if( Math.floor(xClick - xMove) > sensitivityInPx ){\r\n $(this).carousel('next');\r\n }\r\n else if( Math.floor(xClick - xMove) < -sensitivityInPx ){\r\n $(this).carousel('prev');\r\n }\r\n });\r\n $(this).on('touchend', function(){\r\n $(this).off('touchmove');\r\n });\r\n });*/\r\n\r\n setTimeout(function () {\r\n activar();\r\n }, 3000);\r\n\r\n //obtenerSeccion(RutaL.Categoria)//\"/Camiseta/Hombre\" Product.length > 0\r\n }, []);\r\n\r\n return (\r\n DK
\r\n\r\n Somos una marca Colombiana para los amantes al diseño, desde el año\r\n 2013 hemos brindado a nuestros clientes prendas con los más altos\r\n estándares de calidad y valor agregado. Somos tendencia y revolución\r\n en la industria textil . ¡No vendemos ropa, vendemos diseños\r\n plasmados sobre prendas de vestir!\r\n
\r\n\r\n {Product.length > 0 ? (\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n Previous\r\n \r\n \r\n \r\n Next\r\n \r\n
\r\n \r\n {/*\r\n \r\n
\r\n \r\n \r\n
style={{display: \"flex\", flexDirection: \"row\", justifyContent: \"space-between\",alignItems: \"center\"}}*/}\r\n\r\n \r\n {Product.map((imagen, index) =>\r\n index > 0 ? (\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 Precio Mayorista
\r\n\r\n {Product[0].PrecioMayorista}\r\n
\r\nPrecio Minorista
\r\n\r\n {Product[0].PrecioMinorista}\r\n
\r\n\r\n \r\n
\r\n \r\n\r\n Compra protegida
\r\n\r\n ![](\"/img/Landing/pago@72x.png\")
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n Disponible pago contra entrega\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Previous\r\n \r\n \r\n \r\n Next\r\n \r\n
\r\n \r\n
\r\n\r\n Clientes satisfechos
\r\n\r\n {\" \"}\r\n En DK la prioridad es que los clientes se encuentren\r\n satisfechos con nuestros productos, siempre atendiendo sus\r\n necesidades con amabilidad y profesionalismo\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 ![](\"/img/Landing/LOGO-LINIO.png\")
\r\n
\r\n \r\n
\r\n \r\n
\r\n Nuestas alianzas
\r\n\r\n {\" \"}\r\n Ahora puedes encontrar nuestras tiendas oficiales en los\r\n Marketplace que más te gustan, para que compres tus prendas\r\n favoritas con total confianza\r\n
\r\n\r\n \r\n \r\n
\r\n \r\n ![](\"/img/Landing/LOGO-DAFITI.png\"){kind=logo}
\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 Medios de pago
\r\n\r\n {\" \"}\r\n Tenemos muchas opciones para que puedas comprar en nuestra\r\n página de forma segura\r\n
\r\n\r\n \r\n \r\n
\r\n ![](\"/img/Landing/LOGO-PSE.png\"){kind=logo}
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n ![](\"/img/Landing/LOGO-EFECTY.png\"){kind=logo}
\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 Aliados logisticos\r\n
\r\n\r\n {\" \"}\r\n ¡Queremos que tu experiencia de compra sea la mejor!
{\" \"}\r\n Por esto contamos con los mejores aliados para que tus prendas\r\n lleguen a su destino de forma rápida y segura\r\n
\r\n \r\n ![](\"/img/Landing/LOGO-ENVIA.png\")
\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Indicadores;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { Link, useHistory } from \"react-router-dom\";\r\nimport axios from \"axios\";\r\nimport \"../static/Indicadores.css\";\r\nimport { useParams } from \"react-router\";\r\nimport { Doughnut } from \"react-chartjs-2\";\r\n\r\nconst DetalleMeta = ({ SetLandingHeader, apiUrlState }) => {\r\n const [ListMeta, GetListMeta] = useState({\r\n IngresosBancarios: \"$ --\",\r\n IngresosEfectivo: \"$ --\",\r\n IngresosTotales: \"$ --\",\r\n Meta: \"$ --\",\r\n NoVencido: \"$ --\",\r\n Periodo: \"--\",\r\n TotalCxC: \"$ --\",\r\n TotalPorVender: \"$ --\",\r\n TotalVencido: \"$ --\",\r\n VencidoMas90Dias: \"$ --\",\r\n VencidoMax30Dias: \"$ --\",\r\n VencidoMax60Dias: \"$ --\",\r\n VencidoMax90Dias: \"$ --\",\r\n abonosVentasCredito: \"$ --\",\r\n ventasCredito: \"$ --\",\r\n Ventas: {\r\n Vendedor1: {Ventas: \"$ --\", Devoluciones: \"$ --\", Total: \"$ --\"},\r\n Vendedor2: {Ventas: \"$ --\", Devoluciones: \"$ --\", Total: \"$ --\"},\r\n VendedorWeb: {Ventas: \"$ --\", Devoluciones: \"$ --\", Total: \"$ --\"},\r\n Maquila: {Ventas: \"$ --\", Devoluciones: \"$ --\", Total: \"$ --\"},\r\n }\r\n });\r\n\r\n const token = localStorage.getItem(\"token\");\r\n const history = useHistory();\r\n useEffect(() => {\r\n if (token) {\r\n \r\n }else{\r\n history.push(\"/login\")\r\n }\r\n //console.log(reports)\r\n },[token]);\r\n\r\n let { id } = useParams();\r\n\r\n const obtenerDetalle = async () => {\r\n await axios\r\n .get(apiUrlState + \"/Api/Indicadores/CalcularMeta/\" + id)\r\n .then((response) => {\r\n GetListMeta(response.data);\r\n console.log(\"DATA: \",response.data)\r\n })\r\n .catch(function (err) {\r\n console.log(err);\r\n });\r\n };\r\n\r\n const formatNumber = (amount) => {\r\n if (ListMeta.IngresosBancarios != \"$ --\") {\r\n var temp = Math.round(amount) + \"\";\r\n var i = temp.length - 3;\r\n while (i > 0) {\r\n temp = temp.substring(0, i) + \".\" + temp.substring(i);\r\n i -= 3;\r\n }\r\n return \" \" + temp;\r\n }\r\n };\r\n\r\n const dataVentas = {\r\n labels: [\"Vendido\", \"Por Vender\"],\r\n datasets: [\r\n {\r\n data: [ListMeta.IngresosTotales, ListMeta.TotalPorVender],\r\n backgroundColor: [\"rgba(0, 255, 0, 1)\", \"rgba(255, 0, 23, 1)\"],\r\n borderColor: [\"rgba(75, 192, 192, 1)\", \"rgba(255, 99, 132, 1)\"],\r\n borderWidth: 1,\r\n },\r\n ],\r\n };\r\n\r\n useEffect(() => {\r\n SetLandingHeader({ Estado: true });\r\n obtenerDetalle();\r\n }, []);\r\n return (\r\n \r\n Listado de Metas\r\n
\r\n\r\n \r\n \r\n Nueva meta\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | {Meta.Periodo} | \r\n$ {formatNumber(Meta.Ingresos)} | \r\n$ {formatNumber(Meta.Meta)} | \r\n{Cumplida(Meta.MetaCumplida)} | \r\n\r\n \r\n | \r\n \r\n | \r\n
|---|
\r\n
\r\n \r\n
\r\n \r\n \r\n {ListMeta.Periodo}\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 Vendido: $ {formatNumber(ListMeta.IngresosTotales)}
\r\nPor Vender: $ {formatNumber(ListMeta.TotalPorVender)}
\r\n\r\n \r\n \r\n
\r\n
\r\n \r\n | \r\n $ {formatNumber(ListMeta.IngresosBancarios)}\r\n | \r\n\r\n $ {formatNumber(ListMeta.IngresosEfectivo)}\r\n | \r\n\r\n $ {formatNumber(ListMeta.ventasCredito)}\r\n | \r\n\r\n $ {formatNumber(ListMeta.abonosVentasCredito)}\r\n | \r\n
\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n Total CxC: $ {formatNumber(ListMeta.TotalCxC)}
\r\nVencido: $ {formatNumber(ListMeta.TotalVencido)}
\r\n \r\n \r\n\r\n\r\n \r\n \r\n
\r\n
\r\n \r\n {/* */}\r\n | \r\n $ {formatNumber(ListMeta.NoVencido)}\r\n | \r\n\r\n ${formatNumber(ListMeta.VencidoMax30Dias)}\r\n | \r\n\r\n ${formatNumber(ListMeta.VencidoMax60Dias)}\r\n | \r\n\r\n ${formatNumber(ListMeta.VencidoMax90Dias)}\r\n | \r\n\r\n ${formatNumber(ListMeta.VencidoMas90Dias)}\r\n | \r\n
\r\n \r\n
\r\n ANGELA
\r\n\r\n \r\n
\r\n \r\n VENTAS: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.Vendedor1.Ventas)}\r\n
\r\n\r\n DEVOLUCIONES: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.Vendedor1.Devoluciones)}\r\n
\r\nTOTAL: $ {formatNumber(ListMeta.Ventas.Vendedor1.Total)}
\r\n \r\n \r\nKATHERINE
\r\n\r\n \r\n
\r\n \r\n VENTAS: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.Vendedor2.Ventas)}\r\n
\r\n\r\n DEVOLUCIONES: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.Vendedor2.Devoluciones)}\r\n
\r\n \r\nTOTAL: $ {formatNumber(ListMeta.Ventas.Vendedor2.Total)}
\r\n \r\n \r\n {/** */}\r\nWEB
\r\n\r\n \r\n
\r\n \r\n VENTAS: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.VendedorWeb.Ventas)}\r\n
\r\n\r\n DEVOLUCIONES: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.VendedorWeb.Devoluciones)}\r\n
\r\n \r\nTOTAL: $ {formatNumber(ListMeta.Ventas.VendedorWeb.Total)}
\r\n \r\n \r\nMAQUILA
\r\n\r\n \r\n
\r\n \r\n VENTAS: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.Maquila.Ventas)}\r\n
\r\n\r\n DEVOLUCIONES: ${\" \"}\r\n {formatNumber(ListMeta.Ventas.Maquila.Devoluciones)}\r\n
\r\n \r\nTOTAL: $ {formatNumber(ListMeta.Ventas.Maquila.Total)}
\r\n \r\n \r\n \r\n {/* */}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default DetalleMeta;\r\n","//Zona de importacion de componentes externos.\r\nimport React, { useEffect, useState } from \"react\";\r\nimport { SlideDown } from \"react-slidedown\";\r\nimport \"react-slidedown/lib/slidedown.css\";\r\nimport \"./static/css/Detalle/Detalle.css\";\r\nimport Producto from \"./Producto\";\r\nimport { useParams } from \"react-router\";\r\nimport axios from \"axios\";\r\nimport GrupoTallas from \"./GrupoTallas\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { TransformWrapper, TransformComponent } from \"react-zoom-pan-pinch\";\r\nimport $ from \"jquery\";\r\nimport Footer from \"../Footer/Footer\";\r\n\r\nconst Detalle = ({\r\n ViewDetalle,\r\n SetViewDetalle,\r\n SetLandingHeader,\r\n headerState,\r\n modificarHeaderState,\r\n filtrosState,\r\n modificarFiltrosState,\r\n productosState,\r\n modificarProductosState,\r\n tallasState,\r\n modificarTallasState,\r\n coloresState,\r\n modificarColoresState,\r\n marcasState,\r\n modificarMarcasState,\r\n carrito,\r\n modificarCarritoState,\r\n cliente,\r\n errorState,\r\n modificarErrorState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n categoriasHombreState,\r\n modificarCategoriasHombreState,\r\n categoriasMujerState,\r\n modificarCategoriasMujerState,\r\n CatalogoState,\r\n actualizarSessionStorage,\r\n estadoBar,\r\n vendedor,\r\n modificarVendedorState,\r\n Bodega,\r\n setBodega,\r\n}) => {\r\n const [Product, GetProduct] = useState({});\r\n const [ProductRel, GetProductRel] = useState([]);\r\n const [ProductAux, GetProductAux] = useState();\r\n const [foto1, setFoto1] = useState({ f1: false });\r\n const [foto2, setFoto2] = useState({ f2: false });\r\n const [foto3, setFoto3] = useState({ f3: false });\r\n let { id } = useParams();\r\n\r\n const ProductoDetalle = async () => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \" Buscando Producto...\",\r\n });\r\n }\r\n var genero = \"\";\r\n await axios\r\n .get(apiUrlState + \"/Api/Inventario/BusquedaPalabraRef/\" + id +`/${Bodega}`, {}, {})\r\n .then((response) => {\r\n genero = response.data[0].data[0].Genero.Genero;\r\n GetProduct(response.data[0].data[0]);\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n\r\n /*const generoState = await axios.get(apiUrlState + '/Api/Inventario/BusquedaPalabraRef/'+genero, {});\r\n GetProductRel(generoState.data.data)*/\r\n\r\n /** Modificaciones */\r\n // Relacionados(genero);\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n /** End Modificaciones */\r\n };\r\n const calcularDescuento = (precio, descuento) => {\r\n const precioInt = arreglarPrecio(precio);\r\n const descuentoAplicar = parseFloat(descuento);\r\n return formatNumber(precioInt - precioInt * (descuentoAplicar / 100));\r\n };\r\n\r\n const arreglarPrecio = (precio) => {\r\n var separacion = precio;\r\n if (precio.indexOf(\"$\") !== -1) separacion = precio.split(\" \")[1];\r\n var separacion2 = separacion.split(\".\");\r\n return parseFloat(separacion2[0] + separacion2[1]);\r\n };\r\n\r\n //Añade el punto de miles al precio ingresado y lo retorna.\r\n const formatNumber = (amount) => {\r\n var temp = amount + \"\";\r\n var i = temp.length - 3;\r\n while (i > 0) {\r\n temp = temp.substring(0, i) + \".\" + temp.substring(i);\r\n i -= 3;\r\n }\r\n return \" \" + temp;\r\n };\r\n\r\n const rotacionFlecha = (codigo) => {\r\n var listaClases = document.getElementById(\"Flecha\" + codigo);\r\n if (listaClases.classList.contains(\"giroFlechaArriba\")) {\r\n listaClases.classList.remove(\"giroFlechaArriba\");\r\n listaClases.classList.add(\"giroFlechaAbajo\");\r\n } else {\r\n listaClases.classList.remove(\"giroFlechaAbajo\");\r\n listaClases.classList.add(\"giroFlechaArriba\");\r\n }\r\n };\r\n\r\n const Relacionados = async (genero) => {\r\n await axios\r\n .get(\r\n apiUrlState + \"/Api/Inventario/BusquedaPalabraRef/\" + genero,\r\n {},\r\n {}\r\n )\r\n .then((response) => {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n GetProductRel(response.data[0].data);\r\n GetProductAux(\r\n Math.floor(Math.random() * (response.data[0].data.length - 1))\r\n );\r\n //Getrelacionados(true)\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error 2\");\r\n });\r\n };\r\n\r\n const VerificarFotos = (codigo, tipo) => {\r\n let img = document.createElement(\"img\");\r\n img.src = recursosUrlState + \"/img/Productos/Ref \" + codigo + \"1.webp\";\r\n img.onerror = function () {\r\n setFoto1({ f1: true });\r\n };\r\n let imgD = document.createElement(\"img\");\r\n imgD.src = recursosUrlState + \"/img/Productos/Ref \" + codigo + \"2.webp\";\r\n imgD.onerror = function () {\r\n setFoto2({ f2: true });\r\n };\r\n let imgD2 = document.createElement(\"img\");\r\n imgD2.src = recursosUrlState + \"/img/Productos/Ref \" + codigo + \"3.webp\";\r\n imgD2.onerror = function () {\r\n setFoto3({ f3: true });\r\n };\r\n return \"/img/Productos/Ref\" + tipo + \" \" + codigo + \".jpg\";\r\n };\r\n\r\n useEffect(() => {\r\n ProductoDetalle();\r\n //SetLandingHeader({\"Estado\": true})\r\n SetViewDetalle({ Estado: true });\r\n VerificarFotos(id, \"T\");\r\n modificarHeaderState({ ...headerState, Cliente: \"Minoristas\" });\r\n }, []);\r\n\r\n $(document).ready(function () {\r\n // active thumbnail\r\n $(\"#thumbSlider .thumb\").on(\"click\", function () {\r\n $(this).addClass(\"active\");\r\n $(this).siblings().removeClass(\"active\");\r\n });\r\n });\r\n\r\n return (\r\n\r\n {Product.PrecioMinorista !== undefined ? (\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 {foto3.f3 ? null : (\r\n \r\n \r\n
\r\n )}\r\n\r\n {foto2.f2 ? null : (\r\n \r\n \r\n \r\n
\r\n\r\n {foto1.f1 ? null : (\r\n \r\n
\r\n )}\r\n\r\n {foto2.f2 ? null : (\r\n \r\n
\r\n )}\r\n\r\n {foto3.f3 ? null : (\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 {foto1.f1 ? null : (\r\n \r\n \r\n \r\n \r\n ${\" \"}\r\n {calcularDescuento(\r\n Product.PrecioMinorista,\r\n Product.DescuentoMinorista\r\n )}\r\n \r\n \r\n \r\n {Product.PrecioMinorista}\r\n \r\n
\r\n ) : (\r\n \r\n \r\n {Product.Categoria.Categoria} {Product.Marca.Marca}\r\n \r\n
\r\n \r\n
\r\n\r\n {headerState[\"Cliente\"] === \"Minoristas\" ? (\r\n Product.DescuentoMinorista !== 0 ? (\r\n \r\n Ref {Product.Referencia}\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n Material: \r\n {\" \"}\r\n {Product.Descripcion}\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Medidas/medidasGeneral\" \r\n // +\r\n // Product.Categoria.Categoria +\r\n // Product.Genero.Genero +\r\n // Product.Medidas \r\n +\r\n \".webp\";\r\n }}\r\n />\r\n \r\n \r\n Cuidados especiales: \r\n {\" \"}\r\n Lavar en lavadora con agua fria 30ºC, ciclo delicado con\r\n colores similares, lavar con jabón suave, no exprimir.\r\n \r\n
\r\n \r\n rotacionFlecha(Product.Referencia)}\r\n >\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-abajo-negro.png\";\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 rotacionFlecha(Product.Referencia)}\r\n >\r\n
\r\n \r\n \r\n Compra protegida\r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/General/compraProtegida.png\";\r\n }}\r\n />\r\n
\r\n \r\n \r\n Disponible pago contra entrega\r\n \r\n
\r\n \r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState + \"/img/Modal/pin-negro.png\";\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n {ProductRel.length > 0 ? (\r\n \r\n Productos Relacionados\r\n
\r\n\r\n {ProductRel.map((product, index) =>\r\n index <= 2 && product.Referencia !== id ? (\r\n \r\n \r\n \r\n
\r\n \r\n \r\n ) : index <= 2 && ProductAux !== undefined ? (\r\n \r\n
\r\n \r\n {product.Categoria.Categoria} {product.Marca.Marca}\r\n
\r\n\r\n
\r\n Ref {product.Referencia}
\r\n\r\n $ {product.PrecioMinorista}\r\n
\r\n\r\n
\r\n \r\n {ProductRel[ProductAux].Categoria.Categoria}{\" \"}\r\n {ProductRel[ProductAux].Marca.Marca}\r\n
\r\n\r\n
\r\n Ref {ProductRel[ProductAux].Referencia}
\r\n\r\n $ {ProductRel[ProductAux].PrecioMinorista}\r\n
\r\n \r\n\r\n \r\n Registrar Meta\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default CrudIndicadores;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\nimport \"../static/Indicadores.css\";\r\nimport { useHistory } from \"react-router-dom\";\r\n\r\nconst Unidades = ({ SetLandingHeader, apiUrlState, recursosUrlState }) => {\r\n const VolverAdmin = () => {\r\n window.location.href = \"/Admin/Index/MenuUnidades\";\r\n };\r\n const [ListaUnidades, GetListaUnidades] = useState([\r\n {\r\n grupo: \"PRUEBA\",\r\n S: 0,\r\n M: 0,\r\n L: 0,\r\n XL: 0,\r\n XXL: 0,\r\n U: 0,\r\n Total: 0,\r\n },\r\n ]);\r\n const [TotalUnidades, GetTotalUnidades] = useState({\r\n S: 0,\r\n M: 0,\r\n L: 0,\r\n XL: 0,\r\n XXL: 0,\r\n U: 0,\r\n Total: 0,\r\n });\r\n\r\n const S = 0;\r\n\r\n //Login validation\r\n const token = localStorage.getItem(\"token\");\r\n const history = useHistory();\r\n useEffect(() => {\r\n if (token) {\r\n \r\n }else{\r\n history.push(\"/login\")\r\n }\r\n //console.log(reports)\r\n },[token]);\r\n\r\n const obtenerUnidades = async () => {\r\n await axios\r\n .get(apiUrlState + \"/Api/Unidades/ConteoUnidades\")\r\n .then((response) => {\r\n GetListaUnidades(response.data.data);\r\n GetTotalUnidades(response.data.total);\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n };\r\n\r\n useEffect(() => {\r\n SetLandingHeader({ Estado: true });\r\n obtenerUnidades();\r\n }, []);\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n {/* \r\n Unidades en Bodega\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Unidades;\r\n","import \"../static/Indicadores.css\";\r\nimport { Link, useHistory } from \"react-router-dom\";\r\nimport React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\n\r\nconst MenuPrincipal = ({}) => {\r\n const token = localStorage.getItem(\"token\");\r\n const history = useHistory();\r\n useEffect(() => {\r\n if (token) {\r\n \r\n }else{\r\n history.push(\"/login\")\r\n }\r\n //console.log(reports)\r\n },[token]);\r\n return (\r\n VolverAdmin()}>\r\n {\r\n e.target.onerror = null;\r\n e.target.src =\r\n recursosUrlState +\r\n \"/img/Index/web/botones/flecha-izquierda-negro.png\";\r\n }}\r\n >\r\n
*/}\r\n \r\n Volver\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | {grupo.grupo} | \r\n{grupo.S} | \r\n{grupo.M} | \r\n{grupo.L} | \r\n{grupo.XL} | \r\n{grupo.XXL} | \r\n{grupo.U} | \r\n{grupo.Total} | \r\n
|---|---|---|---|---|---|---|---|
| {TotalUnidades.S} | \r\n{TotalUnidades.M} | \r\n{TotalUnidades.L} | \r\n{TotalUnidades.XL} | \r\n{TotalUnidades.XXL} | \r\n{TotalUnidades.U} | \r\n{TotalUnidades.Total} | \r\n
\r\n
\r\n );\r\n};\r\n\r\nexport default MenuPrincipal;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { Link, useHistory } from \"react-router-dom\";\r\nimport \"../static/Indicadores.css\";\r\n\r\nconst MenuUnidades = ({ SetLandingHeader, apiUrlState, recursosUrlState }) => {\r\n const VolverAdmin = () => {\r\n window.location.href = \"/Admin/Index/MenuPrincipal\";\r\n };\r\n const token = localStorage.getItem(\"token\");\r\n const history = useHistory();\r\n useEffect(() => {\r\n if (token) {\r\n \r\n }else{\r\n history.push(\"/login\")\r\n }\r\n //console.log(reports)\r\n },[token]);\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n VENTAS\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n UNIDADES\r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default MenuUnidades;\r\n","import React from 'react';\r\nimport * as FaIcons from 'react-icons/fa';\r\nimport * as AiIcons from 'react-icons/ai';\r\nimport * as IoIcons from 'react-icons/io';\r\nimport { MdOutlineLocalOffer } from \"react-icons/md\";\r\n\r\n\r\nconst SidebarData = [\r\n {\r\n title: 'Indicadores',\r\n path: '/Admin/Indicadores', \r\n icon: \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n ROTACIÓN UNIDADES\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n DISPONIBLE\r\n \r\n \r\n
\r\n \r\n {menu? (\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nexport default Dashboard;","import React, { useEffect, useState } from 'react'\r\n\r\nconst NuevaColeccion = ({vars}) => {\r\n\r\n\r\n const token = localStorage.getItem(\"token\");\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 🚨 NUEVA COLECCIÓN 🚨
\r\n
\r\n ¡Ya tenemos {vars.Categoria}
\r\n
\r\n Tienen un valor de ${vars.PMayorista} pesos al por mayor y ${vars.PMinorista} pesos por unidad.
\r\n
\r\n Recuerda que también tenemos disponibles:
\r\n
\r\n - Gorras 🧢
\r\n - Camisetas para hombre 👕
\r\n - Camisetas para mujer 👚
\r\n - Polos 👕
\r\n - Hoodies para Hombre y Mujer 🧥
\r\n - Joggers para Hombre y Mujer 👖
\r\n - Pantalonetas 🏝️
\r\n
\r\n Para ver todos nuestros productos solo debes hacer CLICK en el botón \"ir a Mayoristas\" o en el siguiente link:
\r\n
\r\n http://www.dkda.com.co/Mayoristas 👈
\r\n
\r\n P.D: Si no quieres seguir recibiendo noticias sobre nuevos productos o promociones, solo escríbenos para eliminarte de nuestros contactos. \r\n
\r\n
\r\n
\r\n
\r\n 🚨 REBAJAS 🚨
\r\n\r\n Comenzó nuestra temporada de DESCUENTOS!
\r\n
\r\n Aprovecha desde {InicioDesc} hasta {FinDesc} hasta el {Descuento} en prendas seleccionadas.\r\n
\r\n INGRESA YA!\r\n
\r\n
\r\n
\r\n \r\n\r\n
\r\n );\r\n};\r\n\r\nexport default Whatsapp;\r\n","import React from \"react\";\r\nimport Registro from \"../Usuario/Registro\";\r\nimport axios from \"axios\";\r\nimport { useGlobalContext } from \"../../providers/GlobalStatesProviders\";\r\n\r\nconst RegistroTercero = ({\r\n headerState,\r\n modificarHeaderState,\r\n pedidoState,\r\n modificarPedidoState,\r\n // clienteState,\r\n // modificarClienteState,\r\n errorState,\r\n modificarErrorState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n apiUrlState,\r\n modificarApiUrlState,\r\n recursosUrlState,\r\n modificarRecursosUrlState,\r\n actualizarSessionStorage,\r\n})=> {\r\n const { clienteState } = useGlobalContext();\r\n\r\n //Revisa que ningun datos del state de cliente este vacio.\r\n const revisionDatosUsuarios = () => {\r\n for (const dato in clienteState) {\r\n if (clienteState[dato] === \"\") return [false, dato];\r\n }\r\n return [true, \"\"];\r\n };\r\n\r\n //Segun los datos del state de cliente realiza una actualizacion de este en Contapyme.\r\n const actualizarDatosUsuario = async (callback) => {\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Actualizando tu datos...\",\r\n });\r\n }\r\n await axios\r\n .post(apiUrlState + \"/Api/Usuario/ActualizarUsuario\", {\r\n NuevosDatosUsuario: [\r\n {\r\n NumeroDocumento: clienteState[\"NumeroDocumento\"],\r\n TipoDocumento: clienteState[\"TipoDocumento\"],\r\n Correo: clienteState[\"Correo\"],\r\n Nombres: clienteState[\"Nombres\"],\r\n Apellidos: clienteState[\"Apellidos\"],\r\n FechaNacimiento: clienteState[\"FechaNacimiento\"],\r\n Celular: clienteState[\"Celular\"],\r\n Genero: clienteState[\"Genero\"],\r\n Pais: clienteState[\"Pais\"],\r\n Departamento: clienteState[\"Departamento\"],\r\n Ciudad: clienteState[\"Ciudad\"],\r\n Direccion: clienteState[\"Direccion\"],\r\n Barrio: clienteState[\"Barrio\"],\r\n Universidad: clienteState[\"Universidad\"],\r\n TipoTercero: \"Concursante\",\r\n },\r\n ],\r\n })\r\n .then((response) => {\r\n if (!response.data.error) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n callback(true);\r\n } else {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: response.data.message,\r\n });\r\n }\r\n callback(false);\r\n }\r\n })\r\n .catch(function (err) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({ Error: true, Mensaje: \"Revisa Tus Datos.\" });\r\n }\r\n });\r\n };\r\n\r\n const registrarParticipante = async ()=> {\r\n let revision = await revisionDatosUsuarios();\r\n if(revision[0]) {\r\n await actualizarDatosUsuario(async function (respuesta) {\r\n console.log(errorState[\"Error\"])\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Registro exitoso\",\r\n });\r\n }\r\n console.log(errorState[\"Error\"])\r\n\r\n })\r\n } else {\r\n if (!errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Datos incompletos...\",\r\n faltante: revision[1],\r\n });\r\n }\r\n }\r\n }\r\n\r\n return (\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default RegistroTercero;","import React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\nimport \"../static/Indicadores.css\";\r\nimport { useParams, useHistory } from \"react-router-dom\";\r\n\r\nconst Rotacion = ({ SetLandingHeader, apiUrlState, recursosUrlState }) => {\r\n\r\n const token = localStorage.getItem(\"token\");\r\n const history = useHistory();\r\n useEffect(() => {\r\n if (token) {\r\n \r\n }else{\r\n history.push(\"/login\")\r\n }\r\n //console.log(reports)\r\n },[token]);\r\n\r\n let { id } = useParams();\r\n const VolverAdmin = () => {\r\n window.location.href = \"/Admin/Rotacion/Seller/\" + Periodo;\r\n };\r\n const [LRotacion, GetListaRotacion] = useState([\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n {\r\n grupo: \"PRUEBA\",\r\n Final: 0,\r\n vendidas: 0,\r\n disponible: 0,\r\n rotacion: 0,\r\n VendidasDafiti: 0,\r\n VendidasMercado: 0,\r\n VendidasLinio: 0,\r\n VendidasExito: 0,\r\n Devoluciones: 0,\r\n VendidasTotal: 0,\r\n },\r\n ]);\r\n const [Periodo, GetPeriodo] = useState(\"PRUEBA\");\r\n const [Costo, GetCosto] = useState(0);\r\n const [Venta, GetVenta] = useState(0);\r\n const [Marketplace, GetMarketplace] = useState(\"PRUEBA\");\r\n const [Totales, SetTotales] = useState([0,0,0,0,0,0,0,0,0,0]);\r\n\r\n const Rotacion = async () => {\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/RotacionUnidades\", {\r\n _id: id,\r\n })\r\n .then((response) => {\r\n GetMarketplace(response.data.data[0].Markeplace);\r\n GetCosto(response.data.data[0].costo);\r\n GetVenta(response.data.data[0].venta);\r\n GetPeriodo(response.data.data[0].Periodo);\r\n GetListaRotacion(response.data.data[0].data);\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n };\r\n\r\n const totales = ()=>{\r\n let inventarioInicial = 0;\r\n let devoluciones = 0;\r\n let ventasUnidadesCroatta = 0;\r\n let ventasDafiti = 0;\r\n let ventasLinio = 0;\r\n let ventasMercado = 0;\r\n let ventasExito = 0;\r\n let ventasTotal = 0;\r\n let final = 0;\r\n let rotacion = 0;\r\n let contadorR = 0;\r\n for(const grupo of LRotacion) {\r\n // console.log(grupo, grupo.VendidasTotal);\r\n inventarioInicial += grupo.disponible;\r\n devoluciones += grupo.Devoluciones;\r\n ventasUnidadesCroatta += grupo.vendidas;\r\n ventasDafiti += grupo.VendidasDafiti;\r\n ventasLinio += grupo.VendidasLinio;\r\n ventasMercado += grupo.VendidasMercado;\r\n ventasExito+= grupo.VendidasExito;\r\n ventasTotal += grupo.VendidasTotal;\r\n final += grupo.Final;\r\n // rotacion += grupo.rotacion;\r\n if(grupo.rotacion > 0) {\r\n contadorR += 1;\r\n rotacion += grupo.rotacion;\r\n }\r\n }\r\n // let mediaR = rotacion / LRotacion.length;\r\n let mediaR = parseInt(rotacion / contadorR);\r\n SetTotales([\r\n inventarioInicial,\r\n devoluciones,\r\n ventasUnidadesCroatta,\r\n ventasDafiti,\r\n ventasLinio,\r\n ventasMercado,\r\n ventasExito,\r\n ventasTotal,\r\n final,\r\n mediaR,\r\n ]);\r\n }\r\n\r\n const formatterPeso = new Intl.NumberFormat('es-CO', {\r\n style: 'currency',\r\n currency: 'COP',\r\n minimumFractionDigits: 0\r\n });\r\n\r\n useEffect(() => {\r\n SetLandingHeader({ Estado: true });\r\n Rotacion();\r\n }, []);\r\n\r\n useEffect(()=>{\r\n totales();\r\n }, [LRotacion]);\r\n\r\n return (\r\n Concurso nacional de diseño
\r\n\r\n registrarParticipante()}\r\n >\r\n Registrar\r\n \r\n
\r\n \r\n \r\n Rotación De Unidades{\" \"}\r\n
\r\n );\r\n};\r\n\r\nexport default Rotacion;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\nimport \"../static/Indicadores.css\";\r\nimport { Link, useParams, useHistory } from \"react-router-dom\";\r\nimport swal from \"sweetalert\";\r\n\r\nconst RotacionIndex = ({\r\n SetLandingHeader,\r\n apiUrlState,\r\n recursosUrlState,\r\n modificarSpinnerState,\r\n}) => {\r\n const VolverAdmin = () => {\r\n window.location.href = \"/Admin/Rotacion\";\r\n };\r\n\r\n let { periodo } = useParams();\r\n const [LRotacion, GetListaRotacion] = useState([\r\n {\r\n _id: \"61e844699370522d20653248\",\r\n mes: \"10\",\r\n anio: \"2021\",\r\n Estado: \"PRUEBA\",\r\n Periodo: \"PRUEBA 2021\",\r\n Markeplace: \"croatta\",\r\n },\r\n ]);\r\n\r\n //Login validation\r\n const token = localStorage.getItem(\"token\");\r\n const history = useHistory();\r\n useEffect(() => {\r\n if (token) {\r\n \r\n }else{\r\n history.push(\"/login\")\r\n }\r\n //console.log(reports)\r\n },[token]);\r\n\r\n const ActulizarRotacion = async (mes, anio, periodo) => {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/CrearRotacionUnidades\", {\r\n mes: mes,\r\n anio: anio,\r\n periodo: periodo,\r\n })\r\n .then((response) => {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n VolverAdmin();\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n };\r\n\r\n const Rotacion = async () => {\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/RotacionUnidades/Periodo\", {\r\n Periodo: periodo,\r\n })\r\n .then((response) => {\r\n GetListaRotacion(response.data.data);\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n };\r\n\r\n useEffect(() => {\r\n SetLandingHeader({ Estado: true });\r\n Rotacion();\r\n }, []);\r\n\r\n return (\r\n \r\n {Periodo} {Marketplace}\r\n
\r\n \r\n\r\n\r\n
\r\n \r\n \r\n {Marketplace === \"CROATTA\" ? (\r\n <>\r\n \r\n
\r\n
\r\n | {elemento.grupo} | \r\n{elemento.disponible} | \r\n{elemento.Devoluciones} | \r\n{elemento.vendidas} | \r\n{elemento.VendidasDafiti} | \r\n{elemento.VendidasLinio} | \r\n{elemento.VendidasMercado} | \r\n{elemento.VendidasExito} | \r\n{elemento.VendidasTotal} | \r\n{elemento.Final} | \r\n{elemento.rotacion}% | \r\n
|---|---|---|---|---|---|---|---|---|---|---|
| Totales | \r\n{Totales[0]} | \r\n{Totales[1]} | \r\n{Totales[2]} | \r\n{Totales[3]} | \r\n{Totales[4]} | \r\n{Totales[5]} | \r\n{Totales[6]} | \r\n{Totales[7]} | \r\n{Totales[8]} | \r\n{Totales[9]}% | \r\n
| {elemento.grupo} | \r\n{elemento.disponible} | \r\n{elemento.vendidas} | \r\n{elemento.Final} | \r\n{elemento.rotacion}% | \r\n||||||
| Totales | \r\n{Totales[0]} | \r\n{Totales[2]} | \r\n{Totales[8]} | \r\n{Totales[9]}% | \r\n
\r\n \r\n Costo: {formatterPeso.format(Costo)}\r\n \r\n \r\n Venta: {formatterPeso.format(Venta)}\r\n \r\n \r\n Utilidad: {formatterPeso.format(Venta+Costo)}\r\n \r\n
\r\n \r\n \r\n ROTACIÓN DE UNIDADES
{LRotacion[0].Periodo}\r\n \r\n\r\n
\r\n );\r\n};\r\n\r\nexport default RotacionIndex;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\nimport io from 'socket.io-client'\r\nimport \"../static/Indicadores.css\";\r\nimport { Link, useHistory} from \"react-router-dom\";\r\nimport swal from \"sweetalert\";\r\nimport ProgressBar from \"@ramonak/react-progress-bar\";\r\n\r\n// const socket = io('http://localhost:4000')\r\n\r\nconst RotacionSeller = ({\r\n SetLandingHeader,\r\n apiUrlState,\r\n recursosUrlState,\r\n modificarSpinnerState,\r\n}) => {\r\n const VolverAdmin = () => {\r\n window.location.href = \"/Admin/Index/MenuUnidades\";\r\n };\r\n\r\n const [Periodo, GetPeriodo] = useState([\"PRUEBA 2021\"]);\r\n const [Periodo2, SetPeriodo2] = useState([{anio: \"\", mes: \"\", Periodo: \"AGOSTO 2023\"}]);\r\n const [Fechas, SetFechas] = useState({ FechaIni: \"\", FechaFin: \"\" });\r\n const [Progreso, SetProgreso] = useState(0);\r\n // const [Mensaje, SetMensaje] = useState(\"\");\r\n\r\n const Periodos = async () => {\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/GetPeriodos\", {})\r\n .then((response) => {\r\n GetPeriodo(response.data.data);\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n };\r\n\r\n const VerificarPeriodo = ()=> {\r\n let existe = false;\r\n for(const periodo of Periodo) {\r\n if(periodo == Periodo2.Periodo){\r\n existe = true;\r\n }\r\n }\r\n return existe\r\n }\r\n\r\n const actualizarProgreso = () => {\r\n const socket = io(apiUrlState);\r\n socket.on('Progreso', (pr) => {\r\n console.log(pr);\r\n SetProgreso(pr.Progreso);\r\n // SetMensaje(pr.Mensaje);\r\n });\r\n }\r\n\r\n const cargarRotacion = async () => {\r\n if(Periodo2.Periodo != undefined){\r\n let res = VerificarPeriodo(Periodo2.Periodo)\r\n if(res) {\r\n swal({\r\n title: \"El informe ya ha sido generado anteriormente\",\r\n text: \"Si continúa el informe será reemplazado con los datos actuales\",\r\n icon: \"warning\",\r\n buttons: true,\r\n dangerMode: true,\r\n }).then(async(continuar) => {\r\n if (continuar) {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/CargarRotacion\", Periodo2)\r\n .then((response) => {\r\n Periodos();\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n console.log(\"Carga completa\");\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n }\r\n });\r\n }else {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/CargarRotacion\", Periodo2)\r\n .then((response) => {\r\n Periodos();\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n console.log(\"Carga completa\");\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n }\r\n }\r\n }\r\n\r\n const onChangePeriodo2 = (value) => {\r\n let periodo = value.split(\"-\");\r\n let anio = periodo[0];\r\n let mes = parseInt(periodo[1]) -1;\r\n const meses = [\"ENERO\", \"FEBRERO\", \"MARZO\", \"ABRIL\", \"MAYO\", \"JUNIO\", \"JULIO\", \"AGOSTO\", \"SEPTIEMBRE\", \"OCTUBRE\", \"NOVIEMBRE\", \"DICIEMBRE\"];\r\n let stringMes = meses[mes];\r\n let dataPeriodo = stringMes + \" \" + anio;\r\n SetPeriodo2({ anio: anio, mes: mes+1, Periodo: dataPeriodo });\r\n }\r\n\r\n\r\n const onChangeFecha = (fecha, tipo) => {\r\n if(tipo === \"FechaI\") {\r\n SetFechas({ ...Fechas, FechaIni: fecha });\r\n } else if(tipo === \"FechaF\") {\r\n let fechaI = new Date(Fechas.FechaIni);\r\n let fechaF = new Date(fecha);\r\n if(fechaF < fechaI) {\r\n console.log(\"la fecha final no puede ser anterior a la fecha inicial\")\r\n } else {\r\n SetFechas({ ...Fechas, FechaFin: fecha });\r\n }\r\n }\r\n }\r\n\r\n const onChangePeriodo_2 = (periodo) => {\r\n const fechaActual = new Date();\r\n const anio = fechaActual.getFullYear();\r\n const mes = fechaActual.getMonth() + 1;\r\n const Periodo = periodo.toUpperCase();\r\n SetPeriodo2({ anio: anio, mes: mes, Periodo: Periodo });\r\n }\r\n\r\n const generarInformeRotacion = async() => {\r\n actualizarProgreso();\r\n if(Fechas.FechaIni != undefined && Fechas.FechaFin != undefined) {\r\n let res = VerificarPeriodo(Periodo2.Periodo);\r\n if(res) {\r\n swal({\r\n title: \"El informe ya ha sido generado anteriormente\",\r\n text: \"Si continúa el informe será reemplazado con los datos actuales\",\r\n icon: \"warning\",\r\n buttons: true,\r\n dangerMode: true,\r\n }).then(async(continuar) => {\r\n if (continuar) {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/GenerarInformeRotacion\", {Periodo2, Fechas})\r\n .then((response) => {\r\n Periodos();\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n console.log(\"Carga completa\");\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n }\r\n });\r\n }else {\r\n modificarSpinnerState({\r\n Desplegar: true,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n await axios\r\n .post(apiUrlState + \"/Api/Unidades/GenerarInformeRotacion\", {Periodo2, Fechas})\r\n .then((response) => {\r\n Periodos();\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n console.log(\"Carga completa\");\r\n })\r\n .catch(function (err) {\r\n console.log(\"Error\");\r\n });\r\n } \r\n }\r\n }\r\n\r\n useEffect(()=> {\r\n if(Progreso === 100) {\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: \"actualizando rotacion\",\r\n });\r\n SetProgreso(0);\r\n } \r\n // else if(Progreso !== 0) {\r\n // modificarSpinnerState({\r\n // Desplegar: true,\r\n // Texto: Mensaje,\r\n // })\r\n // }\r\n }, [Progreso])\r\n\r\n //Login validation\r\n const token = localStorage.getItem(\"token\");\r\n const history = useHistory();\r\n useEffect(() => {\r\n if (token) {\r\n \r\n }else{\r\n history.push(\"/login\")\r\n }\r\n //console.log(reports)\r\n },[token]);\r\n\r\n useEffect(() => {\r\n SetLandingHeader({ Estado: true });\r\n Periodos();\r\n }, []);\r\n\r\n return (\r\n {LRotacion[0].Periodo}\r\n \r\n\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | {mes.Markeplace} | \r\n\r\n \r\n | \r\n
|---|
\r\n \r\n ROTACIÓN DE UNIDADES\r\n \r\n\r\n
\r\n );\r\n};\r\n\r\nexport default RotacionSeller;\r\n","import React, { useEffect, useState } from \"react\";\r\n//import epayco from 'epayco-sdk-js';\r\n\r\nfunction EpaycoButton() {\r\n // Configuración del botón de Epayco\r\n const [paymentSuccess, setPaymentSuccess] = useState(false);\r\n const [paymentError, setPaymentError] = useState(false);\r\n const [paymentStatus, setPaymentStatus] = useState('');\r\n\r\n function procesarRespuestaEPayco(response) {\r\n if (response.status === 'Aprobada') {\r\n // mostrar mensaje de confirmación en tu sitio web \r\n alert('El pago se ha realizado correctamente. ¡Gracias por tu compra!');\r\n } else {\r\n // mostrar mensaje de error en tu sitio web \r\n alert('Lo sentimos, el pago no se ha podido procesar en este momento. Por favor, intenta de nuevo más tarde.');\r\n }\r\n }\r\n const data = {\r\n key: '0026d7220b852a0f67c6ed61d2e8c9fd',\r\n amount: '10000',\r\n name: 'Producto de prueba',\r\n description: 'Descripción del producto',\r\n image: 'https://picsum.photos/200', // URL de la imagen del producto\r\n currency: 'COP',\r\n country: 'CO',\r\n factura: 44444,\r\n test: true,\r\n external: true,\r\n //response: false,\r\n //response: 'http://localhost', // URL de la página de respuesta\r\n confirmation: 'http://localhost', // URL de la página de confirmación\r\n acepted: \"https://www.dkda.com.co/Pedido/Confirmacion\",\r\n rejected: \"https://www.dkda.com.co/Pedido/Rechazado\",\r\n pending: \"https://www.dkda.com.co/Pedido/Pendiente\",\r\n // onapproved: () => setPaymentSuccess(true),\r\n // onrejected: () => setPaymentError(true),\r\n // response: procesarRespuestaEPayco,\r\n // confirmation: (confirmation) => {\r\n // console.log(confirmation);\r\n // },\r\n close: () => {\r\n console.log('Modal cerrado');\r\n }\r\n };\r\n\r\n // Función que se ejecuta al hacer clic en el botón de Epayco\r\n const handleEpaycoClick = () => {\r\n // Carga el script de Epayco y muestra el formulario de pago\r\n const handler = window.ePayco.checkout.configure({\r\n key: data.key,\r\n test: data.test,\r\n });\r\n // Agregar el evento message al objeto window para escuchar el mensaje de cierre del modal\r\n window.addEventListener('message', function(event) {\r\n console.log(\"ENTRA: \", event.data)\r\n //console.log(\"ENTRA Error: \", JSON.stringify(event))\r\n if(event.data.event === 'onCloseModal') {\r\n alert('el modal se ha cerrado.');\r\n }\r\n if(event.error) {\r\n alert('Error en el pago, vuelve a intentarlo.');\r\n }\r\n // Verificar que el mensaje provenga del dominio de ePayco\r\n if (event.origin === 'https://checkout.epayco.co') {\r\n // Verificar que el mensaje sea de tipo \"close\" y que la transacción se haya completado\r\n if (event.data === 'close' || event.data.status === 'Aceptada') {\r\n // Mostrar un mensaje de confirmación de pago finalizado o modal cerrado\r\n alert('El pago ha sido confirmado o el modal se ha cerrado.');\r\n }\r\n }\r\n });\r\n\r\n // Agregar el evento error al objeto window para escuchar el mensaje de error en el proceso de pago\r\n window.addEventListener('r', function(event) {\r\n // Verificar que el mensaje provenga del dominio de ePayco\r\n console.log(\"ENTRA ERRORRR-------------: \", event)\r\n if (event.origin === 'https://checkout.epayco.co') {\r\n // Mostrar un mensaje de error en el proceso de pago\r\n alert('Ha ocurrido un error en el proceso de pago.');\r\n }\r\n });\r\n handler.open(data,(response) => {\r\n if (response.status === 'Aprobada') {\r\n // la transacción fue aprobada, hacer algo aquí\r\n } else {\r\n // la transacción no fue aprobada, hacer algo aquí\r\n }\r\n });\r\n\r\n };\r\n\r\n const handlePayment = () => {\r\n // Configuración del botón de pago\r\n const data = {\r\n key: '0026d7220b852a0f67c6ed61d2e8c9fd',\r\n amount: '10000',\r\n name: 'Producto de prueba',\r\n description: 'Descripción del producto',\r\n image: 'https://picsum.photos/200', // URL de la imagen del producto\r\n currency: 'COP',\r\n country: 'CO',\r\n test: false,\r\n external: false,\r\n response: 'http://localhost', // URL de la página de respuesta\r\n confirmation: 'http://localhost', // URL de la página de confirmación\r\n onapproved: () => setPaymentSuccess(true),\r\n onrejected: () => setPaymentError(true)\r\n };\r\n\r\n\r\n \r\n // Creación del botón de pago con Epayco\r\n const button = new window.ePayco.Button(data);\r\n button.onClick();\r\n };\r\n\r\n const handlePayment2 = () => {\r\n\r\n };\r\n\r\n // useEffect(() => {\r\n // if (paymentSuccess) {\r\n // console.log(\"todo ok \")\r\n // }\r\n // console.log(\"paymentSuccess\", paymentSuccess)\r\n // console.log(\"paymentError\", paymentError)\r\n // if (paymentError) {\r\n // console.log(\"Cierra \")\r\n // }\r\n // }, [paymentSuccess, paymentError])\r\n\r\n useEffect(() => {\r\n console.log(\"paymentStatus: \", paymentStatus)\r\n }, [paymentStatus])\r\n\r\n useEffect(() => {\r\n const btnFinalizarCompra = document.getElementById('btn-finalizar-compra');\r\n if (btnFinalizarCompra) {\r\n btnFinalizarCompra.addEventListener('click', handleFinalizarCompra);\r\n }\r\n\r\n // limpiar evento de escucha cuando se desmonta el componente\r\n return () => {\r\n if (btnFinalizarCompra) {\r\n btnFinalizarCompra.removeEventListener('click', handleFinalizarCompra);\r\n }\r\n }\r\n }, []);\r\n\r\n function handleFinalizarCompra() {\r\n console.log(\"Pago fue realizado\")\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n {Progreso != 0? (\r\n
\r\n \r\n\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | {mes} | \r\n\r\n \r\n | \r\n
|---|
\r\n \r\n {paymentSuccess &&
\r\n Pago exitoso
}\r\n {paymentError &&Error en el pago
}\r\n\r\n
\r\n \r\n\r\n );\r\n}\r\n\r\nexport default EpaycoButton;","import axios from \"axios\";\r\nimport React, { useEffect, useState } from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport Footer from \"../Footer/Footer\";\r\nimport EpaycoButton from \"../Epayco\";\r\n\r\nimport CarouselInfo from \"./CarouselInfo\";\r\nimport HandlePage from \"../utils/HandlePage\";\r\nimport { useCategContext } from \"../../providers/CategoriasProviders\";\r\n\r\nimport \"./static/css/newIndex.css\";\r\n\r\nconst NewIndex = ({\r\n headerState,\r\n modificarHeaderState,\r\n categoriasState,\r\n marcasState,\r\n modificarCategoriasState,\r\n modificarMarcasState,\r\n productosState,\r\n modificarProductosState,\r\n spinnerState,\r\n modificarSpinnerState,\r\n errorState,\r\n modificarErrorState,\r\n apiUrlState,\r\n}) => {\r\n\r\n const categorias = useCategContext();\r\n const recursosUrlState = \"https://hosting.dkda.com.co/AppWeb\";\r\n const images = {\r\n img1: [\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL1.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL12.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL13.webp`,\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL1.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL2.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL3.webp\",\r\n ],\r\n img2: [\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL21.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL22.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL23.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL24.webp`,\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL21.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL22.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL23.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL24.webp\",\r\n ],\r\n img3: [\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL31.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL32.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL33.webp`,\r\n `${recursosUrlState}/img/Index/web/home/BANNERPRINCIPAL34.webp`,\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL31.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL32.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL33.webp\",\r\n // \"https://hosting.dkda.com.co/AppWeb/img/Index/web/home/BANNERPRINCIPAL34.webp\",\r\n ]\r\n\r\n }\r\n \r\n\r\n const aleatorio= (max)=>{\r\n return Math.floor(Math.random() * max);\r\n }\r\n const CambioProductos = async (\r\n categoria,\r\n subcategoria,\r\n marca,\r\n genero,\r\n nuevo = false,\r\n descuento = false\r\n ) => {\r\n modificarProductosState([\r\n { CambioSeccion: false, Busqueda: false, irInicio: true },\r\n [],\r\n ]);\r\n let url = apiUrlState + \"/Api/Inventario/GetProductos\";\r\n let data = {};\r\n\r\n if (nuevo) {\r\n data = {\r\n Categorias: [],\r\n Generos: [],\r\n Marcas: [],\r\n Medidas: [],\r\n Tallas: [],\r\n Colores: [],\r\n Subcategoria: [],\r\n ParametroOrdenamiento: \"\",\r\n ProductosNuevos: true,\r\n Descuentos: false,\r\n Todo: false,\r\n Origen: \"New1\"\r\n };\r\n } else if (descuento) {\r\n data = {\r\n Categorias: [],\r\n Generos: [],\r\n Marcas: [],\r\n Medidas: [],\r\n Tallas: [],\r\n Colores: [],\r\n Subcategoria: [],\r\n ParametroOrdenamiento: \"\",\r\n ProductosNuevos: false,\r\n Descuentos: true,\r\n Todo: false,\r\n Origen: \"New2\"\r\n };\r\n } else {\r\n data = {\r\n Categorias: categoria === null ? [] : [categoria],\r\n Generos: genero === null ? [] : [genero],\r\n Marcas: marca === null ? [] : marca,\r\n Medidas: [],\r\n Tallas: [],\r\n Colores: [],\r\n Subcategoria: subcategoria === null ? [] : [subcategoria],\r\n ParametroOrdenamiento: \"Marca\",\r\n Descuentos: false,\r\n ProductosNuevos: false,\r\n Origen: \"New3\"\r\n };\r\n }\r\n\r\n if (!spinnerState[\"Desplegar\"]) {\r\n modificarSpinnerState({\r\n Desplegar: !spinnerState[\"Desplegar\"],\r\n Texto: \"Cargando productos...\",\r\n });\r\n }\r\n await axios\r\n .post(\r\n url,\r\n {\r\n data,\r\n },\r\n {}\r\n )\r\n .then((response) => {\r\n modificarProductosState([\r\n { CambioSeccion: false, Busqueda: false, irInicio: true },\r\n response.data.data,\r\n ]);\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n if (errorState[\"Error\"]) {\r\n modificarErrorState({\r\n Error: false,\r\n Mensaje: \"Todo bien, todo correcto\",\r\n });\r\n }\r\n })\r\n .catch(function (err) {\r\n if (!errorState[\"Error\"])\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Error al recuperar datos del servidor\",\r\n });\r\n modificarSpinnerState({\r\n Desplegar: false,\r\n Texto: spinnerState[\"texto\"],\r\n });\r\n });\r\n };\r\n\r\n useEffect(() => {\r\n modificarHeaderState({ ...headerState, Cliente: \"Minoristas\" });\r\n }, []);\r\n\r\n\r\n // Cambio temporal para el concurso de diseño\r\n // const [fondo, setFondo] = useState(aleatorio(fondos.length)); // descomentar\r\n const [fondo, setFondo] = useState(3); // comentar\r\n\r\n\r\n useEffect(() => { \r\n console.log(\"asd\", fondo);\r\n }, []);\r\n\r\n return (\r\n <>\r\n Checkout
\r\n \r\n {paymentStatus === 'approved' &&Pago realizado exitosamente.
}\r\n {paymentStatus === 'rejected' &&Error al procesar el pago.
}\r\n\r\n NUEVA COLECCIÓN\r\n
\r\n \r\n\r\n \r\n {/* */}\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default NewIndex;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport \"../static/Indicadores.css\";\r\nimport { FaFileUpload, FaServer, FaCloudUploadAlt } from 'react-icons/fa';\r\n\r\nconst Imagenes = ({ apiUrlState }) => {\r\n const [archivos, setArchivos] = useState(null);\r\n\r\n const subirArchivos = (file) => {\r\n setArchivos(file);\r\n };\r\n\r\n const insertarArchivos = async () => {\r\n const formData = new FormData();\r\n for (let index = 0; index < archivos.length; index++) {\r\n formData.append(\"file\", archivos[index]);\r\n }\r\n let carga = await fetch(apiUrlState + \"/Api/imagenes/upload\", {\r\n method: \"POST\",\r\n body: formData,\r\n });\r\n\r\n console.log(carga.status);\r\n\r\n if (carga.status == 202) {\r\n document.getElementById(\"preview\").innerHTML = \"\";\r\n document.getElementById(\"carga\").innerHTML =\r\n \"por Favor de click en Carga hosting\";\r\n console.log(carga, \"**********\");\r\n }\r\n };\r\n\r\n // const insertarHost = async () => {\r\n // let carga = await fetch(apiUrlState + \"/Api/imagenes/upload2\", {\r\n // method: \"GET\",\r\n // });\r\n\r\n const insertarHost = async () => {\r\n let carga = await fetch(apiUrlState + \"/Api/Upload/upload-images\", {\r\n method: \"POST\",\r\n body: {},\r\n });\r\n\r\n \r\n\r\n console.log(carga.status);\r\n\r\n if (carga.status == 201) {\r\n document.getElementById(\"preview\").innerHTML = \"\";\r\n document.getElementById(\"carga\").innerHTML =\r\n \"Proceso de carga iniciado, se notifica por correo cuando el proceso concluya\";\r\n console.log(carga, \"**********\");\r\n }\r\n console.log(apiUrlState + \"/Api/imagenes/upload2\");\r\n \r\n };\r\n\r\n const listarArchivos = (files) => {\r\n console.log(files);\r\n console.log(typeof files);\r\n let ul = document.getElementById(\"preview\");\r\n\r\n if (files.length > 0) {\r\n for (let index = 0; index < files.length; index++) {\r\n console.log(files[index].name);\r\n let li = document.createElement(\"li\");\r\n li.appendChild(document.createTextNode(files[index].name));\r\n ul.appendChild(li);\r\n }\r\n } else {\r\n document.getElementById(\"preview\").innerHTML = \"\";\r\n }\r\n };\r\n\r\n return (\r\n \r\n
\r\n {/* \r\n {categorias.map((categoria, index) => (\r\n {}\r\n // CambioProductos(\r\n // categoria[2],\r\n // categoria[3],\r\n // categoria[4],\r\n // categoria[5],\r\n // categoria[6],\r\n // categoria[9]\r\n // )\r\n }\r\n >\r\n
\r\n \r\n \r\n \r\n\r\n {/* \r\n {categoria[0]}\r\n */}\r\n
\r\n \r\n ))}\r\n \r\n
*/}\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Imagenes;\r\n","import axios from 'axios';\r\nimport React, { useState, useEffect } from 'react' \r\n\r\nconst LoginVendedor = ({\r\n apiUrlState,\r\n modificarApiUrlState,\r\n headerState,\r\n modificarHeaderState,\r\n errorState,\r\n modificarErrorState,\r\n vendedor,\r\n modificarVendedorState,\r\n actualizarSessionStorage,\r\n}) => {\r\n\r\n // states\r\n const [userData, setUserData] = useState({ email: \"\", password: \"\" });\r\n const [loading, setLoading] = useState(false);\r\n const [warning, setWarning] = useState(\"\")\r\n\r\n // Actualizacion de campos de formulario\r\n const HandleChange = (e) => {\r\n // console.log(\"[e.target.name]\", e.target.name)\r\n // console.log(\"[e.target.value]\", e.target.value.toLowerCase())\r\n let value = e.target.value;\r\n setUserData({ ...userData, [e.target.name]: value.toLowerCase() });\r\n };\r\n\r\n useEffect(() => {\r\n if(localStorage.getItem(\"Vendedor\")) {\r\n window.location.href = \"/Preventa/Catalogo\"\r\n }\r\n }, [])\r\n \r\n\r\n const onSubmit = async( e ) => {\r\n e.preventDefault();\r\n if(userData.email !== \"\" && userData.password !== \"\") {\r\n setLoading(true);\r\n setWarning(\"\");\r\n const respuesta = await axios.post(apiUrlState + `/Api/Vendedor/LoginVendedor`, userData);\r\n const Vendedor = respuesta.data.data;\r\n if(Vendedor !== null) {\r\n localStorage.setItem(\"Vendedor\", JSON.stringify(Vendedor));\r\n localStorage.setItem(\"TipoCliente\", \"Mayoristas\");\r\n localStorage.removeItem(\"Carrito\");\r\n localStorage.setItem(\"Bodega\", \"6\"); // Bodega predeterminada\r\n modificarVendedorState(Vendedor);\r\n modificarErrorState({\r\n Error: true,\r\n Mensaje: \"Bienvenido Vendedor\",\r\n Vendedor: Vendedor.Nombre\r\n });\r\n modificarHeaderState({\r\n ...headerState,\r\n Cliente: \"Mayoristas\"\r\n });\r\n setTimeout(()=>{\r\n window.location.href = \"/Preventa/Catalogo\";\r\n },2000);\r\n } else {\r\n setLoading(false);\r\n setWarning(\"Datos incorrectos\");\r\n }\r\n\r\n }\r\n }\r\n\r\n\r\n return (\r\n CARGA DE FOTOS
\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\nexport default LoginVendedor;","import { useState, useEffect } from \"react\"\r\nimport \"./static/Descuentos.css\"\r\nimport axios from \"axios\"\r\nimport swal from \"sweetalert\";\r\n\r\nconst Descuentos = ({\r\n apiUrlState,\r\n}) => {\r\n\r\n const [descuentos, setDescuentos] = useState({\r\n Mayorista: 0,\r\n Minorista: 0,\r\n });\r\n\r\n const [colecciones, setColecciones] = useState([]);\r\n\r\n const modificarDescuento = (e, mod) =>{\r\n if(e === \"Mayorista\" && mod === \"add\" && descuentos.Mayorista < 100) {\r\n setDescuentos({\r\n Mayorista: descuentos.Mayorista += 5,\r\n Minorista: descuentos.Minorista,\r\n });\r\n } else if (e === \"Minorista\" && mod === \"add\" && descuentos.Minorista < 100) {\r\n setDescuentos({\r\n Mayorista: descuentos.Mayorista,\r\n Minorista: descuentos.Minorista +=5,\r\n });\r\n } else if (e === \"Mayorista\" && mod === \"sub\" && descuentos.Mayorista > 0) {\r\n setDescuentos({\r\n Mayorista: descuentos.Mayorista -=5,\r\n Minorista: descuentos.Minorista,\r\n });\r\n } else if (e === \"Minorista\" && mod === \"sub\" && descuentos.Minorista > 0) {\r\n setDescuentos({\r\n Mayorista: descuentos.Mayorista,\r\n Minorista: descuentos.Minorista -=5,\r\n });\r\n }\r\n }\r\n\r\n const activarDescuentosAuto = async () => {\r\n const url = `${apiUrlState}/Api/Inventario/ActivarDescuentosAuto`;\r\n axios.get(url)\r\n .then((response)=>{\r\n swal(response.data.message, {\r\n icon: \"info\",\r\n });\r\n });\r\n }\r\n\r\n const desactivarDescuentosAuto = async () => {\r\n console.log(\"Desactivando descuentos\");\r\n const url = `${apiUrlState}/Api/Inventario/DesactivarDescuentosAuto`;\r\n axios.get(url)\r\n .then((response)=>{\r\n swal(response.data.message, {\r\n icon: \"info\",\r\n });\r\n });\r\n }\r\n\r\n const activarDescuentosColeccion = async(e) => {\r\n e.preventDefault();\r\n const Coleccion = e.target.Coleccion.value;\r\n const Bodega = e.target.Bodega.value;\r\n const DescuentoMayorista = e.target.DctoMayorista.value;\r\n const DescuentoMinorista = e.target.DctoMinorista.value;\r\n // Realizar peticion \r\n const url = `${apiUrlState}/Api/Inventario/DescuentosColeccion`;\r\n await axios.post(url, {\r\n Coleccion,\r\n Bodega, \r\n DescuentoMayorista,\r\n DescuentoMinorista,\r\n }\r\n ).then((response)=>{\r\n console.log(response)\r\n swal(response.data.message, {\r\n icon: \"info\",\r\n });\r\n })\r\n\r\n }\r\n\r\n const desactivarDescuentosColeccion = async(e) => {\r\n e.preventDefault();\r\n console.log(e, e.target.Coleccion.value)\r\n const Coleccion = e.target.Coleccion.value;\r\n const Bodega = e.target.Bodega.value;\r\n const DescuentoMayorista = 0;\r\n const DescuentoMinorista = 0;\r\n // Realizar peticion \r\n const url = `${apiUrlState}/Api/Inventario/DescuentosColeccion`;\r\n await axios.post(url, {\r\n Coleccion,\r\n Bodega, \r\n DescuentoMayorista,\r\n DescuentoMinorista,\r\n }\r\n ).then((response)=>{\r\n console.log(response)\r\n })\r\n }\r\n\r\n const getColecciones = async() => {\r\n const url = `${apiUrlState}/Api/Inventario/GetColecciones`;\r\n await axios.get(url)\r\n .then((response)=>{\r\n setColecciones(response.data.data);\r\n });\r\n }\r\n \r\n useEffect(() => {\r\n getColecciones();\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 cambioRegistro()}\r\n >\r\n ¿Nuevo? Regístrate ahora.\r\n \r\n
*/}\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default Descuentos;","//Importacion de componentes externos.\r\nimport React, { Fragment, useState } from \"react\";\r\nimport {\r\n Redirect,\r\n BrowserRouter as Router,\r\n Switch,\r\n Route,\r\n} from \"react-router-dom\";\r\nimport { ModalProvider } from \"react-simple-hook-modal\";\r\n\r\n//Importacion de componentes internos.\r\nimport Header from \"./components/Header/Header\";\r\nimport Index from \"./components/Index/Index\";\r\nimport Mercado from \"./components/Mercado/Mercado\";\r\nimport Mayoristas from \"./components/Mercado/Mayoristas\";\r\nimport Pedido from \"./components/Pedido/Pedido\";\r\nimport PaymentConfirmation from \"./components/ConfirmacionPago/index\";\r\nimport PaymentRejected from \"./components/ConfirmacionPago/Rechazado\";\r\nimport PaymentPending from \"./components/ConfirmacionPago/Pendiente\";\r\nimport ModalGeneral from \"./components/Modal/ModalGeneral\";\r\nimport InicioSesion from \"./components/Usuario/InicioSesion\";\r\nimport Ayuda from \"./components/Ayuda/Ayuda\";\r\nimport Loader from \"react-loader-spinner\";\r\n\r\nimport Landing from \"./components/Landing/Landing\";\r\nimport Indicadores from \"./components/Admin/Indicadores/Indicadores\";\r\nimport DetalleMeta from \"./components/Admin/Indicadores/DetalleMeta\";\r\nimport Detalle from \"./components/Mercado/Detalle\";\r\nimport CrudIndicadores from \"./components/Admin/CrudIndicadores/CrudInicadores\";\r\nimport Unidades from \"./components/Admin/Unidades/Unidades\";\r\nimport MenuPrincipal from \"./components/Admin/Index/MenuPrincipal\";\r\nimport MenuUnidades from \"./components/Admin/Index/MenuUnidades\";\r\nimport Dashboard from \"./components/Admin/Dashboard/Dashboard\";\r\nimport Whatsapp from \"./components/Admin/Whatsapp/Whatsapp\";\r\n\r\nimport RegistroTercero from \"./components/Concurso/registroConcurso\";\r\n\r\n//Importaciones de css\r\nimport \"./components/Index/static/css/Index.css\";\r\nimport \"./static/css/General.css\";\r\nimport TagManager from \"react-gtm-module\";\r\nimport ReactPixel from \"react-facebook-pixel\";\r\nimport Rotacion from \"./components/Admin/Rotacion/Rotacion\";\r\nimport RotacionIndex from \"./components/Admin/Rotacion/RotacionIndex\";\r\nimport RotacionSeller from \"./components/Admin/Rotacion/RotacionSeller\";\r\nimport NewIndex from \"./components/Index/NewIndex\";\r\nimport Imagenes from \"./components/Admin/Imagenes/Imagenes\";\r\nimport LoginVendedor from \"./components/Vendedor/LoginVendedor\";\r\nimport Promocion from \"./components/Promos/Promocion\"\r\nimport Descuentos from \"./components/Admin/Descuentos/Descuentos\";\r\nimport { CategoriasProvider } from \"./providers/CategoriasProviders\";\r\nimport { GlobalStatesProvider } from './providers/GlobalStatesProviders';\r\n\r\nconst tagManagerArgs = {\r\n //GTM-5RGW82S\r\n gtmId: \"GTM-5RGW82S\",\r\n};\r\n\r\nTagManager.initialize(tagManagerArgs);\r\nTagManager.dataLayer({\r\n dataLayer: {\r\n event: \"pageview\",\r\n path: \"/\",\r\n },\r\n});\r\nReactPixel.init(\"1057432718119761\");\r\nReactPixel.pageView();\r\nReactPixel.track(\"track\", \"ViewContent\");\r\nfunction App() {\r\n let DEBUG = false;\r\n\r\n //State para peticiones al servidor, determinado por el estado del DEBUG. 192.168.2.109 \"http://181.55.127.197:5000\"\r\n const [apiUrlState, modificarApiUrlState] = useState(\r\n DEBUG ? \"http://localhost:4000\" : \"https://api.dkda.com.co\"\r\n );\r\n\r\n //State para el uso de recursos de imagenes segun el estado del DEBUG.\r\n const [recursosUrlState, modificarRecursosUrlState] = useState(\r\n DEBUG ? \"https://hosting.dkda.com.co/AppWeb\" : \"https://hosting.dkda.com.co/AppWeb\"\r\n );\r\n\r\n //State que contiene la lista de productos actuales del cliente.\r\n const [carrito, modificarCarritoState] = useState({\r\n Accion: \"Recuperar\",\r\n Carrito: [],\r\n });\r\n\r\n //State para definicion de los colores del header y ocultar y mostrar elementos.\r\n const [headerState, modificarHeaderState] = useState({\r\n srcLogo: recursosUrlState + \"/img/Email/45441614379749154.png\",\r\n srcBolsa: recursosUrlState + \"/img/Index/web/home/carrito.png\",\r\n srcFlecha:\r\n recursosUrlState + \"/img/Index/web/botones/flecha-derecha-negro.png\",\r\n displayBuscar: \"in-line\",\r\n displayMenu: \"Index\",\r\n color: \"negro\",\r\n Seccion: \"\",\r\n Cliente: \"\",\r\n BotonCatalogo: false,\r\n });\r\n\r\n const [AdminHeaderState, setAdminHeaderState] = useState({\r\n second: \"SecondHeader\",\r\n principal: \"centerHeader\",\r\n });\r\n\r\n const [administradorState, modificarAdministradorState] = useState({\r\n Recuperar: true,\r\n NumeroDocumento: \"\",\r\n Nombres: \"\",\r\n Apellidos: \"\",\r\n Tipo: \"\",\r\n });\r\n\r\n const [metodoFact, setMetodoFact] = useState({\r\n Facturacion: 0,\r\n Remision: 100\r\n });\r\n\r\n /** Seleccion de bodega para catalogos */\r\n let parsedBodegaC\r\n const localStorageBodegaC = localStorage.getItem(\"BodegaCatalogos\");\r\n if(!localStorageBodegaC) {\r\n parsedBodegaC = \"3\"\r\n } else {\r\n parsedBodegaC = localStorageBodegaC;\r\n }\r\n const [BodegaCatalogos, setBodegaCatalogos] = useState(parsedBodegaC);\r\n \r\n //** Estados para manejo de vendedores */\r\n let parsedBodega\r\n const localStorageBodega = localStorage.getItem(\"Bodega\");\r\n if(!localStorageBodega) {\r\n parsedBodega = \"3\"\r\n } else {\r\n parsedBodega = localStorageBodega;\r\n }\r\n const [Bodega, setBodega] = useState(parsedBodega);\r\n\r\n let parsedVendedor;\r\n const localStorageVendedor = localStorage.getItem(\"Vendedor\");\r\n if(!localStorageVendedor) {\r\n // localStorage.setItem('Vendedor', JSON.stringify([]));\r\n parsedVendedor = null\r\n } else {\r\n parsedVendedor = JSON.parse(localStorageVendedor);\r\n localStorage.setItem(\"TipoCliente\", \"Mayoristas\")\r\n }\r\n const [vendedor, modificarVendedorState] = useState(parsedVendedor);\r\n //** END Estados para manejo de vendedores */\r\n\r\n //State para el despliegue del spinner.\r\n const [spinnerState, modificarSpinnerState] = useState({\r\n Desplegar: false,\r\n Texto: \"Cargando productos...\",\r\n });\r\n\r\n //State para estados de pagos en pedidos y la pagina.\r\n const [pedidoState, modificarPedidoState] = useState({\r\n Pagina: 1,\r\n Efecty: false,\r\n EfectyImg: recursosUrlState + \"/img/Pedido/efecty-negro.png\",\r\n Baloto: false,\r\n BalotoImg: recursosUrlState + \"/img/Pedido/baloto-negro.png\",\r\n PSE: false,\r\n PSEImg: recursosUrlState + \"/img/Pedido/pse-negro.png\",\r\n Credito: false,\r\n CreditoImg: recursosUrlState + \"/img/Pedido/credito-negro.png\",\r\n Contraentrega: false,\r\n ContraentregaImg: recursosUrlState + \"/img/Pedido/contraentrega.png\",\r\n Consignacion: false,\r\n ConsignacionImg: recursosUrlState + \"/img/Pedido/bancolombia-negro.png\",\r\n SuperGiros: false,\r\n SuperGirosImg: recursosUrlState + \"/img/Pedido/supergiros-negro.png\",\r\n Epayco: false,\r\n EpaycoImg: recursosUrlState + \"/img/Pedido/epayco-negro.png\",\r\n Addi: false,\r\n AddiImg: recursosUrlState + \"img/Pedido/ADDI_logo.png\",\r\n });\r\n\r\n //State para despliegue del modal de error e informacion.\r\n const [errorState, modificarErrorState] = useState({\r\n Error: false,\r\n Mensaje: \"\",\r\n });\r\n\r\n //State para los radioButtons del index, en el cambio de imagen.\r\n const [radioButtons, modificarRadioButtons] = useState({\r\n radio1: recursosUrlState + \"/img/Index/web/botones/radioSeleccion.png\",\r\n radio2: recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.png\",\r\n radio3: recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.png\",\r\n radio4: recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.png\",\r\n radio5: recursosUrlState + \"/img/Index/web/botones/radioSinSeleccionar.png\",\r\n });\r\n\r\n //State que contiene estados de busqueda de productos y tambien la lista de productos actuales.\r\n const [productosState, modificarProductosState] = useState([\r\n { CambioSeccion: true, Busqueda: false, irInicio: false },\r\n [],\r\n ]);\r\n //State que contiene los estados del header para modificar su estilo en la vista de landing.\r\n const [landingState, modificarlandingState] = useState({\r\n Display: \"\",\r\n Posicion: \"1%\",\r\n positionlogo: \"\",\r\n transform: \"\",\r\n });\r\n\r\n //State para la categoria y genero, estados de cambio de filtro, categoria y posicion de filtro.\r\n const [filtrosState, modificarFiltrosState] = useState({\r\n Genero: \"607ed653521b1c0910a581b8\",\r\n Categoria: \"\",\r\n CambioFiltro: false,\r\n CambioCategoria: false,\r\n filtroResumido: false,\r\n posicionFiltros: \"-100%\",\r\n width: \"0px\",\r\n });\r\n\r\n //State de estados de categorias de hombre.\r\n const [categoriasState, modificarCategoriasState] = useState({\r\n Hombre: null,\r\n Mujer: null,\r\n Niño: null,\r\n });\r\n const [subCategoriasState, modificarSubCategoriasState] = useState(\"\");\r\n\r\n const [LandingHeader, SetLandingHeader] = useState({ Estado: false });\r\n\r\n const [ViewDetalle, SetViewDetalle] = useState({ Estado: false });\r\n\r\n const [tallasState, modificarTallasState] = useState([]);\r\n\r\n const [coloresState, modificarColoresState] = useState([]);\r\n\r\n const [marcasState, modificarMarcasState] = useState([]);\r\n\r\n const [medidasState, modificarMedidasState] = useState([]);\r\n\r\n const [refNoCatalogoState, modificarRefNoCatalogoState] = useState([]);\r\n\r\n // Estabelece el check de la lista de productos en catálogo\r\n const [checkedProductos, setCheckedProductos] = useState(true);\r\n\r\n const [ayudaState, modificarAyudaState] = useState({\r\n Producto: false,\r\n Envio: false,\r\n Cambios: false,\r\n });\r\n\r\n const actualizarSessionStorage = (nombreItem, item) => {\r\n //Obtengo todos los items de la sessionStorage actual, para no perder ningun dato.\r\n const clienteSession = localStorage.Cliente;\r\n const tipoClienteSession = localStorage.TipoCliente;\r\n const carritoSession = localStorage.Carrito;\r\n const administradorSession = localStorage.Administrador;\r\n\r\n //Limpiamos la localStorage actual.\r\n //localStorage.clear();\r\n localStorage.removeItem(\"Cliente\", \"TipoCliente\", \"Carrito\", \"Administrador\");\r\n //Y añadimos los item a la localStorage, primeramente el item que entra por parametro y despues cada uno de los otros items verificando si no es el que entro por parametro.\r\n localStorage.setItem(nombreItem, item);\r\n if (nombreItem !== \"Cliente\")\r\n localStorage.setItem(\"Cliente\", clienteSession);\r\n if (nombreItem !== \"TipoCliente\")\r\n localStorage.setItem(\"TipoCliente\", tipoClienteSession);\r\n if (nombreItem !== \"Carrito\")\r\n localStorage.setItem(\"Carrito\", carritoSession);\r\n if (nombreItem !== \"Administrador\")\r\n localStorage.setItem(\"Administrador\", administradorSession);\r\n };\r\n\r\n return (\r\n \r\n { activarDescuentosAuto() }}\r\n >Activar\r\n { desactivarDescuentosAuto() }}\r\n >Desactivar\r\n
\r\n\r\n Descuentos automáticos
\r\nEstos descuentos se asignarán de acuerdo a la fecha de creación del producto.
\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 {spinnerState[\"Texto\"]}\r\n \r\n
\r\n