wn/home-automation
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

garaga page 19

Browse Source
This commit is contained in:
Wolfgang Hottgenroth
2025-11-28 08:53:00 +01:00
parent 0a0edd2b5b
commit 927d13191d
1 changed files with 43 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
apps/ui/templates/garage.html
View File

@@ -195,6 +195,19 @@
gap: 8px; gap: 8px;
} }
.phase-row {
display: flex;
gap: 8px;
}
.phase-value.full-width {
flex: 1;
}
.phase-value.half-width {
flex: 1;
}
.phase-value { .phase-value {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -448,54 +461,60 @@
<div class="phase-section"> <div class="phase-section">
<h4>Phase 1</h4> <h4>Phase 1</h4>
<div class="phase-values"> <div class="phase-values">
<div class="phase-value"> <div class="phase-value full-width">
<span class="value" id="phase1-power-${device.device_id}">${state.phase1_power?.toFixed(0) || '--'}</span> <span class="value" id="phase1-power-${device.device_id}">${state.phase1_power?.toFixed(0) || '--'}</span>
<span class="unit">W</span> <span class="unit">W</span>
</div> </div>
<div class="phase-value"> <div class="phase-row">
<div class="phase-value half-width">
<span class="value" id="phase1-voltage-${device.device_id}">${state.phase1_voltage?.toFixed(1) || '--'}</span> <span class="value" id="phase1-voltage-${device.device_id}">${state.phase1_voltage?.toFixed(1) || '--'}</span>
<span class="unit">V</span> <span class="unit">V</span>
</div> </div>
<div class="phase-value"> <div class="phase-value half-width">
<span class="value" id="phase1-current-${device.device_id}">${state.phase1_current?.toFixed(2) || '--'}</span> <span class="value" id="phase1-current-${device.device_id}">${state.phase1_current?.toFixed(2) || '--'}</span>
<span class="unit">A</span> <span class="unit">A</span>
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="phase-section"> <div class="phase-section">
<h4>Phase 2</h4> <h4>Phase 2</h4>
<div class="phase-values"> <div class="phase-values">
<div class="phase-value"> <div class="phase-value full-width">
<span class="value" id="phase2-power-${device.device_id}">${state.phase2_power?.toFixed(0) || '--'}</span> <span class="value" id="phase2-power-${device.device_id}">${state.phase2_power?.toFixed(0) || '--'}</span>
<span class="unit">W</span> <span class="unit">W</span>
</div> </div>
<div class="phase-value"> <div class="phase-row">
<div class="phase-value half-width">
<span class="value" id="phase2-voltage-${device.device_id}">${state.phase2_voltage?.toFixed(1) || '--'}</span> <span class="value" id="phase2-voltage-${device.device_id}">${state.phase2_voltage?.toFixed(1) || '--'}</span>
<span class="unit">V</span> <span class="unit">V</span>
</div> </div>
<div class="phase-value"> <div class="phase-value half-width">
<span class="value" id="phase2-current-${device.device_id}">${state.phase2_current?.toFixed(2) || '--'}</span> <span class="value" id="phase2-current-${device.device_id}">${state.phase2_current?.toFixed(2) || '--'}</span>
<span class="unit">A</span> <span class="unit">A</span>
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="phase-section"> <div class="phase-section">
<h4>Phase 3</h4> <h4>Phase 3</h4>
<div class="phase-values"> <div class="phase-values">
<div class="phase-value"> <div class="phase-value full-width">
<span class="value" id="phase3-power-${device.device_id}">${state.phase3_power?.toFixed(0) || '--'}</span> <span class="value" id="phase3-power-${device.device_id}">${state.phase3_power?.toFixed(0) || '--'}</span>
<span class="unit">W</span> <span class="unit">W</span>
</div> </div>
<div class="phase-value"> <div class="phase-row">
<div class="phase-value half-width">
<span class="value" id="phase3-voltage-${device.device_id}">${state.phase3_voltage?.toFixed(1) || '--'}</span> <span class="value" id="phase3-voltage-${device.device_id}">${state.phase3_voltage?.toFixed(1) || '--'}</span>
<span class="unit">V</span> <span class="unit">V</span>
</div> </div>
<div class="phase-value"> <div class="phase-value half-width">
<span class="value" id="phase3-current-${device.device_id}">${state.phase3_current?.toFixed(2) || '--'}</span> <span class="value" id="phase3-current-${device.device_id}">${state.phase3_current?.toFixed(2) || '--'}</span>
<span class="unit">A</span> <span class="unit">A</span>
</div> </div>
</div> </div>
</div> </div>
</div>
`; `;
container.appendChild(phaseGrid); container.appendChild(phaseGrid);
} }