@page "/tables/footer"

<h3>Table 统计功能</h3>

<h4>用于数据统计</h4>

<DemoBlock Title="数据统计示例" Introduction="设置 <code>ShowFooter=true</code> 显示 <code>Footer</code> 自定义合计功能" Name="Statistics">
    <p><code>Table</code> 组件有 <code>TableFooter</code> 模板，其数据上下文为 <code>Table</code> 组件的数据集合 <code>IEnumerable<TItem></code></p>
    <p><code>TableFooter</code> 模板中关联的上下文 <code>context</code> 值为当页数据集合</p>
    <p><code>TableFooter</code> 模板内可以自定义单元格 <code>td</code> 内容，也可以使用内置的 <code>TableFooterCell</code> 组件进行数据显示</p>
    <Table TItem="Foo" ShowFooter="true" class="footer-demo"
           IsPagination="true" PageItemsSource="@PageItemsSource" OnQueryAsync="@OnQueryAsync">
        <TableColumns>
            <TableColumn @bind-Field="@context.DateTime" Width="180" />
            <TableColumn @bind-Field="@context.Name" />
            <TableColumn @bind-Field="@context.Address" />
            <TableColumn @bind-Field="@context.Count" />
        </TableColumns>
        <TableFooter>
            <TableFooterCell Text="合计：" colspan="3" Align="@Align" />
            <TableFooterCell Aggregate="@Aggregate" Field="@nameof(Foo.Count)" />
        </TableFooter>
    </Table>
    <div class="mt-3 btn-group">
        <Button Icon="fa fa-align-left" Text="@Left" OnClick="() => Align = Alignment.Left" />
        <Button Icon="fa fa-align-center" Text="@Center" OnClick="() => Align = Alignment.Center" />
        <Button Icon="fa fa-align-right" Text="@Right" OnClick="() => Align = Alignment.Right" />
    </div>
    <div class="mt-3 btn-group">
        <Button Text="Sum" OnClick="() => Aggregate = AggregateType.Sum" />
        <Button Text="Average" OnClick="() => Aggregate = AggregateType.Average" />
        <Button Text="Count" OnClick="() => Aggregate = AggregateType.Count" />
        <Button Text="Min" OnClick="() => Aggregate = AggregateType.Min" />
        <Button Text="Max" OnClick="() => Aggregate = AggregateType.Max" />
    </div>
</DemoBlock>

<DemoBlock Title="Footer 模板" Introduction="设置 <code>FooterTemplate</code> 自定义表格底部显示内容" Name="FooterTemplate">
    <p>无数据时默认显示 <code>Footer</code> 可通过设置 <code>@nameof(Table<Foo>.IsHideFooterWhenNoData)</code> 参数隐藏 <code>Footer</code></p>
    <Table TItem="Foo" ShowFooter="true" class="footer-demo"
           IsPagination="true" PageItemsSource="@PageItemsSource" OnQueryAsync="@OnQueryAsync">
        <TableColumns>
            <TableColumn @bind-Field="@context.DateTime" Width="180" />
            <TableColumn @bind-Field="@context.Name" />
            <TableColumn @bind-Field="@context.Address" />
            <TableColumn @bind-Field="@context.Count" />
        </TableColumns>
        <FooterTemplate>
            <tr>
                <td colspan="4">
                    <div style="text-align: right;">
                        这里可以写一些描述性的语句
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="3">
                    <div class="d-flex align-items-center justify-content-end" style="line-height: 3;">合计：</div>
                </td>
                <td>
                    <div class="footer-customer">
                        <div>
                            Average: @GetAverage(context)
                        </div>
                        <hr />
                        <div>
                            Sum: @GetSum(context)
                        </div>
                    </div>
                </td>
            </tr>
        </FooterTemplate>
    </Table>
</DemoBlock>

<style>
    .footer-customer {
        text-align: center;
        color: #222;
    }

    .footer-demo hr {
        margin: 0;
    }
</style>

// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/

using BootstrapBlazor.Components;
using Microsoft.AspNetCore.Components;
using Microsoft.Extensions.Localization;
using System.Collections.Generic;
using System.Diagnostics.CodeAnalysis;
using System.Linq;
using System.Threading.Tasks;

namespace BootstrapBlazor.Shared.Samples.Table;

/// <summary>
/// 
/// </summary>
public sealed partial class TablesFooter
{
    [Inject]
    [NotNull]
    private IStringLocalizer<Foo>? Localizer { get; set; }

    [Inject]
    [NotNull]
    private IStringLocalizer<TablesFooter>? LocalizerFooter { get; set; }

    private static IEnumerable<int> PageItemsSource => new int[] { 2, 4, 10, 20 };

    [NotNull]
    private IEnumerable<Foo>? Items { get; set; }

    [NotNull]
    private string? Left { get; set; }

    [NotNull]
    private string? Center { get; set; }

    [NotNull]
    private string? Right { get; set; }

    private Alignment Align { get; set; }

    private AggregateType Aggregate { get; set; }

    /// <summary>
    /// 
    /// </summary>
    protected override void OnInitialized()
    {
        base.OnInitialized();

        Items = Foo.GenerateFoo(Localizer);
        Left ??= LocalizerFooter[nameof(Left)];
        Center ??= LocalizerFooter[nameof(Center)];
        Right ??= LocalizerFooter[nameof(Right)];
    }

    private Task<QueryData<Foo>> OnQueryAsync(QueryPageOptions options)
    {
        // 设置记录总数
        var total = Items.Count();

        // 内存分页
        var items = Items.Skip((options.PageIndex - 1) * options.PageItems).Take(options.PageItems).ToList();

        return Task.FromResult(new QueryData<Foo>()
        {
            Items = items,
            TotalCount = total,
            IsSorted = true,
            IsFiltered = true,
            IsSearch = true
        });
    }

    private static double GetAverage(IEnumerable<Foo> items) => items.Any() ? items.Average(i => i.Count) : 0;

    private static int GetSum(IEnumerable<Foo> items) => items.Any() ? items.Sum(i => i.Count) : 0;
}