mirror of
https://github.com/nocobase/nocobase
synced 2024-11-15 23:26:38 +00:00
perf(LinkageRules): improve style performance
This commit is contained in:
parent
26f100c9e4
commit
5d2a9ace48
@ -7,12 +7,6 @@
|
||||
* For more information, please refer to: https://www.nocobase.com/agreement.
|
||||
*/
|
||||
|
||||
import { createStyles } from 'antd-style';
|
||||
|
||||
export const useStyles = createStyles(() => {
|
||||
return {
|
||||
arrayCollapseItem: {
|
||||
marginBottom: '10px',
|
||||
},
|
||||
};
|
||||
});
|
||||
export const arrayCollapseItemStyle = {
|
||||
marginBottom: 10,
|
||||
};
|
||||
|
@ -13,12 +13,11 @@ import { ArrayField } from '@formily/core';
|
||||
import { ISchema, RecursionField, observer, useField, useFieldSchema } from '@formily/react';
|
||||
import { toArr } from '@formily/shared';
|
||||
import { Badge, Card, Collapse, CollapsePanelProps, CollapseProps, Empty, Input } from 'antd';
|
||||
import cls from 'classnames';
|
||||
import { cloneDeep } from 'lodash';
|
||||
import React, { Fragment, useEffect, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useToken } from '../../../style';
|
||||
import { useStyles } from './LinkageHeader.style';
|
||||
import { arrayCollapseItemStyle } from './LinkageHeader.style';
|
||||
|
||||
const LinkageRulesTitle = (props) => {
|
||||
const array = ArrayBase.useArray();
|
||||
@ -103,7 +102,6 @@ const insertActiveKeys = (activeKeys: number[], index: number) => {
|
||||
|
||||
export const ArrayCollapse: ComposedArrayCollapse = observer(
|
||||
(props: IArrayCollapseProps) => {
|
||||
const { styles } = useStyles();
|
||||
const field = useField<ArrayField>();
|
||||
const dataSource = Array.isArray(field.value) ? field.value : [];
|
||||
const [activeKeys, setActiveKeys] = useState<number[]>(
|
||||
@ -128,7 +126,7 @@ export const ArrayCollapse: ComposedArrayCollapse = observer(
|
||||
const renderEmpty = () => {
|
||||
if (dataSource.length) return;
|
||||
return (
|
||||
<Card className={cls(`${styles.arrayCollapseItem}`, props.className)}>
|
||||
<Card className={props.className} style={arrayCollapseItemStyle}>
|
||||
<Empty />
|
||||
</Card>
|
||||
);
|
||||
@ -140,7 +138,8 @@ export const ArrayCollapse: ComposedArrayCollapse = observer(
|
||||
{...props}
|
||||
activeKey={activeKeys}
|
||||
onChange={(keys: string[]) => setActiveKeys(toArr(keys).map(Number))}
|
||||
className={cls(`${styles.arrayCollapseItem}`, props.className)}
|
||||
className={props.className}
|
||||
style={arrayCollapseItemStyle}
|
||||
>
|
||||
{dataSource.map((item, index) => {
|
||||
const items = Array.isArray(schema.items) ? schema.items[index] || schema.items[0] : schema.items;
|
||||
|
Loading…
Reference in New Issue
Block a user