mapo-mono/MP.MONO.UI/Components/DisplayRecordComponent.razor

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

@inject CurrentDataService MMDataService

@if (currRecord != null)
{
    <div class="col-12 pr-0">
        @if (!string.IsNullOrEmpty(currRecord.CssIcon))
        {
            <div class="d-flex flex-column">
                <div class="small @cssLast(@currRecord.Title)"><sup>@currRecord.Title</sup></div>
                <div><i class="@currRecord.CssIcon"></i></div>
            </div>
        }
        else
        {
            <div class="d-flex justify-content-between">
                <b><span class="@cssLast(@currRecord.Title) small">@currRecord.Title</span></b>
                <div class="pl-0 float-end">
                    <div class="d-flex flex-column">
                        <div class="d-flex flex-row-reverse "><span class="float-end"><b>@currRecord.Value</b></span></div>
                    </div>
                </div>
            </div>
        }
    </div>
    <div class="col-12">
        @if (currRecord.ShowBar)
        {
            <div class="w-100">
                <div class="progress" style="height: 0.3rem; width: 100%;">
                    <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>
}
else
{
    <alert>waiting data</alert>
}