imaging: organize tile metadata into deterministic rows

Previously last_updated, MAC, started, Intune device id, and the
raw current_stage string were sprinkled around the card in
hard-to-track positions. Reorganized:

Row 1 (header): serial | hostname | pctype | machine# | status badge
Row 2 (stage):  friendly label + N/M badge | pct% (right)
Row 3:          full-width progress bar
Row 4:          friendly hint (optional)
Row 5:          Intune device id + copy + set-category (optional)
Row 6:          started ... last ... MAC ... raw current_stage

Each row consistent across all cards regardless of which fields
are populated.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
cproudlock
2026-05-14 20:16:34 -04:00
parent 1c361e138b
commit a9a7478d5a

View File

@@ -92,7 +92,7 @@ window.addEventListener('DOMContentLoaded', scheduleImagingReload);
<strong>{{ friendly[0] }}</strong>
<span class="badge bg-secondary ms-1">{{ stage_idx }}/{{ stage_total or '?' }}</span>
</div>
<span class="text-muted small">{{ pct }}% &middot; last <code>{{ s.last_updated or '-' }}</code></span>
<span class="text-muted small">{{ pct }}%</span>
</div>
<div class="progress mt-1" style="height:0.7rem;">
<div class="progress-bar bg-{{ border }} {% if not is_done and not is_failed %}progress-bar-striped progress-bar-animated{% endif %}"
@@ -102,8 +102,8 @@ window.addEventListener('DOMContentLoaded', scheduleImagingReload);
{% if friendly[1] %}<div class="small text-muted mt-1">{{ friendly[1] }}</div>{% endif %}
{% if s.intune_device_id %}
<div class="small mt-1" style="font-size:0.75rem;">
<code>{{ s.intune_device_id }}</code>
<div class="small mt-2" style="font-size:0.75rem;">
<span class="text-muted">Intune:</span> <code>{{ s.intune_device_id }}</code>
<button type="button" class="btn btn-sm btn-outline-secondary py-0 px-1 copy-btn"
style="font-size:0.65rem; line-height:1; transition: all 0.2s;"
data-copy-text="{{ s.intune_device_id }}">copy</button>
@@ -111,9 +111,15 @@ window.addEventListener('DOMContentLoaded', scheduleImagingReload);
style="font-size:0.65rem; line-height:1;"
target="_blank" rel="noopener"
href="https://portal.azure.us/?feature.msaljs=false#view/Microsoft_Intune_Devices/DeviceSettingsMenuBlade/~/properties/aadDeviceId/{{ s.intune_device_id }}">set category</a>
<span class="text-muted ms-2">MAC <code>{{ s.mac or '-' }}</code> &middot; started <code>{{ s.started_at or '-' }}</code></span>
</div>
{% endif %}
<div class="text-muted mt-1" style="font-size:0.7rem;">
<span class="me-3">started <code>{{ s.started_at or '-' }}</code></span>
<span class="me-3">last <code>{{ s.last_updated or '-' }}</code></span>
<span class="me-3">MAC <code>{{ s.mac or '-' }}</code></span>
{% if s.current_stage %}<span style="font-family:monospace;">{{ s.current_stage }}</span>{% endif %}
</div>
</div>
</div>