From 1990968df61cb3152379abb79d14ecbac2462b92 Mon Sep 17 00:00:00 2001 From: Tony <6914529@qq.com> Date: Wed, 27 May 2026 10:03:16 +0800 Subject: [PATCH 1/9] =?UTF-8?q?feat(table):=E5=BD=93=E8=A1=A8=E6=A0=BC?= =?UTF-8?q?=E5=AD=98=E5=9C=A8=E5=9B=BA=E5=AE=9A=E5=88=97=E6=97=B6=EF=BC=8C?= =?UTF-8?q?=E5=8F=AA=E5=85=81=E8=AE=B8=E7=9B=B8=E5=90=8C=E5=B1=9E=E6=80=A7?= =?UTF-8?q?=E5=88=97=E4=B9=8B=E9=97=B4=E7=9B=B8=E4=BA=92=E4=BA=A4=E6=8D=A2?= =?UTF-8?q?=E5=88=97=E9=A1=BA=E5=BA=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit feat(table):当表格存在固定列时,只允许相同属性列之间相互交换列顺序 --- src/BootstrapBlazor/Components/Table/Table.razor.js | 9 +++++++++ src/BootstrapBlazor/Components/Table/TableColumn.cs | 6 ++++++ 2 files changed, 15 insertions(+) diff --git a/src/BootstrapBlazor/Components/Table/Table.razor.js b/src/BootstrapBlazor/Components/Table/Table.razor.js index 94804c8322e..7e3ab5c00d3 100644 --- a/src/BootstrapBlazor/Components/Table/Table.razor.js +++ b/src/BootstrapBlazor/Components/Table/Table.razor.js @@ -810,6 +810,7 @@ const disposeColumnDrag = columns => { const setDraggable = table => { let dragItem = null; + let dragItemIsFixed = false; // 为后面列拖动交换顺序时,判断是否为同一类型的列做准备 let index = 0 table.dragColumns = [...table.tables[0].querySelectorAll('thead > tr > th')].filter(i => i.draggable) disposeDragColumns(table.dragColumns); @@ -820,6 +821,7 @@ const setDraggable = table => { table.dragColumns = [...table.tables[0].querySelectorAll('thead > tr > th')].filter(i => i.draggable) index = table.dragColumns.indexOf(col) dragItem = col + dragItemIsFixed = col.classList.contains('fixed') ? true : false; e.dataTransfer.effectAllowed = 'move' }) EventHandler.on(col, 'dragend', () => { @@ -848,6 +850,13 @@ const setDraggable = table => { }) EventHandler.on(col, 'dragover', e => { e.preventDefault() + const isOverFixed = col.classList.contains('fixed') ? true : false; + if (dragItemIsFixed != isOverFixed) { + // 表格中只允相同属性列间相互交换顺序,即fixed列之间可以交换顺序,fixed列与非fixed列不允许交换顺序 + e.dataTransfer.dropEffect = 'none' + return false; + } + if (dragItem !== col) { e.dataTransfer.dropEffect = 'move' } diff --git a/src/BootstrapBlazor/Components/Table/TableColumn.cs b/src/BootstrapBlazor/Components/Table/TableColumn.cs index b6e28fdbc63..d5fb0ee310a 100644 --- a/src/BootstrapBlazor/Components/Table/TableColumn.cs +++ b/src/BootstrapBlazor/Components/Table/TableColumn.cs @@ -512,6 +512,12 @@ public class TableColumn : BootstrapComponentBase, ITableColumn, I /// protected override void OnInitialized() { + /* + * 表格中只允相同属性列间相互交换顺序,即fixed列之间可以交换顺序,fixed列与非fixed列不允许交换顺序 + * 当前固定列没有给定宽度时,默认宽度为100px,非固定列不设置默认宽度,原因为没给定宽度时,固定列交换列顺序后,会出现问题,导致left值计算错误,出现错位问题; + */ + Width = Fixed ? Width ?? 100 : Width; + Columns?.Add(this); if (FieldExpression != null) From a739ed40ce3638332fd57ab815c5a00efb3d2aeb Mon Sep 17 00:00:00 2001 From: Tony <6914529@qq.com> Date: Wed, 27 May 2026 23:16:39 +0800 Subject: [PATCH 2/9] =?UTF-8?q?feat(table):=E5=BD=93=E8=A1=A8=E6=A0=BC?= =?UTF-8?q?=E5=AD=98=E5=9C=A8=E5=9B=BA=E5=AE=9A=E5=88=97=E6=97=B6=EF=BC=8C?= =?UTF-8?q?=E5=8F=AA=E5=85=81=E8=AE=B8=E7=9B=B8=E5=90=8C=E5=B1=9E=E6=80=A7?= =?UTF-8?q?=E5=88=97=E4=B9=8B=E9=97=B4=E7=9B=B8=E4=BA=92=E4=BA=A4=E6=8D=A2?= =?UTF-8?q?=E5=88=97=E9=A1=BA=E5=BA=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit revert: 将数据列Fixed属性为true时,Column的Width默认宽度设置为200,保持与组件中DefaultFixedColumnWidth属性一致 --- src/BootstrapBlazor/Components/Table/TableColumn.cs | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/Table/TableColumn.cs b/src/BootstrapBlazor/Components/Table/TableColumn.cs index d5fb0ee310a..67aae30504f 100644 --- a/src/BootstrapBlazor/Components/Table/TableColumn.cs +++ b/src/BootstrapBlazor/Components/Table/TableColumn.cs @@ -514,9 +514,9 @@ protected override void OnInitialized() { /* * 表格中只允相同属性列间相互交换顺序,即fixed列之间可以交换顺序,fixed列与非fixed列不允许交换顺序 - * 当前固定列没有给定宽度时,默认宽度为100px,非固定列不设置默认宽度,原因为没给定宽度时,固定列交换列顺序后,会出现问题,导致left值计算错误,出现错位问题; + * 当前固定列没有给定宽度时,默认宽度为200px,非固定列不设置默认宽度,原因为没给定宽度时,固定列交换列顺序后,会出现问题,导致left值计算错误,出现错位问题; */ - Width = Fixed ? Width ?? 100 : Width; + Width = Fixed ? Width ?? 200 : Width; Columns?.Add(this); From 708c7efc9b2afededc1614b20ad2088f6d63143c Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 31 May 2026 11:19:17 +0800 Subject: [PATCH 3/9] =?UTF-8?q?Revert=20"feat(table):=E5=BD=93=E8=A1=A8?= =?UTF-8?q?=E6=A0=BC=E5=AD=98=E5=9C=A8=E5=9B=BA=E5=AE=9A=E5=88=97=E6=97=B6?= =?UTF-8?q?=EF=BC=8C=E5=8F=AA=E5=85=81=E8=AE=B8=E7=9B=B8=E5=90=8C=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=E5=88=97=E4=B9=8B=E9=97=B4=E7=9B=B8=E4=BA=92=E4=BA=A4?= =?UTF-8?q?=E6=8D=A2=E5=88=97=E9=A1=BA=E5=BA=8F"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This reverts commit a739ed40ce3638332fd57ab815c5a00efb3d2aeb. --- src/BootstrapBlazor/Components/Table/TableColumn.cs | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/Table/TableColumn.cs b/src/BootstrapBlazor/Components/Table/TableColumn.cs index 67aae30504f..d5fb0ee310a 100644 --- a/src/BootstrapBlazor/Components/Table/TableColumn.cs +++ b/src/BootstrapBlazor/Components/Table/TableColumn.cs @@ -514,9 +514,9 @@ protected override void OnInitialized() { /* * 表格中只允相同属性列间相互交换顺序,即fixed列之间可以交换顺序,fixed列与非fixed列不允许交换顺序 - * 当前固定列没有给定宽度时,默认宽度为200px,非固定列不设置默认宽度,原因为没给定宽度时,固定列交换列顺序后,会出现问题,导致left值计算错误,出现错位问题; + * 当前固定列没有给定宽度时,默认宽度为100px,非固定列不设置默认宽度,原因为没给定宽度时,固定列交换列顺序后,会出现问题,导致left值计算错误,出现错位问题; */ - Width = Fixed ? Width ?? 200 : Width; + Width = Fixed ? Width ?? 100 : Width; Columns?.Add(this); From b67e7b6a0e87be8f0f396440e64dac43f5eac5f0 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 31 May 2026 11:19:26 +0800 Subject: [PATCH 4/9] =?UTF-8?q?Revert=20"feat(table):=E5=BD=93=E8=A1=A8?= =?UTF-8?q?=E6=A0=BC=E5=AD=98=E5=9C=A8=E5=9B=BA=E5=AE=9A=E5=88=97=E6=97=B6?= =?UTF-8?q?=EF=BC=8C=E5=8F=AA=E5=85=81=E8=AE=B8=E7=9B=B8=E5=90=8C=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=E5=88=97=E4=B9=8B=E9=97=B4=E7=9B=B8=E4=BA=92=E4=BA=A4?= =?UTF-8?q?=E6=8D=A2=E5=88=97=E9=A1=BA=E5=BA=8F"?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This reverts commit 1990968df61cb3152379abb79d14ecbac2462b92. --- src/BootstrapBlazor/Components/Table/Table.razor.js | 9 --------- src/BootstrapBlazor/Components/Table/TableColumn.cs | 6 ------ 2 files changed, 15 deletions(-) diff --git a/src/BootstrapBlazor/Components/Table/Table.razor.js b/src/BootstrapBlazor/Components/Table/Table.razor.js index 7e3ab5c00d3..94804c8322e 100644 --- a/src/BootstrapBlazor/Components/Table/Table.razor.js +++ b/src/BootstrapBlazor/Components/Table/Table.razor.js @@ -810,7 +810,6 @@ const disposeColumnDrag = columns => { const setDraggable = table => { let dragItem = null; - let dragItemIsFixed = false; // 为后面列拖动交换顺序时,判断是否为同一类型的列做准备 let index = 0 table.dragColumns = [...table.tables[0].querySelectorAll('thead > tr > th')].filter(i => i.draggable) disposeDragColumns(table.dragColumns); @@ -821,7 +820,6 @@ const setDraggable = table => { table.dragColumns = [...table.tables[0].querySelectorAll('thead > tr > th')].filter(i => i.draggable) index = table.dragColumns.indexOf(col) dragItem = col - dragItemIsFixed = col.classList.contains('fixed') ? true : false; e.dataTransfer.effectAllowed = 'move' }) EventHandler.on(col, 'dragend', () => { @@ -850,13 +848,6 @@ const setDraggable = table => { }) EventHandler.on(col, 'dragover', e => { e.preventDefault() - const isOverFixed = col.classList.contains('fixed') ? true : false; - if (dragItemIsFixed != isOverFixed) { - // 表格中只允相同属性列间相互交换顺序,即fixed列之间可以交换顺序,fixed列与非fixed列不允许交换顺序 - e.dataTransfer.dropEffect = 'none' - return false; - } - if (dragItem !== col) { e.dataTransfer.dropEffect = 'move' } diff --git a/src/BootstrapBlazor/Components/Table/TableColumn.cs b/src/BootstrapBlazor/Components/Table/TableColumn.cs index d5fb0ee310a..b6e28fdbc63 100644 --- a/src/BootstrapBlazor/Components/Table/TableColumn.cs +++ b/src/BootstrapBlazor/Components/Table/TableColumn.cs @@ -512,12 +512,6 @@ public class TableColumn : BootstrapComponentBase, ITableColumn, I /// protected override void OnInitialized() { - /* - * 表格中只允相同属性列间相互交换顺序,即fixed列之间可以交换顺序,fixed列与非fixed列不允许交换顺序 - * 当前固定列没有给定宽度时,默认宽度为100px,非固定列不设置默认宽度,原因为没给定宽度时,固定列交换列顺序后,会出现问题,导致left值计算错误,出现错位问题; - */ - Width = Fixed ? Width ?? 100 : Width; - Columns?.Add(this); if (FieldExpression != null) From 2cea95a7b636c8970060e3ae012411cbc4ecf1cd Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 31 May 2026 13:14:51 +0800 Subject: [PATCH 5/9] =?UTF-8?q?refactor:=20=E5=9B=BA=E5=AE=9A=E5=88=97?= =?UTF-8?q?=E4=B8=8D=E5=85=81=E8=AE=B8=E6=8B=96=E5=8A=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/Table/Table.razor | 2 +- src/BootstrapBlazor/Components/Table/Table.razor.cs | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/Table/Table.razor b/src/BootstrapBlazor/Components/Table/Table.razor index ebae893fcc0..5c2bf9ccdf0 100644 --- a/src/BootstrapBlazor/Components/Table/Table.razor +++ b/src/BootstrapBlazor/Components/Table/Table.razor @@ -310,7 +310,7 @@ style="@GetFixedCellStyleString(col, ActualScrollWidth)" data-bb-field="@fieldName" TriggerClick="col.GetSortable()" OnClick="@OnClickHeader(col)" - draggable="@DraggableString"> + draggable="@GetDraggableString(col)">
@if (col.GetShowCopyColumn()) { diff --git a/src/BootstrapBlazor/Components/Table/Table.razor.cs b/src/BootstrapBlazor/Components/Table/Table.razor.cs index 82f5dc554f0..6eb243acc8b 100644 --- a/src/BootstrapBlazor/Components/Table/Table.razor.cs +++ b/src/BootstrapBlazor/Components/Table/Table.razor.cs @@ -1870,7 +1870,7 @@ private async Task OnContextMenu(MouseEventArgs e, TItem item) [Parameter] public bool AllowDragColumn { get; set; } - private string? DraggableString => AllowDragColumn ? "true" : null; + private string? GetDraggableString(ITableColumn col) => AllowDragColumn && !col.Fixed ? "true" : null; /// /// 获得/设置 拖动列结束回调方法,默认 null 可存储数据库用于服务器端保持列顺序 From e1d42e7cfab82ae804bab9ad8044f0f756997462 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 31 May 2026 13:25:22 +0800 Subject: [PATCH 6/9] =?UTF-8?q?feat:=20=E5=8F=AA=E5=85=81=E8=AE=B8?= =?UTF-8?q?=E6=8B=96=E5=8A=A8=E9=9D=9E=E5=9B=BA=E5=AE=9A=E5=88=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Table/Table.razor.cs | 31 +++++++++++++------ 1 file changed, 22 insertions(+), 9 deletions(-) diff --git a/src/BootstrapBlazor/Components/Table/Table.razor.cs b/src/BootstrapBlazor/Components/Table/Table.razor.cs index 6eb243acc8b..47616c574e7 100644 --- a/src/BootstrapBlazor/Components/Table/Table.razor.cs +++ b/src/BootstrapBlazor/Components/Table/Table.razor.cs @@ -1959,27 +1959,40 @@ public async Task ClearTableColumnClientStatus() [JSInvokable] public async Task DragColumnCallback(int originIndex, int currentIndex) { + if (!AllowDragColumn || originIndex == currentIndex) + { + return; + } + + var draggableColumnNames = GetVisibleColumns().Where(i => !i.Fixed).Select(i => i.GetFieldName()).ToList(); + var sourceName = draggableColumnNames.ElementAtOrDefault(originIndex); + var targetName = draggableColumnNames.ElementAtOrDefault(currentIndex); + if (string.IsNullOrEmpty(sourceName) || string.IsNullOrEmpty(targetName)) + { + return; + } + // 更新缓存数据中列顺序 - var visibleColumns = _tableColumnStates.Where(i => i.Visible); - var firstColumn = visibleColumns.ElementAtOrDefault(originIndex); + var firstColumn = _tableColumnStates.Find(i => i.Name == sourceName); if (firstColumn != null) { - var targetColumn = visibleColumns.ElementAtOrDefault(currentIndex); - if (targetColumn != null) + var targetState = _tableColumnStates.Find(i => i.Name == targetName); + if (targetState != null) { _tableColumnStates.Remove(firstColumn); - var pos = _tableColumnStates.IndexOf(targetColumn); + var pos = _tableColumnStates.IndexOf(targetState); _tableColumnStates.Insert(pos, firstColumn); if (OnTableColumnClientStatusChanged != null) { await OnTableColumnClientStatusChanged(firstColumn.Name, _tableColumnStateCache); } - } - _resetColumns = true; - _invoke = true; - StateHasChanged(); + _resetColumns = true; + _invoke = true; + + StateHasChanged(); + } } } From e26ea5985efe58c7df75cdf4de086846943d0352 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 31 May 2026 13:25:30 +0800 Subject: [PATCH 7/9] =?UTF-8?q?test:=20=E5=A2=9E=E5=8A=A0=E5=8D=95?= =?UTF-8?q?=E5=85=83=E6=B5=8B=E8=AF=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- test/UnitTest/Components/TableTest.cs | 69 +++++++++++++++++++++++++++ 1 file changed, 69 insertions(+) diff --git a/test/UnitTest/Components/TableTest.cs b/test/UnitTest/Components/TableTest.cs index 5d3f37f0a0d..4652c53e943 100644 --- a/test/UnitTest/Components/TableTest.cs +++ b/test/UnitTest/Components/TableTest.cs @@ -8870,6 +8870,75 @@ await cut.InvokeAsync(async () => }); } + [Fact] + public async Task AllowDragColumn_FixedColumn_Ok() + { + string? name = null; + var localizer = Context.Services.GetRequiredService>(); + var cut = Context.Render(pb => + { + pb.AddChildContent>(pb => + { + pb.Add(a => a.RenderMode, TableRenderMode.Table); + pb.Add(a => a.AllowDragColumn, true); + pb.Add(a => a.Items, Foo.GenerateFoo(localizer, 2)); + pb.Add(a => a.OnTableColumnClientStatusChanged, (fieldName, state) => + { + name = fieldName; + return Task.CompletedTask; + }); + pb.Add(a => a.TableColumns, foo => builder => + { + builder.OpenComponent>(0); + builder.AddAttribute(1, nameof(TableColumn.Field), foo.Name); + builder.AddAttribute(2, nameof(TableColumn.FieldExpression), Utility.GenerateValueExpression(foo, nameof(Foo.Name), typeof(string))); + builder.AddAttribute(3, nameof(TableColumn.Fixed), true); + builder.CloseComponent(); + + builder.OpenComponent>(4); + builder.AddAttribute(5, nameof(TableColumn.Field), foo.Address); + builder.AddAttribute(6, nameof(TableColumn.FieldExpression), Utility.GenerateValueExpression(foo, nameof(Foo.Address), typeof(string))); + builder.CloseComponent(); + + builder.OpenComponent>(7); + builder.AddAttribute(8, nameof(TableColumn.Field), foo.Count); + builder.AddAttribute(9, nameof(TableColumn.FieldExpression), Utility.GenerateValueExpression(foo, nameof(Foo.Count), typeof(int))); + builder.CloseComponent(); + }); + }); + }); + + var table = cut.FindComponent>(); + var columns = cut.FindAll("th"); + Assert.False(columns[0].HasAttribute("draggable")); + Assert.Equal("true", columns[1].GetAttribute("draggable")); + Assert.Equal("true", columns[2].GetAttribute("draggable")); + + await cut.InvokeAsync(() => table.Instance.DragColumnCallback(1, 0)); + Assert.Equal(nameof(Foo.Count), name); + columns = cut.FindAll("th"); + Assert.Equal(nameof(Foo.Name), columns[0].GetAttribute("data-bb-field")); + Assert.Equal(nameof(Foo.Count), columns[1].GetAttribute("data-bb-field")); + Assert.Equal(nameof(Foo.Address), columns[2].GetAttribute("data-bb-field")); + + await cut.InvokeAsync(() => table.Instance.DragColumnCallback(1, 0)); + Assert.Equal(nameof(Foo.Address), name); + columns = cut.FindAll("th"); + Assert.Equal(nameof(Foo.Name), columns[0].GetAttribute("data-bb-field")); + Assert.Equal(nameof(Foo.Address), columns[1].GetAttribute("data-bb-field")); + Assert.Equal(nameof(Foo.Count), columns[2].GetAttribute("data-bb-field")); + + // 测试相同列拖动 + await cut.InvokeAsync(() => table.Instance.DragColumnCallback(0, 0)); + + // 更改为不允许拖动 + table.Render(pb => + { + pb.Add(a => a.AllowDragColumn, false); + }); + await cut.InvokeAsync(() => table.Instance.DragColumnCallback(1, 0)); + } + [Fact] public async Task OnTableColumnClientStatusChanged_ResizeColumn_Ok() { From 71eba638db5c6dab46a06e663686c6368417e917 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 31 May 2026 13:25:40 +0800 Subject: [PATCH 8/9] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E7=A4=BA=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/Table/TablesColumnDrag.razor | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor b/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor index 654f4695567..adcd541ca86 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor @@ -22,10 +22,12 @@ IsMultipleSelect="true" ShowExtendButtons="false" OnQueryAsync="@OnQueryAsync"> - - + + - + + + From 90f59eed97ac30acda09b5f02c5e11b40c9be131 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 31 May 2026 13:40:30 +0800 Subject: [PATCH 9/9] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E8=AF=B4=E6=98=8E?= =?UTF-8?q?=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/Table/TablesColumnDrag.razor | 1 - src/BootstrapBlazor.Server/Locales/en-US.json | 2 +- src/BootstrapBlazor.Server/Locales/zh-CN.json | 2 +- 3 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor b/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor index adcd541ca86..fb37b4a4de0 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnDrag.razor @@ -8,7 +8,6 @@

@Localizer["TablesColumnDescription"]

-

@((MarkupString)Localizer["AllowDragOrderDesc"].Value)

diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index d8962b11c0d..b0f035df14c 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -4639,7 +4639,7 @@ }, "BootstrapBlazor.Server.Components.Samples.Table.TablesColumnDrag": { "AllowDragOrderDesc": "

Pressing the mouse over a column heading and dragging it to another column heading position can adjust the column to be in front of the target column, but the built-in columns in the Table component, such as detail row, row number, selection, and operation columns, cannot be adjusted

This example enables local storage by setting the ClientTableName parameter. After dragging and adjusting the order, the page can be refreshed, and the column order remains in the previous state

After version 10.6.1, use OnTableColumnClientStatusChanged to uniformly handle column dragging, column resizing, and auto-fit column width callbacks, replacing the original OnDragColumnEndAsync, OnResizeColumnAsync, and OnAutoFitContentAsync callbacks.

Notes:

Table state persistence has two modes. If the ClientTableName property is set, browser local storage is used to persist information. If it is not set, server-side storage persistence is implemented through callbacks. The persistence structure is TableColumnClientStatus, which consists of the column state collection and the table width parameter.

The table width parameter defaults to 0. When all columns have width values, the table width parameter is the actual width rendered on the client. A value of 0 means the table width is adaptive.

When using browser local storage for persistence, no additional settings are required. The table automatically loads the client state.

When using server-side storage for persistence, handle table state loading and saving logic in callbacks. In actual use, the state can be stored in a database or other storage as needed. Use the OnTableColumnClientStatusChanged callback to handle server-side state changes, and use the OnLoadTableColumnClientStatus callback to restore the table persistence state.

", - "AllowDragOrderIntro": "By specifying AllowDragColumn, set the table columns to allow dragging column headings to adjust the table column order", + "AllowDragOrderIntro": "By specifying AllowDragColumn, set the table columns to allow dragging column headings to adjust the table column order; The current design only supports dragging non-fixed columns.", "AllowDragOrderTitle": "Allow dragging column headings to adjust table column order", "ClearTableColumnClientStatusDesc": "By calling the ClearTableColumnClientStatus method of the table component instance, the current persistent settings are cleared, restoring the table to its default settings.", "ResetButtonText": "Reset", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index 1a5622b9e58..5ac797436c2 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -4639,7 +4639,7 @@ }, "BootstrapBlazor.Server.Components.Samples.Table.TablesColumnDrag": { "AllowDragOrderDesc": "

在列标题上按下鼠标拖动到其他列标题位置可将该列调整至目标列之前,但 Table 组件内置的列如明细行列、行号列、选择列、操作列等不可被调整

本示例通过设置 ClientTableName 参数开启了本地化存储,拖动调整顺序后,可刷新页面,列顺序是保持上次状态的

10.6.1 版本后使用 OnTableColumnClientStatusChanged 统一处理列拖拽、列宽调整与自适应列宽回调,移除原 OnDragColumnEndAsync OnResizeColumnAsyncOnAutoFitContentAsync 回调。

注意事项:

表格状态持久化功能分两种情况,设置 ClientTableName 属性即使用浏览器本地存储持久化信息,如果未设置则通过回调使用服务器端存储持久化信息。持久化信息结构体为 TableColumnClientStatus 由列状态集合以及表格宽度参数组成。

表格宽度参数默认为 0 当所有列宽度均有值时,表格宽度参数值为表格在客户端渲染的实际宽度;为 0 表示表格宽度自适应

使用浏览器本地存储持久化信息时,无需任何设置,表格会自动加载客户端状态

使用服务器端存储持久化信息时,需在回调中处理表格状态加载与保存逻辑,实际使用中可根据需要使用数据库或其他方式进行存储;通过 OnTableColumnClientStatusChanged 回调处理服务器端状态,通过 OnLoadTableColumnClientStatus 回调方法对表格进行持久化状态恢复操作

", - "AllowDragOrderIntro": "通过指定 AllowDragColumn 设置表格列允许拖动列标题调整表格列顺序", + "AllowDragOrderIntro": "通过指定 AllowDragColumn 设置表格列允许拖动列标题调整表格列顺序;目前设计上仅支持非固定列拖动", "AllowDragOrderTitle": "允许拖动列标题调整表格列顺序", "ClearTableColumnClientStatusDesc": "通过调用表格组件实例方法 ClearTableColumnClientStatus 清除当前持久化设置恢复表格为默认设置", "ResetButtonText": "重置",