From 6e1bea2e5f0c8d8b9c3838d9a719a514d052ccc6 Mon Sep 17 00:00:00 2001 From: Alexis DRAI Date: Sat, 25 Feb 2023 17:10:00 +0100 Subject: [PATCH] :sparkles: Implement InventoryList --- blazor_lab/Components/InventoryList.razor | 35 +++++ blazor_lab/Components/InventoryList.razor.cs | 71 ++++++++++ blazor_lab/Components/InventoryList.razor.css | 35 +++++ .../Components.InventoryList.fr-FR.resx | 129 ++++++++++++++++++ .../Resources/Components.InventoryList.resx | 129 ++++++++++++++++++ .../Resources/Pages.Inventory.fr-FR.resx | 126 +++++++++++++++++ blazor_lab/Resources/Pages.Inventory.resx | 126 +++++++++++++++++ blazor_lab/blazor_lab.csproj | 9 ++ 8 files changed, 660 insertions(+) create mode 100644 blazor_lab/Components/InventoryList.razor create mode 100644 blazor_lab/Components/InventoryList.razor.cs create mode 100644 blazor_lab/Components/InventoryList.razor.css create mode 100644 blazor_lab/Resources/Components.InventoryList.fr-FR.resx create mode 100644 blazor_lab/Resources/Components.InventoryList.resx create mode 100644 blazor_lab/Resources/Pages.Inventory.fr-FR.resx create mode 100644 blazor_lab/Resources/Pages.Inventory.resx diff --git a/blazor_lab/Components/InventoryList.razor b/blazor_lab/Components/InventoryList.razor new file mode 100644 index 0000000..a437545 --- /dev/null +++ b/blazor_lab/Components/InventoryList.razor @@ -0,0 +1,35 @@ +
+
+ +
+ +
+ @foreach (var item in VisibleItems) + { +
+ @item.DisplayName +
@item.DisplayName
+
+ } +
+ +
+ @for (var i = 1; i <= TotalPages; i++) + { + var pageNumber = i; // copy the loop variable to avoid closure issues + + } +
+
+ @if (VisibleItems.Any()) + { + var firstItem = (currentPage - 1) * pageSize + 1; + var lastItem = Math.Min(currentPage * pageSize, TotalItems); + @firstItem - @lastItem @Localizer["out_of"] @TotalItems + } + else + { + @Localizer["no_items_found"] + } +
+
\ No newline at end of file diff --git a/blazor_lab/Components/InventoryList.razor.cs b/blazor_lab/Components/InventoryList.razor.cs new file mode 100644 index 0000000..adb79ed --- /dev/null +++ b/blazor_lab/Components/InventoryList.razor.cs @@ -0,0 +1,71 @@ +using blazor_lab.Models; +using Microsoft.AspNetCore.Components; +using Microsoft.Extensions.Localization; + +namespace blazor_lab.Components +{ + public partial class InventoryList + { + [Inject] + public IStringLocalizer Localizer { get; set; } + + [Parameter] + public List Items { get; set; } + + private List _filteredItems; + + private string searchQuery = ""; + + private int currentPage = 1; + private int pageSize = 10; + + private void UpdateFilteredItems() + { + _filteredItems = string.IsNullOrEmpty(searchQuery) ? Items : Items.Where(i => i.DisplayName.ToLower().Contains(searchQuery.ToLower())).ToList(); + VisibleItems = _filteredItems.Skip((currentPage - 1) * pageSize).Take(pageSize).ToList(); + } + + private List _visibleItems; + + private List VisibleItems + { + get => _visibleItems; + set + { + _visibleItems = value; + StateHasChanged(); + } + } + + private int TotalPages => (int)Math.Ceiling((double)_filteredItems.Count / pageSize); + + private int TotalItems => _filteredItems.Count; + + private void GoToPage(int page) + { + currentPage = page; + UpdateFilteredItems(); + } + + protected override void OnParametersSet() + { + UpdateFilteredItems(); + } + + private async Task OnInputChange(ChangeEventArgs e) + { + searchQuery = e.Value.ToString(); + await Task.Delay(250); // debounce the search to avoid excessive API requests + UpdateFilteredItems(); + } + + protected override void OnAfterRender(bool firstRender) + { + if (firstRender) + { + UpdateFilteredItems(); + } + } + } + +} diff --git a/blazor_lab/Components/InventoryList.razor.css b/blazor_lab/Components/InventoryList.razor.css new file mode 100644 index 0000000..6756e33 --- /dev/null +++ b/blazor_lab/Components/InventoryList.razor.css @@ -0,0 +1,35 @@ +.inventory-list { + margin-top: 20px; +} + +.search-container { + margin-bottom: 20px; +} + +.inventory-list-item { + margin-bottom: 10px; + padding: 10px; + border: 1px solid #ddd; + border-radius: 5px; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); +} + + .inventory-list-item img { + max-width: 64px; + max-height: 64px; + margin-right: 10px; + } + +.item-name { + font-weight: bold; +} + +.side-by-side { + display: flex; + flex-direction: row; +} + +button[disabled] { + opacity: 0.5; + cursor: default; +} \ No newline at end of file diff --git a/blazor_lab/Resources/Components.InventoryList.fr-FR.resx b/blazor_lab/Resources/Components.InventoryList.fr-FR.resx new file mode 100644 index 0000000..51dfb55 --- /dev/null +++ b/blazor_lab/Resources/Components.InventoryList.fr-FR.resx @@ -0,0 +1,129 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + text/microsoft-resx + + + 2.0 + + + System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + Pas d'objet trouvé + + + de + + + Rechercher + + \ No newline at end of file diff --git a/blazor_lab/Resources/Components.InventoryList.resx b/blazor_lab/Resources/Components.InventoryList.resx new file mode 100644 index 0000000..517c3a8 --- /dev/null +++ b/blazor_lab/Resources/Components.InventoryList.resx @@ -0,0 +1,129 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + text/microsoft-resx + + + 2.0 + + + System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + No items found + + + out of + + + Search + + \ No newline at end of file diff --git a/blazor_lab/Resources/Pages.Inventory.fr-FR.resx b/blazor_lab/Resources/Pages.Inventory.fr-FR.resx new file mode 100644 index 0000000..3aee12a --- /dev/null +++ b/blazor_lab/Resources/Pages.Inventory.fr-FR.resx @@ -0,0 +1,126 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + text/microsoft-resx + + + 2.0 + + + System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + Liste des objets + + + Mon inventaire + + \ No newline at end of file diff --git a/blazor_lab/Resources/Pages.Inventory.resx b/blazor_lab/Resources/Pages.Inventory.resx new file mode 100644 index 0000000..d509ad6 --- /dev/null +++ b/blazor_lab/Resources/Pages.Inventory.resx @@ -0,0 +1,126 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + text/microsoft-resx + + + 2.0 + + + System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + List of items + + + My inventory + + \ No newline at end of file diff --git a/blazor_lab/blazor_lab.csproj b/blazor_lab/blazor_lab.csproj index b9ae0e1..2e58a00 100644 --- a/blazor_lab/blazor_lab.csproj +++ b/blazor_lab/blazor_lab.csproj @@ -22,4 +22,13 @@ + + + Designer + + + Designer + + +