borcsokistvanmilan/PeePal
1
0
Fork 0
forked from magonysandormate/PeePal
Code Pull Requests Activity

Kész mosdó hozzáadás

Browse Source
This commit is contained in:
Sándor Máté Magony
2025-04-08 11:17:41 +02:00
parent 62b54d4ab4
commit cc7c8bc8dd
12 changed files with 169 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/peepal_react/package-lock.json generated
View File

@@ -18,6 +18,7 @@
"lucide-react": "^0.479.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-icons": "^5.5.0",
"react-router-dom": "^7.1.5",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
@@ -14385,6 +14386,15 @@
"integrity": "sha512-SN/U6Ytxf1QGkw/9ve5Y+NxBbZM6Ht95tuXNMKs8EJyFa/Vy/+Co3stop3KBHARfn/giv+Lj1uUnTfOJ3moFEQ==",
"license": "MIT"
},
"node_modules/react-icons": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.5.0.tgz",
"integrity": "sha512-MEFcXdkP3dLo8uumGI5xN3lDFNsRtrjbOEKDLD7yv76v4wpnEq2Lt2qeHaQOr34I/wPN3s3+N08WkQ+CW37Xiw==",
"license": "MIT",
"peerDependencies": {
"react": "*"
}
},
"node_modules/react-is": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",

1
frontend/peepal_react/package.json
View File

@@ -13,6 +13,7 @@
"lucide-react": "^0.479.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-icons": "^5.5.0",
"react-router-dom": "^7.1.5",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"

2
frontend/peepal_react/src/WC_Komponens/Bejel_Regisz/Bejelentkezes.jsx
View File

