docs
This commit is contained in:
25
docs/redux/slices/database/locationDevicesFromDBSlice.md
Normal file
25
docs/redux/slices/database/locationDevicesFromDBSlice.md
Normal file
@@ -0,0 +1,25 @@
|
||||
<!-- /docs/redux/slices/database/locationDevicesFromDBSlice.md -->
|
||||
|
||||
# 🧩 locationDevicesFromDBSlice.js
|
||||
|
||||
Redux-Slice für das Laden von Geräten aus der Datenbank-Tabelle `location_device`.
|
||||
|
||||
## Zustand
|
||||
|
||||
```js
|
||||
{
|
||||
devices: [],
|
||||
status: "idle" | "loading" | "succeeded" | "failed",
|
||||
error: string | null
|
||||
}
|
||||
```
|
||||
|
||||
## Thunk
|
||||
|
||||
- `fetchLocationDevicesThunk` (async)
|
||||
|
||||
## Selector
|
||||
|
||||
```js
|
||||
selectLocationDevices = (state) => state.locationDevicesFromDB.devices
|
||||
```
|
||||
23
docs/redux/slices/database/locationDevicesSlice.md
Normal file
23
docs/redux/slices/database/locationDevicesSlice.md
Normal file
@@ -0,0 +1,23 @@
|
||||
<!-- /docs/redux/slices/database/locationDevicesSlice.md -->
|
||||
|
||||
# 🧩 locationDevicesSlice.js
|
||||
|
||||
Zweite Variante des Slices für Geräte (veraltet oder parallel verwendet).
|
||||
|
||||
## Zustand
|
||||
|
||||
```js
|
||||
{
|
||||
data: [],
|
||||
status: "idle" | "loading" | "succeeded" | "failed",
|
||||
error: string | null
|
||||
}
|
||||
```
|
||||
|
||||
## Selector
|
||||
|
||||
```js
|
||||
selectLocationDevices = (state) => state.locationDevices.data
|
||||
```
|
||||
|
||||
⚠️ Beachte: Duplikat zu `locationDevicesFromDBSlice.js`
|
||||
24
docs/redux/slices/database/priorityConfigSlice.md
Normal file
24
docs/redux/slices/database/priorityConfigSlice.md
Normal file
@@ -0,0 +1,24 @@
|
||||
<!-- /docs/redux/slices/database/priorityConfigSlice.md -->
|
||||
|
||||
# 🧩 priorityConfigSlice.js
|
||||
|
||||
Lädt die Prioritätskonfiguration für Marker (z. B. zur farblichen Darstellung).
|
||||
|
||||
## Zustand
|
||||
|
||||
```js
|
||||
{
|
||||
data: [],
|
||||
status: "idle" | "succeeded"
|
||||
}
|
||||
```
|
||||
|
||||
## Thunk
|
||||
|
||||
- `fetchPriorityConfigThunk`
|
||||
|
||||
## Selector
|
||||
|
||||
```js
|
||||
selectPriorityConfig = (state) => state.priorityConfig.data
|
||||
```
|
||||
@@ -1,103 +0,0 @@
|
||||
# 📦 locationDevicesFromDBSlice
|
||||
|
||||
Zuständig für das Laden und Speichern der Geräteinformationen pro Standort (Location) aus der Datenbank.
|
||||
|
||||
## 🧠 Zweck
|
||||
|
||||
Dieses Slice verwaltet die Geräte, die mit einem bestimmten Standort (Location) verknüpft sind.
|
||||
Es nutzt ein `createAsyncThunk`, um die Daten vom Webservice bzw. von der lokalen Datenbank zu laden.
|
||||
|
||||
---
|
||||
|
||||
## 🔁 Datenfluss
|
||||
|
||||
1. **Dispatch `fetchLocationDevicesFromDB()`**
|
||||
2. **Daten werden über `fetchLocationDevices()` geladen**
|
||||
3. **Status wird aktualisiert (`loading`, `succeeded`, `failed`)**
|
||||
4. **Geräte-Liste (`devices`) wird gespeichert**
|
||||
|
||||
---
|
||||
|
||||
## 🧩 Slice-Definition
|
||||
|
||||
```js
|
||||
initialState: {
|
||||
devices: [], // Geräte-Liste pro Standort
|
||||
status: "idle", // "idle" | "loading" | "succeeded" | "failed"
|
||||
error: null // Fehlernachricht im Fehlerfall
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Actions
|
||||
|
||||
| Action Type | Beschreibung |
|
||||
|--------------------------------------------|--------------------------------------------------|
|
||||
| `fetchLocationDevicesFromDB/pending` | Startet den Ladeprozess |
|
||||
| `fetchLocationDevicesFromDB/fulfilled` | Speichert die empfangenen Geräte in `devices` |
|
||||
| `fetchLocationDevicesFromDB/rejected` | Speichert die Fehlermeldung in `error` |
|
||||
|
||||
---
|
||||
|
||||
## 📥 Async Thunk
|
||||
|
||||
```ts
|
||||
export const fetchLocationDevicesFromDB = createAsyncThunk(
|
||||
"locationDevicesFromDB/fetchLocationDevicesFromDB",
|
||||
async () => {
|
||||
return fetchLocationDevices(); // API-Aufruf aus services/api
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
Die Funktion `fetchLocationDevices()` befindet sich unter:
|
||||
|
||||
```
|
||||
/redux/api/fromDB/fetchLocationDevices.js
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🧪 Verwendung in Komponenten
|
||||
|
||||
### Beispiel mit `useSelector` & `useDispatch`
|
||||
|
||||
```tsx
|
||||
import { useSelector, useDispatch } from "react-redux";
|
||||
import { fetchLocationDevicesFromDB } from "@/redux/slices/db/locationDevicesFromDBSlice";
|
||||
|
||||
const dispatch = useDispatch();
|
||||
const devices = useSelector((state) => state.locationDevicesFromDB.devices);
|
||||
const status = useSelector((state) => state.locationDevicesFromDB.status);
|
||||
|
||||
useEffect(() => {
|
||||
dispatch(fetchLocationDevicesFromDB());
|
||||
}, []);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🧩 Integration im Store
|
||||
|
||||
```ts
|
||||
import locationDevicesFromDBReducer from "./slices/db/locationDevicesFromDBSlice";
|
||||
|
||||
export const store = configureStore({
|
||||
reducer: {
|
||||
locationDevicesFromDB: locationDevicesFromDBReducer,
|
||||
// weitere Slices ...
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📌 Hinweis
|
||||
|
||||
Dieses Slice ist Bestandteil der neuen Redux-Architektur (ehemals Recoil)
|
||||
→ siehe auch `CHANGELOG.md` Version `1.1.97` bis `1.1.98`.
|
||||
|
||||
```
|
||||
Pfad: /redux/slices/db/locationDevicesFromDBSlice.js
|
||||
```
|
||||
@@ -1,93 +0,0 @@
|
||||
# 🧭 poiTypesSlice
|
||||
|
||||
Verwaltet die Point-of-Interest (POI) Typen, die vom Server bereitgestellt werden – z. B. für die Darstellung von Symbolen oder Layer-Kategorien in der Karte.
|
||||
|
||||
---
|
||||
|
||||
## 📍 Datei
|
||||
|
||||
```
|
||||
/redux/slices/db/poiTypesSlice.js
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📦 Initialer State
|
||||
|
||||
```ts
|
||||
{
|
||||
data: [], // Liste der POI-Typen
|
||||
status: "idle" // Ladezustand: "idle" | "loading" | "succeeded" | "failed"
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## ⚙️ Async Thunk: `fetchPoiTypes`
|
||||
|
||||
```ts
|
||||
export const fetchPoiTypes = createAsyncThunk("poiTypes/fetchPoiTypes", async () => {
|
||||
let API_BASE_URL = "";
|
||||
|
||||
if (typeof window !== "undefined") {
|
||||
API_BASE_URL = `${window.location.protocol}//${window.location.hostname}:3000`;
|
||||
} else {
|
||||
API_BASE_URL = "http://localhost:3000";
|
||||
}
|
||||
|
||||
const response = await fetch(`${API_BASE_URL}/api/talas_v5_DB/poiTyp/readPoiTyp`);
|
||||
return await response.json();
|
||||
});
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🔁 Lifecycle im Slice
|
||||
|
||||
| Zustand | Beschreibung |
|
||||
|--------------------|--------------------------------------|
|
||||
| `pending` | Setzt `status = "loading"` |
|
||||
| `fulfilled` | Speichert `payload` in `state.data` und setzt `status = "succeeded"` |
|
||||
| `rejected` | Setzt `status = "failed"` |
|
||||
|
||||
---
|
||||
|
||||
## 🧪 Verwendung im Component
|
||||
|
||||
```tsx
|
||||
import { useSelector, useDispatch } from "react-redux";
|
||||
import { fetchPoiTypes } from "@/redux/slices/db/poiTypesSlice";
|
||||
|
||||
const dispatch = useDispatch();
|
||||
const poiTypes = useSelector((state) => state.poiTypes.data);
|
||||
const status = useSelector((state) => state.poiTypes.status);
|
||||
|
||||
useEffect(() => {
|
||||
dispatch(fetchPoiTypes());
|
||||
}, []);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🧩 Store Integration
|
||||
|
||||
```ts
|
||||
import poiTypesReducer from "./slices/db/poiTypesSlice";
|
||||
|
||||
export const store = configureStore({
|
||||
reducer: {
|
||||
poiTypes: poiTypesReducer,
|
||||
// weitere ...
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🌐 API-Endpunkt
|
||||
|
||||
```http
|
||||
GET /api/talas_v5_DB/poiTyp/readPoiTyp
|
||||
```
|
||||
|
||||
Erwartet JSON-Antwort mit allen verfügbaren POI-Typen für die App.
|
||||
Reference in New Issue
Block a user