From 8d400232b36cde5da0047971c91713da625a3837 Mon Sep 17 00:00:00 2001 From: ItsJorgeRdz03 <82615294+ItsJorgeRdz03@users.noreply.github.com> Date: Mon, 3 Jun 2024 01:23:11 -0700 Subject: [PATCH] =?UTF-8?q?Correcciones=20con=20el=20bot=C3=B3n=20de=20fav?= =?UTF-8?q?orito=20(A=C3=BAn=20faltan=20m=C3=A1s=20correcciones)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/ui/PopupServicio.jsx | 30 ++++++++++++++- client/src/components/ui/Servicio.jsx | 37 ++++++++++++------- client/src/components/ui/ServiciosYFiltro.jsx | 3 +- .../components/ui/servicios/ServiciosSpa.jsx | 24 ++++++++++-- 4 files changed, 74 insertions(+), 20 deletions(-) diff --git a/client/src/components/ui/PopupServicio.jsx b/client/src/components/ui/PopupServicio.jsx index d548dd03..c512f74b 100644 --- a/client/src/components/ui/PopupServicio.jsx +++ b/client/src/components/ui/PopupServicio.jsx @@ -17,7 +17,7 @@ const StyledRating = styled(Rating)({ }, }); -const PopupServicio = ({ cerrar, check, datos, update }) => { +const PopupServicio = ({ cerrar, check, datos, update, st }) => { const sim = [ { nombre: "Cargando...", @@ -118,6 +118,31 @@ const PopupServicio = ({ cerrar, check, datos, update }) => { } }; + const callFav = async () => { + if (datos.id != 0) { + try { + const respuesta = await fetch("/api/admin/productos/setFavorito", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + id: datos.idUser, + idPS: datos.id, + estado: datos.favorito, + }), + }); + + let respuestaJson = await respuesta.json(); + if ((await respuestaJson[0].res) == true) { + st(); + } + } catch (error) { + console.log(error, "error"); + } + } + }; + const mostrarSimilares = similares.slice(indexItem, indexItem + renderItems); return ( @@ -195,8 +220,9 @@ const PopupServicio = ({ cerrar, check, datos, update }) => {
`${value} Heart${value !== 1 ? "s" : ""}` diff --git a/client/src/components/ui/Servicio.jsx b/client/src/components/ui/Servicio.jsx index 14513b77..550152aa 100644 --- a/client/src/components/ui/Servicio.jsx +++ b/client/src/components/ui/Servicio.jsx @@ -1,5 +1,5 @@ import * as React from "react"; -import { useState } from "react"; +import { useState, useEffect } from "react"; import { styled } from "@mui/material/styles"; import Box from "@mui/material/Box"; import Rating from "@mui/material/Rating"; @@ -30,8 +30,12 @@ function Servicio({ valoracion, favorito, log, + st, }) { + const [login, setLogin] = useState(false); + const [serv, setServ] = useState(false); const data = { + idUser: idUser, id: pkIdPS, nombre: nombre, descripcion: descripcion, @@ -40,8 +44,6 @@ function Servicio({ valoracion: valoracion, favorito: favorito, }; - const [login, setLogin] = useState(false); - const [serv, setServ] = useState(false); const [pData, setPData] = useState(data); const [fav, setFav] = useState(favorito); const navigate = useNavigate(); @@ -64,7 +66,7 @@ function Servicio({ setPData(data); setServ(!serv); }; - async function callFav() { + const callFav = async () => { if (idUser != 0) { try { const respuesta = await fetch("/api/admin/productos/setFavorito", { @@ -75,24 +77,32 @@ function Servicio({ body: JSON.stringify({ id: idUser, idPS: pkIdPS, - estado: fav, + estado: favorito, }), }); - respuestaJson = await respuesta.json(); - if (respuestaJson.res == true) { - await setFav(!fav); - } else { - await setFav(fav); + let respuestaJson = await respuesta.json(); + if ((await respuestaJson[0].res) == true) { + setFav(!fav); } } catch (error) { console.log(error, "error"); } } - } + }; + + useEffect(() => { + if (fav !== favorito) { + st(); + } + }, [fav]); + return ( <> -
+
console.log(favorito)} + className="grid gap-4 m-4 text-center md:m-8" + >
callFav()} name="customized-color" - defaultValue={fav} + value={fav} max={1} getLabelText={(value) => `${value} Heart${value !== 1 ? "s" : ""}` @@ -187,6 +197,7 @@ function Servicio({ cerrar={closeServ} check={toggleServ} update={setPData} + st={st} /> )} diff --git a/client/src/components/ui/ServiciosYFiltro.jsx b/client/src/components/ui/ServiciosYFiltro.jsx index 2794ccfb..5124468b 100644 --- a/client/src/components/ui/ServiciosYFiltro.jsx +++ b/client/src/components/ui/ServiciosYFiltro.jsx @@ -60,7 +60,7 @@ const filters = [ }, ]; -const ServiciosYFiltro = ({ servicios, log, idUser }) => { +const ServiciosYFiltro = ({ servicios, log, idUser, st }) => { const [mobileFiltersOpen, setMobileFiltersOpen] = useState(false); const [sortOption, setSortOption] = useState(ordenamiento[0]); const [allProducts, setAllProducts] = useState([]); @@ -686,6 +686,7 @@ const ServiciosYFiltro = ({ servicios, log, idUser }) => { valoracion={servicio.valoracion} favorito={servicio.favorito} log={log} + st={st} /> )) )} diff --git a/client/src/components/ui/servicios/ServiciosSpa.jsx b/client/src/components/ui/servicios/ServiciosSpa.jsx index 54c0c38d..c05f298e 100644 --- a/client/src/components/ui/servicios/ServiciosSpa.jsx +++ b/client/src/components/ui/servicios/ServiciosSpa.jsx @@ -12,6 +12,7 @@ export default function ServicioEstetica() { const [color2, setColor2] = useState("#F6B3B9"); const [log, setLog] = useState(false); const [id, setId] = useState(); + const [st, setSt] = useState(false); const [soon, setSoon] = useState(false); const toggleSoon = () => { @@ -72,7 +73,7 @@ export default function ServicioEstetica() { }); }, 3000); } - }, [id]); + }, [id, st]); //useEffect para obtener los servicios corporales useEffect(() => { @@ -93,7 +94,7 @@ export default function ServicioEstetica() { }); }, 3000); } - }, [id]); + }, [id, st]); const toggleService = (index) => { setToggleState(index); @@ -106,6 +107,11 @@ export default function ServicioEstetica() { } }; + function changeSt() { + console.log(5); + setSt(!st); + } + return ( <> @@ -146,9 +152,19 @@ export default function ServicioEstetica() {
{toggleState == 1 ? ( - + ) : ( - + )}