@using MP.MONO.UI.Components
@using MP.MONO.Core.DTO
@using MP.MONO.UI.Data

@inject CurrentDataService MMDataService

@if (currRecord != null)
{
    <div class="col-4">
        @if (!string.IsNullOrEmpty(currRecord.CssIcon))
        {
            <div class="d-flex flex-column">
                <div class="small"><sup>@currRecord.Title</sup></div>
                <div><i class="@currRecord.CssIcon"></i></div>
            </div>
        }
        else
        {
            <div>@currRecord.Title</div>
        }
    </div>
    <div class="col-8 float-end">
        <div class="d-flex flex-column">
            <div class="d-flex flex-row-reverse"><h5 class="float-end"><b>@currRecord.Value</b></h5></div>
            @if (currRecord.ShowBar)
            {
                <div class="w-100">
                    <div class="progress" style="height: 0.3rem;">
                        <div class="progress-bar" role="progressbar" style="@percProgress(currRecord.ValueNum, currRecord.MinVal, currRecord.MaxVal)" aria-valuenow="@currRecord.ValueNum" aria-valuemin="@currRecord.MinVal" aria-valuemax="@currRecord.MaxVal"></div>
                    </div>
                </div>
            }
        </div>
    </div>
}
else
{
    <alert>waiting data</alert>
}