Skip to content

Commit d0dcbbb

Browse files
MarlonPerez-01MarlonPerez-01
committed
un commit mas
1 parent f95c102 commit d0dcbbb

2 files changed

Lines changed: 167 additions & 7 deletions

File tree

‎frontend/src/components/ventas/Ventas.jsx‎

Lines changed: 166 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,170 @@
11
import React from 'react';
2-
import Header from '../Header';
2+
import Platos from './Platos';
3+
import {useState, useEffect} from 'react';
34

45
const Ventas = () => {
5-
return (<>
6-
<Header />
7-
<h1>Desde Ventas</h1>
8-
</>);
9-
};
6+
7+
const [nombres, setNombres] = useState('');
8+
const [apellidos, setApellidos] = useState('');
9+
//creo un detalle sin nada
10+
const detalleEnBlanco = { id_plato: '', cantidad: '' };
11+
//asigno detalle en blanco como default
12+
const [DetallesVenta, setDetallesState] = useState([
13+
{...detalleEnBlanco},
14+
]);
15+
/*const platosEnBlanco = { id_plato: 300,
16+
nombre: 'menu',
17+
precio: 0 };*/
18+
const [platos, setPlatos] = useState([ ]);
19+
const [total, setTotal] = useState(0);
20+
1021

11-
export default Ventas;
22+
//agrega los platos de la base al estado platos
23+
useEffect(() => {
24+
25+
const getPlatos = async () => {
26+
const platosServidor = await fetchPlatos();
27+
setPlatos(platosServidor);
28+
}
29+
30+
getPlatos();
31+
32+
}, []);
33+
34+
//traer total
35+
36+
37+
38+
39+
40+
//funcion para agregar un nuevo detalle en blanco ademas que los que ya estan
41+
const agregarDetalle = () => {
42+
setDetallesState([...DetallesVenta, {...detalleEnBlanco}]);
43+
}
44+
45+
const detallesChange = (e) => {
46+
//crea una copia del estado con todos los detalles hasta el momento
47+
const detallesActualizados = [...DetallesVenta];
48+
//uso e.target.dataset.idx para seleccionar el elemnto correcto del array, e.target.className para decir que campo del elemnto modificar
49+
detallesActualizados[e.target.dataset.idx][e.target.className] = e.target.value;
50+
//console.log(detallesActualizados[e.target.dataset.idx]);
51+
//sobreescribe el estado con los cambios
52+
setDetallesState(detallesActualizados);
53+
};
54+
55+
//para borrado
56+
const eEntrada = (e) => {
57+
//hace una copia en limpio de todo el estado hasta ahora
58+
const todosLosDetalles = [...DetallesVenta];
59+
//console.log(e.target.getAttribute("id"));
60+
//obtienen el index del elemento que quiero eliminar
61+
const index = e.target.getAttribute("id");
62+
//remueve dicho index de mi copia del estado
63+
todosLosDetalles.splice(index, 1);
64+
//sobreescribe el estado con mi copia
65+
setDetallesState(todosLosDetalles);
66+
}
67+
68+
//agregar a base
69+
70+
const agregarventas = async (venta) => {
71+
72+
const res = await fetch('http://localhost:8080/ventas', {
73+
method: 'POST',
74+
headers: {
75+
'Content-type': 'application/json',
76+
'x-auth-token': 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c3VhcmlvIjp7ImlkX3VzdWFyaW8iOjEsImlkX2VtcGxlYWRvIjoxLCJpZF90aXBvX3VzdWFyaW8iOjEsIm5vbWJyZV90aXBvX3VzdWFyaW8iOiJjYWplcm8ifSwiaWF0IjoxNjIxMTM0MTMyLCJleHAiOjE2MjE0OTQxMzJ9.mf-IxfI-fCzkCHm4hrRn5e6tIrGTV9u1anC3BE9yMv0'
77+
},
78+
body: JSON.stringify(venta)
79+
})
80+
const data = await res.json();
81+
//console.log(data.data);
82+
return data.data;
83+
}
84+
85+
//traer platos de la base(peque;o problema aqui porque hay que pasar el token del chef, talves dejar ruta platos publica? de todas fromas es el menu)
86+
87+
const fetchPlatos = async () => {
88+
const res = await fetch('http://localhost:8080/platos', {
89+
method: 'GET',
90+
headers: {
91+
'Content-type': 'application/json',
92+
'x-auth-token': 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c3VhcmlvIjp7ImlkX3VzdWFyaW8iOjIsImlkX2VtcGxlYWRvIjozLCJpZF90aXBvX3VzdWFyaW8iOjMsIm5vbWJyZV90aXBvX3VzdWFyaW8iOiJjaGVmIn0sImlhdCI6MTYyMTIwODg1MSwiZXhwIjoxNjIxNTY4ODUxfQ.QgkdcOKlOr6QUXhIRBk0D_ZuKzmRdfapGHa0o4U1dTo'
93+
}
94+
});
95+
const data = await res.json();
96+
//nuestra respuesta regresa un mensaje y un array
97+
return data.data;
98+
}
99+
100+
let info = 0;
101+
102+
const onSubmit = async (e) => {
103+
e.preventDefault();
104+
//console.log(detalles);
105+
//console.log(res);
106+
//espero a que se popule info con await
107+
info = await agregarventas({nombres, apellidos, DetallesVenta});
108+
//seteo total con el return de info
109+
setTotal(info);
110+
}
111+
112+
113+
return (
114+
115+
<form onSubmit={onSubmit}>
116+
<label htmlFor="nombres">nombres</label>
117+
<input type="text" name="nombres" id="nombres" value={nombres} onChange={(e) => setNombres(e.target.value)} />
118+
<label htmlFor="apellidos">apellidos</label>
119+
<input type="text" name="apellidos" id="apellidos" value={apellidos} onChange={(e) => setApellidos(e.target.value) } />
120+
<input type="button" value="Agregar nuevo detalle" onClick={agregarDetalle} />
121+
{
122+
DetallesVenta.map((val, idx) => {
123+
const id = `id-${idx}`;
124+
const cantidadId = `cantidad-${idx}`;
125+
const borradoId = idx;
126+
return (
127+
<div key={`detalle-${idx}`}>
128+
<label htmlFor={id}>{`id #${idx + 1}`}</label>
129+
<select
130+
type="text"
131+
name={id}
132+
data-idx={idx}
133+
id={id}
134+
className="id_plato"
135+
value={DetallesVenta[idx].id_plato}
136+
onChange={detallesChange}
137+
>
138+
<option selected value="0">menu</option>
139+
{platos.map((plato) => (
140+
<option key={Math.floor(Math.random() * 10000) + 1} value={plato.id_plato}>{plato.nombre}</option>
141+
))}
142+
143+
</select>
144+
<label htmlFor={cantidadId}>Cantidad</label>
145+
<input
146+
type="text"
147+
name={cantidadId}
148+
data-idx={idx}
149+
id={cantidadId}
150+
className="cantidad"
151+
value={DetallesVenta[idx].cantidad}
152+
onChange={detallesChange}
153+
/>
154+
<label htmlFor="precio">Precio</label>
155+
<label>{!DetallesVenta[idx].id_plato ? 'nada' : platos[DetallesVenta[idx].id_plato - 1].precio}</label>
156+
<label htmlFor="enInventario">En Inventario</label>
157+
<label>{!DetallesVenta[idx].id_plato ? 'nada' : platos[DetallesVenta[idx].id_plato - 1].cantidad_disponible}</label>
158+
<label data-idx={idx} id={borradoId} onClick={eEntrada} >X</label>
159+
</div>
160+
);
161+
})
162+
}
163+
<input type="submit" value="Submit" />
164+
<label htmlFor="total">{total == 0 ? 'su total es: 0' : `su total es de ${total.total}`}</label>
165+
</form>
166+
167+
)
168+
}
169+
170+
export default Ventas;

‎frontend/src/helper/fetchPlatos.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ export const insertar = async (plato) => {
2929
return err;
3030
}
3131
};
32+
3233
export const editar = async (plato_edit) => {
3334
try {
3435
const res = await fetch(

0 commit comments

Comments
 (0)