@page "/invetaire"
@using System.Globalization
@using ValblazeProject.Components
@using ValblazeProject.Models

<main class="contentInvent">
    <div class="inventaire">
        <h3>Inventaire</h3>
        <div class="caseInvent">
            @for(int i=0; i<10; i++){
                <CraftingItem Index="i"/>
            }
        </div>
    </div>

    <div class="maList">

        <InputText @bind-Value="SearchText"/>

        <DataGrid TItem="Item"
                  Data="@items"
                  ReadData="@OnReadData"
                  TotalItems="@totalItem"
                  PageSize="5"
                  ShowPager
                  Responsive>
            <DataGridColumn TItem="Item" Field="@nameof(Item.Id)" Caption="">
                <DisplayTemplate>
                    @if (!string.IsNullOrWhiteSpace(context.ImageBase64))
                    {
                        <img src="data:image/png;base64, @(context.ImageBase64)" class="img-thumbnail" title="@context.DisplayName" alt="@context.DisplayName" style="min-width: 50px; max-width: 50px" />
                    }
                    else
                    {
                        <img src="images/default.png" class="img-thumbnail" title="@context.DisplayName" alt="@context.DisplayName" style="max-width: 50px" />
                    }
                </DisplayTemplate>
            </DataGridColumn>
            <DataGridColumn TItem="Item" Field="@nameof(Item.DisplayName)" Caption="" />
        </DataGrid>
    </div>
</main>