Kész mosdó hozzáadás

Backend/peepal_backend/app/Http/Controllers/HozzaadasController.php

@@ -24,11 +24,11 @@ class HozzaadasController extends Controller
             'nev' => 'required|string',
             'kerulet' => 'required|string',
             'kozeli_megall' => 'required|string',
-            'akadalym' => 'required|boolean',
+            'akadalym' => 'nullable|boolean',
-            'ar' => 'required|numeric',
+            'ar' => 'nullable|numeric',
-            'nyitva' => 'required|string',
+            'nyitva' => 'nullable|string',
             'utvonal' => 'required|string',
-            'koordinatak' => 'nullable|string'
+            'koordinatak' => 'required|string'
         ]);
 
         try {

Backend/peepal_backend/app/Http/Middleware/Cors.php

@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Http\Middleware;
+
+use Closure;
+use Illuminate\Http\Request;
+
+class Cors
+{
+    public function handle(Request $request, Closure $next)
+    {
+        $response = $next($request);
+        
+        $response->headers->set('Access-Control-Allow-Origin', '*');
+        $response->headers->set('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
+        $response->headers->set('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-Requested-With');
+
+        return $response;
+    }
+}

Backend/peepal_backend/bootstrap/app.php

@@ -12,7 +12,15 @@ return Application::configure(basePath: dirname(__DIR__))
         health: '/up',
     )
     ->withMiddleware(function (Middleware $middleware) {
-        //
+        // Add CORS middleware for API routes
+        $middleware->api([
+            \Illuminate\Http\Middleware\HandleCors::class,
+        ]);
+        
+        // Or if you want to apply CORS to all routes
+        $middleware->append([
+            \Illuminate\Http\Middleware\HandleCors::class,
+        ]);
     })
     ->withExceptions(function (Exceptions $exceptions) {
         //

Backend/peepal_backend/config/cors.php

@@ -0,0 +1,12 @@
+<?php
+
+return [
+    'paths' => ['api/*'],
+    'allowed_methods' => ['*'],
+    'allowed_origins' => ['*'], // For development; restrict to your frontend URL in production
+    'allowed_origins_patterns' => [],
+    'allowed_headers' => ['*'],
+    'exposed_headers' => [],
+    'max_age' => 0,
+    'supports_credentials' => false,
+];

Backend/peepal_backend/database/migrations/2025_04_04_065541_wc_adatok_tablaletrehozas.php

@@ -13,11 +13,11 @@ return new class extends Migration
             $table->string('nev', 250);
             $table->string('kerulet', 250);
             $table->string('kozeli_megall', 250);
-            $table->boolean('akadalym');
+            $table->boolean('akadalym')->nullable();
-            $table->integer('ar');
+            $table->integer('ar')->nullable();
-            $table->string('nyitva', 250);
+            $table->string('nyitva', 250)->nullable();
-            $table->double('hossz_koord')->nullable();
+            $table->double('hossz_koord');
-            $table->double('szel_koord')->nullable();
+            $table->double('szel_koord');
             $table->string('utvonal', 1000);
             $table->timestamps();
         });

frontend/peepal_react/package-lock.json

@@ -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",

frontend/peepal_react/package.json

@@ -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"

frontend/peepal_react/src/WC_Komponens/Bejel_Regisz/Bejelentkezes.jsx

@@ -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>
   

frontend/peepal_react/src/WC_Komponens/Bejel_Regisz/Regisztracio.jsx

@@ -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>
   

frontend/peepal_react/src/WC_Komponens/Budi_Blokk/Csempe.jsx

@@ -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 && (
+                    {mosdo.akadalym === 1 ? <TfiWheelchair className="absolute bottom-10 right-10 w-8 h-8"/> : ""}
-                        <img 
-                            width="32" 
-                            height="32" 
-                            src="https://img.icons8.com/ios-filled/50/wheelchair.png" 
-                            alt="wheelchair" 
-                            className="absolute bottom-10 right-10"
-                        />
-                    )}
                     <a
                         href={mosdo.utvonal}
                         target="_blank"

frontend/peepal_react/src/WC_Komponens/Hozzadas/HozzaadForm.jsx

@@ -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">
@@ -13,13 +64,19 @@ export default function HozzaadForm() {
     }
 
     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">
+            <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"
+                    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"
                 />
@@ -27,6 +84,9 @@ export default function HozzaadForm() {
                 <label className="block text-gray-700">Kerület:</label>
                 <input 
                     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"
                 />
@@ -34,20 +94,29 @@ export default function HozzaadForm() {
                 <label className="block text-gray-700">Legközelebbi megálló:</label>
                 <input 
                     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" 
+                    type="number" 
-                    placeholder="Ár"
+                    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>

frontend/peepal_react/src/WC_Komponens/Kereso/Legkozelebbi.jsx

@@ -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 && (
+        {nearestRestroom.akadalym === 1 ? <TfiWheelchair className="absolute bottom-10 right-10 w-8 h-8"/> : ""}
-          <img 
-            width="32" 
-            height="32" 
-            src="https://img.icons8.com/ios-filled/50/wheelchair.png" 
-            alt="wheelchair" 
-            className="absolute bottom-10 right-10"
-          />
-        )}
       </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>