58 lines
1.9 KiB
Plaintext
58 lines
1.9 KiB
Plaintext
<div class="progress-container mb-4">
|
|
<div class="d-flex justify-content-between mb-2">
|
|
<span class="fw-bold text-primary">@Status</span>
|
|
<span class="text-muted">@Percent%</span>
|
|
</div>
|
|
<div class="progress" style="height: 10px;">
|
|
<div class="progress-bar progress-bar-striped progress-bar-animated bg-gradient"
|
|
role="progressbar"
|
|
style="width: @Percent%"></div>
|
|
</div>
|
|
|
|
<div class="steps d-flex justify-content-between mt-3 px-2">
|
|
@foreach (var step in Steps)
|
|
{
|
|
<div class="step text-center @(step.IsActive ? "active" : "") @(step.IsCompleted ? "completed" : "")">
|
|
<div class="step-circle mb-1">
|
|
@if (step.IsCompleted) { <span>✓</span> } else { <span>@step.Number</span> }
|
|
</div>
|
|
<small class="step-label d-none d-sm-block">@step.Label</small>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
|
|
@code {
|
|
[Parameter] public string Status { get; set; } = "Ready";
|
|
[Parameter] public int Percent { get; set; } = 0;
|
|
|
|
// Simple step model
|
|
public class Step
|
|
{
|
|
public int Number { get; set; }
|
|
public string Label { get; set; } = "";
|
|
public bool IsActive { get; set; }
|
|
public bool IsCompleted { get; set; }
|
|
}
|
|
|
|
// We can pass current step index from parent
|
|
[Parameter] public int CurrentStepIndex { get; set; } = 0;
|
|
|
|
private List<Step> Steps = new()
|
|
{
|
|
new Step { Number = 1, Label = "Download" },
|
|
new Step { Number = 2, Label = "Transcrição" },
|
|
new Step { Number = 3, Label = "Análise IA" },
|
|
new Step { Number = 4, Label = "PDF" }
|
|
};
|
|
|
|
protected override void OnParametersSet()
|
|
{
|
|
for (int i = 0; i < Steps.Count; i++)
|
|
{
|
|
Steps[i].IsCompleted = i < CurrentStepIndex;
|
|
Steps[i].IsActive = i == CurrentStepIndex;
|
|
}
|
|
}
|
|
}
|