Merge pull request #254 from Arquisoft/Main-Develop

Arreglo de fallos de la entrega, carrito + boton mis pedidos + fallos en la ventana de pago
Arquisoft · May 10, 2022 · 6955b8a · 6955b8a
2 parents e2e1d5b + 50cceff
commit 6955b8a
Show file tree

Hide file tree

Showing 11 changed files with 124 additions and 189 deletions.
diff --git a/webapp/src/App.tsx b/webapp/src/App.tsx
@@ -12,7 +12,7 @@ import AddProdutcAdmin from './pages/admin/AddProdcutAdmin';
 import ManageProducts from './pages/admin/ManageProducts';
 import ManageOrders from './pages/admin/ManageOrders';
 import Profile from './pages/user/Profile';
-import OrderHistory from './pages/user/OrderHistory';
+import OrdersHistoryByUser from './pages/user/OrdersHistoryByUser'
 import PrivateRoute from './components/routes/PrivateRoute';
 import jwt_decode from "jwt-decode";
 import Swal from 'sweetalert2';
@@ -33,10 +33,15 @@ const App: FC = () => {
     if(user){
       const exist = cartItems.find(x=> x.codigo === prod.codigo);
       if(exist){
-        setCartItems(cartItems.map(x=> x.codigo === prod.codigo ? {...exist, cantidad : exist.cantidad +1} : x))
+        exist.cantidad+=1
+        setCartItems(cartItems.map(x=> x.codigo === prod.codigo ?{ ...x, exist } : x))
       } else {
-        setCartItems([...cartItems,{...prod,cantidad:1}])
+        prod.cantidad = 1;
+        cartItems.push(prod)
+        setCartItems([...cartItems])
       }
+      console.log("CARRO ---> " + JSON.stringify(cartItems))
+      localStorage.setItem('carrito',JSON.stringify(cartItems))
     }else{
       Swal.fire({
         title: "Debes iniciar sesión",
@@ -67,7 +72,7 @@ const App: FC = () => {
           <Route path = 'login' element = {<LogIn/>}/>
           <Route path = 'signup' element = {<SignUp/>}/>
           <Route path = 'user/profile' element = {<Profile />} />
-          <Route path = 'user/orderHistory' element = {<OrderHistory />} />
+          <Route path = 'user/orderHistory' element = {<OrdersHistoryByUser />} />
           <Route path = 'products' element = {<ListProducts onAddCart={onAddCart} cartItems = {cartItems}/>}/>
           <Route path = 'pago' element = {<Pago/>}/>
           <Route path= 'help' element = {<HelpPage/>} />

diff --git a/webapp/src/api/ApiUsers.ts b/webapp/src/api/ApiUsers.ts
@@ -81,7 +81,7 @@ export const foundEmail = async (email: String):Promise<boolean> => {
 } 
 
 export async function getUserById(id: string) {
-    const apiEndPoint= process.env.REACT_APP_API_URI || 'http://localhost:5000/'
+    const apiEndPoint= process.env.REACT_APP_API_URI || 'http://localhost:5000'
     let response = await fetch(apiEndPoint+'/user/findById/' + id);
     //The objects returned by the api are directly convertible to User objects
     return response.json()

diff --git a/webapp/src/components/Products.tsx b/webapp/src/components/Products.tsx
@@ -9,7 +9,7 @@ import {v4 as uuidv4} from 'uuid';
 type ProductsProps = {
     product: Product[]
     onAddCart:(prod:Product) => (void);
-    cartItems:Product[]
+    cartItems:Object[]
     homePage: boolean
 }
 

diff --git a/webapp/src/components/navbar/NavBar.tsx b/webapp/src/components/navbar/NavBar.tsx
@@ -6,11 +6,8 @@ import Typography from '@mui/material/Typography';
 import Button from '@mui/material/Button';
 import ShoppingCartIcon from '@mui/icons-material/ShoppingCart';
 import { Menu } from '@mui/material';
-import { MenuItem } from '@mui/material';
-import { AccountCircle } from '@mui/icons-material';
 import Badge from '@mui/material/Badge';
 import { Product } from '../../shared/shareddtypes';
-import Link from '@mui/material/Link';
 import DeleteIcon from '@mui/icons-material/Delete';
 import { Container } from '@mui/material';
 import jwt_decode from 'jwt-decode';
@@ -23,26 +20,33 @@ type ProductsProps = {
 
 const NavBar=(cart:ProductsProps) =>{
     const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
-    const [anchorElb, setAnchorElb] = React.useState<null | HTMLElement>(null);
     const open = Boolean(anchorEl);
-    const openB = Boolean(anchorElb);
     const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
       setAnchorEl(event.currentTarget);
     };
     const handleClose = () => {
       setAnchorEl(null);
     };
-    const handleMenu = (event: React.MouseEvent<HTMLElement>) => {
-        setAnchorElb(event.currentTarget);
-    };
-    const handleCloseMenu = () => {
-        setAnchorElb(null);
-    };
+
     var totalPrice = 0;
     var numOfProducts = 0
     cart.cartItems.map(x => numOfProducts+= x.cantidad);
     cart.cartItems.map(x => totalPrice+= x.cantidad * x.precio);
-    console.log( cart.cartItems)
+    const carrt = localStorage.getItem("carrito");
+    if(carrt !== null){
+        for(let i =0;  i < JSON.parse(carrt).length; i++){
+            cart.cartItems[i] = {
+                nombre: JSON.parse(carrt)[i]['nombre'],
+                codigo: JSON.parse(carrt)[i]['codigo'],
+                descripcion: JSON.parse(carrt)[i]['descripcion'],
+                precio: JSON.parse(carrt)[i]['precio'],
+                cantidad: JSON.parse(carrt)[i]['cantidad'],
+                url: JSON.parse(carrt)[i]['url'],
+                stock: JSON.parse(carrt)[i]['stock'],
+                categoria: JSON.parse(carrt)[i]['categoria'],
+            }
+        }
+    }
 
     function mover(){
         localStorage.setItem("carrito", JSON.stringify(cart.cartItems));
@@ -54,8 +58,10 @@ const NavBar=(cart:ProductsProps) =>{
         if(index > -1){
             if(cart.cartItems[index].cantidad > 1){
                 cart.cartItems[index].cantidad = cart.cartItems[index].cantidad -1 ;
+                localStorage.setItem("carrito",JSON.stringify(cart.cartItems));
             } else{
                 cart.cartItems.splice(index);
+                localStorage.setItem("carrito",JSON.stringify(cart.cartItems));
             }
         } 
     }
@@ -68,7 +74,7 @@ const NavBar=(cart:ProductsProps) =>{
     const cerrarSesion = () => {
         Swal.fire({
             title: '¿Quieres cerrar sesión?',
-            text: "Se perderan los productos que teine en el carrito",
+            text: "Se perderan los productos que tiene en el carrito",
             icon: 'warning',
             showCancelButton: true,
             confirmButtonColor: '#3085d6',
@@ -103,7 +109,7 @@ const NavBar=(cart:ProductsProps) =>{
               </Typography>
               <Button color="inherit" href = "/">Inicio</Button>
               <Button color="inherit" href = "/products">Productos</Button>
-              <Button color="inherit" href = "/admin/addProduct">Mis pedidos</Button>
+              <Button color="inherit" href = "user/orderHistory">Mis pedidos</Button>
               <Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
               </Typography>
 
@@ -166,38 +172,6 @@ const NavBar=(cart:ProductsProps) =>{
                         </Container>
                         </div>)}
                 </Menu>
-                <IconButton
-                    id="basic-button"
-                    aria-label="account of current user"
-                    aria-controls="menu-appbar"
-                    aria-haspopup="true"
-                    onClick={handleMenu}
-                    color = "inherit"
-                >
-                    <AccountCircle />
-                </IconButton>
-                <Menu
-                    id="menu-appbar"
-                    anchorEl={anchorElb}
-                    anchorOrigin={{
-                    vertical: 'top',
-                    horizontal: 'right',
-                    }}
-                    keepMounted
-                    transformOrigin={{
-                    vertical: 'top',
-                    horizontal: 'right',
-                    }}
-                    open={openB}
-                    onClose={handleCloseMenu}
-                >
-                    <Link href="/user/profile" underline="none"style={{color:"#000000"}}>
-                        <MenuItem onClick={handleClose}>Perfil</MenuItem>
-                    </Link>
-                    <Link id= "historialVentas" href="/user/orderHistory" underline="none"style={{color:"#000000"}}>
-                        <MenuItem onClick={handleClose}>Historial de Pedidos</MenuItem>
-                    </Link>
-                </Menu>
 
                 <Button onClick={() => cerrarSesion()} color="inherit">Cerrar Sesión</Button> 
             </Toolbar>     

diff --git a/webapp/src/components/navbar/NavBarAdmin.tsx b/webapp/src/components/navbar/NavBarAdmin.tsx
@@ -6,11 +6,8 @@ import Typography from '@mui/material/Typography';
 import Button from '@mui/material/Button';
 import ShoppingCartIcon from '@mui/icons-material/ShoppingCart';
 import { Menu } from '@mui/material';
-import { MenuItem } from '@mui/material';
-import { AccountCircle } from '@mui/icons-material';
 import Badge from '@mui/material/Badge';
 import { Product } from '../../shared/shareddtypes';
-import Link from '@mui/material/Link';
 import DeleteIcon from '@mui/icons-material/Delete';
 import { Container } from '@mui/material';
 import Swal from 'sweetalert2';
@@ -21,27 +18,19 @@ type ProductsProps = {
 
 const NavBarAdmin = (cart:ProductsProps) => {
     const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
-    const [anchorElb, setAnchorElb] = React.useState<null | HTMLElement>(null);
     const open = Boolean(anchorEl);
-    const openB = Boolean(anchorElb);
     const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
       setAnchorEl(event.currentTarget);
     };
     const handleClose = () => {
       setAnchorEl(null);
     };
-    const handleMenu = (event: React.MouseEvent<HTMLElement>) => {
-        setAnchorElb(event.currentTarget);
-    };
-    const handleCloseMenu = () => {
-        setAnchorElb(null);
-    };
     var totalPrice = 0;
     var numOfProducts = 0
     cart.cartItems.map(x => numOfProducts+= x.cantidad);
     cart.cartItems.map(x => totalPrice+= x.cantidad * x.precio);
 
-    const carrt = localStorage.getItem("cart");
+    const carrt = localStorage.getItem("carrito");
     if(carrt !== null){
         for(let i =0;  i < JSON.parse(carrt).length; i++){
             cart.cartItems[i] = {
@@ -62,8 +51,10 @@ const NavBarAdmin = (cart:ProductsProps) => {
         if(index > -1){
             if(cart.cartItems[index].cantidad > 1){
                 cart.cartItems[index].cantidad = cart.cartItems[index].cantidad -1 ;
+                localStorage.setItem("carrito",JSON.stringify(cart.cartItems));
             } else{
-                cart.cartItems.splice(index);
+                cart.cartItems.splice(index,1);
+                localStorage.setItem("carrito",JSON.stringify(cart.cartItems));
             }
         } 
     }
@@ -112,6 +103,7 @@ const NavBarAdmin = (cart:ProductsProps) => {
                         <Typography variant="h6" component="div" sx={{ mr: 2, display: { xs: 'none', md: 'flex' } }}>DeDe</Typography>
                         <Button aria-label ='Inicio' color="inherit" href = "/">Inicio</Button>
                         <Button color="inherit" onClick={() => goTo()}>Productos</Button>
+                        <Button color="inherit" href = "user/orderHistory">Mis pedidos</Button>
                         <Button color="inherit" href = "/admin/addProduct">Añadir Productos</Button>
                         <Button color="inherit" href = "/admin/manageProducts">Administrar Productos</Button>
                         <Button color="inherit" href = "/admin/manageOrders">Administrar Pedidos</Button>
@@ -176,38 +168,6 @@ const NavBarAdmin = (cart:ProductsProps) => {
                         </Container>
                         </div>)}
                 </Menu>
-                <IconButton
-                    id="basic-button"
-                    aria-label="account of current user"
-                    aria-controls="menu-appbar"
-                    aria-haspopup="true"
-                    onClick={handleMenu}
-                    color = "inherit"
-                >
-                    <AccountCircle />
-                </IconButton>
-                <Menu
-                    id="menu-appbar"
-                    anchorEl={anchorElb}
-                    anchorOrigin={{
-                    vertical: 'top',
-                    horizontal: 'right',
-                    }}
-                    keepMounted
-                    transformOrigin={{
-                    vertical: 'top',
-                    horizontal: 'right',
-                    }}
-                    open={openB}
-                    onClose={handleCloseMenu}
-                >
-                    <Link href="/user/profile" underline="none"style={{color:"#000000"}}>
-                        <MenuItem onClick={handleClose}>Perfil</MenuItem>
-                    </Link>
-                    <Link href="/user/orderHistory" underline="none"style={{color:"#000000"}}>
-                        <MenuItem onClick={handleClose}>Historial de Ventas</MenuItem>
-                    </Link>
-                </Menu>
 
                 <Button onClick={() => cerrarSesion()} color="inherit">Cerrar Sesión</Button> 
             </Toolbar>     

diff --git a/webapp/src/pages/Home.tsx b/webapp/src/pages/Home.tsx
@@ -9,7 +9,7 @@ import Typography from '@mui/material/Typography';
 
 type ProductsProps = {
     onAddCart:(prod:Product) => (void);
-    cartItems:Product[]
+    cartItems:Object[]
 }
 
 function cargarBanner(){

diff --git a/webapp/src/pages/Pago.tsx b/webapp/src/pages/Pago.tsx
@@ -88,7 +88,7 @@ const Pago: FC = () => {
             || tarjeta.length < 16 || tarjeta.length > 16 || cvv.length > 3 || cvv.length < 3){
              Swal.fire({
                   title: "Creedenciales incorrectos",
-                 text: "Los campos introducidos son incorrectos",
+                 text: "Los campos introducidos son incorrectos. Numero de tarjeta debe ser de 16 números seguidos, CVV de 3 números" ,
                     icon: "error",
              });
         } else {
@@ -105,7 +105,7 @@ const Pago: FC = () => {
             Swal.fire({
                 title: "Precio Final",
                 text: "El precio de los articulos es de " + parseado + " tras la suma" + 
-                        " con el precio de envío de " + envio + ". El precio Final que se " + 
+                        " con el precio de envío de " + envio + ". Tras realizar los calculos con el IVA (21%), el precio Final que se " + 
                         " deberá abonar es de: " + (precioFinal*1.21).toFixed(2), 
                 icon: "warning",
                 confirmButtonColor: '#3085d6',
@@ -272,13 +272,13 @@ const Pago: FC = () => {
                             />
 
                             <Typography>
-                                Dirección de envío, por favor ingrese el nombre de su POD
+                                Introduzca su Inrupt ID para poder seleccionar la direccion de envío
                             </Typography>
                             <TextField 
                                 id = "pod"
                                 required
                                 name = "Dirección de Envío"
-                                label = "Dirección de Envío"
+                                label = "WebId"
                                 value = {webId}
                                 error = {checkParams(webId) && pulse}
                                 helperText={checkParams(webId) && pulse ? 'La direccion no puede estar vacía' : ''}