Merge branch 'release/AddCompoAndExtension02'

This commit is contained in:
Samuele Locatelli
2024-02-23 16:37:47 +01:00
49 changed files with 652 additions and 11309 deletions
+5 -6
View File
@@ -9,16 +9,15 @@ namespace EgwCoreLib.BlazorTest.Data
{"TestPdfViewer", "Test PdfViewer"},
{"TestQrDisplay", "Test QrDisplay"},
{"TestGraphCompo", "Test Graph Compo"},
{"TestBarcodeReader", "Test BarcodeReader"},
{"TestCal_01", "Test Cal.01"},
{"TestCal_02", "Test Cal.02"},
{"TestBarcodeReader", "Test Barcode Read"},
{"TestCalendario", "Test Calendario"},
{"TestProgress", "Test Progress"},
{"TestLoading", "Test Loading"},
{"TestComponenti", "Test Componenti"},
{"TestCerchi", "Test Cerchi"},
{"TestSvgDraw", "Test SVG draw"},
{"TestGauges", "Test Gauges"},
{"TestMultiline", "Test Multiline"},
{"TestChart", "Test Chart"},
{"TestMultiline", "Test Chart Multiline"},
};
}
}
+1 -1
View File
@@ -27,7 +27,7 @@
<div class="row px-0">
@foreach (var item in MenuList)
{
<div class="col-6 col-md-4 col-lg-3 col-xl-2 mb-1">
<div class="col-6 col-md-4 col-lg-3 my-1">
<NavLink type="button" class="btn btn-primary bg-gradient text-light p-3 w-100" title="@item.Value" href="@item.Key">
<i class="fa-solid fa-wrench fa-2x mb-2" aria-hidden="true"></i>
<h5>@item.Value</h5>
@@ -1,18 +0,0 @@
@page "/TestCal_01"
<PageTitle>Index</PageTitle>
<div>
<div class="containerCard">
<DtCard cardBg="background-color: #E74C3C"></DtCard>
</div>
<div class="containerBtnEntrEsc">
<BottoniEntrEsc></BottoniEntrEsc>
</div>
<div class="row mt-2">
<div class="col">
<CalendarMonth DtRif="@dtCurr" MainCss="table table-dark table-borderless" DateSelected="DisplayDate" DateCheck="@DateCheck" SingleWeek="@singleWeek" SelDayCss="selDate rounded-top p-2"></CalendarMonth>
</div>
</div>
</div>
@@ -1,60 +0,0 @@
namespace EgwCoreLib.BlazorTest.Pages
{
public partial class TestCal_01
{
#region Protected Methods
protected override async Task OnInitializedAsync()
{
dtCurr = DateTime.Today;
await Task.Delay(1);
DateCheck = new Dictionary<DateTime, string>();
Random rnd = new Random();
// random colorate...
for (int i = 0; i < 10; i++)
{
DateTime newDate = dtCurr.AddDays(rnd.Next(-5, 10)).Date;
if (!DateCheck.ContainsKey(newDate))
{
DateCheck.Add(newDate, "bg-success text-light rounded-circle p-2");
}
else
{
DateCheck[newDate] = "bg-warning text-light rounded-circle p-2";
}
}
}
#endregion Protected Methods
#region Private Fields
private Dictionary<DateTime, string> DateCheck = new Dictionary<DateTime, string>();
#endregion Private Fields
#region Private Properties
private DateTime dtCurr { get; set; } = DateTime.Today;
private bool singleWeek = false;
#endregion Private Properties
#region Private Methods
private void DisplayDate(DateTime dtSel)
{
dtCurr = dtSel;
singleWeek = true;
}
private async Task resetCal()
{
singleWeek = false;
await Task.Delay(1);
}
#endregion Private Methods
}
}
@@ -1,43 +0,0 @@
.containerCalendario {
margin-top: 20px;
position: relative;
min-width: 20rem;
align-items: center;
display: flex;
justify-content: center;
}
.containerGauge {
position: fixed;
bottom: 5rem;
width: 100%;
align-items: center;
right: 5.2rem;
display: flex;
justify-content: center;
gap: 8.3rem;
}
.containerCard {
position: relative;
width: 100%;
align-items: center;
display: flex;
justify-content: center;
flex-direction: row;
}
.containerBtnEntrEsc {
margin-top: 20px;
position: relative;
width: 95%;
height: 2.5rem;
display: flex;
justify-content: center;
}
.containerBtnTemp {
position: fixed;
height: 39px;
width: 59px;
bottom: 4rem;
align-items: center;
display: flex;
justify-content: center;
}
@@ -1,49 +0,0 @@
.containerCalendario {
margin-top: 20px;
position: relative;
min-width: 20rem;
align-items: center;
display: flex;
justify-content: center;
}
.containerGauge {
position: fixed;
bottom: 5rem;
width: 100%;
align-items: center;
right: 5.2rem;
display: flex;
justify-content: center;
gap: 8.3rem;
}
.containerCard {
position: relative;
width: 100%;
align-items: center;
display: flex;
justify-content: center;
flex-direction: row;
}
.containerBtnEntrEsc {
margin-top: 20px;
position: relative;
width: 95%;
height: 2.5rem;
display: flex;
justify-content: center;
}
.containerBtnTemp {
position: fixed;
height: 39px;
width: 59px;
bottom: 4rem;
align-items: center;
display: flex;
justify-content: center;
}
-1
View File
@@ -1 +0,0 @@
.containerCalendario{margin-top:20px;position:relative;min-width:20rem;align-items:center;display:flex;justify-content:center;}.containerGauge{position:fixed;bottom:5rem;width:100%;align-items:center;right:5.2rem;display:flex;justify-content:center;gap:8.3rem;}.containerCard{position:relative;width:100%;align-items:center;display:flex;justify-content:center;flex-direction:row;}.containerBtnEntrEsc{margin-top:20px;position:relative;width:95%;height:2.5rem;display:flex;justify-content:center;}.containerBtnTemp{position:fixed;height:39px;width:59px;bottom:4rem;align-items:center;display:flex;justify-content:center;}
@@ -1,42 +0,0 @@
@page "/TestCal_02"
<h3>TestCal</h3>
<div class="row bg-dark">
<div class="col">
<CircleGauge maxVal="480" currVal="240" Titolo="4:00" Testo="Lavorate"></CircleGauge>
</div>
<div class="col">
<CircleGauge maxVal="480" currVal="360" Titolo="6:00" Testo="Lavorate"></CircleGauge>
</div>
<div class="col">
<CircleGauge maxVal="480" currVal="480" Titolo="8:00" Testo="Lavorate"></CircleGauge>
</div>
<div class="col">
<CircleGauge maxVal="480" currVal="600" Titolo="10:00" Testo="Lavorate"></CircleGauge>
</div>
</div>
<div class="row bg-dark py-3">
<div class="col">
<CalendarMonth DtRif="@dtCurr" MainCss="table table-dark table-borderless" DateSelected="DisplayDate" DateCheck="@DateCheck" SingleWeek="@singleWeek"></CalendarMonth>
</div>
</div>
<div class="d-flex justify-content-between">
<div>
<b>@($"{dtCurr:ddd dd.MM.yyyy}")</b>
</div>
<div>
<button class="btn btn-primary" @onclick="() => resetCal()">Reset</button>
</div>
<div>
single: <b>@singleWeek</b>
</div>
</div>
@@ -0,0 +1,46 @@
@page "/TestCalendario"
<PageTitle>TestGauges</PageTitle>
<div class="card shadow">
<div class="card-header">
<h3>Test Calendario + Gauges</h3>
</div>
<div class="card-body py-1">
<div class="row bg-dark">
<div class="col">
<CircleGauge maxVal="480" currVal="240" Titolo="4:00" Testo="Lavorate"></CircleGauge>
</div>
<div class="col">
<CircleGauge maxVal="480" currVal="360" Titolo="6:00" Testo="Lavorate"></CircleGauge>
</div>
<div class="col">
<CircleGauge maxVal="480" currVal="480" Titolo="8:00" Testo="Lavorate"></CircleGauge>
</div>
<div class="col">
<CircleGauge maxVal="480" currVal="600" Titolo="10:00" Testo="Lavorate"></CircleGauge>
</div>
</div>
<div class="row bg-dark py-3">
<div class="col">
<CalendarMonth DtRif="@dtCurr" MainCss="table table-dark table-borderless" DateSelected="DisplayDate" DateCheck="@DateCheck" SingleWeek="@singleWeek"></CalendarMonth>
</div>
</div>
<div class="d-flex justify-content-between">
<div>
<b>@($"{dtCurr:ddd dd.MM.yyyy}")</b>
</div>
<div>
<button class="btn btn-primary" @onclick="() => resetCal()">Reset</button>
</div>
<div>
single: <b>@singleWeek</b>
</div>
</div>
</div>
</div>
@@ -1,6 +1,6 @@
namespace EgwCoreLib.BlazorTest.Pages
{
public partial class TestCal_02
public partial class TestCalendario
{
#region Protected Methods
+67 -84
View File
@@ -1,92 +1,75 @@
@page "/TestCerchi"
@page "/TestSvgDraw"
<PageTitle>TestGauges</PageTitle>
<PageTitle>TestSvgDraw</PageTitle>
<div>
<div class="row py-4" style="background-color: #ACDDAC;">
<div class="col-4">
<NumInput @bind-Value="@valDecimale"></NumInput>
<div>
<b>@valDecimale</b>
</div>
</div>
<div class="col-4">
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="RadialGrad2">
<stop offset="0%" stop-color="#000000" />
<stop offset="80%" stop-color="#151515" />
<stop offset="90%" stop-color="#444444" />
<stop offset="100%" stop-color="#878787" />
</radialGradient>
</defs>
<rect width="100" height="100" rx="50" fill="url(#RadialGrad2)" fill-opacity="0.5">
</rect>
<text id="TitleElem" x="10%" y="50%" class="text-light" style="font-size:2rem;">Titolo</text>
<g>
<rect x="10%" y="10%" width="80%" height="80%" fill="white" fill-opacity="0.1">
</rect>
<text x="10%" y="70%" class="text-light" style="font-size:0.8rem;">
testo più lungo... 0123456789
<animate attributeName="x"
values="10%;10%;-10%;-80%;-100%;-100%;10%"
dur="6s"
begin="2s"
repeatCount="indefinite" />
</text>
</g>
</svg>
</div>
<div class="col-4">
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="RadialGrad2">
<stop offset="0%" stop-color="#000000" />
<stop offset="80%" stop-color="#151515" />
<stop offset="90%" stop-color="#444444" />
<stop offset="100%" stop-color="#878787" />
</radialGradient>
</defs>
<rect width="10" height="10" rx="5" fill="url(#RadialGrad2)" fill-opacity="0.5">
</rect>
</svg>
</div>
<div class="col-2 bg-dark">
</div>
<div class="col-2 bg-dark">
</div>
<div class="col-2 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-2 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-2 bg-dark">
</div>
<div class="col-2 bg-dark">
</div>
<div class="card">
<div class="card-header">
<h3>Test SVG</h3>
</div>
<div class="row">
<div class="col-12 containerCalendario">
<div class="calendario">
<div class="d-flex justify-content-between">
<div>
<CircleGauge Titolo="9:00" Testo="Caricate" maxVal="480" currVal="540" StrokeColorVal="#F1C40F" ShowCircleBtn="true"></CircleGauge>
</div>
<div>
<CircleGauge Titolo="4:00" Testo="Lavorate" maxVal="480" currVal="240" StrokeColorVal="#00FF00" ShowCircleBtn="true"></CircleGauge>
</div>
<div>
<CircleGauge Titolo="12:00" Testo="Caricate" maxVal="480" currVal="720" StrokeColorVal="#F1C40F" StrokeColorValOuter="#01C4FF" ShowCircleBtn="true"></CircleGauge>
</div>
</div>
<div class="containerBtnTemp">
<button class="btn btn-sm btn-warning">
TEMP
</button>
</div>
<div class="card-body py-1">
<div class="row py-4" style="background-color: #ACDDAC;">
<div class="col-4">
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="RadialGrad2">
<stop offset="0%" stop-color="#000000" />
<stop offset="80%" stop-color="#151515" />
<stop offset="90%" stop-color="#444444" />
<stop offset="100%" stop-color="#878787" />
</radialGradient>
</defs>
<rect width="100" height="100" rx="50" fill="url(#RadialGrad2)" fill-opacity="0.5">
</rect>
<text id="TitleElem" x="10%" y="50%" class="text-light" style="font-size:2rem;">Titolo</text>
<g>
<rect x="10%" y="10%" width="80%" height="80%" fill="white" fill-opacity="0.1">
</rect>
<text x="10%" y="70%" class="text-light" style="font-size:0.8rem;">
testo più lungo... 0123456789
<animate attributeName="x"
values="10%;10%;-10%;-80%;-100%;-100%;10%"
dur="6s"
begin="2s"
repeatCount="indefinite" />
</text>
</g>
</svg>
</div>
<div class="col-4 text-center">
<ul class="list-group">
<li class="list-group-item active">
<b>SVG Draw</b>
</li>
<li class="list-group-item">
Test disegno diretto component SVG + html/css
</li>
<li class="list-group-item">
Disegno elemento circolare + gradiente (simil-button)
<div class="fs-3">&rarr;</div>
</li>
<li class="list-group-item">
Testo che scorre entro un box
<div class="fs-3">&larr;</div>
</li>
</ul>
</div>
<div class="col-4">
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="RadialGrad2">
<stop offset="0%" stop-color="#000000" />
<stop offset="80%" stop-color="#151515" />
<stop offset="90%" stop-color="#444444" />
<stop offset="100%" stop-color="#878787" />
</radialGradient>
</defs>
<rect width="10" height="10" rx="5" fill="url(#RadialGrad2)" fill-opacity="0.5">
</rect>
</svg>
</div>
</div>
</div>
</div>
+1 -78
View File
@@ -1,4 +1,4 @@
@page "/TestCompo"
@page "/TestChart"
@using EgwCoreLib.Razor.Data;
@using EgwCoreLib.Utils;
@@ -35,81 +35,4 @@
</div>
</div>
@code {
protected DtUtils.Periodo? periodo { get; set; } = new DtUtils.Periodo(DtUtils.PeriodSet.ThisTrim);
protected async Task setPeriodo(DtUtils.Periodo newPeriodo)
{
await Task.Delay(1);
periodo = newPeriodo;
}
public List<DoughnutStyling> colors = new List<DoughnutStyling>();
public List<double> Data = new List<double>();
public List<string> Labels = new List<string>();
protected override async Task OnInitializedAsync()
{
await Task.Delay(1);
}
protected override async Task OnParametersSetAsync()
{
await ReloadData();
await Task.Delay(1);
}
protected double[] SimData()
{
List<double> answ = new List<double>();
double currColor = 0;
for (int i = 0; i < 10; i++)
{
currColor = (double)(rnd.Next(10, 100)) / 10;
answ.Add(currColor);
if(currColor>7)
{
colors.Add(new DoughnutStyling("#28FF69", "ccc"));
}
else if (currColor > 3)
{
colors.Add(new DoughnutStyling("orange", "ccc"));
}
else
{
colors.Add(new DoughnutStyling("red", "ccc"));
}
}
return answ.ToArray();
}
protected async Task ReloadData()
{
await Task.Delay(1);
}
protected Random rnd = new Random();
protected string[] histLabel(int num)
{
List<string> answ = new List<string>();
for (int i = 0; i < 50; i++)
{
answ.Add($"LBL_{i:00}");
}
return answ.ToArray();
}
protected string[] histData(int num)
{
List<string> answ = new List<string>();
for (int i = 0; i < 50; i++)
{
answ.Add($"{(double)(rnd.Next(10, 100)) / 10 + i}");
}
return answ.ToArray();
}
}
@@ -0,0 +1,98 @@
using EgwCoreLib.Razor.Data;
using EgwCoreLib.Utils;
namespace EgwCoreLib.BlazorTest.Pages
{
public partial class TestChart
{
#region Public Fields
public List<DoughnutStyling> colors = new List<DoughnutStyling>();
public List<double> Data = new List<double>();
public List<string> Labels = new List<string>();
#endregion Public Fields
#region Protected Fields
protected Random rnd = new Random();
#endregion Protected Fields
#region Protected Properties
protected DtUtils.Periodo? periodo { get; set; } = new DtUtils.Periodo(DtUtils.PeriodSet.ThisTrim);
#endregion Protected Properties
#region Protected Methods
protected string[] histData(int num)
{
List<string> answ = new List<string>();
for (int i = 0; i < 50; i++)
{
answ.Add($"{(double)(rnd.Next(10, 100)) / 10 + i}");
}
return answ.ToArray();
}
protected string[] histLabel(int num)
{
List<string> answ = new List<string>();
for (int i = 0; i < 50; i++)
{
answ.Add($"LBL_{i:00}");
}
return answ.ToArray();
}
protected override async Task OnInitializedAsync()
{
await Task.Delay(1);
}
protected override async Task OnParametersSetAsync()
{
await ReloadData();
await Task.Delay(1);
}
protected async Task ReloadData()
{
await Task.Delay(1);
}
protected async Task setPeriodo(DtUtils.Periodo newPeriodo)
{
await Task.Delay(1);
periodo = newPeriodo;
}
protected double[] SimData()
{
List<double> answ = new List<double>();
double currColor = 0;
for (int i = 0; i < 10; i++)
{
currColor = (double)(rnd.Next(10, 100)) / 10;
answ.Add(currColor);
if (currColor > 7)
{
colors.Add(new DoughnutStyling("#28FF69", "ccc"));
}
else if (currColor > 3)
{
colors.Add(new DoughnutStyling("orange", "ccc"));
}
else
{
colors.Add(new DoughnutStyling("red", "ccc"));
}
}
return answ.ToArray();
}
#endregion Protected Methods
}
}
@@ -1,6 +1,7 @@
@page "/TestComponenti"
@inject NavigationManager NavMan
@implements IDisposable
<PageTitle>Test</PageTitle>
@@ -66,21 +67,59 @@
QueryString
</div>
<div class="card-body py-1">
Test valori QueryString
<ul class="list-group">
<li class="list-group-item">
Query string <b>Nome</b>:
<li class="list-group-item d-flex justify-content-between">
QString <b>Nome</b>:
<span class="badge bg-primary rounded-pill">
@if (!string.IsNullOrEmpty(qsNome))
{
@qsNome
}
else
{
<span>-</span>
}
</span>
</li>
<li class="list-group-item d-flex justify-content-between">
QString <b>Intero</b>:
<span class="badge bg-primary rounded-pill">
@if (qsIntero > 0)
{
@qsIntero
}
else
{
<span>-</span>
}
</span>
</li>
<li class="list-group-item">
@qsNome
<NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="TestComponenti">
<i class="fa-solid fa-wrench" aria-hidden="true"></i>
<small>Reload Vuoto</small>
</NavLink>
</li>
<li class="list-group-item">
Query string <b>Intero</b>:
<NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="@($"TestComponenti?Nome=Test_{DateTime.Now:mm}")">
<i class="fa-solid fa-wrench" aria-hidden="true"></i>
<small>Reload Nome</small>
</NavLink>
</li>
<li class="list-group-item">
@qsIntero
<NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="@($"TestComponenti?Intero={DateTime.Now:ss}")">
<i class="fa-solid fa-wrench" aria-hidden="true"></i>
<small>Reload Intero</small>
</NavLink>
</li>
<li class="list-group-item">
<NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="@($"TestComponenti?Nome=Test_{DateTime.Now:mm}&Intero={DateTime.Now:ss}")">
<i class="fa-solid fa-wrench" aria-hidden="true"></i>
<small>Reload All</small>
</NavLink>
</li>
</ul>
</div>
@@ -98,12 +137,24 @@
protected decimal valDecimale = 12345;
private string qsNome = "";
private int qsIntero = 0;
private int qsIntero = -1;
protected override void OnInitialized()
{
// base.OnInitialized();
qsNome = NavMan.ExtractQueryStringByKey<string>("Nome");
qsIntero = NavMan.ExtractQueryStringByKey<int>("Intero");
NavMan.LocationChanged += LocationChanged;
}
async void LocationChanged(object sender, LocationChangedEventArgs e)
{
qsNome = NavMan.ExtractQueryStringByKey<string>("Nome");
qsIntero = NavMan.ExtractQueryStringByKey<int>("Intero");
StateHasChanged();
}
void IDisposable.Dispose()
{
NavMan.LocationChanged -= LocationChanged;
}
}
+41 -79
View File
@@ -2,89 +2,51 @@
<PageTitle>TestGauges</PageTitle>
<div>
<div class="row py-4" style="background-color: #ACDDAC;">
<div class="col-4">
<NumInput @bind-Value="@valDecimale"></NumInput>
<div>
<b>@valDecimale</b>
<div class="card shadow">
<div class="card-header">
<h3>Test componente Gauges</h3>
</div>
<div class="card-body py-1">
<div class="row py-4" style="background-color: #ACDDAC;">
<div class="col-1 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-2 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-3 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-3 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-2 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-1 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
</div>
<div class="col-4">
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="RadialGrad2">
<stop offset="0%" stop-color="#000000" />
<stop offset="80%" stop-color="#151515" />
<stop offset="90%" stop-color="#444444" />
<stop offset="100%" stop-color="#878787" />
</radialGradient>
</defs>
<rect width="100" height="100" rx="50" fill="url(#RadialGrad2)" fill-opacity="0.5">
</rect>
<text id="TitleElem" x="10%" y="50%" class="text-light" style="font-size:2rem;">Titolo</text>
<g>
<rect x="10%" y="10%" width="80%" height="80%" fill="white" fill-opacity="0.1">
</rect>
<text x="10%" y="70%" class="text-light" style="font-size:0.8rem;">
testo più lungo... 0123456789
<animate attributeName="x"
values="10%;10%;-10%;-80%;-100%;-100%;10%"
dur="6s"
begin="2s"
repeatCount="indefinite" />
</text>
</g>
</svg>
</div>
<div class="col-4">
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="RadialGrad2">
<stop offset="0%" stop-color="#000000" />
<stop offset="80%" stop-color="#151515" />
<stop offset="90%" stop-color="#444444" />
<stop offset="100%" stop-color="#878787" />
</radialGradient>
</defs>
<rect width="10" height="10" rx="5" fill="url(#RadialGrad2)" fill-opacity="0.5">
</rect>
</svg>
</div>
<div class="col-2 bg-dark">
</div>
<div class="col-2 bg-dark">
</div>
<div class="col-2 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-2 bg-dark">
<CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
</div>
<div class="col-2 bg-dark">
</div>
<div class="col-2 bg-dark">
</div>
</div>
<div class="row">
<div class="col-12 containerCalendario">
<div class="calendario">
<div class="d-flex justify-content-between">
<div>
<CircleGauge Titolo="9:00" Testo="Caricate" maxVal="480" currVal="540" StrokeColorVal="#F1C40F" ShowCircleBtn="true"></CircleGauge>
<div class="row">
<div class="col-12 containerCalendario">
<small>Blocco calendario (sottostante) gestito da css sticky sul fondo</small>
<div class="calendario">
<div class="d-flex justify-content-between">
<div>
<CircleGauge Titolo="9:00" Testo="Caricate" maxVal="480" currVal="540" StrokeColorVal="#F1C40F" ShowCircleBtn="true"></CircleGauge>
</div>
<div>
<CircleGauge Titolo="4:00" Testo="Lavorate" maxVal="480" currVal="240" StrokeColorVal="#00FF00" ShowCircleBtn="true"></CircleGauge>
</div>
<div>
<CircleGauge Titolo="12:00" Testo="Caricate" maxVal="480" currVal="720" StrokeColorVal="#F1C40F" StrokeColorValOuter="#01C4FF" ShowCircleBtn="true"></CircleGauge>
</div>
</div>
<div>
<CircleGauge Titolo="4:00" Testo="Lavorate" maxVal="480" currVal="240" StrokeColorVal="#00FF00" ShowCircleBtn="true"></CircleGauge>
<div class="containerBtnTemp">
<button class="btn btn-sm btn-warning">
TEMP
</button>
</div>
<div>
<CircleGauge Titolo="12:00" Testo="Caricate" maxVal="480" currVal="720" StrokeColorVal="#F1C40F" StrokeColorValOuter="#01C4FF" ShowCircleBtn="true"></CircleGauge>
</div>
</div>
<div class="containerBtnTemp">
<button class="btn btn-sm btn-warning">
TEMP
</button>
</div>
</div>
</div>
@@ -4,7 +4,7 @@
height: 18.75rem;
position: fixed;
bottom: 3.5rem;
width: 95%;
width: 70%;
display: flex;
justify-content: center;
border-radius: 12px 12px 12px 12px;
@@ -39,9 +39,9 @@
}
.containerBtnTemp {
position: fixed;
height: 39px;
width: 59px;
bottom: 4rem;
height: 3rem;
width: 6rem;
bottom: 2rem;
align-items: center;
display: flex;
justify-content: center;
@@ -4,7 +4,7 @@
height: 18.75rem;
position: fixed;
bottom: 3.5rem;
width: 95%;
width: 70%;
display: flex;
justify-content: center;
border-radius: 12px 12px 12px 12px
@@ -44,9 +44,9 @@
.containerBtnTemp {
position: fixed;
height: 39px;
width: 59px;
bottom: 4rem;
height: 3rem;
width: 6rem;
bottom: 2rem;
align-items: center;
display: flex;
justify-content: center;
@@ -1 +1 @@
.calendario{background-color:#34495e;border:2px solid #000;height:18.75rem;position:fixed;bottom:3.5rem;width:95%;display:flex;justify-content:center;border-radius:12px 12px 12px 12px;}.containerCalendario{display:flex;justify-content:center;}.containerGauge{position:fixed;bottom:5rem;width:100%;align-items:center;right:5.2rem;display:flex;justify-content:center;gap:8.3rem;}.containerCard{position:relative;width:100%;align-items:center;display:flex;justify-content:center;}.containerBtnEntrEsc{margin-top:20px;position:relative;width:100%;display:flex;justify-content:center;}.containerBtnTemp{position:fixed;height:39px;width:59px;bottom:4rem;align-items:center;display:flex;justify-content:center;}
.calendario{background-color:#34495e;border:2px solid #000;height:18.75rem;position:fixed;bottom:3.5rem;width:70%;display:flex;justify-content:center;border-radius:12px 12px 12px 12px;}.containerCalendario{display:flex;justify-content:center;}.containerGauge{position:fixed;bottom:5rem;width:100%;align-items:center;right:5.2rem;display:flex;justify-content:center;gap:8.3rem;}.containerCard{position:relative;width:100%;align-items:center;display:flex;justify-content:center;}.containerBtnEntrEsc{margin-top:20px;position:relative;width:100%;display:flex;justify-content:center;}.containerBtnTemp{position:fixed;height:3rem;width:6rem;bottom:2rem;align-items:center;display:flex;justify-content:center;}
@@ -22,51 +22,6 @@
</div>
</div>
<div class="card my-2">
<div class="card-header"><h4>Test progBar singola linea</h4></div>
<div class="card-body">
<div class="row bg-secondary py-2">
<div class="col">
<ProgBar singleLine="true" baseUM="$" currVal="@(rnd.Next(50,250))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="gg" currVal="@(rnd.Next(200,450))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="min" currVal="@(rnd.Next(400,650))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="px" currVal="@(rnd.Next(600,900))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="h" currVal="@(rnd.Next(500,1000))" maxVal="1000" redLim="200" yelLim="400" />
</div>
</div>
</div>
</div>
<div class="card my-2">
<div class="card-header"><h4>Test progBar multi linea</h4></div>
<div class="card-body">
<div class="row bg-dark py-2">
<div class="col">
<ProgBar singleLine="false" baseUM="$" currVal="@(rnd.Next(50,250))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="gg" currVal="@(rnd.Next(200,450))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="min" currVal="@(rnd.Next(400,650))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="px" currVal="@(rnd.Next(600,900))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="h" currVal="@(rnd.Next(500,1000))" maxVal="1000" redLim="200" yelLim="400" />
</div>
</div>
</div>
</div>
@code {
private int currentCount = 0;
+30 -25
View File
@@ -1,31 +1,36 @@
@page "/TestLoading"
<div class="card">
<div class="card-header">
<h3>Test Modale Loading</h3>
<div class="row">
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
</div>
<div class="card-body py-1">
<div class="row">
<div class="col-4">
<div class="input-group w-100 mb-1">
<span class="input-group-text">Tempo sim</span>
<input class="form-control" @bind="@expTime" type="number" />
</div>
<div class="input-group w-100 mb-1">
<span class="input-group-text">Num steps</span>
<input class="form-control" @bind="@numSteps" type="number" />
</div>
<button class="btn btn-success w-100" @onclick="StartLongTimer">Start</button>
<div>@realTime</div>
</div>
<div class="col-8 small">
<h3>Fake Progressbar</h3>
<p>Modale che mostra avanzamento (progressbar con %) di un task lungo.</p>
<p>Devono essere definiti il numero degli step attesi e per ogni step la durata attesa di completamento.</p>
<p>Viene definito <b>fake</b> poiché l'avanzamento è artificialmente rallentato quando si approssima allo scadere di uno step per dare impressione di un sistema realmente (ri)calcolato di continuo, mentre al superamento di ogni step viene portato avanti il conteggio recuperando eventuali ritardi di stima.</p>
</div>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
</div>
</div>
<div class="row">
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
</div>
</div>
<div class="row">
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
</div>
</div>
<ProgressDisplay RefreshInterval="100" Title="@titleMsg" MaxVal="@maxVal" CurrVal="@currVal" NextVal="@nextVal" ExpTimeMSec="@expTimeMSec" DisplaySize="ProgressDisplay.ModalSize.Medium" ModalCss="card alert-primary" SlowLimit="0.4"></ProgressDisplay>
@@ -16,38 +16,3 @@ else
</div>
</div>
}
<hr />
<div class="row">
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
</div>
</div>
<div class="row">
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
</div>
</div>
<div class="row">
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
</div>
<div class="col-4">
<LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
</div>
</div>
@@ -0,0 +1,78 @@
@page "/TestProgress"
<div class="card">
<div class="card-header">
<h3>Test Modale Loading</h3>
</div>
<div class="card-body py-1">
<div class="row">
<div class="col-4">
<div class="input-group w-100 mb-1">
<span class="input-group-text">Tempo sim</span>
<input class="form-control" @bind="@expTime" type="number" />
</div>
<div class="input-group w-100 mb-1">
<span class="input-group-text">Num steps</span>
<input class="form-control" @bind="@numSteps" type="number" />
</div>
<button class="btn btn-success w-100" @onclick="StartLongTimer">Start</button>
<div>@realTime</div>
</div>
<div class="col-8 small">
<h3>Fake Progressbar</h3>
<p>Modale che mostra avanzamento (progressbar con %) di un task lungo.</p>
<p>Devono essere definiti il numero degli step attesi e per ogni step la durata attesa di completamento.</p>
<p>Viene definito <b>fake</b> poiché l'avanzamento è artificialmente rallentato quando si approssima allo scadere di uno step per dare impressione di un sistema realmente (ri)calcolato di continuo, mentre al superamento di ogni step viene portato avanti il conteggio recuperando eventuali ritardi di stima.</p>
</div>
</div>
<hr />
<div class="card my-2">
<div class="card-header"><h4>Test progBar singola linea</h4></div>
<div class="card-body">
<div class="row bg-secondary py-2">
<div class="col">
<ProgBar singleLine="true" baseUM="$" currVal="@(rnd.Next(50,250))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="gg" currVal="@(rnd.Next(200,450))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="min" currVal="@(rnd.Next(400,650))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="px" currVal="@(rnd.Next(600,900))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="true" baseUM="h" currVal="@(rnd.Next(500,1000))" maxVal="1000" redLim="200" yelLim="400" />
</div>
</div>
</div>
</div>
<hr />
<div class="card my-2">
<div class="card-header"><h4>Test progBar multi linea</h4></div>
<div class="card-body">
<div class="row bg-dark py-2">
<div class="col">
<ProgBar singleLine="false" baseUM="$" currVal="@(rnd.Next(50,250))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="gg" currVal="@(rnd.Next(200,450))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="min" currVal="@(rnd.Next(400,650))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="px" currVal="@(rnd.Next(600,900))" maxVal="1000" redLim="200" yelLim="400" />
</div>
<div class="col">
<ProgBar singleLine="false" baseUM="h" currVal="@(rnd.Next(500,1000))" maxVal="1000" redLim="200" yelLim="400" />
</div>
</div>
</div>
</div>
</div>
</div>
<ProgressDisplay RefreshInterval="100" Title="@titleMsg" MaxVal="@maxVal" CurrVal="@currVal" NextVal="@nextVal" ExpTimeMSec="@expTimeMSec" DisplaySize="ProgressDisplay.ModalSize.Medium" ModalCss="card alert-primary" SlowLimit="0.4"></ProgressDisplay>
@@ -2,7 +2,7 @@ using System.Diagnostics;
namespace EgwCoreLib.BlazorTest.Pages
{
public partial class TestLoading
public partial class TestProgress
{
#region Protected Properties
+5 -13
View File
@@ -29,6 +29,8 @@
</div>
<script src="lib/bootstrap/js/bootstrap.bundle.js"></script>
@* <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> *@
<script src="~/lib/Chart.js/chart.umd.js"></script>
<script src="_framework/blazor.server.js" autostart="false"></script>
@@ -44,21 +46,11 @@
onConnectionUp: () => console.log("Client reconnected!")
}
}).then(() => {
Object.defineProperty(Blazor.defaultReconnectionHandler, '_reconnectionDisplay', {
get() {
return this.__reconnectionDisplay;
},
set(value) {
this.__reconnectionDisplay = {
show: () => value.show(),
update: (d) => value.update(d),
rejected: (d) => document.location.reload()
}
}
});
Blazor.defaultReconnectionHandler._reconnectCallback = function (d) {
document.location.reload();
}
});
</script>
<script src="~/lib/Chart.js/chart.js"></script>
</body>
</html>
+2 -1
View File
@@ -9,4 +9,5 @@
@using EgwCoreLib.BlazorTest
@using EgwCoreLib.BlazorTest.Components
@using EgwCoreLib.BlazorTest.Shared
@using EgwCoreLib.Razor
@using EgwCoreLib.Razor
@using EgwCoreLib.Razor.Data
@@ -10,5 +10,9 @@
{
"outputFile": "Pages/ProvaCalendar.razor.css",
"inputFile": "Pages/ProvaCalendar.razor.less"
},
{
"outputFile": "Pages/TestGauges.razor.css",
"inputFile": "Pages/TestGauges.razor.less"
}
]
+3 -8
View File
@@ -11,14 +11,9 @@
"destination": "wwwroot/lib/font-awesome/"
},
{
"library": "Chart.js@4.3.0",
"destination": "wwwroot/lib/Chart.js/",
"files": [
"chart.min.js",
"helpers.min.js",
"helpers.js",
"chart.js"
]
"provider": "cdnjs",
"library": "Chart.js@4.4.1",
"destination": "wwwroot/lib/Chart.js/"
}
]
}
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large Load Diff
File diff suppressed because one or more lines are too long
@@ -1,5 +1,5 @@
/*!
* Chart.js v4.3.0
* Chart.js v4.4.1
* https://www.chartjs.org
* (c) 2023 Chart.js Contributors
* Released under the MIT License
@@ -2464,6 +2464,9 @@ class ScatterController extends DatasetController {
count = points.length;
}
if (this.options.showLine) {
if (!this.datasetElementType) {
this.addElements();
}
const { dataset: line , _dataset } = meta;
line._chart = this.chart;
line._datasetIndex = this.index;
@@ -2475,6 +2478,9 @@ class ScatterController extends DatasetController {
animated: !animationsDisabled,
options
}, mode);
} else if (this.datasetElementType) {
delete meta.dataset;
this.datasetElementType = false;
}
this.updateElements(points, start, count, mode);
}
@@ -4508,6 +4514,13 @@ class Scale extends Element {
case 'right':
left -= width;
break;
case 'inner':
if (i === ilen - 1) {
left -= width;
} else if (i > 0) {
left -= width / 2;
}
break;
}
backdrop = {
left,
@@ -5479,7 +5492,7 @@ function getResolver(resolverCache, scopes, prefixes) {
}
return cached;
}
const hasFunction = (value)=>isObject(value) && Object.getOwnPropertyNames(value).reduce((acc, key)=>acc || isFunction(value[key]), false);
const hasFunction = (value)=>isObject(value) && Object.getOwnPropertyNames(value).some((key)=>isFunction(value[key]));
function needContext(proxy, names) {
const { isScriptable , isIndexable } = _descriptors(proxy);
for (const prop of names){
@@ -5493,7 +5506,7 @@ function needContext(proxy, names) {
return false;
}
var version = "4.3.0";
var version = "4.4.1";
const KNOWN_POSITIONS = [
'top',
@@ -5563,16 +5576,20 @@ function moveNumericKeys(obj, start, move) {
}
return e;
}
function getDatasetArea(meta) {
function getSizeForArea(scale, chartArea, field) {
return scale.options.clip ? scale[field] : chartArea[field];
}
function getDatasetArea(meta, chartArea) {
const { xScale , yScale } = meta;
if (xScale && yScale) {
return {
left: xScale.left,
right: xScale.right,
top: yScale.top,
bottom: yScale.bottom
left: getSizeForArea(xScale, chartArea, 'left'),
right: getSizeForArea(xScale, chartArea, 'right'),
top: getSizeForArea(yScale, chartArea, 'top'),
bottom: getSizeForArea(yScale, chartArea, 'bottom')
};
}
return chartArea;
}
class Chart {
static defaults = defaults;
@@ -6074,7 +6091,7 @@ class Chart {
const ctx = this.ctx;
const clip = meta._clip;
const useClip = !clip.disabled;
const area = getDatasetArea(meta) || this.chartArea;
const area = getDatasetArea(meta, this.chartArea);
const args = {
meta,
index: meta.index,
@@ -8457,7 +8474,7 @@ class Legend extends Element {
cursor.x += width + padding;
} else if (typeof legendItem.text !== 'string') {
const fontLineHeight = labelFont.lineHeight;
cursor.y += calculateLegendItemHeight(legendItem, fontLineHeight);
cursor.y += calculateLegendItemHeight(legendItem, fontLineHeight) + padding;
} else {
cursor.y += lineHeight;
}
@@ -8571,7 +8588,7 @@ function calculateItemHeight(_itemHeight, legendItem, fontLineHeight) {
return itemHeight;
}
function calculateLegendItemHeight(legendItem, fontLineHeight) {
const labelHeight = legendItem.text ? legendItem.text.length + 0.5 : 0;
const labelHeight = legendItem.text ? legendItem.text.length : 0;
return fontLineHeight * labelHeight;
}
function isListened(type, opts) {
@@ -9699,7 +9716,7 @@ class Tooltip extends Element {
return [];
}
if (!inChartArea) {
return lastActive;
return lastActive.filter((i)=>this.chart.data.datasets[i.datasetIndex] && this.chart.getDatasetMeta(i.datasetIndex).controller.getParsed(i.index) !== undefined);
}
const active = this.chart.getElementsAtEventForMode(e, options.mode, options, replay);
if (options.reverse) {
@@ -10875,7 +10892,9 @@ class RadialLinearScale extends LinearScaleBase {
ctx.fillRect(-width / 2 - padding.left, -offset - tickFont.size / 2 - padding.top, width + padding.width, tickFont.size + padding.height);
}
renderText(ctx, tick.label, 0, -offset, tickFont, {
color: optsAtIndex.color
color: optsAtIndex.color,
strokeColor: optsAtIndex.textStrokeColor,
strokeWidth: optsAtIndex.textStrokeWidth
});
});
ctx.restore();
@@ -11195,7 +11214,7 @@ class TimeScale extends Scale {
if (time === max || options.bounds === 'ticks' || count === 1) {
addTick(ticks, time, timestamps);
}
return Object.keys(ticks).sort((a, b)=>a - b).map((x)=>+x);
return Object.keys(ticks).sort(sorter).map((x)=>+x);
}
getLabelForValue(value) {
const adapter = this._adapter;
@@ -11378,6 +11397,18 @@ class TimeSeriesScale extends TimeScale {
}
return table;
}
_generate() {
const min = this.min;
const max = this.max;
let timestamps = super.getDataTimestamps();
if (!timestamps.includes(min) || !timestamps.length) {
timestamps.splice(0, 0, min);
}
if (!timestamps.includes(max) || timestamps.length === 1) {
timestamps.push(max);
}
return timestamps.sort((a, b)=>a - b);
}
_getTimestampsForTable() {
let timestamps = this._cache.all || [];
if (timestamps.length) {
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
{"version":3,"file":"helpers.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,7 +0,0 @@
/*!
* Chart.js v3.7.0
* https://www.chartjs.org
* (c) 2021 Chart.js Contributors
* Released under the MIT License
*/
export { H as HALF_PI, aX as INFINITY, P as PI, aW as PITAU, aZ as QUARTER_PI, aY as RAD_PER_DEG, T as TAU, a_ as TWO_THIRDS_PI, Q as _addGrace, V as _alignPixel, a0 as _alignStartEnd, p as _angleBetween, a$ as _angleDiff, _ as _arrayUnique, a6 as _attachContext, aq as _bezierCurveTo, an as _bezierInterpolation, av as _boundSegment, al as _boundSegments, a3 as _capitalize, ak as _computeSegments, a7 as _createResolver, aH as _decimalPlaces, aP as _deprecated, a8 as _descriptors, af as _elementsEqual, M as _factorize, aJ as _filterBetween, F as _getParentNode, U as _int16Range, ah as _isBetween, ag as _isClickEvent, K as _isDomSupported, z as _isPointInArea, w as _limitValue, aI as _longestText, aK as _lookup, x as _lookupByKey, S as _measureText, aN as _merger, aO as _mergerIf, aw as _normalizeAngle, ao as _pointInLine, ai as _readValueToProps, A as _rlookupByKey, aD as _setMinAndMaxByKey, am as _steppedInterpolation, ap as _steppedLineTo, az as _textX, $ as _toLeftRightCenter, aj as _updateBezierControlPoints, as as addRoundedRectPath, aG as almostEquals, aF as almostWhole, O as callback, ad as clearCanvas, W as clipArea, aM as clone, c as color, h as createContext, ab as debounce, j as defined, aC as distanceBetweenPoints, ar as drawPoint, D as each, e as easingEffects, N as finiteOrDefault, aU as fontString, o as formatNumber, B as getAngleFromPoint, aL as getHoverColor, E as getMaximumSize, y as getRelativePosition, ax as getRtlAdapter, aT as getStyle, b as isArray, g as isFinite, a5 as isFunction, k as isNullOrUndef, q as isNumber, i as isObject, l as listenArrayEvents, L as log10, a2 as merge, a9 as mergeIf, aE as niceNum, aB as noop, ay as overrideTextDirection, G as readUsedSize, X as renderText, r as requestAnimFrame, a as resolve, f as resolveObjectKey, aA as restoreTextDirection, ac as retinaScale, ae as setsEqual, s as sign, aR as splineCurve, aS as splineCurveMonotone, J as supportsEventListenerOptions, I as throttled, R as toDegrees, n as toDimension, Z as toFont, aQ as toFontString, aV as toLineHeight, C as toPadding, m as toPercentage, t as toRadians, at as toTRBL, au as toTRBLCorners, aa as uid, Y as unclipArea, u as unlistenArrayEvents, v as valueOrDefault } from './chunks/helpers.segment.js';
@@ -1 +0,0 @@
export{H as HALF_PI,aX as INFINITY,P as PI,aW as PITAU,aZ as QUARTER_PI,aY as RAD_PER_DEG,T as TAU,a_ as TWO_THIRDS_PI,Q as _addGrace,V as _alignPixel,a0 as _alignStartEnd,p as _angleBetween,a$ as _angleDiff,_ as _arrayUnique,a6 as _attachContext,aq as _bezierCurveTo,an as _bezierInterpolation,av as _boundSegment,al as _boundSegments,a3 as _capitalize,ak as _computeSegments,a7 as _createResolver,aH as _decimalPlaces,aP as _deprecated,a8 as _descriptors,af as _elementsEqual,M as _factorize,aJ as _filterBetween,F as _getParentNode,U as _int16Range,ah as _isBetween,ag as _isClickEvent,K as _isDomSupported,z as _isPointInArea,w as _limitValue,aI as _longestText,aK as _lookup,x as _lookupByKey,S as _measureText,aN as _merger,aO as _mergerIf,aw as _normalizeAngle,ao as _pointInLine,ai as _readValueToProps,A as _rlookupByKey,aD as _setMinAndMaxByKey,am as _steppedInterpolation,ap as _steppedLineTo,az as _textX,$ as _toLeftRightCenter,aj as _updateBezierControlPoints,as as addRoundedRectPath,aG as almostEquals,aF as almostWhole,O as callback,ad as clearCanvas,W as clipArea,aM as clone,c as color,h as createContext,ab as debounce,j as defined,aC as distanceBetweenPoints,ar as drawPoint,D as each,e as easingEffects,N as finiteOrDefault,aU as fontString,o as formatNumber,B as getAngleFromPoint,aL as getHoverColor,E as getMaximumSize,y as getRelativePosition,ax as getRtlAdapter,aT as getStyle,b as isArray,g as isFinite,a5 as isFunction,k as isNullOrUndef,q as isNumber,i as isObject,l as listenArrayEvents,L as log10,a2 as merge,a9 as mergeIf,aE as niceNum,aB as noop,ay as overrideTextDirection,G as readUsedSize,X as renderText,r as requestAnimFrame,a as resolve,f as resolveObjectKey,aA as restoreTextDirection,ac as retinaScale,ae as setsEqual,s as sign,aR as splineCurve,aS as splineCurveMonotone,J as supportsEventListenerOptions,I as throttled,R as toDegrees,n as toDimension,Z as toFont,aQ as toFontString,aV as toLineHeight,C as toPadding,m as toPercentage,t as toRadians,at as toTRBL,au as toTRBLCorners,aa as uid,Y as unclipArea,u as unlistenArrayEvents,v as valueOrDefault}from"./chunks/helpers.segment.js";
@@ -1,5 +1,5 @@
/*!
* Chart.js v4.3.0
* Chart.js v4.4.1
* https://www.chartjs.org
* (c) 2023 Chart.js Contributors
* Released under the MIT License
@@ -0,0 +1 @@
{"version":3,"file":"helpers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
+12
View File
@@ -0,0 +1,12 @@
export * from './controllers/index.js';
export * from './core/index.js';
export * from './elements/index.js';
export * from './platform/index.js';
export * from './plugins/index.js';
export * from './scales/index.js';
import * as controllers from './controllers/index.js';
import * as elements from './elements/index.js';
import * as plugins from './plugins/index.js';
import * as scales from './scales/index.js';
export { controllers, elements, plugins, scales, };
export declare const registerables: (typeof controllers | typeof elements | typeof plugins | typeof scales)[];
@@ -0,0 +1,5 @@
/**
* @namespace Chart
*/
import Chart from './core/core.controller.js';
export default Chart;
+10
View File
@@ -0,0 +1,10 @@
/**
* Temporary entry point of the types at the time of the transition.
* After transition done need to remove it in favor of index.ts
*/
export * from './index.js';
/**
* Explicitly re-exporting to resolve the ambiguity.
*/
export { BarController, BubbleController, DoughnutController, LineController, PieController, PolarAreaController, RadarController, ScatterController, Animation, Animations, Chart, DatasetController, Interaction, Scale, Ticks, defaults, layouts, registry, ArcElement, BarElement, LineElement, PointElement, BasePlatform, BasicPlatform, DomPlatform, Decimation, Filler, Legend, SubTitle, Title, Tooltip, CategoryScale, LinearScale, LogarithmicScale, RadialLinearScale, TimeScale, TimeSeriesScale, PluginOptionsByType, ElementOptionsByType, ChartDatasetProperties, UpdateModeEnum, registerables } from './types/index.js';
export * from './types/index.js';
+1 -64
View File
@@ -1,65 +1,2 @@
@using Microsoft.JSInterop
@inject IJSRuntime JSRuntime

