STATS: ok display trends

This commit is contained in:
Samuele Locatelli
2025-03-11 07:34:11 +01:00
parent 7c20a7ee8c
commit a77d77fcfa
2 changed files with 62 additions and 18 deletions
+27 -13
View File
@@ -10,12 +10,22 @@
else
{
<div class="col-2">
<div class="card shadow">
<div class="card-body">
<ul class="list-group list-group-sm small">
<li class="list-group-item align-items-center bg-dark text-light fs-5">
Sel.Dettaglio
</li>
@foreach (PeriodoSel sPer in Enum.GetValues(typeof(PeriodoSel)))
{
<li class="list-group-item align-items-center p-1">
<button class="btn btn-sm w-100 @CssBtn(sPer)" @onclick="() => SetModo(sPer)">@sPer Detail</button>
</li>
}
</ul>
</div>
</div>
<div class="w-100">
@foreach (PeriodoSel sPer in Enum.GetValues(typeof(PeriodoSel)))
{
<button class="btn btn-outline-success w-100 @CssBtn(sPer)" @onclick="() => SetModo(sPer)">@sPer Detail</button>
}
</div>
<div class="border" style="max-height: 14em; overflow:hidden; overflow-y: auto;">
<ul class="list-group list-group-sm small">
@@ -27,19 +37,23 @@
</li>
}
</ul>
<i>Selezione tipo (day/week/month/year) + selezione ITEM da mostrare, tra quelli POSSIBILI dato periodo...</i>
<i>selezione ITEM da mostrare, tra quelli POSSIBILI dato periodo...</i>
</div>
</div>
<div class="col-10">
<div class="row">
<div class="col-2">
@* <div class="col-2">
<PieChart Id="PieODL" AspRatio="1" LegendPos="bottom" Data="@DatiPareto" Labels="@LabelPareto" lineColor="@lineColors" backColor="@bgColors" Title="@pieTitle"></PieChart>
</div>
<div class="col-10">
<b>Periodo</b>
<MultiLine Id="plotAll" AspRatio="4" DataTSList="@TSDataMulti" Labels="@LabelPlot" lineColor="@lineColors" backColor="@bgColors" lTens="0" Titles="@lineTitles" Stepped="false"></MultiLine>
<b>@pSel</b> Detail
<MultiLine Id="plotDetail" AspRatio="4" DataTSList="@TSDataMultiDetail" Labels="@LabelPlotDet" lineColor="@lineColorsDet" backColor="@bgColorsDet" lTens="0" Titles="@lineTitlesDet" Stepped="false"></MultiLine>
</div> *@
<div class="col">
<div class="text-center">
<b>@pSel</b> Detail
</div>
<MultiLine Id="plotDetail" AspRatio="3" DataTSList="@TSDataMultiDetail" Labels="@LabelPlotDet" lineColor="@lineColorsDet" backColor="@bgColorsDet" lTens="0" Titles="@lineTitlesDet" Stepped="false"></MultiLine>
<div class="text-center">
<b>Periodo</b>
</div>
<MultiLine Id="plotAll" AspRatio="3" DataTSList="@TSDataMulti" Labels="@LabelPlot" lineColor="@lineColors" backColor="@bgColors" lTens="0" Titles="@lineTitles" Stepped="false"></MultiLine>
</div>
</div>
</div>
+35 -5
View File
@@ -238,8 +238,8 @@ namespace MP.Stats.Components
#endif
}
bgColorsDet = semaphColors(ParetoData.Count * 2, "0.3");
lineColorsDet = semaphColors(ParetoData.Count * 2, "1");
bgColorsDet = cpColors(ParetoData.Count, "0.3");
lineColorsDet = cpColors(ParetoData.Count, "1");
}
}
@@ -249,6 +249,36 @@ namespace MP.Stats.Components
return date.AddDays(-offset);
}
/// <summary>
/// Genera colori sfondo alternat full / quasi grigi (x preious data)
/// </summary>
/// <param name="numRecords">numero record CURRENT</param>
/// <param name="alpha"></param>
/// <returns></returns>
protected List<string> cpColors(int numRecords, string alpha)
{
List<string> answ = new List<string>();
int r = 0;
int g = 0;
int b = 0;
// ciclo x numRecords-1
for (int j = 0; j < numRecords; j++)
{
r = 54 + (180 - 54) * j / numRecords;
g = 86 + (35 - 86) * j / numRecords;
b = 254 + (180 - 254) * j / numRecords;
answ.Add($"rgba({r}, {g}, {b}, {alpha}");
answ.Add($"rgba({(510 + r) / 3},{(510 + g) / 3},{(510 + b) / 3}, {alpha}");
}
// chiude
while (answ.Count < numRecords)
{
answ.Add($"rgba(180, 180, 35, {alpha})");
}
return answ;
}
/// <summary>
/// Ritorna dettaglio dato macchina e tipo (current o prev)
/// </summary>
@@ -271,7 +301,7 @@ namespace MP.Stats.Components
else
{
// fake fix: indietro 7 gg...
DateTime dataRif = DateTime.Today.AddDays(-7);
DateTime dataRif = DateTime.Today;//.AddDays(-7);
TimeSpan deltaOld = new TimeSpan(0);
DateTime dtStart = dataRif;
DateTime inizio = dataRif;
@@ -356,10 +386,10 @@ namespace MP.Stats.Components
private string CssBtn(PeriodoSel reqMode)
{
string answ = "btn-outline-success";
string answ = "btn-outline-dark";
if (reqMode == pSel)
{
answ = "btn-success text-light";
answ = "btn-dark text-light";
}
return answ;
}