mockApi erstellt, um die Eingabe zu simulieren, aber funktioniert nocht nicht ganz
This commit is contained in:
ISA
@@ -1,3 +1,4 @@
|
||||
// /componentss/DataSheet.js
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil";
|
||||
import { gisStationsStaticDistrictState } from "../redux/slices/gisStationsStaticDistrictSlice";
|
||||
|
||||
@@ -61,8 +61,10 @@ import CoordinatePopup from "./CoordinatePopup";
|
||||
//------------------------Daten aus API--------------------
|
||||
import { fetchUserRights } from "../services/api/fetchUserRights.js";
|
||||
import { fetchPoiData } from "../services/api/fetchPoiData.js";
|
||||
import { fetchGisStationsStaticDistrict } from "../services/api/fetchGisStationsStaticDistrict.js";
|
||||
import { fetchGisStationsStatusDistrict } from "../services/api/fetchGisStationsStatusDistrict.js";
|
||||
//import { fetchGisStationsStaticDistrict } from "../services/api/fetchGisStationsStaticDistrict.js";
|
||||
import { fetchGisStationsStaticDistrict } from "../services/mockApi/fetchGisStationsStaticDistrict.js";
|
||||
//import { fetchGisStationsStatusDistrict } from "../services/api/fetchGisStationsStatusDistrict.js";
|
||||
import { fetchGisStationsStatusDistrict } from "../services/mockApi/fetchGisStationsStatusDistrict.js";
|
||||
import { fetchGisStationsMeasurements } from "../services/api/fetchGisStationsMeasurements.js";
|
||||
import { fetchGisSystemStatic } from "../services/api/fetchGisSystemStatic.js";
|
||||
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
// /config/appVersion
|
||||
export const APP_VERSION = "1.1.5";
|
||||
export const APP_VERSION = "1.1.6";
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
// /config/config.js
|
||||
import * as urls from "../config/urls.js";
|
||||
|
||||
// Definieren der grundlegenden Umgebungseinstellungen und Konfigurationen der Karte
|
||||
const standardSideMenu = true; // Einstellung, ob ein standardmäßiges Seitenmenü verwendet wird
|
||||
const fullSideMenu = false; // Einstellung, ob ein vollständiges Seitenmenü verwendet wird
|
||||
const standardSideMenu = true;
|
||||
const fullSideMenu = false;
|
||||
|
||||
const serverURL = process.env.NEXT_PUBLIC_SERVER_URL;
|
||||
if (!serverURL) {
|
||||
@@ -10,46 +11,47 @@ if (!serverURL) {
|
||||
}
|
||||
console.log("%c 1- serverURL in config:", "color: #006400;", serverURL);
|
||||
|
||||
// Mock-Switch direkt in der config.js
|
||||
// true = Mock-Daten verwenden
|
||||
// false = Echte Daten von Webservice
|
||||
const USE_MOCK_API = true; // <--- Hier nicht mit "export" direkt, sondern erst unten im Export
|
||||
|
||||
// Initialisieren von Variablen, die später im Browserkontext gesetzt werden
|
||||
let windowHeight, url_string, url, idMap, idUser;
|
||||
//Online Daten
|
||||
let mapGisStationsStaticDistrictUrl, mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl, mapDataIconUrl, webserviceGisLinesStatusUrl;
|
||||
|
||||
// Prüfen, ob das Code im Browser ausgeführt wird
|
||||
if (typeof window !== "undefined") {
|
||||
// Diese Variablen werden nur im Browser-Kontext initialisiert
|
||||
windowHeight = window.innerHeight; // Die Höhe des Browserfensters
|
||||
url_string = window.location.href; // Die vollständige URL als String
|
||||
url = new URL(url_string); // Die URL als URL-Objekt, um Teile der URL einfacher zu handhaben
|
||||
windowHeight = window.innerHeight;
|
||||
url_string = window.location.href;
|
||||
url = new URL(url_string);
|
||||
console.log("%c 2- URL in config:", "color: #006400; font-size: 16px; background-color: #f0f0f0;", url);
|
||||
|
||||
console.log("%c 3- URL origin in config:", "color: #006400;", url.origin); //http://localhost:3000
|
||||
idMap = url.searchParams.get("m"); // Ein Parameter aus der URL, Standardwert ist '10'
|
||||
idUser = url.searchParams.get("u"); // Ein weiterer Parameter aus der URL, Standardwert ist '484 admin zu testen von Stationen ausblenden und einblenden in der Card'
|
||||
console.log("%c 3- URL origin in config:", "color: #006400;", url.origin);
|
||||
idMap = url.searchParams.get("m");
|
||||
idUser = url.searchParams.get("u");
|
||||
|
||||
console.log(`4- Parameter 'idMap' : ${idMap}`);
|
||||
console.log(`5- Parameter 'idUser': ${idUser}`);
|
||||
|
||||
// Konstruktion von URLs, die auf spezifische Ressourcen auf dem Server zeigen
|
||||
//http://localhost:3000/?m=10&u=485
|
||||
|
||||
//-----------------Von WebService------------------------------------------------
|
||||
mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`; //idMap: 10, idUser: 484
|
||||
mapGisStationsStatusDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`;
|
||||
mapGisStationsMeasurementsUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap=${idMap}`;
|
||||
mapGisSystemStaticUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`;
|
||||
mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`;
|
||||
|
||||
//webserviceGisLinesStatusUrl = `http://10.10.0.13/talas5/ClientData/WebServiceMap.asmx/GisLinesStatus?idMap=${idMap}`;
|
||||
|
||||
// webserviceGisLinesStatusUrl = `http://localhost:3000/api/linesColorApi`;
|
||||
//webserviceGisLinesStatusUrl = `http://192.168.10.14/talas5/ClientData/WebServiceMap.asmx/GisLinesStatus?idMap=${idMap}`;
|
||||
webserviceGisLinesStatusUrl = `${serverURL}/talas5/ClientData/WebServiceMap.asmx/GisLinesStatus?idMap=${idMap}`;
|
||||
|
||||
//http://10.10.0.13/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=12&idUser=484
|
||||
if (!USE_MOCK_API) {
|
||||
mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`;
|
||||
mapGisStationsStatusDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`;
|
||||
mapGisStationsMeasurementsUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap=${idMap}`;
|
||||
mapGisSystemStaticUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`;
|
||||
mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`;
|
||||
webserviceGisLinesStatusUrl = `${serverURL}/talas5/ClientData/WebServiceMap.asmx/GisLinesStatus?idMap=${idMap}`;
|
||||
} else {
|
||||
mapGisStationsStaticDistrictUrl = "/services/mockApi/fetchGisStationsStaticDistrict.js";
|
||||
mapGisStationsStatusDistrictUrl = "/services/mockApi/fetchGisStationsStatusDistrict.js";
|
||||
mapGisStationsMeasurementsUrl = "/services/mockApi/fetchGisStationsMeasurements.js";
|
||||
mapGisSystemStaticUrl = "/services/mockApi/fetchGisSystemStatic.js";
|
||||
// mapDataIconUrl = "/services/mockApi/fetchGisDataIcon.js"; // noch nicht vorhanden
|
||||
// webserviceGisLinesStatusUrl = "/services/mockApi/"; // noch nicht vorhanden
|
||||
}
|
||||
}
|
||||
|
||||
// Export der definierten Variablen und URLs, damit sie in anderen Teilen der Anwendung verwendet werden können
|
||||
// Export der definierten Variablen und URLs
|
||||
export {
|
||||
standardSideMenu,
|
||||
fullSideMenu,
|
||||
@@ -65,10 +67,5 @@ export {
|
||||
mapGisSystemStaticUrl,
|
||||
mapDataIconUrl,
|
||||
webserviceGisLinesStatusUrl,
|
||||
USE_MOCK_API, // Hier exportieren wir den Mock-Switch
|
||||
};
|
||||
|
||||
/*
|
||||
Access to fetch at 'http://localhost:3000/api/linesColorApi' from origin 'http://10.10.0.13:3000' has been blocked by CORS policy:
|
||||
No 'Access-Control-Allow-Origin' header is present on the requested resource.
|
||||
If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
|
||||
*/
|
||||
|
||||
@@ -2,7 +2,8 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import L from "leaflet";
|
||||
import { addContextMenuToMarker } from "../../utils/addContextMenuToMarker";
|
||||
//import { fetchDeviceNameById } from "../services/apiService";
|
||||
//import { fetchDeviceNameById } from "../services/api/fetchDeviceNameById";
|
||||
|
||||
|
||||
const useUlafMarkersLayer = (map, oms, GisSystemStatic, priorityConfig) => {
|
||||
const [ulafMarkers, setUlafMarkers] = useState([]);
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
// /hooks/useFetchWebServiceMap.js
|
||||
import { useEffect } from "react";
|
||||
import {
|
||||
fetchGisStationsStaticDistrict,
|
||||
fetchGisStationsStatusDistrict,
|
||||
fetchGisStationsMeasurements,
|
||||
fetchGisSystemStatic,
|
||||
} from "../services/fetchData";
|
||||
import { fetchGisStationsStaticDistrict } from "../services/api/fetchGisStationsStaticDistrict";
|
||||
import { fetchGisStationsStatusDistrict } from "../services/api/fetchGisStationsStatusDistrict";
|
||||
import { fetchGisStationsMeasurements } from "../services/api/fetchGisStationsMeasurements";
|
||||
import { fetchGisSystemStatic } from "../services/api/fetchGisSystemStatic";
|
||||
|
||||
export const useFetchWebServiceMap = (
|
||||
dispatch,
|
||||
@@ -32,39 +31,22 @@ export const useFetchWebServiceMap = (
|
||||
};
|
||||
|
||||
// Fetch GIS Stations Static District
|
||||
await fetchGisStationsStaticDistrict(
|
||||
mapGisStationsStaticDistrictUrl,
|
||||
dispatch,
|
||||
fetchOptions
|
||||
);
|
||||
await fetchGisStationsStaticDistrict(mapGisStationsStaticDistrictUrl, dispatch, fetchOptions);
|
||||
requestCount++;
|
||||
localStorage.setItem("fetchWebServiceMap", requestCount);
|
||||
|
||||
// Fetch GIS Stations Status District
|
||||
await fetchGisStationsStatusDistrict(
|
||||
mapGisStationsStatusDistrictUrl,
|
||||
setGisStationsStatusDistrict,
|
||||
fetchOptions
|
||||
);
|
||||
await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStationsStatusDistrict, fetchOptions);
|
||||
requestCount++;
|
||||
localStorage.setItem("fetchWebServiceMap", requestCount);
|
||||
|
||||
// Fetch GIS Stations Measurements
|
||||
await fetchGisStationsMeasurements(
|
||||
mapGisStationsMeasurementsUrl,
|
||||
setGisStationsMeasurements,
|
||||
fetchOptions
|
||||
);
|
||||
await fetchGisStationsMeasurements(mapGisStationsMeasurementsUrl, setGisStationsMeasurements, fetchOptions);
|
||||
requestCount++;
|
||||
localStorage.setItem("fetchWebServiceMap", requestCount);
|
||||
|
||||
// Fetch GIS System Static
|
||||
await fetchGisSystemStatic(
|
||||
mapGisSystemStaticUrl,
|
||||
setGisSystemStatic,
|
||||
setGisSystemStaticLoaded,
|
||||
fetchOptions
|
||||
);
|
||||
await fetchGisSystemStatic(mapGisSystemStaticUrl, setGisSystemStatic, setGisSystemStaticLoaded, fetchOptions);
|
||||
requestCount++;
|
||||
localStorage.setItem("fetchWebServiceMap", requestCount);
|
||||
} catch (error) {
|
||||
@@ -73,15 +55,5 @@ export const useFetchWebServiceMap = (
|
||||
};
|
||||
|
||||
fetchWebServiceMap();
|
||||
}, [
|
||||
dispatch,
|
||||
mapGisStationsStaticDistrictUrl,
|
||||
mapGisStationsStatusDistrictUrl,
|
||||
mapGisStationsMeasurementsUrl,
|
||||
mapGisSystemStaticUrl,
|
||||
setGisStationsStatusDistrict,
|
||||
setGisStationsMeasurements,
|
||||
setGisSystemStatic,
|
||||
setGisSystemStaticLoaded,
|
||||
]);
|
||||
}, [dispatch, mapGisStationsStaticDistrictUrl, mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl, setGisStationsStatusDistrict, setGisStationsMeasurements, setGisSystemStatic, setGisSystemStaticLoaded]);
|
||||
};
|
||||
|
||||
@@ -1,14 +1,7 @@
|
||||
import { useEffect } from "react";
|
||||
import { fetchGisStationsMeasurements } from "../services/fetchData";
|
||||
import { fetchGisStationsMeasurements } from "../services/api/fetchGisStationsMeasurements";
|
||||
|
||||
export const useUpdateGmaData = (
|
||||
map,
|
||||
setGisStationsMeasurements,
|
||||
mapGisStationsMeasurementsUrl,
|
||||
gmaMarkers,
|
||||
layers,
|
||||
oms
|
||||
) => {
|
||||
export const useUpdateGmaData = (map, setGisStationsMeasurements, mapGisStationsMeasurementsUrl, gmaMarkers, layers, oms) => {
|
||||
useEffect(() => {
|
||||
if (!map) return; // Sicherstellen, dass die Karte initialisiert ist
|
||||
|
||||
@@ -22,11 +15,7 @@ export const useUpdateGmaData = (
|
||||
};
|
||||
|
||||
// Aktualisiere die Messdaten
|
||||
await fetchGisStationsMeasurements(
|
||||
mapGisStationsMeasurementsUrl,
|
||||
setGisStationsMeasurements,
|
||||
fetchOptions
|
||||
);
|
||||
await fetchGisStationsMeasurements(mapGisStationsMeasurementsUrl, setGisStationsMeasurements, fetchOptions);
|
||||
|
||||
// Aktualisiere die Marker-Layer
|
||||
// useGmaMarkersLayer(map, gmaMarkers, GisStationsMeasurements, layers.MAP_LAYERS.GMA, oms);
|
||||
@@ -44,12 +33,5 @@ export const useUpdateGmaData = (
|
||||
}, 5000);
|
||||
|
||||
return () => clearInterval(intervalId); */
|
||||
}, [
|
||||
map,
|
||||
gmaMarkers,
|
||||
layers.MAP_LAYERS.GMA,
|
||||
oms,
|
||||
mapGisStationsMeasurementsUrl,
|
||||
setGisStationsMeasurements,
|
||||
]);
|
||||
}, [map, gmaMarkers, layers.MAP_LAYERS.GMA, oms, mapGisStationsMeasurementsUrl, setGisStationsMeasurements]);
|
||||
};
|
||||
|
||||
@@ -1,5 +0,0 @@
|
||||
export const checkInternet = () => {
|
||||
fetch("https://tile.openstreetmap.org/1/1/1.png", { method: "HEAD" })
|
||||
.then((response) => setOnline(response.ok))
|
||||
.catch(() => setOnline(false));
|
||||
};
|
||||
@@ -1,172 +0,0 @@
|
||||
// services/apiService.js
|
||||
import * as config from "../config/config";
|
||||
import * as urls from "../config/urls";
|
||||
|
||||
let timeoutId;
|
||||
|
||||
const fetchWithTimeout = async (url, options, timeout = 5000) => {
|
||||
const controller = new AbortController();
|
||||
const id = setTimeout(() => controller.abort(), timeout);
|
||||
|
||||
try {
|
||||
const response = await fetch(url, {
|
||||
...options,
|
||||
signal: controller.signal,
|
||||
});
|
||||
clearTimeout(id);
|
||||
return response;
|
||||
} catch (error) {
|
||||
clearTimeout(id); // Im Falle eines Fehlers den Timeout abbrechen
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
export const fetchGisStatusStations = async (idMap, idUser) => {
|
||||
// Verhindere wiederholte schnelle API-Aufrufe durch Debouncing
|
||||
if (timeoutId) {
|
||||
clearTimeout(timeoutId);
|
||||
}
|
||||
|
||||
timeoutId = setTimeout(async () => {
|
||||
const SERVER_URL = process.env.NEXT_PUBLIC_SERVER_URL;
|
||||
|
||||
try {
|
||||
// Verwende das Timeout für die API-Anfrage
|
||||
const response = await fetchWithTimeout(
|
||||
`${SERVER_URL}/talas5/ClientData/WebServiceMap.asmx/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`,
|
||||
{
|
||||
method: "GET",
|
||||
headers: {
|
||||
Connection: "close", // Dieser Header stellt sicher, dass die Verbindung nach dem Abruf geschlossen wird
|
||||
},
|
||||
},
|
||||
5000 // Timeout auf 5 Sekunden gesetzt
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`Error: ${response.statusText}`);
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
return data;
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Abrufen der Daten in /services/apiService.js :", error);
|
||||
throw error;
|
||||
}
|
||||
}, 500); // Debounce-Zeit auf 500ms gesetzt
|
||||
};
|
||||
|
||||
// ----------------------------------------------
|
||||
/* 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 fetchPoiData = async (idPoi) => {
|
||||
try {
|
||||
const response = await fetch(`/api/talas_v5_DB/pois/getPoiById?idPoi=${idPoi}`);
|
||||
if (!response.ok) {
|
||||
throw new Error("Fehler beim Abrufen der POI-Daten");
|
||||
}
|
||||
const data = await response.json();
|
||||
return {
|
||||
idPoi,
|
||||
name: data.name,
|
||||
description: data.description,
|
||||
idLD: data.idLD,
|
||||
};
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Abrufen der POI-Daten", error);
|
||||
return null;
|
||||
}
|
||||
};
|
||||
// ----------------------------------------------
|
||||
// Funktion zum Aktualisieren der Position in der Datenbank
|
||||
export const updateLocationInDatabase = async (id, newLatitude, newLongitude) => {
|
||||
const response = await fetch("/api/talas_v5_DB/pois/updateLocation", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
id,
|
||||
latitude: newLatitude,
|
||||
longitude: newLongitude,
|
||||
}),
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
//schreib die neue Kooridnaten in die Console
|
||||
//akuellisiere die Position in der Datenbank mit den neuen Koordinaten mit updateLocation mit SQL Anweisung UPDATE
|
||||
} else {
|
||||
console.error("Fehler beim Aktualisieren der Position");
|
||||
}
|
||||
};
|
||||
|
||||
// ----------------------------------------------
|
||||
// Funktionen zur Überwachung der Internetverbindung
|
||||
export const checkInternet = () => {
|
||||
fetch("https://tile.openstreetmap.org/1/1/1.png", { method: "HEAD" })
|
||||
.then((response) => setOnline(response.ok))
|
||||
.catch(() => setOnline(false));
|
||||
};
|
||||
|
||||
// ----------------------------------------------
|
||||
export const fetchDeviceNameById = async (idLD) => {
|
||||
try {
|
||||
const response = await fetch(`/api/talas_v5_DB/locationDevice/locationDeviceNameById?idLD=${idLD}`);
|
||||
const data = await response.json();
|
||||
if (response.ok) {
|
||||
return data.name;
|
||||
} else {
|
||||
//throw new Error(data.error || "Gerät nicht gefunden");
|
||||
throw new Error("Gerät nicht gefunden in apiService.js");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Abrufen des Gerätenamens in apiService.js:", error);
|
||||
return "Unbekannt";
|
||||
}
|
||||
};
|
||||
|
||||
// ----------------------------------------------
|
||||
// services/apiService.js
|
||||
export const fetchUserRights = async () => {
|
||||
// Zähler für API-Aufrufe in localStorage speichern
|
||||
let userRightsRequestCount = localStorage.getItem("userRightsRequestCount") || 0;
|
||||
userRightsRequestCount++;
|
||||
localStorage.setItem("userRightsRequestCount", userRightsRequestCount);
|
||||
console.log(`fetchUserRights wurde ${userRightsRequestCount} Mal aufgerufen.`);
|
||||
|
||||
try {
|
||||
const response = await fetch(`${process.env.NEXT_PUBLIC_SERVER_URL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=${config.idMap}&idUser=${config.idUser}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Connection: "close",
|
||||
},
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
// Überprüfen der Struktur der Antwort
|
||||
if (!data || !data.Rights || !Array.isArray(data.Rights)) {
|
||||
throw new Error("Invalid response structure");
|
||||
}
|
||||
|
||||
const rightsArray = data.Rights; // Nehmen an, dass 'Rights' das Array von Rechten ist
|
||||
const userRightsIds = rightsArray.map((right) => right.IdRight);
|
||||
|
||||
return userRightsIds;
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Abrufen der Benutzerrechte", error);
|
||||
return [];
|
||||
}
|
||||
};
|
||||
@@ -1,64 +0,0 @@
|
||||
// services/fetchData.js
|
||||
import { setGisStationsStaticDistrict } from "../redux/slices/gisStationsStaticDistrictSlice";
|
||||
|
||||
export const fetchGisStationsStaticDistrict = async (url, dispatch, fetchOptions) => {
|
||||
try {
|
||||
const response = await fetch(url, fetchOptions);
|
||||
const jsonResponse = await response.json();
|
||||
if (jsonResponse && jsonResponse.Points) {
|
||||
dispatch(setGisStationsStaticDistrict(jsonResponse.Points));
|
||||
} else {
|
||||
console.error('Erwartete Daten im "Points"-Array nicht gefunden', jsonResponse);
|
||||
dispatch(setGisStationsStaticDistrict([]));
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Laden der Daten: ", error);
|
||||
dispatch(setGisStationsStaticDistrict([]));
|
||||
}
|
||||
};
|
||||
export const fetchGisStationsStatusDistrict = async (url, setGisStationsStatusDistrict) => {
|
||||
try {
|
||||
const response = await fetch(url);
|
||||
const jsonResponse = await response.json();
|
||||
if (jsonResponse && jsonResponse.Statis) {
|
||||
setGisStationsStatusDistrict(jsonResponse.Statis);
|
||||
} else {
|
||||
console.error('Erwartete Daten im "Statis"-Array nicht gefunden', jsonResponse);
|
||||
setGisStationsStatusDistrict([]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Laden der Daten: ", error);
|
||||
setGisStationsStatusDistrict([]);
|
||||
}
|
||||
};
|
||||
export const fetchGisStationsMeasurements = async (url, setGisStationsMeasurements) => {
|
||||
try {
|
||||
const response = await fetch(url);
|
||||
const jsonResponse = await response.json();
|
||||
if (jsonResponse && jsonResponse.Statis) {
|
||||
setGisStationsMeasurements(jsonResponse.Statis);
|
||||
} else {
|
||||
console.error('Erwartete Daten im "Statis"-Array nicht gefunden', jsonResponse);
|
||||
setGisStationsMeasurements([]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Laden der Daten: ", error);
|
||||
setGisStationsMeasurements([]);
|
||||
}
|
||||
};
|
||||
export const fetchGisSystemStatic = async (url, setGisSystemStatic, setGisSystemStaticLoaded) => {
|
||||
try {
|
||||
const response = await fetch(url);
|
||||
const jsonResponse = await response.json();
|
||||
if (jsonResponse && jsonResponse.Systems) {
|
||||
setGisSystemStatic(jsonResponse.Systems);
|
||||
setGisSystemStaticLoaded(true);
|
||||
} else {
|
||||
console.error('Erwartete Daten im "Systems"-Array nicht gefunden', jsonResponse);
|
||||
setGisSystemStatic([]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Fehler beim Laden der Daten: ", error);
|
||||
setGisSystemStatic([]);
|
||||
}
|
||||
};
|
||||
13
services/mockApi/fetchDeviceNameById.js
Normal file
13
services/mockApi/fetchDeviceNameById.js
Normal file
@@ -0,0 +1,13 @@
|
||||
export const fetchDeviceNameById = async (idLD) => {
|
||||
console.log("⚠️ Mock-API: fetchDeviceNameById wird verwendet!");
|
||||
|
||||
// Simulierte Rückgabe basierend auf der ID (du kannst hier mehrere Fälle abdecken)
|
||||
const mockData = {
|
||||
50922: "CPL Ismael",
|
||||
50950: "LTEModem",
|
||||
50951: "GMA ISA",
|
||||
// hier kannst du beliebig weitere hinzufügen, wenn du möchtest
|
||||
};
|
||||
|
||||
return mockData[idLD] || "Unbekanntes Gerät";
|
||||
};
|
||||
23
services/mockApi/fetchGisStationsMeasurements.js
Normal file
23
services/mockApi/fetchGisStationsMeasurements.js
Normal file
@@ -0,0 +1,23 @@
|
||||
export const fetchGisStationsMeasurements = async (url, setGisStationsMeasurements) => {
|
||||
console.log("⚠️ Mock-API: fetchGisStationsMeasurements wird verwendet!");
|
||||
|
||||
const mockData = {
|
||||
Name: "Liste aller Messungen der Geraete",
|
||||
Zeitstempel: "2025-03-05T12:23:16.0756875+01:00",
|
||||
IdMap: "12",
|
||||
Statis: [
|
||||
{
|
||||
IdLD: 50951,
|
||||
IdL: 24101,
|
||||
IdDP: 3,
|
||||
Na: "FBT",
|
||||
Val: "5",
|
||||
Unit: "°C", // Umlaut korrigiert
|
||||
Gr: "GMA",
|
||||
Area_Name: "Rastede",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
setGisStationsMeasurements(mockData.Statis); // Die Komponente erwartet direkt das Array
|
||||
};
|
||||
68
services/mockApi/fetchGisStationsStaticDistrict.js
Normal file
68
services/mockApi/fetchGisStationsStaticDistrict.js
Normal file
@@ -0,0 +1,68 @@
|
||||
export const fetchGisStationsStaticDistrict = async (url, dispatch, fetchOptions) => {
|
||||
console.log("⚠️ Mock-API: fetchGisStationsStaticDistrict wird verwendet!");
|
||||
|
||||
const mockData = {
|
||||
Name: "Liste aller Geraete einer bestimmten Karte",
|
||||
Zeitstempel: "2025-03-05T10:51:20.8210755+01:00",
|
||||
IdMap: "12",
|
||||
Points: [
|
||||
{
|
||||
LD_Name: "CPL Ismael",
|
||||
IdLD: 50922,
|
||||
Device: "CPL V3.5 mit 24 Kü",
|
||||
Link: "cpl.aspx?ver=35&kue=24&id=50922",
|
||||
Location_Name: "Littwin",
|
||||
Location_Short: "LTW",
|
||||
IdLocation: 24101,
|
||||
Area_Name: "Rastede",
|
||||
Area_Short: "",
|
||||
IdArea: 20998,
|
||||
X: 53.246112,
|
||||
Y: 8.162241,
|
||||
Icon: 20,
|
||||
System: 1,
|
||||
Active: 1,
|
||||
},
|
||||
{
|
||||
LD_Name: "LTEModem",
|
||||
IdLD: 50950,
|
||||
Device: "LTE Modem LR77",
|
||||
Link: "lr77.aspx?ver=1&id=50950",
|
||||
Location_Name: "Littwin",
|
||||
Location_Short: "LTW",
|
||||
IdLocation: 24101,
|
||||
Area_Name: "Rastede",
|
||||
Area_Short: "",
|
||||
IdArea: 20998,
|
||||
X: 53.246112,
|
||||
Y: 8.162241,
|
||||
Icon: 12,
|
||||
System: 5,
|
||||
Active: 1,
|
||||
},
|
||||
{
|
||||
LD_Name: "GMA ISA",
|
||||
IdLD: 50951,
|
||||
Device: "Glättemeldeanlage",
|
||||
Link: "gma.aspx?ver=1&id=50951",
|
||||
Location_Name: "Littwin",
|
||||
Location_Short: "LTW",
|
||||
IdLocation: 24101,
|
||||
Area_Name: "Rastede",
|
||||
Area_Short: "",
|
||||
IdArea: 20998,
|
||||
X: 53.246112,
|
||||
Y: 8.162241,
|
||||
Icon: 1,
|
||||
System: 11,
|
||||
Active: 1,
|
||||
},
|
||||
// Die restlichen Daten fügst du genauso ein
|
||||
],
|
||||
};
|
||||
|
||||
dispatch({
|
||||
type: "SET_GIS_STATIONS",
|
||||
payload: mockData.Points,
|
||||
});
|
||||
};
|
||||
25
services/mockApi/fetchGisStationsStatusDistrict.js
Normal file
25
services/mockApi/fetchGisStationsStatusDistrict.js
Normal file
@@ -0,0 +1,25 @@
|
||||
export const fetchGisStationsStatusDistrict = async (url, setGisStationsStatusDistrict) => {
|
||||
console.log("⚠️ Mock-API: fetchGisStationsStatusDistrict wird verwendet!");
|
||||
|
||||
const mockData = {
|
||||
Name: "Liste aller Statis der Geraete",
|
||||
Zeitstempel: "2025-03-05T09:19:55.0004433+01:00",
|
||||
IdMap: "12",
|
||||
Statis: [
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 01 test", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 05 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 17 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 31 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 32 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Station offline", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "minor", Le: 3, Co: "#FFFF00", Me: "Eingang DE 02 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "minor", Le: 3, Co: "#FFFF00", Me: "KÜG 08: Überspannung gehend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "major", Le: 2, Co: "#FF9900", Me: "Eingang DE 03 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "critical", Le: 1, Co: "#FF0000", Me: "KÜG 01: Aderbruch kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "critical", Le: 1, Co: "#FF0000", Me: "KÜG 02: Aderbruch kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "critical", Le: 1, Co: "#FF0000", Me: "KÜG 03: Aderbruch kommend", Feld: 4, Icon: 0 },
|
||||
],
|
||||
};
|
||||
|
||||
setGisStationsStatusDistrict(mockData.Statis); // Die Komponente erwartet direkt das Array
|
||||
};
|
||||
25
services/mockApi/fetchGisStatusStations.js
Normal file
25
services/mockApi/fetchGisStatusStations.js
Normal file
@@ -0,0 +1,25 @@
|
||||
export const fetchGisStationsStatusDistrict = async (url, setGisStationsStatusDistrict, fetchOptions) => {
|
||||
console.log("⚠️ Mock-API: fetchGisStationsStatusDistrict wird verwendet!");
|
||||
|
||||
const mockData = {
|
||||
Name: "Liste aller Statis der Geraete",
|
||||
Zeitstempel: "2025-03-05T12:26:29.4884924+01:00",
|
||||
IdMap: "12",
|
||||
Statis: [
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 01 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 05 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 17 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 31 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Eingang DE 32 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "system", Le: 4, Co: "#FF00FF", Me: "Station offline", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "minor", Le: 3, Co: "#FFFF00", Me: "Eingang DE 02 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "minor", Le: 3, Co: "#FFFF00", Me: "KÜG 08: Überspannung gehend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "major", Le: 2, Co: "#FF9900", Me: "Eingang DE 03 kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "critical", Le: 1, Co: "#FF0000", Me: "KÜG 01: Aderbruch kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "critical", Le: 1, Co: "#FF0000", Me: "KÜG 02: Aderbruch kommend", Feld: 4, Icon: 0 },
|
||||
{ IdLD: 50922, Na: "critical", Le: 1, Co: "#FF0000", Me: "KÜG 03: Aderbruch kommend", Feld: 4, Icon: 0 },
|
||||
],
|
||||
};
|
||||
|
||||
setGisStationsStatusDistrict(mockData.Statis); // Direkt das Array übergeben
|
||||
};
|
||||
14
services/mockApi/fetchGisSystemStatic.js
Normal file
14
services/mockApi/fetchGisSystemStatic.js
Normal file
@@ -0,0 +1,14 @@
|
||||
export const fetchGisSystemStatic = async (url, setGisSystemStatic, setGisSystemStaticLoaded) => {
|
||||
console.log("⚠️ Mock-API: fetchGisSystemStatic wird verwendet!");
|
||||
|
||||
const mockData = {
|
||||
Systems: [
|
||||
{ IdSystem: 1, Name: "System A", Allow: 1 },
|
||||
{ IdSystem: 2, Name: "System B", Allow: 0 },
|
||||
{ IdSystem: 3, Name: "System C", Allow: 1 },
|
||||
],
|
||||
};
|
||||
|
||||
setGisSystemStatic(mockData.Systems);
|
||||
setGisSystemStaticLoaded(true);
|
||||
};
|
||||
12
services/mockApi/fetchPoiData.js
Normal file
12
services/mockApi/fetchPoiData.js
Normal file
@@ -0,0 +1,12 @@
|
||||
export const fetchPoiData = async (idPoi) => {
|
||||
console.log("⚠️ Mock-API: fetchPoiData wird verwendet!");
|
||||
|
||||
const mockPoiData = {
|
||||
1: { name: "Test POI 1", description: "Beschreibung für POI 1", idLD: 1001 },
|
||||
2: { name: "Test POI 2", description: "Beschreibung für POI 2", idLD: 1002 },
|
||||
3: { name: "Test POI 3", description: "Beschreibung für POI 3", idLD: 1003 },
|
||||
// hier kannst du weitere POIs ergänzen
|
||||
};
|
||||
|
||||
return mockPoiData[idPoi] || { name: "Unbekannter POI", description: "-", idLD: 0 };
|
||||
};
|
||||
59
services/mockApi/fetchUserRights.js
Normal file
59
services/mockApi/fetchUserRights.js
Normal file
@@ -0,0 +1,59 @@
|
||||
export const fetchUserRights = async () => {
|
||||
console.log("⚠️ Mock-API: fetchUserRights wird verwendet!");
|
||||
|
||||
const mockData = {
|
||||
Rights: [
|
||||
{ IdRight: 1 },
|
||||
{ IdRight: 2 },
|
||||
{ IdRight: 3 },
|
||||
{ IdRight: 5 },
|
||||
{ IdRight: 6 },
|
||||
{ IdRight: 7 },
|
||||
{ IdRight: 8 },
|
||||
{ IdRight: 10 },
|
||||
{ IdRight: 11 },
|
||||
{ IdRight: 12 },
|
||||
{ IdRight: 20 },
|
||||
{ IdRight: 22 },
|
||||
{ IdRight: 23 },
|
||||
{ IdRight: 25 },
|
||||
{ IdRight: 30 },
|
||||
{ IdRight: 40 },
|
||||
{ IdRight: 41 },
|
||||
{ IdRight: 42 },
|
||||
{ IdRight: 43 },
|
||||
{ IdRight: 44 },
|
||||
{ IdRight: 45 },
|
||||
{ IdRight: 46 },
|
||||
{ IdRight: 47 },
|
||||
{ IdRight: 48 },
|
||||
{ IdRight: 49 },
|
||||
{ IdRight: 50 },
|
||||
{ IdRight: 51 },
|
||||
{ IdRight: 52 },
|
||||
{ IdRight: 55 },
|
||||
{ IdRight: 56 },
|
||||
{ IdRight: 60 },
|
||||
{ IdRight: 61 },
|
||||
{ IdRight: 62 },
|
||||
{ IdRight: 63 },
|
||||
{ IdRight: 64 },
|
||||
{ IdRight: 65 },
|
||||
{ IdRight: 68 },
|
||||
{ IdRight: 69 },
|
||||
{ IdRight: 70 },
|
||||
{ IdRight: 71 },
|
||||
{ IdRight: 72 },
|
||||
{ IdRight: 73 },
|
||||
{ IdRight: 79 },
|
||||
{ IdRight: 80 },
|
||||
{ IdRight: 90 },
|
||||
{ IdRight: 93 },
|
||||
{ IdRight: 94 },
|
||||
{ IdRight: 95 },
|
||||
{ IdRight: 96 },
|
||||
],
|
||||
};
|
||||
|
||||
return mockData.Rights.map((right) => right.IdRight);
|
||||
};
|
||||
@@ -1,423 +0,0 @@
|
||||
// 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 };
|
||||
};
|
||||
@@ -1,7 +1,8 @@
|
||||
// utils/setupPolylines.js
|
||||
import { findClosestPoints } from "./geometryUtils";
|
||||
import handlePoiSelect from "./handlePoiSelect";
|
||||
import { updateLocationInDatabase } from "../services/apiService";
|
||||
import { updateLocationInDatabase } from "../services/api/updateLocationInDatabase";
|
||||
|
||||
import { handleEditPoi, insertNewPOI, removePOI } from "./poiUtils";
|
||||
import { parsePoint } from "./geometryUtils";
|
||||
import circleIcon from "../components/gisPolylines/icons/CircleIcon";
|
||||
|
||||
Reference in New Issue
Block a user