gros ajout par rapport aux images et à la pages edit, il a encore des bugs a regler

Project/adminBlazor/adminBlazor/Factories/UserFactory.cs

@@ -9,7 +9,7 @@ namespace adminBlazor.Factories
 {
     public static class UserFactory
     {
-        public static UserModel ToModel(User user/* byte[] imageContent*/)
+        public static UserModel ToModel(User user, byte[] imageContent)
         {
             return new UserModel
             {
@@ -18,11 +18,12 @@ namespace adminBlazor.Factories
                 Surname = user.Surname,
                 Nickname = user.Nickname,
                 ExtraTime = user.ExtraTime,
-                Image = user.Image,
+                //Image = imageContent,
                 Group = user.Group,
                 Password = user.Password,
                 Email = user.Email,
-                Roles = user.Roles
+                Roles = user.Roles,
+                ImageBase64 = string.IsNullOrWhiteSpace(user.ImageBase64) ? Convert.ToBase64String(imageContent) : user.ImageBase64
             };
         }
 
@@ -35,11 +36,12 @@ namespace adminBlazor.Factories
                 Surname = user.Surname,
                 Nickname = user.Nickname,
                 ExtraTime = user.ExtraTime,
-                Image = user.Image,
+                //Image = user.Image,
                 Group = user.Group,
                 Password = user.Password,
                 Email = user.Email,
-                Roles = user.Roles
+                Roles = user.Roles,
+                ImageBase64 = Convert.ToBase64String(user.Image)
             };
         }
         public static void Update(User item, UserModel user)
@@ -57,8 +59,6 @@ namespace adminBlazor.Factories
 
                 item.ExtraTime = user.ExtraTime;
 
-            if (!string.IsNullOrEmpty(user.Image))
-                item.Image = user.Image;
 
             if (user.Group != 0)
                 item.Group = user.Group;
@@ -69,6 +69,9 @@ namespace adminBlazor.Factories
             if (!string.IsNullOrEmpty(user.Email))
                 item.Email = user.Email;
 
+            if (user.ImageBase64 != null && user.Image != null)
+            item.ImageBase64 = Convert.ToBase64String(user.Image);
+
             if (user.Roles != null)
             {
 

Project/adminBlazor/adminBlazor/Models/User.cs

@@ -10,9 +10,9 @@ namespace adminBlazor.Models
         public string Name { get; set; }
         public string Surname { get; set; }
         public string Nickname { get; set; }
-        public string Image { get; set; }
         public bool ExtraTime { get; set; }
         public int Group { get; set; }
         public List<String> Roles { get; set; }
+        public string? ImageBase64 { get; set; }
     }
 }

Project/adminBlazor/adminBlazor/Models/UserModel.cs

@@ -25,8 +25,8 @@ namespace adminBlazor.Models
         [StringLength(50, ErrorMessage = "Name length can't be more than 50.")]
         public string Nickname { get; set; }
 
-        [StringLength(50, ErrorMessage = "Name length can't be more than 50.")]
+
-        public string Image {  get; set; }
+        public byte[] Image { get; set; }
 
         public bool ExtraTime { get; set; }
 
@@ -34,6 +34,7 @@ namespace adminBlazor.Models
         public int Group {  get; set; }
 
         public List<String> Roles { get; set; }
+        public string ImageBase64 { get; set; }
 
     }
 }

Project/adminBlazor/adminBlazor/Pages/Add.razor

@@ -75,7 +75,7 @@
     <p>
         <label>
             Image
-            <InputText @bind-Value="user.Image" />
+            <InputFile OnChange="@LoadImage" accept=".png, .jpeg" />
         </label>
     </p>
     <p>

Project/adminBlazor/adminBlazor/Pages/Add.razor.cs

@@ -41,7 +41,7 @@ namespace adminBlazor.Pages
 
             NavigationManager.NavigateTo("list");
         }
-        /*
+        
         private async Task LoadImage(InputFileChangeEventArgs e)
         {
             // Set the content of the image to the model
@@ -51,7 +51,7 @@ namespace adminBlazor.Pages
                 user.Image = memoryStream.ToArray();
             }
         }
-        */
+        
         private bool isStudentChecked = false;
         private bool disableOtherCheckboxes = false;
 

Project/adminBlazor/adminBlazor/Pages/EditUser.razor

@@ -71,7 +71,13 @@
     <p>
         <label>
             Image
-            <InputText @bind-Value="user.Image" />
+            <InputFile OnChange="@LoadImage" accept=".png, .jpeg" />
+        </label>
+    </p>
+    <p>
+    <label>
+        Current Item image:
+        <img src="data:image/png;base64, @(user.ImageBase64)" class="img-thumbnail" style="min-width: 50px; max-width: 150px"/>
     </label>
 </p>
     <p>

Project/adminBlazor/adminBlazor/Pages/EditUser.razor.cs

@@ -3,6 +3,7 @@ using adminBlazor.Models;
 using adminBlazor.Services;
 using Blazored.LocalStorage;
 using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Forms;
 using Microsoft.AspNetCore.Hosting;
 
 
