diff --git a/12.B-2_Férfi_2025.pdf b/12.B-2_Férfi_2025.pdf new file mode 100644 index 0000000..9dc0798 Binary files /dev/null and b/12.B-2_Férfi_2025.pdf differ diff --git a/react_gyak_bevasarlas_bovites.pdf b/react_gyak_bevasarlas_bovites.pdf new file mode 100644 index 0000000..a136238 Binary files /dev/null and b/react_gyak_bevasarlas_bovites.pdf differ diff --git a/src/App.jsx b/src/App.jsx index 8d815a0..a4bab73 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -3,6 +3,8 @@ import reactLogo from './assets/react.svg' import viteLogo from '/vite.svg' import './App.css' import BevasarloLista from './components/BevasarloLista'; +import HozzaAdasForm from './components/HozzaAdasForm'; +import Statisztika from './components/Statisztika'; function App() { const [venniKell, setVenniKell] = useState( @@ -15,14 +17,29 @@ function App() { ); const vetelKezeles = (id, ertek) => { - const ujTomb = venniKell.map(aru => {aru.id==id ? {...aru, megveve: ertek} : aru}) + const ujTomb = venniKell.map(aru => {return aru.id==id ? {...aru, megveve: ertek} : aru}) setVenniKell(ujTomb) } + const hozzaAdas = (elem) => { + console.log(elem) + setVenniKell([...venniKell, elem]) + } + + const elemTorles = (id) => { + const ujTomb = venniKell.filter(aru=>aru.id!=id) + setVenniKell(ujTomb) + } + + const total = venniKell.length + const megvett = venniKell.filter(a => a.megveve).length + return ( <>

Bevásárlólista

- + + + ) } diff --git a/src/components/BevasarloLista.jsx b/src/components/BevasarloLista.jsx index 62836f8..f5546ff 100644 --- a/src/components/BevasarloLista.jsx +++ b/src/components/BevasarloLista.jsx @@ -1,13 +1,13 @@ import React from 'react' import ListaElem from './ListaElem' -const BevasarloLista = ({aruk, vetelk}) => { +const BevasarloLista = ({aruk, vetelk, torlesk}) => { return (
{aruk.map((elem,index) => { //console.log(elem.megveve) return ( - + ) }) } diff --git a/src/components/HozzaAdasForm.jsx b/src/components/HozzaAdasForm.jsx new file mode 100644 index 0000000..9fe6ce5 --- /dev/null +++ b/src/components/HozzaAdasForm.jsx @@ -0,0 +1,30 @@ +import React, {useState} from 'react' + +const HozzaAdasForm = ({hozzaAd}) => { + + const [nev, setNev] = useState("") + const [mennyiseg, setMennyiseg] = useState("") + const [egyseg, setEgyseg] = useState("") + + const hozzaAdKezel = (e) => { + if (nev==="") return + e.preventDefault() + hozzaAd({nev,mennyiseg,egyseg,megjegyzes: "",megveve: false, id: Date.now()}) + setNev("") + setMennyiseg("") + setEgyseg("") + } + + return ( +
+
+ setNev(e.target.value)} placeholder="Név" /> + setMennyiseg(e.target.value)} placeholder="Mennyiség" /> + setEgyseg(e.target.value)} placeholder="Egység" /> + +
+
+ ) +} + +export default HozzaAdasForm \ No newline at end of file diff --git a/src/components/ListaElem.jsx b/src/components/ListaElem.jsx index 491c837..4d8e274 100644 --- a/src/components/ListaElem.jsx +++ b/src/components/ListaElem.jsx @@ -1,23 +1,29 @@ import React, { useState } from 'react' import AruInfo from './AruInfo' import MegveveGomb from './MegveveGomb' +import TorlesGomb from './TorlesGomb' -const ListaElem = ({aru, vetelk}) => { - const [megVetel, setMegvetel] = useState(false) +const ListaElem = ({aru, vetelk, torlesk}) => { + + //const [megVetel, setMegvetel] = useState(false) const kezelVetel = () => { - setMegvetel(elozo => !elozo) - vetelk(aru.id, megVetel) + //setMegvetel(elozo => !elozo) + vetelk(aru.id, !aru.megveve) } + const torlesKezel = () => { + torlesk(aru.id) + } return (
- + +
) } diff --git a/src/components/MegveveGomb.jsx b/src/components/MegveveGomb.jsx index fa0776a..f62e758 100644 --- a/src/components/MegveveGomb.jsx +++ b/src/components/MegveveGomb.jsx @@ -2,11 +2,11 @@ import React from 'react' const MegveveGomb = ({onGomb, megVeve}) => { return ( -
+ <> -
+ ) } diff --git a/src/components/Statisztika.jsx b/src/components/Statisztika.jsx new file mode 100644 index 0000000..977758d --- /dev/null +++ b/src/components/Statisztika.jsx @@ -0,0 +1,29 @@ +import React from 'react' + +const Statisztika = ({total, megvett}) => { + + const megvenni = total-megvett; + + return ( +
+ + + + + + + + + + + + + + + +
Összesen:{total}
Megvett:{megvett}
Beszerzendő:{megvenni}
+
+ ) +} + +export default Statisztika \ No newline at end of file diff --git a/src/components/TorlesGomb.jsx b/src/components/TorlesGomb.jsx new file mode 100644 index 0000000..a360814 --- /dev/null +++ b/src/components/TorlesGomb.jsx @@ -0,0 +1,13 @@ +import React from 'react' + +const TorlesGomb = ({onGomb}) => { + return ( + <> + + + ) +} + +export default TorlesGomb \ No newline at end of file