@@ -35,7 +35,7 @@ export default function Bejelentkezes() {
return (
<div className="flex justify-center items-center min-h-screen bg-gray-100">
<div className="flex justify-center items-center min-h-screen bg-yellow-100">
<form className="bg-white p-6 rounded-lg shadow-lg w-80 space-y-4">
<h2 className="text-2xl font-bold text-center">Bejelentkezés</h2>

2
frontend/peepal_react/src/WC_Komponens/Bejel_Regisz/Regisztracio.jsx
View File

@@ -1,6 +1,6 @@
export default function Regisztracio() {
return (
<div className="flex justify-center items-center min-h-screen bg-gray-100">
<div className="flex justify-center items-center min-h-screen bg-yellow-100">
<form className="bg-white p-6 rounded-lg shadow-lg w-96 space-y-4">
<h2 className="text-2xl font-bold text-center">Regisztráció</h2>

11
frontend/peepal_react/src/WC_Komponens/Budi_Blokk/Csempe.jsx
View File

@@ -1,4 +1,5 @@
import React, { useState, useEffect } from "react";
import { TfiWheelchair } from "react-icons/tfi";
import { mosdokFetch } from "../../apiFetch";
export default function Csempe() {
@@ -44,15 +45,7 @@ export default function Csempe() {
<p><span className="font-medium text-gray-800">Ár:</span> {mosdo.ar} Ft</p>
<p><span className="font-medium text-gray-800">Nyitvatartás:</span> {mosdo.nyitva}</p>
</div>
{mosdo.akadalym && (
<img
width="32"
height="32"
src="https://img.icons8.com/ios-filled/50/wheelchair.png"
alt="wheelchair"
className="absolute bottom-10 right-10"
/>
)}
{mosdo.akadalym === 1 ? <TfiWheelchair className="absolute bottom-10 right-10 w-8 h-8"/> : ""}
<a
href={mosdo.utvonal}
target="_blank"

112
frontend/peepal_react/src/WC_Komponens/Hozzadas/HozzaadForm.jsx
View File

@@ -1,4 +1,55 @@
import React, { useState, useEffect } from "react";
import { useNavigate } from "react-router-dom";
export default function HozzaadForm() {
const [nev, setNev] = useState("");
const [kerulet, setKerulet] = useState("");
const [kozeli_megall, setKozeli] = useState("");
const [akadalym, setAkadalym] = useState(false);
const [ar, setAr] = useState("");
const [nyitva, setNyitva] = useState("");
const [utvonal, setUtvonal] = useState("");
const [koordinatak, setKoordinatak] = useState("");
const navigate = useNavigate();
const handleSubmit = (event) => {
event.preventDefault();
const wcInfo = {
nev: nev,
kerulet: kerulet,
kozeli_megall: kozeli_megall,
akadalym: akadalym,
ar: ar,
nyitva: nyitva,
utvonal: utvonal,
koordinatak: koordinatak
}
fetch("http://localhost:8000/api/hozzaadas", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(wcInfo)
})
.then((response) => response.json())
.then((newWC) => {
setNev("");
setKerulet("");
setKozeli("");
setAkadalym(false);
setAr("");
setNyitva("");
setUtvonal("");
setKoordinatak("");
navigate("/");
})
.catch((error) => {
console.log(error);
})
}
const ToolTip = ({children, text}) => {
return(
<div className="relative group">
@@ -11,43 +62,61 @@ export default function HozzaadForm() {
)
}
return (
<div className="flex justify-center items-center min-h-screen bg-gray-100">
<form className="bg-white p-6 rounded-lg shadow-lg w-96 space-y-4">
<div className="flex justify-center items-center min-h-screen bg-yellow-100">
<form
onSubmit={handleSubmit}
className="bg-white p-6 rounded-lg shadow-lg w-96 space-y-4"
>
<h2 className="text-2xl font-bold text-center">Adjon hozzá nyilvános mosdót, ha nem találja az oldalon</h2>
<label className="block text-gray-700">Mosdó neve:</label>
<input
type="text"
type="text"
name="nev"
value={nev}
onChange={(event) => setNev(event.target.value)}
placeholder="Mosdó neve"
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
<label className="block text-gray-700">Kerület:</label>
<input
type="text"
type="text"
name="kerulet"
value={kerulet}
onChange={(event) => setKerulet(event.target.value)}
placeholder="Kerület"
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
<label className="block text-gray-700">Legközelebbi megálló:</label>
<input
type="text"
type="text"
name="kozeli_megall"
value={kozeli_megall}
onChange={(event) => setKozeli(event.target.value)}
placeholder="Legközelebbi megálló"
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
<label className="block text-gray-700">Ár:</label>
<input
type="text"
placeholder="Ár"
type="number"
name="ar"
value={ar}
onChange={(event) => setAr(event.target.value)}
placeholder="Ár (HUF)"
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
<label className="block text-gray-700">Nyitvatartás:</label>
<input
type="text"
name="nyitva"
value={nyitva}
onChange={(event) => setNyitva(event.target.value)}
placeholder="Nyitvatartás (Óra:Perc-Óra:Perc)"
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
@@ -56,11 +125,27 @@ export default function HozzaadForm() {
<legend className="block text-gray-700">Akadálymentes:</legend>
<div className="flex space-x-4 mt-2">
<label className="flex items-center">
<input type="radio" id="igen" name="akadalymentes" value="igen" className="mr-2" />
<input
type="radio"
id="igen"
name="akadalym"
value="igen"
checked={akadalym === true}
onChange={() => setAkadalym(true)}
className="mr-2"
/>
Igen
</label>
<label className="flex items-center">
<input type="radio" id="nem" name="akadalymentes" value="nem" className="mr-2" />
<input
type="radio"
id="nem"
name="akadalym"
value="nem"
checked={akadalym === false}
onChange={() => setAkadalym(false)}
className="mr-2"
/>
Nem
</label>
</div>
@@ -72,6 +157,9 @@ export default function HozzaadForm() {
</div>
<input
type="text"
name="utvonal"
value={utvonal}
onChange={(event) => setUtvonal(event.target.value)}
placeholder="Útvonal link"
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
@@ -83,12 +171,14 @@ export default function HozzaadForm() {
</div>
<input
type="text"
name="koordinatak"
value={koordinatak}
onChange={(event) => setKoordinatak(event.target.value)}
placeholder="Koordináták"
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
<button
type="submit"
className="w-full bg-yellow-600 text-white py-2 rounded-lg hover:bg-yellow-700 transition">
Hozzáadás
</button>

13
frontend/peepal_react/src/WC_Komponens/Kereso/Legkozelebbi.jsx
View File

@@ -1,4 +1,5 @@
import React, { useState, useEffect } from 'react';
import { TfiWheelchair } from "react-icons/tfi";
import { mosdokFetch } from '../../apiFetch';
// Haversine formula to calculate distance between two coordinates
@@ -118,15 +119,7 @@ export default function LegkozelebbiMosdo() {
</a>
</div>
{nearestRestroom.akadalym && (
<img
width="32"
height="32"
src="https://img.icons8.com/ios-filled/50/wheelchair.png"
alt="wheelchair"
className="absolute bottom-10 right-10"
/>
)}
{nearestRestroom.akadalym === 1 ? <TfiWheelchair className="absolute bottom-10 right-10 w-8 h-8"/> : ""}
</div>
</div>
);
@@ -134,7 +127,7 @@ export default function LegkozelebbiMosdo() {
// Default render (before location permission)
return (
<div className="flex flex-col items-center justify-center h-screen bg-gray-100">
<div className="flex flex-col items-center justify-center h-screen bg-yellow-100">
<div className="bg-white p-6 rounded-lg shadow-lg w-80 space-y-4 text-center">
<h2 className="text-xl font-bold">Helyzetmeghatározás</h2>
<p className="text-gray-700">Engedélyezed a helyzetmeghatározást?</p>