Fix image file input

RestoreMonarchy · Jun 5, 2022 · ddb1c00 · ddb1c00
1 parent e7bc4ad
commit ddb1c00
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 60 deletions.
diff --git a/src/database/UnturnedStrikeDatabaseProvider/Repositories/Sql/WeaponSkinsRepository.cs b/src/database/UnturnedStrikeDatabaseProvider/Repositories/Sql/WeaponSkinsRepository.cs
@@ -71,7 +71,7 @@ public async Task<IEnumerable<PlayerWeaponSkin>> GetPlayerWeaponSkinsAsync(strin
         public async Task<WeaponSkin> GetWeaponSkinAsync(int weaponSkinId)
         {
             const string sql = "SELECT ws.*, w.* FROM dbo.WeaponSkins ws JOIN dbo.Weapons w ON w.Id = ws.WeaponId " +
-                "WHERE ws.Id = weaponSkinId;";
+                "WHERE ws.Id = @weaponSkinId;";
             return (await connection.QueryAsync<WeaponSkin, Weapon, WeaponSkin>(sql, (ws, w) => 
             {
                 ws.Weapon = w;

diff --git a/src/web/UnturnedStrikeWebBlazor/Shared/Components/InputFile.razor b/src/web/UnturnedStrikeWebBlazor/Shared/Components/InputFile.razor
diff --git a/src/web/UnturnedStrikeWebBlazor/Shared/Components/InputImageFile.razor b/src/web/UnturnedStrikeWebBlazor/Shared/Components/InputImageFile.razor
@@ -0,0 +1,4 @@
+<div class="">
+    <InputFile OnChange="HandleChange" accept="@Accept" />
+    <label>Choose file</label>
+</div>
diff --git a/src/web/UnturnedStrikeWebBlazor/Shared/Components/InputImageFile.razor.cs b/src/web/UnturnedStrikeWebBlazor/Shared/Components/InputImageFile.razor.cs
@@ -0,0 +1,46 @@
+using Microsoft.AspNetCore.Components.Forms;
+using Microsoft.AspNetCore.Components;
+using System.IO;
+using System.Net.Http;
+using System.Threading.Tasks;
+using System;
+using System.Net.Http.Headers;
+
+namespace UnturnedStrikeWebBlazor.Shared.Components
+{
+    public partial class InputImageFile
+    {
+        [Parameter]
+        public int? FileId { get; set; }
+        [Parameter]
+        public EventCallback<int?> FileIdChanged { get; set; }
+
+        [Parameter]
+        public string Accept { get; set; }
+
+        [Inject]
+        private HttpClient HttpClient { get; set; }
+
+        private async Task HandleChange(InputFileChangeEventArgs args)
+        {
+            IBrowserFile file = args.File;
+            file = await file.RequestImageFileAsync("image/png", 800, 800);
+
+            HttpRequestMessage msg = new(HttpMethod.Post, $"api/files")
+            {
+                Content = new MultipartFormDataContent()
+            };
+
+            var content = new StreamContent(file.OpenReadStream(30 * 1024 * 1024));
+            content.Headers.ContentType = MediaTypeHeaderValue.Parse(file.ContentType);
+            (msg.Content as MultipartFormDataContent).Add(content, "file", file.Name);
+            var response = await HttpClient.SendAsync(msg);
+
+            if (response.IsSuccessStatusCode)
+            {
+                FileId = Convert.ToInt32(await response.Content.ReadAsStringAsync());
+                await FileIdChanged.InvokeAsync(FileId);
+            }
+        }
+    }
+}
diff --git a/src/web/UnturnedStrikeWebBlazor/Shared/Components/Modals/WeaponModal.razor b/src/web/UnturnedStrikeWebBlazor/Shared/Components/Modals/WeaponModal.razor
@@ -23,11 +23,11 @@
                     </div>
                     <div class="form-group">
                         <label>Image</label>
-                        @*<InputFile @bind-FileId="ModelWeapon.ImageFileId" Accept="image/jpeg,image/png" />
+                        <InputImageFile @bind-FileId="ModelWeapon.ImageFileId" Accept=".png" />
                         @if (ModelWeapon.ImageFileId != default)
                         {
                             <img src="api/files/@ModelWeapon.ImageFileId" style="max-height: 128px;" />
-                        }*@
+                        }
                     </div>
                     <div class="form-group">
                         <label>Category</label>

diff --git a/src/web/UnturnedStrikeWebBlazor/Shared/Components/Modals/WeaponSkinModal.razor b/src/web/UnturnedStrikeWebBlazor/Shared/Components/Modals/WeaponSkinModal.razor
@@ -35,11 +35,11 @@
                     </div>
                     <div class="form-group">
                         <label>Image</label>
-                        @*<InputFile @bind-FileId="ModelWeaponSkin.ImageFileId" Accept="image/jpeg,image/png" />
+                        <InputImageFile @bind-FileId="ModelWeaponSkin.ImageFileId" Accept=".png" />
                         @if (ModelWeaponSkin.ImageFileId != default)
                         {
                             <img src="api/files/@ModelWeaponSkin.ImageFileId" style="max-height: 128px;" />
-                        }*@
+                        }
                     </div>
                     <div class="form-group">
                         <label>Rarity</label>