-
-
-
-
- 
-
`,
- iconSize: [30, 45],
- iconAnchor: [27, 41],
- popupAnchor: [1, -34],
- }),
- areaName: station.Area_Name, // Stelle sicher, dass dieser Bereich gesetzt wird
- link: station.Link,
+ // Filtere nur aktive Stationen für Marker
+ const activeStations = jsonResponse.Points.filter((station) => station.System === systemId && station.Active === 1);
+ console.log("🔍 Gefilterte aktive Stationen:", activeStations);
- zIndexOffset: 100 * (6 - minLevel),
- });
+ let markersData = activeStations.map((station) => {
+ const statis = statisMap.get(station.IdLD);
+ const iconPath = statis ? `img/icons/${statis.Na}-marker-icon-${station.Icon}.png` : `img/icons/marker-icon-${station.Icon}.png`;
- // Popup-Info dynamisch erstellen
- const statusInfo = statisForStation
- .map(
- (status) => `
-
-
-
- ${status.Me} (${status.Na})
-
- `
- )
- .join("");
+ const priority = determinePriority(iconPath, priorityConfig);
+ const zIndexOffset = 100 * (5 - priority);
- marker.bindPopup(`
-
- ${station.LD_Name}
- ${station.Device}
- ${station.Area_Short} (${station.Area_Name})
- ${station.Location_Short} (${station.Location_Name}) -
- `);
-
- // **Mouseover zeigt Popup**
- marker.on("mouseover", function () {
- this.openPopup();
- });
-
- // **Mouseout schließt Popup**
- marker.on("mouseout", function () {
- this.closePopup();
- });
-
- return marker;
+ const marker = L.marker([station.X, station.Y], {
+ icon: L.icon({
+ iconUrl: iconPath,
+ iconSize: [25, 41],
+ iconAnchor: [12, 41],
+ popupAnchor: [1, -34],
+ }),
+ areaName: station.Area_Name,
+ link: station.Link,
+ zIndexOffset: zIndexOffset,
});
- setMarkersFunction(markersData);
- }
+ marker.bindPopup(`
+ - ${station.Area_Short} (${station.Area_Name})
- ${station.Location_Short} (${station.Location_Name}) -
${statusInfo}
-
+ ${station.LD_Name}
+ ${station.Device}
+ ${station.Area_Short} (${station.Area_Name})
+ ${station.Location_Short} (${station.Location_Name}) +
+ `);
+
+ marker.on("mouseover", function () {
+ this.openPopup();
+ });
+
+ marker.on("mouseout", function () {
+ this.closePopup();
+ });
+
+ marker.on("contextmenu", function (event) {
+ if (event && event.preventDefault) event.preventDefault();
+ this.openPopup();
+ });
+
+ document.addEventListener("mouseout", function (event) {
+ if (event.relatedTarget === null || event.relatedTarget.nodeName === "BODY") {
+ enablePolylineEvents(window.polylines, window.lineColors);
+ }
+ });
+
+ if (typeof marker.bounce === "function" && statis) {
+ marker.on("add", () => marker.bounce(3));
+ }
+
+ return marker;
+ });
+
+ console.log("📌 Marker erstellt:", markersData.length, markersData);
+
+ setMarkersFunction(markersData);
} catch (error) {
- console.error("Fehler beim Abrufen der Daten: ", error);
+ console.error("❌ Fehler beim Abrufen der Daten in createAndSetDevices.js: ", error);
}
};
diff --git a/utils/mapUtils.js b/utils/mapUtils.js
index 1250bb44c..89d13493b 100644
--- a/utils/mapUtils.js
+++ b/utils/mapUtils.js
@@ -1,41 +1,6 @@
// /utils/mapUtils.js
import L from "leaflet";
-export const redrawPolyline = (lineData, lineColors, tooltipContents, map) => {
- if (!lineData || !lineColors || !tooltipContents || !map) {
- console.error("Invalid parameters for redrawPolyline");
- return;
- }
-
- if (!lineData.coordinates || !Array.isArray(lineData.coordinates)) {
- console.error("Invalid coordinates in lineData");
- return;
- }
-
- const color = lineColors[lineData.idModul] || "#000000";
- const tooltipContent = tooltipContents[lineData.idModul] || "Standard-Tooltip-Inhalt";
-
- if (lineData.polyline) map.removeLayer(lineData.polyline);
-
- lineData.polyline = L.polyline(lineData.coordinates, {
- color: color,
- }).addTo(map);
-
- lineData.polyline.bindTooltip(tooltipContent, {
- permanent: false,
- direction: "auto",
- });
-
- lineData.polyline.on("mouseover", () => {
- lineData.polyline.setStyle({ weight: 10 });
- lineData.polyline.bringToFront();
- });
-
- lineData.polyline.on("mouseout", () => {
- lineData.polyline.setStyle({ weight: 5 });
- });
-};
-
export const saveLineData = (lineData) => {
fetch("/api/talas_v5_DB/gisLines/updateLineCoordinates", {
method: "POST",
@@ -86,7 +51,8 @@ export const checkOverlappingMarkers = (map, markers, plusIcon) => {
// Gruppiere Marker basierend auf ihrer Position
markers.forEach((marker) => {
- if (map.hasLayer(marker)) { // Überprüfen, ob der Marker sichtbar ist
+ if (map.hasLayer(marker)) {
+ // Überprüfen, ob der Marker sichtbar ist
const latlngStr = marker.getLatLng().toString();
if (overlappingGroups[latlngStr]) {
overlappingGroups[latlngStr].push(marker);
@@ -133,7 +99,6 @@ export const checkOverlappingMarkers = (map, markers, plusIcon) => {
}
};
-
export const handlePlusIconClick = (map, markers, oms, clickedLatLng) => {
// Debugging-Ausgabe
console.log("Plus-Icon Position:", clickedLatLng);
diff --git a/utils/mysqlPool.js b/utils/mysqlPool.js
index d9cc249fd..80b5f98ef 100644
--- a/utils/mysqlPool.js
+++ b/utils/mysqlPool.js
@@ -7,7 +7,7 @@ let connectionCount = 0; // Zähler für die aktiven Verbindungen
function getPool() {
if (!cachedPool) {
cachedPool = mysql.createPool({
- host: "127.0.0.1",
+ host: process.env.DB_HOST,
user: process.env.DB_USER,
password: process.env.DB_PASSWORD,
database: process.env.DB_NAME,
diff --git a/utils/setupPOIs.js b/utils/setupPOIs.js
index 7aa30d322..7abc7c945 100644
--- a/utils/setupPOIs.js
+++ b/utils/setupPOIs.js
@@ -83,9 +83,7 @@ export const setupPOIs = async (
`);
marker.on("mouseover", function () {
- //loaclStorage benutzen statt console.log
- //console.log("Device Name:", marker); // Debugging
- localStorage.setItem("deviceName", marker.options.name);
+ console.log("Device Name:", marker); // Debugging
handlePoiSelect(
{
id: location.idPoi,
diff --git a/utils/setupPolylines copy.js b/utils/setupPolylines copy.js
new file mode 100644
index 000000000..7e28edeeb
--- /dev/null
+++ b/utils/setupPolylines copy.js
@@ -0,0 +1,423 @@
+// utils/setupPolylines.js
+import { findClosestPoints } from "./geometryUtils";
+import handlePoiSelect from "./handlePoiSelect";
+import { updateLocationInDatabase } from "../services/apiService";
+import { handleEditPoi, insertNewPOI, removePOI } from "./poiUtils";
+import { parsePoint } from "./geometryUtils";
+import circleIcon from "../components/gisPolylines/icons/CircleIcon";
+import startIcon from "../components/gisPolylines/icons/StartIcon";
+import endIcon from "../components/gisPolylines/icons/EndIcon";
+import { redrawPolyline } from "./mapUtils";
+import { openInNewTab } from "./openInNewTab";
+import { toast } from "react-toastify";
+import { polylineLayerVisibleState } from "../store/atoms/polylineLayerVisibleState";
+import { useRecoilValue } from "recoil";
+
+// Funktion zum Deaktivieren der Polyline-Ereignisse
+export function disablePolylineEvents(polylines) {
+ polylines.forEach((polyline) => {
+ polyline.off("mouseover");
+ polyline.off("mouseout");
+ });
+}
+
+// Funktion zum Aktivieren der Polyline-Ereignisse
+export function enablePolylineEvents(polylines, lineColors) {
+ // Überprüfe, ob polylines definiert ist und ob es Elemente enthält
+ if (!polylines || polylines.length === 0) {
+ //console.warn("Keine Polylinien vorhanden oder polylines ist undefined.");
+ return;
+ }
+
+ // Falls Polylinien vorhanden sind, wende die Events an
+ polylines.forEach((polyline) => {
+ polyline.on("mouseover", (e) => {
+ //console.log("Mouseover on polyline", polyline.options);
+ polyline.setStyle({ weight: 14 });
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?id=${polyline.options.idLD}`;
+ //localStorage.setItem("lastElementType", "polyline");
+ //localStorage.setItem("polylineLink", link);
+ });
+
+ polyline.on("mouseout", (e) => {
+ //console.log("Mouseout from polyline", polyline.options);
+ polyline.setStyle({ weight: 3 });
+ });
+ });
+}
+// Funktion zum Schließen des Kontextmenüs und Entfernen der Markierung
+function closePolylineSelectionAndContextMenu(map) {
+ try {
+ // Entferne alle markierten Polylinien
+ if (window.selectedPolyline) {
+ window.selectedPolyline.setStyle({ weight: 3 }); // Originalstil wiederherstellen
+ window.selectedPolyline = null;
+ }
+
+ // Überprüfe, ob map und map.contextmenu definiert sind
+ if (map && map.contextmenu) {
+ map.contextmenu.hide(); // Kontextmenü schließen
+ } else {
+ console.warn("Kontextmenü ist nicht verfügbar.");
+ }
+ } catch (error) {
+ console.error("Fehler beim Schließen des Kontextmenüs:", error);
+ window.location.reload();
+ }
+
+ // Countdown-Status zurücksetzen
+ localStorage.removeItem("contextMenuCountdown");
+ localStorage.removeItem("contextMenuExpired");
+}
+
+// Überprüft regelmäßig den Status in localStorage
+function monitorContextMenu(map) {
+ setInterval(() => {
+ const isContextMenuExpired = localStorage.getItem("contextMenuExpired") === "true";
+ if (isContextMenuExpired) {
+ closePolylineSelectionAndContextMenu(map);
+ localStorage.removeItem("contextMenuExpired"); // Flagge entfernen, um wiederverwendbar zu sein
+ }
+ }, 1000); // Alle 1 Sekunde überprüfen
+}
+
+export const setupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible) => {
+ if (localStorage.getItem("polylineVisible") === null) {
+ localStorage.setItem("polylineVisible", "true"); // Standardwert setzen
+ polylineVisible = true; // Wert in der Funktion initialisieren
+ } else {
+ polylineVisible = localStorage.getItem("polylineVisible") === "true";
+ }
+
+ if (!polylineVisible) {
+ // Entferne alle Polylinien, wenn sie ausgeblendet werden sollen
+ if (window.polylines) {
+ window.polylines.forEach((polyline) => {
+ if (map.hasLayer(polyline)) {
+ map.removeLayer(polyline);
+ }
+ });
+ }
+ return { markers: [], polylines: [] };
+ }
+ const markers = [];
+ const polylines = [];
+ const editMode = localStorage.getItem("editMode") === "true"; // Prüfen, ob der Bearbeitungsmodus aktiv ist
+
+ linePositions.forEach((lineData, lineIndex) => {
+ const lineMarkers = [];
+
+ lineData.coordinates.forEach((coord, index) => {
+ let icon = circleIcon;
+ if (index === 0) {
+ icon = startIcon;
+ } else if (index === lineData.coordinates.length - 1) {
+ icon = endIcon;
+ }
+
+ // Nur Marker mit circleIcon ausblenden, wenn Bearbeitungsmodus deaktiviert ist
+ if (icon !== circleIcon || editMode) {
+ const marker = L.marker(coord, {
+ icon: icon,
+ draggable: editMode, // Nur verschiebbar, wenn Bearbeitungsmodus aktiv ist
+ contextmenu: true,
+ contextmenuInheritItems: false,
+ contextmenuItems: [],
+ }).addTo(map);
+
+ marker.on("dragend", () => {
+ console.log("Marker wurde verschoben in setupPolylines.js");
+ if (editMode) {
+ const newCoords = marker.getLatLng();
+ setNewCoords(newCoords);
+ const newCoordinates = [...lineData.coordinates];
+ newCoordinates[index] = [newCoords.lat, newCoords.lng];
+
+ const updatedPolyline = L.polyline(newCoordinates, {
+ color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000",
+ }).addTo(map);
+
+ updatedPolyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", {
+ permanent: false,
+ direction: "auto",
+ });
+
+ updatedPolyline.on("mouseover", () => {
+ updatedPolyline.setStyle({ weight: 20 });
+ updatedPolyline.bringToFront();
+ });
+
+ updatedPolyline.on("mouseout", () => {
+ updatedPolyline.setStyle({ weight: 3 });
+ });
+
+ polylines[lineIndex].remove();
+ polylines[lineIndex] = updatedPolyline;
+ lineData.coordinates = newCoordinates;
+
+ const requestData = {
+ idModul: lineData.idModul,
+ idLD: lineData.idLD,
+ newCoordinates,
+ };
+
+ fetch("/api/talas_v5_DB/gisLines/updateLineCoordinates", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify(requestData),
+ })
+ .then((response) => {
+ if (!response.ok) {
+ return response.json().then((data) => {
+ throw new Error(data.error || "Unbekannter Fehler");
+ });
+ }
+ return response.json();
+ })
+ .then((data) => {
+ console.log("Koordinaten erfolgreich aktualisiert:", data);
+ })
+ .catch((error) => {
+ console.error("Fehler beim Aktualisieren der Koordinaten:", error.message);
+ });
+ } else {
+ toast.error("Benutzer hat keine Berechtigung zum Bearbeiten.", {
+ position: "top-center",
+ autoClose: 5000,
+ hideProgressBar: false,
+ closeOnClick: true,
+ pauseOnHover: true,
+ draggable: true,
+ progress: undefined,
+ });
+ }
+ });
+
+ marker.on("mouseover", function () {
+ this.bindContextMenu({
+ contextmenuItems: [
+ {
+ text: "Stützpunkt entfernen",
+ icon: "/img/icons/gisLines/remove-support-point.svg",
+ callback: () => {
+ if (editMode) {
+ const newCoords = marker.getLatLng();
+ const newCoordinates = [...lineData.coordinates];
+ newCoordinates[index] = [newCoords.lat, newCoords.lng];
+
+ removePOI(marker, lineData, currentZoom, currentCenter);
+ polylines[lineIndex].remove();
+ lineData.coordinates = newCoordinates;
+ } else {
+ toast.error("Benutzer hat keine Berechtigung zum Bearbeiten.", {
+ position: "top-center",
+ autoClose: 5000,
+ hideProgressBar: false,
+ closeOnClick: true,
+ pauseOnHover: true,
+ draggable: true,
+ progress: undefined,
+ });
+ }
+ },
+ },
+ ],
+ });
+ });
+
+ marker.on("mouseout", function () {
+ this.unbindContextMenu();
+ });
+
+ lineMarkers.push(marker);
+ }
+ });
+
+ const polyline = L.polyline(lineData.coordinates, {
+ color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000",
+ weight: 3,
+ contextmenu: true,
+ contextmenuInheritItems: false, // Standard-Kontextmenü deaktivieren
+ contextmenuItems: [],
+ }).addTo(map);
+
+ // Füge "Stützpunkt hinzufügen" nur hinzu, wenn editMode aktiv ist
+ if (editMode) {
+ polyline.options.contextmenuItems.push(
+ {
+ text: "Station öffnen (Tab)",
+ icon: "/img/screen_new.png",
+ callback: (e) => {
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+ window.open(link, "_blank");
+ },
+ },
+ { separator: true },
+
+ {
+ text: "Koordinaten anzeigen",
+ icon: "/img/not_listed_location.png",
+ callback: (e) => {
+ alert("Breitengrad: " + e.latlng.lat.toFixed(5) + "\nLängengrad: " + e.latlng.lng.toFixed(5));
+ },
+ },
+ { separator: true },
+ {
+ text: "Reinzoomen",
+ icon: "/img/zoom_in.png",
+ callback: (e) => map.zoomIn(),
+ },
+ {
+ text: "Rauszoomen",
+ icon: "/img/zoom_out.png",
+ callback: (e) => map.zoomOut(),
+ },
+ {
+ text: "Hier zentrieren",
+ icon: "/img/center_focus.png",
+ callback: (e) => map.panTo(e.latlng),
+ },
+ { separator: true },
+ {
+ text: "POI hinzufügen",
+ icon: "/img/add_station.png",
+ callback: (e) => {
+ // Hier kannst du die Logik für das Hinzufügen eines POIs implementieren
+ alert("POI hinzufügen an: " + e.latlng);
+ },
+ },
+ {
+ text: "Stützpunkt hinzufügen",
+ icon: "/img/icons/gisLines/add-support-point.svg",
+ callback: (e) => {
+ if (tempMarker) {
+ tempMarker.remove();
+ }
+ const newPoint = e.latlng;
+ const closestPoints = findClosestPoints(lineData.coordinates, newPoint, map);
+ insertNewPOI(closestPoints, newPoint, lineData, map);
+ redrawPolyline(lineData, lineColors, tooltipContents, map);
+ window.location.reload();
+ },
+ }
+ );
+ } else {
+ polyline.options.contextmenuItems.push(
+ {
+ text: "Station öffnen (Tab)",
+ icon: "/img/screen_new.png",
+ callback: (e) => {
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+ window.open(link, "_blank");
+ },
+ },
+ { separator: true },
+
+ {
+ text: "Koordinaten anzeigen",
+ icon: "/img/not_listed_location.png",
+ callback: (e) => {
+ alert("Breitengrad: " + e.latlng.lat.toFixed(5) + "\nLängengrad: " + e.latlng.lng.toFixed(5));
+ },
+ },
+ { separator: true },
+ {
+ text: "Reinzoomen",
+ icon: "/img/zoom_in.png",
+ callback: (e) => map.zoomIn(),
+ },
+ {
+ text: "Rauszoomen",
+ icon: "/img/zoom_out.png",
+ callback: (e) => map.zoomOut(),
+ },
+
+ {
+ text: "Hier zentrieren",
+ icon: "/img/center_focus.png",
+ callback: (e) => map.panTo(e.latlng),
+ },
+ { separator: true },
+ {
+ text: "POI hinzufügen",
+ icon: "/img/add_station.png",
+ callback: (e) => {
+ // Hier kannst du die Logik für das Hinzufügen eines POIs implementieren
+ alert("POI hinzufügen an: " + e.latlng);
+ },
+ }
+ );
+ }
+
+ // Hier wird der Tooltip hinzugefügt
+ polyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", {
+ permanent: false,
+ direction: "auto",
+ });
+
+ polyline.on("mouseover", (e) => {
+ const startTime = Date.now(); // Startzeit erfassen
+ localStorage.setItem("contextMenuStartTime", startTime); // Speichern in localStorage
+
+ // Starte einen Intervall-Timer, um die Differenz zu berechnen
+ /* const countdownInterval = setInterval(() => {
+ const currentTime = Date.now();
+ const elapsedTime = (currentTime - startTime) / 1000; // Differenz in Sekunden
+
+ // Speichern der abgelaufenen Zeit in localStorage
+ localStorage.setItem("contextMenuCountdown", elapsedTime);
+
+ // Wenn die Zeit 17 Sekunden erreicht, schließe das Menü
+ if (elapsedTime >= 17) {
+ clearInterval(countdownInterval);
+ const contextMenu = map.contextmenu; // Zugriff auf das Kontextmenü
+ contextMenu.hide(); // Kontextmenü schließen
+ }
+ }, 1000); */
+ // Jede Sekunde
+ //console.log("Mouseover on polyline", lineData);
+ polyline.setStyle({ weight: 14 });
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+ console.log("Link der Linie:", link);
+ //localStorage.setItem("lastElementType", "polyline");
+ //localStorage.setItem("polylineLink", link);
+ });
+
+ polyline.on("mouseout", (e) => {
+ // console.log("Mouseout from polyline", lineData);
+ polyline.setStyle({ weight: 3 });
+ // Setze den Countdown auf 0, wenn mouseout ausgelöst wird
+ localStorage.setItem("contextMenuCountdown", 0);
+ });
+ // Speichere den Link bei einem Rechtsklick (Kontextmenü)
+ /*
+ polyline.on("contextmenu", (e) => {
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+ console.log("Link der Linie (via Rechtsklick):", link);
+ localStorage.setItem("lastElementType", "polyline");
+ localStorage.setItem("polylineLink", link);
+ });
+ */
+ // Starte den Timer zum Schließen des Kontextmenüs nach 15 Sekunden
+ polyline.on("contextmenu", function (e) {
+ const contextMenu = this._map.contextmenu; // Zugriff auf das Kontextmenü
+ const closeMenu = () => contextMenu.hide(); // Funktion zum Schließen des Menüs
+
+ const countdown = parseInt(localStorage.getItem("contextMenuCountdown"), 30);
+ if (countdown >= 28) {
+ closeMenu();
+ }
+ });
+
+ polylines.push(polyline);
+ markers.push(...lineMarkers);
+ });
+
+ // Speichere Polylines und LineColors global für den Zugriff in anderen Funktionen
+ window.polylines = polylines;
+ window.lineColors = lineColors;
+ monitorContextMenu(map);
+ return { markers, polylines };
+};
diff --git a/utils/setupPolylines.js b/utils/setupPolylines.js
index 9cc8f418b..8abfd3d52 100644
--- a/utils/setupPolylines.js
+++ b/utils/setupPolylines.js
@@ -12,11 +12,7 @@ import { openInNewTab } from "./openInNewTab";
import { toast } from "react-toastify";
import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice";
import { useRecoilValue } from "recoil";
-
-const protocol = window.location.protocol; // z. B. 'http:' oder 'https:'
-const hostname = window.location.hostname; // z. B. 'example.com'
-const originWithoutPort = `${protocol}//${hostname}`; // z. B. 'https://example.com'
-const BASE_URL = `${originWithoutPort}/talas5/devices/`; // Dynamische Basis-URL
+import { store } from "../redux/store"; // Importiere den Store
// Funktion zum Deaktivieren der Polyline-Ereignisse
export function disablePolylineEvents(polylines) {
@@ -39,7 +35,7 @@ export function enablePolylineEvents(polylines, lineColors) {
polyline.on("mouseover", (e) => {
//console.log("Mouseover on polyline", polyline.options);
polyline.setStyle({ weight: 14 });
- const link = `${BASE_URL}cpl.aspx?id=${polyline.options.idLD}`;
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?id=${polyline.options.idLD}`;
//localStorage.setItem("lastElementType", "polyline");
//localStorage.setItem("polylineLink", link);
});
@@ -87,6 +83,15 @@ function monitorContextMenu(map) {
}
export const setupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible) => {
+ // Hole activeLines direkt aus Redux
+ const state = store.getState(); // Hole den gesamten Zustand
+ const activeLines = state.lineVisibility.activeLines; // Zugriff auf activeLines
+
+ if (!activeLines) {
+ console.warn("activeLines ist undefined oder null.");
+ return { markers: [], polylines: [] };
+ }
+
if (localStorage.getItem("polylineVisible") === null) {
localStorage.setItem("polylineVisible", "true"); // Standardwert setzen
polylineVisible = true; // Wert in der Funktion initialisieren
@@ -110,6 +115,17 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
const editMode = localStorage.getItem("editMode") === "true"; // Prüfen, ob der Bearbeitungsmodus aktiv ist
linePositions.forEach((lineData, lineIndex) => {
+ console.log("LineData:", lineData.idLD, lineData.idModul);
+ console.log("ActiveLines:", activeLines);
+
+ // **Fix: Sicherstellen, dass activeLines definiert ist und idLD existiert**
+ const isActive = activeLines && lineData.idLD && activeLines[String(lineData.idLD)] === 1;
+
+ if (!isActive) {
+ console.warn(`Linie mit idLD ${lineData.idLD} wird ausgeblendet.`);
+ return;
+ }
+
const lineMarkers = [];
lineData.coordinates.forEach((coord, index) => {
@@ -142,7 +158,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000",
}).addTo(map);
- updatedPolyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", {
+ updatedPolyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt setup 1", {
permanent: false,
direction: "auto",
});
@@ -255,7 +271,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
text: "Station öffnen (Tab)",
icon: "/img/screen_new.png",
callback: (e) => {
- const link = `${BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
window.open(link, "_blank");
},
},
@@ -314,7 +330,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
text: "Station öffnen (Tab)",
icon: "/img/screen_new.png",
callback: (e) => {
- const link = `${BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
window.open(link, "_blank");
},
},
@@ -357,7 +373,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
}
// Hier wird der Tooltip hinzugefügt
- polyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", {
+ polyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt setup", {
permanent: false,
direction: "auto",
});
@@ -384,11 +400,10 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
// Jede Sekunde
//console.log("Mouseover on polyline", lineData);
polyline.setStyle({ weight: 14 });
- const link = `${BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
- //console.log("Link der Linie:", link);
-
+ const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+ console.log("Link der Linie:", link);
//localStorage.setItem("lastElementType", "polyline");
- localStorage.setItem("Link_der_Linie:", link);
+ //localStorage.setItem("polylineLink", link);
});
polyline.on("mouseout", (e) => {
diff --git a/utils/utils.js b/utils/utils.js
new file mode 100644
index 000000000..b5d4407c2
--- /dev/null
+++ b/utils/utils.js
@@ -0,0 +1,211 @@
+// /utils/utils.js
+import { useState } from "react";
+import circleIcon from "../components/CircleIcon";
+
+export const parsePoint = (position) => {
+ const [longitude, latitude] = position.slice(6, -1).split(" ");
+ return { latitude: parseFloat(latitude), longitude: parseFloat(longitude) };
+};
+//----------------------------------------------
+
+export const determinePriority = (iconPath) => {
+ const [priorityConfig, setPriorityConfig] = useState([]);
+ for (let priority of priorityConfig) {
+ if (iconPath.includes(priority.name.toLowerCase())) {
+ return priority.level;
+ }
+ }
+ return 5; // Default priority (lowest)
+};
+//----------------------------------------------
+export const createAndSetMarkers = async (systemId, setMarkersFunction) => {
+ try {
+ const response1 = await fetch(config.mapGisStationsStaticDistrictUrl);
+ const jsonResponse = await response1.json();
+ const response2 = await fetch(config.mapGisStationsStatusDistrictUrl);
+ const statusResponse = await response2.json();
+
+ const getIdSystemAndAllowValueMap = new Map(GisSystemStatic.map((system) => [system.IdSystem, system.Allow]));
+ //console.log("getIdSystemAndAllowValueMap:", getIdSystemAndAllowValueMap);
+
+ if (jsonResponse.Points && statusResponse.Statis) {
+ const statisMap = new Map(statusResponse.Statis.map((s) => [s.IdLD, s]));
+ let markersData = jsonResponse.Points.filter((station) => station.System === systemId && getIdSystemAndAllowValueMap.get(station.System) === 1).map((station) => {
+ const statis = statisMap.get(station.IdLD);
+ const iconPath = statis ? `img/icons/${statis.Na}-marker-icon-${station.Icon}.png` : `img/icons/marker-icon-${station.Icon}.png`;
+
+ const priority = determinePriority(iconPath);
+ const zIndexOffset = 100 * (5 - priority); // Adjusted for simplicity and positive values
+
+ const marker = L.marker([station.X, station.Y], {
+ icon: L.icon({
+ iconUrl: iconPath,
+ iconSize: [25, 41],
+ iconAnchor: [12, 41],
+ popupAnchor: [1, -34],
+ }),
+ areaName: station.Area_Name, // Stelle sicher, dass dieser Bereich gesetzt wird
+ link: station.Link,
+ zIndexOffset: zIndexOffset,
+ bounceOnAdd: !!statis,
+ });
+
+ if (statis) {
+ marker.on("add", () => marker.bounce(3));
+ }
+
+ const statusInfo = statusResponse.Statis.filter((status) => status.IdLD === station.IdLD)
+ .reverse()
+ .map(
+ (status) => `
+ + ${station.Area_Short} (${station.Area_Name})
+ ${station.Location_Short} (${station.Location_Name}) +
+ ${statusResponse.Statis.filter((status) => status.IdLD === station.IdLD)
+ .reverse()
+ .map(
+ (status) => `
+
+
+
+ ${status.Me} (${status.Na})
+
+ `
+ )
+ .join("")}
+
+
+ ${status.Me} (${status.Na})
+
+ `
+ )
+ .join("");
+
+ marker.bindPopup(`
+
+ ${station.LD_Name}
+ ${station.Device}
+ ${station.Area_Short} (${station.Area_Name})
+ ${station.Location_Short} (${station.Location_Name}) +
+ `);
+ return marker;
+ });
+
+ setMarkersFunction(markersData);
+ }
+ } catch (error) {
+ console.error("Error fetching data: ", error);
+ }
+};
+//----------------------------------------------
+export const fetchPriorityConfig = async () => {
+ try {
+ const response = await fetch("/api/talas_v5_DB/priorityConfig");
+ const data = await response.json();
+ console.log("Prioritätskonfiguration:", data);
+ setPriorityConfig(data);
+ } catch (error) {
+ console.error("Fehler beim Laden der Prioritätskonfiguration:", error);
+ }
+};
+//----------------------------------------------
+export const fetchGisStatusStations = async (idMap, idUser) => {
+ try {
+ const response = await fetch(`/api/talas5/webserviceMap/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`);
+ if (!response.ok) {
+ throw new Error(`Error: ${response.statusText}`);
+ }
+ const data = await response.json();
+ console.log("GisStatusStations:", data);
+ return data;
+ } catch (error) {
+ console.error("Fehler beim Abrufen der Daten:", error);
+ }
+};
+//----------------------------------------------
+export const handleEditPoi = (marker) => {
+ // Prüfung, ob der Benutzer die notwendigen Rechte hat
+ if (!userRights || !userRights.includes(56)) {
+ toast.error("Benutzer hat keine Berechtigung zum Bearbeiten.", {
+ position: "top-center",
+ autoClose: 5000,
+ hideProgressBar: false,
+ closeOnClick: true,
+ pauseOnHover: true,
+ draggable: true,
+ progress: undefined,
+ });
+ console.log("Benutzer hat keine Berechtigung zum Bearbeiten.");
+ return; // Beendet die Funktion frühzeitig, wenn keine Berechtigung vorliegt
+ }
+
+ //console.log("Selected Marker ID (idPoi):", marker.options.idPoi);
+ //console.log("Selected Marker Description:", marker.options.description);
+
+ setCurrentPoiData({
+ idPoi: marker.options.id,
+ name: marker.options.name,
+ description: marker.options.description,
+ });
+ //console.log("POI-Daten1:", currentPoiData);
+
+ fetchPoiData(marker.options.id);
+
+ setShowPoiUpdateModal(true);
+};
+//----------------------------------------------
+export const insertNewMarker = (closestPoints, newPoint, lineData, map) => {
+ const newMarker = L.marker(newPoint, {
+ icon: circleIcon,
+ draggable: true,
+ }).addTo(map);
+ lineData.coordinates.splice(closestPoints[2], 0, [newPoint.lat, newPoint.lng]);
+
+ // Hier direkt speichern nach Einfügen
+ saveLineData(lineData);
+
+ redrawPolyline(lineData);
+
+ // Event-Listener für das Verschieben des Markers hinzufügen
+ newMarker.on("dragend", () => {
+ const newCoords = newMarker.getLatLng();
+ setNewCoords(newCoords);
+ const newCoordinates = [...lineData.coordinates];
+ newCoordinates[closestPoints[2]] = [newCoords.lat, newCoords.lng];
+ lineData.coordinates = newCoordinates;
+ redrawPolyline(lineData);
+
+ updateMarkerPosition(newMarker.getLatLng(), lineData, newMarker);
+ saveLineData(lineData); // Speichern der neuen Koordinaten nach dem Verschieben
+ });
+};
+//----------------------------------------------
+/* export const addItemsToMapContextMenu = () => {
+ const [menuItemAdded, setMenuItemAdded] = useState(false);
+ if (!menuItemAdded) {
+ //console.log("contextMenuItems hasRights:", hasRights);
+
+ map.contextmenu.addItem({
+ text: "POI hinzufügen",
+ icon: "img/add_station.png",
+ className: "background-red",
+ callback: (event) => addStationCallback(event, hasRights),
+ });
+
+ setMenuItemAdded(true); // Menüpunkt wurde hinzugefült, Zustand aktualisieren
+ }
+}; */
+//----------------------------------------------
+export const saveLineData = (lineData) => {
+ fetch("/api/talas_v5_DB/gisLines/updateLineCoordinates", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ idModul: lineData.idModul,
+ idLD: lineData.idLD,
+ newCoordinates: lineData.coordinates,
+ }),
+ })
+ .then((response) => {
+ if (!response.ok) {
+ throw new Error("Fehler beim Speichern der Linienänderungen");
+ }
+ return response.json();
+ })
+ .then((data) => {
+ console.log("Linienänderungen gespeichert:", data);
+ })
+ .catch((error) => {
+ console.error("Fehler beim Speichern der Linienänderungen:", error);
+ });
+};
+//----------------------------------------------
+ ${station.Area_Short} (${station.Area_Name})
+ ${station.Location_Short} (${station.Location_Name}) +
${statusInfo}
+