diff --git a/packages/core/client/src/locale/zh-CN.json b/packages/core/client/src/locale/zh-CN.json index 6a557be05d..3b57177d12 100644 --- a/packages/core/client/src/locale/zh-CN.json +++ b/packages/core/client/src/locale/zh-CN.json @@ -934,5 +934,9 @@ "Refresh data on action": "执行后刷新数据", "This variable has been deprecated and can be replaced with \"Current form\"": "该变量已被弃用,可以使用“当前表单”替代", "Unknown field type": "未知字段类型", - "The following field types are not compatible and do not support output and display": "以下字段类型未适配,不支持输出和显示" + "The following field types are not compatible and do not support output and display": "以下字段类型未适配,不支持输出和显示", + "Not fixed":"不固定", + "Left fixed":"左固定", + "Right fixed":"右固定", + "Fixed":"固定列" } diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx index 77ca5d3992..32efe79b5b 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx +++ b/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx @@ -8,7 +8,7 @@ */ import { MenuOutlined } from '@ant-design/icons'; -import { ISchema, useFieldSchema } from '@formily/react'; +import { ISchema, useFieldSchema, useField } from '@formily/react'; import _ from 'lodash'; import React from 'react'; import { useTranslation } from 'react-i18next'; @@ -21,6 +21,7 @@ import { useCollection_deprecated } from '../../../../collection-manager'; import { useDataBlockProps } from '../../../../data-source'; import { createDesignable, useDesignable } from '../../../../schema-component'; import { useGetAriaLabelOfDesigner } from '../../../../schema-settings/hooks/useGetAriaLabelOfDesigner'; +import { SelectWithTitle } from '../../../../common/SelectWithTitle'; export const Resizable = () => { const { t } = useTranslation(); @@ -75,6 +76,42 @@ export const Resizable = () => { ); }; +export const SchemaSettingsFixed = () => { + const field = useField(); + const fieldSchema = useFieldSchema(); + const { t } = useTranslation(); + const { dn } = useDesignable(); + + const options = [ + { label: t('Not fixed'), value: 'none' }, + { label: t('Left fixed'), value: 'left' }, + { label: t('Right fixed'), value: 'right' }, + ]; + return ( + + { + const schema = { + ['x-uid']: fieldSchema['x-uid'], + }; + fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {}; + fieldSchema['x-component-props']['fixed'] = fixed; + schema['x-component-props'] = fieldSchema['x-component-props']; + field.componentProps = field.componentProps || {}; + field.componentProps.fixed = fixed; + void dn.emit('patch', { + schema, + }); + dn.refresh(); + }} + /> + + ); +}; const commonOptions = { insertPosition: 'beforeEnd', useInsert: function useInsert() { @@ -245,6 +282,12 @@ const commonOptions = { name: 'divider2', type: 'divider', }, + { + name: 'fixed', + title: 't("Fixed")', + type: 'item', + Component: SchemaSettingsFixed, + }, { type: 'item', name: 'columnWidth', diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx index 4b331d6f76..f6ccbc7e8c 100644 --- a/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx +++ b/packages/core/client/src/modules/blocks/data-blocks/table/tableColumnSettings.tsx @@ -292,6 +292,39 @@ export const tableColumnSettings = new SchemaSettings({ }; }, }, + { + name: 'fixed', + type: 'select', + useComponentProps() { + const { t } = useTranslation(); + const field = useField(); + const fieldSchema = useFieldSchema(); + const { dn } = useDesignable(); + return { + title: t('Fixed'), + options: [ + { label: t('Not fixed'), value: 'none' }, + { label: t('Left fixed'), value: 'left' }, + { label: t('Right fixed'), value: 'right' }, + ], + value: field.componentProps?.fixed || 'none', + onChange(fixed) { + const schema = { + ['x-uid']: fieldSchema['x-uid'], + }; + fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {}; + fieldSchema['x-component-props']['fixed'] = fixed; + schema['x-component-props'] = fieldSchema['x-component-props']; + field.componentProps = field.componentProps || {}; + field.componentProps.fixed = fixed; + void dn.emit('patch', { + schema, + }); + dn.refresh(); + }, + }; + }, + }, ], }, { diff --git a/packages/core/client/src/schema-component/antd/table-v2/Table.tsx b/packages/core/client/src/schema-component/antd/table-v2/Table.tsx index 8c511df0d8..fed5ebf1bd 100644 --- a/packages/core/client/src/schema-component/antd/table-v2/Table.tsx +++ b/packages/core/client/src/schema-component/antd/table-v2/Table.tsx @@ -52,6 +52,23 @@ const useArrayField = (props) => { function getSchemaArrJSON(schemaArr: Schema[]) { return schemaArr.map((item) => (item.name === 'actions' ? omit(item.toJSON(), 'properties') : item.toJSON())); } +function adjustColumnOrder(columns) { + const leftFixedColumns = []; + const normalColumns = []; + const rightFixedColumns = []; + + columns.forEach((column) => { + if (column.fixed === 'left') { + leftFixedColumns.push(column); + } else if (column.fixed === 'right') { + rightFixedColumns.push(column); + } else { + normalColumns.push(column); + } + }); + + return [...leftFixedColumns, ...normalColumns, ...rightFixedColumns]; +} export const useColumnsDeepMemoized = (columns: any[]) => { const columnsJSON = getSchemaArrJSON(columns); @@ -140,15 +157,16 @@ const useTableColumns = (props: { showDel?: boolean; isSubTable?: boolean }) => if (!exists) { return columns; } - const res = [ - ...columns, - { + const res = [...columns]; + if (designable) { + res.push({ title: render(), dataIndex: 'TABLE_COLUMN_INITIALIZER', key: 'TABLE_COLUMN_INITIALIZER', - render: designable ? () =>
: null, - }, - ]; + render: () =>
, + fixed: 'right', + }); + } if (props.showDel) { res.push({ title: '', @@ -177,7 +195,7 @@ const useTableColumns = (props: { showDel?: boolean; isSubTable?: boolean }) => }); } - return res; + return adjustColumnOrder(res); }, [columns, exists, field, render, props.showDel, designable]); return tableColumns; @@ -517,7 +535,7 @@ export const Table: any = withDynamicSchemaProps( return ( - {inView || isIndex ? props.children : } + {inView || isIndex ? props.children : } ); },