@@ -23,7 +24,6 @@ namespace adminBlazor.Pages
         [Inject]
         public IWebHostEnvironment WebHostEnvironment { get; set; }
 
-        public User currUser;
 
 
         /// <summary>
@@ -31,20 +31,20 @@ namespace adminBlazor.Pages
         /// </summary>
         private List<string> roles = new List<string>() { "admin", "teacher", "student" };
 
-
+        private UserModel user = new UserModel()
-        /// <summary>
-        /// The current item model
-        /// </summary>
-        private Models.User user = new Models.User()
         {
             Roles = new List<string>()
         };
+        /// <summary>
+        /// The current item model
+        /// </summary>
+  
 
         private async void HandleValidSubmit()
         {
-            UserModel item = UserFactory.ToModel(user);
             
-            await DataService.Update(Id, item);
+
+            await DataService.Update(Id, user);
 
 
             NavigationManager.NavigateTo("list");
@@ -54,31 +54,15 @@ namespace adminBlazor.Pages
         protected override async Task OnInitializedAsync()
         {
             var item = await DataService.GetById(Id);
-            // currentUser = item;
-            //    var fileContent = await File.ReadAllBytesAsync($"{WebHostEnvironment.WebRootPath}/images/default.png");
 
-            if (File.Exists($"{WebHostEnvironment.WebRootPath}/images/{user.Name}.png"))
+               var fileContent = await File.ReadAllBytesAsync($"{WebHostEnvironment.WebRootPath}/images/default.png");
-            {
-                //        fileContent = await File.ReadAllBytesAsync($"{WebHostEnvironment.WebRootPath}/images/{item.Name}.png");
-            }
 
             // Set the model with the item
-            user = new User
+
-            {
+            user = UserFactory.ToModel(item,fileContent);
-                Id = user.Id,
-                Name = user.Name,
-                Surname = user.Surname,
-                Nickname = user.Nickname,
-                ExtraTime = user.ExtraTime,
-                Image = user.Image,
-                Group = user.Group,
-                Password = user.Password,
-                Email = user.Email,
-                Roles = user.Roles
-            };
         }
 
-        /*
+        
         private async Task LoadImage(InputFileChangeEventArgs e)
         {
             // Set the content of the image to the model
@@ -88,7 +72,7 @@ namespace adminBlazor.Pages
                 user.Image = memoryStream.ToArray();
             }
         }
-        */
+        
         private bool isStudentChecked = false;
         private bool disableOtherCheckboxes = false;
 

Project/adminBlazor/adminBlazor/Pages/List.razor

@@ -15,25 +15,36 @@
     </NavLink>
 </div>
 
-<DataGrid TItem="UserModel"
+<DataGrid TItem="User"
           Data="@_users"
           ReadData="@OnReadData"
           TotalItems="@totalUser"
           PageSize="10"
           ShowPager
           Responsive>
-        <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Id)" Caption="id" />
+        <DataGridColumn TItem="User" Field="@nameof(User.Id)" Caption="Image">
+        <DisplayTemplate>
+            @if (!string.IsNullOrWhiteSpace(context.ImageBase64))
+            {
+                <img src="@($"data:image/png;base64, {context.ImageBase64}")" class="img-thumbnail" style="min-width: 50px; max-width: 150px" />
+            }
+            else
+            {
+                <img src="images/default.png" class="img-thumbnail" style="max-width: 150px" />
+            }
+        </DisplayTemplate>
+    </DataGridColumn>
        <!-- <DataGridColumn TItem="User" Field="@nameof(User.Password)" Caption="Password" /> -->
-    <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Name)" Caption="Name" />
+    <DataGridColumn TItem="User" Field="@nameof(User.Name)" Caption="Name" />
-        <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Email)" Caption="Email" />
+        <DataGridColumn TItem="User" Field="@nameof(User.Email)" Caption="Email" />
-        <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Surname)" Caption="Surname" />
+        <DataGridColumn TItem="User" Field="@nameof(User.Surname)" Caption="Surname" />
-        <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Nickname)" Caption="Nickname" />
+        <DataGridColumn TItem="User" Field="@nameof(User.Nickname)" Caption="Nickname" />
         <!--<DataGridColumn TItem="User" Field="@nameof(User.Image)" Caption="Image" /> -->
-        <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.ExtraTime)" Caption="Extra Time" />
+        <DataGridColumn TItem="User" Field="@nameof(User.ExtraTime)" Caption="Extra Time" />
-        <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Group)" Caption="Group" />
+        <DataGridColumn TItem="User" Field="@nameof(User.Group)" Caption="Group" />
-    <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Roles)" Caption="Roles">
+    <DataGridColumn TItem="User" Field="@nameof(User.Roles)" Caption="Roles">
         <DisplayTemplate>
