LANCommander/LANCommander.Server/UI/Components/DataTable/DataTable.razor

@using AntDesign.TableModels
@using LANCommander.Server.Data
@using LANCommander.Server.Models
@using System.IO.Compression
@using System.Web
@namespace LANCommander.Server.UI.Components
@attribute [CascadingTypeParameter(nameof(TItem))]
@typeparam TItem
@inherits Table<TItem>
@inject NavigationManager NavigationManager
@inject DrawerService DrawerService

<CascadingValue Value="this">
    <Flex Justify="FlexJustify.SpaceBetween" Style="padding: 12px;">
        <Flex Gap="FlexGap.Small">
            <Search Placeholder="Search" @bind-Value="Search" BindOnInput DebounceMilliseconds="250" />
            <Button Icon="@IconType.Outline.Control" Type="@ButtonType.Text" OnClick="OpenDrawer" />
            @LeftToolbar
        </Flex>

        @if (RightToolbar != null)
        {
            <Flex Gap="FlexGap.Small">
                @RightToolbar
            </Flex>
        }
    </Flex>

    <CascadingValue Value="ColumnVisibility" IsFixed>
        <div id="@Id" class="ant-table-visibility-container">
            @RenderBase()
        </div>
    </CascadingValue>
</CascadingValue>

<style>
    @foreach (var columnVisibility in ColumnVisibility) {
        if (!columnVisibility.Value)
        {
            @($"#{Id} tbody td:nth-child({columnVisibility.Key + 1}) {{display: none;}}")
            @($"#{Id} thead th:nth-child({columnVisibility.Key + 1}) {{display: none;}}")
        }
    }
</style>

@code {
    [Parameter] public RenderFragment LeftToolbar { get; set; }
    [Parameter] public RenderFragment RightToolbar { get; set; }
    [Parameter] public RenderFragment<TItem> Columns { get; set; }
    [Parameter] public RenderFragment Actions { get; set; }
    [Parameter] public string Search { get; set; }
    [Parameter] public string SearchChanged { get; set; }
    [Parameter] public Func<int, int, string, Task<PaginatedResults<TItem>>> LoadData { get; set; }
    
    string Url;
    bool DrawerOpen = false;

    internal Dictionary<int, bool> ColumnVisibility = new Dictionary<int, bool>();

    RenderFragment RenderBase() => builder => base.BuildRenderTree(builder);

    protected override async Task OnInitializedAsync()
    {
        //Id = Guid.NewGuid().ToString();
        Url = NavigationManager.Uri;
        //NavigationManager.LocationChanged += LocationChanged;

        await LoadTableParameter();

        await base.OnInitializedAsync();
    }

    protected override async Task OnParametersSetAsync()
    {
        if (Columns != null)
            ChildContent = Columns;

        base.OnPageSizeChange = EventCallback.Factory.Create<PaginationEventArgs>(
            this,
            async (args) =>
            {
                PageSizeChanged(args);
            });

        base.OnPageIndexChange = EventCallback.Factory.Create<PaginationEventArgs>(
            this,
            async (args) =>
            {
                PageIndexChanged(args);
            });

        base.OnChange = EventCallback.Factory.Create<QueryModel<TItem>>(
            this,
            async (args) =>
            {
                await LoadTableParameter();
            });

        await base.OnParametersSetAsync();
    }

    async void LocationChanged(object sender, LocationChangedEventArgs e)
    {
        Url = e.Location;
        await LoadTableParameter();
        // await LoadData();
    }

    async Task LoadTableParameter()
    {
        Loading = true;
        await InvokeStateHasChangedAsync();

        var uri = NavigationManager.ToAbsoluteUri(Url);
        var query = HttpUtility.ParseQueryString(uri.Query);

        PageIndex = int.TryParse(query["Page"], out var index) ? index > 0 ? index : 1 : 1;
        PageSize = int.TryParse(query["Size"], out var size) ? size > 0 ? size : 50 : 50;

        if (query["Search"] != null && query["Search"] != Search)
            Search = query["Search"];
        else if (!String.IsNullOrWhiteSpace(Search))
            Search = "";

        if (LoadData != null)
        {
            var data = await LoadData(PageIndex, PageSize, Search);

            DataSource = data.Results;
            Total = data.Count;
        }

        Loading = false;
        await InvokeStateHasChangedAsync();
    }

    new void PageIndexChanged(PaginationEventArgs args)
    {
        var uri = NavigationManager.ToAbsoluteUri(Url);

        NavigationManager.NavigateTo($"{uri.AbsolutePath}?Page={args.Page}&Size={args.PageSize}{(Search != "" ? "&Search=" + Search : "")}");
    }

    new void PageSizeChanged(PaginationEventArgs args)
    {
        var uri = NavigationManager.ToAbsoluteUri(Url);

        NavigationManager.NavigateTo($"{uri.AbsolutePath}?Page={args.Page}&Size={args.PageSize}{(Search != "" ? "&Search=" + Search : "")}");
    }

    void OnSearchChanged()
    {
        var uri = NavigationManager.ToAbsoluteUri(Url);

        NavigationManager.NavigateTo($"{uri.AbsolutePath}?Search={Search}&Size={PageSize}");
    }

    public async Task OpenDrawer()
    {
        var options = new DrawerOptions
        {
            Title = "Columns",
            Width = "350",
            MaskClosable = false,
            Placement = DrawerPlacement.Right,
        };

        var columns = new List<DataTableColumn>();

        foreach (var column in ColumnContext.Columns)
        {
            if (column is not ISelectionColumn && column is not ActionColumn)
            {
                columns.Add(new DataTableColumn
                {
                    Index = column.ColIndex,
                    Name = column.Title,
                    Visible = true
                });
            }
        }

        columns = (await DrawerService.CreateDialogAsync<DataTableColumnPickerDrawer, IEnumerable<DataTableColumn>, IEnumerable<DataTableColumn>>(options, columns)).ToList();

        foreach (var column in columns)
        {
            ColumnVisibility[column.Index] = column.Visible;
        }

        base.ReloadData(PageIndex, PageSize);
        base.InvokeStateHasChanged();
    }

    public void CloseDrawer()
    {
        base.InvokeStateHasChanged();
        StateHasChanged();
    }

    public void Dispose()
    {
        NavigationManager.LocationChanged -= LocationChanged;
    }
}