@zat-design/sisyphus-react 4.5.0-beta.2 → 4.5.0

package/es/ProEditTable/components/Validator/index.js

@@ -22,7 +22,7 @@ const Validator = ({
     const {
       hasError,
       firstErrorIndex,
-      firstErrorRowKey
+      firstErrorColumnKey
     } = await runUnifiedValidation({
       form: config.form,
       name: config.name,
@@ -38,9 +38,9 @@ const Validator = ({
           config?.tableRef?.current?.scrollTo?.({
             index: firstErrorIndex
           });
-          // 横向：等错误行渲染后，下一帧把错误列滚入视口（虚拟表格横向需 scrollTo({ left })）
+          // 横向：把报错列滚入视口（虚拟表格列被虚拟化，按表头列宽算 scrollLeft，与行渲染无关）
           requestAnimationFrame(() => {
-            scrollVirtualToErrorColumn(config?.tableRef, firstErrorRowKey);
+            scrollVirtualToErrorColumn(config?.tableRef, columns || [], firstErrorColumnKey);
           });
         });
       }

package/es/ProEditTable/utils/tools.d.ts

@@ -90,16 +90,22 @@ export declare const getDisabled: ({ globalControl, formDisabled, column, tabled
  */
 export declare const handleScrollToError: () => void;
 /**
- * 虚拟表格：横向滚动定位到「首个错误行」内的报错单元格。
+ * 把「首个报错列的 cellKey」映射成它在表头 th 中的可见列索引。
+ * 列序 = [选择列?(hasSelection 时占位 1), ...用户列]；names 列的 cellKey 用 splitNames 结果。
+ * @returns 表头 th 下标；未命中返回 -1
+ */
+export declare const resolveErrorColumnIndex: (columns: any[], cellKey: string, hasSelection: boolean) => number;
+/**
+ * 虚拟表格：横向滚动定位到「首个报错列」。
  *
- * 背景：虚拟表格的横向滚动不是原生 DOM scroll（holder 的 overflow-x 为 hidden），
- * 由 rc-virtual-list 用 transform 模拟，只能通过 antd Table ref 的 scrollTo({ left }) 驱动；
- * 而 scrollTo({ index }) 仅做纵向行定位。保存校验失败后纵向已滚到错误行，但错误列可能仍在
- * 横向视口外（如错误列靠左、表格当前滚到最右）→ 看不到红字。此函数补齐横向定位。
+ * 背景：rc-table 虚拟表格对「列」也做了虚拟化（BodyGrid 仅渲染横向视口内的列），
+ * 保存校验失败时报错列可能根本未渲染进 body DOM，无法用单元格测量定位（旧实现据此失效）。
+ * 而表头（thead）不被列虚拟化——渲染全部列且为真实测量宽度，故改以表头为列宽来源：
+ * 累加报错列之前各列宽、减去 fixed-left 列宽（固定列悬浮，不占滚动偏移）得目标 scrollLeft。
  *
- * 目标 scrollLeft = 错误单元格前置兄弟列宽累计 - fixed-left 列宽（fixed 列悬浮，不占滚动偏移）。
+ * 注意：ref.nativeElement 仅为 body 滚动容器，表头在其外层 table-container 内，需向上查找。
  */
-export declare const scrollVirtualToErrorColumn: (tableRef: React.MutableRefObject<any>, rowKey?: string | null) => void;
+export declare const scrollVirtualToErrorColumn: (tableRef: React.MutableRefObject<any>, columns: any[], cellKey?: string | null) => void;
 /**
  * 深copy一个对象，并过滤掉其中的React节点
  * @param value 需要深拷贝的对象

package/es/ProEditTable/utils/tools.js

@@ -333,41 +333,62 @@ export const handleScrollToError = () => {
 };
 
 /**
- * 虚拟表格：横向滚动定位到「首个错误行」内的报错单元格。
+ * 把「首个报错列的 cellKey」映射成它在表头 th 中的可见列索引。
+ * 列序 = [选择列?(hasSelection 时占位 1), ...用户列]；names 列的 cellKey 用 splitNames 结果。
+ * @returns 表头 th 下标；未命中返回 -1
+ */
+export const resolveErrorColumnIndex = (columns = [], cellKey, hasSelection) => {
+  const idx = (columns || []).findIndex(col => {
+    if (Array.isArray(col?.names)) {
+      return splitNames(col.names) === cellKey;
+    }
+    return String(col?.name ?? col?.dataIndex ?? col?.key) === cellKey;
+  });
+  if (idx < 0) {
+    return -1;
+  }
+  return hasSelection ? idx + 1 : idx;
+};
+
+/**
+ * 虚拟表格：横向滚动定位到「首个报错列」。
  *
- * 背景：虚拟表格的横向滚动不是原生 DOM scroll（holder 的 overflow-x 为 hidden），
- * 由 rc-virtual-list 用 transform 模拟，只能通过 antd Table ref 的 scrollTo({ left }) 驱动；
- * 而 scrollTo({ index }) 仅做纵向行定位。保存校验失败后纵向已滚到错误行，但错误列可能仍在
- * 横向视口外（如错误列靠左、表格当前滚到最右）→ 看不到红字。此函数补齐横向定位。
+ * 背景：rc-table 虚拟表格对「列」也做了虚拟化（BodyGrid 仅渲染横向视口内的列），
+ * 保存校验失败时报错列可能根本未渲染进 body DOM，无法用单元格测量定位（旧实现据此失效）。
+ * 而表头（thead）不被列虚拟化——渲染全部列且为真实测量宽度，故改以表头为列宽来源：
+ * 累加报错列之前各列宽、减去 fixed-left 列宽（固定列悬浮，不占滚动偏移）得目标 scrollLeft。
  *
- * 目标 scrollLeft = 错误单元格前置兄弟列宽累计 - fixed-left 列宽（fixed 列悬浮，不占滚动偏移）。
+ * 注意：ref.nativeElement 仅为 body 滚动容器，表头在其外层 table-container 内，需向上查找。
  */
-export const scrollVirtualToErrorColumn = (tableRef, rowKey) => {
+export const scrollVirtualToErrorColumn = (tableRef, columns, cellKey) => {
   const ref = tableRef?.current;
   const root = ref?.nativeElement;
-  if (!ref?.scrollTo || !root || rowKey == null) {
+  if (!ref?.scrollTo || !root || !cellKey) {
+    return;
+  }
+  // body 容器在外层 table-container 内，表头与其同级，需从 container 取表头
+  const container = root.closest('[class*="table-container"]') || root.parentElement;
+  const headerCells = container?.querySelectorAll('thead [class*="table-cell"]');
+  if (!headerCells?.length) {
     return;
   }
-  const rowEl = root.querySelector(`[data-row-key="${rowKey}"]`);
-  // 取错误行内首个报错单元格（DOM 顺序 = 列顺序，首个即最靠左的错误列）
-  const errorCell = rowEl?.querySelector('[class*="form-item-has-error"]')?.closest('[class*="table-cell"]');
-  if (!errorCell) {
+  const hasSelection = !!container?.querySelector('thead [class*="selection-column"]');
+  const targetIndex = resolveErrorColumnIndex(columns, cellKey, hasSelection);
+  // -1 未命中 / 0 为首列（含 fixed-left），无需横向滚动
+  if (targetIndex <= 0 || targetIndex >= headerCells.length) {
     return;
   }
   let offsetLeft = 0;
   let fixedLeft = 0;
-  let previousSibling = errorCell.previousElementSibling;
-  while (previousSibling) {
-    if (previousSibling.nodeType === 1) {
-      const {
-        width = 0
-      } = previousSibling.getBoundingClientRect() || {};
-      offsetLeft += width;
-      if (isFixStartCell(previousSibling)) {
-        fixedLeft += width;
-      }
+  for (let i = 0; i < targetIndex; i += 1) {
+    const cell = headerCells[i];
+    const {
+      width = 0
+    } = cell.getBoundingClientRect() || {};
+    offsetLeft += width;
+    if (isFixStartCell(cell)) {
+      fixedLeft += width;
     }
-    previousSibling = previousSibling.previousElementSibling;
   }
   ref.scrollTo({
     left: Math.max(0, offsetLeft - fixedLeft)

package/es/ProEditTable/utils/validateAll.d.ts

@@ -46,6 +46,8 @@ export interface ValidateAllResult {
     firstErrorPath: (string | number)[] | null;
     /** 首个错误行的 rowKey（用于横向滚动时定位错误行 DOM），无错误为 null */
     firstErrorRowKey: string | null;
+    /** 首个错误列的 cellKey（names 列为 splitNames，普通列为列名），用于横向滚动定位列，无错误为 null */
+    firstErrorColumnKey: string | null;
 }
 /**
  * 对 form store 中 name 路径下的全量数组数据，逐行逐列用真实规则校验（脱离 DOM）。
@@ -82,5 +84,6 @@ export declare const runUnifiedValidation: ({ form, name, columns, config, error
     hasError: boolean;
     firstErrorIndex: number | null;
     firstErrorRowKey: string | null;
+    firstErrorColumnKey: string | null;
 }>;
 export {};

package/es/ProEditTable/utils/validateAll.js

@@ -199,6 +199,7 @@ export const validateAllRows = async ({
   const errorMap = {};
   let firstErrorPath = null;
   let firstErrorRowKey = null;
+  let firstErrorColumnKey = null;
   for (let index = 0; index < list.length; index += 1) {
     const rowData = list[index];
     // 行可能为空位（单行编辑增删残留），跳过
@@ -244,6 +245,7 @@ export const validateAllRows = async ({
         if (!firstErrorPath) {
           firstErrorPath = built.namePath;
           firstErrorRowKey = rowKey;
+          firstErrorColumnKey = built.cellKey;
         }
       }
     }
@@ -252,7 +254,8 @@ export const validateAllRows = async ({
     hasError: !!firstErrorPath,
     errorMap,
     firstErrorPath,
-    firstErrorRowKey
+    firstErrorRowKey,
+    firstErrorColumnKey
   };
 };
 
@@ -301,7 +304,8 @@ export const runUnifiedValidation = async ({
     hasError,
     errorMap,
     firstErrorPath,
-    firstErrorRowKey
+    firstErrorRowKey,
+    firstErrorColumnKey
   } = await validateAllRows({
     form,
     name,
@@ -314,6 +318,7 @@ export const runUnifiedValidation = async ({
   return {
     hasError,
     firstErrorIndex,
-    firstErrorRowKey
+    firstErrorRowKey,
+    firstErrorColumnKey
   };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "4.5.0-beta.2",
+  "version": "4.5.0",
   "license": "MIT",
   "files": [
     "es",