# Zustandsverwaltung

Chamilo verwendet zwei Zustandsverwaltungsbibliotheken nebeneinander:

* **Pinia** — der aktuelle Standard für alle neuen Stores. Der Großteil des Codes verwendet Pinia.
* **Vuex** — veralteter Store, der noch vorhanden ist und von älteren Ansichten genutzt wird. Neuer Code sollte Pinia verwenden.

## Pinia Stores

Die Pinia Stores befinden sich direkt in `assets/vue/store/`:

| Store-Datei              | Composable               | Zweck                                                     |
| ------------------------ | ------------------------ | --------------------------------------------------------- |
| `securityStore.js`       | `useSecurityStore`       | Authentifizierter Benutzer, Login/Logout, Sitzungsprüfung |
| `cidReq.js`              | `useCidReqStore`         | Aktueller Kurs-/Sitzungskontext (Kurs-ID, Sitzungs-ID)    |
| `courseSettingStore.js`  | `useCourseSettings`      | Cache für Kurseinstellungen                               |
| `enrolledStore.js`       | `useEnrolledStore`       | Daten zur Benutzeranmeldung                               |
| `platformConfig.js`      | `usePlatformConfig`      | Plattformkonfiguration, Plugins, Theme, OAuth2-Anbieter   |
| `messageRelUserStore.js` | `useMessageRelUserStore` | Zustand für Nachrichten                                   |
| `socialStore.js`         | `useSocialStore`         | Zustand für soziale Netzwerke                             |

### Security Store

```javascript
const securityStore = useSecurityStore()

// Prüfen, ob der Benutzer eingeloggt ist
if (securityStore.isAuthenticated) { ... }

// Zugriff auf das aktuelle Benutzerobjekt
const user = securityStore.user
```

### CID Request Store

Verfolgt den aktuellen Kurs-/Sitzungskontext — erforderlich für jede kursbezogene API-Operation:

```javascript
const cidReqStore = useCidReqStore()

// Aktuelle Kurs- und Sitzungsobjekte
const course = cidReqStore.course
const session = cidReqStore.session
```

### Course Settings Store

Speichert Kurseinstellungen im Cache, um wiederholte API-Aufrufe zu vermeiden:

```javascript
const courseSettings = useCourseSettings()
const value = courseSettings.getSetting('exercise_generator')
```

### Platform Config Store

Enthält plattformweite Konfigurationen, die von `/platform-config/list` abgerufen werden:

```javascript
const platformConfig = usePlatformConfig()

// Geladene Einstellungsarrays, aktives Theme, aktivierte Plugins, OAuth2-Anbieter
const theme = platformConfig.visualTheme
const plugins = platformConfig.plugins
```

## Vuex Store (Veraltet)

Der Vuex Store ist in `assets/vue/store/index.js` definiert und enthält:

| Modul                      | Zweck                                                                                                                                                                             |
| -------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `modules/crud.js`          | Factory (`makeCrudModule`), die ein vollständiges CRUD-Vuex-Modul für einen gegebenen Dienst generiert — wird von älteren Listen-/Erstellungs-/Aktualisierungsansichten verwendet |
| `modules/notifications.js` | Zustand für Toast-Benachrichtigungen (Anzeige, Farbe, Text, Timeout)                                                                                                              |
| `modules/ux.js`            | UX-Zustand (Nachricht bei verbotenem Zugriff)                                                                                                                                     |
| `security.js`              | Veraltetes Vuex-Sicherheitsmodul (ersetzt durch `securityStore.js`)                                                                                                               |

Vermeiden Sie das Hinzufügen neuer Vuex-Module. Verwenden Sie Pinia für jeden neuen Zustand.

## Composables

Zusätzlich zu den Stores enthält `assets/vue/composables/` gemeinsame Kompositionsfunktionen. Bemerkenswerte Beispiele:

| Datei                                                                       | Zweck                                                     |
| --------------------------------------------------------------------------- | --------------------------------------------------------- |
| `useFileManager.js`                                                         | Zustand und Operationen des Dateibrowsers                 |
| `useTopbarLoggedIn.js` / `useTopbarNotLoggedIn.js`                          | Verkabelung des oberen Menüs                              |
| `useTopbarTour.js`                                                          | Geführte Tour für die obere Leiste                        |
| `useDocumentCreate.js` / `useDocumentUpdate.js` / `useDocumentTemplates.js` | Hilfsfunktionen für das Dokumenten-Tool                   |
| `useCertificateTags.js`                                                     | Hilfsfunktionen für Zertifikatvorlagen-Tags               |
| `sidebarMenu.js`                                                            | Navigationsbaum der Seitenleiste                          |
| `theme.js`                                                                  | Laden und Wechseln von Themes                             |
| `pluginRegion.js`                                                           | Rendern von UI-Regionen, die von Plugins eingefügt wurden |
| `userPermissions.js`                                                        | Berechtigungsprüfungen für den aktuellen Benutzer         |
| `notification.js`                                                           | Hilfsfunktionen für Push-Benachrichtigungen               |
| `locale.js`                                                                 | Erkennung und Wechsel der Sprache                         |
| `datatableList.js` / `datatableCreate.js` / `datatableUpdate.js`            | Wiederverwendbare CRUD-Muster für Datentabellen           |
| `useSocialInfo.js` / `useSocialMenuItems.js`                                | Hilfsfunktionen für soziale Netzwerke                     |
| `usePushSubscription.js`                                                    | Verwaltung von Web-Push-Abonnements                       |
| `upload.js`                                                                 | Hilfsfunktionen für Datei-Uploads                         |
| `useConfirmation.js`                                                        | Hilfsfunktion für Bestätigungsdialoge                     |

Composables sind auch in Funktionsunterverzeichnisse organisiert (`course/`, `session/`, `document/`, `calendar/`, `admin/`, `auth/`, `message/`, `skill/` usw.). Die vollständige Liste befindet sich in `assets/vue/composables/`.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.chamilo.org/2.x-de/entwicklerhandbuch/developer-guide/frontend/state-management.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
