diff --git a/components/MapComponent.js b/components/MapComponent.js index 95eb26724..7259fe34b 100644 --- a/components/MapComponent.js +++ b/components/MapComponent.js @@ -2171,14 +2171,40 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { // Draw polyline const polyline = L.polyline(lineData.coordinates, { color }).addTo(map); - + //--------------------------- // Function to update the polyline when markers are dragged - markers.forEach((marker) => { - marker.on("drag", () => { - const newCoords = markers.map((marker) => marker.getLatLng()); - polyline.setLatLngs(newCoords); + markers.forEach((marker, index) => { + marker.on("dragend", () => { + const newCoords = marker.getLatLng(); + lineData.coordinates[index] = [newCoords.lat, newCoords.lng]; + polyline.setLatLngs(lineData.coordinates); + + // Senden der aktualisierten Koordinaten an den Server + fetch("/api/talas_v5_DB/gisLines/updateGisLines", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + idModul: lineData.idModul, + newCoordinates: lineData.coordinates, + }), + }) + .then((response) => { + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } + return response.json(); + }) + .then((data) => { + console.log("Update erfolgreich:", data); + }) + .catch((error) => { + console.error("Error updating data:", error.message); + }); }); }); + //--------------------------- // Fit map to show all markers and polylines const group = new L.featureGroup([...markers, polyline]); diff --git a/pages/api/talas_v5_DB/gisLines/updateGisLines.js b/pages/api/talas_v5_DB/gisLines/updateGisLines.js new file mode 100644 index 000000000..ccb87fb5b --- /dev/null +++ b/pages/api/talas_v5_DB/gisLines/updateGisLines.js @@ -0,0 +1,39 @@ +import mysql from "mysql"; + +const dbConfig = { + host: process.env.DB_HOST, + user: process.env.DB_USER, + password: process.env.DB_PASSWORD, + database: process.env.DB_NAME, + port: process.env.DB_PORT, +}; + +const connection = mysql.createConnection(dbConfig); +connection.connect((err) => { + if (err) { + console.error("Fehler beim Verbinden:", err.stack); + return; + } + console.log("Database connected successfully."); +}); + +export default function handler(req, res) { + if (req.method !== "POST") { + return res.status(405).json({ error: "Nur POST Methode erlaubt" }); + } + + const { idModul, newCoordinates } = req.body; + const newLineString = `LINESTRING(${newCoordinates.map((coord) => `${coord[1]} ${coord[0]}`).join(",")})`; + + const query = + "UPDATE talas_v5.gis_lines SET points = ST_GeomFromText(?) WHERE idModul = ?;"; + connection.query(query, [newLineString, idModul], (error, results) => { + if (error) { + console.error("Fehler beim Aktualisieren der gis_lines:", error); + return res + .status(500) + .json({ error: "Fehler beim Aktualisieren der gis_lines" }); + } + res.status(200).json({ success: "Updated successfully." }); + }); +}