mirror of
https://gitee.com/ant-design-blazor/ant-design-blazor.git
synced 2024-12-15 17:31:42 +08:00
152a574577
* feat(module:overlay): OverlayTrigger not bound to a div * feat(module:overlay): OverlayTrigger not bound to a div * feat(module:overlay): Logic transfer to single Overlay * feat(module:overlay): remove obsolete duplication * feat(module:Tooltip): Add for unbounded oncontextmenu event handler * feat(module:tooltip): unbound js event listeners remove * docs(module:tooltip): unbound explanation * fix(module:button): attach Ref to top level html element @ref * feat(module:dropdown&tooltip&popconfirm&popover): Overlay not bound to a div * docs(module:dropdown&tooltip&popconfirm&popover): unbound explanation * feat(module:OverlayTrigger): common logic relocation * feat(module:overlaytrigger): Overlay not bound to a div * feat(module:DatePicker): Overlay not bound to a div * feat(module:select): Overlay not boud to div * fix(module:select): onclickarrow event relocation * fix(module:select): rename Show to OnArrowClick * feat(module:avatar): Overlay not bound to a div * docs(module:avatar): demo switch to unbound version * feat(module:autocomplete): partial OverlayTrigger not bound to a div * feat(module:slider): tooltip * docs(module:slider): tooltip * fix(module:overlay): add SetVisible method * feat: set Ref where missing, performance components register Ref when missing IsFixed flag for CascadeValue changed hard-code sequence numbers when using RenderTreeBuilder Rate component use Tooltip Unbound version Tabs test fix * fix: revert changes (accidental) * feat(module:upload): tooltip with unbound usage * feat(module:table): column use of unbound tooltip * feat(module:autocomplete):overlay unbound from div * fix(module:upload): missing div restore Co-authored-by: James Yeung <shunjiey@hotmail.com>
189 lines
5.7 KiB
C#
189 lines
5.7 KiB
C#
using System;
|
|
using System.Collections;
|
|
using System.Collections.Generic;
|
|
using System.Linq;
|
|
using System.Text;
|
|
using System.Threading.Tasks;
|
|
using AntDesign.JsInterop;
|
|
using Microsoft.AspNetCore.Components;
|
|
using OneOf;
|
|
|
|
namespace AntDesign
|
|
{
|
|
using ColumnType = OneOf<int, Dictionary<string, int>>;
|
|
|
|
public partial class Descriptions : AntDomComponentBase
|
|
{
|
|
#region Parameters
|
|
|
|
[Parameter]
|
|
public bool Bordered { get; set; } = false;
|
|
|
|
[Parameter]
|
|
public string Layout { get; set; } = DescriptionsLayout.Horizontal;
|
|
|
|
[Parameter]
|
|
public ColumnType Column { get; set; }
|
|
|
|
[Parameter]
|
|
public string Size { get; set; }
|
|
|
|
[Parameter]
|
|
public string Title { get; set; }
|
|
|
|
[Parameter]
|
|
public RenderFragment TitleTemplate { get; set; }
|
|
|
|
[Parameter]
|
|
public bool Colon { get; set; }
|
|
|
|
#endregion Parameters
|
|
|
|
[Parameter]
|
|
public RenderFragment ChildContent { get; set; }
|
|
|
|
public IList<IDescriptionsItem> Items { get; } = new List<IDescriptionsItem>();
|
|
|
|
private List<List<(IDescriptionsItem item, int realSpan)>> _itemMatrix = new List<List<(IDescriptionsItem item, int realSpan)>>();
|
|
|
|
[Inject]
|
|
public DomEventService DomEventService { get; set; }
|
|
|
|
private int _realColumn;
|
|
|
|
private readonly Dictionary<string, int> _defaultColumnMap = new Dictionary<string, int>
|
|
{
|
|
{ "xxl", 3 },
|
|
{ "xl", 3},
|
|
{ "lg", 3},
|
|
{ "md", 3},
|
|
{ "sm", 2},
|
|
{ "xs", 1}
|
|
};
|
|
|
|
private static readonly List<(int PixelWidth, BreakpointEnum Breakpoint)> _descriptionsResponsiveMap = new List<(int, BreakpointEnum)>()
|
|
{
|
|
(575,BreakpointEnum.xs),
|
|
(576,BreakpointEnum.sm),
|
|
(768,BreakpointEnum.md),
|
|
(992,BreakpointEnum.lg),
|
|
(1200,BreakpointEnum.xl),
|
|
(1600,BreakpointEnum.xxl)
|
|
};
|
|
|
|
private void SetClassMap()
|
|
{
|
|
ClassMapper.Clear().Add("ant-descriptions")
|
|
.If("ant-descriptions-bordered", () => this.Bordered)
|
|
.If("ant-descriptions-middle", () => this.Size == DescriptionsSize.Middle)
|
|
.If("ant-descriptions-small", () => this.Size == DescriptionsSize.Small);
|
|
}
|
|
|
|
protected override async Task OnInitializedAsync()
|
|
{
|
|
SetClassMap();
|
|
|
|
await base.OnInitializedAsync();
|
|
}
|
|
|
|
protected override void OnAfterRender(bool firstRender)
|
|
{
|
|
if (firstRender && Column.IsT1)
|
|
{
|
|
DomEventService.AddEventListener<object>("window", "resize", OnResize, false);
|
|
}
|
|
|
|
base.OnAfterRender(firstRender);
|
|
}
|
|
|
|
protected override void Dispose(bool disposing)
|
|
{
|
|
base.Dispose(disposing);
|
|
|
|
DomEventService.RemoveEventListerner<object>("window", "resize", OnResize);
|
|
}
|
|
|
|
private async void OnResize(object o)
|
|
{
|
|
await SetRealColumn();
|
|
PrepareMatrix();
|
|
await InvokeAsync(StateHasChanged);
|
|
}
|
|
|
|
protected override async Task OnFirstAfterRenderAsync()
|
|
{
|
|
await SetRealColumn();
|
|
PrepareMatrix();
|
|
await InvokeAsync(StateHasChanged);
|
|
await base.OnFirstAfterRenderAsync();
|
|
}
|
|
|
|
protected override async Task OnParametersSetAsync()
|
|
{
|
|
SetClassMap();
|
|
PrepareMatrix();
|
|
await InvokeAsync(StateHasChanged);
|
|
await base.OnParametersSetAsync();
|
|
}
|
|
|
|
private void PrepareMatrix()
|
|
{
|
|
List<List<(IDescriptionsItem item, int realSpan)>> itemMatrix = new List<List<(IDescriptionsItem item, int realSpan)>>();
|
|
|
|
List<(IDescriptionsItem item, int realSpan)> currentRow = new List<(IDescriptionsItem item, int realSpan)>();
|
|
var width = 0;
|
|
|
|
for (int i = 0; i < this.Items.Count; i++)
|
|
{
|
|
var item = this.Items[i];
|
|
width += item.Span;
|
|
|
|
if (width >= _realColumn)
|
|
{
|
|
if (width > _realColumn)
|
|
{
|
|
Console.WriteLine(@$"""Column"" is {_realColumn} but we have row length ${width}");
|
|
}
|
|
currentRow.Add((item, _realColumn - (width - item.Span)));
|
|
FlushRow();
|
|
}
|
|
else if (i == this.Items.Count - 1)
|
|
{
|
|
currentRow.Add((item, _realColumn - (width - item.Span)));
|
|
FlushRow();
|
|
}
|
|
else
|
|
{
|
|
currentRow.Add((item, item.Span));
|
|
}
|
|
}
|
|
this._itemMatrix = itemMatrix;
|
|
|
|
void FlushRow()
|
|
{
|
|
itemMatrix.Add(currentRow);
|
|
currentRow = new List<(IDescriptionsItem item, int realSpan)>();
|
|
width = 0;
|
|
}
|
|
}
|
|
|
|
private async Task SetRealColumn()
|
|
{
|
|
|
|
if (Column.IsT0)
|
|
{
|
|
_realColumn = Column.AsT0 == 0 ? 3 : Column.AsT0;
|
|
}
|
|
else
|
|
{
|
|
Element element = await JsInvokeAsync<Element>(JSInteropConstants.GetDomInfo, Ref);
|
|
var breakpointTuple = _descriptionsResponsiveMap.FirstOrDefault(x => x.PixelWidth > element.clientWidth);
|
|
var bp = breakpointTuple == default ? BreakpointEnum.xxl : breakpointTuple.Breakpoint;
|
|
_realColumn = Column.AsT1.ContainsKey(bp.ToString()) ? Column.AsT1[bp.ToString()] : _defaultColumnMap[bp.ToString()];
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
}
|