ant-design-blazor/components/table/Column.razor

@namespace AntDesign
@inherits ColumnBase
@using AntDesign.Core.Helpers
@using AntDesign.TableModels
@typeparam TData

@if (IsInitialize)
{
    return;
}
else if (IsPlaceholder)
{
    <td style="padding: 0px; border: 0px; height: 0px;"></td>
}
else if (IsMeasure)
{
    <td style="padding: 0px; border: 0px; height: 0px;"><div style="height: 0px; overflow: hidden;">&nbsp;</div></td>
}
else if (IsColGroup)
{
    @if (AppendExpandColumn)
    {
        <col class="ant-table-expand-icon-col">
    }

    if (Width != null)
    {
        <col style="width: @((CssSizeLength)Width); min-width: @((CssSizeLength)Width);">
    }
    else
    {
        <col />
    }
}
else if (IsHeader && HeaderColSpan != 0)
{

    @if (AppendExpandColumn)
    {
        <th class="ant-table-cell ant-table-row-expand-icon-cell"></th>
    }

    <th class="@ClassMapper.Class" style="@FixedStyle @HeaderStyle" @onclick="HandelHeaderClick" colspan="@HeaderColSpan" title="@(Ellipsis?HeaderTitle:"")">
        @if (Sortable)
        {
            if (ShowSorterTooltip)
            {
                @ToolTipSorter(this)
            }
            else
            {
                @SortHeader(this)
            }
        }
        else if (TitleTemplate != null)
        {
            @TitleTemplate
        }
        else
        {
            @HeaderTitle
        }
    </th>
}
else if (IsBody && RowSpan != 0 && ColSpan != 0)
{

    var fieldText = !string.IsNullOrWhiteSpace(Format) ? Formatter<TData>.Format(Field, Format) : Field?.ToString();

    @if (AppendExpandColumn)
    {
        <td class="ant-table-cell ant-table-row-expand-icon-cell">
            @if (Table.RowExpandable(RowData) && (!Table.TreeMode || !RowData.HasChildren))
            {
                <button type="button" @onclick="()=> RowData.Expanded = !RowData.Expanded"
                        class="ant-table-row-expand-icon @(RowData.Expanded?"ant-table-row-expand-icon-expanded":"ant-table-row-expand-icon-collapsed")"
                        aria-label="@(RowData.Expanded?Table.Locale.Collapse:Table.Locale.Expand)"></button>
            }
        </td>
    }

    <td class="@ClassMapper.Class" style="@FixedStyle @Style" rowspan="@RowSpan" colspan="@ColSpan" title="@(Ellipsis? fieldText:"")">
        @if (ColIndex == Table.TreeExpandIconColumnIndex && Table.TreeMode)
        {
            <span class="ant-table-row-indent indent-level-@RowData.Level" style="padding-left: @((CssSizeLength)(RowData.Level * Table.IndentSize));"></span>
            @if (RowData.HasChildren)
            {
                <button type="button" @onclick="ToggleTreeNode" class="ant-table-row-expand-icon @(RowData?.Expanded==true?"ant-table-row-expand-icon-expanded":"ant-table-row-expand-icon-collapsed")" aria-label="@(RowData?.Expanded==true?Table.Locale.Collapse:Table.Locale.Expand)"></button>
            }
            else
            {
                <button type="button" class="ant-table-row-expand-icon ant-table-row-expand-icon-spaced" aria-label="@Table.Locale.Expand"></button>
            }
        }

        @if (CellRender != null)
        {
            @CellRender(Field)
        }
        else if (ChildContent != null)
        {
            @ChildContent
        }
        else
        {
            if (!string.IsNullOrWhiteSpace(Format))
            {
                @(Formatter<TData>.Format(GetValue != null ? GetValue(RowData) : Field, Format))
            }
            else
            {
                @(GetValue != null ? GetValue(RowData) : Field)
            }
        }
    </td>
}

@code
{

    string HeaderTitle => Title ?? DisplayName ?? FieldName ?? DataIndex;


    readonly RenderFragment<Column<TData>> SortHeader = col =>
    @<div class="ant-table-column-sorters">
        <span>
            @if (col.TitleTemplate != null)@col.TitleTemplate else @col.HeaderTitle
        </span>
        @{ 
            bool hasDescendingSorter = SortDirection.Descending.IsIn(col.SortDirections);
            bool hasAscendingSorter = SortDirection.Ascending.IsIn(col.SortDirections);
        }
        <span class="ant-table-column-sorter @((hasDescendingSorter && hasAscendingSorter)?"ant-table-column-sorter-full":"")">
            <span class="ant-table-column-sorter-inner">
                @if (hasAscendingSorter)
                {
                    <Icon Type="caret-up" Class=@($"ant-table-column-sorter-up {(col._sortDirection == SortDirection.Ascending? "active":"")}") />
                }
                @if (hasDescendingSorter)
                {
                    <Icon Type="caret-down" Class=@($"ant-table-column-sorter-down {(col._sortDirection == SortDirection.Descending ? "active" : "")}") />
                }
            </span>
        </span>
    </div>;

    readonly RenderFragment<Column<TData>> ToolTipSorter = col =>
    @<Tooltip Title="@col.SorterTooltip">
        <Unbound>
            <div class="ant-table-column-sorters-with-tooltip" @ref="context.Current">
                @col.SortHeader(col)
            </div>
        </Unbound>
    </Tooltip>;

}