2020-05-18 14:46:42 +08:00
|
|
|
|
using System;
|
|
|
|
|
using System.Linq;
|
|
|
|
|
using System.Threading.Tasks;
|
2020-05-29 00:33:49 +08:00
|
|
|
|
using AntDesign.Internal;
|
2023-12-24 23:58:16 +08:00
|
|
|
|
using AntDesign.JsInterop;
|
2020-05-18 14:46:42 +08:00
|
|
|
|
using Microsoft.AspNetCore.Components;
|
|
|
|
|
using Microsoft.AspNetCore.Components.Web;
|
|
|
|
|
|
2020-05-29 00:33:49 +08:00
|
|
|
|
namespace AntDesign
|
2020-05-18 14:46:42 +08:00
|
|
|
|
{
|
|
|
|
|
public partial class SubMenu : AntDomComponentBase
|
|
|
|
|
{
|
|
|
|
|
[CascadingParameter]
|
|
|
|
|
public Menu RootMenu { get; set; }
|
|
|
|
|
|
|
|
|
|
[CascadingParameter]
|
|
|
|
|
public SubMenu Parent { get; set; }
|
|
|
|
|
|
2020-12-25 13:28:17 +08:00
|
|
|
|
[Parameter]
|
2021-09-10 19:06:50 +08:00
|
|
|
|
public Placement? Placement
|
|
|
|
|
{
|
|
|
|
|
get { return _placement?.Placement; }
|
2021-09-16 22:46:45 +08:00
|
|
|
|
set
|
2021-09-10 19:06:50 +08:00
|
|
|
|
{
|
|
|
|
|
if (value is null)
|
|
|
|
|
{
|
|
|
|
|
_placement = null;
|
|
|
|
|
}
|
|
|
|
|
else
|
|
|
|
|
{
|
|
|
|
|
_placement = PlacementType.Create(value.Value);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
2020-12-25 13:28:17 +08:00
|
|
|
|
|
2023-01-19 18:12:25 +08:00
|
|
|
|
[Parameter]
|
|
|
|
|
public string PopupClassName { get; set; }
|
|
|
|
|
|
2020-05-18 14:46:42 +08:00
|
|
|
|
[Parameter]
|
2020-09-16 13:58:16 +08:00
|
|
|
|
public string Title { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public RenderFragment TitleTemplate { get; set; }
|
2020-05-18 14:46:42 +08:00
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public RenderFragment ChildContent { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public string Key
|
|
|
|
|
{
|
|
|
|
|
get => _key ?? Id;
|
|
|
|
|
set => _key = value;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public bool Disabled { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public bool IsOpen { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
2020-11-16 12:57:42 +08:00
|
|
|
|
public EventCallback<MouseEventArgs> OnTitleClick { get; set; }
|
2020-05-18 14:46:42 +08:00
|
|
|
|
|
2020-08-18 18:05:44 +08:00
|
|
|
|
internal int Level => RootMenu?.InternalMode == MenuMode.Inline ? (Parent?.Level ?? 0) + 1 : 0;
|
2020-06-04 14:48:13 +08:00
|
|
|
|
|
2023-02-09 12:13:57 +08:00
|
|
|
|
private int Padding => Level * RootMenu?.InlineIndent ?? 0;
|
|
|
|
|
|
|
|
|
|
private string PaddingStyle => Padding > 0 ? $"{(RTL ? "padding-right" : "padding-left")}:{Padding}px;" : "";
|
2020-06-04 14:48:13 +08:00
|
|
|
|
|
2020-05-18 14:46:42 +08:00
|
|
|
|
private ClassMapper SubMenuMapper { get; } = new ClassMapper();
|
|
|
|
|
|
2020-05-19 20:35:48 +08:00
|
|
|
|
private bool _isSelected;
|
|
|
|
|
|
2020-05-18 14:46:42 +08:00
|
|
|
|
private string _key;
|
|
|
|
|
|
2020-05-19 20:35:48 +08:00
|
|
|
|
private string _popupMinWidthStyle = "";
|
2020-05-18 14:46:42 +08:00
|
|
|
|
private OverlayTrigger _overlayTrigger;
|
|
|
|
|
|
2021-02-04 16:21:56 +08:00
|
|
|
|
internal bool _overlayVisible;
|
2021-09-10 19:06:50 +08:00
|
|
|
|
private PlacementType? _placement;
|
2021-02-04 16:21:56 +08:00
|
|
|
|
|
2023-12-24 23:58:16 +08:00
|
|
|
|
private ElementReference _warpperRef;
|
|
|
|
|
private decimal _warpperHight;
|
|
|
|
|
private string _warpperStyle;
|
|
|
|
|
|
|
|
|
|
private bool _isActive = false;
|
|
|
|
|
private bool _isInactive = true;
|
|
|
|
|
private bool _isHidden = true;
|
|
|
|
|
private bool _isCollapseEnterPrepare;
|
|
|
|
|
private bool _isCollapseEnterStart;
|
|
|
|
|
private bool _isCollapseEnterActive;
|
|
|
|
|
|
|
|
|
|
private bool _isCollapseLeavePrepare;
|
|
|
|
|
private bool _isCollapseLeaveStart;
|
|
|
|
|
private bool _isCollapseLeaveActive;
|
|
|
|
|
|
2020-05-18 14:46:42 +08:00
|
|
|
|
private void SetClass()
|
|
|
|
|
{
|
|
|
|
|
string prefixCls = $"{RootMenu.PrefixCls}-submenu";
|
|
|
|
|
|
|
|
|
|
ClassMapper
|
2023-02-04 00:29:34 +08:00
|
|
|
|
.Add(prefixCls)
|
|
|
|
|
.Get(() => $"{prefixCls}-{(RootMenu?.InternalMode == MenuMode.Horizontal ? MenuMode.Vertical : RootMenu?.InternalMode)}")
|
|
|
|
|
.If($"{prefixCls}-disabled", () => Disabled)
|
|
|
|
|
.If($"{prefixCls}-selected", () => _isSelected)
|
|
|
|
|
.If($"{prefixCls}-rtl", () => RTL)
|
|
|
|
|
.If($"{prefixCls}-open", () => RootMenu?.InternalMode == MenuMode.Inline && IsOpen)
|
|
|
|
|
;
|
2020-05-18 14:46:42 +08:00
|
|
|
|
|
|
|
|
|
SubMenuMapper
|
2020-08-18 18:05:44 +08:00
|
|
|
|
.Add(RootMenu?.PrefixCls)
|
|
|
|
|
.Add($"{RootMenu?.PrefixCls}-sub")
|
2021-02-04 16:21:56 +08:00
|
|
|
|
.Get(() => $"{RootMenu?.PrefixCls}-{RootMenu?.Theme}")
|
|
|
|
|
.Get(() => $"{RootMenu?.PrefixCls}-{(RootMenu?.InternalMode == MenuMode.Horizontal ? MenuMode.Vertical : RootMenu?.InternalMode)}")
|
2020-05-19 20:35:48 +08:00
|
|
|
|
//.If($"{RootMenu.PrefixCls}-submenu-popup", () => RootMenu.InternalMode != MenuMode.Inline)
|
2023-12-24 23:58:16 +08:00
|
|
|
|
.If($"{RootMenu?.PrefixCls}-hidden", () => RootMenu?.InternalMode == MenuMode.Inline && !IsOpen && _isHidden)
|
2023-02-04 00:29:34 +08:00
|
|
|
|
.If($"{RootMenu?.PrefixCls}-rtl", () => RTL)
|
2023-12-24 23:58:16 +08:00
|
|
|
|
.If("ant-motion-collapse-enter ant-motion-collapse-enter-prepare ant-motion-collapse", () => _isCollapseEnterPrepare)
|
|
|
|
|
.If("ant-motion-collapse-enter ant-motion-collapse-enter-start ant-motion-collapse", () => _isCollapseEnterStart)
|
|
|
|
|
.If("ant-motion-collapse-enter ant-motion-collapse-enter-active ant-motion-collapse", () => _isCollapseEnterActive)
|
|
|
|
|
.If("ant-motion-collapse-leave ant-motion-collapse-leave-prepare ant-motion-collapse", () => _isCollapseLeavePrepare)
|
|
|
|
|
.If("ant-motion-collapse-leave ant-motion-collapse-leave-start ant-motion-collapse", () => _isCollapseLeaveStart)
|
|
|
|
|
.If("ant-motion-collapse-leave ant-motion-collapse-leave-active ant-motion-collapse", () => _isCollapseLeaveActive)
|
2020-05-18 14:46:42 +08:00
|
|
|
|
;
|
|
|
|
|
|
2020-08-18 18:05:44 +08:00
|
|
|
|
if (RootMenu?.InternalMode != MenuMode.Inline && _overlayTrigger != null)
|
2020-05-18 14:46:42 +08:00
|
|
|
|
{
|
|
|
|
|
Overlay overlay = _overlayTrigger.GetOverlayComponent();
|
|
|
|
|
|
2020-05-19 20:35:48 +08:00
|
|
|
|
ClassMapper
|
2020-08-18 18:05:44 +08:00
|
|
|
|
.If($"{prefixCls}-selected", () => overlay != null && overlay.IsPopup());
|
2020-05-19 20:35:48 +08:00
|
|
|
|
|
2020-05-18 14:46:42 +08:00
|
|
|
|
SubMenuMapper
|
2021-03-12 15:46:48 +08:00
|
|
|
|
.If($"ant-zoom-big ant-zoom-big-enter ant-zoom-big-enter-active", () => overlay != null && RootMenu?.Mode == MenuMode.Vertical && overlay.IsPopup() && !overlay.IsHiding())
|
|
|
|
|
.If($"ant-zoom-big ant-zoom-big-leave ant-zoom-big-leave-active", () => overlay != null && RootMenu?.Mode == MenuMode.Vertical && overlay.IsHiding())
|
|
|
|
|
.If($"ant-slide-up ant-slide-up-enter ant-slide-up-enter-active", () => overlay != null && RootMenu?.Mode == MenuMode.Horizontal && overlay.IsPopup() && !overlay.IsHiding())
|
|
|
|
|
.If($"ant-slide-up ant-slide-up-leave ant-slide-up-leave-active", () => overlay != null && RootMenu?.Mode == MenuMode.Horizontal && overlay.IsHiding())
|
2020-05-19 20:35:48 +08:00
|
|
|
|
;
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private async Task HandleOnTitleClick(MouseEventArgs args)
|
|
|
|
|
{
|
2020-08-26 23:18:49 +08:00
|
|
|
|
RootMenu?.SelectSubmenu(this, true);
|
2020-11-16 12:57:42 +08:00
|
|
|
|
if (OnTitleClick.HasDelegate)
|
|
|
|
|
await OnTitleClick.InvokeAsync(args);
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public async Task Collapse()
|
|
|
|
|
{
|
2020-08-18 18:05:44 +08:00
|
|
|
|
if (RootMenu?.InternalMode == MenuMode.Inline)
|
2020-05-19 20:35:48 +08:00
|
|
|
|
{
|
|
|
|
|
await Task.Delay(300);
|
|
|
|
|
}
|
|
|
|
|
else
|
|
|
|
|
{
|
|
|
|
|
await _overlayTrigger.Hide(true);
|
|
|
|
|
}
|
2020-05-18 14:46:42 +08:00
|
|
|
|
IsOpen = false;
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
protected override void OnInitialized()
|
|
|
|
|
{
|
|
|
|
|
base.OnInitialized();
|
|
|
|
|
SetClass();
|
|
|
|
|
|
2020-08-18 18:05:44 +08:00
|
|
|
|
RootMenu?.Submenus.Add(this);
|
2020-05-18 14:46:42 +08:00
|
|
|
|
|
|
|
|
|
if (RootMenu.DefaultOpenKeys.Contains(Key))
|
|
|
|
|
IsOpen = true;
|
2021-02-04 16:21:56 +08:00
|
|
|
|
|
|
|
|
|
_overlayVisible = IsOpen;
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
protected override void OnParametersSet()
|
|
|
|
|
{
|
|
|
|
|
base.OnParametersSet();
|
|
|
|
|
|
2020-07-15 01:00:06 +08:00
|
|
|
|
if (!RootMenu.InlineCollapsed && RootMenu.OpenKeys.Contains(Key))
|
2021-09-10 19:06:50 +08:00
|
|
|
|
{
|
|
|
|
|
if (RootMenu.InitialMode != RootMenu.Mode)
|
|
|
|
|
{
|
|
|
|
|
IsOpen = false;
|
|
|
|
|
}
|
|
|
|
|
else
|
|
|
|
|
{
|
|
|
|
|
IsOpen = true;
|
|
|
|
|
}
|
|
|
|
|
}
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
|
2020-05-19 20:35:48 +08:00
|
|
|
|
protected override async Task OnAfterRenderAsync(bool firstRender)
|
|
|
|
|
{
|
2023-01-18 18:44:57 +08:00
|
|
|
|
if (firstRender && RootMenu.InternalMode != MenuMode.Inline && _overlayTrigger != null)
|
2020-05-19 20:35:48 +08:00
|
|
|
|
{
|
|
|
|
|
var domInfo = await _overlayTrigger.GetTriggerDomInfo();
|
2021-04-17 22:14:01 +08:00
|
|
|
|
_popupMinWidthStyle = $"min-width: {domInfo.ClientWidth}px";
|
2020-05-19 20:35:48 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
await base.OnAfterRenderAsync(firstRender);
|
|
|
|
|
}
|
|
|
|
|
|
2020-05-18 14:46:42 +08:00
|
|
|
|
public void Close()
|
|
|
|
|
{
|
|
|
|
|
IsOpen = false;
|
2023-12-24 23:58:16 +08:00
|
|
|
|
|
|
|
|
|
if (RootMenu.Animation)
|
|
|
|
|
{
|
|
|
|
|
HandleCollapse();
|
|
|
|
|
}
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public void Open()
|
|
|
|
|
{
|
|
|
|
|
if (Disabled)
|
|
|
|
|
{
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
IsOpen = true;
|
2023-12-24 23:58:16 +08:00
|
|
|
|
|
|
|
|
|
if (RootMenu.Animation)
|
|
|
|
|
{
|
|
|
|
|
HandleExpand();
|
|
|
|
|
}
|
|
|
|
|
|
2020-07-15 01:00:06 +08:00
|
|
|
|
Parent?.Open();
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public OverlayTrigger GetOverlayTrigger()
|
|
|
|
|
{
|
|
|
|
|
return _overlayTrigger;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private void OnOverlayVisibleChange(bool visible)
|
|
|
|
|
{
|
2021-02-04 16:21:56 +08:00
|
|
|
|
_overlayVisible = visible;
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
|
2020-11-16 12:57:42 +08:00
|
|
|
|
private void OnOverlayHiding(bool _)
|
2020-05-18 14:46:42 +08:00
|
|
|
|
{
|
|
|
|
|
}
|
2020-05-19 20:35:48 +08:00
|
|
|
|
|
2021-09-16 22:46:45 +08:00
|
|
|
|
public void Select(bool isInitializing = false)
|
2020-05-19 20:35:48 +08:00
|
|
|
|
{
|
|
|
|
|
Parent?.Select();
|
|
|
|
|
_isSelected = true;
|
2021-09-16 22:46:45 +08:00
|
|
|
|
if (isInitializing)
|
|
|
|
|
{
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
}
|
2020-05-19 20:35:48 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public void Deselect()
|
|
|
|
|
{
|
|
|
|
|
Parent?.Deselect();
|
|
|
|
|
_isSelected = false;
|
|
|
|
|
}
|
2023-12-24 23:58:16 +08:00
|
|
|
|
|
|
|
|
|
private async Task UpdateHeight()
|
|
|
|
|
{
|
|
|
|
|
var rect = await JsInvokeAsync<HtmlElement>(JSInteropConstants.GetDomInfo, _warpperRef);
|
|
|
|
|
_warpperHight = rect.ScrollHeight;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private void HandleExpand()
|
|
|
|
|
{
|
|
|
|
|
_isActive = true;
|
|
|
|
|
_isInactive = false;
|
|
|
|
|
_isHidden = false;
|
|
|
|
|
_isCollapseEnterPrepare = true;
|
|
|
|
|
|
|
|
|
|
CallAfterRender(async () =>
|
|
|
|
|
{
|
|
|
|
|
await UpdateHeight();
|
|
|
|
|
|
|
|
|
|
_isCollapseEnterPrepare = false;
|
|
|
|
|
_isCollapseEnterStart = true;
|
|
|
|
|
_warpperStyle = "height: 0px; opacity: 0;";
|
|
|
|
|
|
|
|
|
|
CallAfterRender(async () =>
|
|
|
|
|
{
|
|
|
|
|
_isCollapseEnterStart = false;
|
|
|
|
|
_isCollapseEnterActive = true;
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
await Task.Delay(100);
|
|
|
|
|
|
|
|
|
|
_warpperStyle = $"height: {_warpperHight}px; opacity: 1;";
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
await Task.Delay(450);
|
|
|
|
|
|
|
|
|
|
_isCollapseEnterActive = false;
|
|
|
|
|
_warpperStyle = "";
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private void HandleCollapse()
|
|
|
|
|
{
|
|
|
|
|
_isActive = false;
|
|
|
|
|
_isInactive = true;
|
|
|
|
|
_isCollapseLeavePrepare = true;
|
|
|
|
|
|
|
|
|
|
CallAfterRender(async () =>
|
|
|
|
|
{
|
|
|
|
|
_isCollapseLeavePrepare = false;
|
|
|
|
|
_isCollapseLeaveStart = true;
|
|
|
|
|
_warpperStyle = $"height: {_warpperHight}px;";
|
|
|
|
|
|
|
|
|
|
CallAfterRender(async () =>
|
|
|
|
|
{
|
|
|
|
|
await Task.Delay(100);
|
|
|
|
|
_isCollapseLeaveStart = false;
|
|
|
|
|
_isCollapseLeaveActive = true;
|
|
|
|
|
|
|
|
|
|
_warpperStyle = "height: 0px; opacity: 0;";//still active
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
|
|
|
|
|
await Task.Delay(450);
|
|
|
|
|
_isHidden = true; // still height 0
|
|
|
|
|
_warpperStyle = "";
|
|
|
|
|
_isCollapseLeaveActive = false;
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
await Task.Yield();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
StateHasChanged();
|
|
|
|
|
}
|
2020-05-18 14:46:42 +08:00
|
|
|
|
}
|
|
|
|
|
}
|