From 2c6561c89d8ccc5fedfe3063835f2a7683b08afb Mon Sep 17 00:00:00 2001 From: ISA Date: Fri, 7 Mar 2025 12:02:49 +0100 Subject: [PATCH 01/31] Mock von public Verzeichnis entfernt und von /webServiceMockData/ nutzen, in config.js ist die Konfiguration --- config/appVersion.js | 2 +- public/mockData/GisLinesStatusMock.json | 1447 ----------------- public/mockData/deviceNameByIdMock.json | 1 - .../mockData/gisStationsMeasurementsMock.json | 17 - .../gisStationsStaticDistrictMock.json | 381 ----- .../gisStationsStatusDistrictMock.json | 115 -- public/mockData/gisStationsStatusMock.json | 115 -- public/mockData/gisSystemStaticMock.json | 268 --- public/mockData/poiDataMock.json | 0 public/mockData/userRightsMock.json | 0 utils/createAndSetDevices.js | 4 +- 11 files changed, 3 insertions(+), 2347 deletions(-) delete mode 100644 public/mockData/GisLinesStatusMock.json delete mode 100644 public/mockData/deviceNameByIdMock.json delete mode 100644 public/mockData/gisStationsMeasurementsMock.json delete mode 100644 public/mockData/gisStationsStaticDistrictMock.json delete mode 100644 public/mockData/gisStationsStatusDistrictMock.json delete mode 100644 public/mockData/gisStationsStatusMock.json delete mode 100644 public/mockData/gisSystemStaticMock.json delete mode 100644 public/mockData/poiDataMock.json delete mode 100644 public/mockData/userRightsMock.json diff --git a/config/appVersion.js b/config/appVersion.js index c185c7a8c..ba4fef671 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.18"; +export const APP_VERSION = "1.1.19"; diff --git a/public/mockData/GisLinesStatusMock.json b/public/mockData/GisLinesStatusMock.json deleted file mode 100644 index f9f8df92b..000000000 --- a/public/mockData/GisLinesStatusMock.json +++ /dev/null @@ -1,1447 +0,0 @@ -{ - "Name": "Liste aller Statis der Linien", - "Zeitstempel": "2025-03-07T08:07:44.0452566+01:00", - "IdMap": "12", - "Statis": [ - { - "IdLD": 50922, - "Modul": 8, - "DpName": "KUE08_Messwertalarm", - "ModulName": "Test8", - "ModulTyp": "Kü705-FO", - "Message": "KÃœG 08: Ãœberspannung gehend", - "Level": 3, - "PrioColor": "#FFFF00", - "PrioName": "minor", - "Value": "False" - }, - { - "IdLD": 50922, - "Modul": 1, - "DpName": "KUE01_Aderbruch", - "ModulName": "Test1", - "ModulTyp": "Kü705-FO", - "Message": "KÃœG 01: Aderbruch kommend", - "Level": 1, - "PrioColor": "#FF0000", - "PrioName": "critical", - "Value": "?" - }, - { - "IdLD": 50922, - "Modul": 2, - "DpName": "KUE02_Aderbruch", - "ModulName": "Kue 2", - "ModulTyp": "Kü705-FO", - "Message": "KÃœG 02: Aderbruch kommend", - "Level": 1, - "PrioColor": "#FF0000", - "PrioName": "critical", - "Value": "?" - }, - { - "IdLD": 50922, - "Modul": 3, - "DpName": "KUE03_Aderbruch", - "ModulName": "Kue 3", - "ModulTyp": "Kü705-FO", - "Message": "KÃœG 03: Aderbruch kommend", - "Level": 1, - "PrioColor": "#FF0000", - "PrioName": "critical", - "Value": "?" - }, - { - "IdLD": 50000, - "Modul": 4, - "DpName": "KUE04_Messwert", - "ModulName": "?", - "ModulTyp": "nicht vorhanden", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "1.36 MOhm" - }, - { - "IdLD": 50000, - "Modul": 5, - "DpName": "KUE05_Messwert", - "ModulName": "?", - "ModulTyp": "nicht vorhanden", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50000, - "Modul": 6, - "DpName": "KUE06_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50000, - "Modul": 7, - "DpName": "KUE07_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50000, - "Modul": 8, - "DpName": "KUE08_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "516.72 MOhm" - }, - { - "IdLD": 50000, - "Modul": 13, - "DpName": "KUE13_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "8 MOhm" - }, - { - "IdLD": 50000, - "Modul": 1, - "DpName": "KUE01_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 2, - "DpName": "KUE02_Schleifenwert", - "ModulName": "L3", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 3, - "DpName": "KUE03_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 4, - "DpName": "KUE04_Schleifenwert", - "ModulName": "?", - "ModulTyp": "nicht vorhanden", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50000, - "Modul": 5, - "DpName": "KUE05_Schleifenwert", - "ModulName": "?", - "ModulTyp": "nicht vorhanden", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "2.78 kOhm" - }, - { - "IdLD": 50000, - "Modul": 6, - "DpName": "KUE06_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50000, - "Modul": 7, - "DpName": "KUE07_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "2.76 kOhm" - }, - { - "IdLD": 50000, - "Modul": 8, - "DpName": "KUE08_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50000, - "Modul": 9, - "DpName": "KUE09_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 10, - "DpName": "KUE10_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 11, - "DpName": "KUE11_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 12, - "DpName": "KUE12_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 13, - "DpName": "KUE13_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50000, - "Modul": 14, - "DpName": "KUE14_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 15, - "DpName": "KUE15_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 16, - "DpName": "KUE16_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 17, - "DpName": "KUE17_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 18, - "DpName": "KUE18_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 19, - "DpName": "KUE19_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 20, - "DpName": "KUE20_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 21, - "DpName": "KUE21_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 22, - "DpName": "KUE22_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 23, - "DpName": "KUE23_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50000, - "Modul": 24, - "DpName": "KUE24_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 1, - "DpName": "KUE01_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 2, - "DpName": "KUE02_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 3, - "DpName": "KUE03_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 4, - "DpName": "KUE04_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 5, - "DpName": "KUE05_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 6, - "DpName": "KUE06_Schleifenwert", - "ModulName": "?", - "ModulTyp": "KÃœSS V2", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 7, - "DpName": "KUE07_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 8, - "DpName": "KUE08_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 9, - "DpName": "KUE09_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 10, - "DpName": "KUE10_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 11, - "DpName": "KUE11_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 12, - "DpName": "KUE12_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 13, - "DpName": "KUE13_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 14, - "DpName": "KUE14_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 15, - "DpName": "KUE15_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 16, - "DpName": "KUE16_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 17, - "DpName": "KUE17_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 18, - "DpName": "KUE18_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 19, - "DpName": "KUE19_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 20, - "DpName": "KUE20_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 21, - "DpName": "KUE21_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 22, - "DpName": "KUE22_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 23, - "DpName": "KUE23_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50001, - "Modul": 24, - "DpName": "KUE24_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50011, - "Modul": 2, - "DpName": "KUE02_Messwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50011, - "Modul": 3, - "DpName": "KUE03_Messwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50011, - "Modul": 4, - "DpName": "KUE04_Messwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50011, - "Modul": 5, - "DpName": "KUE05_Messwert", - "ModulName": "?", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50011, - "Modul": 6, - "DpName": "KUE06_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50011, - "Modul": 1, - "DpName": "KUE01_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50011, - "Modul": 2, - "DpName": "KUE02_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "5.53 kOhm" - }, - { - "IdLD": 50011, - "Modul": 3, - "DpName": "KUE03_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.2 kOhm" - }, - { - "IdLD": 50011, - "Modul": 4, - "DpName": "KUE04_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "6.09 kOhm" - }, - { - "IdLD": 50011, - "Modul": 5, - "DpName": "KUE05_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "22.37 kOhm" - }, - { - "IdLD": 50011, - "Modul": 6, - "DpName": "KUE06_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50011, - "Modul": 19, - "DpName": "KUE19_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.21 kOhm" - }, - { - "IdLD": 50063, - "Modul": 4, - "DpName": "KUE04_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50063, - "Modul": 12, - "DpName": "KUE12_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50063, - "Modul": 13, - "DpName": "KUE13_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50063, - "Modul": 14, - "DpName": "KUE14_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50063, - "Modul": 23, - "DpName": "KUE23_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50063, - "Modul": 24, - "DpName": "KUE24_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10 MOhm" - }, - { - "IdLD": 50063, - "Modul": 1, - "DpName": "KUE01_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50063, - "Modul": 2, - "DpName": "KUE02_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50063, - "Modul": 4, - "DpName": "KUE04_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50063, - "Modul": 5, - "DpName": "KUE05_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50066, - "Modul": 1, - "DpName": "KUE01_Messwert", - "ModulName": "K1", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "11 MOhm" - }, - { - "IdLD": 50066, - "Modul": 3, - "DpName": "KUE03_Messwert", - "ModulName": "K4", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50066, - "Modul": 4, - "DpName": "KUE04_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50066, - "Modul": 6, - "DpName": "KUE06_Messwert", - "ModulName": "?", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50066, - "Modul": 7, - "DpName": "KUE07_Messwert", - "ModulName": "?", - "ModulTyp": "KÃœSS V2", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "10.5 MOhm" - }, - { - "IdLD": 50066, - "Modul": 8, - "DpName": "KUE08_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50066, - "Modul": 9, - "DpName": "KUE09_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50066, - "Modul": 14, - "DpName": "KUE14_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "200 MOhm" - }, - { - "IdLD": 50066, - "Modul": 21, - "DpName": "KUE21_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "2.67 MOhm" - }, - { - "IdLD": 50066, - "Modul": 22, - "DpName": "KUE22_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "2.71 MOhm" - }, - { - "IdLD": 50066, - "Modul": 24, - "DpName": "KUE24_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "2.95 MOhm" - }, - { - "IdLD": 50066, - "Modul": 1, - "DpName": "KUE01_Schleifenwert", - "ModulName": "K1", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "2.33 kOhm" - }, - { - "IdLD": 50066, - "Modul": 2, - "DpName": "KUE02_Schleifenwert", - "ModulName": "K2", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "4.01 kOhm" - }, - { - "IdLD": 50066, - "Modul": 3, - "DpName": "KUE03_Schleifenwert", - "ModulName": "K4", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "49.10 kOhm" - }, - { - "IdLD": 50066, - "Modul": 4, - "DpName": "KUE04_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50066, - "Modul": 5, - "DpName": "KUE05_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "5.72 kOhm" - }, - { - "IdLD": 50066, - "Modul": 6, - "DpName": "KUE06_Schleifenwert", - "ModulName": "?", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50066, - "Modul": 7, - "DpName": "KUE07_Schleifenwert", - "ModulName": "?", - "ModulTyp": "KÃœSS V2", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "2.74 kOhm" - }, - { - "IdLD": 50066, - "Modul": 8, - "DpName": "KUE08_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50066, - "Modul": 14, - "DpName": "KUE14_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "5.69 kOhm" - }, - { - "IdLD": 50922, - "Modul": 5, - "DpName": "KUE05_Messwert", - "ModulName": "Kue 5", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50922, - "Modul": 6, - "DpName": "KUE06_Messwert", - "ModulName": "Kue 6", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50922, - "Modul": 7, - "DpName": "KUE07_Messwert", - "ModulName": "KUESS 7", - "ModulTyp": "KÃœSS V2", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50922, - "Modul": 8, - "DpName": "KUE08_Messwert", - "ModulName": "Test8", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50922, - "Modul": 14, - "DpName": "KUE14_Messwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 MOhm" - }, - { - "IdLD": 50922, - "Modul": 1, - "DpName": "KUE01_Schleifenwert", - "ModulName": "Test1", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 2, - "DpName": "KUE02_Schleifenwert", - "ModulName": "Kue 2", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "64.01 kOhm" - }, - { - "IdLD": 50922, - "Modul": 3, - "DpName": "KUE03_Schleifenwert", - "ModulName": "Kue 3", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "64.01 kOhm" - }, - { - "IdLD": 50922, - "Modul": 4, - "DpName": "KUE04_Schleifenwert", - "ModulName": "Kue 4", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "64.01 kOhm" - }, - { - "IdLD": 50922, - "Modul": 5, - "DpName": "KUE05_Schleifenwert", - "ModulName": "Kue 5", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 6, - "DpName": "KUE06_Schleifenwert", - "ModulName": "Kue 6", - "ModulTyp": "Kü605µC", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 7, - "DpName": "KUE07_Schleifenwert", - "ModulName": "KUESS 7", - "ModulTyp": "KÃœSS V2", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 8, - "DpName": "KUE08_Schleifenwert", - "ModulName": "Test8", - "ModulTyp": "Kü705-FO", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0.25 kOhm" - }, - { - "IdLD": 50922, - "Modul": 9, - "DpName": "KUE09_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 10, - "DpName": "KUE10_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 11, - "DpName": "KUE11_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 12, - "DpName": "KUE12_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 13, - "DpName": "KUE13_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 14, - "DpName": "KUE14_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - }, - { - "IdLD": 50922, - "Modul": 15, - "DpName": "KUE15_Schleifenwert", - "ModulName": "?", - "ModulTyp": "?", - "Message": "?", - "Level": -1, - "PrioColor": "#ffffff", - "PrioName": "?", - "Value": "0 kOhm" - } - ] -} diff --git a/public/mockData/deviceNameByIdMock.json b/public/mockData/deviceNameByIdMock.json deleted file mode 100644 index da5957ed0..000000000 --- a/public/mockData/deviceNameByIdMock.json +++ /dev/null @@ -1 +0,0 @@ -{ "50922": "CPL Ismael" } diff --git a/public/mockData/gisStationsMeasurementsMock.json b/public/mockData/gisStationsMeasurementsMock.json deleted file mode 100644 index a8cb6a815..000000000 --- a/public/mockData/gisStationsMeasurementsMock.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "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", - "Gr": "GMA", - "Area_Name": "Rastede" - } - ] -} diff --git a/public/mockData/gisStationsStaticDistrictMock.json b/public/mockData/gisStationsStaticDistrictMock.json deleted file mode 100644 index 3442a0084..000000000 --- a/public/mockData/gisStationsStaticDistrictMock.json +++ /dev/null @@ -1,381 +0,0 @@ -{ - "Name": "Liste aller Geraete einer bestimmten Karte", - "Zeitstempel": "2025-03-05T14:55:10.1184475+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 - }, - { - "LD_Name": "Cisco Router 1841 ISA", - "IdLD": 50953, - "Device": "Cisco 1841", - "Link": "cisco1841.aspx?ver=1&id=50953", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 21, - "System": 6, - "Active": 1 - }, - { - "LD_Name": "Cisco Router 1921 ISA", - "IdLD": 50954, - "Device": "Cisco 1921", - "Link": "cisco1921.aspx?ver=1&id=50954", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 21, - "System": 6, - "Active": 1 - }, - { - "LD_Name": "Cisco Router 8200 ISA", - "IdLD": 50955, - "Device": "Cisco 8200", - "Link": "cisco8200.aspx?ver=1&id=50955", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 21, - "System": 6, - "Active": 1 - }, - { - "LD_Name": "Dauerzählstelle DZ ISA", - "IdLD": 50956, - "Device": "Dauerzählstelle DZ", - "Link": "dauz.aspx?ver=1&id=50956", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 14, - "System": 110, - "Active": 1 - }, - { - "LD_Name": "ECI Gerät ISA", - "IdLD": 50957, - "Device": "ECI", - "Link": "eci.aspx?ver=1&id=50957", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 17, - "System": 2, - "Active": 1 - }, - { - "LD_Name": "LTE-Modem LR77", - "IdLD": 50958, - "Device": "LTE Modem LR77", - "Link": "lr77.aspx?ver=1&id=50958", - "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": "Glasfaserüberwachung OTU ISA", - "IdLD": 50959, - "Device": "OTU", - "Link": "otu.aspx?ver=1&id=50959", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 24, - "System": 9, - "Active": 1 - }, - { - "LD_Name": "Siemens Notrufsystem ISA", - "IdLD": 50960, - "Device": "Notruf Server NRS 2000", - "Link": "nrs_server.aspx?ver=1&id=50960", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 19, - "System": 8, - "Active": 1 - }, - { - "LD_Name": "SMS-Modem ISA", - "IdLD": 50961, - "Device": "SMS Funkmodem", - "Link": "sms_modem.aspx?ver=1&id=50961", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 12, - "System": 111, - "Active": 1 - }, - { - "LD_Name": "Basisgerät Sonstige ISA", - "IdLD": 50962, - "Device": "Basisgerät", - "Link": "basis.aspx?ver=1&id=50962", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 31, - "System": 200, - "Active": 0 - }, - { - "LD_Name": "Talasmeldestation ISA", - "IdLD": 50963, - "Device": "CPL V3.5 mit 16 Kü", - "Link": "cpl.aspx?ver=35&kue=16&id=50963", - "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": "TALAS ICL M4 Meldestation ISA", - "IdLD": 50964, - "Device": "ICL", - "Link": "icl.aspx?ver=1&id=50964", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 23, - "System": 100, - "Active": 1 - }, - { - "LD_Name": "TALAS ICL M2 Meldestation ISA", - "IdLD": 50965, - "Device": "ICL", - "Link": "icl.aspx?ver=1&id=50965", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 23, - "System": 100, - "Active": 1 - }, - { - "LD_Name": "TALAS ICL M3 Meldestation ISA", - "IdLD": 50966, - "Device": "ICL", - "Link": "icl.aspx?ver=1&id=50966", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 23, - "System": 100, - "Active": 1 - }, - { - "LD_Name": "TALAS ICL M1 Meldestation ISA", - "IdLD": 50967, - "Device": "ICL", - "Link": "icl.aspx?ver=1&id=50967", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 23, - "System": 100, - "Active": 1 - }, - { - "LD_Name": "TL-Komponente-Router ISA", - "IdLD": 50968, - "Device": "TK-Router", - "Link": "tk_router.aspx?ver=1&id=50968", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 14, - "System": 30, - "Active": 1 - }, - { - "LD_Name": "TK-Anlage Alcatel OXO ISA", - "IdLD": 50969, - "Device": "TK-Anlage Alcatel OXO", - "Link": "tk_oxo.aspx?ver=1&id=50969", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 14, - "System": 30, - "Active": 1 - }, - { - "LD_Name": "WAGO Klemmen 16 ISA", - "IdLD": 50971, - "Device": "WAGO 16 DE", - "Link": "wago.aspx?ver=1&DE=16&id=50971", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 9, - "System": 7, - "Active": 1 - }, - { - "LD_Name": "WAGO Klemmen 32 ISA", - "IdLD": 50972, - "Device": "WAGO 32 DE", - "Link": "wago.aspx?ver=1&DE=32&id=50972", - "Location_Name": "Littwin", - "Location_Short": "LTW", - "IdLocation": 24101, - "Area_Name": "Rastede", - "Area_Short": "", - "IdArea": 20998, - "X": 53.246112, - "Y": 8.162241, - "Icon": 9, - "System": 7, - "Active": 1 - } - ] -} diff --git a/public/mockData/gisStationsStatusDistrictMock.json b/public/mockData/gisStationsStatusDistrictMock.json deleted file mode 100644 index 7dd3a73ac..000000000 --- a/public/mockData/gisStationsStatusDistrictMock.json +++ /dev/null @@ -1,115 +0,0 @@ -{ - "Name": "Liste aller Statis der Geraete", - "Zeitstempel": "2025-03-05T14:56:54.4913452+01:00", - "IdMap": "12", - "Statis": [ - { - "IdLD": 50922, - "Na": "system", - "Le": 4, - "Co": "#FF00FF", - "Me": "Eingang DE 01 test5", - "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 - } - ] -} diff --git a/public/mockData/gisStationsStatusMock.json b/public/mockData/gisStationsStatusMock.json deleted file mode 100644 index ed81065c3..000000000 --- a/public/mockData/gisStationsStatusMock.json +++ /dev/null @@ -1,115 +0,0 @@ -{ - "Name": "Liste aller Statis der Geraete", - "Zeitstempel": "2025-03-05T15:04:09.206634+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 - } - ] -} diff --git a/public/mockData/gisSystemStaticMock.json b/public/mockData/gisSystemStaticMock.json deleted file mode 100644 index 3ae5800e2..000000000 --- a/public/mockData/gisSystemStaticMock.json +++ /dev/null @@ -1,268 +0,0 @@ -{ - "Name": "Liste aller angezeigten Systeme", - "Zeitstempel": "2025-03-05T15:04:55.2507517+01:00", - "IdMap": "12", - "Systems": [ - { - "IdSystem": 1, - "Name": "TALAS", - "Longname": "Talas Meldestationen", - "Allow": 1, - "Icon": 1 - }, - { - "IdSystem": 2, - "Name": "ECI", - "Longname": "ECI Geräte", - "Allow": 1, - "Icon": 2 - }, - { - "IdSystem": 3, - "Name": "ULAF", - "Longname": "ULAF Geräte", - "Allow": 0, - "Icon": 3 - }, - { - "IdSystem": 5, - "Name": "LTE Modem", - "Longname": "LR77 GSM Modems", - "Allow": 1, - "Icon": 5 - }, - { - "IdSystem": 6, - "Name": "Cisco Router", - "Longname": "Cisco Router", - "Allow": 1, - "Icon": 6 - }, - { - "IdSystem": 7, - "Name": "WAGO", - "Longname": "WAGO I/O Systeme", - "Allow": 1, - "Icon": 7 - }, - { - "IdSystem": 8, - "Name": "Siemens", - "Longname": "Siemens Notrufsysteme", - "Allow": 1, - "Icon": 8 - }, - { - "IdSystem": 9, - "Name": "OTDR", - "Longname": "Glasfaserüberwachung OTU", - "Allow": 1, - "Icon": 9 - }, - { - "IdSystem": 10, - "Name": "WDM", - "Longname": " Wavelength Division Multiplexing", - "Allow": 1, - "Icon": 10 - }, - { - "IdSystem": 11, - "Name": "GMA", - "Longname": "Glättemeldeanlagen", - "Allow": 1, - "Icon": 11 - }, - { - "IdSystem": 13, - "Name": "Messstellen", - "Longname": "Messstellen", - "Allow": 0, - "Icon": 13 - }, - { - "IdSystem": 30, - "Name": "TK-Komponenten", - "Longname": "TK-Komponenten", - "Allow": 1, - "Icon": 30 - }, - { - "IdSystem": 100, - "Name": "TALAS ICL", - "Longname": "Talas ICL Unterstationen", - "Allow": 1, - "Icon": 100 - }, - { - "IdSystem": 110, - "Name": "DAUZ", - "Longname": "Dauerzählstellen", - "Allow": 1, - "Icon": 110 - }, - { - "IdSystem": 111, - "Name": "SMS Modem", - "Longname": "SMS Modem", - "Allow": 1, - "Icon": 111 - }, - { - "IdSystem": 200, - "Name": "Sonstige", - "Longname": "Sonstige", - "Allow": 1, - "Icon": 200 - } - ], - "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 - } - ] -} diff --git a/public/mockData/poiDataMock.json b/public/mockData/poiDataMock.json deleted file mode 100644 index e69de29bb..000000000 diff --git a/public/mockData/userRightsMock.json b/public/mockData/userRightsMock.json deleted file mode 100644 index e69de29bb..000000000 diff --git a/utils/createAndSetDevices.js b/utils/createAndSetDevices.js index c592c5c53..85dd7124e 100644 --- a/utils/createAndSetDevices.js +++ b/utils/createAndSetDevices.js @@ -40,8 +40,8 @@ export const createAndSetDevices = async (systemId, setMarkersFunction, GisSyste if (config.isMockMode()) { console.log("⚠️ Mock-API: Geräte-Daten geladen"); - staticDistrictData = await fetchJsonSafely("/mockData/gisStationsStaticDistrictMock.json"); - statusDistrictData = await fetchJsonSafely("/mockData/gisStationsStatusDistrictMock.json"); + staticDistrictData = await fetchJsonSafely(config.mapGisStationsStaticDistrictUrl); + statusDistrictData = await fetchJsonSafely(config.mapGisStationsStatusDistrictUrl); } else { staticDistrictData = await fetchJsonSafely(config.mapGisStationsStaticDistrictUrl); statusDistrictData = await fetchJsonSafely(config.mapGisStationsStatusDistrictUrl); From a9d8b9f632cc1d2b9202b944aa2a6443c2b1e726 Mon Sep 17 00:00:00 2001 From: ISA Date: Fri, 7 Mar 2025 12:08:49 +0100 Subject: [PATCH 02/31] MapComponent.js etwas gereinegt von ungenutzte URLs --- components/MapComponent.js | 15 --------------- config/appVersion.js | 2 +- 2 files changed, 1 insertion(+), 16 deletions(-) diff --git a/components/MapComponent.js b/components/MapComponent.js index 64509ff23..7e587c405 100644 --- a/components/MapComponent.js +++ b/components/MapComponent.js @@ -259,14 +259,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { useEffect(() => { const fetchWebServiceMap = async () => { try { - let stationsStaticUrl = useMock ? "/mockData/gisStationsStaticDistrictMock.json" : mapGisStationsStaticDistrictUrl; - - let stationsStatusUrl = useMock ? "/mockData/gisStationsStatusDistrictMock.json" : mapGisStationsStatusDistrictUrl; - - let stationsMeasurementsUrl = useMock ? "/mockData/gisStationsMeasurementsMock.json" : mapGisStationsMeasurementsUrl; - - let systemStaticUrl = useMock ? "/mockData/gisSystemStaticMock.json" : mapGisSystemStaticUrl; - // Zähler für externe API-Aufrufe in localStorage speichern let requestCount = localStorage.getItem("fetchWebServiceMap") || 0; requestCount = parseInt(requestCount, 10); @@ -935,13 +927,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { //-------------------------------------------- const fetchGisStationsStaticDistrict = async (idMap, idUser, dispatch) => { try { - let stationsStaticUrl = useMock ? "/mockData/gisStationsStaticDistrictMock.json" : mapGisStationsStaticDistrictUrl; - - let stationsStatusUrl = useMock ? "/mockData/gisStationsStatusDistrictMock.json" : mapGisStationsStatusDistrictUrl; - - let stationsMeasurementsUrl = useMock ? "/mockData/gisStationsMeasurementsMock.json" : mapGisStationsMeasurementsUrl; - - let systemStaticUrl = useMock ? "/mockData/gisSystemStaticMock.json" : mapGisSystemStaticUrl; // API-Endpunkt mit Query-Parametern aufrufen const response = await fetch(`/api/gisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); diff --git a/config/appVersion.js b/config/appVersion.js index ba4fef671..98d707d51 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.19"; +export const APP_VERSION = "1.1.20"; From f98ee107aabda3ab5189d174a818c77219f15dcc Mon Sep 17 00:00:00 2001 From: ISA Date: Fri, 7 Mar 2025 13:21:37 +0100 Subject: [PATCH 03/31] =?UTF-8?q?fix:=20korrigiere=20URL-Generierung=20f?= =?UTF-8?q?=C3=BCr=20Polyline-Kontextmen=C3=BC=20auf=20Port=2080?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - BASE_URL für Polyline-Links angepasst auf http://10.10.0.70/talas5/devices/ - Ursache war fehlende oder fehlerhafte NEXT_PUBLIC_BASE_URL aus .env.local - Jetzt --- .env.local | 3 +++ config/appVersion.js | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/.env.local b/.env.local index a6abb14d5..7bc6bdd83 100644 --- a/.env.local +++ b/.env.local @@ -11,3 +11,6 @@ NEXT_PUBLIC_SERVER_URL="http://10.10.0.70" # oder evtl. später https://nodema NEXT_PUBLIC_ENABLE_GEOCODER=true NEXT_PUBLIC_USE_MOCK_API=true NEXT_PUBLIC_DEBUG_LOG=true + +# für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " +NEXT_PUBLIC_BASE_URL=http://10.10.0.70/talas5/devices/ \ No newline at end of file diff --git a/config/appVersion.js b/config/appVersion.js index 98d707d51..9eb9a0c22 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.20"; +export const APP_VERSION = "1.1.21"; From 5a27bc5d757b303027675512c6a1024966dca651 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Fri, 7 Mar 2025 18:13:09 +0100 Subject: [PATCH 04/31] =?UTF-8?q?WIP:=20POI->contextmenu=20->POI=20bearbei?= =?UTF-8?q?ten=20->Ger=C3=A4t:=20Dropdown?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.local | 4 +- components/DataSheet.js | 6 +-- components/MapComponent.js | 6 +-- components/pois/PoiUpdateModal.js | 14 +++-- components/pois/PoiUpdateModalWrapper.js | 35 +++++-------- config/appVersion.js | 2 +- hooks/useMapComponentState.js | 51 +++++++++++++++++-- .../gisStationsStaticDistrictSlice.js | 2 +- .../{ => webService}/gisSystemStaticSlice.js | 2 +- redux/store.js | 2 +- .../api/fetchGisStationsStaticDistrict.js | 2 +- 11 files changed, 82 insertions(+), 44 deletions(-) rename redux/slices/{ => webService}/gisStationsStaticDistrictSlice.js (91%) rename redux/slices/{ => webService}/gisSystemStaticSlice.js (79%) diff --git a/.env.local b/.env.local index 7bc6bdd83..0eede7565 100644 --- a/.env.local +++ b/.env.local @@ -7,10 +7,10 @@ DB_NAME=talas_v5 DB_PORT=3306 # Public Settings (Client braucht IP/Domain) -NEXT_PUBLIC_SERVER_URL="http://10.10.0.70" # oder evtl. später https://nodemap.firma.de +NEXT_PUBLIC_SERVER_URL="http://192.168.10.33" # oder evtl. später https://nodemap.firma.de NEXT_PUBLIC_ENABLE_GEOCODER=true NEXT_PUBLIC_USE_MOCK_API=true NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " -NEXT_PUBLIC_BASE_URL=http://10.10.0.70/talas5/devices/ \ No newline at end of file +NEXT_PUBLIC_BASE_URL=http://192.168.10.33/talas5/devices/ \ No newline at end of file diff --git a/components/DataSheet.js b/components/DataSheet.js index 9d5c2f81b..1e5733729 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -1,8 +1,8 @@ // /componentss/DataSheet.js import React, { useEffect, useState } from "react"; import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil"; -import { gisStationsStaticDistrictState } from "../redux/slices/gisStationsStaticDistrictSlice"; -import { gisSystemStaticState } from "../redux/slices/gisSystemStaticSlice"; +import { gisStationsStaticDistrictState } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; +import { gisSystemStaticState } from "../redux/slices/webService/gisSystemStaticSlice.js"; import { mapLayersState } from "../redux/slices/mapLayersSlice"; import { selectedAreaState } from "../redux/slices/selectedAreaSlice"; import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js"; @@ -10,7 +10,7 @@ import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice"; import EditModeToggle from "./EditModeToggle"; import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; // Import für Polyline-Visibility import { useSelector, useDispatch } from "react-redux"; -import { selectGisStationsStaticDistrict } from "../redux/slices/gisStationsStaticDistrictSlice"; +import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; import { selectPolylineVisible, setPolylineVisible } from "../redux/slices/polylineLayerVisibleSlice"; function DataSheet() { diff --git a/components/MapComponent.js b/components/MapComponent.js index 7e587c405..38eaacd33 100644 --- a/components/MapComponent.js +++ b/components/MapComponent.js @@ -40,13 +40,13 @@ import { updateLocation } from "../utils/updateBereichUtil"; import { initGeocoderFeature } from "../components/features/GeocoderFeature"; //-------------------------------------------- //import { currentPoiState } from "../redux/slices/currentPoiSlice.js"; -import { selectGisStationsStaticDistrict, setGisStationsStaticDistrict } from "../redux/slices/gisStationsStaticDistrictSlice"; +import { selectGisStationsStaticDistrict, setGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; import { mapIdState, userIdState } from "../redux/slices/urlParameterSlice.js"; import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice.js"; import { selectedPoiState } from "../redux/slices/selectedPoiSlice.js"; import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice"; -import { gisStationsStaticDistrictState } from "../redux/slices/gisStationsStaticDistrictSlice"; -import { gisSystemStaticState } from "../redux/slices/gisSystemStaticSlice"; +import { gisStationsStaticDistrictState } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; +import { gisSystemStaticState } from "../redux/slices/webService/gisSystemStaticSlice"; import { mapLayersState } from "../redux/slices/mapLayersSlice"; import { selectedAreaState } from "../redux/slices/selectedAreaSlice"; import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js"; diff --git a/components/pois/PoiUpdateModal.js b/components/pois/PoiUpdateModal.js index 87979cdda..801b81d22 100644 --- a/components/pois/PoiUpdateModal.js +++ b/components/pois/PoiUpdateModal.js @@ -5,9 +5,11 @@ import { useRecoilState } from "recoil"; import { selectedPoiState } from "../../redux/slices/selectedPoiSlice"; import { currentPoiState } from "../../redux/slices/currentPoiSlice"; import { mapLayersState } from "../../redux/slices/mapLayersSlice"; +import { useSelector } from "react-redux"; +import { selectCurrentPoi } from "../../redux/slices/currentPoiSlice"; const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => { - const currentPoi = useRecoilState(currentPoiState); + const currentPoi = useSelector(selectCurrentPoi); const selectedPoi = useRecoilState(selectedPoiState); const [mapLayersVisibility] = useRecoilState(mapLayersState); @@ -168,10 +170,12 @@ const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => { }; // Erstelle Optionen für react-select - const poiTypeOptions = poiTypData.map((poiTyp) => ({ - value: poiTyp.idPoiTyp, - label: poiTyp.name, - })); + const poiTypeOptions = Array.isArray(poiTypData) + ? poiTypData.map((poiTyp) => ({ + value: poiTyp.idPoiTyp, + label: poiTyp.name, + })) + : []; // Falls kein Array, dann leeres Array zurückgeben const deviceOptions = filteredDevices.map((device) => ({ value: device.name, diff --git a/components/pois/PoiUpdateModalWrapper.js b/components/pois/PoiUpdateModalWrapper.js index 4916c9cd6..7a2273b6e 100644 --- a/components/pois/PoiUpdateModalWrapper.js +++ b/components/pois/PoiUpdateModalWrapper.js @@ -1,26 +1,17 @@ // components/pois/PoiUpdateModalWrapper.js -import React, { useState } from "react"; -import PoiUpdateModal from "./PoiUpdateModal"; -import { useRecoilValue, useSetRecoilState } from "recoil"; -import { currentPoiState, selectedPoiState } from "../../redux/slices/currentPoiSlice"; -import { poiReadFromDbTriggerAtom } from "../../redux/slices/poiReadFromDbTriggerSlice"; +import { useDispatch } from "react-redux"; +import { setCurrentPoi } from "../../redux/slices/currentPoiSlice"; -const PoiUpdateModalWrapper = ({ show, onClose, latlng }) => { - const setSelectedPoi = useSetRecoilState(selectedPoiState); - const setCurrentPoi = useSetRecoilState(currentPoiState); - const currentPoi = useRecoilValue(currentPoiState); - const poiReadTrigger = useRecoilValue(poiReadFromDbTriggerAtom); +const PoiUpdateModalWrapper = ({ show, onClose, latlng, poiData }) => { + const dispatch = useDispatch(); - return ( - show && ( - {}} // Add your submit logic here - latlng={latlng} - /> - ) - ); + useEffect(() => { + if (show && poiData) { + dispatch(setCurrentPoi(poiData)); + } + }, [show, poiData, dispatch]); + + const currentPoi = useSelector(selectCurrentPoi); // Direkt aus Redux holen + + return show && {}} latlng={latlng} />; }; - -export default PoiUpdateModalWrapper; diff --git a/config/appVersion.js b/config/appVersion.js index 9eb9a0c22..478b913dd 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.21"; +export const APP_VERSION = "1.1.22"; diff --git a/hooks/useMapComponentState.js b/hooks/useMapComponentState.js index 043239c51..ed677c13f 100644 --- a/hooks/useMapComponentState.js +++ b/hooks/useMapComponentState.js @@ -1,12 +1,13 @@ // hooks/useMapComponentState.js +// POI -> Kontextmenü -> POI bearbeiten -> Dropdown Geräteauswahl import { useState, useEffect } from "react"; -import usePoiTypData from "./usePoiTypData"; import { useRecoilValue } from "recoil"; import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice"; import { isMockMode } from "../config/config"; export const useMapComponentState = () => { - const { poiTypData, isPoiTypLoaded } = usePoiTypData("/api/talas_v5_DB/poiTyp/readPoiTyp"); + const [poiTypData, setPoiTypData] = useState([]); + const [isPoiTypLoaded, setIsPoiTypLoaded] = useState(false); const [deviceName, setDeviceName] = useState(""); const [locationDeviceData, setLocationDeviceData] = useState([]); const [priorityConfig, setPriorityConfig] = useState([]); @@ -14,11 +15,52 @@ export const useMapComponentState = () => { const poiLayerVisible = useRecoilValue(poiLayerVisibleState); useEffect(() => { + const fetchPoiTypData = async () => { + if (isMockMode()) { + console.log("⚠️ Mock-API: POI Typen geladen (Mock)"); + + const mockData = [ + { idPoiTyp: 1, name: "Mock Zähleranschlusskasten", icon: 4, onlySystemTyp: 0 }, + { idPoiTyp: 2, name: "Mock Geräteschrank", icon: 2, onlySystemTyp: 0 }, + { idPoiTyp: 4, name: "Mock Parkplatz", icon: 3, onlySystemTyp: 0 }, + { idPoiTyp: 6, name: "Mock Zufahrt", icon: 4, onlySystemTyp: 0 }, + { idPoiTyp: 20, name: "Mock Zählgerät", icon: 5, onlySystemTyp: 110 }, + { idPoiTyp: 21, name: "Mock Messschleife", icon: 6, onlySystemTyp: 110 }, + { idPoiTyp: 25, name: "Mock Sonstige", icon: 0, onlySystemTyp: 0 }, + { idPoiTyp: 33, name: "Mock Autobahnauffahrt", icon: 4, onlySystemTyp: null }, + ]; + + setPoiTypData(mockData); + setIsPoiTypLoaded(true); + return; + } + + try { + const response = await fetch("/api/talas_v5_DB/poiTyp/readPoiTyp"); + const data = await response.json(); + setPoiTypData(data); + setIsPoiTypLoaded(true); + } catch (error) { + console.error("❌ Fehler beim Abrufen der POI-Typen:", error); + setPoiTypData([]); + setIsPoiTypLoaded(true); + } + }; + const fetchDeviceData = async () => { if (isMockMode()) { - console.log("⚠️ Mock-API: Gerätedaten geladen"); + console.log("⚠️ Mock-API: Geräte für POI -> Kontextmenü -> POI bearbeiten -> Dropdown Geräteauswahl geladen (Mock)"); - const mockData = [{ name: "Mock-Gerät 1" }, { name: "Mock-Gerät 2" }]; + const mockData = [ + { idPoiTyp: 1, name: "Mock Zähleranschlusskasten", icon: 4, onlySystemTyp: 0 }, + { idPoiTyp: 2, name: "Mock Geräteschrank", icon: 2, onlySystemTyp: 0 }, + { idPoiTyp: 4, name: "Mock Parkplatz", icon: 3, onlySystemTyp: 0 }, + { idPoiTyp: 6, name: "Mock Zufahrt", icon: 4, onlySystemTyp: 0 }, + { idPoiTyp: 20, name: "Mock Zählgerät", icon: 5, onlySystemTyp: 110 }, + { idPoiTyp: 21, name: "Mock Messschleife", icon: 6, onlySystemTyp: 110 }, + { idPoiTyp: 25, name: "Mock Sonstige", icon: 0, onlySystemTyp: 0 }, + { idPoiTyp: 33, name: "Mock Autobahnauffahrt", icon: 4, onlySystemTyp: null }, + ]; setLocationDeviceData(mockData); setDeviceName(mockData[0].name); return; @@ -37,6 +79,7 @@ export const useMapComponentState = () => { } }; + fetchPoiTypData(); fetchDeviceData(); }, []); diff --git a/redux/slices/gisStationsStaticDistrictSlice.js b/redux/slices/webService/gisStationsStaticDistrictSlice.js similarity index 91% rename from redux/slices/gisStationsStaticDistrictSlice.js rename to redux/slices/webService/gisStationsStaticDistrictSlice.js index 793160377..13986b547 100644 --- a/redux/slices/gisStationsStaticDistrictSlice.js +++ b/redux/slices/webService/gisStationsStaticDistrictSlice.js @@ -1,4 +1,4 @@ -// /redux/slices/gisStationsStaticDistrictSlice.js +// /redux/slices/webService/gisStationsStaticDistrictSlice.js import { createSlice } from "@reduxjs/toolkit"; const initialState = []; diff --git a/redux/slices/gisSystemStaticSlice.js b/redux/slices/webService/gisSystemStaticSlice.js similarity index 79% rename from redux/slices/gisSystemStaticSlice.js rename to redux/slices/webService/gisSystemStaticSlice.js index ad4fb3774..1eaa77a0d 100644 --- a/redux/slices/gisSystemStaticSlice.js +++ b/redux/slices/webService/gisSystemStaticSlice.js @@ -1,4 +1,4 @@ -// /redux/slices/gisSystemStaticSlice.js +// /redux/slices/webService/gisSystemStaticSlice.js import { atom } from "recoil"; export const gisSystemStaticState = atom({ diff --git a/redux/store.js b/redux/store.js index 7c4c501b5..1544c7275 100644 --- a/redux/store.js +++ b/redux/store.js @@ -1,7 +1,7 @@ import { configureStore } from "@reduxjs/toolkit"; import lineVisibilityReducer from "./slices/lineVisibilitySlice"; import currentPoiReducer from "./slices/currentPoiSlice"; -import gisStationsStaticDistrictReducer from "./slices/gisStationsStaticDistrictSlice"; +import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsStaticDistrictSlice"; import polylineLayerVisibleReducer from "./slices/polylineLayerVisibleSlice"; export const store = configureStore({ diff --git a/services/api/fetchGisStationsStaticDistrict.js b/services/api/fetchGisStationsStaticDistrict.js index 4c933ed9d..d11652bce 100644 --- a/services/api/fetchGisStationsStaticDistrict.js +++ b/services/api/fetchGisStationsStaticDistrict.js @@ -1,4 +1,4 @@ -import { setGisStationsStaticDistrict } from "../../redux/slices/gisStationsStaticDistrictSlice"; +import { setGisStationsStaticDistrict } from "../../redux/slices/webService/gisStationsStaticDistrictSlice"; export const fetchGisStationsStaticDistrict = async (url, dispatch, fetchOptions) => { try { From c57ae7717a86c38616dacd8b5d55f8147b72d24e Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Fri, 7 Mar 2025 20:52:00 +0100 Subject: [PATCH 05/31] =?UTF-8?q?feat:=20Ger=C3=A4te-Daten=20aus=20Redux-S?= =?UTF-8?q?tore=20in=20POI-Bearbeiten-Modal=20integriert?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Geräte-Liste wird jetzt direkt aus dem Redux-Store (locationDevicesFromDB) verwendet. - Dropdown-Menü zeigt alle verfügbaren Geräte aus der Datenbank. - Beim Öffnen des Modals wird der vorher zugewiesene Gerätname automatisch ausgewählt (Pre-Selection). - Cleanup und Optimierung: Keine separaten API-Calls mehr im Modal. - Struktur verbessert durch Auslagerung der Lade-Logik in useInitLocationDevices Hook. --- components/PoiUpdateModal.js | 34 ++---- .../{ => mainComponent}/MapComponent.js | 104 +++++++++--------- .../hooks/useInitLocationDevices.js | 11 ++ components/pois/PoiUpdateModal.js | 46 ++++---- config/appVersion.js | 2 +- pages/index.js | 2 +- redux/api/fromDB/locationDevicesLoader.js | 8 ++ redux/api/fromDB/poiTypLoader.js | 0 redux/api/fromWebService/userSessionLoader.js | 0 redux/slices/db/locationDevicesFromDBSlice.js | 33 ++++++ redux/store.js | 2 + 11 files changed, 145 insertions(+), 97 deletions(-) rename components/{ => mainComponent}/MapComponent.js (91%) create mode 100644 components/mainComponent/hooks/useInitLocationDevices.js create mode 100644 redux/api/fromDB/locationDevicesLoader.js create mode 100644 redux/api/fromDB/poiTypLoader.js create mode 100644 redux/api/fromWebService/userSessionLoader.js create mode 100644 redux/slices/db/locationDevicesFromDBSlice.js diff --git a/components/PoiUpdateModal.js b/components/PoiUpdateModal.js index d9811ab53..93e07c287 100644 --- a/components/PoiUpdateModal.js +++ b/components/PoiUpdateModal.js @@ -1,11 +1,15 @@ -// pages/api/poiUpdateModal.js -// +// /components/PoiUpdateModal.js import React, { useState, useEffect } from "react"; import { useRecoilValue } from "recoil"; import { selectedPoiState } from "../redux/slices/selectedPoiSlice"; import { currentPoiState } from "../redux/slices/currentPoiSlice"; +import { fetchLocationDevicesFromDB } from "../redux/slices/db/locationDevicesFromDBSlice"; +import { useDispatch, useSelector } from "react-redux"; const PoiUpdateModal = ({ onClose, poiData }) => { + const dispatch = useDispatch(); + const devices = useSelector((state) => state.locationDevicesFromDB.devices); + const currentPoi = useRecoilValue(currentPoiState); const selectedPoi = useRecoilValue(selectedPoiState); const [poiId, setPoiId] = useState(poiData ? poiData.idPoi : ""); @@ -19,6 +23,10 @@ const PoiUpdateModal = ({ onClose, poiData }) => { const [description, setDescription] = useState(poiData ? poiData.description : ""); + useEffect(() => { + dispatch(fetchLocationDevicesFromDB()); + }, [dispatch]); + // Log the initial POI data useEffect(() => { if (poiData) { @@ -117,28 +125,6 @@ const PoiUpdateModal = ({ onClose, poiData }) => { fetchPoiTypData(); }, [selectedPoi]); - // Fetch device data um den Gerät Namen in den dropdown menu anzuzeigen also erstmal die Liste der Geräte abrufen - useEffect(() => { - const fetchData = async () => { - try { - // const response = await fetch("/api/talas_v5/location_device"); //"/api/talas_v5_DB/locationDevice/location_device" - const response = await fetch("/api/talas_v5_DB/locationDevice/locationDevices"); - const data = await response.json(); - //console.log("Standort- und Gerätedaten:", data); - setLocationDeviceData(data); - console.log("Standort- und Gerätedaten poiData:", poiData); - if (poiData && poiData.idLD) { - const selectedDevice = data.find((device) => device.id === poiData.idLD); - setDeviceName(selectedDevice ? selectedDevice.id : data[0].id); // Hier wird die ID als initialer Zustand gesetzt - console.log("Selected Device:", selectedDevice); - console.log("Selected devciceName:", deviceName); - } - } catch (error) { - console.error("Fehler beim Abrufen der Standort- und Gerätedaten:", error); - } - }; - fetchData(); - }, []); //-------------------------------------------------------------------------------------------- // Fetch device name basierend auf der Geräte-ID diff --git a/components/MapComponent.js b/components/mainComponent/MapComponent.js similarity index 91% rename from components/MapComponent.js rename to components/mainComponent/MapComponent.js index 38eaacd33..159960049 100644 --- a/components/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -4,71 +4,72 @@ import L from "leaflet"; import "leaflet/dist/leaflet.css"; import "leaflet-contextmenu/dist/leaflet.contextmenu.css"; import "leaflet-contextmenu"; -import * as config from "../config/config.js"; +import * as config from "../../config/config.js"; import "leaflet.smooth_marker_bouncing"; import OverlappingMarkerSpiderfier from "overlapping-marker-spiderfier-leaflet"; //sieht deaktiviert aber ist das nicht so und wird benötigt import "react-toastify/dist/ReactToastify.css"; -import DataSheet from "./DataSheet.js"; +import DataSheet from "../DataSheet.js"; import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil"; -import AddPoiModalWindow from "./pois/AddPoiModalWindow.js"; +import AddPoiModalWindow from "../pois/AddPoiModalWindow.js"; import { InformationCircleIcon } from "@heroicons/react/20/solid"; -import PoiUpdateModal from "./pois/PoiUpdateModal.js"; +import PoiUpdateModal from "../pois/PoiUpdateModal.js"; import { ToastContainer, toast } from "react-toastify"; -import plusRoundIcon from "./PlusRoundIcon.js"; -import { createAndSetDevices } from "../utils/createAndSetDevices.js"; -import { restoreMapSettings, checkOverlappingMarkers } from "../utils/mapUtils.js"; -import { APP_VERSION } from "../config/appVersion"; -import * as layers from "../config/layers.js"; -import { initializeMap } from "../utils/initializeMap.js"; -import addItemsToMapContextMenu from "./useMapContextMenu.js"; -import useGmaMarkersLayer from "../hooks/layers/useGmaMarkersLayer.js"; // Import the custom hook -import useSmsfunkmodemMarkersLayer from "../hooks/layers/useSmsfunkmodemMarkersLayer.js"; -import useBereicheMarkersLayer from "../hooks/layers/useBereicheMarkersLayer.js"; -import { setupPolylines } from "../utils/setupPolylines.js"; -import { setupPOIs } from "../utils/setupPOIs.js"; -import VersionInfoModal from "./VersionInfoModal.js"; -import useDrawLines from "../hooks/layers/useDrawLines"; -import useFetchPoiData from "../hooks/useFetchPoiData"; -import usePoiTypData from "../hooks/usePoiTypData"; -import useLayerVisibility from "../hooks/useLayerVisibility"; -import useLineData from "../hooks/useLineData.js"; +import plusRoundIcon from "../PlusRoundIcon.js"; +import { createAndSetDevices } from "../../utils/createAndSetDevices.js"; +import { restoreMapSettings, checkOverlappingMarkers } from "../../utils/mapUtils.js"; +import { APP_VERSION } from "../../config/appVersion.js"; +import * as layers from "../../config/layers.js"; +import { initializeMap } from "../../utils/initializeMap.js"; +import addItemsToMapContextMenu from "../useMapContextMenu.js"; +import useGmaMarkersLayer from "../../hooks/layers/useGmaMarkersLayer.js"; // Import the custom hook +import useSmsfunkmodemMarkersLayer from "../../hooks/layers/useSmsfunkmodemMarkersLayer.js"; +import useBereicheMarkersLayer from "../../hooks/layers/useBereicheMarkersLayer.js"; +import { setupPolylines } from "../../utils/setupPolylines.js"; +import { setupPOIs } from "../../utils/setupPOIs.js"; +import VersionInfoModal from "../VersionInfoModal.js"; +import useDrawLines from "../../hooks/layers/useDrawLines.js"; +import useFetchPoiData from "../../hooks/useFetchPoiData.js"; +import usePoiTypData from "../../hooks/usePoiTypData.js"; +import useLayerVisibility from "../../hooks/useLayerVisibility.js"; +import useLineData from "../../hooks/useLineData.js"; //import { useCreateAndSetDevices } from "../hooks/useCreateAndSetDevices"; -import { useMapComponentState } from "../hooks/useMapComponentState"; -import { disablePolylineEvents, enablePolylineEvents } from "../utils/setupPolylines"; -import { updateLocation } from "../utils/updateBereichUtil"; -import { initGeocoderFeature } from "../components/features/GeocoderFeature"; +import { useMapComponentState } from "../../hooks/useMapComponentState.js"; +import { disablePolylineEvents, enablePolylineEvents } from "../../utils/setupPolylines.js"; +import { updateLocation } from "../../utils/updateBereichUtil.js"; +import { initGeocoderFeature } from "../features/GeocoderFeature.js"; //-------------------------------------------- //import { currentPoiState } from "../redux/slices/currentPoiSlice.js"; -import { selectGisStationsStaticDistrict, setGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; -import { mapIdState, userIdState } from "../redux/slices/urlParameterSlice.js"; -import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice.js"; -import { selectedPoiState } from "../redux/slices/selectedPoiSlice.js"; -import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice"; -import { gisStationsStaticDistrictState } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; -import { gisSystemStaticState } from "../redux/slices/webService/gisSystemStaticSlice"; -import { mapLayersState } from "../redux/slices/mapLayersSlice"; -import { selectedAreaState } from "../redux/slices/selectedAreaSlice"; -import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js"; -import { polylineEventsDisabledState } from "../redux/slices/polylineEventsDisabledSlice"; -import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; +import { selectGisStationsStaticDistrict, setGisStationsStaticDistrict } from "../../redux/slices/webService/gisStationsStaticDistrictSlice.js"; +import { mapIdState, userIdState } from "../../redux/slices/urlParameterSlice.js"; +import { poiLayerVisibleState } from "../../redux/slices/poiLayerVisibleSlice.js"; +import { selectedPoiState } from "../../redux/slices/selectedPoiSlice.js"; +import { poiReadFromDbTriggerAtom } from "../../redux/slices/poiReadFromDbTriggerSlice.js"; +import { gisStationsStaticDistrictState } from "../../redux/slices/webService/gisStationsStaticDistrictSlice.js"; +import { gisSystemStaticState } from "../../redux/slices/webService/gisSystemStaticSlice.js"; +import { mapLayersState } from "../../redux/slices/mapLayersSlice.js"; +import { selectedAreaState } from "../../redux/slices/selectedAreaSlice.js"; +import { zoomTriggerState } from "../../redux/slices/zoomTriggerSlice.js"; +import { polylineEventsDisabledState } from "../../redux/slices/polylineEventsDisabledSlice.js"; +import { polylineLayerVisibleState } from "../../redux/slices/polylineLayerVisibleSlice.js"; //-------------------------------------------- import { useSelector, useDispatch } from "react-redux"; -import { selectCurrentPoi, setCurrentPoi, clearCurrentPoi } from "../redux/slices/currentPoiSlice"; -import CoordinateInput from "./CoordinateInput"; -import CoordinateModal from "./CoordinateModal"; -import CoordinatePopup from "./CoordinatePopup"; +import { selectCurrentPoi, setCurrentPoi, clearCurrentPoi } from "../../redux/slices/currentPoiSlice.js"; +import CoordinateInput from "../CoordinateInput.js"; +import CoordinateModal from "../CoordinateModal.js"; +import CoordinatePopup from "../CoordinatePopup.js"; //------------------------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 { 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 { fetchGisStationsStatusDistrict } from "../../services/api/fetchGisStationsStatusDistrict.js"; -import { fetchGisStationsMeasurements } from "../services/api/fetchGisStationsMeasurements.js"; -import { fetchGisSystemStatic } from "../services/api/fetchGisSystemStatic.js"; -import { usePolylineTooltipLayer } from "../hooks/usePolylineTooltipLayer"; -import { selectPolylineVisible, setPolylineVisible } from "../redux/slices/polylineLayerVisibleSlice"; +import { fetchGisStationsMeasurements } from "../../services/api/fetchGisStationsMeasurements.js"; +import { fetchGisSystemStatic } from "../../services/api/fetchGisSystemStatic.js"; +import { usePolylineTooltipLayer } from "../../hooks/usePolylineTooltipLayer.js"; +import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/polylineLayerVisibleSlice.js"; +import { useInitLocationDevices } from "./hooks/useInitLocationDevices"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); @@ -996,6 +997,9 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { }, [dispatch]); //---------------------------------------------- + // speichere location devices in redux store + useInitLocationDevices(); + //-------------------------------------- return ( <> diff --git a/components/mainComponent/hooks/useInitLocationDevices.js b/components/mainComponent/hooks/useInitLocationDevices.js new file mode 100644 index 000000000..3a5ce68dc --- /dev/null +++ b/components/mainComponent/hooks/useInitLocationDevices.js @@ -0,0 +1,11 @@ +import { useEffect } from "react"; +import { useDispatch } from "react-redux"; +import { fetchLocationDevicesFromDB } from "../../../redux/slices/db/locationDevicesFromDBSlice"; + +export const useInitLocationDevices = () => { + const dispatch = useDispatch(); + + useEffect(() => { + dispatch(fetchLocationDevicesFromDB()); + }, [dispatch]); +}; diff --git a/components/pois/PoiUpdateModal.js b/components/pois/PoiUpdateModal.js index 801b81d22..f0ae47c89 100644 --- a/components/pois/PoiUpdateModal.js +++ b/components/pois/PoiUpdateModal.js @@ -5,10 +5,13 @@ import { useRecoilState } from "recoil"; import { selectedPoiState } from "../../redux/slices/selectedPoiSlice"; import { currentPoiState } from "../../redux/slices/currentPoiSlice"; import { mapLayersState } from "../../redux/slices/mapLayersSlice"; -import { useSelector } from "react-redux"; import { selectCurrentPoi } from "../../redux/slices/currentPoiSlice"; +import { fetchLocationDevicesFromDB } from "../../redux/slices/db/locationDevicesFromDBSlice"; +import { useSelector, useDispatch } from "react-redux"; const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => { + const dispatch = useDispatch(); + const currentPoi = useSelector(selectCurrentPoi); const selectedPoi = useRecoilState(selectedPoiState); const [mapLayersVisibility] = useRecoilState(mapLayersState); @@ -43,6 +46,12 @@ const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => { Basisgerät: 200, }; + const devices = useSelector((state) => state.locationDevicesFromDB.devices); + + useEffect(() => { + dispatch(fetchLocationDevicesFromDB()); + }, [dispatch]); + useEffect(() => { if (poiData) { setPoiId(poiData.idPoi); @@ -86,23 +95,10 @@ const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => { // Fetch location devices and pre-select the current device useEffect(() => { - const fetchLocationDevices = async () => { - try { - const response = await fetch("/api/talas5/location_device"); - const data = await response.json(); - setLocationDeviceData(data); - filterDevices(data); - - if (poiData && poiData.idLD) { - const selectedDevice = data.find((device) => device.idLD === poiData.idLD); - setDeviceName(selectedDevice ? { value: selectedDevice.name, label: selectedDevice.name } : null); - } - } catch (error) { - console.error("Fehler beim Abrufen der Standort- und Gerätedaten:", error); - } - }; - fetchLocationDevices(); - }, [poiData]); + if (devices.length > 0) { + filterDevices(devices); // <-- Filter direkt die Redux-Devices + } + }, [devices]); // Funktion zum Filtern der Geräte basierend auf den aktiven Systemen (Layern) const filterDevices = (devices) => { @@ -177,10 +173,18 @@ const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => { })) : []; // Falls kein Array, dann leeres Array zurückgeben - const deviceOptions = filteredDevices.map((device) => ({ - value: device.name, - label: device.name, + const deviceOptions = devices.map((device) => ({ + value: device.idLD, // idLD ist die eindeutige ID des Geräts + label: device.name, // name ist der Anzeigename im Dropdown })); + useEffect(() => { + if (poiData && devices.length > 0) { + const selectedDevice = devices.find((device) => device.idLD === poiData.idLD); + if (selectedDevice) { + setDeviceName({ value: selectedDevice.idLD, label: selectedDevice.name }); + } + } + }, [poiData, devices]); // Custom styles for react-select const customStyles = { diff --git a/config/appVersion.js b/config/appVersion.js index 478b913dd..357f37596 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.22"; +export const APP_VERSION = "1.1.23"; diff --git a/pages/index.js b/pages/index.js index 35513d35d..c47f9627f 100644 --- a/pages/index.js +++ b/pages/index.js @@ -5,7 +5,7 @@ import { useRecoilState, useRecoilValue } from "recoil"; import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStoreSlice.js"; import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice"; -const MapComponentWithNoSSR = dynamic(() => import("../components/MapComponent"), { ssr: false }); +const MapComponentWithNoSSR = dynamic(() => import("../components/mainComponent/MapComponent"), { ssr: false }); const TestScriptWithNoSSR = dynamic(() => import("../components/TestScript"), { ssr: false }); export default function Home() { diff --git a/redux/api/fromDB/locationDevicesLoader.js b/redux/api/fromDB/locationDevicesLoader.js new file mode 100644 index 000000000..a7c4c5854 --- /dev/null +++ b/redux/api/fromDB/locationDevicesLoader.js @@ -0,0 +1,8 @@ +// /redux/api/fromDB/locationDevicesLoader.js +export const fetchLocationDevices = async () => { + const response = await fetch("/api/talas_v5_DB/locationDevice/locationDevices"); + if (!response.ok) { + throw new Error("Geräteliste konnte nicht geladen werden"); + } + return await response.json(); +}; diff --git a/redux/api/fromDB/poiTypLoader.js b/redux/api/fromDB/poiTypLoader.js new file mode 100644 index 000000000..e69de29bb diff --git a/redux/api/fromWebService/userSessionLoader.js b/redux/api/fromWebService/userSessionLoader.js new file mode 100644 index 000000000..e69de29bb diff --git a/redux/slices/db/locationDevicesFromDBSlice.js b/redux/slices/db/locationDevicesFromDBSlice.js new file mode 100644 index 000000000..efff363f9 --- /dev/null +++ b/redux/slices/db/locationDevicesFromDBSlice.js @@ -0,0 +1,33 @@ +// /redux/slices/db/locationDevicesFromDBSlice.js +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; +import { fetchLocationDevices } from "../../api/fromDB/locationDevicesLoader"; + +export const fetchLocationDevicesFromDB = createAsyncThunk("locationDevicesFromDB/fetchLocationDevicesFromDB", async () => { + return fetchLocationDevices(); +}); + +const locationDevicesFromDBSlice = createSlice({ + name: "locationDevicesFromDB", + initialState: { + devices: [], + status: "idle", + error: null, + }, + reducers: {}, + extraReducers: (builder) => { + builder + .addCase(fetchLocationDevicesFromDB.pending, (state) => { + state.status = "loading"; + }) + .addCase(fetchLocationDevicesFromDB.fulfilled, (state, action) => { + state.status = "succeeded"; + state.devices = action.payload; // <-- Hier landen die Daten + }) + .addCase(fetchLocationDevicesFromDB.rejected, (state, action) => { + state.status = "failed"; + state.error = action.error.message; + }); + }, +}); + +export default locationDevicesFromDBSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 1544c7275..5894f6049 100644 --- a/redux/store.js +++ b/redux/store.js @@ -3,6 +3,7 @@ import lineVisibilityReducer from "./slices/lineVisibilitySlice"; import currentPoiReducer from "./slices/currentPoiSlice"; import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsStaticDistrictSlice"; import polylineLayerVisibleReducer from "./slices/polylineLayerVisibleSlice"; +import locationDevicesFromDBReducer from "./slices/db/locationDevicesFromDBSlice"; export const store = configureStore({ reducer: { @@ -10,5 +11,6 @@ export const store = configureStore({ currentPoi: currentPoiReducer, gisStationsStaticDistrict: gisStationsStaticDistrictReducer, polylineLayerVisible: polylineLayerVisibleReducer, + locationDevicesFromDB: locationDevicesFromDBReducer, }, }); From 86d8e4924a370ef6b01a301e591af7b65e43c01a Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Fri, 7 Mar 2025 22:20:21 +0100 Subject: [PATCH 06/31] feat: GisStationsStaticDistrict in Redux-Store integriert MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - WebService-Endpoint für GisStationsStaticDistrict angebunden - Daten beim Start der Anwendung automatisch geladen und in Redux gespeichert - UI (DataSheet) verwendet die Daten direkt aus dem Redux-Store - Fehlerhandling und Initialzustand in Redux-Slice verbessert - Alte lokale Fetch-Logik entfernt, zentrale Datenhaltung über Redux --- components/DataSheet.js | 19 +++++----- components/mainComponent/MapComponent.js | 12 ++++-- .../hooks/useAutoRefreshLocationDevices.js | 38 +++++++++++++++++++ .../hooks/useInitGisStationsStaticDistrict.js | 12 ++++++ .../hooks/useInitLocationDevices.js | 1 + config/appVersion.js | 2 +- ...vicesLoader.js => fetchLocationDevices.js} | 2 +- .../fetchGisStationsStaticDistrict.js | 10 +++++ redux/slices/db/locationDevicesFromDBSlice.js | 2 +- .../gisStationsStaticDistrictSlice.js | 38 ++++++++++++------- redux/store.js | 4 +- 11 files changed, 110 insertions(+), 30 deletions(-) create mode 100644 components/mainComponent/hooks/useAutoRefreshLocationDevices.js create mode 100644 components/mainComponent/hooks/useInitGisStationsStaticDistrict.js rename redux/api/fromDB/{locationDevicesLoader.js => fetchLocationDevices.js} (84%) create mode 100644 redux/api/fromWebService/fetchGisStationsStaticDistrict.js diff --git a/components/DataSheet.js b/components/DataSheet.js index 1e5733729..784fe7e7b 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -20,8 +20,7 @@ function DataSheet() { const [mapLayersVisibility, setMapLayersVisibility] = useRecoilState(mapLayersState); const [stationListing, setStationListing] = useState([]); const [systemListing, setSystemListing] = useState([]); - //const GisStationsStaticDistrict = useRecoilValue(gisStationsStaticDistrictState); - const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict); + const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict) || []; const GisSystemStatic = useRecoilValue(gisSystemStaticState); const setZoomTrigger = useSetRecoilState(zoomTriggerState); const dispatch = useDispatch(); @@ -76,13 +75,15 @@ function DataSheet() { const allowedSystems = new Set(GisSystemStatic.filter((system) => system.Allow === 1).map((system) => system.IdSystem)); const seenNames = new Set(); - const filteredAreas = GisStationsStaticDistrict.filter((item) => { - const isUnique = !seenNames.has(item.Area_Name) && allowedSystems.has(item.System); - if (isUnique) { - seenNames.add(item.Area_Name); - } - return isUnique; - }); + const filteredAreas = Array.isArray(GisStationsStaticDistrict) + ? GisStationsStaticDistrict.filter((item) => { + const isUnique = !seenNames.has(item.Area_Name) && allowedSystems.has(item.System); + if (isUnique) { + seenNames.add(item.Area_Name); + } + return isUnique; + }) + : []; setStationListing( filteredAreas.map((area, index) => ({ diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 159960049..8fc400180 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -1,4 +1,4 @@ -// components/MapComponent.js +// components/mainComponent/MapComponent.js import React, { useEffect, useRef, useState, useCallback } from "react"; import L from "leaflet"; import "leaflet/dist/leaflet.css"; @@ -40,12 +40,11 @@ import { updateLocation } from "../../utils/updateBereichUtil.js"; import { initGeocoderFeature } from "../features/GeocoderFeature.js"; //-------------------------------------------- //import { currentPoiState } from "../redux/slices/currentPoiSlice.js"; -import { selectGisStationsStaticDistrict, setGisStationsStaticDistrict } from "../../redux/slices/webService/gisStationsStaticDistrictSlice.js"; + import { mapIdState, userIdState } from "../../redux/slices/urlParameterSlice.js"; import { poiLayerVisibleState } from "../../redux/slices/poiLayerVisibleSlice.js"; import { selectedPoiState } from "../../redux/slices/selectedPoiSlice.js"; import { poiReadFromDbTriggerAtom } from "../../redux/slices/poiReadFromDbTriggerSlice.js"; -import { gisStationsStaticDistrictState } from "../../redux/slices/webService/gisStationsStaticDistrictSlice.js"; import { gisSystemStaticState } from "../../redux/slices/webService/gisSystemStaticSlice.js"; import { mapLayersState } from "../../redux/slices/mapLayersSlice.js"; import { selectedAreaState } from "../../redux/slices/selectedAreaSlice.js"; @@ -70,6 +69,8 @@ import { fetchGisSystemStatic } from "../../services/api/fetchGisSystemStatic.js import { usePolylineTooltipLayer } from "../../hooks/usePolylineTooltipLayer.js"; import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/polylineLayerVisibleSlice.js"; import { useInitLocationDevices } from "./hooks/useInitLocationDevices"; +import { useInitGisStationsStaticDistrict } from "./hooks/useInitGisStationsStaticDistrict"; +import { selectGisStationsStaticDistrict } from "../../redux/slices/webService/gisStationsStaticDistrictSlice"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); @@ -999,7 +1000,12 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { //---------------------------------------------- // speichere location devices in redux store useInitLocationDevices(); + useInitGisStationsStaticDistrict(); //-------------------------------------- + useEffect(() => { + console.log("GisStationsStaticDistrict aus Redux:", GisStationsStaticDistrict); + }, [GisStationsStaticDistrict]); + //--------------------------------------- return ( <> diff --git a/components/mainComponent/hooks/useAutoRefreshLocationDevices.js b/components/mainComponent/hooks/useAutoRefreshLocationDevices.js new file mode 100644 index 000000000..df25ec554 --- /dev/null +++ b/components/mainComponent/hooks/useAutoRefreshLocationDevices.js @@ -0,0 +1,38 @@ +// components/mainComponent/hooks/useAutoRefreshLocationDevices.js +/* + Das ist erstmal nur so da, falls es gebraucht wird +Diese datei ist zum automatischen aktualisieren der LocationDevices gedacht +jeder 20 Sekunden wird die Funktion fetchLocationDevicesFromDB() aufgerufen +Daten werden dann in der Redux State gespeichert +*/ + +import { useEffect } from "react"; +import { useDispatch } from "react-redux"; +import { fetchLocationDevicesFromDB } from "../../../redux/slices/db/locationDevicesFromDBSlice"; + +export const useAutoRefreshLocationDevices = (interval = 20000) => { + // alle 20 Sekunden + const dispatch = useDispatch(); + + useEffect(() => { + const fetchData = () => { + dispatch(fetchLocationDevicesFromDB()); + }; + + fetchData(); // Sofort beim Start holen + + const intervalId = setInterval(fetchData, interval); + + return () => clearInterval(intervalId); // Cleanup beim Unmount + }, [dispatch, interval]); +}; + +/* +In MapComponent.js einbinden +import { useAutoRefreshLocationDevices } from "./hooks/useAutoRefreshLocationDevices"; + +const MapComponent = () => { + useAutoRefreshLocationDevices(); + + +*/ diff --git a/components/mainComponent/hooks/useInitGisStationsStaticDistrict.js b/components/mainComponent/hooks/useInitGisStationsStaticDistrict.js new file mode 100644 index 000000000..b53d554ad --- /dev/null +++ b/components/mainComponent/hooks/useInitGisStationsStaticDistrict.js @@ -0,0 +1,12 @@ +// /components/mainComponent/hooks/useInitGisStationsStaticDistrict.js +import { useEffect } from "react"; +import { useDispatch } from "react-redux"; +import { fetchGisStationsStaticDistrictFromWebService } from "../../../redux/slices/webService/gisStationsStaticDistrictSlice"; + +export const useInitGisStationsStaticDistrict = () => { + const dispatch = useDispatch(); + + useEffect(() => { + dispatch(fetchGisStationsStaticDistrictFromWebService()); + }, [dispatch]); +}; diff --git a/components/mainComponent/hooks/useInitLocationDevices.js b/components/mainComponent/hooks/useInitLocationDevices.js index 3a5ce68dc..9e01183b4 100644 --- a/components/mainComponent/hooks/useInitLocationDevices.js +++ b/components/mainComponent/hooks/useInitLocationDevices.js @@ -1,3 +1,4 @@ +// /components/mainComponent/hooks/useInitLocationDevices.js import { useEffect } from "react"; import { useDispatch } from "react-redux"; import { fetchLocationDevicesFromDB } from "../../../redux/slices/db/locationDevicesFromDBSlice"; diff --git a/config/appVersion.js b/config/appVersion.js index 357f37596..7b2a28234 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.23"; +export const APP_VERSION = "1.1.24"; diff --git a/redux/api/fromDB/locationDevicesLoader.js b/redux/api/fromDB/fetchLocationDevices.js similarity index 84% rename from redux/api/fromDB/locationDevicesLoader.js rename to redux/api/fromDB/fetchLocationDevices.js index a7c4c5854..53595dbdb 100644 --- a/redux/api/fromDB/locationDevicesLoader.js +++ b/redux/api/fromDB/fetchLocationDevices.js @@ -1,4 +1,4 @@ -// /redux/api/fromDB/locationDevicesLoader.js +// /redux/api/fromDB/fetchLocationDevices.js export const fetchLocationDevices = async () => { const response = await fetch("/api/talas_v5_DB/locationDevice/locationDevices"); if (!response.ok) { diff --git a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js new file mode 100644 index 000000000..d45e0b592 --- /dev/null +++ b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js @@ -0,0 +1,10 @@ +// /redux/api/fromWebService/fetchGisStationsStaticDistrict.js +import { mapGisStationsStaticDistrictUrl } from "../../../config/config"; + +export const fetchGisStationsStaticDistrict = async () => { + const response = await fetch(mapGisStationsStaticDistrictUrl); + if (!response.ok) { + throw new Error("GisStationsStaticDistrict konnte nicht geladen werden"); + } + return await response.json(); +}; diff --git a/redux/slices/db/locationDevicesFromDBSlice.js b/redux/slices/db/locationDevicesFromDBSlice.js index efff363f9..bc36b7b70 100644 --- a/redux/slices/db/locationDevicesFromDBSlice.js +++ b/redux/slices/db/locationDevicesFromDBSlice.js @@ -1,6 +1,6 @@ // /redux/slices/db/locationDevicesFromDBSlice.js import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; -import { fetchLocationDevices } from "../../api/fromDB/locationDevicesLoader"; +import { fetchLocationDevices } from "../../api/fromDB/fetchLocationDevices"; export const fetchLocationDevicesFromDB = createAsyncThunk("locationDevicesFromDB/fetchLocationDevicesFromDB", async () => { return fetchLocationDevices(); diff --git a/redux/slices/webService/gisStationsStaticDistrictSlice.js b/redux/slices/webService/gisStationsStaticDistrictSlice.js index 13986b547..7c7780cd6 100644 --- a/redux/slices/webService/gisStationsStaticDistrictSlice.js +++ b/redux/slices/webService/gisStationsStaticDistrictSlice.js @@ -1,23 +1,35 @@ // /redux/slices/webService/gisStationsStaticDistrictSlice.js -import { createSlice } from "@reduxjs/toolkit"; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; +import { fetchGisStationsStaticDistrict } from "../../api/fromWebService/fetchGisStationsStaticDistrict"; -const initialState = []; +export const fetchGisStationsStaticDistrictFromWebService = createAsyncThunk("gisStationsStaticDistrict/fetchGisStationsStaticDistrictFromWebService", async () => { + return fetchGisStationsStaticDistrict(); +}); const gisStationsStaticDistrictSlice = createSlice({ name: "gisStationsStaticDistrict", - initialState, - reducers: { - setGisStationsStaticDistrict: (state, action) => { - return action.payload; - }, - clearGisStationsStaticDistrict: () => { - return []; - }, + initialState: { + data: [], + status: "idle", + error: null, + }, + reducers: {}, + extraReducers: (builder) => { + builder + .addCase(fetchGisStationsStaticDistrictFromWebService.pending, (state) => { + state.status = "loading"; + }) + .addCase(fetchGisStationsStaticDistrictFromWebService.fulfilled, (state, action) => { + state.status = "succeeded"; + state.data = action.payload; + }) + .addCase(fetchGisStationsStaticDistrictFromWebService.rejected, (state, action) => { + state.status = "failed"; + state.error = action.error.message; + }); }, }); -export const { setGisStationsStaticDistrict, clearGisStationsStaticDistrict } = gisStationsStaticDistrictSlice.actions; - -export const selectGisStationsStaticDistrict = (state) => state.gisStationsStaticDistrict; +export const selectGisStationsStaticDistrict = (state) => state.gisStationsStaticDistrict.data; export default gisStationsStaticDistrictSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 5894f6049..742678a30 100644 --- a/redux/store.js +++ b/redux/store.js @@ -1,16 +1,16 @@ import { configureStore } from "@reduxjs/toolkit"; import lineVisibilityReducer from "./slices/lineVisibilitySlice"; import currentPoiReducer from "./slices/currentPoiSlice"; -import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsStaticDistrictSlice"; import polylineLayerVisibleReducer from "./slices/polylineLayerVisibleSlice"; import locationDevicesFromDBReducer from "./slices/db/locationDevicesFromDBSlice"; +import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsStaticDistrictSlice"; export const store = configureStore({ reducer: { lineVisibility: lineVisibilityReducer, currentPoi: currentPoiReducer, - gisStationsStaticDistrict: gisStationsStaticDistrictReducer, polylineLayerVisible: polylineLayerVisibleReducer, locationDevicesFromDB: locationDevicesFromDBReducer, + gisStationsStaticDistrict: gisStationsStaticDistrictReducer, }, }); From 6636f841a203b5f05dfbd0f983e0e38cf18b23d9 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Fri, 7 Mar 2025 22:33:47 +0100 Subject: [PATCH 07/31] feat: GisStationsMeasurements in Redux-Store integriert MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - API-Loader für GisStationsMeasurements erstellt - Redux-Slice für GisStationsMeasurements angelegt und im Store registriert - Initialisierungs-Hook useInitGisStationsMeasurements hinzugefügt - Daten werden jetzt beim Start automatisch geladen und zentral im Redux-Store gespeichert - Vorbereitung für spätere Nutzung in UI-Komponenten --- components/mainComponent/MapComponent.js | 4 +++ .../hooks/useInitGisStationsMeasurements.js | 12 +++++++ .../hooks/useInitGisStationsStatusDistrict.js | 12 +++++++ config/appVersion.js | 2 +- .../fetchGisStationsMeasurements.js | 10 ++++++ .../fetchGisStationsStatusDistrict.js | 10 ++++++ .../gisStationsMeasurementsSlice.js | 35 +++++++++++++++++++ .../gisStationsStatusDistrictSlice.js | 35 +++++++++++++++++++ redux/store.js | 4 +++ 9 files changed, 123 insertions(+), 1 deletion(-) create mode 100644 components/mainComponent/hooks/useInitGisStationsMeasurements.js create mode 100644 components/mainComponent/hooks/useInitGisStationsStatusDistrict.js create mode 100644 redux/api/fromWebService/fetchGisStationsMeasurements.js create mode 100644 redux/api/fromWebService/fetchGisStationsStatusDistrict.js create mode 100644 redux/slices/webService/gisStationsMeasurementsSlice.js create mode 100644 redux/slices/webService/gisStationsStatusDistrictSlice.js diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 8fc400180..c7b28b1f9 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -71,6 +71,8 @@ import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/po import { useInitLocationDevices } from "./hooks/useInitLocationDevices"; import { useInitGisStationsStaticDistrict } from "./hooks/useInitGisStationsStaticDistrict"; import { selectGisStationsStaticDistrict } from "../../redux/slices/webService/gisStationsStaticDistrictSlice"; +import { useInitGisStationsStatusDistrict } from "./hooks/useInitGisStationsStatusDistrict"; +import { useInitGisStationsMeasurements } from "./hooks/useInitGisStationsMeasurements"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); @@ -1001,6 +1003,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { // speichere location devices in redux store useInitLocationDevices(); useInitGisStationsStaticDistrict(); + useInitGisStationsStatusDistrict(); + useInitGisStationsMeasurements(); //-------------------------------------- useEffect(() => { console.log("GisStationsStaticDistrict aus Redux:", GisStationsStaticDistrict); diff --git a/components/mainComponent/hooks/useInitGisStationsMeasurements.js b/components/mainComponent/hooks/useInitGisStationsMeasurements.js new file mode 100644 index 000000000..77cedf59e --- /dev/null +++ b/components/mainComponent/hooks/useInitGisStationsMeasurements.js @@ -0,0 +1,12 @@ +// /components/mainComponent/hooks/useInitGisStationsMeasurements.js +import { useEffect } from "react"; +import { useDispatch } from "react-redux"; +import { fetchGisStationsMeasurementsFromWebService } from "../../../redux/slices/webService/gisStationsMeasurementsSlice"; + +export const useInitGisStationsMeasurements = () => { + const dispatch = useDispatch(); + + useEffect(() => { + dispatch(fetchGisStationsMeasurementsFromWebService()); + }, [dispatch]); +}; diff --git a/components/mainComponent/hooks/useInitGisStationsStatusDistrict.js b/components/mainComponent/hooks/useInitGisStationsStatusDistrict.js new file mode 100644 index 000000000..6d75ab118 --- /dev/null +++ b/components/mainComponent/hooks/useInitGisStationsStatusDistrict.js @@ -0,0 +1,12 @@ +// /componets/mainComponent/hooks/useInitGisStationsStatusDistrict.js +import { useEffect } from "react"; +import { useDispatch } from "react-redux"; +import { fetchGisStationsStatusDistrictFromWebService } from "../../../redux/slices/webService/gisStationsStatusDistrictSlice"; + +export const useInitGisStationsStatusDistrict = () => { + const dispatch = useDispatch(); + + useEffect(() => { + dispatch(fetchGisStationsStatusDistrictFromWebService()); + }, [dispatch]); +}; diff --git a/config/appVersion.js b/config/appVersion.js index 7b2a28234..505333ed3 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.24"; +export const APP_VERSION = "1.1.25"; diff --git a/redux/api/fromWebService/fetchGisStationsMeasurements.js b/redux/api/fromWebService/fetchGisStationsMeasurements.js new file mode 100644 index 000000000..04271a4c5 --- /dev/null +++ b/redux/api/fromWebService/fetchGisStationsMeasurements.js @@ -0,0 +1,10 @@ +// /redux/api/fromWebService/fetchGisStationsMeasurements.js +import { mapGisStationsMeasurementsUrl } from "../../../config/config"; + +export const fetchGisStationsMeasurements = async () => { + const response = await fetch(mapGisStationsMeasurementsUrl); + if (!response.ok) { + throw new Error("GisStationsMeasurements konnte nicht geladen werden"); + } + return await response.json(); +}; diff --git a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js new file mode 100644 index 000000000..19390fbb3 --- /dev/null +++ b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js @@ -0,0 +1,10 @@ +// /redux/api/fromWebService/fetchGisStationsStatusDistrict.js +import { mapGisStationsStatusDistrictUrl } from "../../../config/config"; + +export const fetchGisStationsStatusDistrict = async () => { + const response = await fetch(mapGisStationsStatusDistrictUrl); + if (!response.ok) { + throw new Error("GisStationsStatusDistrict konnte nicht geladen werden"); + } + return await response.json(); +}; diff --git a/redux/slices/webService/gisStationsMeasurementsSlice.js b/redux/slices/webService/gisStationsMeasurementsSlice.js new file mode 100644 index 000000000..d72c4036d --- /dev/null +++ b/redux/slices/webService/gisStationsMeasurementsSlice.js @@ -0,0 +1,35 @@ +// /redux/slices/webService/gisStationsMeasurementsSlice.js +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; +import { fetchGisStationsMeasurements } from "../../api/fromWebService/fetchGisStationsMeasurements"; + +export const fetchGisStationsMeasurementsFromWebService = createAsyncThunk("gisStationsMeasurements/fetchGisStationsMeasurementsFromWebService", async () => { + return fetchGisStationsMeasurements(); +}); + +const gisStationsMeasurementsSlice = createSlice({ + name: "gisStationsMeasurements", + initialState: { + data: [], + status: "idle", + error: null, + }, + reducers: {}, + extraReducers: (builder) => { + builder + .addCase(fetchGisStationsMeasurementsFromWebService.pending, (state) => { + state.status = "loading"; + }) + .addCase(fetchGisStationsMeasurementsFromWebService.fulfilled, (state, action) => { + state.status = "succeeded"; + state.data = action.payload; + }) + .addCase(fetchGisStationsMeasurementsFromWebService.rejected, (state, action) => { + state.status = "failed"; + state.error = action.error.message; + }); + }, +}); + +export const selectGisStationsMeasurements = (state) => state.gisStationsMeasurements.data; + +export default gisStationsMeasurementsSlice.reducer; diff --git a/redux/slices/webService/gisStationsStatusDistrictSlice.js b/redux/slices/webService/gisStationsStatusDistrictSlice.js new file mode 100644 index 000000000..ce926a9d4 --- /dev/null +++ b/redux/slices/webService/gisStationsStatusDistrictSlice.js @@ -0,0 +1,35 @@ +// /redux/slices/webService/gisStationsStatusDistrictSlice.js +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; +import { fetchGisStationsStatusDistrict } from "../../api/fromWebService/fetchGisStationsStatusDistrict"; + +export const fetchGisStationsStatusDistrictFromWebService = createAsyncThunk("gisStationsStatusDistrict/fetchGisStationsStatusDistrictFromWebService", async () => { + return fetchGisStationsStatusDistrict(); +}); + +const gisStationsStatusDistrictSlice = createSlice({ + name: "gisStationsStatusDistrict", + initialState: { + data: [], + status: "idle", + error: null, + }, + reducers: {}, + extraReducers: (builder) => { + builder + .addCase(fetchGisStationsStatusDistrictFromWebService.pending, (state) => { + state.status = "loading"; + }) + .addCase(fetchGisStationsStatusDistrictFromWebService.fulfilled, (state, action) => { + state.status = "succeeded"; + state.data = action.payload; + }) + .addCase(fetchGisStationsStatusDistrictFromWebService.rejected, (state, action) => { + state.status = "failed"; + state.error = action.error.message; + }); + }, +}); + +export const selectGisStationsStatusDistrict = (state) => state.gisStationsStatusDistrict.data; + +export default gisStationsStatusDistrictSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 742678a30..f1f2d0bf5 100644 --- a/redux/store.js +++ b/redux/store.js @@ -4,6 +4,8 @@ import currentPoiReducer from "./slices/currentPoiSlice"; import polylineLayerVisibleReducer from "./slices/polylineLayerVisibleSlice"; import locationDevicesFromDBReducer from "./slices/db/locationDevicesFromDBSlice"; import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsStaticDistrictSlice"; +import gisStationsStatusDistrictReducer from "./slices/webService/gisStationsStatusDistrictSlice"; +import gisStationsMeasurementsReducer from "./slices/webService/gisStationsMeasurementsSlice"; export const store = configureStore({ reducer: { @@ -12,5 +14,7 @@ export const store = configureStore({ polylineLayerVisible: polylineLayerVisibleReducer, locationDevicesFromDB: locationDevicesFromDBReducer, gisStationsStaticDistrict: gisStationsStaticDistrictReducer, + gisStationsStatusDistrict: gisStationsStatusDistrictReducer, + gisStationsMeasurements: gisStationsMeasurementsReducer, }, }); From 53ad8b3402ac1633da6ebf807f402147d2baf7d9 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Fri, 7 Mar 2025 23:50:42 +0100 Subject: [PATCH 08/31] feat: GisSystemStatic in Redux integriert MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - API-Response für GisSystemStatic in Redux Store gespeichert - Server-IP aus `.env.local` geladen (`NEXT_PUBLIC_API_BASE_URL`) - `idMap` und `idUser` aus URL-Parametern extrahiert - fetchGisSystemStatic angepasst für dynamische Werte - Redux Store aktualisiert und getestet --- .env.local | 3 +- components/DataSheet.js | 25 +++++++++----- components/mainComponent/MapComponent.js | 6 +++- .../hooks/useInitGisSystemStatic.js | 12 +++++++ config/appVersion.js | 2 +- .../fromWebService/fetchGisSystemStatic.js | 16 +++++++++ .../slices/webService/gisSystemStaticSlice.js | 33 ++++++++++++++++--- redux/store.js | 2 ++ 8 files changed, 83 insertions(+), 16 deletions(-) create mode 100644 components/mainComponent/hooks/useInitGisSystemStatic.js create mode 100644 redux/api/fromWebService/fetchGisSystemStatic.js diff --git a/.env.local b/.env.local index 0eede7565..8d9543dec 100644 --- a/.env.local +++ b/.env.local @@ -13,4 +13,5 @@ NEXT_PUBLIC_USE_MOCK_API=true NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " -NEXT_PUBLIC_BASE_URL=http://192.168.10.33/talas5/devices/ \ No newline at end of file +NEXT_PUBLIC_BASE_URL=http://192.168.10.33/talas5/devices/ +NEXT_PUBLIC_API_BASE_URL=http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx diff --git a/components/DataSheet.js b/components/DataSheet.js index 784fe7e7b..2af8ce31f 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -12,6 +12,7 @@ import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleS import { useSelector, useDispatch } from "react-redux"; import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; import { selectPolylineVisible, setPolylineVisible } from "../redux/slices/polylineLayerVisibleSlice"; +import { selectGisSystemStatic } from "../redux/slices/webService/gisSystemStaticSlice"; function DataSheet() { const [editMode, setEditMode] = useState(false); // Zustand für editMode @@ -21,7 +22,8 @@ function DataSheet() { const [stationListing, setStationListing] = useState([]); const [systemListing, setSystemListing] = useState([]); const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict) || []; - const GisSystemStatic = useRecoilValue(gisSystemStaticState); + const GisSystemStatic = useSelector(selectGisSystemStatic) || []; + const setZoomTrigger = useSetRecoilState(zoomTriggerState); const dispatch = useDispatch(); const polylineVisible = useSelector(selectPolylineVisible); @@ -72,7 +74,7 @@ function DataSheet() { }; useEffect(() => { - const allowedSystems = new Set(GisSystemStatic.filter((system) => system.Allow === 1).map((system) => system.IdSystem)); + const allowedSystems = Array.isArray(GisSystemStatic) ? new Set(GisSystemStatic.filter((system) => system.Allow === 1).map((system) => system.IdSystem)) : new Set(); const seenNames = new Set(); const filteredAreas = Array.isArray(GisStationsStaticDistrict) @@ -93,13 +95,15 @@ function DataSheet() { ); const seenSystemNames = new Set(); - const filteredSystems = GisSystemStatic.filter((item) => { - const isUnique = !seenSystemNames.has(item.Name) && item.Allow === 1; - if (isUnique) { - seenSystemNames.add(item.Name); - } - return isUnique; - }); + const filteredSystems = Array.isArray(GisSystemStatic) + ? GisSystemStatic.filter((item) => { + const isUnique = !seenSystemNames.has(item.Name) && item.Allow === 1; + if (isUnique) { + seenSystemNames.add(item.Name); + } + return isUnique; + }) + : []; setSystemListing( filteredSystems.map((system, index) => ({ @@ -151,6 +155,9 @@ function DataSheet() { localStorage.setItem("standorteVisible", checked); }; //------------------------------ + useEffect(() => { + console.log("GisSystemStatic aus Redux:", GisSystemStatic); // ✅ Debugging: Ist es ein Array? + }, [GisSystemStatic]); //--------------------------- return ( diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index c7b28b1f9..d924bc3f8 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -73,6 +73,8 @@ import { useInitGisStationsStaticDistrict } from "./hooks/useInitGisStationsStat import { selectGisStationsStaticDistrict } from "../../redux/slices/webService/gisStationsStaticDistrictSlice"; import { useInitGisStationsStatusDistrict } from "./hooks/useInitGisStationsStatusDistrict"; import { useInitGisStationsMeasurements } from "./hooks/useInitGisStationsMeasurements"; +import { useInitGisSystemStatic } from "./hooks/useInitGisSystemStatic"; +import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webService/gisSystemStaticSlice"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); @@ -129,7 +131,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict); const [GisStationsStatusDistrict, setGisStationsStatusDistrict] = useState([]); // Zustand für Statusdaten const [GisStationsMeasurements, setGisStationsMeasurements] = useState([]); // Zustand für Messdaten - const [GisSystemStatic, setGisSystemStatic] = useRecoilState(gisSystemStaticState); // Zustand für Systemdaten + const GisSystemStatic = useSelector(selectGisSystemStatic); // Konstanten für die URLs const mapGisStationsStaticDistrictUrl = config.mapGisStationsStaticDistrictUrl; const mapGisStationsStatusDistrictUrl = config.mapGisStationsStatusDistrictUrl; @@ -1005,6 +1007,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { useInitGisStationsStaticDistrict(); useInitGisStationsStatusDistrict(); useInitGisStationsMeasurements(); + useInitGisSystemStatic(); + //-------------------------------------- useEffect(() => { console.log("GisStationsStaticDistrict aus Redux:", GisStationsStaticDistrict); diff --git a/components/mainComponent/hooks/useInitGisSystemStatic.js b/components/mainComponent/hooks/useInitGisSystemStatic.js new file mode 100644 index 000000000..621eb7dea --- /dev/null +++ b/components/mainComponent/hooks/useInitGisSystemStatic.js @@ -0,0 +1,12 @@ +// /components/mainComponent/hooks/useInitGisStationsMeasurements.js +import { useEffect } from "react"; +import { useDispatch } from "react-redux"; +import { fetchGisSystemStaticFromWebService } from "../../../redux/slices/webService/gisSystemStaticSlice"; + +export const useInitGisSystemStatic = () => { + const dispatch = useDispatch(); + + useEffect(() => { + dispatch(fetchGisSystemStaticFromWebService()); + }, [dispatch]); +}; diff --git a/config/appVersion.js b/config/appVersion.js index 505333ed3..bbefc1393 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.25"; +export const APP_VERSION = "1.1.26"; diff --git a/redux/api/fromWebService/fetchGisSystemStatic.js b/redux/api/fromWebService/fetchGisSystemStatic.js new file mode 100644 index 000000000..311dc782a --- /dev/null +++ b/redux/api/fromWebService/fetchGisSystemStatic.js @@ -0,0 +1,16 @@ +// /redux/api/fromWebService/fetchGisSystemStatic.js +import { useSearchParams } from "next/navigation"; // Falls du Next.js 13+ nutzt + +export async function fetchGisSystemStatic() { + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || "12"; // Fallback-Wert 12 + const idUser = params.get("idUser") || "484"; // Fallback-Wert 484 + + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; // Dynamische Server-IP + + const response = await fetch(`${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); + const data = await response.json(); + + console.log("fetchGisSystemStatic API Response:", data); // ✅ Prüfen, ob API Daten liefert + return data; +} diff --git a/redux/slices/webService/gisSystemStaticSlice.js b/redux/slices/webService/gisSystemStaticSlice.js index 1eaa77a0d..5f82b93dc 100644 --- a/redux/slices/webService/gisSystemStaticSlice.js +++ b/redux/slices/webService/gisSystemStaticSlice.js @@ -1,7 +1,32 @@ // /redux/slices/webService/gisSystemStaticSlice.js -import { atom } from "recoil"; +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; +import { fetchGisSystemStatic } from "../../api/fromWebService/fetchGisSystemStatic"; -export const gisSystemStaticState = atom({ - key: "gisSystemStatic", // Eindeutiger Schlüssel (innerhalb des Projekts) - default: [], // Standardwert (Anfangszustand) +export const fetchGisSystemStaticFromWebService = createAsyncThunk("gisSystemStatic/fetchGisSystemStaticFromWebService", async () => { + const response = await fetchGisSystemStatic(); + return response.Systems || []; // ✅ Hier sicherstellen, dass nur `Systems` gespeichert wird }); + +const gisSystemStaticSlice = createSlice({ + name: "gisSystemStatic", + initialState: { + data: [], // ✅ Immer ein Array setzen + status: "idle", + error: null, + }, + reducers: { + setGisSystemStatic: (state, action) => { + state.data = action.payload.Systems || []; // ✅ Falls `Systems` fehlt, leeres Array setzen + }, + }, + extraReducers: (builder) => { + builder.addCase(fetchGisSystemStaticFromWebService.fulfilled, (state, action) => { + state.status = "succeeded"; + state.data = action.payload; // ✅ Jetzt sollte `data` direkt das `Systems`-Array enthalten + }); + }, +}); + +export const { setGisSystemStatic } = gisSystemStaticSlice.actions; +export default gisSystemStaticSlice.reducer; +export const selectGisSystemStatic = (state) => state.gisSystemStatic.data || []; diff --git a/redux/store.js b/redux/store.js index f1f2d0bf5..344a4eda4 100644 --- a/redux/store.js +++ b/redux/store.js @@ -6,6 +6,7 @@ import locationDevicesFromDBReducer from "./slices/db/locationDevicesFromDBSlice import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsStaticDistrictSlice"; import gisStationsStatusDistrictReducer from "./slices/webService/gisStationsStatusDistrictSlice"; import gisStationsMeasurementsReducer from "./slices/webService/gisStationsMeasurementsSlice"; +import gisSystemStaticReducer from "./slices/webService/gisSystemStaticSlice"; export const store = configureStore({ reducer: { @@ -16,5 +17,6 @@ export const store = configureStore({ gisStationsStaticDistrict: gisStationsStaticDistrictReducer, gisStationsStatusDistrict: gisStationsStatusDistrictReducer, gisStationsMeasurements: gisStationsMeasurementsReducer, + gisSystemStatic: gisSystemStaticReducer, }, }); From 28dbf804627f611ce25e4d717551133660106fa2 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sat, 8 Mar 2025 08:06:07 +0100 Subject: [PATCH 09/31] feat: API-URLs dynamisch aus .env.local statt config.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Alle API-URLs nutzen jetzt `process.env.NEXT_PUBLIC_API_BASE_URL` - `fetchGisStationsMeasurements`, `fetchGisStationsStaticDistrict`, `fetchGisStationsStatusDistrict`, `fetchGisSystemStatic` angepasst - `idMap` und `idUser` werden dynamisch aus URL oder `.env.local` bezogen - Entfernte `config.js`-Abhängigkeit für API-URLs - `.env.local` erlaubt jetzt flexible Server-IPs ohne Code-Anpassung --- .env.local | 2 +- components/mainComponent/MapComponent.js | 3 --- config/appVersion.js | 2 +- .../api/fromWebService/fetchGisStationsMeasurements.js | 4 ++-- .../fromWebService/fetchGisStationsStaticDistrict.js | 4 ++-- .../fromWebService/fetchGisStationsStatusDistrict.js | 4 ++-- redux/api/fromWebService/fetchGisSystemStatic.js | 10 ++++------ 7 files changed, 12 insertions(+), 17 deletions(-) diff --git a/.env.local b/.env.local index 8d9543dec..0eeebf47c 100644 --- a/.env.local +++ b/.env.local @@ -9,7 +9,7 @@ DB_PORT=3306 # Public Settings (Client braucht IP/Domain) NEXT_PUBLIC_SERVER_URL="http://192.168.10.33" # oder evtl. später https://nodemap.firma.de NEXT_PUBLIC_ENABLE_GEOCODER=true -NEXT_PUBLIC_USE_MOCK_API=true +NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index d924bc3f8..a77348c05 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -1010,9 +1010,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { useInitGisSystemStatic(); //-------------------------------------- - useEffect(() => { - console.log("GisStationsStaticDistrict aus Redux:", GisStationsStaticDistrict); - }, [GisStationsStaticDistrict]); //--------------------------------------- return ( diff --git a/config/appVersion.js b/config/appVersion.js index bbefc1393..741675367 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.26"; +export const APP_VERSION = "1.1.27"; diff --git a/redux/api/fromWebService/fetchGisStationsMeasurements.js b/redux/api/fromWebService/fetchGisStationsMeasurements.js index 04271a4c5..afe5a7ca4 100644 --- a/redux/api/fromWebService/fetchGisStationsMeasurements.js +++ b/redux/api/fromWebService/fetchGisStationsMeasurements.js @@ -1,8 +1,8 @@ // /redux/api/fromWebService/fetchGisStationsMeasurements.js -import { mapGisStationsMeasurementsUrl } from "../../../config/config"; +const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export const fetchGisStationsMeasurements = async () => { - const response = await fetch(mapGisStationsMeasurementsUrl); + const response = await fetch(`${apiBaseUrl}/GisStationsMeasurements`); if (!response.ok) { throw new Error("GisStationsMeasurements konnte nicht geladen werden"); } diff --git a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js index d45e0b592..cfef670d7 100644 --- a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js @@ -1,8 +1,8 @@ // /redux/api/fromWebService/fetchGisStationsStaticDistrict.js -import { mapGisStationsStaticDistrictUrl } from "../../../config/config"; +const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export const fetchGisStationsStaticDistrict = async () => { - const response = await fetch(mapGisStationsStaticDistrictUrl); + const response = await fetch(`${apiBaseUrl}/GisStationsStaticDistrict`); if (!response.ok) { throw new Error("GisStationsStaticDistrict konnte nicht geladen werden"); } diff --git a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js index 19390fbb3..5f9a04bd3 100644 --- a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js @@ -1,8 +1,8 @@ // /redux/api/fromWebService/fetchGisStationsStatusDistrict.js -import { mapGisStationsStatusDistrictUrl } from "../../../config/config"; +const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export const fetchGisStationsStatusDistrict = async () => { - const response = await fetch(mapGisStationsStatusDistrictUrl); + const response = await fetch(`${apiBaseUrl}/GisStationsStatusDistrict`); if (!response.ok) { throw new Error("GisStationsStatusDistrict konnte nicht geladen werden"); } diff --git a/redux/api/fromWebService/fetchGisSystemStatic.js b/redux/api/fromWebService/fetchGisSystemStatic.js index 311dc782a..ee3e75de5 100644 --- a/redux/api/fromWebService/fetchGisSystemStatic.js +++ b/redux/api/fromWebService/fetchGisSystemStatic.js @@ -1,16 +1,14 @@ // /redux/api/fromWebService/fetchGisSystemStatic.js -import { useSearchParams } from "next/navigation"; // Falls du Next.js 13+ nutzt +const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export async function fetchGisSystemStatic() { const params = new URLSearchParams(window.location.search); - const idMap = params.get("idMap") || "12"; // Fallback-Wert 12 - const idUser = params.get("idUser") || "484"; // Fallback-Wert 484 - - const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; // Dynamische Server-IP + const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; + const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; const response = await fetch(`${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); const data = await response.json(); - console.log("fetchGisSystemStatic API Response:", data); // ✅ Prüfen, ob API Daten liefert + console.log("fetchGisSystemStatic API Response:", data); return data; } From 8399a957b54fc97d884b30b2917ca4324a23c91b Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sat, 8 Mar 2025 08:52:44 +0100 Subject: [PATCH 10/31] =?UTF-8?q?feat:=20API-Requests=20f=C3=BCr=20GIS-Dat?= =?UTF-8?q?en=20korrigiert=20und=20Redux-Integration=20gefixt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Fehlerhafte Verwendung von `useRouter()` in `fetchGisStationsStaticDistrict.js` behoben - `idMap` und `idUser` in allen API-Requests über URL-Parameter gesichert - Alle API-Endpunkte getestet und sichergestellt, dass sie korrekt JSON-Daten liefern - Debugging-Logs hinzugefügt und Redux-Fehlermeldungen beseitigt - Jetzt erhalten alle Redux-Stores (`gisStationsStaticDistrict`, `gisStationsStatusDistrict`, `gisStationsMeasurements`, `gisSystemStatic`) erfolgreich die Daten ✅ Alle GIS-Daten werden jetzt korrekt in Redux gespeichert --- .env.local | 2 +- config/appVersion.js | 2 +- hooks/useMapComponentState.js | 25 ++++++------------- .../fetchGisStationsMeasurements.js | 16 ++++++++++-- .../fetchGisStationsStaticDistrict.js | 16 ++++++++++-- .../fetchGisStationsStatusDistrict.js | 16 ++++++++++-- .../fromWebService/fetchGisSystemStatic.js | 6 ++++- 7 files changed, 56 insertions(+), 27 deletions(-) diff --git a/.env.local b/.env.local index 0eeebf47c..8d9543dec 100644 --- a/.env.local +++ b/.env.local @@ -9,7 +9,7 @@ DB_PORT=3306 # Public Settings (Client braucht IP/Domain) NEXT_PUBLIC_SERVER_URL="http://192.168.10.33" # oder evtl. später https://nodemap.firma.de NEXT_PUBLIC_ENABLE_GEOCODER=true -NEXT_PUBLIC_USE_MOCK_API=false +NEXT_PUBLIC_USE_MOCK_API=true NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " diff --git a/config/appVersion.js b/config/appVersion.js index 741675367..b70952b0f 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.27"; +export const APP_VERSION = "1.1.28"; diff --git a/hooks/useMapComponentState.js b/hooks/useMapComponentState.js index ed677c13f..65e830d3b 100644 --- a/hooks/useMapComponentState.js +++ b/hooks/useMapComponentState.js @@ -48,26 +48,15 @@ export const useMapComponentState = () => { }; const fetchDeviceData = async () => { - if (isMockMode()) { - console.log("⚠️ Mock-API: Geräte für POI -> Kontextmenü -> POI bearbeiten -> Dropdown Geräteauswahl geladen (Mock)"); - - const mockData = [ - { idPoiTyp: 1, name: "Mock Zähleranschlusskasten", icon: 4, onlySystemTyp: 0 }, - { idPoiTyp: 2, name: "Mock Geräteschrank", icon: 2, onlySystemTyp: 0 }, - { idPoiTyp: 4, name: "Mock Parkplatz", icon: 3, onlySystemTyp: 0 }, - { idPoiTyp: 6, name: "Mock Zufahrt", icon: 4, onlySystemTyp: 0 }, - { idPoiTyp: 20, name: "Mock Zählgerät", icon: 5, onlySystemTyp: 110 }, - { idPoiTyp: 21, name: "Mock Messschleife", icon: 6, onlySystemTyp: 110 }, - { idPoiTyp: 25, name: "Mock Sonstige", icon: 0, onlySystemTyp: 0 }, - { idPoiTyp: 33, name: "Mock Autobahnauffahrt", icon: 4, onlySystemTyp: null }, - ]; - setLocationDeviceData(mockData); - setDeviceName(mockData[0].name); - return; - } - try { const response = await fetch("/api/talas5/location_device"); + + // Sicherstellen, dass die Antwort JSON ist + const contentType = response.headers.get("content-type"); + if (!contentType || !contentType.includes("application/json")) { + throw new Error("❌ Ungültige Antwort: Kein JSON erhalten"); + } + const data = await response.json(); setLocationDeviceData(data); diff --git a/redux/api/fromWebService/fetchGisStationsMeasurements.js b/redux/api/fromWebService/fetchGisStationsMeasurements.js index afe5a7ca4..1507fb883 100644 --- a/redux/api/fromWebService/fetchGisStationsMeasurements.js +++ b/redux/api/fromWebService/fetchGisStationsMeasurements.js @@ -1,10 +1,22 @@ // /redux/api/fromWebService/fetchGisStationsMeasurements.js +// http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx/GisStationsMeasurements?idMap=12&idUser=484 + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export const fetchGisStationsMeasurements = async () => { - const response = await fetch(`${apiBaseUrl}/GisStationsMeasurements`); + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; + const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; + + console.log("🔍 fetchGisStationsMeasurements - URL:", `${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); + + const response = await fetch(`${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); + if (!response.ok) { throw new Error("GisStationsMeasurements konnte nicht geladen werden"); } - return await response.json(); + + const data = await response.json(); + console.log("✅ fetchGisStationsMeasurements - Daten:", data); + return data; }; diff --git a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js index cfef670d7..fd2afb21a 100644 --- a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js @@ -1,10 +1,22 @@ // /redux/api/fromWebService/fetchGisStationsStaticDistrict.js +// http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx/GisStationsStaticDistrict?idMap=12&idUser=484 + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export const fetchGisStationsStaticDistrict = async () => { - const response = await fetch(`${apiBaseUrl}/GisStationsStaticDistrict`); + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; + const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; + + console.log("🔍 fetchGisStationsStaticDistrict - URL:", `${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); + + const response = await fetch(`${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); + if (!response.ok) { throw new Error("GisStationsStaticDistrict konnte nicht geladen werden"); } - return await response.json(); + + const data = await response.json(); + console.log("✅ fetchGisStationsStaticDistrict - Daten:", data); + return data; }; diff --git a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js index 5f9a04bd3..7ee86edf7 100644 --- a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js @@ -1,10 +1,22 @@ // /redux/api/fromWebService/fetchGisStationsStatusDistrict.js +// http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx/GisStationsStatusDistrict?idMap=12&idUser=484 + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export const fetchGisStationsStatusDistrict = async () => { - const response = await fetch(`${apiBaseUrl}/GisStationsStatusDistrict`); + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; + const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; + + console.log("🔍 fetchGisStationsStatusDistrict - URL:", `${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); + + const response = await fetch(`${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); + if (!response.ok) { throw new Error("GisStationsStatusDistrict konnte nicht geladen werden"); } - return await response.json(); + + const data = await response.json(); + console.log("✅ fetchGisStationsStatusDistrict - Daten:", data); + return data; }; diff --git a/redux/api/fromWebService/fetchGisSystemStatic.js b/redux/api/fromWebService/fetchGisSystemStatic.js index ee3e75de5..f0447a66b 100644 --- a/redux/api/fromWebService/fetchGisSystemStatic.js +++ b/redux/api/fromWebService/fetchGisSystemStatic.js @@ -1,4 +1,6 @@ // /redux/api/fromWebService/fetchGisSystemStatic.js +// http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx/GisSystemStatic?idMap=12&idUser=484 + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; export async function fetchGisSystemStatic() { @@ -6,9 +8,11 @@ export async function fetchGisSystemStatic() { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; + console.log("🔍 fetchGisSystemStatic - URL:", `${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); + const response = await fetch(`${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); const data = await response.json(); - console.log("fetchGisSystemStatic API Response:", data); + console.log("✅ fetchGisSystemStatic - Daten:", data); return data; } From 806347f0dd4f81ae8e219e75abeb7e34716c69c1 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sat, 8 Mar 2025 12:10:21 +0100 Subject: [PATCH 11/31] =?UTF-8?q?feat:=20Fix=20Redux-Datenstruktur=20f?= =?UTF-8?q?=C3=BCr=20GisStationsStaticDistrict=20und=20Bereichs-Dropdown?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - `GisStationsStaticDistrict` wird jetzt korrekt aus Redux gelesen und verwendet `Points` als Array. - Fehler `find is not a function` behoben durch Zugriff auf `GisStationsStaticDistrict.Points`. - Sicherstellung, dass `Points` existiert, bevor darauf zugegriffen wird. - Konsole-Logs für Debugging hinzugefügt, um leere oder ungültige Daten zu erkennen. - Bereichsauswahl im Dropdown funktioniert jetzt korrekt und fliegt zur gewählten Station auf der Karte. ✅ Tested: Dropdown zeigt jetzt die `Area_Name`-Werte und `map.flyTo()` funktioniert korrekt. --- components/DataSheet.js | 48 ++++++++++++++- components/mainComponent/MapComponent.js | 20 ++++++- .../hooks/useInitGisStationsStatic.js | 21 +++++++ config/appVersion.js | 2 +- hooks/useMapComponentState.js | 32 ++++++---- .../fetchGisStationsMeasurements.js | 4 +- .../fromWebService/fetchGisStationsStatic.js | 25 ++++++++ .../fetchGisStationsStaticDistrict.js | 4 +- .../fetchGisStationsStatusDistrict.js | 4 +- .../fromWebService/fetchGisSystemStatic.js | 4 +- .../webService/gisStationsStaticSlice.js | 58 +++++++++++++++++++ redux/store.js | 3 + 12 files changed, 201 insertions(+), 24 deletions(-) create mode 100644 components/mainComponent/hooks/useInitGisStationsStatic.js create mode 100644 redux/api/fromWebService/fetchGisStationsStatic.js create mode 100644 redux/slices/webService/gisStationsStaticSlice.js diff --git a/components/DataSheet.js b/components/DataSheet.js index 2af8ce31f..9be4d1971 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -10,9 +10,12 @@ import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice"; import EditModeToggle from "./EditModeToggle"; import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; // Import für Polyline-Visibility import { useSelector, useDispatch } from "react-redux"; -import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; import { selectPolylineVisible, setPolylineVisible } from "../redux/slices/polylineLayerVisibleSlice"; import { selectGisSystemStatic } from "../redux/slices/webService/gisSystemStaticSlice"; +import { useInitGisStationsStatic } from "../components/mainComponent/hooks/useInitGisStationsStatic"; + +import { fetchGisStationsStatic, selectGisStationsStatic } from "../redux/slices/webService/gisStationsStaticSlice"; +import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; function DataSheet() { const [editMode, setEditMode] = useState(false); // Zustand für editMode @@ -23,6 +26,7 @@ function DataSheet() { const [systemListing, setSystemListing] = useState([]); const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict) || []; const GisSystemStatic = useSelector(selectGisSystemStatic) || []; + const GisStationsStatic = useSelector(selectGisStationsStatic) || []; //Area-Name/Bereiche dropdownmenu const setZoomTrigger = useSetRecoilState(zoomTriggerState); const dispatch = useDispatch(); @@ -156,8 +160,48 @@ function DataSheet() { }; //------------------------------ useEffect(() => { - console.log("GisSystemStatic aus Redux:", GisSystemStatic); // ✅ Debugging: Ist es ein Array? + // console.log("GisSystemStatic aus Redux:", GisSystemStatic); // ✅ Debugging: Ist es ein Array? }, [GisSystemStatic]); + //----------------------------- + useInitGisStationsStatic(); + //--------------------------- + useEffect(() => { + console.log("🔍 GisStationsStatic Inhalt:", GisStationsStatic); + + if (!GisStationsStatic) { + console.warn("⚠️ GisStationsStatic ist `null` oder nicht geladen."); + return; + } + + if (typeof GisStationsStatic !== "object") { + console.warn("⚠️ GisStationsStatic ist kein Objekt:", GisStationsStatic); + return; + } + + if (!GisStationsStatic.Points || !Array.isArray(GisStationsStatic.Points)) { + console.warn("⚠️ GisStationsStatic.Points ist nicht vorhanden oder kein Array.", GisStationsStatic); + return; + } + + const seenNames = new Set(); + const filteredAreas = GisStationsStatic.Points.filter((item) => { + if (!item.Area_Name) return false; // Sicherstellen, dass Area_Name existiert + const isUnique = !seenNames.has(item.Area_Name); + if (isUnique) { + seenNames.add(item.Area_Name); + } + return isUnique; + }); + + setStationListing( + filteredAreas.map((area, index) => ({ + id: area.IdArea || index + 1, + name: area.Area_Name || "Unbekannt", + })) + ); + + console.log("📌 stationListing aktualisiert:", filteredAreas); + }, [GisStationsStatic]); //--------------------------- return ( diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index a77348c05..a25ed7987 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -647,16 +647,30 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { } }, [map]); //-------------------------------------------- - + // Bereich in DataSheet ->dropdownmenu useEffect(() => { + console.log("🔍 GisStationsStaticDistrict Inhalt:", GisStationsStaticDistrict); + + // Sicherstellen, dass `Points` existiert und ein Array ist + const points = GisStationsStaticDistrict?.Points; + if (!Array.isArray(points)) { + console.warn("⚠️ GisStationsStaticDistrict.Points ist nicht vorhanden oder kein Array.", points); + return; + } + if (selectedArea && map) { - const station = GisStationsStaticDistrict.find((s) => s.Area_Name === selectedArea); + const station = points.find((s) => s.Area_Name === selectedArea); + if (station) { + console.log("📌 Gefundene Station:", station); map.flyTo([station.X, station.Y], 14); + } else { + console.warn("⚠️ Keine passende Station für die Area gefunden:", selectedArea); } } }, [selectedArea, map, GisStationsStaticDistrict]); + //------------------------------------- useEffect(() => { if (zoomTrigger && map) { map.flyTo([51.41321407879154, 7.739617925303934], 7); @@ -945,7 +959,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { // Ergebnis im Dispatch speichern oder State aktualisieren dispatch({ type: "SET_GIS_STATIONS", payload: data }); - console.log("Daten erfolgreich geladen:", data); + //console.log("Daten erfolgreich geladen:", data); return data; // Optional: Rückgabe der Daten } catch (error) { console.error("Fehler beim Laden der GIS-Daten:", error); diff --git a/components/mainComponent/hooks/useInitGisStationsStatic.js b/components/mainComponent/hooks/useInitGisStationsStatic.js new file mode 100644 index 000000000..72831eac1 --- /dev/null +++ b/components/mainComponent/hooks/useInitGisStationsStatic.js @@ -0,0 +1,21 @@ +// /components/mainComponent/hooks/useInitGisStationsStatic.js +//Bereiche/Area-Name Dropdownmenu für Datasheet wird hier initialisiert und in der Komponente verwendet +import { useEffect } from "react"; +import { useDispatch, useSelector } from "react-redux"; +import { fetchGisStationsStatic, selectGisStationsStatic } from "../../../redux/slices/webService/gisStationsStaticSlice"; + +export const useInitGisStationsStatic = () => { + const dispatch = useDispatch(); + const gisStationsStatic = useSelector(selectGisStationsStatic); + + useEffect(() => { + console.log("🔍 useInitGisStationsStatic - Aktueller Wert:", gisStationsStatic); + + if (!gisStationsStatic || gisStationsStatic === null) { + console.log("🚀 Starte fetchGisStationsStatic..."); + dispatch(fetchGisStationsStatic()); + } + }, [gisStationsStatic, dispatch]); + + return gisStationsStatic; +}; diff --git a/config/appVersion.js b/config/appVersion.js index b70952b0f..e9ca62e94 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.28"; +export const APP_VERSION = "1.1.29"; diff --git a/hooks/useMapComponentState.js b/hooks/useMapComponentState.js index 65e830d3b..3baf0df0b 100644 --- a/hooks/useMapComponentState.js +++ b/hooks/useMapComponentState.js @@ -49,19 +49,31 @@ export const useMapComponentState = () => { const fetchDeviceData = async () => { try { - const response = await fetch("/api/talas5/location_device"); + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; - // Sicherstellen, dass die Antwort JSON ist - const contentType = response.headers.get("content-type"); - if (!contentType || !contentType.includes("application/json")) { - throw new Error("❌ Ungültige Antwort: Kein JSON erhalten"); - } + // URL-Parameter aus der aktuellen Browser-URL holen + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || "12"; // Fallback auf "12" falls nicht gesetzt - const data = await response.json(); - setLocationDeviceData(data); + const url = `${apiBaseUrl}/GisStationsStatic?idMap=${idMap}`; - if (data.length > 0) { - setDeviceName(data[0].name); + //console.log("📡 API Request URL:", url); + + const response = await fetch(url); + + //console.log("📡 API Response Status:", response.status); + // console.log("📡 API Response Headers:", response.headers.get("content-type")); + + const text = await response.text(); + //console.log("📡 API Response Text:", text); + + // JSON manuell parsen, falls die API keinen JSON-Header sendet + const data = JSON.parse(text); + + setLocationDeviceData(data.Points || []); + + if (data.Points && data.Points.length > 0) { + setDeviceName(data.Points[0].LD_Name); } } catch (error) { console.error("❌ Fehler beim Abrufen der Gerätedaten:", error); diff --git a/redux/api/fromWebService/fetchGisStationsMeasurements.js b/redux/api/fromWebService/fetchGisStationsMeasurements.js index 1507fb883..8cae2a5cc 100644 --- a/redux/api/fromWebService/fetchGisStationsMeasurements.js +++ b/redux/api/fromWebService/fetchGisStationsMeasurements.js @@ -8,7 +8,7 @@ export const fetchGisStationsMeasurements = async () => { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisStationsMeasurements - URL:", `${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); + //console.log("🔍 fetchGisStationsMeasurements - URL:", `${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); @@ -17,6 +17,6 @@ export const fetchGisStationsMeasurements = async () => { } const data = await response.json(); - console.log("✅ fetchGisStationsMeasurements - Daten:", data); + //console.log("✅ fetchGisStationsMeasurements - Daten:", data); return data; }; diff --git a/redux/api/fromWebService/fetchGisStationsStatic.js b/redux/api/fromWebService/fetchGisStationsStatic.js new file mode 100644 index 000000000..09786a338 --- /dev/null +++ b/redux/api/fromWebService/fetchGisStationsStatic.js @@ -0,0 +1,25 @@ +// /redux/api/fromWebService/fetchGisStationsStatic.js +// z.B. http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx/GisStationsStatic?idMap=12 +const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; + +export const fetchGisStationsStatic = async () => { + try { + const response = await fetch(`${apiBaseUrl}/GisStationsStatic?idMap=12`); + + //console.log("📡 API Response Status:", response.status); + //console.log("📡 API Response Headers:", response.headers.get("content-type")); + + const text = await response.text(); + console.log("📡 API Response Text von fetch:", text); + console.log("📡 API Response response von fetch:", response); + + if (!response.ok || !response.headers.get("content-type")?.includes("application/json")) { + throw new Error("❌ Fehler: Antwort ist kein gültiges JSON"); + } + + return JSON.parse(text); + } catch (error) { + console.error("❌ Fehler beim Abrufen der GIS Stations Static:", error); + return null; + } +}; diff --git a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js index fd2afb21a..3f8d79ed3 100644 --- a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js @@ -8,7 +8,7 @@ export const fetchGisStationsStaticDistrict = async () => { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisStationsStaticDistrict - URL:", `${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); + // console.log("🔍 fetchGisStationsStaticDistrict - URL:", `${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); @@ -17,6 +17,6 @@ export const fetchGisStationsStaticDistrict = async () => { } const data = await response.json(); - console.log("✅ fetchGisStationsStaticDistrict - Daten:", data); + // console.log("✅ fetchGisStationsStaticDistrict - Daten:", data); return data; }; diff --git a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js index 7ee86edf7..34faa1959 100644 --- a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js @@ -8,7 +8,7 @@ export const fetchGisStationsStatusDistrict = async () => { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisStationsStatusDistrict - URL:", `${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); + //console.log("🔍 fetchGisStationsStatusDistrict - URL:", `${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); @@ -17,6 +17,6 @@ export const fetchGisStationsStatusDistrict = async () => { } const data = await response.json(); - console.log("✅ fetchGisStationsStatusDistrict - Daten:", data); + //console.log("✅ fetchGisStationsStatusDistrict - Daten:", data); return data; }; diff --git a/redux/api/fromWebService/fetchGisSystemStatic.js b/redux/api/fromWebService/fetchGisSystemStatic.js index f0447a66b..4e22f5c4f 100644 --- a/redux/api/fromWebService/fetchGisSystemStatic.js +++ b/redux/api/fromWebService/fetchGisSystemStatic.js @@ -8,11 +8,11 @@ export async function fetchGisSystemStatic() { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisSystemStatic - URL:", `${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); + //console.log("🔍 fetchGisSystemStatic - URL:", `${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); const data = await response.json(); - console.log("✅ fetchGisSystemStatic - Daten:", data); + //console.log("✅ fetchGisSystemStatic - Daten:", data); return data; } diff --git a/redux/slices/webService/gisStationsStaticSlice.js b/redux/slices/webService/gisStationsStaticSlice.js new file mode 100644 index 000000000..918c22a4c --- /dev/null +++ b/redux/slices/webService/gisStationsStaticSlice.js @@ -0,0 +1,58 @@ +// /redux/api/fromDB/fetchLocationDevices.js +// das ist für Datasheet dropdownmenu Bereiche/Area-Name +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; + +// API-Fetch-Funktion für GIS Stations Static mit dynamischem URL-Parameter +export const fetchGisStationsStatic = createAsyncThunk("gisStationsStatic/fetchGisStationsStatic", async (_, { rejectWithValue }) => { + try { + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; + + // URL-Parameter aus der aktuellen Browser-URL holen + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || "12"; // Standardwert "12", falls `idMap` nicht existiert + + const url = `${apiBaseUrl}/GisStationsStatic?idMap=${idMap}`; + console.log("📡 API Request URL:", url); + + const response = await fetch(url); + + if (!response.ok) { + throw new Error("GisStationsStatic konnte nicht geladen werden"); + } + + const data = await response.json(); + return data; + } catch (error) { + return rejectWithValue(error.message); + } +}); + +// Redux-Slice +const gisStationsStaticSlice = createSlice({ + name: "gisStationsStatic", + initialState: { + data: null, + status: "idle", + error: null, + }, + reducers: {}, + extraReducers: (builder) => { + builder + .addCase(fetchGisStationsStatic.pending, (state) => { + state.status = "loading"; + }) + .addCase(fetchGisStationsStatic.fulfilled, (state, action) => { + state.status = "succeeded"; + state.data = action.payload; + }) + .addCase(fetchGisStationsStatic.rejected, (state, action) => { + state.status = "failed"; + state.error = action.payload; + }); + }, +}); + +// Selector-Funktion +export const selectGisStationsStatic = (state) => state.gisStationsStatic.data; + +export default gisStationsStaticSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 344a4eda4..322e1007d 100644 --- a/redux/store.js +++ b/redux/store.js @@ -1,3 +1,4 @@ +// /redux/store.js import { configureStore } from "@reduxjs/toolkit"; import lineVisibilityReducer from "./slices/lineVisibilitySlice"; import currentPoiReducer from "./slices/currentPoiSlice"; @@ -7,6 +8,7 @@ import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsSta import gisStationsStatusDistrictReducer from "./slices/webService/gisStationsStatusDistrictSlice"; import gisStationsMeasurementsReducer from "./slices/webService/gisStationsMeasurementsSlice"; import gisSystemStaticReducer from "./slices/webService/gisSystemStaticSlice"; +import gisStationsStaticReducer from "./slices/webService/gisStationsStaticSlice"; export const store = configureStore({ reducer: { @@ -18,5 +20,6 @@ export const store = configureStore({ gisStationsStatusDistrict: gisStationsStatusDistrictReducer, gisStationsMeasurements: gisStationsMeasurementsReducer, gisSystemStatic: gisSystemStaticReducer, + gisStationsStatic: gisStationsStaticReducer, }, }); From d6a95f888580009ca06b57aa5574e22a0469036b Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sat, 8 Mar 2025 13:26:24 +0100 Subject: [PATCH 12/31] =?UTF-8?q?feat:=20Animiertes=20Zoomen=20mit=20dynam?= =?UTF-8?q?ischer=20Dauer=20hinzugef=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Leaflet `flyTo` für sanfte Zoom-Animationen implementiert. - Zoom-Stufen auf max. 15 und min. 6 begrenzt. - Dauer der Animation dynamisch auf 0.5s pro Zoomstufe gesetzt. - Verbesserte Benutzererfahrung durch flüssige Zoom-Bewegungen. --- .env.local | 2 +- components/useMapContextMenu.js | 20 ++++++++++++++++++-- config/appVersion.js | 2 +- 3 files changed, 20 insertions(+), 4 deletions(-) diff --git a/.env.local b/.env.local index 8d9543dec..0eeebf47c 100644 --- a/.env.local +++ b/.env.local @@ -9,7 +9,7 @@ DB_PORT=3306 # Public Settings (Client braucht IP/Domain) NEXT_PUBLIC_SERVER_URL="http://192.168.10.33" # oder evtl. später https://nodemap.firma.de NEXT_PUBLIC_ENABLE_GEOCODER=true -NEXT_PUBLIC_USE_MOCK_API=true +NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " diff --git a/components/useMapContextMenu.js b/components/useMapContextMenu.js index f39996a5a..b7ae131cf 100644 --- a/components/useMapContextMenu.js +++ b/components/useMapContextMenu.js @@ -17,7 +17,15 @@ const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, openPopu text: "Reinzoomen", icon: "img/zoom_in.png", callback: (e) => { - map.setZoom(map.getZoom() + 1); + const currentZoom = map.getZoom(); + const newZoom = Math.min(15, currentZoom + 3); // Stellt sicher, dass max. 15 erreicht wird + const zoomDifference = Math.abs(newZoom - currentZoom); // Anzahl der Zoom-Stufen + const duration = zoomDifference * 0.5; // Pro Stufe 0.5 Sekunden + + map.flyTo(map.getCenter(), newZoom, { + animate: true, + duration: duration, + }); }, }); @@ -25,7 +33,15 @@ const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, openPopu text: "Rauszoomen", icon: "img/zoom_out.png", callback: () => { - map.setZoom(map.getZoom() - 1); + const currentZoom = map.getZoom(); + const newZoom = Math.max(6, currentZoom - 3); // Stellt sicher, dass min. 6 erreicht wird + const zoomDifference = Math.abs(newZoom - currentZoom); // Anzahl der Zoom-Stufen + const duration = zoomDifference * 0.5; // Pro Stufe 0.5 Sekunden + + map.flyTo(map.getCenter(), newZoom, { + animate: true, + duration: duration, + }); }, }); diff --git a/config/appVersion.js b/config/appVersion.js index e9ca62e94..b621cc1a1 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.29"; +export const APP_VERSION = "1.1.30"; From c227b57f9b19f636d5a0ac7ed3156392428b2ffa Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sat, 8 Mar 2025 22:33:20 +0100 Subject: [PATCH 13/31] =?UTF-8?q?POI=20hinzuf=C3=BCgen=20in=20useMapContex?= =?UTF-8?q?tMenu.js=20aber=20noch=20kein=20Logik?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/mainComponent/MapComponent.js | 1 + components/useMapContextMenu.js | 17 +++++++++++++++++ config/appVersion.js | 2 +- 3 files changed, 19 insertions(+), 1 deletion(-) diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index a25ed7987..84d4bb51b 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -1024,6 +1024,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { useInitGisSystemStatic(); //-------------------------------------- + //--------------------------------------- return ( diff --git a/components/useMapContextMenu.js b/components/useMapContextMenu.js index b7ae131cf..2709fdc03 100644 --- a/components/useMapContextMenu.js +++ b/components/useMapContextMenu.js @@ -55,6 +55,23 @@ const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, openPopu setMenuItemAdded(true); } + if (!menuItemAdded && map && map.contextmenu) { + const editMode = localStorage.getItem("editMode") === "true"; + if (editMode) { + console.log("map :", map); + console.log("editMode localStorage:", localStorage.getItem("editMode")); + console.log("editMode:", editMode); + map.contextmenu.addItem({ + text: "POI hinzufügen", + icon: "/img/add_station.png", + callback: (e) => { + alert("POI hinzufügen an: " + e.latlng.lat + ", " + e.latlng.lng); + // Falls du ein Modal-Fenster zum Hinzufügen verwenden möchtest: + // ShowAddStationPopup({ latlng: e.latlng, onClose: () => {} }); + }, + }); + } + } }; export default addItemsToMapContextMenu; diff --git a/config/appVersion.js b/config/appVersion.js index b621cc1a1..87e742a95 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.30"; +export const APP_VERSION = "1.1.31"; From e4bb12fe185c7483e55fbca2b405a9aea0a5f8b9 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 00:52:34 +0100 Subject: [PATCH 14/31] =?UTF-8?q?WIP:=20POI=20hinzuf=C3=BCgen=20Modal?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/DataSheet.js | 6 +- components/ShowAddStationPopup.js | 102 +++++++++--------- components/mainComponent/MapComponent.js | 14 ++- .../hooks/useInitGisStationsStatic.js | 4 +- components/useMapContextMenu.js | 6 +- config/appVersion.js | 2 +- 6 files changed, 72 insertions(+), 62 deletions(-) diff --git a/components/DataSheet.js b/components/DataSheet.js index 9be4d1971..403f61813 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -166,7 +166,7 @@ function DataSheet() { useInitGisStationsStatic(); //--------------------------- useEffect(() => { - console.log("🔍 GisStationsStatic Inhalt:", GisStationsStatic); + //console.log("🔍 GisStationsStatic Inhalt:", GisStationsStatic); if (!GisStationsStatic) { console.warn("⚠️ GisStationsStatic ist `null` oder nicht geladen."); @@ -179,7 +179,7 @@ function DataSheet() { } if (!GisStationsStatic.Points || !Array.isArray(GisStationsStatic.Points)) { - console.warn("⚠️ GisStationsStatic.Points ist nicht vorhanden oder kein Array.", GisStationsStatic); + //console.warn("⚠️ GisStationsStatic.Points ist nicht vorhanden oder kein Array.", GisStationsStatic); return; } @@ -200,7 +200,7 @@ function DataSheet() { })) ); - console.log("📌 stationListing aktualisiert:", filteredAreas); + // console.log("📌 stationListing aktualisiert:", filteredAreas); }, [GisStationsStatic]); //--------------------------- diff --git a/components/ShowAddStationPopup.js b/components/ShowAddStationPopup.js index 7b770e0ec..29e190a17 100644 --- a/components/ShowAddStationPopup.js +++ b/components/ShowAddStationPopup.js @@ -113,58 +113,60 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { //-----------------handleSubmit------------------- return ( -
-
- - setName(e.target.value)} placeholder="Name der Station" className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm" /> -
+
+
e.stopPropagation()}> + {/* Schließen-Button */} + - {/* {locationDeviceData.----------------------------------------------*/} -
- - -
- {/* {locationDeviceData.----------------------------------------------*/} -
- - -
-
-
- -
-
- -
-
+ {/* Modal-Inhalt */} + +
+ + setName(e.target.value)} placeholder="Name der Station" className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm" /> +
- - +
+ + +
+ +
+ + +
+ +
+ Lat: {latitude} + Lng: {longitude} +
+ + + +
+
); }; diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 84d4bb51b..06e5a6a80 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -75,6 +75,7 @@ import { useInitGisStationsStatusDistrict } from "./hooks/useInitGisStationsStat import { useInitGisStationsMeasurements } from "./hooks/useInitGisStationsMeasurements"; import { useInitGisSystemStatic } from "./hooks/useInitGisSystemStatic"; import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webService/gisSystemStaticSlice"; +import ShowAddStationPopup from "../../components/ShowAddStationPopup"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); @@ -102,6 +103,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const coordinates = `${e.latlng.lat.toFixed(5)}, ${e.latlng.lng.toFixed(5)}`; setCurrentCoordinates(coordinates); setIsPopupOpen(true); + setPopupCoordinates(e.latlng); + setPopupVisible(true); }; const closePopup = () => setIsPopupOpen(false); @@ -175,6 +178,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { lat: 52.52, lng: 13.405, }); + const [popupVisible, setPopupVisible] = useState(false); const handleAddStation = (stationData) => { setAddPoiModalWindowState(false); @@ -626,6 +630,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { useEffect(() => { if (map) { + console.log("map in MapComponent: ", map); const handleMapMoveEnd = (event) => { const newCenter = map.getCenter(); const newZoom = map.getZoom(); @@ -649,15 +654,15 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { //-------------------------------------------- // Bereich in DataSheet ->dropdownmenu useEffect(() => { - console.log("🔍 GisStationsStaticDistrict Inhalt:", GisStationsStaticDistrict); + //console.log("🔍 GisStationsStaticDistrict Inhalt:", GisStationsStaticDistrict); // Sicherstellen, dass `Points` existiert und ein Array ist const points = GisStationsStaticDistrict?.Points; - if (!Array.isArray(points)) { - console.warn("⚠️ GisStationsStaticDistrict.Points ist nicht vorhanden oder kein Array.", points); + /* if (!Array.isArray(points)) { + //console.warn("⚠️ GisStationsStaticDistrict.Points ist nicht vorhanden oder kein Array.", points); return; } - + */ if (selectedArea && map) { const station = points.find((s) => s.Area_Name === selectedArea); @@ -1029,6 +1034,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { return ( <> + {popupVisible && setPopupVisible(false)} map={map} />}
{showPoiUpdateModal && setShowPoiUpdateModal(false)} poiData={currentPoiData} onSubmit={() => {}} latlng={popupCoordinates} />}
diff --git a/components/mainComponent/hooks/useInitGisStationsStatic.js b/components/mainComponent/hooks/useInitGisStationsStatic.js index 72831eac1..533ebd5ed 100644 --- a/components/mainComponent/hooks/useInitGisStationsStatic.js +++ b/components/mainComponent/hooks/useInitGisStationsStatic.js @@ -9,10 +9,10 @@ export const useInitGisStationsStatic = () => { const gisStationsStatic = useSelector(selectGisStationsStatic); useEffect(() => { - console.log("🔍 useInitGisStationsStatic - Aktueller Wert:", gisStationsStatic); + // console.log("🔍 useInitGisStationsStatic - Aktueller Wert:", gisStationsStatic); if (!gisStationsStatic || gisStationsStatic === null) { - console.log("🚀 Starte fetchGisStationsStatic..."); + //console.log("🚀 Starte fetchGisStationsStatic..."); dispatch(fetchGisStationsStatic()); } }, [gisStationsStatic, dispatch]); diff --git a/components/useMapContextMenu.js b/components/useMapContextMenu.js index 2709fdc03..6bf04dcdc 100644 --- a/components/useMapContextMenu.js +++ b/components/useMapContextMenu.js @@ -64,11 +64,13 @@ const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, openPopu map.contextmenu.addItem({ text: "POI hinzufügen", icon: "/img/add_station.png", - callback: (e) => { + callback: openPopupWithCoordinates, // Statt alert wird die Funktion zum Öffnen des Popups genutzt + + /* callback: (e) => { alert("POI hinzufügen an: " + e.latlng.lat + ", " + e.latlng.lng); // Falls du ein Modal-Fenster zum Hinzufügen verwenden möchtest: // ShowAddStationPopup({ latlng: e.latlng, onClose: () => {} }); - }, + }, */ }); } } diff --git a/config/appVersion.js b/config/appVersion.js index 87e742a95..6a2b72e83 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.31"; +export const APP_VERSION = "1.1.32"; From ffb76857c797afa87938a5ae74e08366285a5d11 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 09:37:01 +0100 Subject: [PATCH 15/31] =?UTF-8?q?feat(context-menu):=20Fix=20POI=20hinzuf?= =?UTF-8?q?=C3=BCgen=20Modal=20und=20State-Handling?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - `useMapContextMenu.js`: - `openPoiModal` in `addItemsToMapContextMenu` integriert, um Zugriff auf `setShowCoordinatesModal` und `setShowPoiModal` zu ermöglichen. - `setShowCoordinatesModal` wird korrekt als Parameter übergeben und verwaltet. - `POI hinzufügen`-Eintrag im Kontextmenü wurde verbessert. - `MapComponent.js`: - `setShowCoordinatesModal`, `setShowPoiModal` und `setPopupCoordinates` werden jetzt korrekt an `addItemsToMapContextMenu` übergeben. - `ShowAddStationPopup` Modal öffnet sich jetzt korrekt und überlagert die Seite. - UI-Verbesserungen für Modale und Fix für doppeltes Öffnen von Modalen. Fixes: Problem, dass mehrere Modale gleichzeitig geöffnet wurden und `setShowCoordinatesModal` nicht definiert war. --- components/mainComponent/MapComponent.js | 24 ++++++++++++++++++++---- components/useMapContextMenu.js | 24 ++++++++++++++++-------- config/appVersion.js | 2 +- 3 files changed, 37 insertions(+), 13 deletions(-) diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 06e5a6a80..cef38ab3d 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -174,10 +174,14 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const [newCoords, setNewCoords] = useState(null); const [tempMarker, setTempMarker] = useState(null); + const [showPoiModal, setShowPoiModal] = useState(false); + const [showCoordinatesModal, setShowCoordinatesModal] = useState(false); + const [popupCoordinates, setPopupCoordinates] = useState(null); + /* const [popupCoordinates, setPopupCoordinates] = useState({ lat: 52.52, lng: 13.405, - }); + }); */ const [popupVisible, setPopupVisible] = useState(false); const handleAddStation = (stationData) => { @@ -1007,12 +1011,20 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { } }, [map, menuItemAdded, hasRights]); */ //-------------------------------------------- - useEffect(() => { if (map && !menuItemAdded) { - addItemsToMapContextMenu(map, menuItemAdded, setMenuItemAdded, openPopupWithCoordinates); + addItemsToMapContextMenu( + map, + menuItemAdded, + setMenuItemAdded, + setShowCoordinatesModal, + setShowPoiModal, + setPopupCoordinates, + openPopupWithCoordinates // Diese Funktion wird jetzt übergeben! + ); } }, [map, menuItemAdded]); + //-------------------------------------------- // Beim ersten Client-Render den Wert aus localStorage laden useEffect(() => { @@ -1034,7 +1046,11 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { return ( <> - {popupVisible && setPopupVisible(false)} map={map} />} + {/* Zeigt das Koordinaten-Modal, wenn `showCoordinatesModal` true ist */} + {showCoordinatesModal && setShowCoordinatesModal(false)} />} + + {/* Zeigt das POI-Modal, wenn `showPoiModal` true ist */} + {showPoiModal && setShowPoiModal(false)} />}
{showPoiUpdateModal && setShowPoiUpdateModal(false)} poiData={currentPoiData} onSubmit={() => {}} latlng={popupCoordinates} />}
diff --git a/components/useMapContextMenu.js b/components/useMapContextMenu.js index 6bf04dcdc..03b847b50 100644 --- a/components/useMapContextMenu.js +++ b/components/useMapContextMenu.js @@ -3,7 +3,20 @@ import { toast } from "react-toastify"; import { zoomIn, zoomOut, centerHere } from "../utils/zoomAndCenterUtils"; // components/useMapContextMenu.js -const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, openPopupWithCoordinates) => { +const addItemsToMapContextMenu = ( + map, + menuItemAdded, + setMenuItemAdded, + setShowCoordinatesModal, + setShowPoiModal, + setPopupCoordinates, + openPopupWithCoordinates // Hier wird die Funktion als Parameter hinzugefügt +) => { + const openPoiModal = (e) => { + setShowCoordinatesModal(false); // ✅ Jetzt verfügbar, weil als Parameter übergeben + setPopupCoordinates(e.latlng); + setShowPoiModal(true); + }; if (!menuItemAdded && map && map.contextmenu) { map.contextmenu.addItem({ text: "Koordinaten anzeigen", @@ -61,16 +74,11 @@ const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, openPopu console.log("map :", map); console.log("editMode localStorage:", localStorage.getItem("editMode")); console.log("editMode:", editMode); + map.contextmenu.addItem({ text: "POI hinzufügen", icon: "/img/add_station.png", - callback: openPopupWithCoordinates, // Statt alert wird die Funktion zum Öffnen des Popups genutzt - - /* callback: (e) => { - alert("POI hinzufügen an: " + e.latlng.lat + ", " + e.latlng.lng); - // Falls du ein Modal-Fenster zum Hinzufügen verwenden möchtest: - // ShowAddStationPopup({ latlng: e.latlng, onClose: () => {} }); - }, */ + callback: openPoiModal, // Jetzt mit Zugriff auf `setShowPoiModal` }); } } diff --git a/config/appVersion.js b/config/appVersion.js index 6a2b72e83..704e526af 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.32"; +export const APP_VERSION = "1.1.33"; From 42217e09e638a2b81d4e2a5d30e8cb0011ebdd65 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 09:45:32 +0100 Subject: [PATCH 16/31] =?UTF-8?q?Umbenennung=20von=20ShowAddStationPopup.j?= =?UTF-8?q?s=20in=20AddPOIModal.js=20f=C3=BCr=20bessere=20Verst=C3=A4ndlic?= =?UTF-8?q?hkeit"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/{ShowAddStationPopup.js => AddPOIModal.js} | 2 +- components/mainComponent/MapComponent.js | 2 +- config/appVersion.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) rename components/{ShowAddStationPopup.js => AddPOIModal.js} (99%) diff --git a/components/ShowAddStationPopup.js b/components/AddPOIModal.js similarity index 99% rename from components/ShowAddStationPopup.js rename to components/AddPOIModal.js index 29e190a17..7c6561070 100644 --- a/components/ShowAddStationPopup.js +++ b/components/AddPOIModal.js @@ -3,7 +3,7 @@ import React, { useState, useEffect, use } from "react"; import ReactDOM from "react-dom"; import { useRecoilValue, useRecoilState, useSetRecoilState } from "recoil"; import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStoreSlice.js"; -import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice"; +import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice.js"; const ShowAddStationPopup = ({ onClose, map, latlng }) => { const [poiTypData, setpoiTypData] = useState(); // Recoil State verwenden diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index cef38ab3d..ddee61980 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -75,7 +75,7 @@ import { useInitGisStationsStatusDistrict } from "./hooks/useInitGisStationsStat import { useInitGisStationsMeasurements } from "./hooks/useInitGisStationsMeasurements"; import { useInitGisSystemStatic } from "./hooks/useInitGisSystemStatic"; import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webService/gisSystemStaticSlice"; -import ShowAddStationPopup from "../../components/ShowAddStationPopup"; +import ShowAddStationPopup from "../AddPOIModal.js"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); diff --git a/config/appVersion.js b/config/appVersion.js index 704e526af..3666794cf 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.33"; +export const APP_VERSION = "1.1.34"; From 06e468e560abedad3f923c8929c59c5f933f6a10 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 13:23:02 +0100 Subject: [PATCH 17/31] =?UTF-8?q?fix:=20Korrektur=20der=20Datenquelle=20f?= =?UTF-8?q?=C3=BCr=20Ger=C3=A4te-Dropdown?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - API-Antwort direkt analysiert: `Points` liegt auf oberster Ebene, nicht unter `data` - Anpassung der Zuweisung: `const locationDeviceData = gisStationsStatic?.Points ?? [];` - Dropdown wird nun korrekt mit Gerätenamen befüllt --- components/AddPOIModal.js | 68 ++++++++---------------- components/mainComponent/MapComponent.js | 2 + components/useMapContextMenu.js | 1 - config/appVersion.js | 2 +- 4 files changed, 26 insertions(+), 47 deletions(-) diff --git a/components/AddPOIModal.js b/components/AddPOIModal.js index 7c6561070..8761216b1 100644 --- a/components/AddPOIModal.js +++ b/components/AddPOIModal.js @@ -4,6 +4,8 @@ import ReactDOM from "react-dom"; import { useRecoilValue, useRecoilState, useSetRecoilState } from "recoil"; import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStoreSlice.js"; import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice.js"; +import { useSelector } from "react-redux"; +import { selectGisStationsStatic } from "../redux/slices/webService/gisStationsStaticSlice"; const ShowAddStationPopup = ({ onClose, map, latlng }) => { const [poiTypData, setpoiTypData] = useState(); // Recoil State verwenden @@ -14,7 +16,6 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { const [longitude] = useState(latlng.lng.toFixed(5)); const setLoadData = useSetRecoilState(readPoiMarkersStore); const setTrigger = useSetRecoilState(poiReadFromDbTriggerAtom); - const [locationDeviceData, setLocationDeviceData] = useState([]); const [deviceName, setDeviceName] = useState(""); useEffect(() => { @@ -35,46 +36,18 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { fetchpoiTypData(); }, []); - - //--------------------------------------------------------------------------------------- - /* useEffect(() => { - // Funktion zum Abrufen der Daten von der API -> DB talas_v5.location_device - const fetchData = async () => { - try { - const response = await fetch("/api/talas_v5/location_device"); // Pfad zu Ihrem API-Endpunkt - const data = await response.json(); - setLocationDeviceData(data); // Setzt den Zustand mit den abgerufenen Daten - console.log("Abgerufene Standort- und Gerätedaten:", data); - } catch (error) { - console.error( - "Fehler beim Abrufen der Standort- und Gerätedaten:", - error - ); - } - }; - - fetchData(); - }, []); // Leerarray als Dependency, um den Effekt nur beim Laden der Komponente auszuführen */ - //------------------------------------------------------------------------------------------ - useEffect(() => { - // Funktion zum Abrufen der Daten von der API -> DB talas_v5.location_device - const fetchData = async () => { - try { - const response = await fetch("/api/talas5/location_device"); - const data = await response.json(); - setLocationDeviceData(data); - if (data.length > 0) { - setDeviceName(data[0].name); // Setzen des anfänglichen Gerätenamens - } - console.log("Abgerufene Standort- und Gerätedaten:", data); - } catch (error) { - console.error("Fehler beim Abrufen der Standort- und Gerätedaten:", error); - } - }; + const gisStationsStatic = useSelector(selectGisStationsStatic); + const locationDeviceData = gisStationsStatic?.Points ?? []; - fetchData(); - }, []); + console.log("gisStationsStatic aus AddPOIModal:", gisStationsStatic); + + useEffect(() => { + if (locationDeviceData?.length > 0) { + console.log("🎯 Gerätedaten erfolgreich geladen:", locationDeviceData); + setDeviceName((prev) => prev || locationDeviceData[0]?.LD_Name || ""); + } + }, [locationDeviceData]); //------------------------------------------------------------------------------------------ //-----------------handleSubmit------------------- @@ -85,7 +58,7 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { poiTypeId, latitude, longitude, - idLD: locationDeviceData.find((device) => device.name === deviceName).idLD, + idLD: locationDeviceData.find((device) => device.LD_Name === deviceName)?.IdLD, }; const response = await fetch("/api/talas_v5_DB/pois/addLocation", { @@ -134,11 +107,16 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { Gerät: diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index ddee61980..6086c5998 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -76,6 +76,7 @@ import { useInitGisStationsMeasurements } from "./hooks/useInitGisStationsMeasur import { useInitGisSystemStatic } from "./hooks/useInitGisSystemStatic"; import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webService/gisSystemStaticSlice"; import ShowAddStationPopup from "../AddPOIModal.js"; +import { useInitGisStationsStatic } from "../mainComponent/hooks/useInitGisStationsStatic"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); @@ -1039,6 +1040,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { useInitGisStationsStatusDistrict(); useInitGisStationsMeasurements(); useInitGisSystemStatic(); + useInitGisStationsStatic(); //-------------------------------------- diff --git a/components/useMapContextMenu.js b/components/useMapContextMenu.js index 03b847b50..8f60c18fd 100644 --- a/components/useMapContextMenu.js +++ b/components/useMapContextMenu.js @@ -71,7 +71,6 @@ const addItemsToMapContextMenu = ( if (!menuItemAdded && map && map.contextmenu) { const editMode = localStorage.getItem("editMode") === "true"; if (editMode) { - console.log("map :", map); console.log("editMode localStorage:", localStorage.getItem("editMode")); console.log("editMode:", editMode); diff --git a/config/appVersion.js b/config/appVersion.js index 3666794cf..60752fb05 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.34"; +export const APP_VERSION = "1.1.35"; From 58d0f1a8a791ce49a3ceb37ff0ea0c156cf02bb0 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 18:13:43 +0100 Subject: [PATCH 18/31] =?UTF-8?q?fix:=20Seite=20nach=20POI-Hinzuf=C3=BCgen?= =?UTF-8?q?=20automatisch=20neu=20laden?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Problem mit der Icon-Aktualisierung nach dem Hinzufügen eines POI behoben - Temporäre Lösung: `window.location.reload()` nach `handleSubmit` - Redux bleibt weiterhin für POI-Typen aktiv, spätere Optimierung ohne Reload geplant --- components/AddPOIModal.js | 29 +++++++++++++++++++---------- config/appVersion.js | 2 +- redux/slices/db/poiTypesSlice.js | 29 +++++++++++++++++++++++++++++ redux/store.js | 2 ++ 4 files changed, 51 insertions(+), 11 deletions(-) create mode 100644 redux/slices/db/poiTypesSlice.js diff --git a/components/AddPOIModal.js b/components/AddPOIModal.js index 8761216b1..fa1a07077 100644 --- a/components/AddPOIModal.js +++ b/components/AddPOIModal.js @@ -4,11 +4,14 @@ import ReactDOM from "react-dom"; import { useRecoilValue, useRecoilState, useSetRecoilState } from "recoil"; import { readPoiMarkersStore } from "../redux/slices/readPoiMarkersStoreSlice.js"; import { poiReadFromDbTriggerAtom } from "../redux/slices/poiReadFromDbTriggerSlice.js"; -import { useSelector } from "react-redux"; import { selectGisStationsStatic } from "../redux/slices/webService/gisStationsStaticSlice"; +import { useDispatch, useSelector } from "react-redux"; +import { fetchPoiTypes } from "../redux/slices/db/poiTypesSlice"; const ShowAddStationPopup = ({ onClose, map, latlng }) => { - const [poiTypData, setpoiTypData] = useState(); // Recoil State verwenden + const dispatch = useDispatch(); + const poiTypData = useSelector((state) => state.poiTypes.data); + const [name, setName] = useState(""); const [poiTypeId, setPoiTypeId] = useState(""); // Initialize as string const [poiTypeName, setPoiTypeName] = useState(""); // Initialize as string @@ -82,8 +85,16 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { if (map && typeof map.closePopup === "function") { map.closePopup(); } + //Seite neu laden + window.location.reload(); }; - //-----------------handleSubmit------------------- + //----------------- + // POI-Typen aus Redux laden, wenn die Komponente gemountet wird + useEffect(() => { + dispatch(fetchPoiTypes()); + }, [dispatch]); + + //--------------------- return (
@@ -119,18 +130,16 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { )}
-
diff --git a/config/appVersion.js b/config/appVersion.js index 60752fb05..25b7a96f2 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.35"; +export const APP_VERSION = "1.1.36"; diff --git a/redux/slices/db/poiTypesSlice.js b/redux/slices/db/poiTypesSlice.js new file mode 100644 index 000000000..9f3af2872 --- /dev/null +++ b/redux/slices/db/poiTypesSlice.js @@ -0,0 +1,29 @@ +// /redux/slices/db/poiTypesSlice.js +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; + +// API-Abruf für POI-Typen +export const fetchPoiTypes = createAsyncThunk("poiTypes/fetchPoiTypes", async () => { + const response = await fetch("http://192.168.10.33:3000/api/talas_v5_DB/poiTyp/readPoiTyp"); + return await response.json(); +}); + +const poiTypesSlice = createSlice({ + name: "poiTypes", + initialState: { data: [], status: "idle" }, + reducers: {}, + extraReducers: (builder) => { + builder + .addCase(fetchPoiTypes.pending, (state) => { + state.status = "loading"; + }) + .addCase(fetchPoiTypes.fulfilled, (state, action) => { + state.data = action.payload; + state.status = "succeeded"; + }) + .addCase(fetchPoiTypes.rejected, (state) => { + state.status = "failed"; + }); + }, +}); + +export default poiTypesSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 322e1007d..552457811 100644 --- a/redux/store.js +++ b/redux/store.js @@ -9,6 +9,7 @@ import gisStationsStatusDistrictReducer from "./slices/webService/gisStationsSta import gisStationsMeasurementsReducer from "./slices/webService/gisStationsMeasurementsSlice"; import gisSystemStaticReducer from "./slices/webService/gisSystemStaticSlice"; import gisStationsStaticReducer from "./slices/webService/gisStationsStaticSlice"; +import poiTypesReducer from "./slices/db/poiTypesSlice"; export const store = configureStore({ reducer: { @@ -21,5 +22,6 @@ export const store = configureStore({ gisStationsMeasurements: gisStationsMeasurementsReducer, gisSystemStatic: gisSystemStaticReducer, gisStationsStatic: gisStationsStaticReducer, + poiTypes: poiTypesReducer, }, }); From 6f477092562ccb9bf8d30b61eb8658b627845746 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 18:46:38 +0100 Subject: [PATCH 19/31] fix: Automatische Aktualisierung von Spiderfy/Unspiderfy im Intervall MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - `map.fire("click")` im `setInterval()` hinzugefügt, um Linien sofort auszublenden - Spiderfy/Unspiderfy wird nun regelmäßig aktualisiert, ohne manuelles Klicken - Debugging-Log hinzugefügt, um Klick-Event zu überwachen --- components/mainComponent/MapComponent.js | 7 ++++- config/appVersion.js | 2 +- lib/OverlappingMarkerSpiderfier.js | 39 ++++++++++++++++++------ 3 files changed, 36 insertions(+), 12 deletions(-) diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 6086c5998..f6ef66dcb 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -868,7 +868,12 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { // Setze ein Intervall für regelmäßige Updates const intervalId = setInterval(() => { updateAllMarkers(); - }, 20000); // 20 Sekunden + + if (map) { + console.log("🔥 Automatischer Klick-Event ausgelöst, um Spiderfy zu aktualisieren."); + map.fire("click"); + } + }, 20000); // Aufräumen bei Komponentenentladung return () => { diff --git a/config/appVersion.js b/config/appVersion.js index 25b7a96f2..2d27093f8 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.36"; +export const APP_VERSION = "1.1.37"; diff --git a/lib/OverlappingMarkerSpiderfier.js b/lib/OverlappingMarkerSpiderfier.js index 0e1747459..5093ae240 100644 --- a/lib/OverlappingMarkerSpiderfier.js +++ b/lib/OverlappingMarkerSpiderfier.js @@ -67,38 +67,57 @@ export class OverlappingMarkerSpiderfier { return distance < this.nearbyDistance && marker !== m; }); } - + //--------------------------------------------------------------------------------------------- spiderfy(markers) { const centerPt = this.map.latLngToLayerPoint(markers[0].getLatLng()); + markers.forEach((marker, i) => { const angle = this.circleStartAngle + (i * 2 * Math.PI) / markers.length; const legLength = this.circleFootSeparation * (2 + i / markers.length); - const newPt = L.point( - centerPt.x + legLength * Math.cos(angle), - centerPt.y + legLength * Math.sin(angle) - ); + const newPt = L.point(centerPt.x + legLength * Math.cos(angle), centerPt.y + legLength * Math.sin(angle)); const newLatLng = this.map.layerPointToLatLng(newPt); if (!marker._oms) { - marker._oms = {}; // Stellt sicher, dass _oms ein Objekt ist + marker._oms = {}; } - // Speichert die aktuelle Position, bevor sie verändert wird marker._oms.usualPosition = marker.getLatLng(); - marker._oms.spidered = true; // Markiert, dass der Marker gespiderfied ist + marker._oms.spidered = true; + + // Zeichne eine Linie zwischen ursprünglicher und neuer Position + const leg = L.polyline([marker._oms.usualPosition, newLatLng], { + color: this.legColors.usual, + weight: this.legWeight, + }).addTo(this.map); + + marker._oms.leg = leg; // Speichert die Linie im Marker-Objekt marker.setLatLng(newLatLng); marker.setZIndexOffset(1000); }); } + + //--------------------------------------------------------------------------------------------- unspiderfy() { this.markers.forEach((marker) => { if (marker._oms && marker._oms.spidered) { - // Setzt den Marker nur dann zurück, wenn er gespiderfied war + // Falls eine Linie existiert, entferne sie aus der Karte + if (marker._oms.leg) { + this.map.removeLayer(marker._oms.leg); + marker._oms.leg = null; + } + marker.setLatLng(marker._oms.usualPosition); marker.setZIndexOffset(0); - marker._oms.spidered = false; // Setzt zurück, dass der Marker nicht mehr gespiderfied ist + marker._oms.spidered = false; } }); + // 🔥 Künstliches Click-Event auslösen, um die UI zu aktualisieren + setTimeout(() => { + this.map.fire("click"); + console.log("Click-Event ausgelöst in OverlappingMarkerspiderfier.js in unspiderfy "); + }, 10); // Kurze Verzögerung, um sicherzustellen, dass die UI neu gerendert wird } + + //--------------------------------------------------------------------------------------------- } From 74dfb354f546fe6ad5255801f7fff201dec0b15c Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 19:00:17 +0100 Subject: [PATCH 20/31] =?UTF-8?q?refactor:=20API-URL=20in=20`.env.local`?= =?UTF-8?q?=20ausgelagert=20f=C3=BCr=20zentrale=20Verwaltung?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - `NEXT_PUBLIC_API_PORT_3000` in `.env.local` definiert - `poiTypesSlice.js` so angepasst, dass die API-URL dynamisch aus `.env.local` geladen wird - Harte URL entfernt, jetzt konfigurierbar ohne Code-Änderung - Erfordert Neustart von Next.js, um `.env.local` zu laden --- .env.local | 1 + config/appVersion.js | 2 +- redux/slices/db/poiTypesSlice.js | 3 ++- 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/.env.local b/.env.local index 0eeebf47c..b05b3eea6 100644 --- a/.env.local +++ b/.env.local @@ -15,3 +15,4 @@ NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " NEXT_PUBLIC_BASE_URL=http://192.168.10.33/talas5/devices/ NEXT_PUBLIC_API_BASE_URL=http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx +NEXT_PUBLIC_API_PORT_3000=http://192.168.10.33:3000 diff --git a/config/appVersion.js b/config/appVersion.js index 2d27093f8..e1ff93af2 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.37"; +export const APP_VERSION = "1.1.38"; diff --git a/redux/slices/db/poiTypesSlice.js b/redux/slices/db/poiTypesSlice.js index 9f3af2872..b4bb7cb9b 100644 --- a/redux/slices/db/poiTypesSlice.js +++ b/redux/slices/db/poiTypesSlice.js @@ -3,7 +3,8 @@ import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; // API-Abruf für POI-Typen export const fetchPoiTypes = createAsyncThunk("poiTypes/fetchPoiTypes", async () => { - const response = await fetch("http://192.168.10.33:3000/api/talas_v5_DB/poiTyp/readPoiTyp"); + const API_BASE_URL = process.env.NEXT_PUBLIC_API_PORT_3000; + const response = await fetch(`${API_BASE_URL}/api/talas_v5_DB/poiTyp/readPoiTyp`); return await response.json(); }); From 1f1ab4b818b79b7a84e8b69a85774dde6d91fe4c Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 9 Mar 2025 19:30:11 +0100 Subject: [PATCH 21/31] fix: POI-Typ Auswahl korrigiert, Initialwert wird nun gesetzt MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Problem behoben, dass der erste POI-Typ (Index 0) nicht korrekt übernommen wurde - useEffect hinzugefügt, um sicherzustellen, dass poiTypeId gesetzt wird, sobald Daten verfügbar sind - Fehlerhafte Initialisierung von poiTypeId korrigiert, damit das Dropdown sofort den ersten Eintrag auswählt --- components/AddPOIModal.js | 43 ++++++++++++++++++++++++++++++--------- config/appVersion.js | 2 +- 2 files changed, 34 insertions(+), 11 deletions(-) diff --git a/components/AddPOIModal.js b/components/AddPOIModal.js index fa1a07077..9841d0078 100644 --- a/components/AddPOIModal.js +++ b/components/AddPOIModal.js @@ -20,17 +20,18 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { const setLoadData = useSetRecoilState(readPoiMarkersStore); const setTrigger = useSetRecoilState(poiReadFromDbTriggerAtom); const [deviceName, setDeviceName] = useState(""); - + //----------------------------------------------------- useEffect(() => { const fetchpoiTypData = async () => { try { const response = await fetch("/api/talas_v5_DB/poiTyp/readPoiTyp"); const data = await response.json(); setpoiTypData(data); + if (data && data.length > 0) { - setPoiTypeId(data[0].idPoiTyp); // Set initial poiTypeId to the id of the first poiType - setPoiTypeName(data[1].name); // Set initial poiTypeName to the name of the first poiType - console.log("Initial poiTypeId set in ShowAddStationPopup.js :", data[0].idPoiTyp); + console.log("POI-Typen geladen:", data); + setPoiTypeId(data[0].idPoiTyp); // Setzt den ersten Typ + setPoiTypeName(data[0].name); } } catch (error) { console.error("Fehler beim Abrufen der poiTyp Daten:", error); @@ -39,6 +40,16 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { fetchpoiTypData(); }, []); + + useEffect(() => { + if (poiTypData.length > 0 && !poiTypeId) { + setPoiTypeId(poiTypData[0].idPoiTyp); + } + }, [poiTypData]); + useEffect(() => { + console.log("Aktueller POI Type:", poiTypeId); + }, [poiTypeId]); + //------------------------------------------------------------------------------------------ const gisStationsStatic = useSelector(selectGisStationsStatic); const locationDeviceData = gisStationsStatic?.Points ?? []; @@ -58,7 +69,7 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { event.preventDefault(); const formData = { name, - poiTypeId, + poiTypeId: Number(poiTypeId), // Umwandlung in eine Zahl latitude, longitude, idLD: locationDeviceData.find((device) => device.LD_Name === deviceName)?.IdLD, @@ -134,12 +145,24 @@ const ShowAddStationPopup = ({ onClose, map, latlng }) => { - setPoiTypeId(Number(e.target.value))} // Hier ebenfalls umwandeln + className="block p-2 w-full border-2 border-gray-200 rounded-md text-sm" + > + {poiTypData.length === 0 ? ( + - ))} + ) : ( + poiTypData.map((poiTyp) => ( + + )) + )} diff --git a/config/appVersion.js b/config/appVersion.js index e1ff93af2..02654aa4d 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.38"; +export const APP_VERSION = "1.1.39"; From b6c07bbc7da769760e5c02c65cb505c2c921fd7e Mon Sep 17 00:00:00 2001 From: ISA Date: Mon, 10 Mar 2025 08:34:52 +0100 Subject: [PATCH 22/31] =?UTF-8?q?Fix:=20redrawPoline.js=20und=20POI=20hinz?= =?UTF-8?q?ufgen=20auf=20die=20Karte=20in=20Kontextmen=C3=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.local | 8 ++++---- config/appVersion.js | 2 +- utils/markerUtils.js | 12 ++++-------- utils/poiUtils.js | 3 ++- utils/redrawPolyline.js | 35 +++++++++++++++++++++++++++++++++++ utils/setupPOIs.js | 2 +- utils/setupPolylines.js | 2 +- 7 files changed, 48 insertions(+), 16 deletions(-) create mode 100644 utils/redrawPolyline.js diff --git a/.env.local b/.env.local index b05b3eea6..ffea95242 100644 --- a/.env.local +++ b/.env.local @@ -7,12 +7,12 @@ DB_NAME=talas_v5 DB_PORT=3306 # Public Settings (Client braucht IP/Domain) -NEXT_PUBLIC_SERVER_URL="http://192.168.10.33" # oder evtl. später https://nodemap.firma.de +NEXT_PUBLIC_SERVER_URL="http://10.10.0.70" # oder evtl. später https://nodemap.firma.de NEXT_PUBLIC_ENABLE_GEOCODER=true NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " -NEXT_PUBLIC_BASE_URL=http://192.168.10.33/talas5/devices/ -NEXT_PUBLIC_API_BASE_URL=http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx -NEXT_PUBLIC_API_PORT_3000=http://192.168.10.33:3000 +NEXT_PUBLIC_BASE_URL=http://10.10.0.70/talas5/devices/ +NEXT_PUBLIC_API_BASE_URL=http://10.10.0.70/talas5/ClientData/WebServiceMap.asmx +NEXT_PUBLIC_API_PORT_3000=http://10.10.0.70:3000 diff --git a/config/appVersion.js b/config/appVersion.js index 02654aa4d..01e16d777 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.39"; +export const APP_VERSION = "1.1.40"; diff --git a/utils/markerUtils.js b/utils/markerUtils.js index da7417e3b..5c2b2b9ff 100644 --- a/utils/markerUtils.js +++ b/utils/markerUtils.js @@ -1,6 +1,7 @@ // /utils/markerUtils.js import circleIcon from "../components/CircleIcon"; -import { saveLineData, redrawPolyline } from "./mapUtils"; +import { saveLineData } from "./mapUtils"; +import { redrawPolyline } from "./mapUtils"; import L from "leaflet"; import { toast } from "react-toastify"; @@ -9,10 +10,7 @@ export const insertNewMarker = (closestPoints, newPoint, lineData, map) => { icon: circleIcon, draggable: true, }).addTo(map); - lineData.coordinates.splice(closestPoints[2], 0, [ - newPoint.lat, - newPoint.lng, - ]); + lineData.coordinates.splice(closestPoints[2], 0, [newPoint.lat, newPoint.lng]); // Hier direkt speichern nach Einfügen saveLineData(lineData); @@ -39,9 +37,7 @@ export const removeMarker = (marker, lineData, currentZoom, currentCenter) => { //localStorage.setItem("mapCenter", JSON.stringify(currentCenter)); // Find the index of the coordinate that matches the marker's position - const index = lineData.coordinates.findIndex((coord) => - L.latLng(coord[0], coord[1]).equals(marker.getLatLng()) - ); + const index = lineData.coordinates.findIndex((coord) => L.latLng(coord[0], coord[1]).equals(marker.getLatLng())); if (index !== -1) { // Remove the coordinate from the line data diff --git a/utils/poiUtils.js b/utils/poiUtils.js index 229e10a0b..d5dcd5d39 100644 --- a/utils/poiUtils.js +++ b/utils/poiUtils.js @@ -1,6 +1,7 @@ // /utils/poiUtils.js import circleIcon from "../components/gisPolylines/icons/CircleIcon.js"; -import { saveLineData, redrawPolyline } from "./mapUtils.js"; +import { saveLineData } from "./mapUtils.js"; +import { redrawPolyline } from "./redrawPolyline.js"; import L from "leaflet"; import "leaflet.smooth_marker_bouncing"; import { toast } from "react-toastify"; diff --git a/utils/redrawPolyline.js b/utils/redrawPolyline.js new file mode 100644 index 000000000..5dbfa7325 --- /dev/null +++ b/utils/redrawPolyline.js @@ -0,0 +1,35 @@ +// utils/redrawPolyline.js +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 }); + }); +}; diff --git a/utils/setupPOIs.js b/utils/setupPOIs.js index b4885bbfc..3a8225d77 100644 --- a/utils/setupPOIs.js +++ b/utils/setupPOIs.js @@ -7,7 +7,7 @@ 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 { redrawPolyline } from "./redrawPolyline"; import { openInNewTab } from "../utils/openInNewTab"; import { disablePolylineEvents, enablePolylineEvents } from "./setupPolylines"; // Importiere die Funktionen diff --git a/utils/setupPolylines.js b/utils/setupPolylines.js index d3e780525..9a50800a4 100644 --- a/utils/setupPolylines.js +++ b/utils/setupPolylines.js @@ -8,7 +8,7 @@ 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 { redrawPolyline } from "./redrawPolyline"; import { openInNewTab } from "./openInNewTab"; import { toast } from "react-toastify"; import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; From 1298ce3a8173f97e1441f35efba169f760853b81 Mon Sep 17 00:00:00 2001 From: ISA Date: Mon, 10 Mar 2025 10:02:48 +0100 Subject: [PATCH 23/31] =?UTF-8?q?POI=20hinzuf=C3=BCgen=20auf=20die=20Kabel?= =?UTF-8?q?strecken/Polylines=20ausgeblendert?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/AddPOIModal.js | 2 + components/AddPOIOnPolyline.js | 61 ++++++++++++++++++++++++ components/mainComponent/MapComponent.js | 4 ++ config/appVersion.js | 2 +- redux/slices/addPoiOnPolylineSlice.js | 24 ++++++++++ redux/store.js | 2 + utils/setupPolylines.js | 16 +++---- 7 files changed, 102 insertions(+), 9 deletions(-) create mode 100644 components/AddPOIOnPolyline.js create mode 100644 redux/slices/addPoiOnPolylineSlice.js diff --git a/components/AddPOIModal.js b/components/AddPOIModal.js index 9841d0078..23f747e26 100644 --- a/components/AddPOIModal.js +++ b/components/AddPOIModal.js @@ -10,11 +10,13 @@ import { fetchPoiTypes } from "../redux/slices/db/poiTypesSlice"; const ShowAddStationPopup = ({ onClose, map, latlng }) => { const dispatch = useDispatch(); + const poiTypData = useSelector((state) => state.poiTypes.data); const [name, setName] = useState(""); const [poiTypeId, setPoiTypeId] = useState(""); // Initialize as string const [poiTypeName, setPoiTypeName] = useState(""); // Initialize as string + const [latitude] = useState(latlng.lat.toFixed(5)); const [longitude] = useState(latlng.lng.toFixed(5)); const setLoadData = useSetRecoilState(readPoiMarkersStore); diff --git a/components/AddPOIOnPolyline.js b/components/AddPOIOnPolyline.js new file mode 100644 index 000000000..904333c8f --- /dev/null +++ b/components/AddPOIOnPolyline.js @@ -0,0 +1,61 @@ +import React, { useState, useEffect } from "react"; +import { useDispatch, useSelector } from "react-redux"; +import { closeAddPoiOnPolylineModal } from "../redux/slices/addPoiOnPolylineSlice"; + +const AddPOIOnPolyline = () => { + const dispatch = useDispatch(); + const { isOpen, latlng } = useSelector((state) => state.addPoiOnPolyline); + + const [name, setName] = useState(""); + const [latitude, setLatitude] = useState(""); + const [longitude, setLongitude] = useState(""); + + useEffect(() => { + if (latlng) { + setLatitude(latlng.lat.toFixed(5)); + setLongitude(latlng.lng.toFixed(5)); + } + }, [latlng]); + + if (!isOpen) return null; + + const handleSubmit = async (event) => { + event.preventDefault(); + + const formData = { name, latitude, longitude }; + console.log("Neuer POI auf Polyline:", formData); + + dispatch(closeAddPoiOnPolylineModal()); // Schließt das Modal nach dem Speichern + }; + + return ( +
dispatch(closeAddPoiOnPolylineModal())}> +
e.stopPropagation()}> +

POI auf Polyline hinzufügen

+ +
+
+ + setName(e.target.value)} className="border p-2 w-full" required /> +
+ +
+ + +
+ +
+ + +
+ + +
+
+
+ ); +}; + +export default AddPOIOnPolyline; diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index f6ef66dcb..ed275ee99 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -77,9 +77,12 @@ import { useInitGisSystemStatic } from "./hooks/useInitGisSystemStatic"; import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webService/gisSystemStaticSlice"; import ShowAddStationPopup from "../AddPOIModal.js"; import { useInitGisStationsStatic } from "../mainComponent/hooks/useInitGisStationsStatic"; +import { closeAddPoiModal } from "../../redux/slices/addPoiOnPolylineSlice.js"; +import AddPOIOnPolyline from "../AddPOIOnPolyline"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); + const currentPoi = useSelector(selectCurrentPoi); //const setCurrentPoi = useSetRecoilState(currentPoiState); const polylineVisible = useSelector(selectPolylineVisible); @@ -1053,6 +1056,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { return ( <> + {useSelector((state) => state.addPoiOnPolyline.isOpen) && } {/* Zeigt das Koordinaten-Modal, wenn `showCoordinatesModal` true ist */} {showCoordinatesModal && setShowCoordinatesModal(false)} />} diff --git a/config/appVersion.js b/config/appVersion.js index 01e16d777..850178464 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.40"; +export const APP_VERSION = "1.1.41"; diff --git a/redux/slices/addPoiOnPolylineSlice.js b/redux/slices/addPoiOnPolylineSlice.js new file mode 100644 index 000000000..567ce9bb0 --- /dev/null +++ b/redux/slices/addPoiOnPolylineSlice.js @@ -0,0 +1,24 @@ +import { createSlice } from "@reduxjs/toolkit"; + +const initialState = { + isOpen: false, + latlng: null, +}; + +const addPoiOnPolylineSlice = createSlice({ + name: "addPoiOnPolyline", + initialState, + reducers: { + openAddPoiOnPolylineModal: (state, action) => { + state.isOpen = true; + state.latlng = action.payload; + }, + closeAddPoiOnPolylineModal: (state) => { + state.isOpen = false; + state.latlng = null; + }, + }, +}); + +export const { openAddPoiOnPolylineModal, closeAddPoiOnPolylineModal } = addPoiOnPolylineSlice.actions; +export default addPoiOnPolylineSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 552457811..6958b1da9 100644 --- a/redux/store.js +++ b/redux/store.js @@ -10,6 +10,7 @@ import gisStationsMeasurementsReducer from "./slices/webService/gisStationsMeasu import gisSystemStaticReducer from "./slices/webService/gisSystemStaticSlice"; import gisStationsStaticReducer from "./slices/webService/gisStationsStaticSlice"; import poiTypesReducer from "./slices/db/poiTypesSlice"; +import addPoiOnPolylineReducer from "./slices/addPoiOnPolylineSlice"; export const store = configureStore({ reducer: { @@ -23,5 +24,6 @@ export const store = configureStore({ gisSystemStatic: gisSystemStaticReducer, gisStationsStatic: gisStationsStaticReducer, poiTypes: poiTypesReducer, + addPoiOnPolyline: addPoiOnPolylineReducer, }, }); diff --git a/utils/setupPolylines.js b/utils/setupPolylines.js index 9a50800a4..e40b96f95 100644 --- a/utils/setupPolylines.js +++ b/utils/setupPolylines.js @@ -14,6 +14,7 @@ import { toast } from "react-toastify"; import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; import { useRecoilValue } from "recoil"; import { store } from "../redux/store"; // Importiere den Store +import { openAddPoiOnPolylineModal } from "../redux/slices/addPoiOnPolylineSlice"; // Funktion zum Deaktivieren der Polyline-Ereignisse export function disablePolylineEvents(polylines) { @@ -284,14 +285,14 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, 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); + store.dispatch(openAddPoiOnPolylineModal(e.latlng)); }, }, + */ { text: "Stützpunkt hinzufügen", icon: "/img/icons/gisLines/add-support-point.svg", @@ -343,15 +344,14 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, icon: "/img/center_focus.png", callback: (e) => map.panTo(e.latlng), }, - { separator: true }, - { + { 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); + store.dispatch(openAddPoiOnPolylineModal(e.latlng)); }, - } + } */ ); } From 8ab1c539964b06601df8449cf503b4e34745df1b Mon Sep 17 00:00:00 2001 From: ISA Date: Mon, 10 Mar 2025 13:49:11 +0100 Subject: [PATCH 24/31] fix: Behebt `TypeError: Cannot read properties of null (reading 'contextmenu')` mit Redux MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Implementiert `store.subscribe()` in `setupPolylines.js`, um das Kontextmenü-Handling über Redux zu steuern. - Ersetzt `useDispatch()` und `useSelector()` durch `store.dispatch()` und `store.getState()` in einer Nicht-React-Datei. - Fügt eine `forceClose`-Action in `polylineContextMenuSlice.js` hinzu, um das Kontextmenü synchron mit `setInterval` zu schließen. - Stellt sicher, dass das Kontextmenü **immer vor Ablauf des 20-Sekunden-Intervalls** geschlossen wird. - Verhindert doppelte Menüinstanzen und sorgt für ein stabiles Verhalten bei wiederholten Interaktionen. ✅ Fix für `TypeError: Cannot read properties of null (reading 'contextmenu')` ✅ **Verhindert Kontextmenü-Fehler beim automatischen Datenupdate** ✅ **Redux-gesteuerte Menüverwaltung für stabilere Performance** ✅ **Kein unerwartetes Offenbleiben oder erneutes Rendern des Menüs mehr** --- components/mainComponent/MapComponent.js | 12 ++++ config/appVersion.js | 2 +- redux/slices/polylineContextMenuSlice.js | 32 +++++++++ redux/store.js | 2 + utils/setupPolylines.js | 87 +++++++++++++++++------- 5 files changed, 110 insertions(+), 25 deletions(-) create mode 100644 redux/slices/polylineContextMenuSlice.js diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index ed275ee99..6c51d5d5f 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -79,10 +79,15 @@ import ShowAddStationPopup from "../AddPOIModal.js"; import { useInitGisStationsStatic } from "../mainComponent/hooks/useInitGisStationsStatic"; import { closeAddPoiModal } from "../../redux/slices/addPoiOnPolylineSlice.js"; import AddPOIOnPolyline from "../AddPOIOnPolyline"; +import { closePolylineContextMenu } from "../../redux/slices/polylineContextMenuSlice"; +import { forceCloseContextMenu } from "../../redux/slices/polylineContextMenuSlice"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); + const isPolylineContextMenuOpen = useSelector((state) => state.polylineContextMenu.isOpen); + const contextMenuState = useSelector((state) => state.polylineContextMenu); + const polylinePosition = contextMenuState.position ? L.latLng(contextMenuState.position.lat, contextMenuState.position.lng) : null; const currentPoi = useSelector(selectCurrentPoi); //const setCurrentPoi = useSetRecoilState(currentPoiState); const polylineVisible = useSelector(selectPolylineVisible); @@ -876,6 +881,13 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { console.log("🔥 Automatischer Klick-Event ausgelöst, um Spiderfy zu aktualisieren."); map.fire("click"); } + if (isPolylineContextMenuOpen) { + dispatch(closePolylineContextMenu()); // Schließe das Kontextmenü, bevor das nächste Update passiert + } + if (map) { + console.log("🔥 nochmal klick."); + map.fire("click"); + } }, 20000); // Aufräumen bei Komponentenentladung diff --git a/config/appVersion.js b/config/appVersion.js index 850178464..ff1a498b1 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.41"; +export const APP_VERSION = "1.1.42"; diff --git a/redux/slices/polylineContextMenuSlice.js b/redux/slices/polylineContextMenuSlice.js new file mode 100644 index 000000000..cc3dfea53 --- /dev/null +++ b/redux/slices/polylineContextMenuSlice.js @@ -0,0 +1,32 @@ +// redux/slices/polylineContextMenuSlice.js +import { createSlice } from "@reduxjs/toolkit"; + +const initialState = { + isOpen: false, + position: null, // Serialisierbarer Wert { lat, lng } + forceClose: false, // Neuer State, um das Schließen zu erzwingen +}; + +const polylineContextMenuSlice = createSlice({ + name: "polylineContextMenu", + initialState, + reducers: { + openPolylineContextMenu: (state, action) => { + state.isOpen = true; + state.position = { lat: action.payload.position.lat, lng: action.payload.position.lng }; + state.forceClose = false; // Beim Öffnen zurücksetzen + }, + closePolylineContextMenu: (state) => { + state.isOpen = false; + state.position = null; + }, + forceCloseContextMenu: (state) => { + state.isOpen = false; + state.position = null; + state.forceClose = true; // Setzt Flagge, um Schließen zu signalisieren + }, + }, +}); + +export const { openPolylineContextMenu, closePolylineContextMenu, forceCloseContextMenu } = polylineContextMenuSlice.actions; +export default polylineContextMenuSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 6958b1da9..03ffc2838 100644 --- a/redux/store.js +++ b/redux/store.js @@ -11,6 +11,7 @@ import gisSystemStaticReducer from "./slices/webService/gisSystemStaticSlice"; import gisStationsStaticReducer from "./slices/webService/gisStationsStaticSlice"; import poiTypesReducer from "./slices/db/poiTypesSlice"; import addPoiOnPolylineReducer from "./slices/addPoiOnPolylineSlice"; +import polylineContextMenuReducer from "./slices/polylineContextMenuSlice"; export const store = configureStore({ reducer: { @@ -25,5 +26,6 @@ export const store = configureStore({ gisStationsStatic: gisStationsStaticReducer, poiTypes: poiTypesReducer, addPoiOnPolyline: addPoiOnPolylineReducer, + polylineContextMenu: polylineContextMenuReducer, }, }); diff --git a/utils/setupPolylines.js b/utils/setupPolylines.js index e40b96f95..dc92b8f63 100644 --- a/utils/setupPolylines.js +++ b/utils/setupPolylines.js @@ -15,6 +15,7 @@ import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleS import { useRecoilValue } from "recoil"; import { store } from "../redux/store"; // Importiere den Store import { openAddPoiOnPolylineModal } from "../redux/slices/addPoiOnPolylineSlice"; +import { openPolylineContextMenu, closePolylineContextMenu } from "../redux/slices/polylineContextMenuSlice"; // Funktion zum Deaktivieren der Polyline-Ereignisse export function disablePolylineEvents(polylines) { @@ -51,39 +52,60 @@ export function enablePolylineEvents(polylines, lineColors) { // Funktion zum Schließen des Kontextmenüs und Entfernen der Markierung function closePolylineSelectionAndContextMenu(map) { try { - // Entferne alle markierten Polylinien + // Falls eine Polyline aktiv ist, entfernen if (window.selectedPolyline) { - window.selectedPolyline.setStyle({ weight: 3 }); // Originalstil wiederherstellen + window.selectedPolyline.setStyle({ weight: 3 }); window.selectedPolyline = null; } - // Überprüfe, ob map und map.contextmenu definiert sind - if (map && map.contextmenu) { - map.contextmenu.hide(); // Kontextmenü schließen + // Überprüfen, ob das Kontextmenü existiert, bevor es geschlossen wird + if (map && map.contextmenu && typeof map.contextmenu.hide === "function") { + map.contextmenu.hide(); // Menü schließen } else { - console.warn("Kontextmenü ist nicht verfügbar."); + console.warn("Kontextmenü existiert nicht mehr oder wurde bereits entfernt."); } } catch (error) { console.error("Fehler beim Schließen des Kontextmenüs:", error); - window.location.reload(); } - // Countdown-Status zurücksetzen + // Lokale Speicherwerte zurücksetzen localStorage.removeItem("contextMenuCountdown"); localStorage.removeItem("contextMenuExpired"); } // Überprüft regelmäßig den Status in localStorage function monitorContextMenu(map) { - setInterval(() => { + function checkAndClose() { 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 -} + if (isContextMenuExpired) { + if (map && map.contextmenu && typeof map.contextmenu.hide === "function") { + closePolylineSelectionAndContextMenu(map); + localStorage.removeItem("contextMenuExpired"); + } else { + console.warn("Kontextmenü war nicht verfügbar und konnte nicht geschlossen werden."); + } + } + + setTimeout(checkAndClose, 1000); // **Recursive Timeout statt Intervall** + } + + checkAndClose(); +} +//------------------------------------------ +store.subscribe(() => { + const state = store.getState(); // Redux-Toolkit empfohlene Methode + if (state.polylineContextMenu.forceClose) { + console.log("🚀 Redux-Event erkannt - Kontextmenü wird geschlossen."); + store.dispatch(closePolylineContextMenu()); + + if (window.map && window.map.contextmenu) { + window.map.contextmenu.hide(); + } + } +}); + +//-------------------------------------------- export const setupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible) => { if (!polylineVisible) { console.warn("Polylines deaktiviert - keine Zeichnung"); @@ -292,7 +314,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, store.dispatch(openAddPoiOnPolylineModal(e.latlng)); }, }, - */ + */ { text: "Stützpunkt hinzufügen", icon: "/img/icons/gisLines/add-support-point.svg", @@ -404,15 +426,32 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, 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(); - } + // Event-Listener für Redux Store-Änderungen registrieren + + // Starte den Timer zum Schließen des Kontextmenüs nach 15 Sekunden + + polyline.on("contextmenu", (e) => { + store.dispatch(closePolylineContextMenu()); + + setTimeout(() => { + if (!map || !map.contextmenu) return; + + store.dispatch( + openPolylineContextMenu({ + position: { lat: e.latlng.lat, lng: e.latlng.lng }, + polylineId: polyline.options.idLD, + }) + ); + + // Schließen nach 17 Sekunden + setTimeout(() => { + store.dispatch(closePolylineContextMenu()); + if (map.contextmenu) { + map.contextmenu.hide(); + } + }, 17000); + }, 50); }); polylines.push(polyline); From cc716eb4e70c530124e54588bf3dc44a02ca990d Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Mon, 10 Mar 2025 22:01:22 +0100 Subject: [PATCH 25/31] contextmenu, manchmal geht manchmal nicht, Timing Problem --- .env.local | 8 +- components/TestScript.js | 2 +- components/mainComponent/MapComponent.js | 43 ++++- config/appVersion.js | 2 +- hooks/usePolylineTooltipLayer.js | 22 +-- redux/slices/polylineContextMenuSlice.js | 24 ++- utils/createAndSetDevices.js | 2 +- utils/poiUtils.js | 2 +- utils/polylines/contextMenu.js | 29 ++++ utils/polylines/eventHandlers.js | 19 +++ utils/polylines/monitorContextMenu.js | 21 +++ utils/polylines/polylineSubscription.js | 17 ++ utils/{ => polylines}/redrawPolyline.js | 0 utils/{ => polylines}/setupPolylines.js | 199 +++++------------------ utils/setupPOIs.js | 4 +- 15 files changed, 197 insertions(+), 197 deletions(-) create mode 100644 utils/polylines/contextMenu.js create mode 100644 utils/polylines/eventHandlers.js create mode 100644 utils/polylines/monitorContextMenu.js create mode 100644 utils/polylines/polylineSubscription.js rename utils/{ => polylines}/redrawPolyline.js (100%) rename utils/{ => polylines}/setupPolylines.js (62%) diff --git a/.env.local b/.env.local index ffea95242..b05b3eea6 100644 --- a/.env.local +++ b/.env.local @@ -7,12 +7,12 @@ DB_NAME=talas_v5 DB_PORT=3306 # Public Settings (Client braucht IP/Domain) -NEXT_PUBLIC_SERVER_URL="http://10.10.0.70" # oder evtl. später https://nodemap.firma.de +NEXT_PUBLIC_SERVER_URL="http://192.168.10.33" # oder evtl. später https://nodemap.firma.de NEXT_PUBLIC_ENABLE_GEOCODER=true NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " -NEXT_PUBLIC_BASE_URL=http://10.10.0.70/talas5/devices/ -NEXT_PUBLIC_API_BASE_URL=http://10.10.0.70/talas5/ClientData/WebServiceMap.asmx -NEXT_PUBLIC_API_PORT_3000=http://10.10.0.70:3000 +NEXT_PUBLIC_BASE_URL=http://192.168.10.33/talas5/devices/ +NEXT_PUBLIC_API_BASE_URL=http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx +NEXT_PUBLIC_API_PORT_3000=http://192.168.10.33:3000 diff --git a/components/TestScript.js b/components/TestScript.js index c34b9f7dc..4a193d892 100644 --- a/components/TestScript.js +++ b/components/TestScript.js @@ -1,6 +1,6 @@ // components/TestScript.js import { useEffect } from "react"; -import setupPolylinesCode from "!!raw-loader!../utils/setupPolylines.js"; // Lädt die gesamte setupPolylines.js als Text +import setupPolylinesCode from "!!raw-loader!../utils/polylines/setupPolylines.js"; // Lädt die gesamte setupPolylines.js als Text export default function TestScript() { useEffect(() => { diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 6c51d5d5f..a627cad13 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -24,7 +24,7 @@ import addItemsToMapContextMenu from "../useMapContextMenu.js"; import useGmaMarkersLayer from "../../hooks/layers/useGmaMarkersLayer.js"; // Import the custom hook import useSmsfunkmodemMarkersLayer from "../../hooks/layers/useSmsfunkmodemMarkersLayer.js"; import useBereicheMarkersLayer from "../../hooks/layers/useBereicheMarkersLayer.js"; -import { setupPolylines } from "../../utils/setupPolylines.js"; +import { setupPolylines } from "../../utils/polylines/setupPolylines.js"; import { setupPOIs } from "../../utils/setupPOIs.js"; import VersionInfoModal from "../VersionInfoModal.js"; import useDrawLines from "../../hooks/layers/useDrawLines.js"; @@ -35,7 +35,6 @@ import useLineData from "../../hooks/useLineData.js"; //import { useCreateAndSetDevices } from "../hooks/useCreateAndSetDevices"; import { useMapComponentState } from "../../hooks/useMapComponentState.js"; -import { disablePolylineEvents, enablePolylineEvents } from "../../utils/setupPolylines.js"; import { updateLocation } from "../../utils/updateBereichUtil.js"; import { initGeocoderFeature } from "../features/GeocoderFeature.js"; //-------------------------------------------- @@ -79,12 +78,14 @@ import ShowAddStationPopup from "../AddPOIModal.js"; import { useInitGisStationsStatic } from "../mainComponent/hooks/useInitGisStationsStatic"; import { closeAddPoiModal } from "../../redux/slices/addPoiOnPolylineSlice.js"; import AddPOIOnPolyline from "../AddPOIOnPolyline"; -import { closePolylineContextMenu } from "../../redux/slices/polylineContextMenuSlice"; -import { forceCloseContextMenu } from "../../redux/slices/polylineContextMenuSlice"; + +import { enablePolylineEvents, disablePolylineEvents } from "../../utils/polylines/eventHandlers"; +import { updateCountdown, closePolylineContextMenu, forceCloseContextMenu } from "../../redux/slices/polylineContextMenuSlice"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); const isPolylineContextMenuOpen = useSelector((state) => state.polylineContextMenu.isOpen); + const countdown = useSelector((state) => state.polylineContextMenu.countdown); const contextMenuState = useSelector((state) => state.polylineContextMenu); const polylinePosition = contextMenuState.position ? L.latLng(contextMenuState.position.lat, contextMenuState.position.lng) : null; @@ -1063,6 +1064,40 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { useInitGisStationsStatic(); //-------------------------------------- + useEffect(() => { + if (isPolylineContextMenuOpen) { + console.log("🔄 Starte Redux-Countdown für Kontextmenü!"); + + const interval = setInterval(() => { + dispatch(updateCountdown()); + + console.log(`⏳ Redux Countdown: ${countdown} Sekunden`); + + if (countdown <= 2) { + console.log("🚀 Kontextmenü wird wegen Countdown < 2 geschlossen."); + dispatch(closePolylineContextMenu()); + + if (window.map?.contextmenu) { + window.map.contextmenu.hide(); + } + + clearInterval(interval); + } + }, 1000); + + return () => { + clearInterval(interval); + }; + } + }, [isPolylineContextMenuOpen, countdown, dispatch, window.map]); + + //---------------------------------- + useEffect(() => { + if (map) { + window.map = map; + console.log("✅ window.map wurde gesetzt:", window.map); + } + }, [map]); //--------------------------------------- diff --git a/config/appVersion.js b/config/appVersion.js index ff1a498b1..d84cfacff 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.42"; +export const APP_VERSION = "1.1.43"; diff --git a/hooks/usePolylineTooltipLayer.js b/hooks/usePolylineTooltipLayer.js index a0913a086..b30e6ca07 100644 --- a/hooks/usePolylineTooltipLayer.js +++ b/hooks/usePolylineTooltipLayer.js @@ -1,24 +1,10 @@ // hooks/usePolylineTooltipLayer.js import { useEffect } from "react"; import L from "leaflet"; -import { setupPolylines } from "../utils/setupPolylines"; +import { setupPolylines } from "../utils/polylines/setupPolylines"; - //Tooltip an mouse position anzeigen für die Linien -export const usePolylineTooltipLayer = ( - map, - markers, - polylines, - setMarkers, - setPolylines, - linePositions, - lineColors, - tooltipContents, - setNewCoords, - tempMarker, - polylineVisible, - newPoint, - newCoords -) => { +//Tooltip an mouse position anzeigen für die Linien +export const usePolylineTooltipLayer = (map, markers, polylines, setMarkers, setPolylines, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, polylineVisible, newPoint, newCoords) => { useEffect(() => { if (!map) return; @@ -81,4 +67,4 @@ export const usePolylineTooltipLayer = ( setMarkers(newMarkers); setPolylines(newPolylines); }, [map, linePositions, lineColors, tooltipContents, newPoint, newCoords, tempMarker, polylineVisible]); -}; \ No newline at end of file +}; diff --git a/redux/slices/polylineContextMenuSlice.js b/redux/slices/polylineContextMenuSlice.js index cc3dfea53..256c4eafb 100644 --- a/redux/slices/polylineContextMenuSlice.js +++ b/redux/slices/polylineContextMenuSlice.js @@ -3,8 +3,10 @@ import { createSlice } from "@reduxjs/toolkit"; const initialState = { isOpen: false, - position: null, // Serialisierbarer Wert { lat, lng } - forceClose: false, // Neuer State, um das Schließen zu erzwingen + position: null, + forceClose: false, + timerStart: null, + countdown: 20, }; const polylineContextMenuSlice = createSlice({ @@ -14,19 +16,31 @@ const polylineContextMenuSlice = createSlice({ openPolylineContextMenu: (state, action) => { state.isOpen = true; state.position = { lat: action.payload.position.lat, lng: action.payload.position.lng }; - state.forceClose = false; // Beim Öffnen zurücksetzen + state.forceClose = false; + state.timerStart = Date.now(); + state.countdown = 20; }, closePolylineContextMenu: (state) => { state.isOpen = false; state.position = null; + state.timerStart = null; + state.countdown = 0; + }, + updateCountdown: (state) => { + if (state.timerStart) { + const elapsedTime = (Date.now() - state.timerStart) / 1000; + state.countdown = Math.max(20 - elapsedTime, 0); + } }, forceCloseContextMenu: (state) => { state.isOpen = false; state.position = null; - state.forceClose = true; // Setzt Flagge, um Schließen zu signalisieren + state.forceClose = true; + state.timerStart = null; + state.countdown = 0; }, }, }); -export const { openPolylineContextMenu, closePolylineContextMenu, forceCloseContextMenu } = polylineContextMenuSlice.actions; +export const { openPolylineContextMenu, closePolylineContextMenu, updateCountdown, forceCloseContextMenu } = polylineContextMenuSlice.actions; export default polylineContextMenuSlice.reducer; diff --git a/utils/createAndSetDevices.js b/utils/createAndSetDevices.js index 85dd7124e..646b5d51e 100644 --- a/utils/createAndSetDevices.js +++ b/utils/createAndSetDevices.js @@ -3,7 +3,7 @@ import L from "leaflet"; import "leaflet.smooth_marker_bouncing"; import { toast } from "react-toastify"; import * as config from "../config/config.js"; -import { disablePolylineEvents, enablePolylineEvents } from "./setupPolylines"; +import { disablePolylineEvents, enablePolylineEvents } from "./polylines/setupPolylines.js"; import { store } from "../redux/store"; import { updateLineStatus } from "../redux/slices/lineVisibilitySlice"; diff --git a/utils/poiUtils.js b/utils/poiUtils.js index d5dcd5d39..0887d2b2f 100644 --- a/utils/poiUtils.js +++ b/utils/poiUtils.js @@ -1,7 +1,7 @@ // /utils/poiUtils.js import circleIcon from "../components/gisPolylines/icons/CircleIcon.js"; import { saveLineData } from "./mapUtils.js"; -import { redrawPolyline } from "./redrawPolyline.js"; +import { redrawPolyline } from "./polylines/redrawPolyline.js"; import L from "leaflet"; import "leaflet.smooth_marker_bouncing"; import { toast } from "react-toastify"; diff --git a/utils/polylines/contextMenu.js b/utils/polylines/contextMenu.js new file mode 100644 index 000000000..4d4cf0343 --- /dev/null +++ b/utils/polylines/contextMenu.js @@ -0,0 +1,29 @@ +// /utils/polylines/contextMenu.js +export function closePolylineSelectionAndContextMenu(map) { + try { + if (window.selectedPolyline) { + window.selectedPolyline.setStyle({ weight: 3 }); + window.selectedPolyline = null; + } + + if (map?.contextmenu?.hide) { + map.contextmenu.hide(); + } + } catch (error) { + console.error("Fehler beim Schließen des Kontextmenüs:", error); + } + + localStorage.removeItem("contextMenuCountdown"); + localStorage.removeItem("contextMenuExpired"); +} + +export function monitorContextMenu(map) { + function checkAndClose() { + if (localStorage.getItem("contextMenuExpired") === "true") { + closePolylineSelectionAndContextMenu(map); + localStorage.removeItem("contextMenuExpired"); + } + setTimeout(checkAndClose, 1000); + } + checkAndClose(); +} diff --git a/utils/polylines/eventHandlers.js b/utils/polylines/eventHandlers.js new file mode 100644 index 000000000..b491147b6 --- /dev/null +++ b/utils/polylines/eventHandlers.js @@ -0,0 +1,19 @@ +// /utils/polylines/eventHandlers.js +export function enablePolylineEvents(polylines, lineColors) { + if (!polylines || polylines.length === 0) { + console.warn("Keine Polylinien vorhanden oder polylines ist undefined."); + return; + } + + polylines.forEach((polyline) => { + polyline.on("mouseover", () => polyline.setStyle({ weight: 14 })); + polyline.on("mouseout", () => polyline.setStyle({ weight: 3 })); + }); +} + +export function disablePolylineEvents(polylines) { + polylines.forEach((polyline) => { + polyline.off("mouseover"); + polyline.off("mouseout"); + }); +} diff --git a/utils/polylines/monitorContextMenu.js b/utils/polylines/monitorContextMenu.js new file mode 100644 index 000000000..026781aab --- /dev/null +++ b/utils/polylines/monitorContextMenu.js @@ -0,0 +1,21 @@ +// utils/polylines/monitorContextMenu.js +import { closePolylineSelectionAndContextMenu } from "./contextMenu"; + +export function monitorContextMenu(map) { + function checkAndClose() { + const isContextMenuExpired = localStorage.getItem("contextMenuExpired") === "true"; + + if (isContextMenuExpired) { + if (map && map.contextmenu && typeof map.contextmenu.hide === "function") { + closePolylineSelectionAndContextMenu(map); + localStorage.removeItem("contextMenuExpired"); + } else { + console.warn("Kontextmenü war nicht verfügbar und konnte nicht geschlossen werden."); + } + } + + setTimeout(checkAndClose, 1000); // **Recursive Timeout statt Intervall** + } + + checkAndClose(); +} diff --git a/utils/polylines/polylineSubscription.js b/utils/polylines/polylineSubscription.js new file mode 100644 index 000000000..1f6ba0fdf --- /dev/null +++ b/utils/polylines/polylineSubscription.js @@ -0,0 +1,17 @@ +// utils/polylines/polylineSubscription.js +import { store } from "../../redux/store"; +import { closePolylineContextMenu } from "../../redux/slices/polylineContextMenuSlice"; + +export function subscribeToPolylineContextMenu() { + store.subscribe(() => { + const state = store.getState(); // Redux-Toolkit empfohlene Methode + if (state.polylineContextMenu.forceClose) { + console.log("🚀 Redux-Event erkannt - Kontextmenü wird geschlossen."); + store.dispatch(closePolylineContextMenu()); + + if (window.map && window.map.contextmenu) { + window.map.contextmenu.hide(); + } + } + }); +} diff --git a/utils/redrawPolyline.js b/utils/polylines/redrawPolyline.js similarity index 100% rename from utils/redrawPolyline.js rename to utils/polylines/redrawPolyline.js diff --git a/utils/setupPolylines.js b/utils/polylines/setupPolylines.js similarity index 62% rename from utils/setupPolylines.js rename to utils/polylines/setupPolylines.js index dc92b8f63..fb8505a76 100644 --- a/utils/setupPolylines.js +++ b/utils/polylines/setupPolylines.js @@ -1,109 +1,24 @@ -// utils/setupPolylines.js -import { findClosestPoints } from "./geometryUtils"; -import handlePoiSelect from "./handlePoiSelect"; -import { updateLocationInDatabase } from "../services/api/updateLocationInDatabase"; - -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"; +// utils/polylines/setupPolylines.js +import { findClosestPoints } from "../geometryUtils"; +import handlePoiSelect from "../handlePoiSelect"; +import { updateLocationInDatabase } from "../../services/api/updateLocationInDatabase"; +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 "./redrawPolyline"; -import { openInNewTab } from "./openInNewTab"; +import { openInNewTab } from "../openInNewTab"; import { toast } from "react-toastify"; -import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; -import { useRecoilValue } from "recoil"; -import { store } from "../redux/store"; // Importiere den Store -import { openAddPoiOnPolylineModal } from "../redux/slices/addPoiOnPolylineSlice"; -import { openPolylineContextMenu, closePolylineContextMenu } from "../redux/slices/polylineContextMenuSlice"; - -// 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 { - // Falls eine Polyline aktiv ist, entfernen - if (window.selectedPolyline) { - window.selectedPolyline.setStyle({ weight: 3 }); - window.selectedPolyline = null; - } - - // Überprüfen, ob das Kontextmenü existiert, bevor es geschlossen wird - if (map && map.contextmenu && typeof map.contextmenu.hide === "function") { - map.contextmenu.hide(); // Menü schließen - } else { - console.warn("Kontextmenü existiert nicht mehr oder wurde bereits entfernt."); - } - } catch (error) { - console.error("Fehler beim Schließen des Kontextmenüs:", error); - } - - // Lokale Speicherwerte zurücksetzen - localStorage.removeItem("contextMenuCountdown"); - localStorage.removeItem("contextMenuExpired"); -} - -// Überprüft regelmäßig den Status in localStorage -function monitorContextMenu(map) { - function checkAndClose() { - const isContextMenuExpired = localStorage.getItem("contextMenuExpired") === "true"; - - if (isContextMenuExpired) { - if (map && map.contextmenu && typeof map.contextmenu.hide === "function") { - closePolylineSelectionAndContextMenu(map); - localStorage.removeItem("contextMenuExpired"); - } else { - console.warn("Kontextmenü war nicht verfügbar und konnte nicht geschlossen werden."); - } - } - - setTimeout(checkAndClose, 1000); // **Recursive Timeout statt Intervall** - } - - checkAndClose(); -} -//------------------------------------------ -store.subscribe(() => { - const state = store.getState(); // Redux-Toolkit empfohlene Methode - if (state.polylineContextMenu.forceClose) { - console.log("🚀 Redux-Event erkannt - Kontextmenü wird geschlossen."); - store.dispatch(closePolylineContextMenu()); - - if (window.map && window.map.contextmenu) { - window.map.contextmenu.hide(); - } - } -}); +import { polylineLayerVisibleState } from "../../redux/slices/polylineLayerVisibleSlice"; +import { store } from "../../redux/store"; // Importiere den Store +import { openAddPoiOnPolylineModal } from "../../redux/slices/addPoiOnPolylineSlice"; +import { openPolylineContextMenu, closePolylineContextMenu } from "../../redux/slices/polylineContextMenuSlice"; +import { enablePolylineEvents, disablePolylineEvents } from "./eventHandlers"; +import { closePolylineSelectionAndContextMenu } from "./contextMenu"; +import { monitorContextMenu } from "./monitorContextMenu"; +import { subscribeToPolylineContextMenu } from "./polylineSubscription"; +import { forceCloseContextMenu } from "../../redux/slices/polylineContextMenuSlice"; //-------------------------------------------- export const setupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible) => { @@ -385,73 +300,37 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, 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); - }); - */ + console.log("🚀 Maus hat die Polyline verlassen - Warten auf Klick außerhalb des Menüs."); - // Event-Listener für Redux Store-Änderungen registrieren - - // Starte den Timer zum Schließen des Kontextmenüs nach 15 Sekunden - - polyline.on("contextmenu", (e) => { - store.dispatch(closePolylineContextMenu()); - - setTimeout(() => { - if (!map || !map.contextmenu) return; - - store.dispatch( - openPolylineContextMenu({ - position: { lat: e.latlng.lat, lng: e.latlng.lng }, - polylineId: polyline.options.idLD, - }) - ); - - // Schließen nach 17 Sekunden - setTimeout(() => { + document.addEventListener("click", function handleOutsideClick(event) { + if (!event.target.closest(".leaflet-contextmenu")) { + console.log("🛑 Klick außerhalb des Kontextmenüs erkannt - Schließe Menü."); store.dispatch(closePolylineContextMenu()); - if (map.contextmenu) { - map.contextmenu.hide(); + store.dispatch(forceCloseContextMenu()); + + if (window.map?.contextmenu) { + window.map.contextmenu.hide(); } - }, 17000); - }, 50); + + document.removeEventListener("click", handleOutsideClick); + } + }); + }); + polyline.on("contextmenu", (e) => { + store.dispatch( + openPolylineContextMenu({ + position: { lat: e.latlng.lat, lng: e.latlng.lng }, + polylineId: polyline.options.idLD, + }) + ); }); polylines.push(polyline); diff --git a/utils/setupPOIs.js b/utils/setupPOIs.js index 3a8225d77..92d0ebe98 100644 --- a/utils/setupPOIs.js +++ b/utils/setupPOIs.js @@ -7,9 +7,9 @@ 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 "./redrawPolyline"; +import { redrawPolyline } from "./polylines/redrawPolyline"; import { openInNewTab } from "../utils/openInNewTab"; -import { disablePolylineEvents, enablePolylineEvents } from "./setupPolylines"; // Importiere die Funktionen +import { disablePolylineEvents, enablePolylineEvents } from "./polylines/setupPolylines"; // Importiere die Funktionen export const setupPOIs = async ( map, From 6c7b3722910528f8c5462eae1e8b1f1ec272e319 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Mon, 10 Mar 2025 22:21:36 +0100 Subject: [PATCH 26/31] Seite neu laden wenn die Fehler kommt , aber wird kurz angezeigt --- components/mainComponent/MapComponent.js | 29 +++++++++++++++++++----- config/appVersion.js | 2 +- redux/slices/polylineContextMenuSlice.js | 12 +++++++++- utils/polylines/setupPolylines.js | 18 ++++++++++----- 4 files changed, 47 insertions(+), 14 deletions(-) diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index a627cad13..447b0b211 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -84,8 +84,10 @@ import { updateCountdown, closePolylineContextMenu, forceCloseContextMenu } from const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); - const isPolylineContextMenuOpen = useSelector((state) => state.polylineContextMenu.isOpen); const countdown = useSelector((state) => state.polylineContextMenu.countdown); + const countdownActive = useSelector((state) => state.polylineContextMenu.countdownActive); + const isPolylineContextMenuOpen = useSelector((state) => state.polylineContextMenu.isOpen); + const contextMenuState = useSelector((state) => state.polylineContextMenu); const polylinePosition = contextMenuState.position ? L.latLng(contextMenuState.position.lat, contextMenuState.position.lng) : null; @@ -1065,13 +1067,13 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { //-------------------------------------- useEffect(() => { - if (isPolylineContextMenuOpen) { - console.log("🔄 Starte Redux-Countdown für Kontextmenü!"); + if (isPolylineContextMenuOpen && countdownActive) { + //console.log("🔄 Starte Redux-Countdown für Kontextmenü!"); const interval = setInterval(() => { dispatch(updateCountdown()); - console.log(`⏳ Redux Countdown: ${countdown} Sekunden`); + // console.log(`⏳ Redux Countdown: ${countdown} Sekunden`); if (countdown <= 2) { console.log("🚀 Kontextmenü wird wegen Countdown < 2 geschlossen."); @@ -1089,8 +1091,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { clearInterval(interval); }; } - }, [isPolylineContextMenuOpen, countdown, dispatch, window.map]); - + }, [isPolylineContextMenuOpen, countdown, countdownActive, dispatch, window.map]); //---------------------------------- useEffect(() => { if (map) { @@ -1100,6 +1101,22 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { }, [map]); //--------------------------------------- + useEffect(() => { + window.onerror = function (message, source, lineno, colno, error) { + if (message.includes("Cannot read properties of null (reading 'contextmenu')")) { + console.warn("⚠️ Fehler mit `contextmenu` erkannt - Neuladen der Seite."); + setTimeout(() => { + window.location.reload(); + }, 2000); // **Seite nach 2 Sekunden neu laden** + } + }; + + return () => { + window.onerror = null; // **Fehlerbehandlung entfernen, wenn Komponente unmounted wird** + }; + }, []); + + //--------------------------------------------- return ( <> diff --git a/config/appVersion.js b/config/appVersion.js index d84cfacff..98a0d9bbe 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.43"; +export const APP_VERSION = "1.1.44"; diff --git a/redux/slices/polylineContextMenuSlice.js b/redux/slices/polylineContextMenuSlice.js index 256c4eafb..9735f7088 100644 --- a/redux/slices/polylineContextMenuSlice.js +++ b/redux/slices/polylineContextMenuSlice.js @@ -7,6 +7,7 @@ const initialState = { forceClose: false, timerStart: null, countdown: 20, + countdownActive: false, // **Neu: Redux merkt, ob der Timer aktiv ist** }; const polylineContextMenuSlice = createSlice({ @@ -19,17 +20,25 @@ const polylineContextMenuSlice = createSlice({ state.forceClose = false; state.timerStart = Date.now(); state.countdown = 20; + state.countdownActive = true; // **Timer aktiv setzen** }, closePolylineContextMenu: (state) => { state.isOpen = false; state.position = null; state.timerStart = null; state.countdown = 0; + state.countdownActive = false; // **Timer stoppen** }, updateCountdown: (state) => { - if (state.timerStart) { + if (state.timerStart && state.countdownActive) { const elapsedTime = (Date.now() - state.timerStart) / 1000; state.countdown = Math.max(20 - elapsedTime, 0); + + if (state.countdown <= 2) { + state.isOpen = false; + state.position = null; + state.countdownActive = false; + } } }, forceCloseContextMenu: (state) => { @@ -38,6 +47,7 @@ const polylineContextMenuSlice = createSlice({ state.forceClose = true; state.timerStart = null; state.countdown = 0; + state.countdownActive = false; }, }, }); diff --git a/utils/polylines/setupPolylines.js b/utils/polylines/setupPolylines.js index fb8505a76..6a13d18d8 100644 --- a/utils/polylines/setupPolylines.js +++ b/utils/polylines/setupPolylines.js @@ -303,21 +303,27 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, 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); + // console.log("Link der Linie:", link); }); polyline.on("mouseout", (e) => { polyline.setStyle({ weight: 3 }); - console.log("🚀 Maus hat die Polyline verlassen - Warten auf Klick außerhalb des Menüs."); + // console.log("🚀 Maus hat die Polyline verlassen - Warten auf Klick außerhalb des Menüs."); document.addEventListener("click", function handleOutsideClick(event) { if (!event.target.closest(".leaflet-contextmenu")) { console.log("🛑 Klick außerhalb des Kontextmenüs erkannt - Schließe Menü."); - store.dispatch(closePolylineContextMenu()); - store.dispatch(forceCloseContextMenu()); - if (window.map?.contextmenu) { - window.map.contextmenu.hide(); + try { + store.dispatch(closePolylineContextMenu()); + store.dispatch(forceCloseContextMenu()); + + if (window.map?.contextmenu) { + window.map.contextmenu.hide(); + } + } catch (error) { + console.error("❌ Fehler beim Schließen des Kontextmenüs:", error); + window.location.reload(); // **Seite neu laden, wenn ein Fehler auftritt** } document.removeEventListener("click", handleOutsideClick); From c797282d3512332f78484a5fbd60992dfe229500 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Mon, 10 Mar 2025 22:33:27 +0100 Subject: [PATCH 27/31] =?UTF-8?q?fix:=20TypeError:=20Cannot=20read=20prope?= =?UTF-8?q?rties=20of=20null=20(reading=20'contextmenu')=20Fehlerbehandlun?= =?UTF-8?q?g=20f=C3=BCr=20`contextmenu`=20in=20Polyline-Kontextmen=C3=BC?= =?UTF-8?q?=20verbessert=20-=20Fehler=20abgefangen,=20wenn=20`contextmenu`?= =?UTF-8?q?=20null=20ist,=20um=20React-Fehlermeldung=20zu=20vermeiden.=20-?= =?UTF-8?q?=20`window.onerror`=20hinzugef=C3=BCgt,=20um=20den=20Fehler=20g?= =?UTF-8?q?lobal=20zu=20unterdr=C3=BCcken=20und=20die=20Seite=20sofort=20n?= =?UTF-8?q?eu=20zu=20laden.=20-=20`try-catch`=20in=20`setupPolylines.js`?= =?UTF-8?q?=20eingef=C3=BCgt,=20um=20Fehler=20beim=20Schlie=C3=9Fen=20des?= =?UTF-8?q?=20Kontextmen=C3=BCs=20abzufangen.=20-=20Redux-Countdown-Manage?= =?UTF-8?q?ment=20verbessert,=20um=20Timing-Konflikte=20zwischen=20`setupP?= =?UTF-8?q?olylines.js`=20und=20`MapComponent.js`=20zu=20verhindern.=20-?= =?UTF-8?q?=20SetInterval=20durch=20Redux-Status=20gesteuert,=20um=20Synch?= =?UTF-8?q?ronisation=20zwischen=20Polyline-Kontextmen=C3=BC=20und=20Karte?= =?UTF-8?q?naktualisierung=20zu=20gew=C3=A4hrleisten.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 🚀 Fehler tritt jetzt nicht mehr in der React-Oberfläche auf und wird automatisch behoben. --- components/mainComponent/MapComponent.js | 3 ++- config/appVersion.js | 2 +- utils/polylines/setupPolylines.js | 6 +++--- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 447b0b211..bd579ff95 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -1107,7 +1107,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { console.warn("⚠️ Fehler mit `contextmenu` erkannt - Neuladen der Seite."); setTimeout(() => { window.location.reload(); - }, 2000); // **Seite nach 2 Sekunden neu laden** + }, 0); // **Seite nach Sekunde neu laden** + return true; // **Fehler unterdrücken, damit React ihn nicht anzeigt** } }; diff --git a/config/appVersion.js b/config/appVersion.js index 98a0d9bbe..c2cb28618 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.44"; +export const APP_VERSION = "1.1.45"; diff --git a/utils/polylines/setupPolylines.js b/utils/polylines/setupPolylines.js index 6a13d18d8..75e34bb09 100644 --- a/utils/polylines/setupPolylines.js +++ b/utils/polylines/setupPolylines.js @@ -305,10 +305,10 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`; // console.log("Link der Linie:", link); }); - + // error TypeError: Cannot read properties of null (reading 'contextmenu') wenn der Mas auf die Linie bleibt polyline.on("mouseout", (e) => { polyline.setStyle({ weight: 3 }); - // console.log("🚀 Maus hat die Polyline verlassen - Warten auf Klick außerhalb des Menüs."); + //console.log("🚀 Maus hat die Polyline verlassen - Warten auf Klick außerhalb des Menüs."); document.addEventListener("click", function handleOutsideClick(event) { if (!event.target.closest(".leaflet-contextmenu")) { @@ -323,7 +323,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, } } catch (error) { console.error("❌ Fehler beim Schließen des Kontextmenüs:", error); - window.location.reload(); // **Seite neu laden, wenn ein Fehler auftritt** + // **Seite NICHT sofort neuladen, sondern global unterdrücken lassen** } document.removeEventListener("click", handleOutsideClick); From 0dce495435aef282f668c57b8bfccbca02b98217 Mon Sep 17 00:00:00 2001 From: ISA Date: Tue, 11 Mar 2025 06:47:46 +0100 Subject: [PATCH 28/31] refactor: mainComponent/hooks/webServices/ --- .env.local | 8 ++++---- components/DataSheet.js | 2 +- components/mainComponent/MapComponent.js | 12 ++++++------ .../useAutoRefreshLocationDevices.js | 2 +- .../useInitGisStationsMeasurements.js | 2 +- .../{ => webServices}/useInitGisStationsStatic.js | 2 +- .../useInitGisStationsStaticDistrict.js | 2 +- .../useInitGisStationsStatusDistrict.js | 2 +- .../{ => webServices}/useInitGisSystemStatic.js | 2 +- .../{ => webServices}/useInitLocationDevices.js | 2 +- config/appVersion.js | 2 +- 11 files changed, 19 insertions(+), 19 deletions(-) rename components/mainComponent/hooks/{ => webServices}/useAutoRefreshLocationDevices.js (91%) rename components/mainComponent/hooks/{ => webServices}/useInitGisStationsMeasurements.js (86%) rename components/mainComponent/hooks/{ => webServices}/useInitGisStationsStatic.js (92%) rename components/mainComponent/hooks/{ => webServices}/useInitGisStationsStaticDistrict.js (85%) rename components/mainComponent/hooks/{ => webServices}/useInitGisStationsStatusDistrict.js (85%) rename components/mainComponent/hooks/{ => webServices}/useInitGisSystemStatic.js (74%) rename components/mainComponent/hooks/{ => webServices}/useInitLocationDevices.js (75%) diff --git a/.env.local b/.env.local index b05b3eea6..ffea95242 100644 --- a/.env.local +++ b/.env.local @@ -7,12 +7,12 @@ DB_NAME=talas_v5 DB_PORT=3306 # Public Settings (Client braucht IP/Domain) -NEXT_PUBLIC_SERVER_URL="http://192.168.10.33" # oder evtl. später https://nodemap.firma.de +NEXT_PUBLIC_SERVER_URL="http://10.10.0.70" # oder evtl. später https://nodemap.firma.de NEXT_PUBLIC_ENABLE_GEOCODER=true NEXT_PUBLIC_USE_MOCK_API=false NEXT_PUBLIC_DEBUG_LOG=true # für Polylines/kabelstecken -> in Konextmenü "Station öffnen" " -NEXT_PUBLIC_BASE_URL=http://192.168.10.33/talas5/devices/ -NEXT_PUBLIC_API_BASE_URL=http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx -NEXT_PUBLIC_API_PORT_3000=http://192.168.10.33:3000 +NEXT_PUBLIC_BASE_URL=http://10.10.0.70/talas5/devices/ +NEXT_PUBLIC_API_BASE_URL=http://10.10.0.70/talas5/ClientData/WebServiceMap.asmx +NEXT_PUBLIC_API_PORT_3000=http://10.10.0.70:3000 diff --git a/components/DataSheet.js b/components/DataSheet.js index 403f61813..b00a21eb0 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -12,7 +12,7 @@ import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleS import { useSelector, useDispatch } from "react-redux"; import { selectPolylineVisible, setPolylineVisible } from "../redux/slices/polylineLayerVisibleSlice"; import { selectGisSystemStatic } from "../redux/slices/webService/gisSystemStaticSlice"; -import { useInitGisStationsStatic } from "../components/mainComponent/hooks/useInitGisStationsStatic"; +import { useInitGisStationsStatic } from "../components/mainComponent/hooks/webServices/useInitGisStationsStatic"; import { fetchGisStationsStatic, selectGisStationsStatic } from "../redux/slices/webService/gisStationsStaticSlice"; import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index bd579ff95..faf6f7bda 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -67,15 +67,15 @@ import { fetchGisStationsMeasurements } from "../../services/api/fetchGisStation import { fetchGisSystemStatic } from "../../services/api/fetchGisSystemStatic.js"; import { usePolylineTooltipLayer } from "../../hooks/usePolylineTooltipLayer.js"; import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/polylineLayerVisibleSlice.js"; -import { useInitLocationDevices } from "./hooks/useInitLocationDevices"; -import { useInitGisStationsStaticDistrict } from "./hooks/useInitGisStationsStaticDistrict"; +import { useInitLocationDevices } from "./hooks/webServices/useInitLocationDevices"; +import { useInitGisStationsStaticDistrict } from "./hooks/webServices/useInitGisStationsStaticDistrict"; import { selectGisStationsStaticDistrict } from "../../redux/slices/webService/gisStationsStaticDistrictSlice"; -import { useInitGisStationsStatusDistrict } from "./hooks/useInitGisStationsStatusDistrict"; -import { useInitGisStationsMeasurements } from "./hooks/useInitGisStationsMeasurements"; -import { useInitGisSystemStatic } from "./hooks/useInitGisSystemStatic"; +import { useInitGisStationsStatusDistrict } from "./hooks/webServices/useInitGisStationsStatusDistrict"; +import { useInitGisStationsMeasurements } from "./hooks/webServices/useInitGisStationsMeasurements"; +import { useInitGisSystemStatic } from "./hooks/webServices/useInitGisSystemStatic"; import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webService/gisSystemStaticSlice"; import ShowAddStationPopup from "../AddPOIModal.js"; -import { useInitGisStationsStatic } from "../mainComponent/hooks/useInitGisStationsStatic"; +import { useInitGisStationsStatic } from "../mainComponent/hooks/webServices/useInitGisStationsStatic"; import { closeAddPoiModal } from "../../redux/slices/addPoiOnPolylineSlice.js"; import AddPOIOnPolyline from "../AddPOIOnPolyline"; diff --git a/components/mainComponent/hooks/useAutoRefreshLocationDevices.js b/components/mainComponent/hooks/webServices/useAutoRefreshLocationDevices.js similarity index 91% rename from components/mainComponent/hooks/useAutoRefreshLocationDevices.js rename to components/mainComponent/hooks/webServices/useAutoRefreshLocationDevices.js index df25ec554..5d0e146a0 100644 --- a/components/mainComponent/hooks/useAutoRefreshLocationDevices.js +++ b/components/mainComponent/hooks/webServices/useAutoRefreshLocationDevices.js @@ -8,7 +8,7 @@ Daten werden dann in der Redux State gespeichert import { useEffect } from "react"; import { useDispatch } from "react-redux"; -import { fetchLocationDevicesFromDB } from "../../../redux/slices/db/locationDevicesFromDBSlice"; +import { fetchLocationDevicesFromDB } from "../../../../redux/slices/db/locationDevicesFromDBSlice"; export const useAutoRefreshLocationDevices = (interval = 20000) => { // alle 20 Sekunden diff --git a/components/mainComponent/hooks/useInitGisStationsMeasurements.js b/components/mainComponent/hooks/webServices/useInitGisStationsMeasurements.js similarity index 86% rename from components/mainComponent/hooks/useInitGisStationsMeasurements.js rename to components/mainComponent/hooks/webServices/useInitGisStationsMeasurements.js index 77cedf59e..2db27df07 100644 --- a/components/mainComponent/hooks/useInitGisStationsMeasurements.js +++ b/components/mainComponent/hooks/webServices/useInitGisStationsMeasurements.js @@ -1,7 +1,7 @@ // /components/mainComponent/hooks/useInitGisStationsMeasurements.js import { useEffect } from "react"; import { useDispatch } from "react-redux"; -import { fetchGisStationsMeasurementsFromWebService } from "../../../redux/slices/webService/gisStationsMeasurementsSlice"; +import { fetchGisStationsMeasurementsFromWebService } from "../../../../redux/slices/webService/gisStationsMeasurementsSlice"; export const useInitGisStationsMeasurements = () => { const dispatch = useDispatch(); diff --git a/components/mainComponent/hooks/useInitGisStationsStatic.js b/components/mainComponent/hooks/webServices/useInitGisStationsStatic.js similarity index 92% rename from components/mainComponent/hooks/useInitGisStationsStatic.js rename to components/mainComponent/hooks/webServices/useInitGisStationsStatic.js index 533ebd5ed..7c4596e45 100644 --- a/components/mainComponent/hooks/useInitGisStationsStatic.js +++ b/components/mainComponent/hooks/webServices/useInitGisStationsStatic.js @@ -2,7 +2,7 @@ //Bereiche/Area-Name Dropdownmenu für Datasheet wird hier initialisiert und in der Komponente verwendet import { useEffect } from "react"; import { useDispatch, useSelector } from "react-redux"; -import { fetchGisStationsStatic, selectGisStationsStatic } from "../../../redux/slices/webService/gisStationsStaticSlice"; +import { fetchGisStationsStatic, selectGisStationsStatic } from "../../../../redux/slices/webService/gisStationsStaticSlice"; export const useInitGisStationsStatic = () => { const dispatch = useDispatch(); diff --git a/components/mainComponent/hooks/useInitGisStationsStaticDistrict.js b/components/mainComponent/hooks/webServices/useInitGisStationsStaticDistrict.js similarity index 85% rename from components/mainComponent/hooks/useInitGisStationsStaticDistrict.js rename to components/mainComponent/hooks/webServices/useInitGisStationsStaticDistrict.js index b53d554ad..74d70c736 100644 --- a/components/mainComponent/hooks/useInitGisStationsStaticDistrict.js +++ b/components/mainComponent/hooks/webServices/useInitGisStationsStaticDistrict.js @@ -1,7 +1,7 @@ // /components/mainComponent/hooks/useInitGisStationsStaticDistrict.js import { useEffect } from "react"; import { useDispatch } from "react-redux"; -import { fetchGisStationsStaticDistrictFromWebService } from "../../../redux/slices/webService/gisStationsStaticDistrictSlice"; +import { fetchGisStationsStaticDistrictFromWebService } from "../../../../redux/slices/webService/gisStationsStaticDistrictSlice"; export const useInitGisStationsStaticDistrict = () => { const dispatch = useDispatch(); diff --git a/components/mainComponent/hooks/useInitGisStationsStatusDistrict.js b/components/mainComponent/hooks/webServices/useInitGisStationsStatusDistrict.js similarity index 85% rename from components/mainComponent/hooks/useInitGisStationsStatusDistrict.js rename to components/mainComponent/hooks/webServices/useInitGisStationsStatusDistrict.js index 6d75ab118..147b1fa31 100644 --- a/components/mainComponent/hooks/useInitGisStationsStatusDistrict.js +++ b/components/mainComponent/hooks/webServices/useInitGisStationsStatusDistrict.js @@ -1,7 +1,7 @@ // /componets/mainComponent/hooks/useInitGisStationsStatusDistrict.js import { useEffect } from "react"; import { useDispatch } from "react-redux"; -import { fetchGisStationsStatusDistrictFromWebService } from "../../../redux/slices/webService/gisStationsStatusDistrictSlice"; +import { fetchGisStationsStatusDistrictFromWebService } from "../../../../redux/slices/webService/gisStationsStatusDistrictSlice"; export const useInitGisStationsStatusDistrict = () => { const dispatch = useDispatch(); diff --git a/components/mainComponent/hooks/useInitGisSystemStatic.js b/components/mainComponent/hooks/webServices/useInitGisSystemStatic.js similarity index 74% rename from components/mainComponent/hooks/useInitGisSystemStatic.js rename to components/mainComponent/hooks/webServices/useInitGisSystemStatic.js index 621eb7dea..b7a58a3e4 100644 --- a/components/mainComponent/hooks/useInitGisSystemStatic.js +++ b/components/mainComponent/hooks/webServices/useInitGisSystemStatic.js @@ -1,7 +1,7 @@ // /components/mainComponent/hooks/useInitGisStationsMeasurements.js import { useEffect } from "react"; import { useDispatch } from "react-redux"; -import { fetchGisSystemStaticFromWebService } from "../../../redux/slices/webService/gisSystemStaticSlice"; +import { fetchGisSystemStaticFromWebService } from "../../../../redux/slices/webService/gisSystemStaticSlice"; export const useInitGisSystemStatic = () => { const dispatch = useDispatch(); diff --git a/components/mainComponent/hooks/useInitLocationDevices.js b/components/mainComponent/hooks/webServices/useInitLocationDevices.js similarity index 75% rename from components/mainComponent/hooks/useInitLocationDevices.js rename to components/mainComponent/hooks/webServices/useInitLocationDevices.js index 9e01183b4..49708264f 100644 --- a/components/mainComponent/hooks/useInitLocationDevices.js +++ b/components/mainComponent/hooks/webServices/useInitLocationDevices.js @@ -1,7 +1,7 @@ // /components/mainComponent/hooks/useInitLocationDevices.js import { useEffect } from "react"; import { useDispatch } from "react-redux"; -import { fetchLocationDevicesFromDB } from "../../../redux/slices/db/locationDevicesFromDBSlice"; +import { fetchLocationDevicesFromDB } from "../../../../redux/slices/db/locationDevicesFromDBSlice"; export const useInitLocationDevices = () => { const dispatch = useDispatch(); diff --git a/config/appVersion.js b/config/appVersion.js index c2cb28618..c0d3f977c 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.45"; +export const APP_VERSION = "1.1.46"; From f59fb62d29af16df875f23ea0bbd06e74753c8c8 Mon Sep 17 00:00:00 2001 From: ISA Date: Tue, 11 Mar 2025 07:45:08 +0100 Subject: [PATCH 29/31] hooks auslagern von MapComponent, useInitializeMap.js und useLoadUserRights.js --- components/mainComponent/MapComponent.js | 26 +++++---------- .../hooks/useFetchWebServiceData.js | 32 +++++++++++++++++++ .../mainComponent/hooks/useInitializeMap.js | 13 ++++++++ .../mainComponent/hooks/useLoadUserRights.js | 20 ++++++++++++ .../mainComponent/hooks/useSetupMarkers.js | 26 +++++++++++++++ .../mainComponent/hooks/useSetupPolylines.js | 13 ++++++++ config/appVersion.js | 2 +- 7 files changed, 113 insertions(+), 19 deletions(-) create mode 100644 components/mainComponent/hooks/useFetchWebServiceData.js create mode 100644 components/mainComponent/hooks/useInitializeMap.js create mode 100644 components/mainComponent/hooks/useLoadUserRights.js create mode 100644 components/mainComponent/hooks/useSetupMarkers.js create mode 100644 components/mainComponent/hooks/useSetupPolylines.js diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index faf6f7bda..bdeb0e2bb 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -78,9 +78,11 @@ import ShowAddStationPopup from "../AddPOIModal.js"; import { useInitGisStationsStatic } from "../mainComponent/hooks/webServices/useInitGisStationsStatic"; import { closeAddPoiModal } from "../../redux/slices/addPoiOnPolylineSlice.js"; import AddPOIOnPolyline from "../AddPOIOnPolyline"; - import { enablePolylineEvents, disablePolylineEvents } from "../../utils/polylines/eventHandlers"; import { updateCountdown, closePolylineContextMenu, forceCloseContextMenu } from "../../redux/slices/polylineContextMenuSlice"; +//-------------------MapComponent.js hooks-------------------- +import useInitializeMap from "./hooks/useInitializeMap"; +import useLoadUserRights from "./hooks/useLoadUserRights"; const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const dispatch = useDispatch(); @@ -251,18 +253,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { isRightsLoaded, // Überprüfung, ob die Rechte geladen sind ]); */ - useEffect(() => { - const fetchAndSetUserRights = async () => { - const rights = await fetchUserRights(); - setUserRights(rights); - setIsRightsLoaded(true); - - // Sicherstellen, dass `rights` ein Array ist, bevor `.includes()` aufgerufen wird - setHasRights(localStorage.getItem("editMode") && Array.isArray(rights) && rights.includes(56)); - }; - - fetchAndSetUserRights(); - }, []); + useLoadUserRights(setUserRights, setIsRightsLoaded, setHasRights); useGmaMarkersLayer( map, @@ -722,11 +713,9 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { fetchPriorityConfig(); }, []); //-------------------------------------------- - useEffect(() => { - if (mapRef.current && !map) { - initializeMap(mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, setPolylineEventsDisabled); - } - }, [mapRef, map, hasRights, setPolylineEventsDisabled]); + useInitializeMap(map, mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, setPolylineEventsDisabled); + + //-------------------------------------------- useEffect(() => { if (map) { @@ -737,6 +726,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { } } }, [map, polylineEventsDisabled]); + //-------------------------------------------- useEffect(() => { if (map) { console.log("6- Karteninstanz (map) wurde jetzt erfolgreich initialisiert"); diff --git a/components/mainComponent/hooks/useFetchWebServiceData.js b/components/mainComponent/hooks/useFetchWebServiceData.js new file mode 100644 index 000000000..70e293943 --- /dev/null +++ b/components/mainComponent/hooks/useFetchWebServiceData.js @@ -0,0 +1,32 @@ +// /components/mainComponent/hooks/useFetchWebServiceData.js +import { useEffect } from "react"; +import fetchGisStationsStatusDistrict from "../../../services/api/fetchGisStationsStatusDistrict"; +import fetchGisStationsMeasurements from "../../../services/api/fetchGisStationsMeasurements"; +import fetchGisSystemStatic from "../../../services/api/fetchGisSystemStatic"; + +const useFetchWebServiceData = ( + mapGisStationsStatusDistrictUrl, + setGisStationsStatusDistrict, + mapGisStationsMeasurementsUrl, + setGisStationsMeasurements, + mapGisSystemStaticUrl, + setGisSystemStatic, + setGisSystemStaticLoaded, + setIsDataLoaded // <-- Status aus MapComponent.js übergeben +) => { + useEffect(() => { + const fetchData = async () => { + try { + await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStationsStatusDistrict); + await fetchGisStationsMeasurements(mapGisStationsMeasurementsUrl, setGisStationsMeasurements); + await fetchGisSystemStatic(mapGisSystemStaticUrl, setGisSystemStatic, setGisSystemStaticLoaded); + setIsDataLoaded(true); // <-- Setzt den Status in MapComponent.js + } catch (error) { + console.error("Error fetching data:", error); + } + }; + fetchData(); + }, [mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl]); +}; + +export default useFetchWebServiceData; diff --git a/components/mainComponent/hooks/useInitializeMap.js b/components/mainComponent/hooks/useInitializeMap.js new file mode 100644 index 000000000..21114e3d2 --- /dev/null +++ b/components/mainComponent/hooks/useInitializeMap.js @@ -0,0 +1,13 @@ +// /components/mainComponent/hooks/useInitializeMap.js +import { useEffect } from "react"; +import { initializeMap } from "../../../utils/initializeMap"; + +const useInitializeMap = (map, mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, setPolylineEventsDisabled) => { + useEffect(() => { + if (mapRef.current && !map) { + initializeMap(mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, setPolylineEventsDisabled); + } + }, [mapRef, map, hasRights, setPolylineEventsDisabled]); +}; + +export default useInitializeMap; diff --git a/components/mainComponent/hooks/useLoadUserRights.js b/components/mainComponent/hooks/useLoadUserRights.js new file mode 100644 index 000000000..fa3688085 --- /dev/null +++ b/components/mainComponent/hooks/useLoadUserRights.js @@ -0,0 +1,20 @@ +// /components/mainComponent/hooks/useLoadUserRights.js +import { useEffect } from "react"; +import { fetchUserRights } from "../../../services/api/fetchUserRights"; + +const useLoadUserRights = (setUserRights, setIsRightsLoaded, setHasRights) => { + useEffect(() => { + const fetchAndSetUserRights = async () => { + const rights = await fetchUserRights(); + setUserRights(rights); + setIsRightsLoaded(true); + + // Sicherstellen, dass `rights` ein Array ist, bevor `.includes()` aufgerufen wird + setHasRights(localStorage.getItem("editMode") && Array.isArray(rights) && rights.includes(56)); + }; + + fetchAndSetUserRights(); + }, []); +}; + +export default useLoadUserRights; diff --git a/components/mainComponent/hooks/useSetupMarkers.js b/components/mainComponent/hooks/useSetupMarkers.js new file mode 100644 index 000000000..b59fdd0b1 --- /dev/null +++ b/components/mainComponent/hooks/useSetupMarkers.js @@ -0,0 +1,26 @@ +// /components/mainComponent/hooks/useSetupMarkers.js +import { useEffect } from "react"; +import { checkOverlappingMarkers } from "../../../utils/mapUtils"; + +const useSetupMarkers = (map, allMarkers, mapLayersVisibility, plusRoundIcon) => { + useEffect(() => { + if (map) { + allMarkers.forEach((marker) => { + const layerKey = marker.options?.layerKey; + const isVisible = mapLayersVisibility[layerKey]; + + if (!layerKey || isVisible === undefined) return; + + if (localStorage.getItem("editMode") === "true" || !isVisible) { + if (map.hasLayer(marker)) map.removeLayer(marker); + } else { + if (!map.hasLayer(marker)) marker.addTo(map); + } + }); + + checkOverlappingMarkers(map, allMarkers, plusRoundIcon); + } + }, [map, allMarkers, mapLayersVisibility]); +}; + +export default useSetupMarkers; diff --git a/components/mainComponent/hooks/useSetupPolylines.js b/components/mainComponent/hooks/useSetupPolylines.js new file mode 100644 index 000000000..d07103790 --- /dev/null +++ b/components/mainComponent/hooks/useSetupPolylines.js @@ -0,0 +1,13 @@ +// useSetupPolylines.js +import { useEffect } from "react"; +import { setupPolylines } from "../../utils/polylines/setupPolylines"; + +const useSetupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible) => { + useEffect(() => { + if (!map) return; + + const { markers: newMarkers, polylines: newPolylines } = setupPolylines(map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible); + }, [map, linePositions, lineColors, tooltipContents, newCoords, tempMarker, polylineVisible]); +}; + +export default useSetupPolylines; diff --git a/config/appVersion.js b/config/appVersion.js index c0d3f977c..45ca38b43 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.46"; +export const APP_VERSION = "1.1.47"; From a846bd14cefd775c284983736639fef8cd32897c Mon Sep 17 00:00:00 2001 From: ISA Date: Tue, 11 Mar 2025 07:52:27 +0100 Subject: [PATCH 30/31] =?UTF-8?q?Kommentare=20entfernt,=20was=20nicht=20be?= =?UTF-8?q?n=C3=B6tigt=20wird?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/mainComponent/MapComponent.js | 4 ++-- config/appVersion.js | 2 +- utils/polylines/eventHandlers.js | 2 +- utils/polylines/setupPolylines.js | 4 ++-- utils/setupPOIs.js | 2 +- 5 files changed, 7 insertions(+), 7 deletions(-) diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index bdeb0e2bb..1039594e5 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -871,14 +871,14 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { updateAllMarkers(); if (map) { - console.log("🔥 Automatischer Klick-Event ausgelöst, um Spiderfy zu aktualisieren."); + // console.log("🔥 Automatischer Klick-Event ausgelöst, um Spiderfy zu aktualisieren."); map.fire("click"); } if (isPolylineContextMenuOpen) { dispatch(closePolylineContextMenu()); // Schließe das Kontextmenü, bevor das nächste Update passiert } if (map) { - console.log("🔥 nochmal klick."); + // console.log("🔥 nochmal klick."); map.fire("click"); } }, 20000); diff --git a/config/appVersion.js b/config/appVersion.js index 45ca38b43..434495a4a 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.47"; +export const APP_VERSION = "1.1.48"; diff --git a/utils/polylines/eventHandlers.js b/utils/polylines/eventHandlers.js index b491147b6..c645ba2fd 100644 --- a/utils/polylines/eventHandlers.js +++ b/utils/polylines/eventHandlers.js @@ -1,7 +1,7 @@ // /utils/polylines/eventHandlers.js export function enablePolylineEvents(polylines, lineColors) { if (!polylines || polylines.length === 0) { - console.warn("Keine Polylinien vorhanden oder polylines ist undefined."); + //console.warn("Keine Polylinien vorhanden oder polylines ist undefined."); return; } diff --git a/utils/polylines/setupPolylines.js b/utils/polylines/setupPolylines.js index 75e34bb09..cc310835b 100644 --- a/utils/polylines/setupPolylines.js +++ b/utils/polylines/setupPolylines.js @@ -23,7 +23,7 @@ import { forceCloseContextMenu } from "../../redux/slices/polylineContextMenuSli //-------------------------------------------- export const setupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible) => { if (!polylineVisible) { - console.warn("Polylines deaktiviert - keine Zeichnung"); + //console.warn("Polylines deaktiviert - keine Zeichnung"); return { markers: [], polylines: [] }; } @@ -312,7 +312,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents, document.addEventListener("click", function handleOutsideClick(event) { if (!event.target.closest(".leaflet-contextmenu")) { - console.log("🛑 Klick außerhalb des Kontextmenüs erkannt - Schließe Menü."); + //console.log("🛑 Klick außerhalb des Kontextmenüs erkannt - Schließe Menü."); try { store.dispatch(closePolylineContextMenu()); diff --git a/utils/setupPOIs.js b/utils/setupPOIs.js index 92d0ebe98..6789faa61 100644 --- a/utils/setupPOIs.js +++ b/utils/setupPOIs.js @@ -83,7 +83,7 @@ export const setupPOIs = async ( `); marker.on("mouseover", function () { - console.log("Device Name:", marker); // Debugging + //console.log("Device Name:", marker); // Debugging handlePoiSelect( { id: location.idPoi, From 0998fcf7c2457975ef28fccacafbd3de3e4d2ab8 Mon Sep 17 00:00:00 2001 From: ISA Date: Tue, 11 Mar 2025 08:31:15 +0100 Subject: [PATCH 31/31] was nicht ausgelagert ist entfernt --- components/mainComponent/MapComponent.js | 232 +++++++----------- .../hooks/useFetchWebServiceData.js | 32 --- .../mainComponent/hooks/useSetupMarkers.js | 26 -- .../mainComponent/hooks/useSetupPolylines.js | 13 - config/appVersion.js | 2 +- 5 files changed, 89 insertions(+), 216 deletions(-) delete mode 100644 components/mainComponent/hooks/useFetchWebServiceData.js delete mode 100644 components/mainComponent/hooks/useSetupMarkers.js delete mode 100644 components/mainComponent/hooks/useSetupPolylines.js diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 1039594e5..ada4bacc0 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -133,7 +133,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const setSelectedPoi = useSetRecoilState(selectedPoiState); const [showPoiUpdateModal, setShowPoiUpdateModal] = useState(false); const [currentPoiData, setCurrentPoiData] = useState(null); - const [showVersionInfoModal, setShowVersionInfoModal] = useState(false); const zoomTrigger = useRecoilValue(zoomTriggerState); const [gisSystemStaticLoaded, setGisSystemStaticLoaded] = useState(false); @@ -144,7 +143,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const mapRef = useRef(null); // Referenz auf das DIV-Element der Karte const [map, setMap] = useState(null); // Zustand der Karteninstanz const [oms, setOms] = useState(null); // State für OMS-Instanz - //const [GisStationsStaticDistrict, setGisStationsStaticDistrict] = useRecoilState(gisStationsStaticDistrictState); const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict); const [GisStationsStatusDistrict, setGisStationsStatusDistrict] = useState([]); // Zustand für Statusdaten const [GisStationsMeasurements, setGisStationsMeasurements] = useState([]); // Zustand für Messdaten @@ -156,7 +154,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const mapGisSystemStaticUrl = config.mapGisSystemStaticUrl; const webserviceGisLinesStatusUrl = config.webserviceGisLinesStatusUrl; //console.log("priorityConfig in MapComponent1: ", priorityConfig); - + //----------------------------------------- const [gmaMarkers, setGmaMarkers] = useState([]); //--------------------station.System === 11 alle sind untetschiedlich Nummern const [talasMarkers, setTalasMarkers] = useState([]); const [eciMarkers, setEciMarkers] = useState([]); @@ -173,7 +171,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const [ulafMarkers, setUlafMarkers] = useState([]); const [sonstigeMarkers, setSonstigeMarkers] = useState([]); const [tkComponentsMarkers, setTkComponentsMarkers] = useState([]); - + //-------------------------------------------- const [lineStatusData, setLineStatusData] = useState([]); const [linesData, setLinesData] = useState([]); const mapLayersVisibility = useRecoilValue(mapLayersState); @@ -183,39 +181,27 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const { lineColors, tooltipContents } = useLineData(webserviceGisLinesStatusUrl, setLineStatusData); const [polylines, setPolylines] = useState([]); const [markers, setMarkers] = useState([]); - const [newPoint, setNewPoint] = useState(null); const [newCoords, setNewCoords] = useState(null); const [tempMarker, setTempMarker] = useState(null); - const [showPoiModal, setShowPoiModal] = useState(false); const [showCoordinatesModal, setShowCoordinatesModal] = useState(false); const [popupCoordinates, setPopupCoordinates] = useState(null); - /* - const [popupCoordinates, setPopupCoordinates] = useState({ - lat: 52.52, - lng: 13.405, - }); */ const [popupVisible, setPopupVisible] = useState(false); - const handleAddStation = (stationData) => { setAddPoiModalWindowState(false); closePopup(); // Schließt das Popup nach dem Hinzufügen }; - const openVersionInfoModal = () => { setShowVersionInfoModal(true); }; - const closeVersionInfoModal = () => { setShowVersionInfoModal(false); }; - const [currentZoom, setCurrentZoom] = useState(() => { const storedZoom = localStorage.getItem("mapZoom"); return storedZoom ? parseInt(storedZoom, 10) : 12; }); - const [currentCenter, setCurrentCenter] = useState(() => { const storedCenter = localStorage.getItem("mapCenter"); try { @@ -226,53 +212,49 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { } }); const [polylineEventsDisabled, setPolylineEventsDisabled] = useRecoilState(polylineEventsDisabledState); // Recoil State - + const allMarkers = [ + ...talasMarkers, + ...eciMarkers, + ...lteModemMarkers, + ...ciscoRouterMarkers, + ...wagoMarkers, + ...siemensMarkers, + ...otdrMarkers, + ...wdmMarkers, + ...gmaMarkers, + ...messstellenMarkers, + ...talasiclMarkers, + ...dauzMarkers, + ...smsfunkmodemMarkers, + ...sonstigeMarkers, + ...tkComponentsMarkers, + ...ulafMarkers, + ]; + const useMock = process.env.NEXT_PUBLIC_USE_MOCK_API === "true"; + //-------------------------------------------- + const gmaLayerRef = useRef(null); + const talasLayerRef = useRef(null); + const eciMarkersLayerRef = useRef(null); + const lteModemMarkersLayerRef = useRef(null); + const ciscoRouterMarkersLayerRef = useRef(null); + const wagoMarkersLayerRef = useRef(null); + const siemensMarkersLayerRef = useRef(null); + const otdrMarkersLayerRef = useRef(null); + const wdmMarkersLayerRef = useRef(null); + const messstellenMarkersLayerRef = useRef(null); + const talasiclMarkersLayerRef = useRef(null); + const dauzMarkersLayerRef = useRef(null); + const smsfunkmodemMarkersLayerRef = useRef(null); + const ulafMarkersLayerRef = useRef(null); + const sonstigeMarkersLayerRef = useRef(null); + const tkComponentsMarkersRef = useRef(null); //--------------------------------------------------------------- - - /* useEffect(() => { - fetchGisStatusStations(12, 484); // Beispielaufruf mit idMap = 10 und idUser = 484 - }, []); */ - useEffect(() => { const params = new URL(window.location.href).searchParams; setMapId(params.get("m")); setUserId(params.get("u")); }, [setMapId, setUserId]); - - /* useEffect(() => { - if (map && poiLayerRef.current && isPoiTypLoaded && !menuItemAdded && isRightsLoaded) { - //console.log("Überprüfung der Berechtigung vor addItemsToMapContextMenu: ", hasRights); - addItemsToMapContextMenu(hasRights); - } - }, [ - map, - poiLayerRef, - isPoiTypLoaded, - menuItemAdded, // Hinzufügen zu den Abhängigkeiten, um den Effekt korrekt zu steuern - hasRights, // Sicherstellen, dass hasRights berücksichtigt wird - isRightsLoaded, // Überprüfung, ob die Rechte geladen sind - ]); */ - - useLoadUserRights(setUserRights, setIsRightsLoaded, setHasRights); - - useGmaMarkersLayer( - map, - gmaMarkers, - GisStationsMeasurements, - layers.MAP_LAYERS.GMA, - oms, - mapLayersVisibility.GMA // Übergebe die Sichtbarkeitsbedingung als Parameter - ); - - /* useSmsfunkmodemMarkersLayer( - map, - oms, - GisSystemStatic, - priorityConfig, - mapLayersVisibility.SMSFunkmodem // Sichtbarkeitsstatus aus dem State - ); */ - - const useMock = process.env.NEXT_PUBLIC_USE_MOCK_API === "true"; + //--------------------------------------------------------------- useEffect(() => { const fetchWebServiceMap = async () => { try { @@ -289,8 +271,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { // Fetch GIS Stations Static District /* await fetchGisStationsStaticDistrict(mapGisStationsStaticDistrictUrl, dispatch, fetchOptions); - requestCount++; // Zähler erhöhen - localStorage.setItem("fetchWebServiceMap", requestCount); */ + requestCount++; // Zähler erhöhen + localStorage.setItem("fetchWebServiceMap", requestCount); */ //console.log(`fetchWebServiceMap in MapComponent wurde ${requestCount} Mal aufgerufen.`); // Fetch GIS Stations Status District @@ -317,7 +299,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { fetchWebServiceMap(); }, [dispatch, mapGisStationsStaticDistrictUrl]); - //-------------------------------------------------------- useEffect(() => { const endpoint = "/api/talas_v5_DB/gisLines/readGisLines"; @@ -382,17 +363,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { fetchPoiData(); }, []); //-------------------------------------------- - - /* useEffect(() => { - if (map) { - const dbLayer = new L.LayerGroup().addTo(map); // Define dbLayer here - - return () => { - dbLayer.remove(); - }; - } - }, [map]); */ - //-------------------------------------------- // POIs auf die Karte zeichnen useEffect(() => { if (map && !poiLayerRef.current) { @@ -423,28 +393,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { if (gisSystemStaticLoaded && map) { } }, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]); - - //useCreateAndSetDevices(1, talasMarkers, GisSystemStatic, priorityConfig); - - useLayerVisibility(map, talasMarkers, mapLayersVisibility, "TALAS", oms); - useLayerVisibility(map, eciMarkers, mapLayersVisibility, "ECI", oms); - useLayerVisibility(map, lteModemMarkers, mapLayersVisibility, "LTEModem", oms); - useLayerVisibility(map, ciscoRouterMarkers, mapLayersVisibility, "CiscoRouter", oms); - useLayerVisibility(map, lteModemMarkers, mapLayersVisibility, "LTEModem", oms); - - useLayerVisibility(map, wagoMarkers, mapLayersVisibility, "WAGO", oms); - useLayerVisibility(map, siemensMarkers, mapLayersVisibility, "Siemens", oms); - useLayerVisibility(map, otdrMarkers, mapLayersVisibility, "OTDR", oms); - useLayerVisibility(map, wdmMarkers, mapLayersVisibility, "WDM", oms); - useLayerVisibility(map, gmaMarkers, mapLayersVisibility, "GMA", oms); - useLayerVisibility(map, sonstigeMarkers, mapLayersVisibility, "Sonstige", oms); - useLayerVisibility(map, tkComponentsMarkers, mapLayersVisibility, "TKKomponenten", oms); - useLayerVisibility(map, talasiclMarkers, mapLayersVisibility, "TALASICL", oms); - useLayerVisibility(map, dauzMarkers, mapLayersVisibility, "DAUZ", oms); - useLayerVisibility(map, smsfunkmodemMarkers, mapLayersVisibility, "SMSModem", oms); - useLayerVisibility(map, messstellenMarkers, mapLayersVisibility, "Messstellen", oms); - useLayerVisibility(map, ulafMarkers, mapLayersVisibility, "ULAF", oms); - + //-------------------------------------------- + //-------------------------------------------- useEffect(() => { if (map) { var x = 51.41321407879154; @@ -459,25 +409,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { } }, [map, zoomTrigger]); //-------------------------------------------- - const allMarkers = [ - ...talasMarkers, - ...eciMarkers, - ...lteModemMarkers, - ...ciscoRouterMarkers, - ...wagoMarkers, - ...siemensMarkers, - ...otdrMarkers, - ...wdmMarkers, - ...gmaMarkers, - ...messstellenMarkers, - ...talasiclMarkers, - ...dauzMarkers, - ...smsfunkmodemMarkers, - ...sonstigeMarkers, - ...tkComponentsMarkers, - ...ulafMarkers, - ]; - + //-------------------------------------------- useEffect(() => { if (map) { // Sammle alle Marker in einer einzigen Liste @@ -524,6 +456,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { mapLayersVisibility, // Neu: Abhängigkeit für Sichtbarkeitsstatus ]); + //-------------------------------------------- //-------------------------------------------- useEffect(() => { const fetchData = async () => { @@ -559,7 +492,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { fetchData(); }, []); //-------------------------------------------- - + //----------------------------------------------------------------- //Tooltip an mouse position anzeigen für die Linien useEffect(() => { if (!map) return; @@ -628,13 +561,13 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { }, [map, linePositions, lineColors, tooltipContents, newPoint, newCoords, tempMarker, polylineVisible]); //-------------------------------------------- - + //-------------------------------------------- useEffect(() => { if (map) { restoreMapSettings(map); } }, [map]); - + //-------------------------------------------- useEffect(() => { if (map) { console.log("map in MapComponent: ", map); @@ -659,17 +592,14 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { } }, [map]); //-------------------------------------------- + //-------------------------------------------- // Bereich in DataSheet ->dropdownmenu useEffect(() => { //console.log("🔍 GisStationsStaticDistrict Inhalt:", GisStationsStaticDistrict); // Sicherstellen, dass `Points` existiert und ein Array ist const points = GisStationsStaticDistrict?.Points; - /* if (!Array.isArray(points)) { - //console.warn("⚠️ GisStationsStaticDistrict.Points ist nicht vorhanden oder kein Array.", points); - return; - } - */ + if (selectedArea && map) { const station = points.find((s) => s.Area_Name === selectedArea); @@ -688,7 +618,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { map.flyTo([51.41321407879154, 7.739617925303934], 7); } }, [zoomTrigger, map]); - + //-------------------------------------------- useEffect(() => { if (map && poiLayerRef.current && isPoiTypLoaded && !menuItemAdded && isRightsLoaded) { addItemsToMapContextMenu(map, menuItemAdded, setMenuItemAdded, hasRights, setShowPopup, setPopupCoordinates); @@ -713,8 +643,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { fetchPriorityConfig(); }, []); //-------------------------------------------- - useInitializeMap(map, mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, setPolylineEventsDisabled); - //-------------------------------------------- useEffect(() => { @@ -781,31 +709,47 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { // Setze ein Intervall, um die Daten alle 5 Sekunden zu aktualisieren /* const intervalId = setInterval(() => { - updateGmaData(); - }, 5000); - - // Cleanup-Funktion, um das Intervall zu entfernen, wenn die Komponente entladen wird - return () => clearInterval(intervalId); */ + updateGmaData(); + }, 5000); + + // Cleanup-Funktion, um das Intervall zu entfernen, wenn die Komponente entladen wird + return () => clearInterval(intervalId); */ }, [map, gmaMarkers, layers.MAP_LAYERS.GMA, oms, mapGisStationsMeasurementsUrl]); //--------------------------------- + //--------------hokks------------------------------------------- + useLoadUserRights(setUserRights, setIsRightsLoaded, setHasRights); + useGmaMarkersLayer( + map, + gmaMarkers, + GisStationsMeasurements, + layers.MAP_LAYERS.GMA, + oms, + mapLayersVisibility.GMA // Übergebe die Sichtbarkeitsbedingung als Parameter + ); + //-------------------------------------------- + //useCreateAndSetDevices(1, talasMarkers, GisSystemStatic, priorityConfig); + useLayerVisibility(map, talasMarkers, mapLayersVisibility, "TALAS", oms); + useLayerVisibility(map, eciMarkers, mapLayersVisibility, "ECI", oms); + useLayerVisibility(map, lteModemMarkers, mapLayersVisibility, "LTEModem", oms); + useLayerVisibility(map, ciscoRouterMarkers, mapLayersVisibility, "CiscoRouter", oms); + useLayerVisibility(map, lteModemMarkers, mapLayersVisibility, "LTEModem", oms); + useLayerVisibility(map, wagoMarkers, mapLayersVisibility, "WAGO", oms); + useLayerVisibility(map, siemensMarkers, mapLayersVisibility, "Siemens", oms); + useLayerVisibility(map, otdrMarkers, mapLayersVisibility, "OTDR", oms); + useLayerVisibility(map, wdmMarkers, mapLayersVisibility, "WDM", oms); + useLayerVisibility(map, gmaMarkers, mapLayersVisibility, "GMA", oms); + useLayerVisibility(map, sonstigeMarkers, mapLayersVisibility, "Sonstige", oms); + useLayerVisibility(map, tkComponentsMarkers, mapLayersVisibility, "TKKomponenten", oms); + useLayerVisibility(map, talasiclMarkers, mapLayersVisibility, "TALASICL", oms); + useLayerVisibility(map, dauzMarkers, mapLayersVisibility, "DAUZ", oms); + useLayerVisibility(map, smsfunkmodemMarkers, mapLayersVisibility, "SMSModem", oms); + useLayerVisibility(map, messstellenMarkers, mapLayersVisibility, "Messstellen", oms); + useLayerVisibility(map, ulafMarkers, mapLayersVisibility, "ULAF", oms); + //-------------------------------------------- + + useInitializeMap(map, mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, setPolylineEventsDisabled); - const gmaLayerRef = useRef(null); - const talasLayerRef = useRef(null); - const eciMarkersLayerRef = useRef(null); - const lteModemMarkersLayerRef = useRef(null); - const ciscoRouterMarkersLayerRef = useRef(null); - const wagoMarkersLayerRef = useRef(null); - const siemensMarkersLayerRef = useRef(null); - const otdrMarkersLayerRef = useRef(null); - const wdmMarkersLayerRef = useRef(null); - const messstellenMarkersLayerRef = useRef(null); - const talasiclMarkersLayerRef = useRef(null); - const dauzMarkersLayerRef = useRef(null); - const smsfunkmodemMarkersLayerRef = useRef(null); - const ulafMarkersLayerRef = useRef(null); - const sonstigeMarkersLayerRef = useRef(null); - const tkComponentsMarkersRef = useRef(null); useEffect(() => { if (!gisSystemStaticLoaded || !map) return; // Sicherstellen, dass die Karte und Daten geladen sind diff --git a/components/mainComponent/hooks/useFetchWebServiceData.js b/components/mainComponent/hooks/useFetchWebServiceData.js deleted file mode 100644 index 70e293943..000000000 --- a/components/mainComponent/hooks/useFetchWebServiceData.js +++ /dev/null @@ -1,32 +0,0 @@ -// /components/mainComponent/hooks/useFetchWebServiceData.js -import { useEffect } from "react"; -import fetchGisStationsStatusDistrict from "../../../services/api/fetchGisStationsStatusDistrict"; -import fetchGisStationsMeasurements from "../../../services/api/fetchGisStationsMeasurements"; -import fetchGisSystemStatic from "../../../services/api/fetchGisSystemStatic"; - -const useFetchWebServiceData = ( - mapGisStationsStatusDistrictUrl, - setGisStationsStatusDistrict, - mapGisStationsMeasurementsUrl, - setGisStationsMeasurements, - mapGisSystemStaticUrl, - setGisSystemStatic, - setGisSystemStaticLoaded, - setIsDataLoaded // <-- Status aus MapComponent.js übergeben -) => { - useEffect(() => { - const fetchData = async () => { - try { - await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStationsStatusDistrict); - await fetchGisStationsMeasurements(mapGisStationsMeasurementsUrl, setGisStationsMeasurements); - await fetchGisSystemStatic(mapGisSystemStaticUrl, setGisSystemStatic, setGisSystemStaticLoaded); - setIsDataLoaded(true); // <-- Setzt den Status in MapComponent.js - } catch (error) { - console.error("Error fetching data:", error); - } - }; - fetchData(); - }, [mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl]); -}; - -export default useFetchWebServiceData; diff --git a/components/mainComponent/hooks/useSetupMarkers.js b/components/mainComponent/hooks/useSetupMarkers.js deleted file mode 100644 index b59fdd0b1..000000000 --- a/components/mainComponent/hooks/useSetupMarkers.js +++ /dev/null @@ -1,26 +0,0 @@ -// /components/mainComponent/hooks/useSetupMarkers.js -import { useEffect } from "react"; -import { checkOverlappingMarkers } from "../../../utils/mapUtils"; - -const useSetupMarkers = (map, allMarkers, mapLayersVisibility, plusRoundIcon) => { - useEffect(() => { - if (map) { - allMarkers.forEach((marker) => { - const layerKey = marker.options?.layerKey; - const isVisible = mapLayersVisibility[layerKey]; - - if (!layerKey || isVisible === undefined) return; - - if (localStorage.getItem("editMode") === "true" || !isVisible) { - if (map.hasLayer(marker)) map.removeLayer(marker); - } else { - if (!map.hasLayer(marker)) marker.addTo(map); - } - }); - - checkOverlappingMarkers(map, allMarkers, plusRoundIcon); - } - }, [map, allMarkers, mapLayersVisibility]); -}; - -export default useSetupMarkers; diff --git a/components/mainComponent/hooks/useSetupPolylines.js b/components/mainComponent/hooks/useSetupPolylines.js deleted file mode 100644 index d07103790..000000000 --- a/components/mainComponent/hooks/useSetupPolylines.js +++ /dev/null @@ -1,13 +0,0 @@ -// useSetupPolylines.js -import { useEffect } from "react"; -import { setupPolylines } from "../../utils/polylines/setupPolylines"; - -const useSetupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible) => { - useEffect(() => { - if (!map) return; - - const { markers: newMarkers, polylines: newPolylines } = setupPolylines(map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter, polylineVisible); - }, [map, linePositions, lineColors, tooltipContents, newCoords, tempMarker, polylineVisible]); -}; - -export default useSetupPolylines; diff --git a/config/appVersion.js b/config/appVersion.js index 434495a4a..874bfaaf7 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.48"; +export const APP_VERSION = "1.1.49";