fix(ButtonUpload): add ShowDeleteButton parameter (#7590)

* feat: add ShowDeleteButton paraemter

* feat(ButtonUpload): add ShowDeleteButton parameter

* test: 增加单元测试

Author: ArgoZhang

src/BootstrapBlazor/Components/Upload/ButtonUpload.razor

@@ -1,4 +1,4 @@
-@namespace BootstrapBlazor.Components
+@namespace BootstrapBlazor.Components
 @typeparam TValue
 @inherits FileListUploadBase<TValue>
 
@@ -17,7 +17,7 @@
                            OnGetFileFormat="@OnGetFileFormat" OnCancel="OnCancel" CancelIcon="@CancelIcon" LoadingIcon="@LoadingIcon"
                            InvalidStatusIcon="@InvalidStatusIcon" ValidStatusIcon="@ValidStatusIcon"
                            ShowDownloadButton="@ShowDownloadButton" DownloadIcon="@DownloadIcon" OnDownload="@OnDownload"
-                           DeleteIcon="@DeleteIcon" OnDelete="@OnFileDelete">
+                           ShowDeleteButton="@ShowDeleteButton" DeleteIcon="@DeleteIcon" OnDelete="@OnFileDelete">
         </UploadPreviewList>
     }
     <InputFile AdditionalAttributes="@GetUploadAdditionalAttributes()" OnChange="OnFileChange" />

src/BootstrapBlazor/Components/Upload/ButtonUpload.razor.cs

@@ -13,6 +13,13 @@ namespace BootstrapBlazor.Components;
 /// </summary>
 public partial class ButtonUpload<TValue>
 {
+    /// <summary>
+    /// <para lang="zh">获得/设置 是否显示删除按钮，默认 true</para>
+    /// <para lang="en">Gets or sets whether to display the delete button. Default is true</para>
+    /// </summary>
+    [Parameter]
+    public bool ShowDeleteButton { get; set; } = true;
+
     /// <summary>
     /// <para lang="zh">获得/设置 浏览按钮加载中图标</para>
     /// <para lang="en">Gets or sets the loading icon for the browse button</para>

src/BootstrapBlazor/Components/Upload/CardUpload.razor

@@ -73,7 +73,7 @@
                                               ConfirmIcon="@DeleteConfirmButtonIcon"
                                               ConfirmButtonColor="DeleteConfirmButtonColor"
                                               ConfirmButtonText="@DeleteConfirmButtonText"
-                                              CloseButtonText="@DeleteCloseButtonText" 
+                                              CloseButtonText="@DeleteCloseButtonText"
                                               Content="@DeleteConfirmContent"
                                               Icon="@RemoveIcon"
                                               IsAsync="true"

src/BootstrapBlazor/Components/Upload/CardUpload.razor.cs

@@ -52,6 +52,13 @@ public partial class CardUpload<TValue>
 
     private string PreviewerId => $"prev_{Id}";
 
+    /// <summary>
+    /// <para lang="zh">获得/设置 是否显示删除按钮，默认 false</para>
+    /// <para lang="en">Gets or sets whether to display the delete button. Default is false</para>
+    /// </summary>
+    [Parameter]
+    public bool ShowDeleteButton { get; set; }
+
     /// <summary>
     /// <para lang="zh">获得/设置 是否允许预览的回调方法，默认 null</para>
     /// <para lang="en">Gets or sets the callback method to determine whether preview is allowed. Default is null</para>

src/BootstrapBlazor/Components/Upload/DropUpload.razor

@@ -55,7 +55,7 @@
                            CancelIcon="@CancelIcon" LoadingIcon="@LoadingIcon"
                            InvalidStatusIcon="@InvalidStatusIcon" ValidStatusIcon="@ValidStatusIcon"
                            ShowDownloadButton="@ShowDownloadButton" DownloadIcon="@DownloadIcon" OnDownload="@OnDownload"
-                           DeleteIcon="@DeleteIcon" OnDelete="@OnFileDelete">
+                           ShowDeleteButton="@ShowDeleteButton" DeleteIcon="@DeleteIcon" OnDelete="@OnFileDelete">
         </UploadPreviewList>
     }
     <InputFile AdditionalAttributes="@GetUploadAdditionalAttributes()" OnChange="OnFileChange"/>

