fix(plugin-formula): fix read-pretty component when used in association field (#1957)

This commit is contained in:
Junyi 2023-05-30 15:15:42 +07:00 committed by GitHub
parent 3f4cd86465
commit cf4e91b0f2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 21 additions and 12 deletions

View File

@ -1,6 +1,6 @@
import { onFormValuesChange } from '@formily/core'; import { onFormValuesChange } from '@formily/core';
import { useFieldSchema, useFormEffects, useForm } from '@formily/react'; import { useFieldSchema, useFormEffects, useForm } from '@formily/react';
import { Checkbox, DatePicker, InputNumber, Input as InputString, useCollection } from '@nocobase/client'; import { Checkbox, DatePicker, InputNumber, Input as InputString, useCollection, useCollectionManager } from '@nocobase/client';
import { Evaluator, evaluators } from '@nocobase/evaluators/client'; import { Evaluator, evaluators } from '@nocobase/evaluators/client';
import { Registry, toFixedByStep } from '@nocobase/utils/client'; import { Registry, toFixedByStep } from '@nocobase/utils/client';
import cloneDeep from 'lodash/cloneDeep'; import cloneDeep from 'lodash/cloneDeep';
@ -18,15 +18,29 @@ const TypedComponents = {
string: InputString, string: InputString,
}; };
function useTargetCollectionField() {
const fieldSchema = useFieldSchema();
const providedCollection = useCollection();
const { getCollection, getCollectionField } = useCollectionManager();
const paths = (fieldSchema.name as string).split('.');
let collection = providedCollection;
for (let i = 0; i < paths.length - 1; i++) {
const field = collection.getField(paths[i]);
collection = getCollection(field.target);
}
return getCollectionField(`${collection.name}.${paths[paths.length - 1]}`);
}
export const Result = (props) => { export const Result = (props) => {
const { value, ...others } = props; const { value, ...others } = props;
const { getField } = useCollection();
const fieldSchema = useFieldSchema(); const fieldSchema = useFieldSchema();
const options = getField(fieldSchema.name as string); const { name, dataType, expression, engine = 'math.js' } = useTargetCollectionField() ?? {};
const { dataType, expression, engine = 'math.js' } = options || {};
const { evaluate } = (evaluators as Registry<Evaluator>).get(engine); const { evaluate } = (evaluators as Registry<Evaluator>).get(engine);
useFormEffects(() => { useFormEffects(() => {
onFormValuesChange((form) => { onFormValuesChange((form) => {
if ((fieldSchema.name as string).indexOf('.') >= 0) {
return;
}
const scope = cloneDeep(form.values); const scope = cloneDeep(form.values);
let v; let v;
try { try {
@ -38,16 +52,11 @@ export const Result = (props) => {
if ((v == null && value == null) || JSON.stringify(v) === JSON.stringify(value)) { if ((v == null && value == null) || JSON.stringify(v) === JSON.stringify(value)) {
return; return;
} }
// console.log(options.name, v, value, props.defaultValue); form.setValuesIn(name, v);
form.setValuesIn(options.name, v);
}); });
}); });
const Component = TypedComponents[dataType] ?? InputString; const Component = TypedComponents[dataType] ?? InputString;
return <Component {...others} value={dataType === 'double' ? toFixedByStep(value, props.step) : value} />; return <Component {...others} value={dataType === 'double' ? toFixedByStep(value, props.step) : value} />;
}; };
Result.ReadPretty = function ReadPretty(props) {
return props.value ?? null;
};
export default Result; export default Result;

View File

@ -6,6 +6,6 @@ import Result from './Result';
export const Formula = () => null; export const Formula = () => null;
Formula.Expression = Expression; Formula.Expression = Expression;
Formula.Result = connect(Result, mapReadPretty(Result.ReadPretty)); Formula.Result = connect(Result);
export default Formula; export default Formula;

View File

@ -67,7 +67,7 @@ export default {
type: 'formula', type: 'formula',
// name, // name,
uiSchema: { uiSchema: {
type: 'number', type: 'string',
// title, // title,
'x-component': 'Formula.Result', 'x-component': 'Formula.Result',
'x-component-props': { 'x-component-props': {