Skip to content

Commit

Permalink
Categorías terminado
Browse files Browse the repository at this point in the history
  • Loading branch information
@mariolada
mariolada committed May 1, 2022
1 parent 9fbc933 commit eb1b10e
Show file tree
Hide file tree
Showing 2 changed files with 232 additions and 9 deletions.
224 changes: 222 additions & 2 deletions webapp/src/App.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -178,10 +178,230 @@ const App = () => {
<Home />
}
/>
<Route path="" element={
<Home />
<Route path="/nostalgia" element={
<div className='page-container'>
<div className='content-wrap'>
<CategoriesBar/>
{
localStorage.getItem("isAdmin")==="true" ? // isAdmin ?
<></>
:
<div >
<Drawer anchor='right' open={cartOpen} onClose={() => setCartOpen(false)}>
<Cart
cartItems={cartItems}
addToCart={handleAddToCart}
removeFromCart={handleRemoveFromCart}
/>
</Drawer>
<StyledButton id="botonCarritoDesplegar" onClick={() => setCartOpen(true)}>
<Badge badgeContent={getTotalItems(cartItems)} color='error'>
<AddShoppingCartIcon fontSize="large" htmlColor='#000000' />
</Badge>
</StyledButton>
</div>
}
<Grid container spacing={3}>
{data?.map(item => {
return item.categoria=="nostalgia"?
<Grid item key={item.id} xs={12} sm={4}>
<Item item={item} handleAddToCart={handleAddToCart} />
</Grid>
:
<></>
})}
</Grid>
</div>
</div>
}
/>

<Route path="/vehiculo" element={
<div className='page-container'>
<div className='content-wrap'>
<CategoriesBar/>
{
localStorage.getItem("isAdmin")==="true" ? // isAdmin ?
<></>
:
<div >
<Drawer anchor='right' open={cartOpen} onClose={() => setCartOpen(false)}>
<Cart
cartItems={cartItems}
addToCart={handleAddToCart}
removeFromCart={handleRemoveFromCart}
/>
</Drawer>
<StyledButton id="botonCarritoDesplegar" onClick={() => setCartOpen(true)}>
<Badge badgeContent={getTotalItems(cartItems)} color='error'>
<AddShoppingCartIcon fontSize="large" htmlColor='#000000' />
</Badge>
</StyledButton>
</div>
}
<Grid container spacing={3}>
{data?.map(item => {
return item.categoria=="vehiculo"?
<Grid item key={item.id} xs={12} sm={4}>
<Item item={item} handleAddToCart={handleAddToCart} />
</Grid>
:
<></>
})}
</Grid>
</div>
</div>
}
/>
<Route path="/peluche" element={
<div className='page-container'>
<div className='content-wrap'>
<CategoriesBar/>
{
localStorage.getItem("isAdmin")==="true" ? // isAdmin ?
<></>
:
<div >
<Drawer anchor='right' open={cartOpen} onClose={() => setCartOpen(false)}>
<Cart
cartItems={cartItems}
addToCart={handleAddToCart}
removeFromCart={handleRemoveFromCart}
/>
</Drawer>
<StyledButton id="botonCarritoDesplegar" onClick={() => setCartOpen(true)}>
<Badge badgeContent={getTotalItems(cartItems)} color='error'>
<AddShoppingCartIcon fontSize="large" htmlColor='#000000' />
</Badge>
</StyledButton>
</div>
}
<Grid container spacing={3}>
{data?.map(item => {
return item.categoria=="peluche"?
<Grid item key={item.id} xs={12} sm={4}>
<Item item={item} handleAddToCart={handleAddToCart} />
</Grid>
:
<></>
})}
</Grid>
</div>
</div>
}
/>
<Route path="/musical" element={
<div className='page-container'>
<div className='content-wrap'>
<CategoriesBar/>
{
localStorage.getItem("isAdmin")==="true" ? // isAdmin ?
<></>
:
<div >
<Drawer anchor='right' open={cartOpen} onClose={() => setCartOpen(false)}>
<Cart
cartItems={cartItems}
addToCart={handleAddToCart}
removeFromCart={handleRemoveFromCart}
/>
</Drawer>
<StyledButton id="botonCarritoDesplegar" onClick={() => setCartOpen(true)}>
<Badge badgeContent={getTotalItems(cartItems)} color='error'>
<AddShoppingCartIcon fontSize="large" htmlColor='#000000' />
</Badge>
</StyledButton>
</div>
}
<Grid container spacing={3}>
{data?.map(item => {
return item.categoria=="musical"?
<Grid item key={item.id} xs={12} sm={4}>
<Item item={item} handleAddToCart={handleAddToCart} />
</Grid>
:
<></>
})}
</Grid>
</div>
</div>
}
/>
<Route path="/bebes" element={
<div className='page-container'>
<div className='content-wrap'>
<CategoriesBar/>
{
localStorage.getItem("isAdmin")==="true" ? // isAdmin ?
<></>
:
<div >
<Drawer anchor='right' open={cartOpen} onClose={() => setCartOpen(false)}>
<Cart
cartItems={cartItems}
addToCart={handleAddToCart}
removeFromCart={handleRemoveFromCart}
/>
</Drawer>
<StyledButton id="botonCarritoDesplegar" onClick={() => setCartOpen(true)}>
<Badge badgeContent={getTotalItems(cartItems)} color='error'>
<AddShoppingCartIcon fontSize="large" htmlColor='#000000' />
</Badge>
</StyledButton>
</div>
}
<Grid container spacing={3}>
{data?.map(item => {
return item.categoria=="bebes"?
<Grid item key={item.id} xs={12} sm={4}>
<Item item={item} handleAddToCart={handleAddToCart} />
</Grid>
:
<></>
})}
</Grid>
</div>
</div>
}
/>
<Route path="/otros" element={
<div className='page-container'>
<div className='content-wrap'>
<CategoriesBar/>
{
localStorage.getItem("isAdmin")==="true" ? // isAdmin ?
<></>
:
<div >
<Drawer anchor='right' open={cartOpen} onClose={() => setCartOpen(false)}>
<Cart
cartItems={cartItems}
addToCart={handleAddToCart}
removeFromCart={handleRemoveFromCart}
/>
</Drawer>
<StyledButton id="botonCarritoDesplegar" onClick={() => setCartOpen(true)}>
<Badge badgeContent={getTotalItems(cartItems)} color='error'>
<AddShoppingCartIcon fontSize="large" htmlColor='#000000' />
</Badge>
</StyledButton>
</div>
}
<Grid container spacing={3}>
{data?.map(item => {
return item.categoria=="otros"?
<Grid item key={item.id} xs={12} sm={4}>
<Item item={item} handleAddToCart={handleAddToCart} />
</Grid>
:
<></>
})}
</Grid>
</div>
</div>
}
/>

<Route path="/productos" element={
<div className='page-container'>
<div className='content-wrap'>
Expand Down
17 changes: 10 additions & 7 deletions webapp/src/PayForm/CategoriesBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import React from 'react';
import { Link } from '@mui/material';
import styled from 'styled-components';
import './categories.css';
import { Juguete } from '../shared/sharedJuguete';
const NavigationWrapper = styled.nav`
display: flex;
width: 70%;
Expand All @@ -22,17 +23,19 @@ const Separator = styled.div`
background-color: #d3707c;
`


const CategoriesBar = ()=> {
let juguetes:Juguete[];

return(
<>
<NavigationWrapper>
<StyledLink className="linkCategorie" href="/juguete/categoria/nostalgia">Nostalgia</StyledLink>
<StyledLink className="linkCategorie" href="/juguete/categoria/nostalgia">Vehiculos</StyledLink>
<StyledLink className="linkCategorie" href="/juguete/categoria/nostalgia">Aire libre</StyledLink>
<StyledLink className="linkCategorie" href="/juguete/categoria/nostalgia">Algo</StyledLink>
<StyledLink className="linkCategorie" href="/juguete/categoria/nostalgia">Otros</StyledLink>
<StyledLink className="linkCategorie" href="/productos">Productos</StyledLink>
<StyledLink className="linkCategorie" href="/nostalgia" >Nostalgia</StyledLink>
<StyledLink className="linkCategorie" href="/vehiculo">Vehiculos</StyledLink>
<StyledLink className="linkCategorie" href="/musical">Musicales</StyledLink>
<StyledLink className="linkCategorie" href="/peluche">Peluche</StyledLink>
<StyledLink className="linkCategorie" href="/bebes">Bebés</StyledLink>
<StyledLink className="linkCategorie" href="/otros">Otros</StyledLink>

</NavigationWrapper>
<Separator/>
</>
Expand Down

0 comments on commit eb1b10e

Please sign in to comment.