From aec8444121792b79d30dc5ac81fb87901a800262 Mon Sep 17 00:00:00 2001
From: sunlei <yemu2333@outlook.com>
Date: Wed, 3 Jun 2026 07:29:32 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=A7=84=E8=8C=83=20TSX=20=E6=B8=B2?=
 =?UTF-8?q?=E6=9F=93=E5=87=BD=E6=95=B0=E5=86=99=E6=B3=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/ktTable/KtTable.tsx        | 84 +++++++++-------
 .../ktTable/components/KtTableSettings.tsx    | 96 ++++++++++---------
 .../ktTable/components/KtTableSummary.tsx     | 17 ++--
 .../ktTable/hooks/useKtTableActions.tsx       | 18 ++--
 .../account/components/AccountConfigPanel.tsx | 71 ++++++++------
 .../src/views/qqbot/permission/list.tsx       |  8 +-
 .../src/views/system/ktTableDemo/list.tsx     | 12 +--
 7 files changed, 167 insertions(+), 139 deletions(-)

diff --git a/apps/web-antdv-next/src/components/ktTable/KtTable.tsx b/apps/web-antdv-next/src/components/ktTable/KtTable.tsx
index 51b4685..1efc542 100644
--- a/apps/web-antdv-next/src/components/ktTable/KtTable.tsx
+++ b/apps/web-antdv-next/src/components/ktTable/KtTable.tsx
@@ -630,7 +630,7 @@ export default defineComponent({
     /**
      * 渲染搜索表单区域和表单按钮。
      */
-    function renderSearchArea() {
+    const renderSearchArea = () => {
       const hasSearch = (formOptions.value.schema?.length || 0) > 0;
       const hasFormButtons = formButtons.value.length > 0;
       const hasCollapse =
@@ -677,50 +677,56 @@ export default defineComponent({
           }}
         </KtTableSearch>
       );
-    }
+    };
 
     /**
      * 渲染操作列里的行操作按钮。
      *
      * @param record 当前行数据。
      */
-    function renderActionCell(record: KtTableRecord) {
+    const renderActionCell = (record: KtTableRecord) => {
       const { inlineActions, overflowActions } = splitRowActions(
         rowActions.value,
       );
 
       return (
         <ASpace class="kt-table__row-actions" size={0}>
-          {inlineActions.map((action) => renderRowAction(action, record))}
-          {overflowActions.length > 0 ? (
-            <APopover
-              overlayClassName="kt-table__row-action-popover"
-              placement="bottomRight"
-              trigger="click"
-            >
-              {{
-                content: () => (
-                  <div class="kt-table__row-action-popover-content">
-                    {overflowActions.map((action) =>
-                      renderRowAction(action, record),
-                    )}
-                  </div>
-                ),
-                default: () => (
-                  <AButton
-                    aria-label="更多操作"
-                    class="kt-table__row-action-more"
-                    type="link"
+          {{
+            default: () => (
+              <>
+                {inlineActions.map((action) => renderRowAction(action, record))}
+                {overflowActions.length > 0 ? (
+                  <APopover
+                    overlayClassName="kt-table__row-action-popover"
+                    placement="bottomRight"
+                    trigger="click"
                   >
-                    <EllipsisOutlined class="kt-table__row-action-more-icon" />
-                  </AButton>
-                ),
-              }}
-            </APopover>
-          ) : null}
+                    {{
+                      content: () => (
+                        <div class="kt-table__row-action-popover-content">
+                          {overflowActions.map((action) =>
+                            renderRowAction(action, record),
+                          )}
+                        </div>
+                      ),
+                      default: () => (
+                        <AButton
+                          aria-label="更多操作"
+                          class="kt-table__row-action-more"
+                          type="link"
+                        >
+                          <EllipsisOutlined class="kt-table__row-action-more-icon" />
+                        </AButton>
+                      ),
+                    }}
+                  </APopover>
+                ) : null}
+              </>
+            ),
+          }}
         </ASpace>
       );
-    }
+    };
 
     /**
      * 将行操作按内联展示和弹层展示拆分。
@@ -759,7 +765,7 @@ export default defineComponent({
     /**
      * 渲染表格头部左侧业务按钮和 toolbar 插槽。
      */
-    function renderHeaderButtons() {
+    const renderHeaderButtons = () => {
       const toolbar = slots.toolbar?.(context);
       const buttons = headerButtons.value.map((button) => renderButton(button));
 
@@ -767,16 +773,22 @@ export default defineComponent({
 
       return (
         <ASpace wrap>
-          {buttons}
-          {toolbar}
+          {{
+            default: () => (
+              <>
+                {buttons}
+                {toolbar}
+              </>
+            ),
+          }}
         </ASpace>
       );
-    }
+    };
 
     /**
      * 渲染表格头部右侧设置按钮组。
      */
-    function renderHeaderSettings() {
+    const renderHeaderSettings = () => {
       if (!props.showTableSetting) return null;
 
       return (
@@ -807,7 +819,7 @@ export default defineComponent({
           visibleColumnKeys={visibleColumnKeys.value}
         />
       );
-    }
+    };
 
     /**
      * 生成表格布局监听签名，只收集会影响容器高度、横向滚动和列宽的轻量信号。
diff --git a/apps/web-antdv-next/src/components/ktTable/components/KtTableSettings.tsx b/apps/web-antdv-next/src/components/ktTable/components/KtTableSettings.tsx
index 217c5b5..a60ef0f 100644
--- a/apps/web-antdv-next/src/components/ktTable/components/KtTableSettings.tsx
+++ b/apps/web-antdv-next/src/components/ktTable/components/KtTableSettings.tsx
@@ -249,12 +249,12 @@ export default defineComponent({
      * @param icon 按钮图标节点。
      * @param onClick 点击按钮时执行的回调函数。
      */
-    function renderIconButton(
+    const renderIconButton = (
       key: string,
       title: string,
       icon: VNodeChild,
       onClick: () => void,
-    ) {
+    ) => {
       return (
         <ATooltip title={title}>
           <AButton
@@ -269,12 +269,12 @@ export default defineComponent({
           </AButton>
         </ATooltip>
       );
-    }
+    };
 
     /**
      * 渲染列设置弹层和列设置触发按钮。
      */
-    function renderColumnSetting() {
+    const renderColumnSetting = () => {
       if (!props.setting.column) return null;
 
       return (
@@ -353,51 +353,55 @@ export default defineComponent({
           }}
         </APopover>
       );
-    }
+    };
 
     return () => (
       <ASpace size={4}>
-        {props.setting.reload
-          ? renderIconButton(
-              'reload',
-              '刷新',
-              <RotateCw class="kt-table__toolbar-icon" />,
-              () => emit('reload'),
-            )
-          : null}
-        {props.setting.showSearch
-          ? renderIconButton(
-              'showSearch',
-              props.searchVisible ? '隐藏搜索' : '显示搜索',
-              props.searchVisible ? (
-                <EyeOff class="kt-table__toolbar-icon" />
-              ) : (
-                <Eye class="kt-table__toolbar-icon" />
-              ),
-              () => emit('searchVisibleChange', !props.searchVisible),
-            )
-          : null}
-        {props.setting.density
-          ? renderIconButton(
-              'density',
-              `密度：${SIZE_LABEL[props.size]}`,
-              <Menu class="kt-table__toolbar-icon" />,
-              cycleSize,
-            )
-          : null}
-        {renderColumnSetting()}
-        {props.setting.fullscreen
-          ? renderIconButton(
-              'fullscreen',
-              props.fullscreen ? '退出全屏' : '全屏',
-              props.fullscreen ? (
-                <Minimize2 class="kt-table__toolbar-icon" />
-              ) : (
-                <Fullscreen class="kt-table__toolbar-icon" />
-              ),
-              () => emit('fullscreenChange', !props.fullscreen),
-            )
-          : null}
+        {{
+          default: () => [
+            props.setting.reload
+              ? renderIconButton(
+                  'reload',
+                  '刷新',
+                  <RotateCw class="kt-table__toolbar-icon" />,
+                  () => emit('reload'),
+                )
+              : null,
+            props.setting.showSearch
+              ? renderIconButton(
+                  'showSearch',
+                  props.searchVisible ? '隐藏搜索' : '显示搜索',
+                  props.searchVisible ? (
+                    <EyeOff class="kt-table__toolbar-icon" />
+                  ) : (
+                    <Eye class="kt-table__toolbar-icon" />
+                  ),
+                  () => emit('searchVisibleChange', !props.searchVisible),
+                )
+              : null,
+            props.setting.density
+              ? renderIconButton(
+                  'density',
+                  `密度：${SIZE_LABEL[props.size]}`,
+                  <Menu class="kt-table__toolbar-icon" />,
+                  cycleSize,
+                )
+              : null,
+            renderColumnSetting(),
+            props.setting.fullscreen
+              ? renderIconButton(
+                  'fullscreen',
+                  props.fullscreen ? '退出全屏' : '全屏',
+                  props.fullscreen ? (
+                    <Minimize2 class="kt-table__toolbar-icon" />
+                  ) : (
+                    <Fullscreen class="kt-table__toolbar-icon" />
+                  ),
+                  () => emit('fullscreenChange', !props.fullscreen),
+                )
+              : null,
+          ],
+        }}
       </ASpace>
     );
   },
diff --git a/apps/web-antdv-next/src/components/ktTable/components/KtTableSummary.tsx b/apps/web-antdv-next/src/components/ktTable/components/KtTableSummary.tsx
index dace6af..430efc1 100644
--- a/apps/web-antdv-next/src/components/ktTable/components/KtTableSummary.tsx
+++ b/apps/web-antdv-next/src/components/ktTable/components/KtTableSummary.tsx
@@ -30,7 +30,10 @@ type RenderKtTableSummaryOptions = {
  * @param item 当前统计项配置。
  * @param context KtTable 运行时上下文，用于统计项读取行数据、搜索值和选择状态。
  */
-function renderStatisticValue(item: KtTableStatistic, context: KtTableContext) {
+const renderStatisticValue = (
+  item: KtTableStatistic,
+  context: KtTableContext,
+) => {
   const value =
     item.render?.(context) ??
     (typeof item.value === 'function' ? item.value(context) : item.value);
@@ -43,7 +46,7 @@ function renderStatisticValue(item: KtTableStatistic, context: KtTableContext) {
       <span>{value}</span>
     </span>
   );
-}
+};
 
 /**
  * 渲染 summary 单元格内容。
@@ -52,18 +55,18 @@ function renderStatisticValue(item: KtTableStatistic, context: KtTableContext) {
  * @param statistic 当前列匹配到的统计项配置。
  * @param showDefaultLabel 当前单元格是否需要显示默认“本页统计”文案。
  */
-function renderCellContent(
+const renderCellContent = (
   context: KtTableContext,
   statistic: KtTableStatistic | undefined,
   showDefaultLabel: boolean,
-): VNodeChild {
+): VNodeChild => {
   if (statistic) return renderStatisticValue(statistic, context);
   if (showDefaultLabel) {
     return <span class="kt-table__summary-title">本页统计</span>;
   }
 
   return null;
-}
+};
 
 /**
  * 渲染 KtTable 底部固定 summary 行。
@@ -75,7 +78,7 @@ function renderCellContent(
  * @param options.showSelection 当前表格是否启用选择列。
  * @param options.statistics 当前表格和模块提供的统计项列表。
  */
-export function renderKtTableSummary(options: RenderKtTableSummaryOptions) {
+export const renderKtTableSummary = (options: RenderKtTableSummaryOptions) => {
   const { columns, context, customSummary, showSelection, statistics } =
     options;
   if (statistics.length === 0) return customSummary;
@@ -118,4 +121,4 @@ export function renderKtTableSummary(options: RenderKtTableSummaryOptions) {
       </ATableSummaryRow>
     </ATableSummary>
   );
-}
+};
diff --git a/apps/web-antdv-next/src/components/ktTable/hooks/useKtTableActions.tsx b/apps/web-antdv-next/src/components/ktTable/hooks/useKtTableActions.tsx
index 85fd42c..f348626 100644
--- a/apps/web-antdv-next/src/components/ktTable/hooks/useKtTableActions.tsx
+++ b/apps/web-antdv-next/src/components/ktTable/hooks/useKtTableActions.tsx
@@ -79,7 +79,7 @@ export function useKtTableActions(options: UseKtTableActionsOptions) {
   /**
    * 生成 KtTable 默认查询和重置按钮。
    */
-  function getDefaultButtons(): KtTableButton[] {
+  const getDefaultButtons = (): KtTableButton[] => {
     if (!props.showDefaultButtons) return [];
 
     return [
@@ -99,7 +99,7 @@ export function useKtTableActions(options: UseKtTableActionsOptions) {
         placement: 'form',
       },
     ];
-  }
+  };
 
   /**
    * 渲染按钮图标，兼容静态图标和函数式图标。
@@ -107,13 +107,13 @@ export function useKtTableActions(options: UseKtTableActionsOptions) {
    * @param icon 按钮配置中的图标节点或图标渲染函数。
    * @param targetContext 图标渲染时使用的表格上下文。
    */
-  function renderIcon(
+  const renderIcon = (
     icon: KtTableButton['icon'],
     targetContext: KtTableContext = context,
-  ) {
+  ) => {
     if (!icon) return null;
     return typeof icon === 'function' ? icon(targetContext) : icon;
-  }
+  };
 
   /**
    * 执行头部或搜索区按钮动作。
@@ -195,7 +195,7 @@ export function useKtTableActions(options: UseKtTableActionsOptions) {
    *
    * @param button 当前按钮配置。
    */
-  function renderButton(button: KtTableButton) {
+  const renderButton = (button: KtTableButton) => {
     return (
       <AButton
         danger={button.danger}
@@ -209,7 +209,7 @@ export function useKtTableActions(options: UseKtTableActionsOptions) {
         {button.label}
       </AButton>
     );
-  }
+  };
 
   /**
    * 渲染单行操作按钮。
@@ -217,7 +217,7 @@ export function useKtTableActions(options: UseKtTableActionsOptions) {
    * @param action 当前行操作配置。
    * @param row 当前行数据。
    */
-  function renderRowAction(action: KtTableRowAction, row: KtTableRecord) {
+  const renderRowAction = (action: KtTableRowAction, row: KtTableRecord) => {
     const disabled =
       typeof action.disabled === 'function'
         ? action.disabled(row, context)
@@ -235,7 +235,7 @@ export function useKtTableActions(options: UseKtTableActionsOptions) {
         {action.label}
       </AButton>
     );
-  }
+  };
 
   return {
     formButtons,
diff --git a/apps/web-antdv-next/src/views/qqbot/account/components/AccountConfigPanel.tsx b/apps/web-antdv-next/src/views/qqbot/account/components/AccountConfigPanel.tsx
index 8a3a405..f4b8213 100644
--- a/apps/web-antdv-next/src/views/qqbot/account/components/AccountConfigPanel.tsx
+++ b/apps/web-antdv-next/src/views/qqbot/account/components/AccountConfigPanel.tsx
@@ -282,12 +282,12 @@ export default defineComponent({
       return [...map.values()];
     }
 
-    function renderBindAction(options: {
+    const renderBindAction = (options: {
       bound: boolean;
       name: string;
       onBind: () => Promise<void>;
       onUnbind: () => Promise<void>;
-    }) {
+    }) => {
       if (!options.bound) {
         return (
           <AButton onClick={options.onBind} type="link">
@@ -306,25 +306,25 @@ export default defineComponent({
           </AButton>
         </APopconfirm>
       );
-    }
+    };
 
-    function renderBoundTag(bound: boolean) {
+    const renderBoundTag = (bound: boolean) => {
       return (
         <Tag color={bound ? 'success' : 'default'}>
           {bound ? '已绑定' : '未绑定'}
         </Tag>
       );
-    }
+    };
 
-    function renderEnabledTag(enabled: boolean) {
+    const renderEnabledTag = (enabled: boolean) => {
       return (
         <Tag color={enabled ? 'success' : 'default'}>
           {enabled ? '启用' : '停用'}
         </Tag>
       );
-    }
+    };
 
-    function renderCommandTable() {
+    const renderCommandTable = () => {
       return (
         <ATable
           columns={commandColumns}
@@ -353,12 +353,15 @@ export default defineComponent({
               if (column.key === 'action') {
                 return (
                   <ASpace>
-                    {renderBindAction({
-                      bound,
-                      name: row.name || row.code,
-                      onBind: () => handleCommandBind(row),
-                      onUnbind: () => handleCommandUnbind(row),
-                    })}
+                    {{
+                      default: () =>
+                        renderBindAction({
+                          bound,
+                          name: row.name || row.code,
+                          onBind: () => handleCommandBind(row),
+                          onUnbind: () => handleCommandUnbind(row),
+                        }),
+                    }}
                   </ASpace>
                 );
               }
@@ -367,9 +370,9 @@ export default defineComponent({
           }}
         />
       );
-    }
+    };
 
-    function renderEventTable() {
+    const renderEventTable = () => {
       return (
         <ATable
           columns={eventColumns}
@@ -395,12 +398,15 @@ export default defineComponent({
               if (column.key === 'action') {
                 return (
                   <ASpace>
-                    {renderBindAction({
-                      bound: row.bound,
-                      name: row.name,
-                      onBind: () => handleEventBind(row),
-                      onUnbind: () => handleEventUnbind(row),
-                    })}
+                    {{
+                      default: () =>
+                        renderBindAction({
+                          bound: row.bound,
+                          name: row.name,
+                          onBind: () => handleEventBind(row),
+                          onUnbind: () => handleEventUnbind(row),
+                        }),
+                    }}
                   </ASpace>
                 );
               }
@@ -409,9 +415,9 @@ export default defineComponent({
           }}
         />
       );
-    }
+    };
 
-    function renderRuleTable() {
+    const renderRuleTable = () => {
       return (
         <ATable
           columns={ruleColumns}
@@ -447,12 +453,15 @@ export default defineComponent({
               if (column.key === 'action') {
                 return (
                   <ASpace>
-                    {renderBindAction({
-                      bound,
-                      name: row.name || row.keyword,
-                      onBind: () => handleRuleBind(row),
-                      onUnbind: () => handleRuleUnbind(row),
-                    })}
+                    {{
+                      default: () =>
+                        renderBindAction({
+                          bound,
+                          name: row.name || row.keyword,
+                          onBind: () => handleRuleBind(row),
+                          onUnbind: () => handleRuleUnbind(row),
+                        }),
+                    }}
                   </ASpace>
                 );
               }
@@ -461,7 +470,7 @@ export default defineComponent({
           }}
         />
       );
-    }
+    };
 
     return () => (
       <div class="qqbot-account-config-panel">
diff --git a/apps/web-antdv-next/src/views/qqbot/permission/list.tsx b/apps/web-antdv-next/src/views/qqbot/permission/list.tsx
index 2f18db8..55eb6eb 100644
--- a/apps/web-antdv-next/src/views/qqbot/permission/list.tsx
+++ b/apps/web-antdv-next/src/views/qqbot/permission/list.tsx
@@ -414,7 +414,7 @@ export default defineComponent({
     /**
      * 渲染 KtTable 表头控制区。
      */
-    function renderHeaderControls() {
+    const renderHeaderControls = () => {
       return (
         <>
           <div class="kt-table__header-control-group">
@@ -436,12 +436,12 @@ export default defineComponent({
           </div>
         </>
       );
-    }
+    };
 
     /**
      * 渲染 KtTable 按钮区里的权限过滤模式。
      */
-    function renderPermissionModeToolbar() {
+    const renderPermissionModeToolbar = () => {
       return (
         <div class="kt-table__header-control-group">
           <span class="kt-table__header-control-muted">过滤模式</span>
@@ -453,7 +453,7 @@ export default defineComponent({
           />
         </div>
       );
-    }
+    };
 
     return () => (
       <Page autoContentHeight>
diff --git a/apps/web-antdv-next/src/views/system/ktTableDemo/list.tsx b/apps/web-antdv-next/src/views/system/ktTableDemo/list.tsx
index cec6c93..d701e31 100644
--- a/apps/web-antdv-next/src/views/system/ktTableDemo/list.tsx
+++ b/apps/web-antdv-next/src/views/system/ktTableDemo/list.tsx
@@ -563,20 +563,20 @@ export default defineComponent({
       () => `请求 ${requestTimes.value} 次 / 操作 ${actionTimes.value} 次`,
     );
 
-    function renderStatus(status: DemoStatus) {
+    const renderStatus = (status: DemoStatus) => {
       const option = pickOption(statusOptions, status);
       return <Tag color={option?.color}>{option?.label || status}</Tag>;
-    }
+    };
 
-    function renderLevel(level: DemoLevel) {
+    const renderLevel = (level: DemoLevel) => {
       const option = pickOption(levelOptions, level);
       return <Tag color={option?.color}>{option?.label || level}</Tag>;
-    }
+    };
 
-    function renderChannel(channel: DemoChannel) {
+    const renderChannel = (channel: DemoChannel) => {
       const option = pickOption(channelOptions, channel);
       return <Tag color={option?.color}>{option?.label || channel}</Tag>;
-    }
+    };
 
     return () => (
       <Page autoContentHeight>