<canvas id="@Id"></canvas>
@code {
public enum ChartType
{
Pie,
Bar,
doughnut
}
[Parameter]
public string Id { get; set; } = "MyChart";
[Parameter]
public ChartType Type { get; set; }
[Parameter]
public string[]? Data { get; set; }
[Parameter]
public string[]? BackgroundColor { get; set; }
[Parameter]
public string[]? Labels { get; set; }
protected override async Task OnAfterRenderAsync(bool firstRender)
{
await InitDefault();
}
protected async Task InitDefault()
{
// Here we create an anonymous type with all the options
// that need to be sent to Chart.js
var config = new
{
type = Type.ToString().ToLower(),
options = new
{
responsive = true,
scales = new
{
yAxes = new
{
suggestedMin = 0
}
},
Animation = false
},
data = new
{
datasets = new[]
{
new { data = Data, backgroundColor = BackgroundColor}
},
labels = Labels
}
};
await JSRuntime.InvokeVoidAsync("setup", Id, config);
}
}
+87
View File
@@ -0,0 +1,87 @@
using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
using System.Drawing;
using EgwCoreLib.Razor.Data;
using System.Net.NetworkInformation;
namespace EgwCoreLib.Razor
{
public partial class Chart
{
[Inject]
protected IJSRuntime JSR { get; set; } = null!;
#region Public Enums
public enum ChartType
{
Pie,
Bar,
doughnut
}
#endregion Public Enums
#region Public Properties
[Parameter]
public string[]? BackgroundColor { get; set; }
[Parameter]
public string[]? Data { get; set; }
[Parameter]
public string Id { get; set; } = "MyChart";
[Parameter]
public string[]? Labels { get; set; }
[Parameter]
public ChartType Type { get; set; }
#endregion Public Properties
#region Protected Methods
protected async Task InitDefault()
{
// Here we create an anonymous type with all the options that need to be sent to Chart.js
var config = new
{
type = Type.ToString().ToLower(),
options = new
{
responsive = true,
scales = new
{
yAxes = new
{
suggestedMin = 0
}
},
Animation = false
},
data = new
{
datasets = new[]
{
new { data = Data, backgroundColor = BackgroundColor}
},
labels = Labels
}
};
module = await JSR.InvokeAsync<IJSObjectReference>("import", "./_content/EgwCoreLib.Razor/Chart.razor.js");
await JSR.InvokeVoidAsync("setup", Id, config);
}
private IJSObjectReference? module;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
await InitDefault();
}
#endregion Protected Methods
}
}
+14
View File
@@ -0,0 +1,14 @@
// carico jscript...
///Setup del chart desiderato con id univoco
window.setup = (id, config) => {
var ctx = document.getElementById(id);
if (window['stdChart' + id] instanceof Chart) {
window['stdChart' + id].destroy();
window['stdChart' + id] = new Chart(ctx, config);
}
else {
window['stdChart' + id] = new Chart(ctx, config);
}
}
@@ -1,12 +1,7 @@
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.WebUtilities;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace EgwCoreLib.Razor
namespace EgwCoreLib.Razor.Data
{
public static class NavigationManagerExtension
{
+5
View File
@@ -29,6 +29,7 @@
</ItemGroup>
<ItemGroup>
<None Remove="Chart.razor.js" />
<None Remove="ChartHist.razor.js" />
<None Remove="ChartTS - Copy.razor.js" />
<None Remove="ChartTS.razor.js" />
@@ -37,6 +38,10 @@
</ItemGroup>
<ItemGroup>
<Content Include="Chart.razor.js">
<ExcludeFromSingleFile>true</ExcludeFromSingleFile>
<CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
</Content>
<Content Include="ChartMultiLine.razor.js">
<ExcludeFromSingleFile>true</ExcludeFromSingleFile>
<CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>