feat(Table): update auto-fit column width callback to include width (dotnetcore#6868)

* Update auto-fit column width callback to include width

Modified the OnAutoFitContentAsync callback to accept the calculated column width as a parameter in both C# and JavaScript. This allows custom logic to consider the current width when determining the final column width, improving flexibility for auto-fit scenarios.

Co-Authored-By: ljmay168 <[email protected]>

* Update OnAutoFitContentAsync to accept calcWidth parameter

Modified the UnitTest

* Update TableTest.cs

修改 单元测试宽度计算

Signed-off-by: AApuci <[email protected]>

* revert: 撤销与本 PR 无关改动

* revert: 撤销更改

* test: 代码格式化

* refactor: 弃用 OnAutoFitContentAsync 改用 OnAutoFitColumnWidthCallback 回调方法

* refactor: 更改方法名称

---------

Signed-off-by: AApuci <[email protected]>
Co-authored-by: AApuci <[email protected]>
Co-authored-by: ljmay168 <[email protected]>
Co-authored-by: Argo Zhang <[email protected]>

Author: 3 people

src/BootstrapBlazor/Components/Table/Table.razor.cs

@@ -1065,7 +1065,7 @@ private async Task OnTableRenderAsync(bool firstRender)
             await InvokeVoidAsync("init", Id, Interop, new
             {
                 DragColumnCallback = nameof(DragColumnCallback),
-                AutoFitContentCallback = OnAutoFitContentAsync == null ? null : nameof(AutoFitContentCallback),
+                AutoFitColumnWidthCallback = OnAutoFitColumnWidthCallback == null ? null : nameof(AutoFitColumnWidthCallback),
                 ResizeColumnCallback = OnResizeColumnAsync != null ? nameof(ResizeColumnCallback) : null,
                 ColumnMinWidth = ColumnMinWidth ?? Options.CurrentValue.TableSettings.ColumnMinWidth,
                 ScrollWidth = ActualScrollWidth,
@@ -1588,7 +1588,15 @@ private async Task OnContextMenu(MouseEventArgs e, TItem item)
     /// 获得/设置 自动调整列宽回调方法
     /// </summary>
     [Parameter]
-    public Func<string, Task<float>>? OnAutoFitContentAsync { get; set; }
+    [Obsolete("已弃用，请使用 OnAutoFitColumnWidthCallback 替代; Deprecated, please use OnAutoFitColumnWidthCallback instead")]
+    [ExcludeFromCodeCoverage]
+    public Func<string, float, Task<float>>? OnAutoFitContentAsync { get; set; }
+
+    /// <summary>
+    /// 获得/设置 自动调整列宽回调方法
+    /// </summary>
+    [Parameter]
+    public Func<string, float, Task<float>>? OnAutoFitColumnWidthCallback { get; set; }
 
     /// <summary>
     /// 列宽自适应方法
@@ -1648,14 +1656,15 @@ public async Task ResizeColumnCallback(int index, float width)
     /// 列宽自适应回调方法 由 JavaScript 脚本调用
     /// </summary>
     /// <param name="fieldName">当前列名称</param>
+    /// <param name="calcWidth">当前列宽</param>
     /// <returns></returns>
     [JSInvokable]
-    public async Task<float> AutoFitContentCallback(string fieldName)
+    public async Task<float> AutoFitColumnWidthCallback(string fieldName, float calcWidth)
     {
         float ret = 0;
-        if (OnAutoFitContentAsync != null)
+        if (OnAutoFitColumnWidthCallback != null)
         {
-            ret = await OnAutoFitContentAsync(fieldName);
+            ret = await OnAutoFitColumnWidthCallback(fieldName, calcWidth);
         }
         return ret;
     }

src/BootstrapBlazor/Components/Table/Table.razor.js

@@ -726,10 +726,6 @@ const indexOfCol = col => {
 
 const autoFitColumnWidth = async (table, col) => {
     const field = col.getAttribute('data-bb-field');
-    let widthValue = 0;
-    if (table.options.autoFitContentCallback !== null) {
-        widthValue = await table.invoke.invokeMethodAsync(table.options.autoFitContentCallback, field);
-    }
 
     const index = indexOfCol(col);
     let rows = null;
@@ -740,12 +736,17 @@ const autoFitColumnWidth = async (table, col) => {
         rows = table.tables[0].querySelectorAll('table > tbody > tr:not(.is-detail)');
     }
 
-    let maxWidth = widthValue;
-    if (maxWidth === 0) {
-        [...rows].forEach(row => {
-            const cell = row.cells[index];
-            maxWidth = Math.max(maxWidth, calcCellWidth(cell));
-        });
+    let maxWidth = 0;
+    [...rows].forEach(row => {
+        const cell = row.cells[index];
+        maxWidth = Math.max(maxWidth, calcCellWidth(cell));
+    });
+
+    if (table.options.autoFitColumnWidthCallback !== null) {
+        const widthValue = await table.invoke.invokeMethodAsync(table.options.autoFitColumnWidthCallback, field, maxWidth);
+        if (widthValue > 0) {
+            maxWidth = widthValue;
+        }
     }
 
     if (maxWidth > 0) {

test/UnitTest/Components/TableTest.cs

@@ -8371,7 +8371,7 @@ public void ShowRowCheckboxCallback_Ok()
     }
 
     [Fact]
-    public async Task AutoFitContentCallback_Ok()
+    public async Task OnAutoFitColumnWidthCallback_Ok()
     {
         var name = "";
         var localizer = Context.Services.GetRequiredService<IStringLocalizer<Foo>>();
@@ -8383,10 +8383,11 @@ public async Task AutoFitContentCallback_Ok()
                 pb.Add(a => a.AllowDragColumn, true);
                 pb.Add(a => a.ClientTableName, "table-unit-test");
                 pb.Add(a => a.OnQueryAsync, OnQueryAsync(localizer));
-                pb.Add(a => a.OnAutoFitContentAsync, fieldName =>
+                pb.Add(a => a.OnAutoFitColumnWidthCallback, (fieldName, calcWidth) =>
                 {
                     name = fieldName;
-                    return Task.FromResult(100.65f);
+                    var resWidth = Math.Max(100.65f, calcWidth);
+                    return Task.FromResult(resWidth);
                 });
                 pb.Add(a => a.TableColumns, foo => builder =>
                 {
@@ -8405,7 +8406,7 @@ public async Task AutoFitContentCallback_Ok()
 
         var table = cut.FindComponent<Table<Foo>>();
         float v = 0f;
-        await cut.InvokeAsync(async () => v = await table.Instance.AutoFitContentCallback("DateTime"));
+        await cut.InvokeAsync(async () => v = await table.Instance.AutoFitColumnWidthCallback("DateTime", 90));
         Assert.Equal(100.65f, v);
     }