fix: issues with deletion action , text ellipsis, and new data display in sub-table (#5523)

* fix: subtable issue

* fix: bug

* fix: bug

* fix: bug

* fix: bug

* fix: bug

* fix: bug

packages/core/client/src/block-provider/TableSelectorProvider.tsx

@@ -297,7 +297,7 @@ export const useTableSelectorProps = () => {
       field.value = data;
       field?.setInitialValue?.(data);
       field.data = field.data || {};
-      field.data.selectedRowKeys = ctx?.field?.data?.selectedRowKeys;
+      field.data.selectedRowKeys = [];
       field.componentProps.pagination = field.componentProps.pagination || {};
       field.componentProps.pagination.pageSize = ctx?.service?.data?.meta?.pageSize;
       field.componentProps.pagination.total = ctx?.service?.data?.meta?.count;

packages/core/client/src/modules/fields/component/Input/inputComponentSettings.tsx

@@ -54,6 +54,11 @@ export const ellipsisSettingsItem: SchemaSettingsItemType = {
           tableFieldInstanceList.forEach((fieldInstance) => {
             fieldInstance.componentProps.ellipsis = checked;
           });
+          schema['x-component-props']['ellipsis'] = checked;
+          const path = formField.path?.splice(formField.path?.length - 1, 1);
+          formField.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => {
+            f.componentProps.ellipsis = checked;
+          });
         } else {
           formField.componentProps.ellipsis = checked;
         }

packages/core/client/src/modules/fields/component/Picker/recordPickerComponentFieldSettings.tsx

@@ -15,55 +15,9 @@ import { useFieldComponentName } from '../../../../common/useFieldComponentName'
 import { useCollectionField } from '../../../../data-source';
 import { useDesignable, useFieldModeOptions, useIsAddNewForm } from '../../../../schema-component';
 import { isSubMode } from '../../../../schema-component/antd/association-field/util';
-import {
+import { allowAddNew, useIsFieldReadPretty } from '../../../../schema-component/antd/form-item/FormItem.Settings';
-  allowAddNew,
-  useIsFieldReadPretty,
-  useTitleFieldOptions,
-} from '../../../../schema-component/antd/form-item/FormItem.Settings';
 import { useColumnSchema } from '../../../../schema-component/antd/table-v2/Table.Column.Decorator';
-
+import { titleField } from '../Select/selectComponentFieldSettings';
-export const titleField: any = {
-  name: 'titleField',
-  type: 'select',
-  useComponentProps() {
-    const { t } = useTranslation();
-    const field = useField<Field>();
-    const { uiSchema, fieldSchema: tableColumnSchema, collectionField: tableColumnField } = useColumnSchema();
-    const options = useTitleFieldOptions();
-    const schema = useFieldSchema();
-    const fieldSchema = tableColumnSchema || schema;
-    const targetCollectionField = useCollectionField();
-    const collectionField = tableColumnField || targetCollectionField;
-    const { dn } = useDesignable();
-    const fieldNames =
-      field?.componentProps?.fieldNames ||
-      fieldSchema?.['x-component-props']?.['fieldNames'] ||
-      uiSchema?.['x-component-props']?.['fieldNames'];
-    return {
-      title: t('Title field'),
-      options,
-      value: fieldNames?.label,
-      onChange(label) {
-        const schema = {
-          ['x-uid']: fieldSchema['x-uid'],
-        };
-        const fieldNames = {
-          ...collectionField?.uiSchema?.['x-component-props']?.['fieldNames'],
-          ...field.componentProps.fieldNames,
-          label,
-        };
-        fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {};
-        fieldSchema['x-component-props']['fieldNames'] = fieldNames;
-        schema['x-component-props'] = fieldSchema['x-component-props'];
-        field.componentProps.fieldNames = fieldSchema['x-component-props'].fieldNames;
-        dn.emit('patch', {
-          schema,
-        });
-        dn.refresh();
-      },
-    };
-  },
-};
 
 const allowMultiple: any = {
   name: 'allowMultiple',

packages/core/client/src/modules/fields/component/PopoverNester/subformPopoverComponentFieldSettings.tsx

@@ -17,7 +17,8 @@ import { useDesignable, useFieldModeOptions, useIsAddNewForm } from '../../../..
 import { isSubMode } from '../../../../schema-component/antd/association-field/util';
 import { useIsFieldReadPretty } from '../../../../schema-component/antd/form-item/FormItem.Settings';
 import { useColumnSchema } from '../../../../schema-component/antd/table-v2/Table.Column.Decorator';
-import { titleField } from '../Picker/recordPickerComponentFieldSettings';
+import { titleField } from '../Select/selectComponentFieldSettings';
+
 import { linkageRules } from '../SubTable/subTablePopoverComponentFieldSettings';
 import { schemaSettingsLabelLayout } from '../../../../schema-settings';
 

packages/core/client/src/modules/fields/component/Select/selectComponentFieldSettings.tsx

@@ -73,7 +73,7 @@ const enableLink = {
   },
 };
 
-const titleField: any = {
+export const titleField: any = {
   name: 'titleField',
   type: 'select',
   useComponentProps() {

packages/core/client/src/schema-component/antd/association-field/SubTable.tsx

@@ -147,6 +147,7 @@ export const SubTable: any = observer(
       setSelectedRows,
       collectionField,
     };
+
     const usePickActionProps = () => {
       const { setVisible } = useActionContext();
       const { selectedRows, setSelectedRows } = useContext(RecordPickerContext);
@@ -176,8 +177,9 @@ export const SubTable: any = observer(
     }, [field.componentProps?.pageSize]);
 
     const paginationConfig = useMemo(() => {
+      const page = Math.ceil(field.value?.length / 10);
       return {
-        current: currentPage,
+        current: currentPage > page ? page : currentPage,
         pageSize: pageSize || 10,
         total: field?.value?.length,
         onChange: (page, pageSize) => {

packages/core/client/src/schema-component/antd/table-v2/Table.tsx

@@ -84,7 +84,7 @@ export const useColumnsDeepMemoized = (columns: any[]) => {
   return oldObj.value;
 };
 
-const useTableColumns = (props: { showDel?: any; isSubTable?: boolean }) => {
+const useTableColumns = (props: { showDel?: any; isSubTable?: boolean }, paginationProps) => {
   const { token } = useToken();
   const field = useArrayField(props);
   const schema = useFieldSchema();
@@ -98,7 +98,7 @@ const useTableColumns = (props: { showDel?: any; isSubTable?: boolean }) => {
     }
     return buf;
   }, []);
-
+  const { current, pageSize } = paginationProps;
   const hasChangedColumns = useColumnsDeepMemoized(columnsSchema);
 
   const schemaToolbarBigger = useMemo(() => {
@@ -189,13 +189,13 @@ const useTableColumns = (props: { showDel?: any; isSubTable?: boolean }) => {
               <CloseOutlined
                 style={{ cursor: 'pointer', color: 'gray' }}
                 onClick={() => {
-                  action(() => {
+                  return action(() => {
-                    spliceArrayState(field as any, {
+                    const fieldIndex = (current - 1) * pageSize + index;
-                      startIndex: index,
+                    spliceArrayState(field, {
+                      startIndex: fieldIndex,
                       deleteCount: 1,
                     });
-                    field.value.splice(index, 1);
+                    field.value.splice(fieldIndex, 1);
-                    field.initialValue?.splice(index, 1);
                     return field.onInput(field.value);
                   });
                 }}
@@ -361,7 +361,7 @@ const usePaginationProps = (pagination1, pagination2) => {
   if (!pagination2 && pagination1 === false) {
     return false;
   }
-  return field.value?.length > 0 ? result : false;
+  return field.value?.length > 0 || result.total ? result : false;
 };
 
 const headerClass = css`
@@ -616,7 +616,6 @@ export const Table: any = withDynamicSchemaProps(
       ...others
     } = { ...others1, ...others2 } as any;
     const field = useArrayField(others);
-    const columns = useTableColumns(others);
     const schema = useFieldSchema();
     const collection = useCollection();
     const isTableSelector = schema?.parent?.['x-decorator'] === 'TableSelectorProvider';
@@ -624,12 +623,12 @@ export const Table: any = withDynamicSchemaProps(
     const { expandFlag, allIncludesChildren } = ctx;
     const onRowDragEnd = useMemoizedFn(others.onRowDragEnd || (() => {}));
     const paginationProps = usePaginationProps(pagination1, pagination2);
+    const columns = useTableColumns(others, paginationProps);
     const [expandedKeys, setExpandesKeys] = useState(() => (expandFlag ? allIncludesChildren : []));
     const [selectedRowKeys, setSelectedRowKeys] = useState<any[]>(field?.data?.selectedRowKeys || []);
     const [selectedRow, setSelectedRow] = useState([]);
     const isRowSelect = rowSelection?.type !== 'none';
     const defaultRowKeyMap = useRef(new Map());
-
     const highlightRowCss = useMemo(() => {
       return css`
         & > td {