src/BootstrapBlazor/Components/Upload/DropUpload.razor.cs

@@ -13,6 +13,13 @@ namespace BootstrapBlazor.Components;
 /// </summary>
 public partial class DropUpload
 {
+    /// <summary>
+    /// <para lang="zh">获得/设置 是否显示删除按钮，默认 true</para>
+    /// <para lang="en">Gets or sets whether to display the delete button. Default is true</para>
+    /// </summary>
+    [Parameter]
+    public bool ShowDeleteButton { get; set; } = true;
+
     /// <summary>
     /// <para lang="zh">获得/设置 Body 模板，默认 null。设置 BodyTemplate 后 IconTemplate 和 TextTemplate 不生效</para>
     /// <para lang="en">Gets or sets the body template. Default is null. When BodyTemplate is set, IconTemplate and TextTemplate are not effective</para>

src/BootstrapBlazor/Components/Upload/FileListUploadBase.cs

@@ -12,13 +12,6 @@ namespace BootstrapBlazor.Components;
 /// <typeparam name="TValue"></typeparam>
 public class FileListUploadBase<TValue> : UploadBase<TValue>
 {
-    /// <summary>
-    /// <para lang="zh">获得/设置 是否显示删除按钮，默认 false</para>
-    /// <para lang="en">Gets or sets whether to display the delete button. Default is false</para>
-    /// </summary>
-    [Parameter]
-    public bool ShowDeleteButton { get; set; }
-
     /// <summary>
     /// <para lang="zh">获得/设置 删除按钮图标</para>
     /// <para lang="en">Gets or sets the delete button icon</para>

src/BootstrapBlazor/Components/Upload/UploadPreviewList.razor

@@ -1,4 +1,4 @@
-@namespace BootstrapBlazor.Components
+@namespace BootstrapBlazor.Components
 
 @if (Items != null)
 {
@@ -32,7 +32,10 @@
                         {
                             <i class="@InvalidStatusIconString"></i>
                         }
-                        <i class="@DeleteIconString" @onclick:stopPropagation @onclick="@(e => OnFileDelete(item))"></i>
+                        @if (ShowDeleteButton)
+                        {
+                            <i class="@DeleteIconString" @onclick:stopPropagation @onclick="@(e => OnFileDelete(item))"></i>
+                        }
                     </div>
                 }
             </div>

src/BootstrapBlazor/Components/Upload/UploadPreviewList.razor.cs

@@ -96,6 +96,13 @@ public partial class UploadPreviewList
     [Parameter]
     public bool ShowDownloadButton { get; set; }
 
+    /// <summary>
+    /// <para lang="zh">获得/设置 是否显示删除按钮，默认 false</para>
+    /// <para lang="en">Gets or sets whether to display the delete button. Default is false</para>
+    /// </summary>
+    [Parameter]
+    public bool ShowDeleteButton { get; set; }
+
     /// <summary>
     /// <para lang="zh">获得/设置 点击下载按钮回调方法，默认 null</para>
     /// <para lang="en">Gets or sets the callback method for the download button click event. Default is null</para>

test/UnitTest/Components/UploadButtonTest.cs

@@ -350,6 +350,21 @@ public void ButtonUpload_Accept_Ok()
         cut.Contains("accept=\".jpg\"");
     }
 
+    [Theory]
+    [InlineData(true, true)]
+    [InlineData(false, false)]
+    public void ShowDeleteButton_Ok(bool showDeleteButton, bool result)
+    {
+        var cut = Context.Render<ButtonUpload<string>>(pb =>
+        {
+            pb.Add(a => a.DefaultFileList, [new() { FileName = "1.csv" }]);
+            pb.Add(a => a.ShowUploadFileList, true);
+            pb.Add(a => a.ShowDeleteButton, showDeleteButton);
+        });
+        var exists = cut.Markup.Contains("delete-icon");
+        Assert.Equal(result, exists);
+    }
+
     [Fact]
     public void ButtonUpload_OnGetFileFormat_Ok()
     {