From 0176d13e3d643c29a7a2557043c24718367ebeba Mon Sep 17 00:00:00 2001
From: Kevin MONDEJAR <kemondejar>
Date: Wed, 8 Jan 2025 11:58:34 +0100
Subject: [PATCH] datagrid

---
 .../WF-WebAdmin/Pages/ModifQuote.razor        | 49 ++++----------
 .../WF-WebAdmin/Pages/ModifQuote.razor.cs     |  2 +
 WF-WebAdmin/WF-WebAdmin/Pages/_Layout.cshtml  |  5 ++
 WF-WebAdmin/WF-WebAdmin/Program.cs            |  8 +++
 WF-WebAdmin/WF-WebAdmin/WF-WebAdmin.csproj    |  7 ++
 WF-WebAdmin/WF-WebAdmin/_Imports.razor        |  1 +
 .../wwwroot/fake-dataModifQuote.json          | 66 +++++++++++++++++++
 7 files changed, 103 insertions(+), 35 deletions(-)

diff --git a/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor b/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor
index 85dbd8b..d562f7a 100644
--- a/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor
+++ b/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor
@@ -1,4 +1,5 @@
-@page "/modifquote"
+@using WF_WebAdmin.Model
+@page "/modifquote"
 
 <PageTitle>Corection des citation</PageTitle>
 
@@ -8,38 +9,16 @@
 
 @if (quotes != null)
 {
-    <table class="table">
-        <thead>
-            <tr>
-                <th>Image</th>
-                <th>Id</th>
-                <th>Contenu</th>
-                <th>Personage</th>
-                <th>Titre Source</th>
-                <th>Likes</th>
-                <th>Langue</th>
-                <th>Date Source</th>
-            </tr>
-        </thead>
-        <tbody>
-            @foreach (var quote in quotes)
-            {
-                <tr>
-                    <td><img class="imgTab" src="@quote.ImgPath" /></td>
-                    <td>@quote.Id</td>
-                    <td>
-                        <label>
-                            <input @bind="quote.Content" />
-                        </label>
-                    </td>
-                    <td>@quote.Charac</td>
-                    <td>@quote.TitleSrc</td>
-                    <td>@quote.Like</td>
-                    <td>@quote.Langue</td>
-                    <td>@quote.DateSrc.ToShortDateString()</td>
-                </tr>
-            }
-        </tbody>
-        <button>Sauvegarder</button>
-    </table>
+    <DataGrid TItem="Quote"
+          Data="@quotes"
+          PageSize="int.MaxValue"
+          Responsive>
+
+        <DataGridColumn TItem="Quote" Field="@nameof(Quote.Id)" Caption="Id"/>
+        <DataGridColumn TItem="Quote" Field="@nameof(Quote.Content)" Caption="Citation"/>
+        <DataGridColumn TItem="Quote" Field="@nameof(Quote.Charac)" Caption="Personage"/>
+        <DataGridColumn TItem="Quote" Field="@nameof(Quote.TitleSrc)" Caption="Source" />
+        <DataGridColumn TItem="Quote" Field="@nameof(Quote.Langue)" Caption="Langue" />
+        <DataGridColumn TItem="Quote" Field="@nameof(Quote.DateSrc)" Caption="Date" DisplayFormat="{0:d}" DisplayFormatProvider="@System.Globalization.CultureInfo.GetCultureInfo("fr-FR")" />
+    </DataGrid>
 }
