Fix backfill progress layout - wider card, no text wrapping
This commit is contained in:
parent
95d7fc0c39
commit
bb32e12c6a
1 changed files with 19 additions and 48 deletions
|
|
@ -287,55 +287,26 @@ defmodule MicrowavepropWeb.BackfillLive do
|
|||
<:subtitle>Enqueue and monitor contact enrichment jobs</:subtitle>
|
||||
</.header>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 my-6">
|
||||
<div class="bg-base-200 rounded-box p-4">
|
||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 my-6">
|
||||
<div class="bg-base-200 rounded-box p-4 md:col-span-2">
|
||||
<div class="text-xs opacity-60">Enrichment Progress</div>
|
||||
<div class="text-2xl font-bold">{@unprocessed.complete} / {@unprocessed.total} fully enriched</div>
|
||||
<div class="flex flex-col gap-1 mt-2">
|
||||
<div class="flex items-center gap-2 text-xs">
|
||||
<span class="w-16">HRRR</span>
|
||||
<progress
|
||||
class="progress progress-primary flex-1"
|
||||
value={@unprocessed.total - @unprocessed.hrrr}
|
||||
max={@unprocessed.total}
|
||||
/>
|
||||
<span class="w-20 text-right font-mono opacity-60">
|
||||
{format_number(@unprocessed.total - @unprocessed.hrrr)} / {format_number(@unprocessed.total)}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 text-xs">
|
||||
<span class="w-16">Weather</span>
|
||||
<progress
|
||||
class="progress progress-primary flex-1"
|
||||
value={@unprocessed.total - @unprocessed.weather}
|
||||
max={@unprocessed.total}
|
||||
/>
|
||||
<span class="w-20 text-right font-mono opacity-60">
|
||||
{format_number(@unprocessed.total - @unprocessed.weather)} / {format_number(@unprocessed.total)}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 text-xs">
|
||||
<span class="w-16">Terrain</span>
|
||||
<progress
|
||||
class="progress progress-primary flex-1"
|
||||
value={@unprocessed.total - @unprocessed.terrain}
|
||||
max={@unprocessed.total}
|
||||
/>
|
||||
<span class="w-20 text-right font-mono opacity-60">
|
||||
{format_number(@unprocessed.total - @unprocessed.terrain)} / {format_number(@unprocessed.total)}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 text-xs">
|
||||
<span class="w-16">IEMRE</span>
|
||||
<progress
|
||||
class="progress progress-primary flex-1"
|
||||
value={@unprocessed.total - @unprocessed.iemre}
|
||||
max={@unprocessed.total}
|
||||
/>
|
||||
<span class="w-20 text-right font-mono opacity-60">
|
||||
{format_number(@unprocessed.total - @unprocessed.iemre)} / {format_number(@unprocessed.total)}
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-2xl font-bold">
|
||||
{format_number(@unprocessed.complete)} / {format_number(@unprocessed.total)} fully enriched
|
||||
</div>
|
||||
<div class="flex flex-col gap-1.5 mt-3">
|
||||
<%= for {label, remaining} <- [{"HRRR", @unprocessed.hrrr}, {"Weather", @unprocessed.weather}, {"Terrain", @unprocessed.terrain}, {"IEMRE", @unprocessed.iemre}] do %>
|
||||
<div class="flex items-center gap-2 text-xs">
|
||||
<span class="w-14 shrink-0">{label}</span>
|
||||
<progress
|
||||
class="progress progress-primary flex-1 min-w-0"
|
||||
value={@unprocessed.total - remaining}
|
||||
max={@unprocessed.total}
|
||||
/>
|
||||
<span class="shrink-0 font-mono opacity-60 whitespace-nowrap">
|
||||
{format_number(@unprocessed.total - remaining)} / {format_number(@unprocessed.total)}
|
||||
</span>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-base-200 rounded-box p-4">
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue