Update datapager

This commit is contained in:
Samuele Locatelli
2024-09-12 08:26:59 +02:00
parent 593ecf9e7a
commit bfb6f1e21d
4 changed files with 112 additions and 65 deletions
@@ -5,14 +5,14 @@
<PageTitle>Test</PageTitle>
<div class="card">
<div class="card shadow">
<div class="card-header">
<h1>Test Componenti custom</h1>
</div>
<div class="card-body py-1">
<div class="card-body py-4">
<div class="row">
<div class="col-3">
<div class="card">
<div class="card shadow">
<div class="card-header">
Test Image
</div>
@@ -22,7 +22,7 @@
</div>
</div>
<div class="col-3">
<div class="card">
<div class="card shadow">
<div class="card-header">
Input password
</div>
@@ -45,7 +45,7 @@
</div>
</div>
<div class="col-3">
<div class="card">
<div class="card shadow">
<div class="card-header">
Input Speciali
</div>
@@ -65,7 +65,7 @@
</div>
</div>
<div class="col-3">
<div class="card">
<div class="card shadow">
<div class="card-header">
QueryString
</div>
@@ -128,6 +128,24 @@
</div>
</div>
</div>
<div class="col-3">
<div class="card ">
<div class="card-header"><h4>Test toggler</h4></div>
<div class="card-body">
<Toggler SelFilter="@TogFilter"></Toggler>
<br/>
<NumInput Value="@numero"></NumInput>
</div>
</div>
</div>
<div class="col-3">
<h4>Max 4 pages</h4>
<DataPager currPage="1" totalCount="@numero" NumPages="4" DisplSize="DataPager.ObjSize.small"></DataPager>
</div>
<div class="col-6">
<h4>Std 10 pages</h4>
<DataPager currPage="1" totalCount="@numero"></DataPager>
</div>
</div>
</div>
</div>
@@ -136,11 +154,15 @@
@code {
Toggler.SelectGlobalToggle TogFilter { get; set; } = new Toggler.SelectGlobalToggle();
protected string textToCopy = $"{Guid.NewGuid()}";
protected decimal valDecimale = 12345;
private string qsNome = "";
private int qsIntero = -1;
private int numero = 0;
protected Random rnd = new Random();
protected override void OnInitialized()
{
@@ -148,6 +170,16 @@
qsNome = NavMan.ExtractQueryStringByKey<string>("Nome");
qsIntero = NavMan.ExtractQueryStringByKey<int>("Intero");
NavMan.LocationChanged += LocationChanged;
// toggler!
TogFilter = new()
{
isActive = true,
leftString = "opzione sx",
rightString = "opzione dx"
};
//test input
numero = rnd.Next(100, 300);
}
async void LocationChanged(object sender, LocationChangedEventArgs e)
{
@@ -3,7 +3,7 @@
<PageTitle>Test</PageTitle>
<div class="card shadow ">
<div class="card-header"><h4>Test Componenti Arrow SVG</h4></div>
<div class="card-header"><h4>Test Grapth Compo: Arrow SVG</h4></div>
<div class="card-body">
<div class="row bg-secondary py-2">
<div class="col">
@@ -21,36 +21,13 @@
</div>
</div>
</div>
<div class="card shadow ">
<div class="card-header"><h4>Test Componenti Vari</h4></div>
<div class="card-body">
<div class="row">
<div class="col-3">
<Toggler SelFilter="@TogFilter"></Toggler>
</div>
</div>
</div>
</div>
<div class="card shadow ">
<div class="card-header"><h4>Test Input</h4></div>
<div class="card-body">
<div class="row">
<div class="col-3">
<NumInput Value="@numero"></NumInput>
</div>
</div>
</div>
</div>
@code {
Toggler.SelectGlobalToggle TogFilter { get; set; } = new Toggler.SelectGlobalToggle();
private int currentCount = 0;
protected Random rnd = new Random();
private int numero = 0;
protected override void OnInitialized()
{
base.OnInitialized();
@@ -69,20 +46,8 @@
listBord03.Add("White");
listBord03.Add("");
listBord03.Add("Blue");
// toggler!
TogFilter = new()
{
isActive = true,
leftString = "opzione sx",
rightString = "opzione dx"
};
//test input
numero = rnd.Next(0, 100);
}
protected List<string> listBord01 { get; set; } = new();
protected List<string> listBord02 { get; set; } = new();
protected List<string> listBord03 { get; set; } = new();
+7 -7
View File
@@ -1,7 +1,7 @@
<div class="row">
<div class="col-12 col-lg-8 text-start">
<div class="d-flex align-content-center @cssSize">
<div class="px-0">
<div class="row">
<div class="col-12 small">
<div class="col-12 @cssSize">
@if (totalCount > 0)
{
<ul class="pagination pagination-sm mb-1">
@@ -19,7 +19,7 @@
</div>
</div>
<div class="row">
<div class="col-12 small">
<div class="col-12 @cssSize">
@if (showLoading)
{
<div class="progress" style="height: 10px;">
@@ -29,12 +29,12 @@
</div>
</div>
</div>
<div class="col-12 col-lg-4">
<div class="px-0">
<div class="d-flex">
<div class="p-1 flex-fill text-end">
@if (!showLoading)
{
<span>@totalCount records</span>
<span class="text-nowrap">@totalCount rec</span>
}
@if (exportEnabled && totalCount > 0)
{
@@ -48,7 +48,7 @@
}
}
</div>
<div class="p-1 flex-fill text-end small">
<div class="p-1 flex-fill text-end @cssSize">
@if (totalCount > 0)
{
<div class="input-group input-group-sm">
+66 -16
View File
@@ -4,6 +4,17 @@ namespace EgwCoreLib.Razor
{
public partial class DataPager : ComponentBase
{
#region Public Enums
public enum ObjSize
{
small,
standard,
large
}
#endregion Public Enums
#region Public Properties
/// <summary>
@@ -27,6 +38,12 @@ namespace EgwCoreLib.Razor
}
}
/// <summary>
/// Dimensione controlli x resize
/// </summary>
[Parameter]
public ObjSize DisplSize { get; set; } = ObjSize.standard;
/// <summary>
/// Export (csv) abilitato
/// </summary>
@@ -38,21 +55,31 @@ namespace EgwCoreLib.Razor
/// </summary>
[Parameter]
public EventCallback<int> exportRequested { get; set; }
/// <summary>
/// Filename x export
/// </summary>
[Parameter]
public string fileName { get; set; } = "";
/// <summary>
/// Evento cambio pagina nel paginatore
/// </summary>
[Parameter]
public EventCallback<int> numPageChanged { get; set; }
/// <summary>
/// Massimo numero di pagine da mostrare (x display piccoli)
/// </summary>
[Parameter]
public int NumPages { get; set; } = 10;
/// <summary>
/// PageSize = Num record da mostrare cambiato
/// </summary>
[Parameter]
public EventCallback<int> numRecordChanged { get; set; }
/// <summary>
/// Attuale PageSize
/// </summary>
@@ -74,6 +101,15 @@ namespace EgwCoreLib.Razor
}
}
/// <summary>
/// Elenco dei PageSize ammessi
/// </summary>
[Parameter]
public List<int> PageSizeList { get; set; } = new List<int>()
{
5,10,25,50,100
};
/// <summary>
/// Fase di loading
/// </summary>
@@ -98,21 +134,13 @@ namespace EgwCoreLib.Razor
_showLoading = value;
}
}
/// <summary>
/// Totale record da mostrare
/// </summary>
[Parameter]
public int totalCount { get; set; } = 0;
/// <summary>
/// Elenco dei PageSize ammessi
/// </summary>
[Parameter]
public List<int> PageSizeList { get; set; } = new List<int>()
{
5,10,25,50,100
};
#endregion Public Properties
#region Public Methods
@@ -152,6 +180,28 @@ namespace EgwCoreLib.Razor
get => $"{exportDir}\\{fileName}";
}
private string cssSize
{
get
{
string answ = "";
switch (DisplSize)
{
case ObjSize.small:
answ = "small";
break;
case ObjSize.standard:
break;
case ObjSize.large:
answ = "large";
break;
default:
break;
}
return answ;
}
}
protected int percLoading { get; set; } = 0;
#endregion Protected Properties
@@ -186,7 +236,7 @@ namespace EgwCoreLib.Razor
{
get
{
int answ = (int)(currPage / numPages) * numPages + numPages;
int answ = (int)(currPage / NumPages) * NumPages + NumPages;
answ = answ < LastPage ? answ : LastPage;
return answ;
}
@@ -204,30 +254,30 @@ namespace EgwCoreLib.Razor
{
get
{
int answ = currPage + numPages;
int answ = currPage + NumPages;
answ = answ < LastPage ? answ : LastPage;
return answ;
}
}
private int numPages { get; set; } = 10;
private int prevBlock
{
get
{
int answ = currPage - numPages;
int answ = currPage - NumPages;
answ = answ > 0 ? answ : 1;
return answ;
}
}
// calcola un set 1 .. numPages centrato sulla pagina corrente...
/// <summary>
/// calcola un set 1 .. NumPages centrato sulla pagina corrente...
/// </summary>
private int startPage
{
get
{
int answ = (int)(currPage / numPages) * numPages;
int answ = (int)(currPage / NumPages) * NumPages;
answ = answ > 0 ? answ : 1;
return answ;
}