nearxos/reterminal-dm4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance dashboard UI for EEPROM update functionality

Browse Source 
Update the home and index templates to include the new EEPROM update action in the device management interface. Modify status handling to reflect the addition of the 'eeprom_update' phase, ensuring proper user feedback during operations. Introduce a clear status button and improve the layout for device actions, enhancing overall user experience and interaction with the dashboard.
This commit is contained in:
nearxos
2026-02-21 16:18:07 +02:00
parent b39e73324f
commit a915e5a405
2 changed files with 21 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
emmc-provisioning/dashboard/templates/index.html
View File

@@ -99,7 +99,8 @@
.status-pill.rpiboot,
.status-pill.waiting_choice,
.status-pill.flashing,
.status-pill.backup { background: var(--warn-bg); color: var(--warn); }
.status-pill.backup,
.status-pill.eeprom_update { background: var(--warn-bg); color: var(--warn); }
.status-pill.done { background: var(--success-bg); color: var(--success); }
.status-pill.error { background: var(--danger-bg); color: var(--danger); }
.status-msg {
@@ -367,11 +368,12 @@
<div id="status" class="status-row">
<span id="statusPill" class="status-pill idle">Idle</span>
<span id="statusMsg" class="status-msg">Waiting for device</span>
<button type="button" id="statusClearBtn" class="btn btn-outline btn-sm" style="margin-left: auto;">Clear status</button>
</div>
<div id="statusErr" class="status-err" style="display:none;"></div>
<div id="statusGoldenHint" class="backup-deploy-hint" style="display:none; margin-top:0.75rem;">
No golden image is required to <strong>capture</strong>. Connect a device in USB boot mode (or register over network); when it appears under “Capture image or deploy”, click <strong>Backup</strong> to save its image. Then set that backup as golden in the list below.
<button type="button" id="statusClearBtn" class="btn btn-outline btn-sm" style="margin-left:0.5rem;">Clear message</button>
<button type="button" id="statusClearHintBtn" class="btn btn-outline btn-sm" style="margin-left:0.5rem;">Clear message</button>
</div>
<div id="statusMeta" class="status-meta" style="display:none;"></div>
<div id="progressWrap" class="progress-track" style="display:none;">
@@ -500,6 +502,7 @@
waiting_choice: 'Choose action',
flashing: 'Flashing',
backup: 'Backing up',
eeprom_update: 'Updating EEPROM',
done: 'Done',
error: 'Error'
};
@@ -531,7 +534,7 @@
}
const progress = data.progress;
const inProgress = ['rpiboot', 'flashing', 'backup'].includes(phase);
const inProgress = ['rpiboot', 'flashing', 'backup', 'eeprom_update'].includes(phase);
if (inProgress || (phase === 'done' && progress != null)) {
progressWrap.style.display = 'block';
progressFill.classList.remove('indeterminate');
@@ -928,6 +931,10 @@
document.getElementById('statusClearBtn').addEventListener('click', function() {
fetch('/api/status-clear', { method: 'POST' }).then(function(r) { return r.json(); }).then(function(d) { if (d.ok) fetchStatus(); });
});
var statusClearHintBtn = document.getElementById('statusClearHintBtn');
if (statusClearHintBtn) statusClearHintBtn.addEventListener('click', function() {
fetch('/api/status-clear', { method: 'POST' }).then(function(r) { return r.json(); }).then(function(d) { if (d.ok) fetchStatus(); });
});
var refreshBackupsBtn = document.getElementById('refreshBackupsBtn');
if (refreshBackupsBtn) refreshBackupsBtn.onclick = function() { fetchBackups(); fetchGoldenInfo(); };
var uploadImageBtn = document.getElementById('uploadImageBtn');