demo/Pages/Dashboard/Analysis/Components/Charts/MiniProgress/MiniProgress.razor

39 lines
1.0 KiB
Plaintext
Raw Normal View History

2024-06-21 16:48:24 +08:00
@namespace antblazorpro.Pages.Dashboard.Analysis
@inherits AntDomComponentBase
<div class="miniProgress">
<AntDesign.Tooltip Title="@("TargetLabel")">
<Unbound>
<div @ref="@context.Current" class="target" style="left: @(Target.HasValue ? $"{Target}%" : "")">
<span style="background-color: @Color" />
<span style="background-color: @Color" />
</div>
</Unbound>
</AntDesign.Tooltip>
<div class="progressWrap">
<div class="progress"
style="
background-color: @Color;
width: @(Percent.HasValue ? $"{Percent}%" : "");
height: @(StrokeWidth.HasValue ? $"{StrokeWidth}px" : "");" />
</div>
</div>
@code
{
[Parameter]
public int? Target { get; set; }
[Parameter]
public string TargetLabel { get; set; }
[Parameter]
public string Color { get; set; }
[Parameter]
public int? StrokeWidth { get; set; }
[Parameter]
public int? Percent { get; set; }
}