|
|
|
@@ -162,48 +162,14 @@
|
|
|
|
|
.toast.ok { border-color: var(--green); color: var(--green); }
|
|
|
|
|
.toast.err { border-color: var(--red); color: var(--red); }
|
|
|
|
|
|
|
|
|
|
/* Setup Wizard */
|
|
|
|
|
.wz-overlay { position:fixed; inset:0; background:rgba(0,0,0,.88); z-index:300;
|
|
|
|
|
display:flex; align-items:center; justify-content:center; padding:20px; }
|
|
|
|
|
.wz-box { background:var(--surface); border:1px solid var(--border);
|
|
|
|
|
border-radius:14px; padding:32px; width:100%; max-width:460px; }
|
|
|
|
|
.wz-logo { text-align:center; margin-bottom:22px; }
|
|
|
|
|
.wz-logo h2 { font-size:19px; margin-bottom:4px; }
|
|
|
|
|
.wz-logo p { color:var(--text-dim); font-size:13px; }
|
|
|
|
|
.wz-stepper { display:flex; margin-bottom:28px; }
|
|
|
|
|
.wz-step { flex:1; text-align:center; font-size:11px; font-weight:600;
|
|
|
|
|
text-transform:uppercase; letter-spacing:.05em; padding:7px 4px;
|
|
|
|
|
color:var(--text-dim); border-bottom:2px solid var(--border);
|
|
|
|
|
transition:color .2s, border-color .2s; }
|
|
|
|
|
.wz-step.active { color:var(--accent); border-color:var(--accent); }
|
|
|
|
|
.wz-step.done { color:var(--green); border-color:var(--green); }
|
|
|
|
|
.wz-panel { display:none; }
|
|
|
|
|
.wz-panel.active { display:block; }
|
|
|
|
|
.wz-actions { display:flex; justify-content:space-between; align-items:center; margin-top:22px; }
|
|
|
|
|
.wz-skip { font-size:12px; color:var(--text-dim); cursor:pointer;
|
|
|
|
|
background:none; border:none; color:var(--text-dim); padding:0; }
|
|
|
|
|
.wz-skip:hover { color:var(--text); }
|
|
|
|
|
|
|
|
|
|
@media (max-width: 520px) {
|
|
|
|
|
main { padding: 10px; }
|
|
|
|
|
.settings-section { max-width: 100%; }
|
|
|
|
|
.sensor-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
|
|
|
|
|
.inv-list { grid-template-columns: 1fr; }
|
|
|
|
|
.kwh-card .kv { font-size: 15px; }
|
|
|
|
|
.flash-section { max-width: 100% !important; }
|
|
|
|
|
header svg { display: none; }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Flash-Wizard */
|
|
|
|
|
.flash-section { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px; max-width:560px; }
|
|
|
|
|
.flash-section h3 { font-size:13px; font-weight:600; color:var(--text-dim); text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--border); }
|
|
|
|
|
.flash-code { font-family:monospace; font-size:12px; background:var(--surface2); border:1px solid var(--border); border-radius:6px; padding:10px 14px; margin:6px 0; word-break:break-all; }
|
|
|
|
|
.flash-step { display:flex; gap:10px; margin-bottom:14px; align-items:flex-start; }
|
|
|
|
|
.flash-step-num { width:22px; height:22px; min-width:22px; border-radius:50%; background:var(--accent); color:#000; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
|
|
|
|
|
.flash-pinout { font-family:monospace; font-size:12px; background:var(--surface2); border:1px solid var(--border); border-radius:6px; padding:10px 14px; line-height:1.9; white-space:pre; }
|
|
|
|
|
.flash-progress { width:100%; height:6px; background:var(--surface2); border-radius:3px; overflow:hidden; margin:12px 0 6px; }
|
|
|
|
|
.flash-progress-bar { height:100%; background:var(--accent); border-radius:3px; transition:width .4s; }
|
|
|
|
|
.flash-status-msg { font-size:12px; color:var(--text-dim); min-height:18px; }
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
@@ -229,7 +195,6 @@
|
|
|
|
|
<div class="tab" onclick="switchTab('live')">Live-Daten</div>
|
|
|
|
|
<div class="tab" onclick="switchTab('inverters')">Geräte</div>
|
|
|
|
|
<div class="tab" onclick="switchTab('settings')">Einstellungen</div>
|
|
|
|
|
<div class="tab" onclick="switchTab('flash')">Flash</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Energy Panel -->
|
|
|
|
@@ -358,99 +323,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Flash Panel -->
|
|
|
|
|
<div class="panel" id="panel-flash">
|
|
|
|
|
|
|
|
|
|
<!-- Probe / IP input -->
|
|
|
|
|
<div class="flash-section">
|
|
|
|
|
<h3>ShineLAN-X Stick</h3>
|
|
|
|
|
<div style="display:flex;gap:8px;margin-bottom:14px">
|
|
|
|
|
<input type="text" id="flash-ip" placeholder="192.168.1.xxx"
|
|
|
|
|
style="flex:1;background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:13px;padding:8px 10px;outline:none"
|
|
|
|
|
onkeydown="if(event.key==='Enter')flashProbe()">
|
|
|
|
|
<button class="btn btn-secondary" onclick="flashProbe()">Verbinden</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="flash-probe-status" style="font-size:13px;color:var(--text-dim)">IP eingeben und auf Verbinden klicken.</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- OTA mode -->
|
|
|
|
|
<div class="flash-section" id="flash-ota-section" style="display:none">
|
|
|
|
|
<h3>OTA-Update</h3>
|
|
|
|
|
<div style="margin-bottom:14px">
|
|
|
|
|
<div style="display:flex;gap:16px;margin-bottom:12px;flex-wrap:wrap">
|
|
|
|
|
<label style="display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px">
|
|
|
|
|
<input type="radio" name="flash-fw-src" value="bundled" id="flash-fw-bundled" onchange="flashFwSourceChange()" checked>
|
|
|
|
|
Integrierte Firmware
|
|
|
|
|
</label>
|
|
|
|
|
<label style="display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px">
|
|
|
|
|
<input type="radio" name="flash-fw-src" value="custom" id="flash-fw-custom" onchange="flashFwSourceChange()">
|
|
|
|
|
Eigene Datei
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="flash-fw-bundled-ui">
|
|
|
|
|
<div class="field" style="margin-bottom:0">
|
|
|
|
|
<label>Firmware</label>
|
|
|
|
|
<select id="flash-fw-select" style="width:100%;background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:13px;padding:8px 10px;outline:none"></select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="flash-fw-custom-ui" style="display:none">
|
|
|
|
|
<div class="field" style="margin-bottom:0">
|
|
|
|
|
<label>Firmware-Datei (.bin)</label>
|
|
|
|
|
<input type="file" id="flash-fw-file" accept=".bin" style="color:var(--text);font-size:13px">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="flash-progress-wrap" style="display:none">
|
|
|
|
|
<div class="flash-progress"><div class="flash-progress-bar" id="flash-progress-bar" style="width:0%"></div></div>
|
|
|
|
|
<div class="flash-status-msg" id="flash-status-msg"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-top:12px">
|
|
|
|
|
<button class="btn btn-primary" id="flash-start-btn" onclick="flashStart()">Firmware flashen</button>
|
|
|
|
|
<button class="btn" onclick="flashReboot()">Neu starten</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- ST-Link first-flash guide (always visible) -->
|
|
|
|
|
<div class="flash-section" id="flash-stlink-section">
|
|
|
|
|
<h3>Erstflash via ST-Link</h3>
|
|
|
|
|
<p style="color:var(--text-dim);font-size:13px;margin-bottom:16px">Wenn der Stick noch nie geflasht wurde, ist OTA noch nicht verfügbar. Einen ST-Link v2 und <code style="font-size:11px;background:var(--surface2);padding:1px 5px;border-radius:3px">stlink-tools</code> werden benötigt.</p>
|
|
|
|
|
|
|
|
|
|
<div class="flash-step">
|
|
|
|
|
<div class="flash-step-num">1</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div style="font-weight:600;margin-bottom:8px">SWD-Verbindung herstellen</div>
|
|
|
|
|
<div class="flash-pinout">PA13 → SWDIO
|
|
|
|
|
PA14 → SWCLK
|
|
|
|
|
GND → GND
|
|
|
|
|
3.3V → 3.3V (falls nicht extern versorgt)</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flash-step">
|
|
|
|
|
<div class="flash-step-num">2</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div style="font-weight:600;margin-bottom:8px">Flash-Kommando ausführen</div>
|
|
|
|
|
<div class="flash-code">st-flash --reset write nuttx-mbusd-shinelanx.bin 0x08000000</div>
|
|
|
|
|
<div style="font-size:12px;color:var(--text-dim);margin-top:6px">Datei im ShineLAN-X Releases-Ordner des Repos oder als GitHub-Release.</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flash-step">
|
|
|
|
|
<div class="flash-step-num">3</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div style="font-weight:600;margin-bottom:6px">Auf DHCP-Adresse warten</div>
|
|
|
|
|
<div style="font-size:13px;color:var(--text-dim)">Nach dem Neustart erscheint der Stick im Netz. IP oben eintragen → Verbinden — danach sind OTA-Updates möglich.</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div style="margin-top:4px;padding:10px 14px;background:var(--surface2);border-radius:6px;font-size:12px;color:var(--text-dim)">
|
|
|
|
|
Nach dem Erstflash empfiehlt sich ein OTA-Update auf die DFU-Variante
|
|
|
|
|
(<code style="font-size:11px;background:var(--bg);padding:1px 5px;border-radius:3px">nuttx-mbusd-shinelanx-dfu.bin</code>),
|
|
|
|
|
die zukünftige OTA-Updates ohne ST-Link ermöglicht.
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<!-- Flash/OTA-Panel ausgelagert nach growatt-diagnose-tool (v1.9.0) -->
|
|
|
|
|
</main>
|
|
|
|
|
|
|
|
|
|
<!-- Inverter Edit Modal -->
|
|
|
|
@@ -495,6 +368,9 @@ GND → GND
|
|
|
|
|
<option value="2">2-phasig</option>
|
|
|
|
|
<option value="3" selected>3-phasig</option>
|
|
|
|
|
</select></div>
|
|
|
|
|
<div class="field"><label>Max. Ladestrom (A)</label>
|
|
|
|
|
<input type="number" id="ems-max-current" value="32" min="6" max="32" step="1">
|
|
|
|
|
<div style="font-size:11px;color:var(--muted);margin-top:3px">Obergrenze für Zwangsladen — auf die tatsächliche Wallbox-/Zuleitungs-Absicherung setzen (z.B. 16A bei einer 11kW-Wallbox), nicht höher als die Hardware zulässt</div></div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="modal-actions">
|
|
|
|
@@ -504,77 +380,6 @@ GND → GND
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Setup Wizard -->
|
|
|
|
|
<div id="wizard-overlay" class="wz-overlay" style="display:none">
|
|
|
|
|
<div class="wz-box">
|
|
|
|
|
<div class="wz-logo">
|
|
|
|
|
<svg width="36" height="36" viewBox="0 0 24 24" fill="none" style="margin-bottom:8px">
|
|
|
|
|
<circle cx="12" cy="12" r="5" fill="#f0c040"/>
|
|
|
|
|
<path d="M12 2v3M12 19v3M2 12h3M19 12h3M4.22 4.22l2.12 2.12M17.66 17.66l2.12 2.12M4.22 19.78l2.12-2.12M17.66 6.34l2.12-2.12"
|
|
|
|
|
stroke="#f0c040" stroke-width="2" stroke-linecap="round"/>
|
|
|
|
|
</svg>
|
|
|
|
|
<h2>Willkommen bei ShineBridge</h2>
|
|
|
|
|
<p>Schnelle Einrichtung — 3 Schritte</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="wz-stepper">
|
|
|
|
|
<div class="wz-step active" id="wz-step-1">1 · MQTT</div>
|
|
|
|
|
<div class="wz-step" id="wz-step-2">2 · Wechselrichter</div>
|
|
|
|
|
<div class="wz-step" id="wz-step-3">3 · Fertig</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Step 1: MQTT -->
|
|
|
|
|
<div class="wz-panel active" id="wz-panel-1">
|
|
|
|
|
<div class="field"><label>MQTT Broker</label>
|
|
|
|
|
<input type="text" id="wz-mqtt-broker" placeholder="core-mosquitto"></div>
|
|
|
|
|
<div class="field"><label>Port</label>
|
|
|
|
|
<input type="number" id="wz-mqtt-port" value="1883"></div>
|
|
|
|
|
<div class="field"><label>Benutzername <span style="color:var(--text-dim);font-weight:400">(optional)</span></label>
|
|
|
|
|
<input type="text" id="wz-mqtt-user" autocomplete="off"></div>
|
|
|
|
|
<div class="field"><label>Passwort <span style="color:var(--text-dim);font-weight:400">(optional)</span></label>
|
|
|
|
|
<input type="password" id="wz-mqtt-pass"></div>
|
|
|
|
|
<div class="wz-actions">
|
|
|
|
|
<button class="wz-skip" onclick="wizardSkip()">Überspringen</button>
|
|
|
|
|
<button class="btn btn-primary" onclick="wizardStep1Next()">Weiter →</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Step 2: Inverter -->
|
|
|
|
|
<div class="wz-panel" id="wz-panel-2">
|
|
|
|
|
<div class="field"><label>Name</label>
|
|
|
|
|
<input type="text" id="wz-inv-name" placeholder="z.B. Dach Süd"></div>
|
|
|
|
|
<div class="field"><label>Gerätetyp</label>
|
|
|
|
|
<select id="wz-inv-model"></select></div>
|
|
|
|
|
<div class="field"><label>IP-Adresse (ShineLAN-X)</label>
|
|
|
|
|
<input type="text" id="wz-inv-ip" placeholder="192.168.1.100"></div>
|
|
|
|
|
<div style="display:grid;grid-template-columns:1fr 1fr;gap:8px">
|
|
|
|
|
<div class="field"><label>Modbus Port</label>
|
|
|
|
|
<input type="number" id="wz-inv-port" value="502"></div>
|
|
|
|
|
<div class="field"><label>Slave-Adresse</label>
|
|
|
|
|
<input type="number" id="wz-inv-addr" value="1" min="1" max="247"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="wz-actions">
|
|
|
|
|
<button class="btn" onclick="wizardGoStep(1)">← Zurück</button>
|
|
|
|
|
<button class="btn btn-primary" onclick="wizardStep2Next()">Weiter →</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Step 3: Done -->
|
|
|
|
|
<div class="wz-panel" id="wz-panel-3">
|
|
|
|
|
<div style="text-align:center;padding:20px 0 10px">
|
|
|
|
|
<div style="font-size:52px;margin-bottom:14px;line-height:1">✓</div>
|
|
|
|
|
<p style="font-size:15px;font-weight:600;margin-bottom:8px">Einrichtung abgeschlossen!</p>
|
|
|
|
|
<p style="color:var(--text-dim);font-size:13px;line-height:1.6">
|
|
|
|
|
ShineBridge verbindet sich jetzt mit MQTT und deinem Wechselrichter.<br>
|
|
|
|
|
Die ersten Messwerte erscheinen nach wenigen Sekunden.
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="wz-actions" style="justify-content:center;margin-top:28px">
|
|
|
|
|
<button class="btn btn-primary" onclick="wizardFinish()">Los geht's →</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<datalist id="z2m-device-list"></datalist>
|
|
|
|
|
<div class="toast" id="toast"></div>
|
|
|
|
|
|
|
|
|
@@ -653,7 +458,7 @@ function showToast(msg, type) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function switchTab(name) {
|
|
|
|
|
["energy","finance","live","inverters","settings","flash"].forEach((t, i) => {
|
|
|
|
|
["energy","finance","live","inverters","settings"].forEach((t, i) => {
|
|
|
|
|
document.querySelectorAll(".tab")[i].classList.toggle("active", t === name);
|
|
|
|
|
document.querySelectorAll(".panel")[i].classList.toggle("active", t === name);
|
|
|
|
|
});
|
|
|
|
@@ -1195,6 +1000,7 @@ async function openModal(invId) {
|
|
|
|
|
document.getElementById("ems-timeout").value = inv.ems_timeout ?? 4;
|
|
|
|
|
document.getElementById("ems-target-hour").value = inv.ems_target_hour ?? 6;
|
|
|
|
|
document.getElementById("ems-phases").value = inv.ems_phases ?? 3;
|
|
|
|
|
document.getElementById("ems-max-current").value = inv.ems_max_current_ma ? inv.ems_max_current_ma / 1000 : 32;
|
|
|
|
|
document.getElementById("ems-enabled").checked = inv.ems_enabled ?? true;
|
|
|
|
|
} else {
|
|
|
|
|
document.getElementById("modal-title").textContent = "Gerät hinzufügen";
|
|
|
|
@@ -1209,6 +1015,7 @@ async function openModal(invId) {
|
|
|
|
|
document.getElementById("ems-timeout").value = "4";
|
|
|
|
|
document.getElementById("ems-target-hour").value = "6";
|
|
|
|
|
document.getElementById("ems-phases").value = "3";
|
|
|
|
|
document.getElementById("ems-max-current").value = "32";
|
|
|
|
|
}
|
|
|
|
|
toggleEmsSection(modelSel.value);
|
|
|
|
|
modal.classList.add("open");
|
|
|
|
@@ -1243,6 +1050,7 @@ async function saveInverter() {
|
|
|
|
|
inv.ems_timeout = parseFloat(document.getElementById("ems-timeout").value);
|
|
|
|
|
inv.ems_target_hour = parseInt(document.getElementById("ems-target-hour").value);
|
|
|
|
|
inv.ems_phases = parseInt(document.getElementById("ems-phases").value);
|
|
|
|
|
inv.ems_max_current_ma = Math.round(parseFloat(document.getElementById("ems-max-current").value) * 1000);
|
|
|
|
|
inv.ems_enabled = document.getElementById("ems-enabled").checked;
|
|
|
|
|
}
|
|
|
|
|
const idx = invertersList.findIndex(i => i.id === id);
|
|
|
|
@@ -1528,214 +1336,13 @@ function renderSurplusStatus(surplusData) {
|
|
|
|
|
</div>`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// ── Flash-Wizard ──────────────────────────────────────────────
|
|
|
|
|
|
|
|
|
|
function flashFwSourceChange() {
|
|
|
|
|
const bundled = document.getElementById("flash-fw-bundled").checked;
|
|
|
|
|
document.getElementById("flash-fw-bundled-ui").style.display = bundled ? "" : "none";
|
|
|
|
|
document.getElementById("flash-fw-custom-ui").style.display = bundled ? "none" : "";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function flashProbe() {
|
|
|
|
|
const ip = document.getElementById("flash-ip").value.trim();
|
|
|
|
|
const statusEl = document.getElementById("flash-probe-status");
|
|
|
|
|
const otaSection = document.getElementById("flash-ota-section");
|
|
|
|
|
if (!ip) { showToast("IP-Adresse eingeben", "err"); return; }
|
|
|
|
|
statusEl.textContent = "Verbinde...";
|
|
|
|
|
statusEl.style.color = "var(--text-dim)";
|
|
|
|
|
try {
|
|
|
|
|
const r = await fetchJSON(api(`api/flash/probe?ip=${encodeURIComponent(ip)}`));
|
|
|
|
|
if (r.ota) {
|
|
|
|
|
statusEl.textContent = "✓ OTA-Modus aktiv";
|
|
|
|
|
statusEl.style.color = "var(--green)";
|
|
|
|
|
otaSection.style.display = "";
|
|
|
|
|
await flashLoadFirmwareList();
|
|
|
|
|
} else {
|
|
|
|
|
statusEl.textContent = "✗ Nicht erreichbar — ST-Link-Erstflash erforderlich";
|
|
|
|
|
statusEl.style.color = "var(--red)";
|
|
|
|
|
otaSection.style.display = "none";
|
|
|
|
|
}
|
|
|
|
|
} catch(e) {
|
|
|
|
|
statusEl.textContent = "Verbindungsfehler";
|
|
|
|
|
statusEl.style.color = "var(--red)";
|
|
|
|
|
otaSection.style.display = "none";
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function flashLoadFirmwareList() {
|
|
|
|
|
try {
|
|
|
|
|
const r = await fetchJSON(api("api/flash/firmware"));
|
|
|
|
|
const sel = document.getElementById("flash-fw-select");
|
|
|
|
|
sel.innerHTML = "";
|
|
|
|
|
if (r.files && r.files.length) {
|
|
|
|
|
r.files.forEach(f => {
|
|
|
|
|
const opt = document.createElement("option");
|
|
|
|
|
opt.value = f; opt.textContent = f;
|
|
|
|
|
sel.appendChild(opt);
|
|
|
|
|
});
|
|
|
|
|
const dfu = r.files.find(f => f.includes("dfu"));
|
|
|
|
|
if (dfu) sel.value = dfu;
|
|
|
|
|
} else {
|
|
|
|
|
sel.innerHTML = '<option value="">Keine integrierten Firmwares</option>';
|
|
|
|
|
document.getElementById("flash-fw-custom").checked = true;
|
|
|
|
|
flashFwSourceChange();
|
|
|
|
|
}
|
|
|
|
|
} catch(e) { /* ignore */ }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function flashStart() {
|
|
|
|
|
const ip = document.getElementById("flash-ip").value.trim();
|
|
|
|
|
if (!ip) { showToast("IP-Adresse eingeben", "err"); return; }
|
|
|
|
|
const bundled = document.getElementById("flash-fw-bundled").checked;
|
|
|
|
|
const progressWrap = document.getElementById("flash-progress-wrap");
|
|
|
|
|
const progressBar = document.getElementById("flash-progress-bar");
|
|
|
|
|
const statusMsg = document.getElementById("flash-status-msg");
|
|
|
|
|
const startBtn = document.getElementById("flash-start-btn");
|
|
|
|
|
|
|
|
|
|
progressWrap.style.display = "";
|
|
|
|
|
progressBar.style.background = "var(--accent)";
|
|
|
|
|
progressBar.style.width = "0%";
|
|
|
|
|
startBtn.disabled = true;
|
|
|
|
|
|
|
|
|
|
let url, opts;
|
|
|
|
|
if (bundled) {
|
|
|
|
|
const fw = document.getElementById("flash-fw-select").value;
|
|
|
|
|
if (!fw) { showToast("Keine Firmware ausgewählt", "err"); startBtn.disabled = false; return; }
|
|
|
|
|
url = api(`api/flash/update?ip=${encodeURIComponent(ip)}&fw=${encodeURIComponent(fw)}`);
|
|
|
|
|
opts = { method: "POST" };
|
|
|
|
|
statusMsg.textContent = `Übertrage ${fw} …`;
|
|
|
|
|
} else {
|
|
|
|
|
const file = document.getElementById("flash-fw-file").files[0];
|
|
|
|
|
if (!file) { showToast("Datei auswählen", "err"); startBtn.disabled = false; return; }
|
|
|
|
|
url = api(`api/flash/update?ip=${encodeURIComponent(ip)}`);
|
|
|
|
|
opts = { method: "POST", body: await file.arrayBuffer(),
|
|
|
|
|
headers: {"Content-Type": "application/octet-stream"} };
|
|
|
|
|
statusMsg.textContent = `Übertrage ${file.name} …`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
progressBar.style.width = "25%";
|
|
|
|
|
try {
|
|
|
|
|
const resp = await fetch(url, opts);
|
|
|
|
|
progressBar.style.width = "70%";
|
|
|
|
|
const result = await resp.json();
|
|
|
|
|
if (result.ok) {
|
|
|
|
|
statusMsg.textContent = "Warte auf Neustart …";
|
|
|
|
|
progressBar.style.width = "85%";
|
|
|
|
|
await flashPollReady(ip);
|
|
|
|
|
progressBar.style.width = "100%";
|
|
|
|
|
progressBar.style.background = "var(--green)";
|
|
|
|
|
statusMsg.textContent = "✓ Update abgeschlossen — Stick ist wieder online.";
|
|
|
|
|
showToast("Firmware erfolgreich geflasht", "ok");
|
|
|
|
|
} else {
|
|
|
|
|
progressBar.style.width = "100%";
|
|
|
|
|
progressBar.style.background = "var(--red)";
|
|
|
|
|
statusMsg.textContent = `Fehler: ${result.error || "Unbekannt"}`;
|
|
|
|
|
showToast("Flash fehlgeschlagen", "err");
|
|
|
|
|
}
|
|
|
|
|
} catch(e) {
|
|
|
|
|
progressBar.style.background = "var(--red)";
|
|
|
|
|
statusMsg.textContent = `Verbindungsfehler: ${e.message}`;
|
|
|
|
|
showToast("Flash fehlgeschlagen", "err");
|
|
|
|
|
}
|
|
|
|
|
startBtn.disabled = false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function flashPollReady(ip, maxSec = 90) {
|
|
|
|
|
const start = Date.now();
|
|
|
|
|
while ((Date.now() - start) / 1000 < maxSec) {
|
|
|
|
|
await new Promise(r => setTimeout(r, 3000));
|
|
|
|
|
try {
|
|
|
|
|
const r = await fetchJSON(api(`api/flash/probe?ip=${encodeURIComponent(ip)}`));
|
|
|
|
|
if (r.ota) return;
|
|
|
|
|
} catch(e) { /* still booting */ }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function flashReboot() {
|
|
|
|
|
const ip = document.getElementById("flash-ip").value.trim();
|
|
|
|
|
if (!ip) { showToast("IP-Adresse eingeben", "err"); return; }
|
|
|
|
|
try {
|
|
|
|
|
await fetch(api(`api/flash/reboot?ip=${encodeURIComponent(ip)}`), { method: "POST" });
|
|
|
|
|
showToast("Neustart-Befehl gesendet", "ok");
|
|
|
|
|
} catch(e) { showToast("Neustart fehlgeschlagen", "err"); }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// ── Setup Wizard ──────────────────────────────────────────────
|
|
|
|
|
|
|
|
|
|
function wizardGoStep(n) {
|
|
|
|
|
for (let i = 1; i <= 3; i++) {
|
|
|
|
|
document.getElementById(`wz-panel-${i}`).classList.toggle("active", i === n);
|
|
|
|
|
const el = document.getElementById(`wz-step-${i}`);
|
|
|
|
|
el.classList.toggle("active", i === n);
|
|
|
|
|
el.classList.toggle("done", i < n);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function wizardStep1Next() {
|
|
|
|
|
const body = {
|
|
|
|
|
mqtt_broker: document.getElementById("wz-mqtt-broker").value.trim() || "core-mosquitto",
|
|
|
|
|
mqtt_port: parseInt(document.getElementById("wz-mqtt-port").value) || 1883,
|
|
|
|
|
mqtt_user: document.getElementById("wz-mqtt-user").value,
|
|
|
|
|
mqtt_pass: document.getElementById("wz-mqtt-pass").value,
|
|
|
|
|
};
|
|
|
|
|
try {
|
|
|
|
|
await fetchJSON(api("api/config"), {
|
|
|
|
|
method: "POST", headers: {"Content-Type": "application/json"},
|
|
|
|
|
body: JSON.stringify(body),
|
|
|
|
|
});
|
|
|
|
|
} catch(e) { showToast("Speichern fehlgeschlagen", "err"); return; }
|
|
|
|
|
wizardGoStep(2);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function wizardStep2Next() {
|
|
|
|
|
const name = document.getElementById("wz-inv-name").value.trim();
|
|
|
|
|
const ip = document.getElementById("wz-inv-ip").value.trim();
|
|
|
|
|
if (!name || !ip) { showToast("Name und IP sind Pflichtfelder", "err"); return; }
|
|
|
|
|
const model = document.getElementById("wz-inv-model").value;
|
|
|
|
|
const id = Math.random().toString(36).slice(2, 10);
|
|
|
|
|
const newInv = {
|
|
|
|
|
id,
|
|
|
|
|
name,
|
|
|
|
|
inverter_model: model,
|
|
|
|
|
modbus_ip: ip,
|
|
|
|
|
modbus_port: parseInt(document.getElementById("wz-inv-port").value) || 502,
|
|
|
|
|
modbus_address: parseInt(document.getElementById("wz-inv-addr").value) || 1,
|
|
|
|
|
mqtt_topic_prefix: `growatt/${name.toLowerCase().replace(/\s+/g, "_")}`,
|
|
|
|
|
update_interval: 30,
|
|
|
|
|
};
|
|
|
|
|
// Bestehende Geräte behalten — Wizard darf nicht die komplette Liste überschreiben
|
|
|
|
|
const body = [...invertersList, newInv];
|
|
|
|
|
try {
|
|
|
|
|
await fetchJSON(api("api/inverters-config"), {
|
|
|
|
|
method: "POST", headers: {"Content-Type": "application/json"},
|
|
|
|
|
body: JSON.stringify(body),
|
|
|
|
|
});
|
|
|
|
|
} catch(e) { showToast("Speichern fehlgeschlagen", "err"); return; }
|
|
|
|
|
wizardGoStep(3);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function wizardFinish() {
|
|
|
|
|
document.getElementById("wizard-overlay").style.display = "none";
|
|
|
|
|
loadSettings();
|
|
|
|
|
loadInverters();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function wizardSkip() {
|
|
|
|
|
document.getElementById("wizard-overlay").style.display = "none";
|
|
|
|
|
}
|
|
|
|
|
// Flash-Wizard + Setup-Wizard ausgelagert nach growatt-diagnose-tool (v1.9.0) —
|
|
|
|
|
// Geräte werden jetzt direkt über "+ Gerät hinzufügen" im Geräte-Tab angelegt.
|
|
|
|
|
|
|
|
|
|
// ── Init ──────────────────────────────────────────────────────
|
|
|
|
|
|
|
|
|
|
(async () => {
|
|
|
|
|
await Promise.all([loadSettings(), loadInverters(), loadModels()]);
|
|
|
|
|
if (!globalConfig.inverters || globalConfig.inverters.length === 0) {
|
|
|
|
|
document.getElementById("wz-mqtt-broker").value = globalConfig.mqtt_broker || "core-mosquitto";
|
|
|
|
|
document.getElementById("wz-mqtt-port").value = globalConfig.mqtt_port || 1883;
|
|
|
|
|
document.getElementById("wz-mqtt-user").value = globalConfig.mqtt_user || "";
|
|
|
|
|
document.getElementById("wz-inv-model").innerHTML =
|
|
|
|
|
document.getElementById("modal-model").innerHTML;
|
|
|
|
|
document.getElementById("wizard-overlay").style.display = "flex";
|
|
|
|
|
}
|
|
|
|
|
startRefresh();
|
|
|
|
|
})();
|
|
|
|
|
|
|
|
|
|
