Merge pull request #154 from pulcher/add_quickgrid

Add quickgrid
pulcher · Dec 18, 2023 · 94d6a9e · 94d6a9e
2 parents 8ab1ad9 + 1a996d8
commit 94d6a9e
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 31 deletions.
diff --git a/MrBigHead.Web/MrBigHead.Web.csproj b/MrBigHead.Web/MrBigHead.Web.csproj
@@ -1,16 +1,18 @@
 <Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
 
   <PropertyGroup>
-    <TargetFramework>net7.0</TargetFramework>
+    <TargetFramework>net8.0</TargetFramework>
     <UserSecretsId>d7ece554-3987-4f6c-8100-f5b918a12cb1</UserSecretsId>
+    <UseRazorSourceGenerator>false</UseRazorSourceGenerator>
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="7.0.5" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="7.0.5" PrivateAssets="all" />
-    <PackageReference Include="Microsoft.Authentication.WebAssembly.Msal" Version="7.0.5" />
-    <PackageReference Include="Microsoft.Extensions.Configuration.UserSecrets" Version="7.0.0" />
-    <PackageReference Include="System.Net.Http.Json" Version="7.0.1" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.QuickGrid" Version="8.0.0" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.0" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="8.0.0" PrivateAssets="all" />
+    <PackageReference Include="Microsoft.Authentication.WebAssembly.Msal" Version="8.0.0" />
+    <PackageReference Include="Microsoft.Extensions.Configuration.UserSecrets" Version="8.0.0" />
+    <PackageReference Include="System.Net.Http.Json" Version="8.0.0" />
   </ItemGroup>
 
 </Project>
diff --git a/MrBigHead.Web/Pages/Quips.razor b/MrBigHead.Web/Pages/Quips.razor
@@ -1,4 +1,5 @@
 @page "/quips"
+@using Microsoft.AspNetCore.Components.QuickGrid
 @inject HttpClient Http
 
 <h1>Phrases</h1>
@@ -11,37 +12,29 @@
 }
 else
 {
-    <table class="table">
-        <thead>
-            <tr>
-                <th>Mood</th>
-                <th>Phrase</th>
-                <th>Actions</th>
-            </tr>
-        </thead>
-        <tbody>
-            @foreach (var quip in sayings)
-            {
-            <tr>
-                <td>@quip.Mood</td>
-                <td>@quip.Phrase</td>
-                <td>
-                    <span class="oi oi-icon-name" title="iconic-pencil-sm" aria-hidden="false"></span>
-                    <span class="oi oi-icon-name" title="iconic-trash-sm" aria-hidden="false"></span>
-                    <span class="iconic" data-glyph="trash" title="trash" aria-hidden="false"></span>
-                </td>
-            </tr>
-            }
-        </tbody>
-    </table>
+    <QuickGrid Items="@sayings.AsQueryable()" Pagination="@pagination">
+        <PropertyColumn Property="@(m => m.Mood)" Sortable="true" />
+        <PropertyColumn Property="@(p => p.Phrase)" Sortable="true" />
+        @if (isAdmin)
+        {
+        <TemplateColumn Title="Actions">
+            <button>Edit</button>
+            <button>Delete</button>
+        </TemplateColumn>
+        }
+    </QuickGrid>
+
+    <Paginator State="@pagination" />
 }
 
 @code {
-    private Sayings[] sayings;
+    private IEnumerable<Sayings> sayings;
+    PaginationState pagination = new PaginationState { ItemsPerPage = 20 };
+    bool isAdmin { get; set; } = true;
 
     protected override async Task OnInitializedAsync()
     {
-        sayings = await Http.GetFromJsonAsync<Sayings[]>("https://bigheadfuncs.azurewebsites.net/api/getallphrases");
+        sayings = await Http.GetFromJsonAsync<IEnumerable<Sayings>>("https://bigheadfuncs.azurewebsites.net/api/getallphrases");
     }
 
     public class Sayings