feat(Dialog): add IsHidePreviousDialog parameter (#5866)

* refactor: 增加 IsKeepPreviousDialog 配置项

* feat: 增加 modal-multiple 样式

* refactor: 更改参数名称

* refactor: 更新样式

* refactor: 增加 show 参数

* chore: bump version 9.5.11-beta01

Author: ArgoZhang

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.5.10</Version>
+    <Version>9.5.11-beta01</Version>
   </PropertyGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Components/Dialog/Dialog.razor

@@ -2,7 +2,7 @@
 @inherits BootstrapComponentBase
 
 <Modal @ref="_modal" IsBackdrop="_isBackdrop" IsKeyboard="@_isKeyboard" IsFade="@_isFade"
-       OnShownAsync="@_onShownAsync" OnCloseAsync="@_onCloseAsync">
+       OnShownAsync="@_onShownAsync" OnCloseAsync="@_onCloseAsync" class="@ClassString">
     @for (var index = 0; index < DialogParameters.Keys.Count; index++)
     {
         @RenderDialog(index, DialogParameters.Keys.ElementAt(index))

src/BootstrapBlazor/Components/Dialog/Dialog.razor.cs

@@ -29,6 +29,11 @@ public partial class Dialog : IDisposable
     private bool _isBackdrop = false;
     private bool? _isFade = null;
 
+    private string? ClassString => CssBuilder.Default()
+        .AddClass("modal-multiple", DialogParameters.Count > 1)
+        .AddClass("show", DialogParameters.Count > 0)
+        .Build();
+
     /// <summary>
     /// <inheritdoc/>
     /// </summary>

src/BootstrapBlazor/Components/Dialog/DialogOption.cs

@@ -197,6 +197,11 @@ public class DialogOption
     /// </summary>
     public ExportPdfButtonOptions? ExportPdfButtonOptions { get; set; }
 
+    /// <summary>
+    /// Gets or sets whether to hide the previous dialog when opening a new one, default is false
+    /// </summary>
+    public bool IsHidePreviousDialog { get; set; }
+
     /// <summary>
     /// Method to close the dialog
     /// </summary>
@@ -220,6 +225,7 @@ public Dictionary<string, object> ToAttributes()
             [nameof(ModalDialog.FullScreenSize)] = FullScreenSize,
             [nameof(ModalDialog.IsCentered)] = IsCentered,
             [nameof(ModalDialog.IsScrolling)] = IsScrolling,
+            [nameof(ModalDialog.IsHidePreviousDialog)] = IsHidePreviousDialog,
             [nameof(ModalDialog.ShowCloseButton)] = ShowCloseButton,
             [nameof(ModalDialog.ShowSaveButton)] = ShowSaveButton,
             [nameof(ModalDialog.ShowHeaderCloseButton)] = ShowHeaderCloseButton,

src/BootstrapBlazor/Components/Modal/Modal.razor.scss

@@ -1,4 +1,4 @@
-.is-draggable .modal-header {
+.is-draggable .modal-header {
     cursor: pointer;
 }
 
@@ -70,6 +70,24 @@
     width: 100vw !important;
 }
 
+.modal-multiple .modal-dialog {
+    position: fixed;
+    inset: 0;
+
+    &:last-child:before {
+        content: "";
+        position: fixed;
+        inset: 0;
+        background-color: #000;
+        opacity: 0.3;
+        pointer-events: auto;
+    }
+}
+
+.modal-multiple ~ .modal-backdrop {
+    display: none;
+}
+
 @media print {
     .bb-printview-open {
         overflow: auto !important;

src/BootstrapBlazor/Components/Modal/ModalDialog.razor.cs

@@ -25,7 +25,7 @@ public partial class ModalDialog : IHandlerException
         .AddClass("modal-fullscreen", MaximizeStatus)
         .AddClass("is-draggable", IsDraggable)
         .AddClass("is-draggable-center", IsCentered && IsDraggable && _firstRender)
-        .AddClass("d-none", !IsShown)
+        .AddClass("d-none", IsHidePreviousDialog && !IsShown)
         .AddClass(Class, !string.IsNullOrEmpty(Class))
         .AddClassFromAttributes(AdditionalAttributes)
         .Build();
@@ -78,6 +78,12 @@ public partial class ModalDialog : IHandlerException
     [Parameter]
     public bool IsScrolling { get; set; }
 
+    /// <summary>
+    /// Gets or sets whether to hide the previous dialog when opening a new one, default is false
+    /// </summary>
+    [Parameter]
+    public bool IsHidePreviousDialog { get; set; }
+
     /// <summary>
     /// 获得/设置 是否可以拖拽弹窗 默认 false 不可以拖动
     /// </summary>