-            @if (context is UserModel user)
+            @if (context is User user)
             {
                 @if (user.Roles != null && user.Roles.Any())
                 {
@@ -46,7 +57,7 @@
             }
         </DisplayTemplate>
     </DataGridColumn>
-    <DataGridColumn TItem="UserModel" Field="@nameof(UserModel.Id)" Caption="Modifier">
+    <DataGridColumn TItem="User" Field="@nameof(User.Id)" Caption="Modifier">
         <DisplayTemplate>
             <a href="EditUser/@(context.Id)" class="btn btn-primary"><i class="fa fa-edit"></i> Editer</a>
             <button type="button" class="btn btn-primary" @onclick="() => OnDelete(context.Id)"><i class="fa fa-trash"></i> Supprimer</button>

Project/adminBlazor/adminBlazor/Pages/List.razor.cs

@@ -14,7 +14,7 @@ namespace adminBlazor.Pages
 {
     public partial class List
     {
-        private List<UserModel> _users;
+        private List<User> _users;
 
         private int totalUser;
 
@@ -42,18 +42,18 @@ namespace adminBlazor.Pages
                 return;
             }
 
-            var currentData = await LocalStorage.GetItemAsync<UserModel[]>("data");
+            var currentData = await LocalStorage.GetItemAsync<User[]>("data");
 
             // Check if data exist in the local storage
             if (currentData == null)
             {
                 // this code add in the local storage the fake data (we load the data sync for initialize the data before load the OnReadData method)
-                var originalData = Http.GetFromJsonAsync<UserModel[]>($"{NavigationManager.BaseUri}user.json").Result;
+                var originalData = Http.GetFromJsonAsync<User[]>($"{NavigationManager.BaseUri}user.json").Result;
                 await LocalStorage.SetItemAsync("data", originalData);
             }
         }
 
-        private async Task OnReadData(DataGridReadDataEventArgs<UserModel> e)
+        private async Task OnReadData(DataGridReadDataEventArgs<User> e)
         {
             if (e.CancellationToken.IsCancellationRequested)
             {
@@ -62,12 +62,12 @@ namespace adminBlazor.Pages
 
             // When you use a real API, we use this follow code
             //var response = await Http.GetJsonAsync<Data[]>( $"http://my-api/api/data?page={e.Page}&pageSize={e.PageSize}" );
-            var response = (await LocalStorage.GetItemAsync<UserModel[]>("data")).Skip((e.Page - 1) * e.PageSize).Take(e.PageSize).ToList();
+            var response = (await LocalStorage.GetItemAsync<User[]>("data")).Skip((e.Page - 1) * e.PageSize).Take(e.PageSize).ToList();
 
             if (!e.CancellationToken.IsCancellationRequested)
             {
-                totalUser = (await LocalStorage.GetItemAsync<List<UserModel>>("data")).Count;
+                totalUser = (await LocalStorage.GetItemAsync<List<User>>("data")).Count;
-                _users = new List<UserModel>(response); // an actual data for the current page
+                _users = new List<User>(response); // an actual data for the current page
             }
         }
 

Project/adminBlazor/adminBlazor/Services/DataLocalService.cs

@@ -41,19 +41,7 @@ namespace adminBlazor.Services
             currentData.Add(UserFactory.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);
@@ -69,7 +57,6 @@ namespace adminBlazor.Services
         public async Task<User> GetById(int id)
         {
 
-            //var currentData = await LocalStorage.GetItemAsync<User[]>("user.json");
             var currentData = await _localStorage.GetItemAsync<List<User>>("data");
 
             var user = currentData.FirstOrDefault(w => w.Id == id);
@@ -90,7 +77,7 @@ namespace adminBlazor.Services
         public async Task Update(int id, UserModel model)
         {
             // Get the current data
-            var currentData = await _localStorage.GetItemAsync<User[]>("data");
+            var currentData = await _localStorage.GetItemAsync<List<User>>("data");
 
             var user = currentData.FirstOrDefault(w => w.Id == id);
 
@@ -101,30 +88,7 @@ namespace adminBlazor.Services
 
             // 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 (user.Name != model.Name)
-            {
-         //       var oldFileName = new FileInfo($"{imagePathInfo}/{user.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.Image);
             UserFactory.Update(user, model);
 
             // Modify the content of the item
@@ -146,13 +110,7 @@ namespace adminBlazor.Services
             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);

Project/adminBlazor/adminBlazor/wwwroot/user.json

@@ -6,10 +6,10 @@
     "name": "John",
     "surname": "Doe",
     "nickname": "JD",
-    "image": "user1.jpg",
+    "image": null,
     "extraTime": true,
     "group": 1,
-    "roles": [ "Admin", "Student" ]
+    "roles": [ "Admin", "Teacher" ]
   },
   {
     "id": 2,
@@ -18,7 +18,7 @@
     "name": "Alice",
     "surname": "Smith",
     "nickname": "AS",
-    "image": "user2.jpg",
+    "image": null,
     "extraTime": false,
     "group": 2,
     "roles": [ "Student" ]
@@ -30,7 +30,7 @@
     "name": "Bob",
     "surname": "Johnson",
     "nickname": "BJ",
-    "image": "user3.jpg",
+    "image": null,
     "extraTime": true,
     "group": 3,
     "roles": [ "Teacher" ]