/// <summary> /// Builds the render tree. /// </summary> /// <param name="root">The root.</param> protected override void BuildRenderTree(RenderTreeBuilder root) { root.OpenElement(0, "div"); root.AddAttribute(1, "style", $"display:flex;flex-direction:row;justify-content:{Alignment.GetEnumMemberValue<DefaultValueAttribute>()}"); root.AddContent(2, builder => { BuildStatistic(builder); builder.OpenComponent <Menu>(10); builder.AddAttribute(11, nameof(Menu.Pagination), true); builder.AddAttribute(12, nameof(Menu.Size), Size); builder.AddAttribute(13, nameof(Menu.Linked), true); BuildPaginationPart(builder); builder.CloseComponent(); BuildPageSizeForm(builder); }); root.CloseElement(); void BuildPaginationPart(RenderTreeBuilder builder) { #region Pager builder.AddAttribute(10, nameof(Menu.ChildContent), (RenderFragment)(item => { #region First page if (CurrentPage <= 1) { BuildPageItem(item, 10, 1, 1, disabled: true, active: true); } else { #region Previous BuildPageItem(item, 1, "<<", "Previous", NavigateToPrevious); #endregion BuildPageItem(item, 10, 1, 1, NavigateToFirst); } #endregion #region Next 5 pages if (CurrentPage > PageNumberCount / 2) { var backTo = PageNumberCount - 5; if (backTo <= 1) { backTo = 1; } BuildPageItem(item, 20, "...", "Next 5 pages", () => NavigateToPage(backTo)); } #endregion #region Page Number var(start, end) = ComputePageNumber(); for (int i = start + 1; i <= end - 1; i++) { var current = i; var sequence = i + 30; if (CurrentPage == current) { BuildPageItem(item, sequence, current, current, disabled: true, active: true); } else { BuildPageItem(item, sequence, current, current, () => NavigateToPage(current)); } } #endregion #region Previous 5 page if (CurrentPage < TotalPages - PageNumberCount / 2) { var nextTo = CurrentPage + 5; if (nextTo >= TotalPages) { nextTo = TotalPages; } BuildPageItem(item, 20, "...", "Previous 5 pages", () => NavigateToPage(nextTo)); } #endregion #region Last page if (TotalPages > 1) { if (CurrentPage >= TotalPages) { BuildPageItem(item, 90, TotalPages, TotalPages, disabled: true, active: true); } else { BuildPageItem(item, 90, TotalPages, TotalPages, NavigateToLast); #region Next page BuildPageItem(item, 100, ">>", "Next", NavigateToNext); #endregion } } #endregion })); #endregion void BuildPageItem(RenderTreeBuilder builder, int sequence, object content, object title, Func <Task> callback = default, bool disabled = false, bool active = false)