nagylaszlo/ToDoList
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Navigáció első menet kész

Browse Source
This commit is contained in:
István Priskin
2025-12-08 12:14:18 +01:00
parent 70385e9e1b
commit dc8102b545
9 changed files with 144 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
index.html
View File

@@ -1,13 +1,21 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head>
<meta charset="UTF-8" /> <head>
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<title>bevasarlolista</title> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head> <title>bevasarlolista</title>
<body> <!-- Latest compiled and minified CSS -->
<div id="root"></div> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<script type="module" src="/src/main.jsx"></script>
</body> <!-- Latest compiled JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
</body>
</html> </html>

60
package-lock.json generated
View File

@@ -9,7 +9,8 @@
"version": "0.0.0", "version": "0.0.0",
"dependencies": { "dependencies": {
"react": "^19.2.0", "react": "^19.2.0",
"react-dom": "^19.2.0" "react-dom": "^19.2.0",
"react-router-dom": "^7.10.1"
}, },
"devDependencies": { "devDependencies": {
"@eslint/js": "^9.39.1", "@eslint/js": "^9.39.1",
@@ -1628,6 +1629,19 @@
"dev": true, "dev": true,
"license": "MIT" "license": "MIT"
}, },
"node_modules/cookie": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz",
"integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==",
"license": "MIT",
"engines": {
"node": ">=18"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/express"
}
},
"node_modules/cross-spawn": { "node_modules/cross-spawn": {
"version": "7.0.6", "version": "7.0.6",
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -2526,6 +2540,44 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/react-router": {
"version": "7.10.1",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-7.10.1.tgz",
"integrity": "sha512-gHL89dRa3kwlUYtRQ+m8NmxGI6CgqN+k4XyGjwcFoQwwCWF6xXpOCUlDovkXClS0d0XJN/5q7kc5W3kiFEd0Yw==",
"license": "MIT",
"dependencies": {
"cookie": "^1.0.1",
"set-cookie-parser": "^2.6.0"
},
"engines": {
"node": ">=20.0.0"
},
"peerDependencies": {
"react": ">=18",
"react-dom": ">=18"
},
"peerDependenciesMeta": {
"react-dom": {
"optional": true
}
}
},
"node_modules/react-router-dom": {
"version": "7.10.1",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.10.1.tgz",
"integrity": "sha512-JNBANI6ChGVjA5bwsUIwJk7LHKmqB4JYnYfzFwyp2t12Izva11elds2jx7Yfoup2zssedntwU0oZ5DEmk5Sdaw==",
"license": "MIT",
"dependencies": {
"react-router": "7.10.1"
},
"engines": {
"node": ">=20.0.0"
},
"peerDependencies": {
"react": ">=18",
"react-dom": ">=18"
}
},
"node_modules/resolve-from": { "node_modules/resolve-from": {
"version": "4.0.0", "version": "4.0.0",
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz", "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
@@ -2594,6 +2646,12 @@
"semver": "bin/semver.js" "semver": "bin/semver.js"
} }
}, },
"node_modules/set-cookie-parser": {
"version": "2.7.2",
"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz",
"integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==",
"license": "MIT"
},
"node_modules/shebang-command": { "node_modules/shebang-command": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",

3
package.json
View File

@@ -11,7 +11,8 @@
}, },
"dependencies": { "dependencies": {
"react": "^19.2.0", "react": "^19.2.0",
"react-dom": "^19.2.0" "react-dom": "^19.2.0",
"react-router-dom": "^7.10.1"
}, },
"devDependencies": { "devDependencies": {
"@eslint/js": "^9.39.1", "@eslint/js": "^9.39.1",

18
src/App.jsx
View File

@@ -5,6 +5,8 @@ import './App.css'
import BevasarloLista from './components/BevasarloLista'; import BevasarloLista from './components/BevasarloLista';
import HozzaAdasForm from './components/HozzaAdasForm'; import HozzaAdasForm from './components/HozzaAdasForm';
import Statisztika from './components/Statisztika'; import Statisztika from './components/Statisztika';
import { BrowserRouter, Routes, Route } from 'react-router-dom'
import Fooldal from './components/Fooldal';
function App() { function App() {
/* const [venniKell, setVenniKell] = useState( /* const [venniKell, setVenniKell] = useState(
@@ -51,13 +53,15 @@ function App() {
const megvett = venniKell.filter(a => a.megveve).length const megvett = venniKell.filter(a => a.megveve).length
return ( return (
<> <BrowserRouter>
<h1>Bevásárlólista</h1> <Routes>
<Statisztika total={total} megvett={megvett}/> <Route path='/' element={<Fooldal/>} />
<HozzaAdasForm hozzaAd={hozzaAdas} /> <Route path='/lista' element={<BevasarloLista aruk={venniKell} vetelk={vetelKezeles}
<BevasarloLista aruk={venniKell} vetelk={vetelKezeles} torlesk={elemTorles} elemMod={elemModositas} />} />
torlesk={elemTorles} elemMod={elemModositas} /> <Route path='/stat' element={<Statisztika total={total} megvett={megvett}/>} />
</> <Route path='/hozzaad' element={<HozzaAdasForm hozzaAd={hozzaAdas} />} />
</Routes>
</BrowserRouter>
) )
} }

24
src/components/BevasarloLista.jsx
View File

@@ -1,17 +1,23 @@
import React from 'react' import React from 'react'
import ListaElem from './ListaElem' import ListaElem from './ListaElem'
import Fomenu from './Fomenu'
import { Link } from 'react-router-dom'
const BevasarloLista = ({aruk, vetelk, torlesk, elemMod}) => { const BevasarloLista = ({ aruk, vetelk, torlesk, elemMod }) => {
return ( return (
<div> <>
{aruk.map((elem,index) => { <Fomenu />
//console.log(elem.megveve) <Link to="/">Főoldal</Link>
return ( <div>
<ListaElem key={index} aru={elem} vetelk={vetelk} torlesk={torlesk} elemMod={elemMod}/> {aruk.map((elem, index) => {
) //console.log(elem.megveve)
}) return (
<ListaElem key={index} aru={elem} vetelk={vetelk} torlesk={torlesk} elemMod={elemMod} />
)
})
} }
</div> </div>
</>
) )
} }

14
src/components/Fomenu.jsx Normal file
View File

@@ -0,0 +1,14 @@
import React from 'react'
import { Link } from 'react-router-dom'
const Fomenu = () => {
return (
<nav>
<Link className='btn btn-outline-info mx-3' to="/lista">Lista megjelenítése</Link>
<Link className='btn btn-outline-info mx-3' to="/stat">Statisztika</Link>
<Link className='btn btn-outline-info mx-3' to="/hozzaad">Áru hozzáadása</Link>
</nav>
)
}
export default Fomenu

16
src/components/Fooldal.jsx Normal file
View File

@@ -0,0 +1,16 @@
import React from 'react'
import Fomenu from './Fomenu'
const Fooldal = () => {
return (
<div>
<header>
<h1>Bevásárlólista</h1>
<Fomenu />
</header>
</div>
)
}
export default Fooldal

5
src/components/HozzaAdasForm.jsx
View File

@@ -1,10 +1,13 @@
import React, {useState} from 'react' import React, {useState} from 'react'
import Fomenu from './Fomenu'
import { useNavigate } from 'react-router-dom'
const HozzaAdasForm = ({hozzaAd}) => { const HozzaAdasForm = ({hozzaAd}) => {
const [nev, setNev] = useState("") const [nev, setNev] = useState("")
const [mennyiseg, setMennyiseg] = useState("") const [mennyiseg, setMennyiseg] = useState("")
const [egyseg, setEgyseg] = useState("") const [egyseg, setEgyseg] = useState("")
const oldalvaltas = useNavigate();
const hozzaAdKezel = (e) => { const hozzaAdKezel = (e) => {
if (nev==="") return if (nev==="") return
@@ -13,10 +16,12 @@ const HozzaAdasForm = ({hozzaAd}) => {
setNev("") setNev("")
setMennyiseg("") setMennyiseg("")
setEgyseg("") setEgyseg("")
oldalvaltas("/lista")
} }
return ( return (
<div> <div>
<Fomenu />
<form onSubmit={hozzaAdKezel}> <form onSubmit={hozzaAdKezel}>
<input type="text" value={nev} onChange={(e) => setNev(e.target.value)} placeholder="Név" /> <input type="text" value={nev} onChange={(e) => setNev(e.target.value)} placeholder="Név" />
<input type="text" value={mennyiseg} onChange={(e) => setMennyiseg(e.target.value)} placeholder="Mennyiség" /> <input type="text" value={mennyiseg} onChange={(e) => setMennyiseg(e.target.value)} placeholder="Mennyiség" />

2
src/components/Statisztika.jsx
View File

@@ -1,4 +1,5 @@
import React from 'react' import React from 'react'
import Fomenu from './Fomenu';
const Statisztika = ({total, megvett}) => { const Statisztika = ({total, megvett}) => {
@@ -6,6 +7,7 @@ const Statisztika = ({total, megvett}) => {
return ( return (
<div> <div>
<Fomenu />
<table> <table>
<tbody> <tbody>
<tr> <tr>