Spaces:
Running
Running
File size: 2,205 Bytes
917b070 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | @using TaskTrackingSystem.WebApp.Components.Shared.Charts
<div class="@WrapperClass">
@if (!Items.Any())
{
<div class="rounded-2xl border border-dashed border-slate-200 bg-slate-50 px-4 py-8 text-center text-sm text-slate-500">
@EmptyText
</div>
}
else
{
@foreach (var item in Items)
{
var width = Math.Clamp(item.Value, 0, MaxValue) / MaxValue * 100;
<div class="rounded-2xl border border-slate-200 bg-slate-50 px-4 py-3">
<div class="flex items-center gap-3">
@if (!string.IsNullOrWhiteSpace(item.LeadingText))
{
<div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-full border border-white text-sm font-bold text-white shadow-sm" style="background-color: @item.Color;">
@item.LeadingText
</div>
}
<div class="min-w-0 flex-1">
<div class="flex items-center justify-between gap-3">
<div class="truncate text-sm font-semibold text-slate-950">@item.Label</div>
<div class="shrink-0 text-sm text-slate-500">@item.ValueLabel</div>
</div>
<div class="mt-2 h-2 overflow-hidden rounded-full bg-slate-200">
<div class="h-full rounded-full" style="width: @width%; background-color: @item.Color;"></div>
</div>
@if (!string.IsNullOrWhiteSpace(item.Detail))
{
<div class="mt-2 text-xs text-slate-500">@item.Detail</div>
}
</div>
</div>
</div>
}
}
</div>
@code {
[Parameter] public IReadOnlyList<ProgressListChartItem> Items { get; set; } = Array.Empty<ProgressListChartItem>();
[Parameter] public double MaxValue { get; set; } = 100;
[Parameter] public string EmptyText { get; set; } = "No data available.";
[Parameter] public string WrapperClass { get; set; } = "space-y-4";
}
|