Ismail/nodeMap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

POI hinzufügen statt Station hinzufügen im Konext Menü und im Button

Browse Source
This commit is contained in:
ISA
2024-05-21 07:04:10 +02:00
parent 6dbd856380
commit e1c3e36933
3 changed files with 16 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
components/MapComponent.js
View File

@@ -210,7 +210,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
loadData(); loadData();
}; };
// Kontextmenü Callback für "Station hinzufügen" // Kontextmenü Callback für "POI hinzufügen"
const addStationCallback = (event) => { const addStationCallback = (event) => {
setPopupCoordinates(event.latlng); // Koordinaten des Klicks verwenden setPopupCoordinates(event.latlng); // Koordinaten des Klicks verwenden
setShowPopup(true); // Popup öffnen setShowPopup(true); // Popup öffnen
@@ -240,7 +240,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
}, },
"-", // Divider "-", // Divider
{ {
text: "Station hinzufügen", text: "POI hinzufügen",
icon: "img/add_station.png", icon: "img/add_station.png",
className: "background-red", className: "background-red",
callback: addStationCallback, callback: addStationCallback,
@@ -748,7 +748,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
// Rufe hier Funktionen auf, die eine initialisierte Karte benötigen. // Rufe hier Funktionen auf, die eine initialisierte Karte benötigen.
}); });
} }
console.log("trigger in MapComponent.js:", poiReadTrigger); //console.log("trigger in MapComponent.js:", poiReadTrigger);
}, [mapRef, map, poiReadTrigger]); // Prüfe die Abhängigkeiten sorgfältig }, [mapRef, map, poiReadTrigger]); // Prüfe die Abhängigkeiten sorgfältig
// poiTyp Daten hinzufügen // poiTyp Daten hinzufügen
@@ -765,10 +765,10 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
console.error("Fehler beim Abrufen der poiTyp Daten:", error); console.error("Fehler beim Abrufen der poiTyp Daten:", error);
} }
}; };
console.log( /* console.log(
"trigger in MapComponent.js in fetchPoiTypData:", "trigger in MapComponent.js in fetchPoiTypData:",
poiReadTrigger poiReadTrigger
); ); */
fetchPoiTypData(); fetchPoiTypData();
}, []); }, []);
@@ -1615,12 +1615,11 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
}, [map, zoomTrigger]); }, [map, zoomTrigger]);
//--------------------------------------------------------- //---------------------------------------------------------
useEffect(() => { /* useEffect(() => {
console.log("Aktualisierung in MapComponent.js:", poiReadTrigger); //console.log("Aktualisierung in MapComponent.js:", poiReadTrigger);
// Logik zur Aktualisierung der Map hier hinzufügen // Logik zur Aktualisierung der Map hier hinzufügen
// Beispiel: Daten neu laden oder aktualisieren // Beispiel: Daten neu laden oder aktualisieren
}, [poiReadTrigger]); }, [poiReadTrigger]); */
//--------------------------------------------------------- //---------------------------------------------------------
//--------------------------------------------------------- //---------------------------------------------------------

2
components/ShowAddStationPopup.js
View File

@@ -192,7 +192,7 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => {
type="submit" type="submit"
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded w-full" className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded w-full"
> >
Station hinzufügen POI hinzufügen
</button> </button>
</form> </form>
); );

14
pages/index.js
View File

@@ -1,9 +1,9 @@
// pages/index.js // pages/index.js
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import dynamic from "next/dynamic"; import dynamic from "next/dynamic";
import { useRecoilState , useRecoilValue} from "recoil"; import { useRecoilState, useRecoilValue } from "recoil";
import { readPoiMarkersStore } from "../store/selectors/readPoiMarkersStore"; // Aktualisiert mit atom import { readPoiMarkersStore } from "../store/selectors/readPoiMarkersStore"; // Aktualisiert mit atom
import { poiReadFromDbTriggerAtom } from '../store/atoms/poiReadFromDbTriggerAtom'; import { poiReadFromDbTriggerAtom } from "../store/atoms/poiReadFromDbTriggerAtom";
const MapComponentWithNoSSR = dynamic( const MapComponentWithNoSSR = dynamic(
() => import("../components/MapComponent"), () => import("../components/MapComponent"),
@@ -24,7 +24,7 @@ export default function Home() {
} }
const data = await response.json(); const data = await response.json();
setLocations(data); setLocations(data);
console.log("Geladene Daten in Home.js:", data); //console.log("Geladene Daten in Home.js:", data);
} catch (error) { } catch (error) {
console.error(error.message); console.error(error.message);
} }
@@ -41,7 +41,7 @@ export default function Home() {
// Daten beim Laden der Seite holen // Daten beim Laden der Seite holen
loadData(); loadData();
console.log("poiReadTrigger in Home.js:", poiReadTrigger); //console.log("poiReadTrigger in Home.js:", poiReadTrigger);
}, [poiReadTrigger]); }, [poiReadTrigger]);
const handleAddLocation = async (name, type, lat, lng) => { const handleAddLocation = async (name, type, lat, lng) => {
@@ -71,13 +71,13 @@ export default function Home() {
) )
); );
}; };
//------------------------------------ //------------------------------------
// Daten beim Laden der Seite holen // Daten beim Laden der Seite holen
useEffect(() => { useEffect(() => {
loadData(); loadData();
console.log("poiReadTrigger in Home.js:", poiReadTrigger); //console.log("poiReadTrigger in Home.js:", poiReadTrigger);
}, [poiReadTrigger]); }, [poiReadTrigger]);
//------------------------------------ //------------------------------------
return ( return (
<div> <div>
<MapComponentWithNoSSR <MapComponentWithNoSSR