diff --git a/lerna.json b/lerna.json index 98ed13bf3f..94d6c7c8ab 100644 --- a/lerna.json +++ b/lerna.json @@ -2,9 +2,7 @@ "version": "1.6.0-alpha.2", "npmClient": "yarn", "useWorkspaces": true, - "npmClientArgs": [ - "--ignore-engines" - ], + "npmClientArgs": ["--ignore-engines"], "command": { "version": { "forcePublish": true, diff --git a/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx b/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx index b18b185d03..34788ab265 100644 --- a/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx +++ b/packages/core/client/src/schema-component/antd/action/Action.Designer.tsx @@ -69,7 +69,6 @@ export function ButtonEditor(props) { title: t('Button title'), default: fieldSchema.title, 'x-component-props': {}, - // description: `原字段标题：${collectionField?.uiSchema?.title}`, }, icon: { 'x-decorator': 'FormItem', @@ -78,7 +77,6 @@ export function ButtonEditor(props) { default: fieldSchema?.['x-component-props']?.icon, 'x-component-props': {}, 'x-visible': !isLink, - // description: `原字段标题：${collectionField?.uiSchema?.title}`, }, iconColor: { title: t('Color'), @@ -730,7 +728,7 @@ export const actionSettingsItems: SchemaSettingOptions['items'] = [ 'duplicate', 'customize:create', ].includes(fieldSchema['x-action'] || ''); - return !isPopupAction; + return !isPopupAction && !fieldSchema?.['x-action-settings'].disableSecondConFirm; }, }, { @@ -957,11 +955,12 @@ export const ActionDesigner = (props) => { buttonEditorProps, linkageRulesProps, schemaSettings = 'ActionSettings', + enableDrag = true, ...restProps } = props; const app = useApp(); const fieldSchema = useFieldSchema(); - const isDraggable = fieldSchema?.parent['x-component'] !== 'CollectionField'; + const isDraggable = fieldSchema?.parent['x-component'] !== 'CollectionField' && enableDrag; const settingsName = `ActionSettings:${fieldSchema['x-action']}`; const defaultActionSettings = schemaSettings || 'ActionSettings'; const hasAction = app.schemaSettingsManager.has(settingsName); diff --git a/packages/core/client/src/schema-component/antd/action/hooks.ts b/packages/core/client/src/schema-component/antd/action/hooks.ts index ea74f18af4..f74dd9e57e 100644 --- a/packages/core/client/src/schema-component/antd/action/hooks.ts +++ b/packages/core/client/src/schema-component/antd/action/hooks.ts @@ -63,5 +63,5 @@ export const useLinkageAction = () => { const fieldSchema = useFieldSchema(); const isRecordAction = useIsDetailBlock(); const isAction = ['Action.Link', 'Action'].includes(fieldSchema['x-component']); - return isAction && isRecordAction; + return isAction && isRecordAction && fieldSchema['x-action']; }; diff --git a/packages/core/client/src/schema-component/antd/association-field/InternalSubTable.tsx b/packages/core/client/src/schema-component/antd/association-field/InternalSubTable.tsx index 8777418642..eaf53fe9df 100644 --- a/packages/core/client/src/schema-component/antd/association-field/InternalSubTable.tsx +++ b/packages/core/client/src/schema-component/antd/association-field/InternalSubTable.tsx @@ -25,6 +25,9 @@ export const InternalSubTable = observer( const fieldSchema = useFieldSchema(); const insert = useInsertSchema('SubTable'); const insertSelector = useInsertSchema('Selector'); + const insertSelect = useInsertSchema('SubTable.SelectAction'); + const insertAddNewAction = useInsertSchema('SubTable.AddNewAction'); + const { options } = useAssociationFieldContext(); const { actionName } = useACLActionParamsContext(); useEffect(() => { @@ -34,8 +37,14 @@ export const InternalSubTable = observer( useEffect(() => { if (field.componentProps?.allowSelectExistingRecord) { insertSelector(schema.Selector); + insertSelect(schema.SelectAction); } }, [field.componentProps?.allowSelectExistingRecord]); + useEffect(() => { + if (field.componentProps?.allowAddnew !== false) { + insertAddNewAction(schema.AddNewAction); + } + }, [field.componentProps?.allowAddnew]); const option = useSchemaOptionsContext(); const components = { ...option.components, diff --git a/packages/core/client/src/schema-component/antd/association-field/SubTable.tsx b/packages/core/client/src/schema-component/antd/association-field/SubTable.tsx index d8ad5b6372..6ae35139c2 100644 --- a/packages/core/client/src/schema-component/antd/association-field/SubTable.tsx +++ b/packages/core/client/src/schema-component/antd/association-field/SubTable.tsx @@ -13,9 +13,9 @@ import { exchangeArrayState } from '@formily/core/esm/shared/internals'; import { observer, useFieldSchema } from '@formily/react'; import { action } from '@formily/reactive'; import { isArr } from '@formily/shared'; -import { Button } from 'antd'; import React, { useContext, useEffect, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; +import { Space } from 'antd'; import { FormProvider, RecordPickerContext, @@ -32,12 +32,13 @@ import { markRecordAsNew } from '../../../data-source/collection-record/isNewRec import { FlagProvider } from '../../../flag-provider'; import { NocoBaseRecursionField } from '../../../formily/NocoBaseRecursionField'; import { useCompile } from '../../hooks'; -import { ActionContextProvider } from '../action'; +import { ActionContextProvider, ActionDesigner, Action } from '../action'; import { useSubTableSpecialCase } from '../form-item/hooks/useSpecialCase'; import { SubFormProvider, useAssociationFieldContext, useFieldNames } from './hooks'; import { useTableSelectorProps } from './InternalPicker'; import { Table } from './Table'; import { getLabelFormatValue, useLabelUiSchema } from './util'; +import { GeneralSchemaDesigner } from '../../../schema-settings'; const subTableContainer = css` .ant-table-footer { @@ -80,16 +81,27 @@ const tableClassName = css` `; const addNewButtonClassName = css` - display: block; - border-radius: 0px; - border-right: 1px solid rgba(0, 0, 0, 0.06); + .ant-btn { + // display: block; + // border-radius: 0px; + // border-right: 1px solid rgba(0, 0, 0, 0.06); + } `; const selectButtonClassName = css` - display: block; - border-radius: 0px; + .ant-btn { + // display: block; + // border-radius: 0px; + } `; +export const AddNewAction = (props) => { + return
{props.children}
; +}; +export const SelectAction = (props) => { + return
{props.children}
; +}; + export const SubTable: any = observer( (props: any) => { const { openSize } = props; @@ -196,6 +208,25 @@ export const SubTable: any = observer( hideOnSinglePage: false, }; }, [field.value?.length, pageSize, currentPage]); + + const useSubTableAddNewProps = () => { + const { field } = useAssociationFieldContext(); + return { + onClick() { + field.value = field.value || []; + field.value.push(markRecordAsNew({})); + // 计算总页数，并跳转到最后一页 + const totalPages = Math.ceil(field.value.length / (field.componentProps?.pageSize || 10)); + setTimeout(() => { + setCurrentPage(totalPages); + }); + return field.onInput(field.value); + }, + }; + }; + const handleSelect = () => { + setVisibleSelector(true); + }; return (
@@ -224,43 +255,40 @@ export const SubTable: any = observer( } pagination={paginationConfig} rowSelection={{ type: 'none', hideSelectAll: true }} - footer={() => - field.editable && ( - <> - {allowAddnew !== false && ( - - )} - {allowSelectExistingRecord && ( - - )} - - ) - } isSubTable={true} /> + {field.editable && ( + + + {allowAddnew !== false && ( + { + return s['x-component'] === 'AssociationField.SubTable.AddNewAction'; + }} + /> + )} + {allowSelectExistingRecord && ( + { + return s['x-component'] === 'AssociationField.SubTable.SelectAction'; + }} + /> + )} + + + )} diff --git a/packages/core/client/src/schema-component/antd/association-field/index.ts b/packages/core/client/src/schema-component/antd/association-field/index.ts index 61ba03f687..7efe5e47ba 100644 --- a/packages/core/client/src/schema-component/antd/association-field/index.ts +++ b/packages/core/client/src/schema-component/antd/association-field/index.ts @@ -14,7 +14,7 @@ import { FileSelector } from './FileManager'; import { InternalPicker } from './InternalPicker'; import { Nester } from './Nester'; import { ReadPretty } from './ReadPretty'; -import { SubTable } from './SubTable'; +import { SubTable, AddNewAction, SelectAction } from './SubTable'; export { AssociationFieldMode, @@ -32,5 +32,7 @@ AssociationField.Viewer = Action.Container; AssociationField.InternalSelect = InternalPicker; AssociationField.ReadPretty = ReadPretty; AssociationField.FileSelector = FileSelector; +AssociationField.SubTable.AddNewAction = AddNewAction; +AssociationField.SubTable.SelectAction = SelectAction; export { useAssociationFieldContext } from './hooks'; diff --git a/packages/core/client/src/schema-component/antd/association-field/schema.ts b/packages/core/client/src/schema-component/antd/association-field/schema.ts index 1e15444679..fd7e23ae2c 100644 --- a/packages/core/client/src/schema-component/antd/association-field/schema.ts +++ b/packages/core/client/src/schema-component/antd/association-field/schema.ts @@ -140,4 +140,55 @@ export default { }, properties: {}, }, + AddNewAction: { + type: 'void', + 'x-component': 'AssociationField.SubTable.AddNewAction', + properties: { + 'add-new': { + type: 'void', + title: '{{ t("Add new") }}', + 'x-component': 'Action', + 'x-designer': 'Action.Designer', + 'x-action': null, + 'x-designer-props': { + enableDrag: false, + }, + 'x-action-settings': { + removable: false, + disableSecondConFirm: true, + }, + 'x-use-component-props': 'useSubTableAddNewProps', + 'x-component-props': { + type: 'default', + onClick: '{{handleAddNew}}', + size: 'small', + }, + }, + }, + }, + SelectAction: { + type: 'void', + 'x-component': 'AssociationField.SubTable.SelectAction', + properties: { + select: { + type: 'void', + title: '{{ t("Select") }}', + 'x-component': 'Action', + 'x-action': null, + 'x-designer': 'Action.Designer', + 'x-designer-props': { + enableDrag: false, + }, + 'x-action-settings': { + removable: false, + disableSecondConFirm: true, + }, + 'x-component-props': { + type: 'default', + onClick: '{{handleSelect}}', + size: 'small', + }, + }, + }, + }, };