@nokecy/qc-ui 1.1.67 → 1.1.69

package/dist/esm/ag-grid-plus/ag-gridPlus.js

@@ -20,7 +20,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { ModuleRegistry } from 'ag-grid-community';
 import { AgGridReact } from 'ag-grid-react';
-import { Spin, Pagination, Card, Tag, Typography, Popover, Badge, Button, theme } from 'antd';
+import { Spin, Pagination, Card, Tag, Popover, Badge, Button, theme } from 'antd';
 import React, { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { AllEnterpriseModule } from "ag-grid-enterprise";
 
@@ -36,7 +36,7 @@ import ToolBar from "./toolBar";
 import SettingItem from "./settingItem";
 import { RedoOutlined, FilterOutlined } from '@ant-design/icons';
 import { convertFilterModel, dateTimeValueFormatter, dateValueFormatter, flatten, toTree } from "./utils";
-import { mergeInferredColumnType, processEnumColumn } from "./utils/columnProcessors";
+import { mergeInferredColumnType, processEllipsisColumn, processEnumColumn } from "./utils/columnProcessors";
 import AdvancedQueryBuilder from "./queryForm/AdvancedQueryBuilder";
 import { v4 as uuidv4 } from 'uuid';
 import Setting from "./setting";
@@ -63,7 +63,6 @@ import { GridPlusError, ErrorType, ErrorSeverity } from "./errors";
 import { logger } from "./utils/logger";
 import { getEntityExtensionColumns } from "./utils/entityExtensionColumns";
 import { message } from 'antd';
-var Text = Typography.Text;
 var getSort = function getSort(columnState) {
   return columnState ? "".concat(columnState.colId, " ").concat(columnState.sort) : "";
 };
@@ -470,21 +469,7 @@ function AgGridPlus(props) {
     }
     //@ts-ignore
     if (col !== null && col !== void 0 && col.ellipsis) {
-      return _objectSpread(_objectSpread({}, mergeInferredColumnType(col, dataType)), {}, {
-        cellRenderer: function cellRenderer(_ref) {
-          var value = _ref.value;
-          return /*#__PURE__*/React.createElement(Text, {
-            ellipsis: {
-              tooltip: value
-            },
-            style: {
-              display: 'flex',
-              justifyContent: 'center',
-              alignItems: 'center'
-            }
-          }, value);
-        }
-      });
+      return processEllipsisColumn(mergeInferredColumnType(col, dataType));
     }
     if (col.cellRenderer) {
       return _objectSpread(_objectSpread({}, mergeInferredColumnType(col, dataType)), {}, {

package/dist/esm/ag-grid-plus/setting/ColumnConfigForm.js

@@ -5,7 +5,7 @@
  */
 
 import React, { useCallback } from 'react';
-import { Button, Popconfirm, Space, Tooltip } from 'antd';
+import { Button, Popconfirm, Space, Tooltip, theme } from 'antd';
 import { DeleteOutlined, HolderOutlined } from '@ant-design/icons';
 import { FormGrid, FormItem, FormLayout, Input, Select, NumberPicker, Switch } from '@formily/antd-v5';
 import { createSchemaField } from '@formily/react';
@@ -29,12 +29,14 @@ var SchemaField = createSchemaField({
  * 自定义排序抓手
  */
 var CustomSortHandle = function CustomSortHandle() {
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
   return /*#__PURE__*/React.createElement(Tooltip, {
     title: "\u62D6\u52A8\u6392\u5E8F\uFF08\u4EC5\u652F\u6301\u540C\u7EA7\uFF09"
   }, /*#__PURE__*/React.createElement(HolderOutlined, {
     style: {
       fontSize: 16,
-      color: '#999',
+      color: token.colorTextTertiary,
       cursor: 'move'
     }
   }));

package/dist/esm/ag-grid-plus/setting/ColumnConfigTable.js

@@ -20,7 +20,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
  */
 
 import React, { useCallback, useMemo, useState, useRef, useEffect } from 'react';
-import { Button, Select, Switch, Space, Popconfirm, message, Tag } from 'antd';
+import { Button, Select, Switch, Space, Popconfirm, message, Tag, theme } from 'antd';
 import { DeleteOutlined, FolderOutlined, FolderAddOutlined, FileOutlined } from '@ant-design/icons';
 import { AgGridReact } from 'ag-grid-react';
 import { generateId, normalizeCellAlign } from "./columnGroupUtils";
@@ -239,6 +239,8 @@ var ColumnConfigTable = function ColumnConfigTable(_ref2) {
     _ref2$scrollY = _ref2.scrollY,
     scrollY = _ref2$scrollY === void 0 ? 480 : _ref2$scrollY;
   var gridTheme = useAgGridTheme();
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
   var _useState = useState(items),
     _useState2 = _slicedToArray(_useState, 2),
     localItems = _useState2[0],
@@ -681,16 +683,18 @@ var ColumnConfigTable = function ColumnConfigTable(_ref2) {
     return localItems.filter(isNodeVisible);
   }, [localItems, expandedKeys, simple]);
 
-  // 添加拖拽样式
+  // 添加拖拽样式:选择器限定在本表容器(.qc-column-config-table)内,免得弹窗打开期间染到背后列表的行;
+  // 拖拽幽灵挂在 body 上,只能全局。颜色取主题 token。@author nokecy
   useEffect(function () {
     var style = document.createElement('style');
-    style.textContent = "\n      /* \u62D6\u62FD\u884C\u6837\u5F0F */\n      .ag-row-dragging {\n        opacity: 0.5;\n        transition: opacity 0.2s ease;\n      }\n\n      /* \u62D6\u62FD\u5E7D\u7075\u6837\u5F0F */\n      .ag-dnd-ghost {\n        background: #fff !important;\n        border: 2px dashed #1890ff !important;\n        border-radius: 4px !important;\n        padding: 8px !important;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;\n        opacity: 0.9 !important;\n        font-size: 14px !important;\n      }\n\n      /* \u53EF\u653E\u7F6E\u76EE\u6807\u9AD8\u4EAE */\n      .ag-row-hover.ag-row {\n        background-color: #e6f7ff !important;\n        transition: background-color 0.2s ease;\n      }\n\n      /* \u5206\u7EC4\u884C\u7279\u6B8A\u9AD8\u4EAE */\n      .ag-row-hover.ag-row[row-id*=\"group\"] {\n        background-color: #bae7ff !important;\n        border: 2px solid #1890ff;\n        transition: all 0.2s ease;\n      }\n\n      /* \u884C\u52A8\u753B */\n      .ag-row {\n        transition: transform 0.3s ease, opacity 0.3s ease;\n      }\n\n      /* \u62D6\u62FD\u624B\u67C4\u6837\u5F0F */\n      .ag-row .ag-cell[col-id=\"type\"] {\n        cursor: grab !important;\n      }\n\n      .ag-row-dragging .ag-cell[col-id=\"type\"] {\n        cursor: grabbing !important;\n      }\n    ";
+    style.textContent = "\n      /* \u62D6\u62FD\u884C\u6837\u5F0F */\n      .qc-column-config-table .ag-row-dragging {\n        opacity: 0.5;\n        transition: opacity 0.2s ease;\n      }\n\n      /* \u62D6\u62FD\u5E7D\u7075\u6837\u5F0F */\n      .ag-dnd-ghost {\n        background: ".concat(token.colorBgElevated, " !important;\n        color: ").concat(token.colorText, " !important;\n        border: 2px dashed ").concat(token.colorPrimary, " !important;\n        border-radius: 4px !important;\n        padding: 8px !important;\n        box-shadow: ").concat(token.boxShadowSecondary, " !important;\n        opacity: 0.9 !important;\n        font-size: 14px !important;\n      }\n\n      /* \u53EF\u653E\u7F6E\u76EE\u6807\u9AD8\u4EAE */\n      .qc-column-config-table .ag-row-hover.ag-row {\n        background-color: ").concat(token.controlItemBgHover, " !important;\n        transition: background-color 0.2s ease;\n      }\n\n      /* \u5206\u7EC4\u884C\u7279\u6B8A\u9AD8\u4EAE */\n      .qc-column-config-table .ag-row-hover.ag-row[row-id*=\"group\"] {\n        background-color: ").concat(token.controlItemBgActive, " !important;\n        border: 2px solid ").concat(token.colorPrimary, ";\n        transition: all 0.2s ease;\n      }\n\n      /* \u884C\u52A8\u753B */\n      .qc-column-config-table .ag-row {\n        transition: transform 0.3s ease, opacity 0.3s ease;\n      }\n\n      /* \u62D6\u62FD\u624B\u67C4\u6837\u5F0F */\n      .qc-column-config-table .ag-row .ag-cell[col-id=\"type\"] {\n        cursor: grab !important;\n      }\n\n      .qc-column-config-table .ag-row-dragging .ag-cell[col-id=\"type\"] {\n        cursor: grabbing !important;\n      }\n    ");
     document.head.appendChild(style);
     return function () {
       document.head.removeChild(style);
     };
-  }, []);
+  }, [token]);
   return /*#__PURE__*/React.createElement("div", {
+    className: "qc-column-config-table",
     style: {
       width: '100%'
     }

package/dist/esm/ag-grid-plus/setting/ColumnNameCellRenderer.js

@@ -15,7 +15,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
  */
 
 import React, { useState, useCallback, useMemo } from 'react';
-import { Input, Typography, Button, Tooltip } from 'antd';
+import { Input, Typography, Button, Tooltip, theme } from 'antd';
 import { UndoOutlined, InfoCircleOutlined, HolderOutlined } from '@ant-design/icons';
 var Text = Typography.Text;
 /**
@@ -27,6 +27,9 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
     expandedKeys = props.expandedKeys,
     onToggleExpand = props.onToggleExpand,
     allItems = props.allItems;
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
+
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isEditing = _useState2[0],
@@ -111,7 +114,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
       width: 16,
       display: 'inline-block',
       fontSize: '12px',
-      color: '#666'
+      color: token.colorTextSecondary
     }
   }, isExpanded ? '▼' : '▶') : /*#__PURE__*/React.createElement("span", {
     style: {
@@ -120,7 +123,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
     }
   }), /*#__PURE__*/React.createElement(HolderOutlined, {
     style: {
-      color: '#999',
+      color: token.colorTextTertiary,
       cursor: 'grab',
       fontSize: '14px'
     }
@@ -143,7 +146,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
     type: "secondary",
     style: {
       fontSize: '11px',
-      color: '#8c8c8c',
+      color: token.colorTextTertiary,
       lineHeight: '16px'
     }
   }, "\u539F\u59CB: ", item.originalHeaderName), /*#__PURE__*/React.createElement(Tooltip, {
@@ -151,7 +154,7 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
   }, /*#__PURE__*/React.createElement(InfoCircleOutlined, {
     style: {
       fontSize: '11px',
-      color: '#1890ff',
+      color: token.colorPrimary,
       cursor: 'help'
     }
   }))), /*#__PURE__*/React.createElement("div", {
@@ -173,10 +176,10 @@ export var ColumnNameCellRenderer = function ColumnNameCellRenderer(props) {
       flex: 1,
       fontSize: '14px',
       fontWeight: item.type === 'group' ? 600 : 400,
-      borderBottom: isEditing ? '1px solid #1890ff' : '1px solid transparent',
+      borderBottom: isEditing ? "1px solid ".concat(token.colorPrimary) : '1px solid transparent',
       transition: 'border-color 0.2s',
       padding: '0 4px',
-      color: isModified ? '#1890ff' : 'rgba(0, 0, 0, 0.85)'
+      color: isModified ? token.colorPrimary : token.colorText
     }
   }), isModified && /*#__PURE__*/React.createElement(Tooltip, {
     title: "\u91CD\u7F6E\u4E3A\u539F\u59CB\u540D\u79F0"

package/dist/esm/ag-grid-plus/setting/ColumnSetting.js

@@ -25,7 +25,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useState, useCallback, useMemo, useEffect } from 'react';
 import { logger } from "../utils/logger";
-import { Modal, Tabs, Space, Button, Input, message, Popconfirm, Tag, Tooltip, Empty } from 'antd';
+import { Modal, Tabs, Space, Button, Input, message, Popconfirm, Tag, Tooltip, Empty, theme } from 'antd';
 import { SaveOutlined, ReloadOutlined, EditOutlined, DeleteOutlined, StarOutlined, StarFilled, SearchOutlined,
 // 全局配置相关图标
 GlobalOutlined, RollbackOutlined, ClearOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
@@ -52,6 +52,8 @@ var ColumnSetting = function ColumnSetting(_ref) {
     onSaveColumnState = _ref.onSaveColumnState,
     allColDefsProp = _ref.allColDefs;
   var gridTheme = useAgGridTheme();
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
   // 使用新的集中式方案管理 API（包含状态数据和操作方法）
   var _useGridSchemes = useGridSchemes(),
     columnSchemes = _useGridSchemes.columnSchemes,
@@ -946,7 +948,7 @@ var ColumnSetting = function ColumnSetting(_ref) {
       title: '重置所有用户配置',
       content: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("p", {
         style: {
-          color: '#ff4d4f',
+          color: token.colorError,
           fontWeight: 'bold'
         }
       }, "\u6B64\u64CD\u4F5C\u4E0D\u53EF\u6062\u590D\uFF01"), /*#__PURE__*/React.createElement("p", null, "\u786E\u5B9A\u8981\u5220\u9664\u6240\u6709\u7528\u6237\u7684\u4E2A\u4EBA\u5217\u914D\u7F6E\u5417\uFF1F"), /*#__PURE__*/React.createElement("p", null, "\u6267\u884C\u540E\uFF0C\u6240\u6709\u7528\u6237\u5C06\u4F7F\u7528\u5168\u5C40\u9ED8\u8BA4\u914D\u7F6E\u3002")),
@@ -1177,7 +1179,7 @@ var ColumnSetting = function ColumnSetting(_ref) {
         marginLeft: 16,
         fontSize: 14,
         fontWeight: 'normal',
-        color: '#1890ff'
+        color: token.colorPrimary
       }
     }, "- \u5F53\u524D\u65B9\u6848: ", currentScheme.name, isUsingGlobalFallback && currentScheme.isGlobal && /*#__PURE__*/React.createElement(Tag, {
       color: "orange",

package/dist/esm/ag-grid-plus/setting/MoveNodeModal.js

@@ -4,7 +4,7 @@
  */
 
 import React, { useMemo } from 'react';
-import { Modal, Tree, message } from 'antd';
+import { Modal, Tree, message, theme } from 'antd';
 import { FolderOutlined, FileOutlined } from '@ant-design/icons';
 import DraggableModal from "../../draggableModal";
 var MoveNodeModal = function MoveNodeModal(_ref) {
@@ -13,6 +13,8 @@ var MoveNodeModal = function MoveNodeModal(_ref) {
     allItems = _ref.allItems,
     onCancel = _ref.onCancel,
     onConfirm = _ref.onConfirm;
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
   /**
    * 将扁平数据转换为 Tree 结构
    */
@@ -133,7 +135,7 @@ var MoveNodeModal = function MoveNodeModal(_ref) {
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       marginBottom: 16,
-      color: '#666'
+      color: token.colorTextSecondary
     }
   }, "\u8BF7\u9009\u62E9\u76EE\u6807\u7236\u8282\u70B9(\u53EA\u80FD\u9009\u62E9\u5206\u7EC4\u8282\u70B9):"), /*#__PURE__*/React.createElement(Tree, {
     showIcon: true,

package/dist/esm/ag-grid-plus/setting/NameColumnRenderer.js

@@ -4,7 +4,7 @@
  */
 
 import React from 'react';
-import { Input, Tag } from 'antd';
+import { Input, Tag, theme } from 'antd';
 import { FolderOutlined, FileOutlined } from '@ant-design/icons';
 /**
  * 名称列渲染组件
@@ -18,6 +18,8 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
   var type = record.type,
     level = record.level,
     _isNew = record._isNew;
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
 
   // 计算缩进（每层 20px）
   var indent = level * 20;
@@ -38,12 +40,12 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
   // 节点类型图标
   var NodeIcon = type === 'group' ? /*#__PURE__*/React.createElement(FolderOutlined, {
     style: {
-      color: '#1890ff',
+      color: token.colorPrimary,
       fontSize: 14
     }
   }) : /*#__PURE__*/React.createElement(FileOutlined, {
     style: {
-      color: '#52c41a',
+      color: token.colorSuccess,
       fontSize: 14
     }
   });
@@ -56,7 +58,7 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
     }
   }, level > 0 && /*#__PURE__*/React.createElement("span", {
     style: {
-      color: '#999',
+      color: token.colorTextTertiary,
       fontFamily: 'monospace',
       fontSize: 12,
       flexShrink: 0
@@ -80,7 +82,7 @@ var NameColumnRenderer = function NameColumnRenderer(_ref) {
     placeholder: type === 'group' ? '请输入分组名称' : '请输入列名称',
     style: {
       flex: 1,
-      background: _isNew ? '#fff7e6' : 'transparent' // 新添加的节点高亮
+      background: _isNew ? token.colorWarningBg : 'transparent' // 新添加的节点高亮
     }
   }));
 };

package/dist/esm/ag-grid-plus/setting/QuerySchemeManager.js

@@ -25,7 +25,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useState, useCallback, useMemo, useRef } from 'react';
-import { Tabs, Button, Input, Space, message, Popconfirm, Tag, Tooltip, Switch } from 'antd';
+import { Tabs, Button, Input, Space, message, Popconfirm, Tag, Tooltip, Switch, theme } from 'antd';
 import DraggableModal from "../../draggableModal";
 import { EditOutlined, DeleteOutlined, StarOutlined, StarFilled } from '@ant-design/icons';
 import { AgGridReact } from 'ag-grid-react';
@@ -51,6 +51,8 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
     visible = _ref.visible,
     onClose = _ref.onClose;
   var gridTheme = useAgGridTheme();
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 颜色取主题 token,跟随亮/暗主题 @author nokecy
   // 获取方案管理 API
   var _useGridSchemes = useGridSchemes(),
     querySchemes = _useGridSchemes.querySchemes,
@@ -599,7 +601,7 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
     }
     return /*#__PURE__*/React.createElement(Space, null, scheme.isDefault && /*#__PURE__*/React.createElement(StarFilled, {
       style: {
-        color: '#faad14'
+        color: token.colorWarning
       }
     }), /*#__PURE__*/React.createElement("span", null, scheme.name), isCurrent && /*#__PURE__*/React.createElement(Tag, {
       color: "blue"
@@ -701,7 +703,7 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
         marginLeft: 16,
         fontSize: 14,
         fontWeight: 'normal',
-        color: '#1890ff'
+        color: token.colorPrimary
       }
     }, "- \u5F53\u524D\u65B9\u6848: ", currentScheme.name)),
     open: visible,
@@ -722,30 +724,30 @@ var QuerySchemeManager = function QuerySchemeManager(_ref) {
         style: {
           marginBottom: 16,
           padding: '12px 16px',
-          background: currentScheme ? '#e6f7ff' : '#f5f5f5',
+          background: currentScheme ? token.colorPrimaryBg : token.colorFillTertiary,
           borderRadius: 4,
           border: '1px solid',
-          borderColor: currentScheme ? '#91d5ff' : '#d9d9d9'
+          borderColor: currentScheme ? token.colorPrimaryBorder : token.colorBorder
         }
       }, currentScheme ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
         style: {
           fontWeight: 600,
           marginBottom: 4,
-          color: '#1890ff'
+          color: token.colorPrimary
         }
       }, "\u5F53\u524D\u65B9\u6848: ", currentScheme.name), currentScheme.description && /*#__PURE__*/React.createElement("div", {
         style: {
           fontSize: 12,
-          color: '#666'
+          color: token.colorTextSecondary
         }
       }, currentScheme.description)) : /*#__PURE__*/React.createElement("div", {
         style: {
-          color: '#666'
+          color: token.colorTextSecondary
         }
       }, "\u672A\u9009\u62E9\u65B9\u6848 - \u4F7F\u7528\u4E34\u65F6\u914D\u7F6E")), /*#__PURE__*/React.createElement("div", {
         style: {
           marginBottom: 16,
-          color: '#666'
+          color: token.colorTextSecondary
         }
       }, "\u62D6\u62FD\u4E0B\u65B9\u67E5\u8BE2\u9879\u8C03\u6574\u987A\u5E8F\uFF0C\u4F7F\u7528\u5F00\u5173\u63A7\u5236\u663E\u793A/\u9690\u85CF\uFF0C\u5B8C\u6210\u540E\u53EF\u5E94\u7528\u6216\u4FDD\u5B58\u4E3A\u65B9\u6848"), /*#__PURE__*/React.createElement("div", {
         style: {

package/dist/esm/ag-grid-plus/utils/columnProcessors.js

@@ -207,6 +207,8 @@ export function processEllipsisColumn(col) {
     return col;
   }
   return _objectSpread(_objectSpread({}, col), {}, {
+    // 块级占满单元格,对齐继承单元格的 text-align(列方案的左/中/右对齐、数字列右对齐);
+    // 以前写死 flex 居中,列方案选左对齐也居中,且 flex 容器里省略号不截断。@author nokecy
     cellRenderer: function cellRenderer(_ref) {
       var value = _ref.value;
       return /*#__PURE__*/React.createElement(Text, {
@@ -214,9 +216,10 @@ export function processEllipsisColumn(col) {
           tooltip: value
         },
         style: {
-          display: 'flex',
-          justifyContent: 'center',
-          alignItems: 'center'
+          display: 'block',
+          width: '100%',
+          color: 'inherit',
+          lineHeight: 'inherit'
         }
       }, value);
     }

package/dist/esm/array-table/index.js

@@ -19,6 +19,7 @@ import { connect, mapProps, mapReadPretty } from "@formily/react";
 import uniqueId from "lodash/uniqueId";
 import { useAddition, buildArrayTableColumns, useArrayTableSources, useArrayTableActions, isColumnComponent } from "./utils";
 import { groupColumnDefs } from "./columnGroup";
+import { ARRAY_TABLE_INDEX_FIELD, hasOwnIndexColumn, makeIndexColumn } from "./indexColumn";
 import { useCellFocus, useKeyboardNavigation, useRowDrag, suppressNativeInputKeys } from "./hooks";
 import ArrayBase from "./arrayBase";
 import ArrayAddBtn from "./arrayAddBtn";
@@ -130,8 +131,13 @@ var ArrayTableInner = observer(function (props) {
    * 列的状态(宽度、顺序、隐藏等)由方案通过 applyColumnState 控制，不需要通过 columnDefs 传递
    */
   var stableColumnDefs = useMemo(function () {
+    var _buildArrayTableColum;
     // 只依赖 sources，不依赖 dataSource 和 field.value
-    var cols = buildArrayTableColumns([], field, sources);
+    var cols = (_buildArrayTableColum = buildArrayTableColumns([], field, sources)) !== null && _buildArrayTableColum !== void 0 ? _buildArrayTableColum : [];
+    // 默认在最左加序号列;schema 里已经放了 ArrayTable.Index 的不再加。@author nokecy
+    if (cols.length > 0 && !hasOwnIndexColumn(sources)) {
+      cols.unshift(makeIndexColumn());
+    }
     //@ts-ignore
     if (cols.length > 0 && props.onRowDrag) {
       //@ts-ignore
@@ -365,6 +371,14 @@ var ArrayTableInner = observer(function (props) {
     },
     onRowDragMove: handleRowDragMove,
     onRowDataUpdated: function onRowDataUpdated(e) {
+      // 增删行、拖动换行后行位置变了,未改动的行不会自己重算序号,统一刷新序号列 @author nokecy
+      if (stableColumnDefs.some(function (c) {
+        return (c === null || c === void 0 ? void 0 : c.field) === ARRAY_TABLE_INDEX_FIELD;
+      })) {
+        e.api.refreshCells({
+          columns: [ARRAY_TABLE_INDEX_FIELD]
+        });
+      }
       if (isAdd) {
         var _apiRef$current;
         (_apiRef$current = apiRef.current) === null || _apiRef$current === void 0 || _apiRef$current.ensureIndexVisible(dataSource.length - 1, "bottom");

package/dist/esm/array-table/indexColumn.d.ts

@@ -0,0 +1,17 @@
+import type { ColDef } from 'ag-grid-community';
+/** 默认序号列的字段名;不对应任何数据字段,值由 valueGetter 按行位置生成 */
+export declare const ARRAY_TABLE_INDEX_FIELD = "__arrayTableIndex";
+/**
+ * 表格是否已经自己写了序号列(某个可见列里放了 ArrayTable.Index)。
+ * 写了就不再加默认序号列,免得出现两列序号;「行号」等业务数据列不算序号列。@author nokecy
+ */
+export declare const hasOwnIndexColumn: (sources: Array<{
+    schema: any;
+    display?: string;
+}>) => boolean;
+/**
+ * 默认序号列:按行在表格里的位置编号(1 起),不依赖业务行号或主键,与列表页的序号一致。
+ * 固定在最左、不可隐藏/拖动/排序;合计等固定行不编号。
+ * 增删行、拖动换行后由 ArrayTable 在 onRowDataUpdated 里刷新本列,见 index.tsx。@author nokecy
+ */
+export declare const makeIndexColumn: () => ColDef;

package/dist/esm/array-table/indexColumn.js

@@ -0,0 +1,52 @@
+/** 默认序号列的字段名;不对应任何数据字段,值由 valueGetter 按行位置生成 */
+export var ARRAY_TABLE_INDEX_FIELD = '__arrayTableIndex';
+
+/** schema 里含 ArrayTable.Index / ArrayBase.Index 之类的序号组件 */
+var containsIndexComponent = function containsIndexComponent(schema) {
+  var _schema$properties;
+  if (!schema) return false;
+  var component = schema['x-component'];
+  if (typeof component === 'string' && /(?:^|\.)Index$/.test(component)) return true;
+  return Object.values((_schema$properties = schema.properties) !== null && _schema$properties !== void 0 ? _schema$properties : {}).some(containsIndexComponent);
+};
+
+/**
+ * 表格是否已经自己写了序号列(某个可见列里放了 ArrayTable.Index)。
+ * 写了就不再加默认序号列,免得出现两列序号;「行号」等业务数据列不算序号列。@author nokecy
+ */
+export var hasOwnIndexColumn = function hasOwnIndexColumn(sources) {
+  return sources.some(function (_ref) {
+    var schema = _ref.schema,
+      display = _ref.display;
+    return (!display || display === 'visible') && containsIndexComponent(schema);
+  });
+};
+
+/**
+ * 默认序号列:按行在表格里的位置编号(1 起),不依赖业务行号或主键,与列表页的序号一致。
+ * 固定在最左、不可隐藏/拖动/排序;合计等固定行不编号。
+ * 增删行、拖动换行后由 ArrayTable 在 onRowDataUpdated 里刷新本列,见 index.tsx。@author nokecy
+ */
+export var makeIndexColumn = function makeIndexColumn() {
+  return {
+    field: ARRAY_TABLE_INDEX_FIELD,
+    headerName: '序号',
+    width: 60,
+    pinned: 'left',
+    lockPosition: 'left',
+    lockPinned: true,
+    lockVisible: true,
+    suppressMovable: true,
+    suppressColumnsToolPanel: true,
+    sortable: false,
+    filter: false,
+    resizable: false,
+    editable: false,
+    valueGetter: function valueGetter(params) {
+      var _params$node, _params$node2;
+      if ((_params$node = params.node) !== null && _params$node !== void 0 && _params$node.rowPinned) return '';
+      var rowIndex = (_params$node2 = params.node) === null || _params$node2 === void 0 ? void 0 : _params$node2.rowIndex;
+      return rowIndex == null ? '' : rowIndex + 1;
+    }
+  };
+};

package/dist/esm/array-table/readOnlyFormatters.d.ts

@@ -5,6 +5,14 @@ export type ReadOnlyFormatterCtx = {
     fieldSchema: any;
 };
 export type ReadOnlyFormatter = (value: any, ctx: ReadOnlyFormatterCtx) => string;
+/**
+ * 兜底格式化器:注册表里没有的组件(业务自定义的选择器、输入框等),可编辑列按它出懒挂载文本。
+ *
+ * 显示与控件失焦时看到的一致:原始值原样显示;labelInValue 对象 / 解构字段({value,label})显示 label,
+ * 没有 label 才显示 value;数组逐个显示后逗号拼接。显示需要按编码查名称等特殊逻辑的组件,
+ * 消费方用 registerReadOnlyFormatter 注册专用格式化器覆盖。@author nokecy
+ */
+export declare const fallbackFormatter: ReadOnlyFormatter;
 /** 消费方扩展自定义只读列的显示逻辑 */
 export declare const registerReadOnlyFormatter: (component: string, formatter: ReadOnlyFormatter) => void;
 /**

package/dist/esm/array-table/readOnlyFormatters.js

@@ -94,6 +94,28 @@ var registry = {
   Checkbox: booleanFormatter
 };
 
+/**
+ * 兜底格式化器:注册表里没有的组件(业务自定义的选择器、输入框等),可编辑列按它出懒挂载文本。
+ *
+ * 显示与控件失焦时看到的一致:原始值原样显示;labelInValue 对象 / 解构字段({value,label})显示 label,
+ * 没有 label 才显示 value;数组逐个显示后逗号拼接。显示需要按编码查名称等特殊逻辑的组件,
+ * 消费方用 registerReadOnlyFormatter 注册专用格式化器覆盖。@author nokecy
+ */
+export var fallbackFormatter = function fallbackFormatter(value, ctx) {
+  if (value == null || value === '') return '';
+  if (Array.isArray(value)) return value.map(function (v) {
+    return fallbackFormatter(v, ctx);
+  }).filter(Boolean).join(', ');
+  if (typeof value === 'boolean') return booleanFormatter(value, ctx);
+  if (_typeof(value) === 'object') {
+    var _value$label2;
+    if (typeof value.format === 'function') return dateFormatter(value, ctx);
+    var shown = (_value$label2 = value.label) !== null && _value$label2 !== void 0 ? _value$label2 : value.value;
+    return shown == null ? '' : String(shown);
+  }
+  return String(value);
+};
+
 /** 消费方扩展自定义只读列的显示逻辑 */
 export var registerReadOnlyFormatter = function registerReadOnlyFormatter(component, formatter) {
   registry[component] = formatter;