diff --git a/apps/ui/templates/garage.html b/apps/ui/templates/garage.html
index f914275..3eeb4a0 100644
--- a/apps/ui/templates/garage.html
+++ b/apps/ui/templates/garage.html
@@ -312,7 +312,8 @@
// Device IDs for garage devices
const GARAGE_DEVICES = [
'power_relay_caroutlet',
- 'powermeter_caroutlet'
+ 'powermeter_caroutlet',
+ 'sensor_caroutlet'
];
// Device states
@@ -410,7 +411,16 @@
renderOutletControls(controlSection, device);
container.appendChild(controlSection);
- // 3. Powermeter section
+ // 3. Feedback section
+ const feedbackDevice = Object.values(devicesData).find(d => d.device_id === 'sensor_caroutlet');
+ if (feedbackDevice) {
+ const feedbackSection = document.createElement('div');
+ feedbackSection.className = 'device-section';
+ renderFeedbackDisplay(feedbackSection, feedbackDevice);
+ container.appendChild(feedbackSection);
+ }
+
+ // 4. Powermeter section
const powermeterDevice = Object.values(devicesData).find(d => d.device_id === 'powermeter_caroutlet');
if (powermeterDevice) {
const powermeterSection = document.createElement('div');
@@ -424,7 +434,6 @@
function renderOutletControls(container, device) {
const controlGroup = document.createElement('div');
controlGroup.style.textAlign = 'center';
- // controlGroup.style.marginBottom = '8px';
const state = deviceStates[device.device_id];
const currentPower = state?.power === 'on';
@@ -440,36 +449,43 @@
label.className = 'toggle-label';
label.textContent = currentPower ? 'Ein' : 'Aus';
- // Status display
- // const stateDisplay = document.createElement('div');
- // stateDisplay.style.marginTop = '16px';
- // stateDisplay.style.fontSize = '18px';
- // stateDisplay.style.fontWeight = '600';
- // stateDisplay.style.color = currentPower ? '#34c759' : '#666';
- // stateDisplay.textContent = `Status: ${currentPower ? 'Eingeschaltet' : 'Ausgeschaltet'}`;
-
controlGroup.appendChild(toggleSwitch);
controlGroup.appendChild(label);
- // controlGroup.appendChild(stateDisplay);
container.appendChild(controlGroup);
}
+ function renderFeedbackDisplay(container, device) {
+ const state = deviceStates[device.device_id] || {};
+ const controlGroup = document.createElement('div');
+ controlGroup.style.textAlign = 'center';
+
+ const label = document.createElement('div');
+ label.className = 'toggle-label';
+
+ const values = Object.values(state || {});
+ const isActive = values.some(v =>
+ v === true ||
+ v === 'on' ||
+ v === 1
+ );
+
+ if (values.length === 0) {
+ label.textContent = 'Kein Status verfügbar';
+ } else {
+ label.textContent = isActive
+ ? 'Fahrzeug verbunden'
+ : 'Kein Fahrzeug verbunden';
+ }
+
+ controlGroup.appendChild(label);
+ container.appendChild(controlGroup);
+ }
function renderThreePhasePowerDisplay(container, device) {
const state = deviceStates[device.device_id] || {};
- // Leistungsmessung Title
- // const title = document.createElement('h3');
- // title.style.margin = '0 0 20px 0';
- // title.style.fontSize = '18px';
- // title.style.fontWeight = '600';
- // title.style.color = '#333';
- // title.textContent = 'Leistungsmessung';
- // container.appendChild(title);
-
- // Übersicht
const overviewGrid = document.createElement('div');
overviewGrid.className = 'state-grid';
overviewGrid.innerHTML = `
@@ -484,16 +500,13 @@
`;
container.appendChild(overviewGrid);
- // Phasen Title
const phaseTitle = document.createElement('h4');
phaseTitle.style.margin = '20px 0 8px 0';
phaseTitle.style.fontSize = '16px';
phaseTitle.style.fontWeight = '600';
phaseTitle.style.color = '#333';
- // phaseTitle.textContent = 'Phasen';
container.appendChild(phaseTitle);
- // Phasen Details
const phaseGrid = document.createElement('div');
phaseGrid.className = 'phase-grid';
phaseGrid.innerHTML = `
diff --git a/config/layout.yaml b/config/layout.yaml
index 02bde6a..69f76ac 100644
--- a/config/layout.yaml
+++ b/config/layout.yaml
@@ -317,13 +317,13 @@ rooms:
title: Ladestrom
icon: ⚡
rank: 310
+ - device_id: sensor_caroutlet
+ title: Kabelstatus
+ icon: 🔌
+ rank: 315
- device_id: powermeter_caroutlet
- title: Ladestrom
+ title: Messwerte
icon: 📊
rank: 320
- - device_id: sensor_caroutlet
- title: Ladestrom
- icon: 🪟
- rank: 330