\ No newline at end of file
diff --git a/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor.cs b/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor.cs
index 4abe969..6bb7933 100644
--- a/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor.cs
+++ b/WF-WebAdmin/WF-WebAdmin/Pages/ModifQuote.razor.cs
@@ -7,6 +7,8 @@ namespace WF_WebAdmin.Pages
     {
         private Quote[] quotes;
 
+        private int MaxValue = 5;
+
         [Inject]
         public HttpClient Http { get; set; }
 
diff --git a/WF-WebAdmin/WF-WebAdmin/Pages/_Layout.cshtml b/WF-WebAdmin/WF-WebAdmin/Pages/_Layout.cshtml
index dd71165..bc00141 100644
--- a/WF-WebAdmin/WF-WebAdmin/Pages/_Layout.cshtml
+++ b/WF-WebAdmin/WF-WebAdmin/Pages/_Layout.cshtml
@@ -28,5 +28,10 @@
     </div>
 
     <script src="_framework/blazor.server.js"></script>
+
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css">
+
+    <link href="_content/Blazorise/blazorise.css" rel="stylesheet" />
+    <link href="_content/Blazorise.Bootstrap/blazorise.bootstrap.css" rel="stylesheet" />
 </body>
 </html>
diff --git a/WF-WebAdmin/WF-WebAdmin/Program.cs b/WF-WebAdmin/WF-WebAdmin/Program.cs
index cdcdbeb..fa0d376 100644
--- a/WF-WebAdmin/WF-WebAdmin/Program.cs
+++ b/WF-WebAdmin/WF-WebAdmin/Program.cs
@@ -1,3 +1,6 @@
+using Blazorise;
+using Blazorise.Bootstrap;
+using Blazorise.Icons.FontAwesome;
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
 using WF_WebAdmin.Data;
@@ -11,6 +14,11 @@ builder.Services.AddSingleton<WeatherForecastService>();
 
 builder.Services.AddHttpClient();
 
+builder.Services
+   .AddBlazorise()
+   .AddBootstrapProviders()
+   .AddFontAwesomeIcons();
+
 var app = builder.Build();
 
 // Configure the HTTP request pipeline.
diff --git a/WF-WebAdmin/WF-WebAdmin/WF-WebAdmin.csproj b/WF-WebAdmin/WF-WebAdmin/WF-WebAdmin.csproj
index 9c94761..48f59a7 100644
--- a/WF-WebAdmin/WF-WebAdmin/WF-WebAdmin.csproj
+++ b/WF-WebAdmin/WF-WebAdmin/WF-WebAdmin.csproj
@@ -7,4 +7,11 @@
     <RootNamespace>WF_WebAdmin</RootNamespace>
   </PropertyGroup>
 
+  <ItemGroup>
+    <PackageReference Include="Blazorise.Bootstrap" Version="1.7.2" />
+    <PackageReference Include="Blazorise.DataGrid" Version="1.7.2" />
+    <PackageReference Include="Blazorise.Icons.FontAwesome" Version="1.7.2" />
+    <PackageReference Include="bootstrap" Version="5.3.3" />
+  </ItemGroup>
+
 </Project>
diff --git a/WF-WebAdmin/WF-WebAdmin/_Imports.razor b/WF-WebAdmin/WF-WebAdmin/_Imports.razor
index 5f99f58..f261bea 100644
--- a/WF-WebAdmin/WF-WebAdmin/_Imports.razor
+++ b/WF-WebAdmin/WF-WebAdmin/_Imports.razor
@@ -8,3 +8,4 @@
 @using Microsoft.JSInterop
 @using WF_WebAdmin
 @using WF_WebAdmin.Shared
+@using Blazorise.DataGrid
diff --git a/WF-WebAdmin/WF-WebAdmin/wwwroot/fake-dataModifQuote.json b/WF-WebAdmin/WF-WebAdmin/wwwroot/fake-dataModifQuote.json
index 61477e9..20f7d2a 100644
--- a/WF-WebAdmin/WF-WebAdmin/wwwroot/fake-dataModifQuote.json
+++ b/WF-WebAdmin/WF-WebAdmin/wwwroot/fake-dataModifQuote.json
@@ -1,4 +1,70 @@
 [
+  {
+    "Id": 1,
+    "ImgPath": "https://tse2.mm.bing.net/th/id/OIP.MMpXBB5RDRYQm05FJmevGAHaKl?w=137&h=195&c=7&r=0&o=5&pid=1.7",
+    "Content": "Harry POTTER JE SUIS TON PERE",
+    "Charac": "Sirius Black",
+    "TitleSrc": "Harry Potter",
+    "Langue": "fr",
+    "UserProposition": "demo",
+    "DateSrc": "2001-01-01",
+    "Like": 20
+  },
+  {
+    "Id": 2,
+    "ImgPath": "https://tse2.mm.bing.net/th/id/OIP.zR4rzkK7q2wCcNwZd6jjegHaIC?w=163&h=180&c=7&r=0&o=5&pid=1.7",
+    "Content": "'Une autre citation'",
+    "Charac": "Un personnage",
+    "TitleSrc": "Un super film",
+    "Langue": "fr",
+    "DateSrc": "2002-02-02",
+    "Like": 0,
+    "UserProposition": "exploit"
+  },
+  {
+    "Id": 1,
+    "ImgPath": "https://tse2.mm.bing.net/th/id/OIP.MMpXBB5RDRYQm05FJmevGAHaKl?w=137&h=195&c=7&r=0&o=5&pid=1.7",
+    "Content": "Harry POTTER JE SUIS TON PERE",
+    "Charac": "Sirius Black",
+    "TitleSrc": "Harry Potter",
+    "Langue": "fr",
+    "UserProposition": "demo",
+    "DateSrc": "2001-01-01",
+    "Like": 20
+  },
+  {
+    "Id": 2,
+    "ImgPath": "https://tse2.mm.bing.net/th/id/OIP.zR4rzkK7q2wCcNwZd6jjegHaIC?w=163&h=180&c=7&r=0&o=5&pid=1.7",
+    "Content": "'Une autre citation'",
+    "Charac": "Un personnage",
+    "TitleSrc": "Un super film",
+    "Langue": "fr",
+    "DateSrc": "2002-02-02",
+    "Like": 0,
+    "UserProposition": "exploit"
+  },
+  {
+    "Id": 1,
+    "ImgPath": "https://tse2.mm.bing.net/th/id/OIP.MMpXBB5RDRYQm05FJmevGAHaKl?w=137&h=195&c=7&r=0&o=5&pid=1.7",
+    "Content": "Harry POTTER JE SUIS TON PERE",
+    "Charac": "Sirius Black",
+    "TitleSrc": "Harry Potter",
+    "Langue": "fr",
+    "UserProposition": "demo",
+    "DateSrc": "2001-01-01",
+    "Like": 20
+  },
+  {
+    "Id": 2,
+    "ImgPath": "https://tse2.mm.bing.net/th/id/OIP.zR4rzkK7q2wCcNwZd6jjegHaIC?w=163&h=180&c=7&r=0&o=5&pid=1.7",
+    "Content": "'Une autre citation'",
+    "Charac": "Un personnage",
+    "TitleSrc": "Un super film",
+    "Langue": "fr",
+    "DateSrc": "2002-02-02",
+    "Like": 0,
+    "UserProposition": "exploit"
+  },
   {
     "Id": 1,
     "ImgPath": "https://tse2.mm.bing.net/th/id/OIP.MMpXBB5RDRYQm05FJmevGAHaKl?w=137&h=195&c=7&r=0&o=5&pid=1.7",