mirrors/nocobase
1
0
Fork 0
mirror of https://github.com/nocobase/nocobase synced 2024-11-14 22:27:40 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: subform/subtable height equaling form height when form height is set (#4717)

Browse Source 
* fix: subform height equaling form height when form height is set

* fix: bug

* fix: bug

* fix: bug

* fix: bug

* fix: bug

* fix: bug

* fix: bug

* fix: bug
This commit is contained in:
Katherine 2024-06-20 21:21:55 +08:00 committed by GitHub
parent f7f1bdffbb
commit 4671a17628
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 45 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/core/client/src/schema-component/antd/association-field/InternalNester.tsx
View File

@ -53,9 +53,18 @@ export const InternalNester = observer(
<ACLCollectionProvider actionPath={`${collectionField.target}:${actionName}`}>
<FormLayout layout={'vertical'}>
<div
className={cx(InternalNesterCss, {
[InternalNesterCardCss]: showTitle === false,
})}
className={cx(
InternalNesterCss,
{
[InternalNesterCardCss]: showTitle === false,
},
css`
.nb-grid-container {
height: 100% !important;
margin-bottom: 0px;
}
`,
)}
>
<RecursionField
onlyRenderProperties

4
packages/core/client/src/schema-component/antd/association-field/InternalSubTable.tsx
View File

@ -59,6 +59,10 @@ export const InternalSubTable = observer(
margin: 0px !important;
}
}
.ant-table-body {
max-height: 100% !important;
min-height: 100% !important;
}
`}
layout={'vertical'}
bordered={false}

6
packages/core/client/src/schema-component/antd/form-v2/Form.tsx
View File

@ -17,7 +17,7 @@ import { getValuesByPath } from '@nocobase/utils/client';
import { ConfigProvider, Spin, theme } from 'antd';
import React, { useEffect, useMemo } from 'react';
import { useActionContext } from '..';
import { useAttach, useComponent } from '../..';
import { useAttach, useComponent, useDesignable } from '../..';
import { useTemplateBlockContext } from '../../../block-provider/TemplateBlockProvider';
import { withDynamicSchemaProps } from '../../../hoc/withDynamicSchemaProps';
import { ActionType } from '../../../schema-settings/LinkageRules/type';
@ -45,7 +45,7 @@ const FormComponent: React.FC<FormProps> = (props) => {
const f = useAttach(form.createVoidField({ ...field.props, basePath: '' }));
const height = useFormBlockHeight();
const { token } = theme.useToken();
const { designable } = useDesignable();
return (
<FieldContext.Provider value={undefined}>
<FormContext.Provider value={form}>
@ -55,7 +55,7 @@ const FormComponent: React.FC<FormProps> = (props) => {
.nb-grid-container {
height: ${height ? height + 'px' : '100%'};
overflow-y: auto;
margin: 0px -${token.marginLG}px;
margin: 0px -${token.marginLG}px ${designable ? 0 : -token.marginLG}px;
padding: 0px ${token.paddingLG}px;
}
`}

30
packages/core/client/src/schema-component/antd/form-v2/hook.ts
View File

@ -11,7 +11,7 @@ import { theme } from 'antd';
import { useFieldSchema } from '@formily/react';
import { useDataBlockHeight } from '../../hooks/useBlockSize';
import { useDesignable } from '../../';
import { useDataBlockRequest } from '../../../data-source';
import { useCollection, useDataBlockRequest } from '../../../data-source';
import { useFormDataTemplates } from './Templates';
import { useBlockHeightProps } from '../../../block-provider/hooks/useBlockHeightProps';
@ -31,12 +31,34 @@ export const useFormBlockHeight = () => {
});
const hasFormActions = Object.keys(actionSchema?.properties || {}).length > 0;
const actionBarHeight = hasFormActions || designable ? token.controlHeight + 2 * token.marginLG : 2 * token.marginLG;
const isFormBlock = schema?.parent?.['x-decorator']?.includes?.('FormBlockProvider');
const actionBarPadding = () => {
if (isFormBlock) {
return designable ? 2 : 1;
}
return 2;
};
const actionBarHeight =
hasFormActions || designable ? token.controlHeight + actionBarPadding() * token.marginLG : 1 * token.marginLG;
const blockTitleHeaderHeight = title ? token.fontSizeLG * token.lineHeightLG + token.padding * 2 - 1 : 0;
const { data } = useDataBlockRequest() || {};
const { count, pageSize } = (data as any)?.meta || ({} as any);
const hasPagination = count > pageSize;
const paginationHeight = hasPagination ? token.controlHeightSM + 1 * token.paddingLG : 0;
const paginationHeight = hasPagination ? token.controlHeightSM + (designable ? 1 : 0) * token.paddingLG : 0;
const dataTemplateHeight = display && enabled ? token.controlHeight + 2 * token.padding + token.margin : 0;
return height - actionBarHeight - token.paddingLG - blockTitleHeaderHeight - paginationHeight - dataTemplateHeight;
const blockBottomPadding = () => {
if (!isFormBlock && !hasPagination) {
return designable ? 1 : 0;
}
return 1;
};
return (
height -
actionBarHeight -
blockBottomPadding() * token.paddingLG -
blockTitleHeaderHeight -
paginationHeight -
dataTemplateHeight
);
};