🚚 Set up basic inventory and route to it #1

Merged
alexis.drai merged 4 commits from feat/basic-inventory-and-route into main 2 years ago

@ -4,6 +4,9 @@ Microsoft Visual Studio Solution File, Format Version 12.00
VisualStudioVersion = 17.2.32616.157
MinimumVisualStudioVersion = 10.0.40219.1
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "blazor_lab", "blazor_lab\blazor_lab.csproj", "{7B8F9C82-6399-47FC-A996-8140F39484D6}"
ProjectSection(ProjectDependencies) = postProject
{F89D34E2-0DBC-4E98-BC77-E4CB00A33D19} = {F89D34E2-0DBC-4E98-BC77-E4CB00A33D19}
EndProjectSection
EndProject
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Minecraft.Crafting.Api", "Minecraft.Crafting.Api\Minecraft.Crafting.Api.csproj", "{F89D34E2-0DBC-4E98-BC77-E4CB00A33D19}"
EndProject

@ -0,0 +1,21 @@
<div class="inventory-grid">
@for (int row = 0; row < 3; row++)
{
<div class="inventory-row">
@for (int col = 0; col < 6; col++)
{
<div class="inventory-slot">
@if (Inventory != null && Inventory.Count > (row * 6 + col))
{
var slot = Inventory[row * 6 + col];
@if (slot.NumberItem > 0)
{
<img src="@($"data:image/png;base64,{GetItemImageBase64(@slot.ItemName)}")" alt="@slot.ItemName" />
<div class="slot-count">@slot.NumberItem</div>
}
}
</div>
}
</div>
}
</div>

@ -0,0 +1,38 @@
using Microsoft.AspNetCore.Components;
using Minecraft.Crafting.Api.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net.Http;
using System.Net.Http.Json;
using System.Threading.Tasks;
namespace blazor_lab.Components
{
public partial class InventoryGrid
{
[Parameter]
public List<InventoryModel> Inventory { get; set; }
public List<Item> Items { get; set; } = new List<Item>();
[Inject]
public HttpClient HttpClient { get; set; }
[Inject]
public IConfiguration Config { get; set; }
protected override async Task OnInitializedAsync()
{
Items = await HttpClient.GetFromJsonAsync<List<Item>>($"{Config["CraftingApi:BaseUrl"]}/api/Crafting/all");
}
public string GetItemImageBase64(string displayName)
{
var item = Items.FirstOrDefault(i => i.DisplayName == displayName);
return item?.ImageBase64;
}
}
}

@ -0,0 +1,25 @@
.inventory-grid {
display: flex;
flex-direction: column;
}
.inventory-row {
display: flex;
flex-direction: row;
}
.inventory-slot {
width: 64px;
height: 64px;
border: 1px solid;
margin: 5px;
display: flex;
flex-direction: column;
align-items: center;
overflow: hidden;
}
.item-count {
margin-top: 5px;
}

@ -0,0 +1,7 @@
@page "/inventory"
@using Minecraft.Crafting.Api.Models
@using blazor_lab.Components
<h1>Inventory</h1>
<InventoryGrid Inventory="Stuff" />

@ -0,0 +1,9 @@
using Minecraft.Crafting.Api.Models;
namespace blazor_lab.Pages
{
public partial class Inventory
{
private List<InventoryModel> Stuff = Enumerable.Range(1, 18).Select(_ => new InventoryModel()).ToList();
}
}

@ -14,7 +14,11 @@
<span class="oi oi-list-rich" aria-hidden="true"/> List
</NavLink>
</div>
<div class="nav-item px-3">
<NavLink class="nav-link" href="inventory" Match="NavLinkMatch.All">
<span class="oi fa fa-shopping-bag" aria-hidden="true"></span> Inventory
</NavLink>
</div>
<div class="nav-item px-3">
<NavLink class="nav-link" href="" Match="NavLinkMatch.All">
<span class="oi oi-home" aria-hidden="true"></span> Home

@ -8,6 +8,8 @@
@using Microsoft.JSInterop
@using blazor_lab
@using blazor_lab.Shared
@using blazor_lab.Pages
@using Blazorise.DataGrid
@using Blazored.Modal
@using Blazored.Modal.Services
@using Blazorise.Icons.FontAwesome

@ -5,5 +5,9 @@
"Microsoft.AspNetCore": "Warning"
}
},
"AllowedHosts": "*"
"AllowedHosts": "*",
"CraftingApi": {
"BaseUrl": "https://localhost:7234"
}
}

@ -18,4 +18,8 @@
<Folder Include="wwwroot\_content\" />
</ItemGroup>
<ItemGroup>
<ProjectReference Include="..\Minecraft.Crafting.Api\Minecraft.Crafting.Api.csproj" />
</ItemGroup>
</Project>

Loading…
Cancel
Save