Skip to content

Commit

Permalink
fix(module: table): column title align incorrectly when filterable (#…
Browse files Browse the repository at this point in the history 
…3023)
  • Loading branch information
@ElderJames
ElderJames authored Jan 18, 2023
1 parent 95a4628 commit c35cd30
Show file tree
Hide file tree
Showing 2 changed files with 81 additions and 82 deletions.
126 changes: 64 additions & 62 deletions components/table/ActionColumn.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,82 +12,84 @@ else if (Hidden)
}
else if (IsPlaceholder)
{
<td style="padding: 0px; border: 0px; height: 0px;"></td>
<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>
<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 (AppendExpandColumn)
{
<col class="ant-table-expand-icon-col">
}

if (Width != null)
{
<col style="width: @((CssSizeLength)Width); min-width: @((CssSizeLength)Width);">
}
else
{
<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>
}
@if (AppendExpandColumn)
{
<th class="ant-table-cell ant-table-row-expand-icon-cell"></th>
}

<th class="@ClassMapper.Class" style="@FixedStyle @HeaderStyle" colspan="@HeaderColSpan">
@if (TitleTemplate != null)
{
@TitleTemplate
}
else
{
@Title
}
</th>
<th class="@ClassMapper.Class" style="@FixedStyle @HeaderStyle" colspan="@HeaderColSpan">
<span class="ant-table-column-title">
@if (TitleTemplate != null)
{
@TitleTemplate
}
else
{
@Title
}
</span>
</th>
}
else if (!IsHeader && RowSpan != 0 && ColSpan != 0)
{
@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="ToggleTreeNode"
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>
}
@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="ToggleTreeNode"
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" data-label="@Context.HeaderColumns[ColIndex].Title">
@if (ColIndex == Table.TreeExpandIconColumnIndex && Table.TreeMode)
{
<span class="ant-table-row-indent [email protected]" 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>
}
}
<td class="@ClassMapper.Class" style="@FixedStyle @Style" rowspan="@RowSpan" colspan="@ColSpan" data-label="@Context.HeaderColumns[ColIndex].Title">
@if (ColIndex == Table.TreeExpandIconColumnIndex && Table.TreeMode)
{
<span class="ant-table-row-indent [email protected]" 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)
{
var cellData = new CellData(RowData);
@CellRender(cellData)
}
else
{
@ChildContent
}
</td>
@if (CellRender != null)
{
var cellData = new CellData(RowData);
@CellRender(cellData)
}
else
{
@ChildContent
}
</td>
}
37 changes: 17 additions & 20 deletions components/table/Column.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,13 +51,9 @@ else if (IsHeader && HeaderColSpan != 0)
{
@FilterToolTipSorter
}
else if (TitleTemplate != null)
{
@TitleTemplate
}
else
{
@Title
@ColumnTitle()
}
</th>
</CascadingValue>
Expand Down Expand Up @@ -114,18 +110,23 @@ else if (IsBody && RowSpan != 0 && ColSpan != 0)

@code
{
RenderFragment ColumnTitle()
{
return @<span class="ant-table-column-title">
@if (TitleTemplate != null)
{
@TitleTemplate
}
else
{
@Title
}
</span>;
}

RenderFragment SortHeader =>
@<Template>
<span class="ant-table-column-title">
@if (TitleTemplate != null)
{
@TitleTemplate
}
else
{
@Title
}
</span>
@ColumnTitle()
@{
bool hasDescendingSorter = SortDirection.Descending.IsIn(SortDirections);
bool hasAscendingSorter = SortDirection.Ascending.IsIn(SortDirections);
Expand Down Expand Up @@ -175,13 +176,9 @@ else if (IsBody && RowSpan != 0 && ColSpan != 0)
{
@ToolTipSorter
}
else if (TitleTemplate != null)
{
@TitleTemplate
}
else
{
@Title
@ColumnTitle()
}

<Dropdown Trigger="new[] { Trigger.Click }" Visible="_filterOpened" Placement="Placement.BottomRight" OnMaskClick="() => { if (_filterOpened) FilterConfirm(); }">
Expand Down

0 comments on commit c35cd30

Please sign in to comment.