fix(plugin-workflow): fix aggregate node association select (#2438)
This commit is contained in:
parent
78b49b82ac
commit
9223999db2
@ -1,6 +1,6 @@
|
|||||||
import { useForm } from '@formily/react';
|
import { useForm } from '@formily/react';
|
||||||
import { Cascader } from 'antd';
|
import { Cascader } from 'antd';
|
||||||
import React, { useCallback } from 'react';
|
import React, { useCallback, useEffect, useState } from 'react';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
SchemaComponentContext,
|
SchemaComponentContext,
|
||||||
@ -21,15 +21,13 @@ function matchToManyField(field, appends): boolean {
|
|||||||
const fieldPrefix = `${field.name}.`;
|
const fieldPrefix = `${field.name}.`;
|
||||||
return (
|
return (
|
||||||
['hasMany', 'belongsToMany'].includes(field.type) &&
|
['hasMany', 'belongsToMany'].includes(field.type) &&
|
||||||
(appends.includes(field.name) || appends.some((item) => item.startsWith(fieldPrefix)))
|
(appends ? appends.includes(field.name) || appends.some((item) => item.startsWith(fieldPrefix)) : true)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function AssociatedConfig({ value, onChange, ...props }): JSX.Element {
|
function useAssociatedFields() {
|
||||||
const { setValuesIn } = useForm();
|
|
||||||
const compile = useCompile();
|
const compile = useCompile();
|
||||||
const { getCollection } = useCollectionManager();
|
return [nodesOptions, triggerOptions].map((item) => {
|
||||||
const options = [nodesOptions, triggerOptions].map((item) => {
|
|
||||||
const children = item.useOptions({ types: [matchToManyField] })?.filter(Boolean);
|
const children = item.useOptions({ types: [matchToManyField] })?.filter(Boolean);
|
||||||
return {
|
return {
|
||||||
label: compile(item.label),
|
label: compile(item.label),
|
||||||
@ -39,6 +37,13 @@ function AssociatedConfig({ value, onChange, ...props }): JSX.Element {
|
|||||||
disabled: children && !children.length,
|
disabled: children && !children.length,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function AssociatedConfig({ value, onChange, ...props }): JSX.Element {
|
||||||
|
const { setValuesIn } = useForm();
|
||||||
|
const { getCollection } = useCollectionManager();
|
||||||
|
const baseOptions = useAssociatedFields();
|
||||||
|
const [options, setOptions] = useState(baseOptions);
|
||||||
|
|
||||||
const { associatedKey = '', name: fieldName } = value ?? {};
|
const { associatedKey = '', name: fieldName } = value ?? {};
|
||||||
let p = [];
|
let p = [];
|
||||||
@ -47,6 +52,43 @@ function AssociatedConfig({ value, onChange, ...props }): JSX.Element {
|
|||||||
p = [...matched[1].trim().split('.').slice(0, -1), fieldName];
|
p = [...matched[1].trim().split('.').slice(0, -1), fieldName];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const loadData = async (selectedOptions) => {
|
||||||
|
const option = selectedOptions[selectedOptions.length - 1];
|
||||||
|
if (!option.children?.length && !option.isLeaf && option.loadChildren) {
|
||||||
|
await option.loadChildren(option);
|
||||||
|
setOptions((prev) => [...prev]);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const run = async () => {
|
||||||
|
if (!p || options.length <= 1) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let prevOption = null;
|
||||||
|
|
||||||
|
for (let i = 0; i < p.length; i++) {
|
||||||
|
const key = p[i];
|
||||||
|
try {
|
||||||
|
if (i === 0) {
|
||||||
|
prevOption = options.find((item) => item.value === key);
|
||||||
|
} else {
|
||||||
|
if (prevOption.loadChildren && !prevOption.children?.length) {
|
||||||
|
await prevOption.loadChildren(prevOption);
|
||||||
|
}
|
||||||
|
prevOption = prevOption.children.find((item) => item.value === key);
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.error(err);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setOptions([...options]);
|
||||||
|
};
|
||||||
|
|
||||||
|
run();
|
||||||
|
// NOTE: watch `options.length` and it only happens once
|
||||||
|
}, [value, options.length]);
|
||||||
|
|
||||||
const onSelectChange = useCallback(
|
const onSelectChange = useCallback(
|
||||||
(path, option) => {
|
(path, option) => {
|
||||||
if (!path?.length) {
|
if (!path?.length) {
|
||||||
@ -78,7 +120,7 @@ function AssociatedConfig({ value, onChange, ...props }): JSX.Element {
|
|||||||
[onChange],
|
[onChange],
|
||||||
);
|
);
|
||||||
|
|
||||||
return <Cascader {...props} value={p} options={options} onChange={onSelectChange} />;
|
return <Cascader {...props} value={p} options={options} onChange={onSelectChange} loadData={loadData as any} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
// based on collection:
|
// based on collection:
|
||||||
|
Loading…
Reference in New Issue
Block a user