fix: formula field and percent field (#467)
* fix: formula field & percent field * fix: percent field * fix: percent field
This commit is contained in:
parent
bfc686c182
commit
d6d14459ed
@ -1,11 +1,14 @@
|
|||||||
import { useForm } from '@formily/react';
|
import { Field } from '@formily/core';
|
||||||
|
import { useFieldSchema, useForm } from '@formily/react';
|
||||||
import { action } from '@formily/reactive';
|
import { action } from '@formily/reactive';
|
||||||
import { uid } from '@formily/shared';
|
import { uid } from '@formily/shared';
|
||||||
import React, { useEffect, useState } from 'react';
|
import React, { useContext, useEffect, useState } from 'react';
|
||||||
import { useRequest } from '../../api-client';
|
import { useRequest } from '../../api-client';
|
||||||
import { useRecord } from '../../record-provider';
|
import { useRecord } from '../../record-provider';
|
||||||
import { SchemaComponent, useActionContext, useCompile } from '../../schema-component';
|
import { SchemaComponent, useActionContext, useCompile } from '../../schema-component';
|
||||||
|
import { useCollection } from '../hooks';
|
||||||
import { useCollectionManager } from '../hooks/useCollectionManager';
|
import { useCollectionManager } from '../hooks/useCollectionManager';
|
||||||
|
import { DataSourceContext } from '../sub-table';
|
||||||
import { AddSubFieldAction } from './AddSubFieldAction';
|
import { AddSubFieldAction } from './AddSubFieldAction';
|
||||||
import { EditSubFieldAction } from './EditSubFieldAction';
|
import { EditSubFieldAction } from './EditSubFieldAction';
|
||||||
import { collectionSchema } from './schemas/collections';
|
import { collectionSchema } from './schemas/collections';
|
||||||
@ -149,6 +152,19 @@ const useBulkDestroySubField = () => {
|
|||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const useCurrentFields = () => {
|
||||||
|
const record = useRecord();
|
||||||
|
|
||||||
|
if (record.__parent && record.__parent.interface === 'subTable') {
|
||||||
|
const ctx = useContext(DataSourceContext);
|
||||||
|
return ctx.dataSource;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { getCollectionFields } = useCollectionManager();
|
||||||
|
const fields = getCollectionFields(record.collectionName || record.name) as any[];
|
||||||
|
return fields;
|
||||||
|
}
|
||||||
|
|
||||||
export const ConfigurationTable = () => {
|
export const ConfigurationTable = () => {
|
||||||
const { collections = [] } = useCollectionManager();
|
const { collections = [] } = useCollectionManager();
|
||||||
const compile = useCompile();
|
const compile = useCompile();
|
||||||
@ -173,6 +189,7 @@ export const ConfigurationTable = () => {
|
|||||||
useCollectionValues,
|
useCollectionValues,
|
||||||
useAsyncDataSource,
|
useAsyncDataSource,
|
||||||
loadCollections,
|
loadCollections,
|
||||||
|
useCurrentFields,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -32,8 +32,9 @@ export const formula: IField = {
|
|||||||
'x-component': 'Formula.Expression',
|
'x-component': 'Formula.Expression',
|
||||||
'x-decorator': 'FormItem',
|
'x-decorator': 'FormItem',
|
||||||
'x-component-props': {
|
'x-component-props': {
|
||||||
'supports': ['number', 'percent']
|
'supports': ['number', 'percent'],
|
||||||
}
|
'useCurrentFields': '{{ useCurrentFields }}'
|
||||||
|
},
|
||||||
},
|
},
|
||||||
'uiSchema.x-component-props.step': {
|
'uiSchema.x-component-props.step': {
|
||||||
type: 'string',
|
type: 'string',
|
||||||
|
@ -1,23 +1,16 @@
|
|||||||
import { CloseOutlined, LoadingOutlined } from '@ant-design/icons';
|
|
||||||
import { useFormLayout } from '@formily/antd';
|
|
||||||
import { Field, onFormSubmitValidateStart } from '@formily/core';
|
import { Field, onFormSubmitValidateStart } from '@formily/core';
|
||||||
import { connect, mapProps, mapReadPretty, useField, useFieldSchema, useFormEffects } from '@formily/react';
|
import { connect, mapProps, mapReadPretty, useField, useFieldSchema, useFormEffects } from '@formily/react';
|
||||||
import { isValid } from '@formily/shared';
|
|
||||||
import { Button, Input, Popover, Tag, Menu, Dropdown } from 'antd';
|
import { Button, Input, Popover, Tag, Menu, Dropdown } from 'antd';
|
||||||
import React, { useEffect, useRef, useState } from 'react';
|
import React, { useContext, useEffect, useRef, useState } from 'react';
|
||||||
import ContentEditable from 'react-contenteditable';
|
import ContentEditable from 'react-contenteditable';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import * as math from 'mathjs';
|
import * as math from 'mathjs';
|
||||||
import { useCollectionManager } from '../../../collection-manager/hooks';
|
|
||||||
import { useRecord } from '../../../record-provider';
|
|
||||||
|
|
||||||
const AntdFormulaInput = (props) => {
|
const AntdFormulaInput = (props) => {
|
||||||
const { value, onChange, supports } = props;
|
const { value, onChange, supports, useCurrentFields } = props;
|
||||||
const field = useField<Field>();
|
const field = useField<Field>();
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const record = useRecord();
|
const fields = useCurrentFields();
|
||||||
const { getCollectionFields } = useCollectionManager();
|
|
||||||
const fields = getCollectionFields(record.collectionName || record.name) as any[];
|
|
||||||
|
|
||||||
const inputRef = useRef();
|
const inputRef = useRef();
|
||||||
const [dropdownVisible, setDropdownVisible] = useState(false);
|
const [dropdownVisible, setDropdownVisible] = useState(false);
|
||||||
@ -121,7 +114,8 @@ const AntdFormulaInput = (props) => {
|
|||||||
|
|
||||||
export const FormulaInput = connect(
|
export const FormulaInput = connect(
|
||||||
AntdFormulaInput,
|
AntdFormulaInput,
|
||||||
mapProps(),
|
mapProps({
|
||||||
|
}),
|
||||||
);
|
);
|
||||||
|
|
||||||
export default FormulaInput;
|
export default FormulaInput;
|
@ -2,6 +2,7 @@ import { connect, mapReadPretty } from '@formily/react';
|
|||||||
import { InputNumber } from 'antd';
|
import { InputNumber } from 'antd';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { ReadPretty } from '../input-number/ReadPretty';
|
import { ReadPretty } from '../input-number/ReadPretty';
|
||||||
|
import * as math from 'mathjs';
|
||||||
|
|
||||||
export const Percent = connect(
|
export const Percent = connect(
|
||||||
(props) => {
|
(props) => {
|
||||||
@ -11,16 +12,16 @@ export const Percent = connect(
|
|||||||
<InputNumber
|
<InputNumber
|
||||||
{...props}
|
{...props}
|
||||||
addonAfter="%"
|
addonAfter="%"
|
||||||
value={value * 100}
|
value={math.round(value * 100, 9)}
|
||||||
onChange={(v: any) => {
|
onChange={(v: any) => {
|
||||||
if (onChange) {
|
if (onChange) {
|
||||||
onChange(v / 100);
|
onChange(math.round(v / 100, 9));
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
mapReadPretty((props) => {
|
mapReadPretty((props) => {
|
||||||
return (<ReadPretty {...props} value={props.value ? props.value * 100 : null} />);
|
return (<ReadPretty {...props} value={props.value ? math.round(props.value * 100, 9) : null} />);
|
||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
|
Loading…
Reference in New Issue
Block a user