Files

250 lines
5.3 KiB
Markdown

# 🚀 Quick-Start: Dashboard Installation
## ⚡ 3-Minuten-Setup
### Schritt 1: Datei auswählen (10 Sekunden)
Wähle **eine** der drei Varianten:
- 📊 **Standard**`battery_optimizer_dashboard.yaml` (Desktop)
- 📱 **Kompakt**`battery_optimizer_dashboard_compact.yaml` (Tablet)
-**Minimal**`battery_optimizer_dashboard_minimal.yaml` (Smartphone)
**Meine Empfehlung für dich:** **KOMPAKT** - beste Balance!
---
### Schritt 2: Dashboard hinzufügen (2 Minuten)
#### Option A: Über die UI (Einfachste Methode)
1. Home Assistant öffnen
2. Klick auf **"Einstellungen"** → **"Dashboards"**
3. Klick auf **"+ Dashboard hinzufügen"**
4. Wähle **"Neue Ansicht vom Scratch erstellen"**
5. Name: `Batterie Optimierung`
6. Icon: `mdi:battery-charging`
7. Klick auf **"Erstellen"**
8. Klick auf **⋮** (3 Punkte oben rechts) → **"Rohe Konfiguration bearbeiten"**
9. Lösche alles und füge den Inhalt der YAML-Datei ein
10. Klick auf **"Speichern"**
#### Option B: Via Datei (Für Fortgeschrittene)
```bash
# Auf deinem Home Assistant Server:
cd /config
mkdir -p dashboards
cp battery_optimizer_dashboard_compact.yaml dashboards/
# In configuration.yaml oder dashboards.yaml ergänzen:
lovelace:
mode: yaml
dashboards:
battery-optimizer:
mode: yaml
filename: dashboards/battery_optimizer_dashboard_compact.yaml
title: Batterie
icon: mdi:battery-charging
show_in_sidebar: true
```
Dann Home Assistant neu starten.
---
### Schritt 3: Entity-IDs anpassen (30 Sekunden)
**Suchen & Ersetzen** in der YAML-Datei:
Öffne die Dashboard-Konfiguration und ersetze diese Platzhalter mit deinen echten Entity-IDs:
```yaml
# WICHTIG: Prüfe deine echten Entity-IDs unter:
# Entwicklerwerkzeuge → Zustände
# Ersetze:
sensor.battery_charging_plan_status
# Mit (wenn anders):
sensor.deine_plan_status_entity
# Ersetze:
sensor.battery_next_charge_time
# Mit:
sensor.deine_next_charge_entity
# Etc. für alle anderen Entities
```
**Tipp:** Nutze Suchen & Ersetzen (Strg+H) in deinem Editor!
---
### Schritt 4: Fertig! (0 Sekunden)
✅ Dashboard ist einsatzbereit!
Navigiere zu: **Sidebar****"Batterie Optimierung"**
---
## 🔧 Häufige Anpassungen
### Fehlende Entity entfernen
Falls eine Entity nicht existiert, einfach auskommentieren oder löschen:
```yaml
# entities:
# - entity: sensor.nicht_vorhanden # ← Auskommentiert mit #
# name: Nicht verfügbar
```
### Farben ändern
```yaml
# Plotly Graph Farben anpassen:
line:
color: '#FF5722' # Deine Wunschfarbe (Hex-Code)
```
Online Color Picker: https://htmlcolorcodes.com/
### Graph-Zeitraum anpassen
```yaml
hours_to_show: 24 # Von 48h auf 24h ändern
```
### Spalten-Layout ändern
```yaml
# Von 2 auf 3 Spalten:
- type: horizontal-stack
cards:
- card1
- card2
- card3 # ← Hinzufügen
```
---
## ✅ Checklist
- [ ] Dashboard-Variante ausgewählt
- [ ] YAML-Datei in Home Assistant eingefügt
- [ ] Entity-IDs überprüft und angepasst
- [ ] Dashboard gespeichert
- [ ] Browser-Cache geleert (Strg+Shift+R)
- [ ] Dashboard getestet auf verschiedenen Geräten
---
## 🆘 Hilfe bei Problemen
### Problem: "Entity not found"
**Lösung:**
```yaml
# Prüfe in Developer Tools → States:
# Existiert die Entity wirklich?
# Falls nein: Auskommentieren oder durch existierende Entity ersetzen
```
### Problem: Plotly Graph zeigt nichts
**Lösung:**
```yaml
# 1. Prüfe ob Entity historische Daten hat:
# Developer Tools → History → Entity auswählen
# 2. Prüfe Recorder-Integration:
# configuration.yaml sollte haben:
recorder:
db_url: sqlite:////config/home-assistant_v2.db
purge_keep_days: 7
include:
entities:
- sensor.openems_ess0_activepower
# ... alle anderen wichtigen Entities
```
### Problem: Power Flow Card zeigt Fehler
**Lösung:**
```yaml
# Installiere über HACS:
# HACS → Frontend → Suche "Power Flow Card Plus" → Installieren
# Dann Browser-Cache leeren (Strg+Shift+R)
```
### Problem: Bubble Cards nicht gefunden
**Lösung:**
```yaml
# Installiere über HACS:
# HACS → Frontend → Suche "Bubble Card" → Installieren
# Home Assistant neu starten
# Browser-Cache leeren
```
---
## 🎨 Nächste Schritte
Nach erfolgreicher Installation kannst du:
1. **Card-mod nutzen** für individuelles Styling
2. **Conditional Cards** für kontextabhängige Anzeigen
3. **Template-Sensoren** für zusätzliche Berechnungen
4. **Plan-Historie** implementieren (siehe vorheriger Chat)
5. **InfluxDB-Integration** für Langzeitanalyse
---
## 💡 Pro-Tipps
### Mobile Optimierung
```yaml
# Füge card_mod für bessere Mobile-Ansicht hinzu:
card_mod:
style: |
ha-card {
font-size: 0.9em; /* Kleinere Schrift auf Mobile */
}
@media (max-width: 768px) {
ha-card {
padding: 8px !important; /* Weniger Padding */
}
}
```
### Dark Mode Support
Alle Dashboards sind Dark-Mode-kompatibel!
Die Farben passen sich automatisch an.
### Performance-Tipp
```yaml
# Reduziere Refresh-Rate für bessere Performance:
refresh_interval: 300 # Alle 5 Minuten statt jede Minute
```
---
## 📞 Support
Bei weiteren Fragen:
1. **Entity-IDs prüfen**: Developer Tools → States
2. **Logs checken**: Settings → System → Logs
3. **Browser-Konsole**: F12 → Console (für Frontend-Fehler)
---
**Viel Erfolg! 🎉**
Bei Problemen: Schicke mir einen Screenshot des Fehlers + deine YAML-Config.