From f0d89e4874de1af960b05476b2da0bcae09f6c79 Mon Sep 17 00:00:00 2001 From: Lilian BRETON Date: Mon, 28 Nov 2022 09:52:38 +0100 Subject: [PATCH] beautifull alignment / trying the images --- .../Components/MyInventory.razor.css | 3 +- myBlazorApp/myBlazorApp/Pages/Inventory.razor | 69 +++++++++---------- .../myBlazorApp/Pages/Inventory.razor.cs | 25 +++++++ .../myBlazorApp/Pages/Inventory.razor.css | 18 ++--- .../myBlazorApp/Services/DataLocalService.cs | 58 ++++++++++++++-- 5 files changed, 119 insertions(+), 54 deletions(-) diff --git a/myBlazorApp/myBlazorApp/Components/MyInventory.razor.css b/myBlazorApp/myBlazorApp/Components/MyInventory.razor.css index 34491e9..2913fd8 100644 --- a/myBlazorApp/myBlazorApp/Components/MyInventory.razor.css +++ b/myBlazorApp/myBlazorApp/Components/MyInventory.razor.css @@ -1,6 +1,5 @@ .inventory-items { grid-template-columns: repeat(6,minmax(0,1fr)); - gap: 10px; + gap: 5px; display: grid; - width: 40%; } diff --git a/myBlazorApp/myBlazorApp/Pages/Inventory.razor b/myBlazorApp/myBlazorApp/Pages/Inventory.razor index 8a84ed5..829b2cf 100644 --- a/myBlazorApp/myBlazorApp/Pages/Inventory.razor +++ b/myBlazorApp/myBlazorApp/Pages/Inventory.razor @@ -4,53 +4,48 @@ @using myBlazorApp.Models; -
- -
- -
-
-

List of Items

- @*SearchBar*@ - - -

- CurrentCulture: @CultureInfo.CurrentCulture -

- +
+
+
-
+
-

- List of items -

- @*SearchBar*@ - +

List of Items

+ @*SearchBar*@ +
- - - - - - @if (File.Exists($"{WebHostEnvironment.WebRootPath}/images/{context.Name}.png")) +
+
+

+ List of items +

+ @*SearchBar*@ + +
+ + + + + + @if (!string.IsNullOrWhiteSpace(context.ImageBase64)) { - @context.DisplayName + @context.DisplayName } else { @context.DisplayName } - - - + + +
-
+
\ No newline at end of file diff --git a/myBlazorApp/myBlazorApp/Pages/Inventory.razor.cs b/myBlazorApp/myBlazorApp/Pages/Inventory.razor.cs index e9dae9e..39e3a98 100644 --- a/myBlazorApp/myBlazorApp/Pages/Inventory.razor.cs +++ b/myBlazorApp/myBlazorApp/Pages/Inventory.razor.cs @@ -4,6 +4,7 @@ using Blazored.Modal.Services; using Blazorise.DataGrid; using Microsoft.AspNetCore.Components; using Microsoft.Extensions.Localization; +using myBlazorApp.Factories; using myBlazorApp.Modals; using myBlazorApp.Models; using myBlazorApp.Services; @@ -13,6 +14,15 @@ namespace myBlazorApp.Pages public partial class Inventory { + [Parameter] + public int Id { get; set; } + + private ItemModel itemModel = new() + { + EnchantCategories = new List(), + RepairWith = new List() + }; + private List items = new List(); private int totalItem; @@ -61,6 +71,21 @@ namespace myBlazorApp.Pages // Reload the page NavigationManager.NavigateTo("list", true); } + + protected override async Task OnInitializedAsync() + { + var item = await DataService.GetById(Id); + + var fileContent = await File.ReadAllBytesAsync($"{WebHostEnvironment.WebRootPath}/images/default.png"); + + if (File.Exists($"{WebHostEnvironment.WebRootPath}/images/{itemModel.Name}.png")) + { + fileContent = await File.ReadAllBytesAsync($"{WebHostEnvironment.WebRootPath}/images/{item.Name}.png"); + } + + // Set the model with the item + itemModel = ItemFactory.ToModel(item, fileContent); + } } } diff --git a/myBlazorApp/myBlazorApp/Pages/Inventory.razor.css b/myBlazorApp/myBlazorApp/Pages/Inventory.razor.css index c3bcf2e..9411cb2 100644 --- a/myBlazorApp/myBlazorApp/Pages/Inventory.razor.css +++ b/myBlazorApp/myBlazorApp/Pages/Inventory.razor.css @@ -1,21 +1,17 @@ .body { display: flex; + width: 100%; } -.inventory-items { - grid-template-columns: repeat(6,minmax(0,1fr)); - gap: 10px; - display: grid; - width: 40%; -} - -.align-start { +.inventory { align-items: flex-start; - justify-content: start + justify-content: start; + width: 35%; + margin-right: 20%; } -.align-end { +.ItemList { align-content: flex-end; justify-content: end; - width: 400px; + width: 45%; } \ No newline at end of file diff --git a/myBlazorApp/myBlazorApp/Services/DataLocalService.cs b/myBlazorApp/myBlazorApp/Services/DataLocalService.cs index 835852a..5c0e36f 100644 --- a/myBlazorApp/myBlazorApp/Services/DataLocalService.cs +++ b/myBlazorApp/myBlazorApp/Services/DataLocalService.cs @@ -34,7 +34,23 @@ namespace myBlazorApp.Services model.Id = currentData.Max(s => s.Id) + 1; /// Add the item to the current data - currentData.Add(ItemFactory.Create(model)); + currentData.Add(ItemFactory.Create(model)); + + // Save the image + var imagePathInfo = new DirectoryInfo($"{_webHostEnvironment.WebRootPath}/images"); + + // Check if the folder "images" exist + if (!imagePathInfo.Exists) + { + imagePathInfo.Create(); + } + + // Determine the image name + var fileName = new FileInfo($"{imagePathInfo}/{model.Name}.png"); + + // Write the file content + await File.WriteAllBytesAsync(fileName.FullName, model.ImageContent); + // Save the data await _localStorage.SetItemAsync("data", currentData); @@ -89,7 +105,33 @@ namespace myBlazorApp.Services if (item == null) { throw new Exception($"Unable to found the item with ID: {id}"); - } + } + + // Save the image + var imagePathInfo = new DirectoryInfo($"{_webHostEnvironment.WebRootPath}/images"); + + // Check if the folder "images" exist + if (!imagePathInfo.Exists) + { + imagePathInfo.Create(); + } + + // Delete the previous image + if (item.Name != model.Name) + { + var oldFileName = new FileInfo($"{imagePathInfo}/{item.Name}.png"); + + if (oldFileName.Exists) + { + File.Delete(oldFileName.FullName); + } + } + + // Determine the image name + var fileName = new FileInfo($"{imagePathInfo}/{model.Name}.png"); + + // Write the file content + await File.WriteAllBytesAsync(fileName.FullName, model.ImageContent); // Modify the content of the item ItemFactory.Update(item, model); @@ -107,8 +149,16 @@ namespace myBlazorApp.Services var item = currentData.FirstOrDefault(w => w.Id == id); // Delete item in - currentData.Remove(item); - + currentData.Remove(item); + + // Delete the image + var imagePathInfo = new DirectoryInfo($"{_webHostEnvironment.WebRootPath}/images"); + var fileName = new FileInfo($"{imagePathInfo}/{item.Name}.png"); + + if (fileName.Exists) + { + File.Delete(fileName.FullName); + } // Save the data await _localStorage.SetItemAsync("data", currentData);