From 4025a7a4b22b191479ae96b731666203d28f75fc Mon Sep 17 00:00:00 2001 From: Mohammad Hossein Rastegarinia Date: Fri, 13 Sep 2024 11:24:14 +0330 Subject: [PATCH] fix(blazorui): resolve issues of BitFileUpload demo page #8602 (#8603) --- .../Inputs/FileUpload/BitFileUploadDemo.razor | 11 +-- .../FileUpload/BitFileUploadDemo.razor.cs | 68 +++++++++++-------- 2 files changed, 41 insertions(+), 38 deletions(-) diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor index 0994dc760a..9e1d775ffa 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor @@ -11,7 +11,7 @@ ComponentSubClasses="componentSubClasses" ComponentSubEnums="componentSubEnums"> - +
Files can be uploaded automatically after selecting them.
@@ -80,7 +80,7 @@
- +
Use custom template for file upload.
@@ -174,7 +174,6 @@
- @if (file.Status is BitFileUploadStatus.InProgress or BitFileUploadStatus.Pending) { var fileUploadPercent = GetFileUploadPercent(file); @@ -202,9 +201,7 @@ } -
- Upload
@@ -219,9 +216,7 @@ UploadUrl="@NonChunkedUploadUrl" RemoveUrl="@RemoveUrl" MaxSize="1024 * 1024 * 500" /> -
- Browse file diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor.cs index e01936488e..e323b50fda 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor.cs +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor.cs @@ -207,6 +207,7 @@ public partial class BitFileUploadDemo Description = "URL of the server endpoint receiving the files." } ]; + private readonly List componentSubClasses = [ new() @@ -286,6 +287,7 @@ public partial class BitFileUploadDemo } } ]; + private readonly List componentSubEnums = [ new() @@ -355,10 +357,14 @@ public partial class BitFileUploadDemo + [Inject] private IJSRuntime _js { get; set; } = default!; + [Inject] private IConfiguration _configuration { get; set; } = default!; + private string onAllUploadsCompleteText = "No File"; private string ChunkedUploadUrl => $"{_configuration.GetApiServerAddress()}FileUpload/UploadChunkedFile"; private string NonChunkedUploadUrl => $"{_configuration.GetApiServerAddress()}FileUpload/UploadNonChunkedFile"; private string RemoveUrl => $"{_configuration.GetApiServerAddress()}FileUpload/RemoveFile"; + private BitFileUpload bitFileUpload = default!; private BitFileUpload bitFileUploadWithBrowseFile = default!; @@ -409,14 +415,13 @@ private static string GetFileUploadSize(BitFileInfo file) return $"{uploadSize}KB / {totalSize}KB"; } - private string GetUploadMessageStr(BitFileInfo file) - => file.Status switch - { - BitFileUploadStatus.Completed => bitFileUpload.SuccessfulUploadMessage, - BitFileUploadStatus.Failed => bitFileUpload.FailedUploadMessage, - BitFileUploadStatus.NotAllowed => IsFileTypeNotAllowed(file) ? bitFileUpload.NotAllowedExtensionErrorMessage : bitFileUpload.MaxSizeErrorMessage, - _ => string.Empty, - }; + private string GetUploadMessageStr(BitFileInfo file) => file.Status switch + { + BitFileUploadStatus.Completed => bitFileUpload.SuccessfulUploadMessage, + BitFileUploadStatus.Failed => bitFileUpload.FailedUploadMessage, + BitFileUploadStatus.NotAllowed => IsFileTypeNotAllowed(file) ? bitFileUpload.NotAllowedExtensionErrorMessage : bitFileUpload.MaxSizeErrorMessage, + _ => string.Empty, + }; private bool IsFileTypeNotAllowed(BitFileInfo file) { @@ -432,8 +437,6 @@ private async Task HandleBrowseFileOnClick() await bitFileUploadWithBrowseFile.Browse(); } - [Inject] private IJSRuntime _js { get; set; } = default!; - [Inject] private IConfiguration _configuration { get; set; } = default!; private readonly string example1RazorCode = @" @@ -636,17 +639,17 @@ private async Task HandleBrowseFileOnClick() font-size: 12px; color: #78787D; } - + { "".jpeg"", "".jpg"", "".png"", "".bpm"" })"" - SuccessfulUploadMessage=""File upload succeeded"" - NotAllowedExtensionErrorMessage=""File type not supported""> + Label="""" + UploadUrl=""@NonChunkedUploadUrl"" + RemoveUrl=""@RemoveUrl"" + MaxSize=""1024 * 1024 * 2"" + AllowedExtensions=""@(new List { "".jpeg"", "".jpg"", "".png"", "".bpm"" })"" + SuccessfulUploadMessage=""File upload succeeded"" + NotAllowedExtensionErrorMessage=""File type not supported""> @if (FileUploadIsEmpty()) { @@ -690,7 +693,6 @@ Browse file - @if (file.Status is BitFileUploadStatus.InProgress or BitFileUploadStatus.Pending) { var fileUploadPercent = GetFileUploadPercent(file); @@ -719,28 +721,30 @@ Browse file -
- Upload"; private readonly string example9CsharpCode = @" [Inject] public IJSRuntime JSRuntime { get; set; } = default!; + private string NonChunkedUploadUrl => ""FileUpload/UploadNonChunkedFile""; private string RemoveUrl => $""FileUpload/RemoveFile""; private BitFileUpload bitFileUpload; private bool FileUploadIsEmpty() => !bitFileUpload.Files?.Any(f => f.Status != BitFileUploadStatus.Removed) ?? true; + private async Task HandleUploadOnClick() { if (bitFileUpload.Files is null) return; await bitFileUpload.Upload(); } + private async Task HandleRemoveOnClick() { if (bitFileUpload.Files is null) return; await bitFileUpload.RemoveFile(); } + private static int GetFileUploadPercent(BitFileInfo file) { int uploadedPercent; @@ -755,6 +759,7 @@ private static int GetFileUploadPercent(BitFileInfo file) return uploadedPercent; } + private static string GetFileUploadSize(BitFileInfo file) { long totalSize = file.Size / 1024; @@ -770,14 +775,15 @@ private static string GetFileUploadSize(BitFileInfo file) return $""{uploadSize}KB / {totalSize}KB""; } -private string GetUploadMessageStr(BitFileInfo file) - => file.Status switch - { - BitFileUploadStatus.Completed => bitFileUpload.SuccessfulUploadMessage, - BitFileUploadStatus.Failed => bitFileUpload.FailedUploadMessage, - BitFileUploadStatus.NotAllowed => IsFileTypeNotAllowed(file) ? bitFileUpload.NotAllowedExtensionErrorMessage : bitFileUpload.MaxSizeErrorMessage, - _ => string.Empty, - }; + +private string GetUploadMessageStr(BitFileInfo file) => file.Status switch +{ + BitFileUploadStatus.Completed => bitFileUpload.SuccessfulUploadMessage, + BitFileUploadStatus.Failed => bitFileUpload.FailedUploadMessage, + BitFileUploadStatus.NotAllowed => IsFileTypeNotAllowed(file) ? bitFileUpload.NotAllowedExtensionErrorMessage : bitFileUpload.MaxSizeErrorMessage, + _ => string.Empty, +}; + private bool IsFileTypeNotAllowed(BitFileInfo file) { if (bitFileUpload.Accept is not null) return false; @@ -792,7 +798,9 @@ private bool IsFileTypeNotAllowed(BitFileInfo file) Label="""" UploadUrl=""@NonChunkedUploadUrl"" RemoveUrl=""@RemoveUrl"" - MaxSize=""1024 * 1024 * 500"" />"; + MaxSize=""1024 * 1024 * 500"" /> + +Browse file"; private readonly string example10CsharpCode = @" private string NonChunkedUploadUrl = ""/Upload""; private string RemoveUrl => ""/RemoveFile"";