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

Das property poiTypeId in handleSubmit in der Console

Browse Source
This commit is contained in:
ISA
2024-05-02 19:48:26 +02:00
parent c9c9e5feb3
commit 31803907b9
3 changed files with 31 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
components/ShowAddStationPopup.js
View File

@@ -1,48 +1,40 @@
// components/ShowAddStationPopup.js:
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import ReactDOM from "react-dom"; import ReactDOM from "react-dom";
const ShowAddStationPopup = ({ map, latlng }) => { const ShowAddStationPopup = ({ map, latlng }) => {
const [poiTypData2, setpoiTypData2] = useState(); // Recoil State verwenden const [poiTypData2, setPoiTypData2] = useState(); // Recoil State verwenden
const [name, setName] = useState(""); const [name, setName] = useState("");
const [poiTypeId, setPoiTypeId] = useState(""); const [poiTypeId, setPoiTypeId] = useState(""); // Initialize as string
const [latitude] = useState(latlng.lat.toFixed(5)); const [latitude] = useState(latlng.lat.toFixed(5));
const [longitude] = useState(latlng.lng.toFixed(5)); const [longitude] = useState(latlng.lng.toFixed(5));
// Effekt zum Ausgeben von poiTypData2 in der Konsole
useEffect(() => { useEffect(() => {
console.log("poiTypData2 in ShowAddStationPopup.js :", poiTypData2); const fetchPoiTypData2 = async () => {
}, [poiTypData2]);
//------------------------------------------
// Funktion zum Abrufen der poiTyp Daten
useEffect(() => {
const fetchpoiTypData2 = async () => {
try { try {
const response = await fetch("/api/poiTyp"); const response = await fetch("/api/poiTyp");
const data = await response.json(); const data = await response.json();
setpoiTypData2(data); // Daten im Recoil State speichern setPoiTypData2(data);
if (data && data.length > 0) {
setPoiTypeId(data[0].idPoiTyp); // Set initial poiTypeId to the id of the first poiType
console.log("Initial poiTypeId set in ShowAddStationPopup.js :", data[0].idPoiTyp);
}
} catch (error) { } catch (error) {
console.error("Fehler beim Abrufen der poiTyp Daten:", error); console.error("Fehler beim Abrufen der poiTyp Daten:", error);
} }
}; };
fetchpoiTypData2(); fetchPoiTypData2();
}, []); }, []);
// Effekt zum Loggen der poiTypData2, wenn sie sich ändern
useEffect(() => {
console.log("poiTypData2 aktualisiert:", poiTypData2);
}, [poiTypData2]);
//----------------------------------------------------
const handleSubmit = (event) => { const handleSubmit = (event) => {
event.preventDefault(); event.preventDefault();
console.log({ name, poiTypeId, latitude, longitude }); console.log("Daten von ShowAddStationPopup: ", {
map.closePopup(); name, // Name der Station
poiTypeId, // Typ der Station, logged as idPoiTyp
latitude, // Breitengrad
longitude, // Längengrad
});
//map.closePopup();
}; };
return ( return (
@@ -58,7 +50,7 @@ const ShowAddStationPopup = ({ map, latlng }) => {
value={name} value={name}
onChange={(e) => setName(e.target.value)} onChange={(e) => setName(e.target.value)}
placeholder="Name der Station" placeholder="Name der Station"
className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm" // Use w-full for full width className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm"
/> />
</div> </div>
<div className="flex items-center mb-4"> <div className="flex items-center mb-4">
@@ -70,17 +62,15 @@ const ShowAddStationPopup = ({ map, latlng }) => {
name="idPoiTyp2" name="idPoiTyp2"
value={poiTypeId} value={poiTypeId}
onChange={(e) => setPoiTypeId(e.target.value)} onChange={(e) => setPoiTypeId(e.target.value)}
className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm" // Adjusted width className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm"
> >
{Array.isArray(poiTypData2) && {poiTypData2 && poiTypData2.map((poiTyp, index) => (
poiTypData2.map((poiTyp, index) => ( <option key={poiTyp.idPoiTyp || index} value={poiTyp.idPoiTyp}>
<option key={poiTyp.id || index} value={poiTyp.id}>
{poiTyp.name} {poiTyp.name}
</option> </option>
))} ))}
</select> </select>
</div> </div>
<div className="flex items-center mb-4"> <div className="flex items-center mb-4">
<label htmlFor="lat" className="block mr-2 flex-none"> <label htmlFor="lat" className="block mr-2 flex-none">
Breitengrad: Breitengrad:
@@ -91,7 +81,7 @@ const ShowAddStationPopup = ({ map, latlng }) => {
name="lat" name="lat"
value={latitude} value={latitude}
readOnly readOnly
className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm" // Adjusted width className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm"
/> />
</div> </div>
<div className="flex items-center mb-4"> <div className="flex items-center mb-4">
@@ -104,7 +94,7 @@ const ShowAddStationPopup = ({ map, latlng }) => {
name="lng" name="lng"
value={longitude} value={longitude}
readOnly readOnly
className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm" // Adjusted width className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm"
/> />
</div> </div>
<button <button

8
config/config.js
View File

@@ -23,10 +23,16 @@ if (typeof window !== "undefined") {
user = url.searchParams.get("u") || "484"; // Ein weiterer Parameter aus der URL, Standardwert ist '484 admin zu testen von Stationen ausblenden und einblenden in der Card' user = url.searchParams.get("u") || "484"; // Ein weiterer Parameter aus der URL, Standardwert ist '484 admin zu testen von Stationen ausblenden und einblenden in der Card'
// Konstruktion von URLs, die auf spezifische Ressourcen auf dem Server zeigen // Konstruktion von URLs, die auf spezifische Ressourcen auf dem Server zeigen
mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${c}&idUser=${user}`; //idMap: 10, idUser: 484 /* mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${c}&idUser=${user}`; //idMap: 10, idUser: 484
mapGisStationsStatusDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap=${c}&idUser=${user}`; mapGisStationsStatusDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap=${c}&idUser=${user}`;
mapGisStationsMeasurementsUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap=${c}`; mapGisStationsMeasurementsUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap=${c}`;
mapGisSystemStaticUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=${c}&idUser=${user}`; mapGisSystemStaticUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=${c}&idUser=${user}`;
mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`; */
mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict`;
mapGisStationsStatusDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict`;
mapGisStationsMeasurementsUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements`;
mapGisSystemStaticUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic`;
mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`; mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`;
} }

3
pages/api/[...path].js
View File

@@ -2,7 +2,8 @@
import { createProxyMiddleware } from "http-proxy-middleware"; import { createProxyMiddleware } from "http-proxy-middleware";
export default createProxyMiddleware({ export default createProxyMiddleware({
target: "http://10.10.0.13", // Ziel-URL des Proxys //target: "http://10.10.0.13", // Ziel-URL des Proxys
target: "http://192.168.10.187:3000", // Ziel-URL des Proxys
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
"^/api": "/", // Optional: Entfernt /api aus dem Pfad, wenn das Backend dies nicht erfordert "^/api": "/", // Optional: Entfernt /api aus dem Pfad, wenn das Backend dies nicht erfordert