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/DataSheet.js b/components/DataSheet.js index b00a21eb0..920af5bd4 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -17,11 +17,13 @@ import { useInitGisStationsStatic } from "../components/mainComponent/hooks/webS import { fetchGisStationsStatic, selectGisStationsStatic } from "../redux/slices/webService/gisStationsStaticSlice"; import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; +import { selectMapLayersState, setLayerVisibility } from "../redux/slices/mapLayersSlice"; + function DataSheet() { const [editMode, setEditMode] = useState(false); // Zustand für editMode const [poiVisible, setPoiVisible] = useRecoilState(poiLayerVisibleState); const setSelectedArea = useSetRecoilState(selectedAreaState); - const [mapLayersVisibility, setMapLayersVisibility] = useRecoilState(mapLayersState); + const mapLayersVisibility = useSelector(selectMapLayersState); const [stationListing, setStationListing] = useState([]); const [systemListing, setSystemListing] = useState([]); const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict) || []; @@ -38,13 +40,8 @@ function DataSheet() { localStorage.setItem("polylineVisible", checked); if (checked) { - // Wenn Kabelstrecken aktiviert wird, TALAS automatisch auch aktivieren - const newMapLayersVisibility = { - ...mapLayersVisibility, - TALAS: true, - }; - setMapLayersVisibility(newMapLayersVisibility); - localStorage.setItem("mapLayersVisibility", JSON.stringify(newMapLayersVisibility)); + dispatch(setLayerVisibility({ layer: "TALAS", visibility: true })); + localStorage.setItem("mapLayersVisibility", JSON.stringify({ ...mapLayersVisibility, TALAS: true })); } }; @@ -61,15 +58,19 @@ function DataSheet() { dispatch(setPolylineVisible(storedPolylineVisible === "true")); } + // Layer-Sichtbarkeiten aus localStorage laden const storedMapLayersVisibility = localStorage.getItem("mapLayersVisibility"); if (storedMapLayersVisibility) { - setMapLayersVisibility(JSON.parse(storedMapLayersVisibility)); + const parsedVisibility = JSON.parse(storedMapLayersVisibility); + Object.keys(parsedVisibility).forEach((key) => { + dispatch(setLayerVisibility({ layer: key, visibility: parsedVisibility[key] })); + }); } // EditMode lesen const storedEditMode = localStorage.getItem("editMode"); setEditMode(storedEditMode === "true"); - }, [setPoiVisible, setMapLayersVisibility]); + }, [setPoiVisible, dispatch]); // ✅ `setMapLayersVisibility` entfernt const handleAreaChange = (event) => { const selectedIndex = event.target.options.selectedIndex; @@ -122,11 +123,8 @@ function DataSheet() { if (editMode) return; const { checked } = event.target; - setMapLayersVisibility((prev) => { - const newState = { ...prev, [key]: checked }; - localStorage.setItem("mapLayersVisibility", JSON.stringify(newState)); - return newState; - }); + dispatch(setLayerVisibility({ layer: key, visibility: checked })); + localStorage.setItem("mapLayersVisibility", JSON.stringify({ ...mapLayersVisibility, [key]: checked })); setTimeout(() => { const event = new Event("visibilityChanged"); diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 36a2155b0..529a7d6ac 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -44,7 +44,7 @@ import { poiLayerVisibleState } from "../../redux/slices/poiLayerVisibleSlice.js import { selectedPoiState } from "../../redux/slices/selectedPoiSlice.js"; import { poiReadFromDbTriggerAtom } from "../../redux/slices/poiReadFromDbTriggerSlice.js"; import { gisSystemStaticState } from "../../redux/slices/webService/gisSystemStaticSlice.js"; -import { mapLayersState } from "../../redux/slices/mapLayersSlice.js"; +import { selectMapLayersState } from "../../redux/slices/mapLayersSlice"; import { selectedAreaState } from "../../redux/slices/selectedAreaSlice.js"; import { zoomTriggerState } from "../../redux/slices/zoomTriggerSlice.js"; import { polylineEventsDisabledState } from "../../redux/slices/polylineEventsDisabledSlice.js"; @@ -181,7 +181,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { //-------------------------------------------- const [lineStatusData, setLineStatusData] = useState([]); const [linesData, setLinesData] = useState([]); - const mapLayersVisibility = useRecoilValue(mapLayersState); + const mapLayersVisibility = useSelector(selectMapLayersState) || {}; const selectedArea = useRecoilValue(selectedAreaState); const [linePositions, setLinePositions] = useState([]); diff --git a/components/pois/PoiUpdateModal.js b/components/pois/PoiUpdateModal.js index f0ae47c89..f7c738c2b 100644 --- a/components/pois/PoiUpdateModal.js +++ b/components/pois/PoiUpdateModal.js @@ -5,16 +5,19 @@ import { useRecoilState } from "recoil"; import { selectedPoiState } from "../../redux/slices/selectedPoiSlice"; import { currentPoiState } from "../../redux/slices/currentPoiSlice"; import { mapLayersState } from "../../redux/slices/mapLayersSlice"; -import { selectCurrentPoi } from "../../redux/slices/currentPoiSlice"; + import { fetchLocationDevicesFromDB } from "../../redux/slices/db/locationDevicesFromDBSlice"; import { useSelector, useDispatch } from "react-redux"; +import { selectCurrentPoi } from "../../redux/slices/currentPoiSlice"; +import { selectMapLayersState } from "../../redux/slices/mapLayersSlice"; + const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => { const dispatch = useDispatch(); const currentPoi = useSelector(selectCurrentPoi); - const selectedPoi = useRecoilState(selectedPoiState); - const [mapLayersVisibility] = useRecoilState(mapLayersState); + const selectedPoi = useSelector(selectCurrentPoi); + const mapLayersVisibility = useSelector(selectMapLayersState); const [poiId, setPoiId] = useState(poiData ? poiData.idPoi : ""); const [name, setName] = useState(poiData ? poiData.name : ""); diff --git a/config/appVersion.js b/config/appVersion.js index 7b9f40448..cc7a97494 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.54"; +export const APP_VERSION = "1.1.55"; diff --git a/redux/slices/mapLayersSlice.js b/redux/slices/mapLayersSlice.js index 973dd199a..7ec0ee642 100644 --- a/redux/slices/mapLayersSlice.js +++ b/redux/slices/mapLayersSlice.js @@ -1,24 +1,43 @@ // redux/slices/mapLayersSlice.js -import { atom } from "recoil"; +import { createSlice } from "@reduxjs/toolkit"; -export const mapLayersState = atom({ - key: "mapLayersState", // Eindeutiger Schlüssel für das Atom - default: { - // Standardwerte für jeden Layer - TALAS: true, - ECI: true, - ULAF: true, - GSMModem: true, - CiscoRouter: true, - WAGO: true, - Siemens: true, - OTDR: true, - WDM: true, - GMA: true, - Messstellen: true, - TALASICL: true, - DAUZ: true, - SMSFunkmodem: true, - Sonstige: true, +const initialState = { + TALAS: true, + ECI: true, + ULAF: true, + GSMModem: true, + CiscoRouter: true, + WAGO: true, + Siemens: true, + OTDR: true, + WDM: true, + GMA: true, + Messstellen: true, + TALASICL: true, + DAUZ: true, + SMSFunkmodem: true, + Sonstige: true, +}; + +const mapLayersSlice = createSlice({ + name: "mapLayers", + initialState, + reducers: { + toggleLayer: (state, action) => { + const layer = action.payload; + if (state[layer] !== undefined) { + state[layer] = !state[layer]; // Toggle Sichtbarkeit + } + }, + setLayerVisibility: (state, action) => { + const { layer, visibility } = action.payload; + if (state[layer] !== undefined) { + state[layer] = visibility; + } + }, }, }); + +export const { toggleLayer, setLayerVisibility } = mapLayersSlice.actions; +export const selectMapLayersState = (state) => state.mapLayers || initialState; +export default mapLayersSlice.reducer; diff --git a/redux/store.js b/redux/store.js index a58f51a96..ae76726e1 100644 --- a/redux/store.js +++ b/redux/store.js @@ -14,6 +14,7 @@ import addPoiOnPolylineReducer from "./slices/addPoiOnPolylineSlice"; import polylineContextMenuReducer from "./slices/polylineContextMenuSlice"; import selectedPoiReducer from "./slices/selectedPoiSlice"; import selectedDeviceReducer from "./slices/selectedDeviceSlice"; +import mapLayersReducer from "./slices/mapLayersSlice"; export const store = configureStore({ reducer: { @@ -31,5 +32,6 @@ export const store = configureStore({ polylineContextMenu: polylineContextMenuReducer, selectedPoi: selectedPoiReducer, selectedDevice: selectedDeviceReducer, + mapLayers: mapLayersReducer, }, }); diff --git a/utils/createAndSetDevices.js b/utils/createAndSetDevices.js index 878bf2fca..4640c1305 100644 --- a/utils/createAndSetDevices.js +++ b/utils/createAndSetDevices.js @@ -129,31 +129,22 @@ export const createAndSetDevices = async (systemId, setMarkersFunction, GisSyste } // Menüeinträge hinzufügen - const editItem = map.contextmenu.addItem({ - text: "Gerät bearbeiten", - icon: "img/edit.png", - callback: () => console.log(`Bearbeite Gerät: ${marker.options.deviceName}`), - }); - - const deleteItem = map.contextmenu.addItem({ - text: "Gerät entfernen", - icon: "img/delete.png", - callback: () => console.log(`Entferne Gerät: ${marker.options.deviceName}`), - }); const separator = map.contextmenu.addItem({ separator: true }); const detailsItem = map.contextmenu.addItem({ - text: "Details anzeigen", - icon: "img/details.png", - callback: () => console.log(`Details für Gerät: ${marker.options.deviceName}`), + text: "Station öffnen (Tab)", + icon: "/img/screen_new.png", + callback: (e) => { + const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${station.IdLD}`; + window.open(link, "_blank"); + }, }); // IDs speichern - contextMenuItemIds.add(editItem); - contextMenuItemIds.add(deleteItem); - contextMenuItemIds.add(separator); contextMenuItemIds.add(detailsItem); + + contextMenuItemIds.add(separator); } };