@ai-table/grid 0.1.44 → 0.1.46

package/core/coordinate.d.ts

@@ -113,7 +113,7 @@ export declare class Coordinate {
      * 如果可以完整渲染，则返回 { isCanFullRender: true, offsetY: 0 }
      * 如果不能完整渲染，则返回 { isCanFullRender: false, offsetY: 需要偏移的 y 值 }
      */
-    getAddRowButtonIsFullRenderInfo(aiTable: AITable): {
+    getAddRowButtonIsFullRenderInfo(aiTable: AITable, addRowIndex: number): {
         isCanFullRender: boolean;
         offsetY: number;
     };

package/core/coordinate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"coordinate.d.ts","sourceRoot":"","sources":["../../../packages/grid/src/core/coordinate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAC/G,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAO/C,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAElC;;GAEG;AACH,qBAAa,UAAU;IACnB,SAAS,CAAC,UAAU,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,cAAc,CAAC;IAC1B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IAExB,iBAAiB,EAAE,cAAc,CAAM;IAEvC,oBAAoB,EAAE,cAAc,CAAM;IAE1C,WAAW,EAAE,MAAM,CAAC;IAEpB,cAAc,EAAE,MAAM,CAAC;IAEvB,YAAY,SAAM;IAElB,eAAe,SAAM;IACrB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAM;IACzD,iBAAiB,EAAE,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAM;IAC5D,iBAAiB,EAAE,MAAM,CAAC;gBAErB,EACR,SAAS,EACT,QAAQ,EACR,WAAW,EACX,SAAS,EACT,iBAAsB,EACtB,oBAAyB,EACzB,WAAe,EACf,cAAkB,EAClB,iBAAqB,EACxB,EAAE,iBAAiB;IAcpB,IAAW,SAAS,IAIS,MAAM,CAFlC;IAED,IAAW,SAAS,CAAC,MAAM,EAAE,MAAM,EAElC;IAED;;OAEG;IACH,IAAW,UAAU,WAGpB;IAED;;OAEG;IACH,IAAW,WAAW,WAGrB;IAED;;OAEG;IACI,YAAY,CAAC,KAAK,EAAE,MAAM;IAIjC;;OAEG;IACI,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAI5C;;OAEG;IACH,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,oBAAoB,GAAG,mBAAmB;IAoC7F;;;OAGG;IACH,OAAO,CAAC,qBAAqB;IAY7B;;;OAGG;IACH,OAAO,CAAC,6BAA6B;IAgBrC;;OAEG;IACI,oBAAoB,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,oBAAoB;IAgB1E;;OAEG;IACI,gBAAgB,CAAC,MAAM,EAAE,MAAM;IAItC;;OAEG;IACI,eAAe,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM;IAa5D;;OAEG;IACI,mBAAmB,CAAC,MAAM,EAAE,MAAM;IAIzC;;OAEG;IACI,kBAAkB,CAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM;IAahE;;OAEG;IACI,YAAY,CAAC,QAAQ,EAAE,MAAM;IAIpC;;OAEG;IACI,eAAe,CAAC,WAAW,EAAE,MAAM;IAI1C;;OAEG;IACH,IAAI,iBAAiB,WAEpB;IAED;;OAEG;IACI,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM;;;;;;IAWxD;;OAEG;IACI,cAAc,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,mBAAmB,GAAG,OAAO;IAQ3E;;;;OAIG;IACI,uBAAuB,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,mBAAmB;;;;;IA0C1E;;;;OAIG;IACI,+BAA+B,CAAC,OAAO,EAAE,OAAO;;;;CAqB1D"}
+{"version":3,"file":"coordinate.d.ts","sourceRoot":"","sources":["../../../packages/grid/src/core/coordinate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAC/G,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAO/C,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAElC;;GAEG;AACH,qBAAa,UAAU;IACnB,SAAS,CAAC,UAAU,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,cAAc,CAAC;IAC1B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IAExB,iBAAiB,EAAE,cAAc,CAAM;IAEvC,oBAAoB,EAAE,cAAc,CAAM;IAE1C,WAAW,EAAE,MAAM,CAAC;IAEpB,cAAc,EAAE,MAAM,CAAC;IAEvB,YAAY,SAAM;IAElB,eAAe,SAAM;IACrB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAM;IACzD,iBAAiB,EAAE,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAM;IAC5D,iBAAiB,EAAE,MAAM,CAAC;gBAErB,EACR,SAAS,EACT,QAAQ,EACR,WAAW,EACX,SAAS,EACT,iBAAsB,EACtB,oBAAyB,EACzB,WAAe,EACf,cAAkB,EAClB,iBAAqB,EACxB,EAAE,iBAAiB;IAcpB,IAAW,SAAS,IAIS,MAAM,CAFlC;IAED,IAAW,SAAS,CAAC,MAAM,EAAE,MAAM,EAElC;IAED;;OAEG;IACH,IAAW,UAAU,WAGpB;IAED;;OAEG;IACH,IAAW,WAAW,WAGrB;IAED;;OAEG;IACI,YAAY,CAAC,KAAK,EAAE,MAAM;IAIjC;;OAEG;IACI,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAI5C;;OAEG;IACH,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,oBAAoB,GAAG,mBAAmB;IAoC7F;;;OAGG;IACH,OAAO,CAAC,qBAAqB;IAY7B;;;OAGG;IACH,OAAO,CAAC,6BAA6B;IAgBrC;;OAEG;IACI,oBAAoB,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,oBAAoB;IAgB1E;;OAEG;IACI,gBAAgB,CAAC,MAAM,EAAE,MAAM;IAItC;;OAEG;IACI,eAAe,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM;IAa5D;;OAEG;IACI,mBAAmB,CAAC,MAAM,EAAE,MAAM;IAIzC;;OAEG;IACI,kBAAkB,CAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM;IAahE;;OAEG;IACI,YAAY,CAAC,QAAQ,EAAE,MAAM;IAIpC;;OAEG;IACI,eAAe,CAAC,WAAW,EAAE,MAAM;IAI1C;;OAEG;IACH,IAAI,iBAAiB,WAEpB;IAED;;OAEG;IACI,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM;;;;;;IAWxD;;OAEG;IACI,cAAc,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,mBAAmB,GAAG,OAAO;IAQ3E;;;;OAIG;IACI,uBAAuB,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,mBAAmB;;;;;IA0C1E;;;;OAIG;IACI,+BAA+B,CAAC,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM;;;;CAmB/E"}

package/fesm2022/ai-table-grid.mjs

@@ -1350,13 +1350,11 @@ class Coordinate {
      * 如果可以完整渲染，则返回 { isCanFullRender: true, offsetY: 0 }
      * 如果不能完整渲染，则返回 { isCanFullRender: false, offsetY: 需要偏移的 y 值 }
      */
-    getAddRowButtonIsFullRenderInfo(aiTable) {
+    getAddRowButtonIsFullRenderInfo(aiTable, addRowIndex) {
         let offsetY = 0;
-        const gridData = aiTable.gridData();
-        const lastRowIndex = gridData.records.length - 1;
-        const { size: height, offset: y } = this.getCellMetaData(lastRowIndex, AITableRowColumnType.row);
+        const { size: height, offset: y } = this.getCellMetaData(addRowIndex, AITableRowColumnType.row);
         const { scrollTop } = aiTable.context.scrollState();
-        const addButtonMaxY = y + height + AI_TABLE_ROW_HEIGHT;
+        const addButtonMaxY = y + height;
         const containerMaxY = aiTable.context.containerRect().height + scrollTop - AI_TABLE_FIELD_STAT_CONTAINER_HEIGHT - AI_TABLE_CELL_LINE_BORDER * 4;
         if (addButtonMaxY > containerMaxY) {
             offsetY = addButtonMaxY - containerMaxY;
@@ -2819,11 +2817,15 @@ function toDateFieldValue(plainText, targetField, originData) {
     const value = texts && texts.length ? texts[0].trim() : plainText.trim();
     return transformDateValue(value);
 }
+function getTimeDay(value) {
+    return new TinyDate(fromUnixTime(value)).startOfDay().getUnixTime();
+}
 function cellValueToSortValue$4(cellValue) {
     if (isUndefinedOrNull(cellValue) || !isDateValid(cellValue)) {
         return 0;
     }
-    return cellValue?.timestamp ?? 0;
+    const value = cellValue?.timestamp ?? 0;
+    return value > 0 ? getTimeDay(value) : 0;
 }
 function transformDateValue(text) {
     const date = isDateAndReturnDate(text);
@@ -3755,6 +3757,7 @@ const writeToAITable = async (aiTable, actions) => {
             const { value, newField } = getPasteValue(plainText, aiTableContent, recordIndex, fieldIndex, targetField, references);
             if (newField) {
                 actions.setField(newField);
+                visibleFields[targetColIndex] = newField;
             }
             if (value !== null) {
                 try {
@@ -5674,7 +5677,7 @@ class AddRowLayout extends Layout {
         if (this.isFirst || this.isLast)
             return;
         this.renderCell({
-            width: this.columnWidth,
+            width: this.columnWidth + AI_TABLE_CELL_LINE_BORDER,
             isHoverRow
         });
     }
@@ -6175,8 +6178,8 @@ class CellDrawer extends Drawer {
         }
     }
     // 单元格渲染
-    renderCell(render, ctx, columnWidth) {
-        const { field, cellValue, aiTable } = render;
+    renderCell(render, ctx) {
+        const { field, cellValue, aiTable, columnWidth } = render;
         const fieldType = field.type;
         const fieldMethod = FieldModelMap[fieldType];
         if (!fieldMethod.isValid(cellValue)) {
@@ -6642,7 +6645,7 @@ class CellDrawer extends Drawer {
         });
     }
     renderCellProgress(render, ctx) {
-        const { x, y, transformValue, columnWidth, style } = render;
+        const { x, y, transformValue, columnWidth, style, isGroupFirstRender } = render;
         const colors = AITable.getColors();
         let validateTransformValue = transformValue;
         if (isUndefinedOrNull(validateTransformValue)) {
@@ -6654,31 +6657,41 @@ class CellDrawer extends Drawer {
         const offsetX = AI_TABLE_CELL_PADDING;
         const offsetY = (AI_TABLE_ROW_BLANK_HEIGHT - AI_TABLE_PROGRESS_BAR_HEIGHT) / 2;
         const textOffsetY = (AI_TABLE_ROW_BLANK_HEIGHT - textHeight) / 2;
-        // 绘制背景
-        this.rect({
-            x: x + offsetX,
-            y: y + offsetY,
-            width,
-            height,
-            radius: AI_TABLE_PROGRESS_BAR_RADIUS,
-            fill: colors.gray200
-        });
-        // 计算并绘制进度
-        const progressWidth = (validateTransformValue / 100) * width;
-        this.rect({
-            x: x + offsetX,
-            y: y + offsetY,
-            width: progressWidth,
-            height,
-            radius: AI_TABLE_PROGRESS_BAR_RADIUS,
-            fill: colors.success
-        });
-        this.text({
-            x: x + offsetX + width + AI_TABLE_TEXT_GAP,
-            y: y + textOffsetY,
-            text: `${validateTransformValue}%`,
-            fillStyle: colors.gray800
-        });
+        if (isGroupFirstRender) {
+            this.text({
+                x: x + offsetX,
+                y: y + textOffsetY,
+                text: `${validateTransformValue}%`,
+                fillStyle: colors.gray800
+            });
+        }
+        else {
+            // 绘制背景
+            this.rect({
+                x: x + offsetX,
+                y: y + offsetY,
+                width,
+                height,
+                radius: AI_TABLE_PROGRESS_BAR_RADIUS,
+                fill: colors.gray200
+            });
+            // 计算并绘制进度
+            const progressWidth = (validateTransformValue / 100) * width;
+            this.rect({
+                x: x + offsetX,
+                y: y + offsetY,
+                width: progressWidth,
+                height,
+                radius: AI_TABLE_PROGRESS_BAR_RADIUS,
+                fill: colors.success
+            });
+            this.text({
+                x: x + offsetX + width + AI_TABLE_TEXT_GAP,
+                y: y + textOffsetY,
+                text: `${validateTransformValue}%`,
+                fillStyle: colors.gray800
+            });
+        }
     }
     renderCellMember(render, ctx) {
         const { references, x, y, field, transformValue, rowHeight, columnWidth, isActive } = render;
@@ -7008,14 +7021,14 @@ class GroupLayout extends Layout {
             });
         }
         const iconContainerWidth = AI_TABLE_ICON_COMMON_SIZE + AI_TABLE_FIELD_HEAD_ICON_GAP_SIZE;
-        if (!isEmpty(groupValue) || field.type === AITableFieldType.checkbox) {
+        if (!isEmpty(groupValue) || [AITableFieldType.checkbox, AITableFieldType.progress].includes(field.type)) {
             cellDrawer.initStyle(field, style);
             cellDrawer.renderCell({
                 ...render,
                 x: render.x + iconContainerWidth,
                 columnWidth: render.columnWidth - iconContainerWidth,
                 isGroupFirstRender: true
-            }, this.ctx, columnWidth);
+            }, this.ctx);
         }
         else {
             const emptyGroupString = getI18nTextByKey(aiTable, AITableGridI18nKey.emptyGroup);
@@ -7199,11 +7212,11 @@ const createCells = (config) => {
                         ctx.save();
                         ctx.rect(realX, realY, width, rowHeight);
                         ctx.clip();
-                        cellDrawer.renderCell(render, ctx, columnWidth);
+                        cellDrawer.renderCell(render, ctx);
                         ctx.restore();
                     }
                     else {
-                        cellDrawer.renderCell(render, ctx, columnWidth);
+                        cellDrawer.renderCell(render, ctx);
                     }
                     break;
                 }
@@ -9528,6 +9541,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
 class AITableGroups {
     constructor() {
         this.config = input.required();
+        this.trackBy = (groupStat) => {
+            return groupStat.groupRow._id + groupStat.columnIndex;
+        };
         this.frozenColumnCount = computed(() => {
             const { coordinate } = this.config();
             return coordinate.frozenColumnCount ?? 0;
@@ -9563,7 +9579,7 @@ class AITableGroups {
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableGroups, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AITableGroups, isStandalone: true, selector: "ai-table-groups", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
-        @for (groupCell of groupCells(); track $index) {
+        @for (groupCell of groupCells(); track trackBy(groupCell.groupStat!)) {
             <ai-table-field-stat [config]="groupCell.groupStat!"></ai-table-field-stat>
         }
     `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AITableFieldStat, selector: "ai-table-field-stat", inputs: ["config"], outputs: ["hover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -9573,7 +9589,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
             args: [{
                     selector: 'ai-table-groups',
                     template: `
-        @for (groupCell of groupCells(); track $index) {
+        @for (groupCell of groupCells(); track trackBy(groupCell.groupStat!)) {
             <ai-table-field-stat [config]="groupCell.groupStat!"></ai-table-field-stat>
         }
     `,
@@ -9796,6 +9812,7 @@ class AITableCoverCellEntry {
                     isActive: isSelectedField(field._id, aiTable),
                     x: renderX,
                     y: renderY,
+                    groupOffset: columnWidth - width,
                     columnWidth: width,
                     rowHeight,
                     cellValue,
@@ -9850,6 +9867,9 @@ class AITableFieldStats {
         this.config = input.required();
         this.hover = output();
         this.isHover = signal(false);
+        this.trackBy = (groupStat) => {
+            return groupStat.columnIndex;
+        };
         this.statConfigs = computed(() => createFieldStats(this.config()));
     }
     onMouseenter(e) {
@@ -9861,7 +9881,7 @@ class AITableFieldStats {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldStats, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AITableFieldStats, isStandalone: true, selector: "ai-table-column-stats", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { hover: "hover" }, ngImport: i0, template: `
         <ko-group>
-            @for (config of statConfigs(); track $index) {
+            @for (config of statConfigs(); track trackBy(config)) {
                 <ai-table-field-stat [config]="config" (hover)="hover.emit($event)"></ai-table-field-stat>
             }
         </ko-group>
@@ -9873,7 +9893,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     selector: 'ai-table-column-stats',
                     template: `
         <ko-group>
-            @for (config of statConfigs(); track $index) {
+            @for (config of statConfigs(); track trackBy(config)) {
                 <ai-table-field-stat [config]="config" (hover)="hover.emit($event)"></ai-table-field-stat>
             }
         </ko-group>
@@ -9970,7 +9990,6 @@ class AITableRenderer {
             return {
                 clipX: 0,
                 clipY: AI_TABLE_FIELD_HEAD_HEIGHT,
-                clipWidth: this.frozenAreaWidth() + AI_TABLE_SHADOW_DEFAULT_WIDTH,
                 clipHeight: this.gridContainerHeight()
             };
         });
@@ -10254,14 +10273,14 @@ class AITableCellRate extends CoverCellBase {
         this.whiteBgConfig = computed(() => {
             const { aiTable, render, field, recordId, coordinate } = this.config();
             const pointPosition = aiTable.context.pointPosition();
-            const { x, y } = render;
+            const { x, y, groupOffset = 0 } = render;
             const { columnIndex } = pointPosition;
             const hasSelectedArea = aiTable.selection().selectedCells.size > 0 ||
                 aiTable.selection().selectedRecords.size > 0 ||
                 aiTable.selection().selectedFields.size > 0;
             const bgColor = hasSelectedArea ? null : Colors.white;
             return {
-                x: x - AI_TABLE_CELL_PADDING + AI_TABLE_CELL_BORDER,
+                x: x - groupOffset - AI_TABLE_CELL_PADDING + AI_TABLE_CELL_BORDER,
                 y: y + AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET,
                 width: coordinate.getColumnWidth(columnIndex) - (AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET) * 2,
                 height: AI_TABLE_ROW_BLANK_HEIGHT - (AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET),
@@ -10277,7 +10296,7 @@ class AITableCellRate extends CoverCellBase {
         });
         this.starConfigs = computed(() => {
             const { render, field, recordId, readonly, aiTable, coordinate } = this.config();
-            const { x, transformValue } = render;
+            const { x, columnWidth, transformValue } = render;
             const max = AI_TABLE_RATE_MAX;
             const starY = (AI_TABLE_ROW_BLANK_HEIGHT - AI_TABLE_CELL_EMOJI_SIZE) / 2 + AI_TABLE_OFFSET;
             const pointPosition = aiTable.context.pointPosition();
@@ -10293,7 +10312,7 @@ class AITableCellRate extends CoverCellBase {
                 this.pointerX() <= lastStarRightX &&
                 this.pointerY() >= startTopY &&
                 this.pointerY() <= startBottomY;
-            const renderWidth = coordinate.getColumnWidth(columnIndex) - AI_TABLE_CELL_PADDING;
+            const renderWidth = columnWidth - AI_TABLE_CELL_PADDING;
             const starWidth = AI_TABLE_CELL_EMOJI_SIZE + AI_TABLE_CELL_EMOJI_PADDING;
             const maxStar = Math.min(max, Math.floor(renderWidth / starWidth));
             return [...Array(maxStar).keys()].map((item, index) => {
@@ -10340,7 +10359,9 @@ class AITableCellRate extends CoverCellBase {
         if (!pos)
             return;
         const { x, y } = pos;
-        this.pointerX.set(x);
+        const { render } = this.config();
+        const { groupOffset = 0 } = render;
+        this.pointerX.set(x - groupOffset);
         this.pointerY.set(y);
     }
     koClick(e, index) {
@@ -10423,14 +10444,14 @@ class AITableCellProgress extends CoverCellBase {
         this.whiteBgConfig = computed(() => {
             const { aiTable, render, field, recordId, coordinate } = this.config();
             const pointPosition = aiTable.context.pointPosition();
-            const { x, y } = render;
+            const { x, y, groupOffset = 0 } = render;
             const { columnIndex } = pointPosition;
             const hasSelectedArea = aiTable.selection().selectedCells.size > 0 ||
                 aiTable.selection().selectedRecords.size > 0 ||
                 aiTable.selection().selectedFields.size > 0;
             const bgColor = hasSelectedArea ? null : Colors.white;
             return {
-                x: x - AI_TABLE_CELL_PADDING + AI_TABLE_CELL_BORDER / 2,
+                x: x - groupOffset - AI_TABLE_CELL_PADDING + AI_TABLE_CELL_BORDER / 2,
                 y: y + AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET,
                 width: coordinate.getColumnWidth(columnIndex) - (AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET) * 2 + AI_TABLE_CELL_BORDER / 2,
                 height: AI_TABLE_ROW_BLANK_HEIGHT - (AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET),
@@ -10558,7 +10579,7 @@ class AITableCellProgress extends CoverCellBase {
             return;
         }
         const { render, aiTable, coordinate } = this.config();
-        const { x } = render;
+        const { x, groupOffset = 0 } = render;
         const { scrollLeft } = aiTable.context.scrollState();
         const pointPosition = aiTable.context.pointPosition();
         const { columnIndex } = pointPosition;
@@ -10569,10 +10590,10 @@ class AITableCellProgress extends CoverCellBase {
         const point = stage.getPointerPosition();
         if (!point)
             return;
-        const dragX = point.x - columnLeftX - x;
+        const dragX = point.x - columnLeftX - x - groupOffset;
         const minX = x;
         const maxX = x + this.railWidth();
-        let dragPointerX = point.x - columnLeftX;
+        let dragPointerX = point.x - columnLeftX - groupOffset;
         if (dragPointerX < minX) {
             dragPointerX = minX;
         }
@@ -10593,7 +10614,7 @@ class AITableCellProgress extends CoverCellBase {
     }
     updateProgressValue(e) {
         const { render, aiTable, coordinate, actions, field, recordId } = this.config();
-        const { x } = render;
+        const { x, groupOffset = 0 } = render;
         const { scrollLeft } = aiTable.context.scrollState();
         const pointPosition = aiTable.context.pointPosition();
         const { columnIndex } = pointPosition;
@@ -10604,7 +10625,7 @@ class AITableCellProgress extends CoverCellBase {
         const point = stage.getPointerPosition();
         if (!point)
             return;
-        const dragX = point.x - columnLeftX - x;
+        const dragX = point.x - columnLeftX - x - groupOffset;
         const percentage = this.calculatePercentage(dragX);
         if (!this.readonly() && actions && actions.updateFieldValues) {
             actions.updateFieldValues([
@@ -13515,10 +13536,13 @@ class AITableGrid extends AITableGridBase {
         switch (targetName) {
             case AI_TABLE_ROW_ADD_BUTTON: {
                 clearCoverCell(this.aiTable);
+                const addRowIndex = (targetNameDetail.source
+                    ? this.aiTable.context.visibleRowsIndexMap().get(targetNameDetail.source)
+                    : this.aiTable.context.linearRows().length - 1) ?? -1;
                 this.addRecord({
                     forGroupId: targetNameDetail.source
                 });
-                const { isCanFullRender, offsetY } = this.coordinate().getAddRowButtonIsFullRenderInfo(this.aiTable);
+                const { isCanFullRender, offsetY } = this.coordinate().getAddRowButtonIsFullRenderInfo(this.aiTable, addRowIndex + 1);
                 if (!isCanFullRender) {
                     this.scrollAction({
                         deltaX: 0,