lu-lowcode-package-form 0.11.46 → 0.11.50

package/src/components/form-container/index.jsx

@@ -65,6 +65,40 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
     }
     // 调用setFieldsValue时,进入锁定状态,阻止因字段值变化而触发级联处理
     const lockStatus = React.useRef(0);
+    // // 字段变更源跟踪，用于处理双向依赖问题
+    // const updateSourceRef = React.useRef(new Map());
+    // 更新周期依赖图，用于处理复杂循环依赖 (如 a→b→c→a)
+    const dependencyGraphRef = React.useRef({
+        // 当前更新周期ID
+        currentCycleId: 0,
+        // 当前更新周期的依赖路径
+        updatePath: [],
+        // 开始新的更新周期
+        startNewCycle: function() {
+            this.currentCycleId++;
+            this.updatePath = [];
+            return this.currentCycleId;
+        },
+        // 添加依赖路径
+        addToPath: function(fieldId) {
+            this.updatePath.push(fieldId);
+        },
+        // 检查是否形成循环
+        hasCircularDependency: function(targetFieldId) {
+            return this.updatePath.includes(targetFieldId);
+        },
+        // 获取当前依赖路径
+        getCurrentPath: function() {
+            return [...this.updatePath];
+        },
+        // 结束当前字段的处理
+        finishField: function() {
+            if (this.updatePath.length > 0) {
+                this.updatePath.pop();
+            }
+        }
+    });
+    
     React.useImperativeHandle(ref, () => ({
         formRef: form,
         setFieldsValue: (values) => {
@@ -130,6 +164,7 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
         // return current;
     }
     const initializeDependencyMap = async () => {
+        
         const fields = [];
         function traverse(currentNode, parentNode = null) {
             var componentName = currentNode.type?.displayName || currentNode.props?._componentName;
@@ -177,6 +212,8 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
     };
     const initializeFieldVisibilityImmediate = async (reloadFields = false) => {
         console.log("initializeFieldVisibility *************************************")
+     
+        
         const fieldValues = form.getFieldsValue();
        
         await Promise.all(Array.from(dependencyMap.current.keys()).map(async (key) => {
@@ -195,7 +232,7 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
 
 
     // 计算字段级联关系
-    const handleFieldsWith = async (identifier, fieldValues, init = false) => {
+    const handleFieldsWith = async (identifier, fieldValues, init = false, fieldId = null) => {
         // console.log("handleFieldsWith identifier", identifier)
         let needRefresh = false;
         let parentIdentifier = [];
@@ -203,34 +240,53 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
             parentIdentifier = [...(identifier.slice(0, -1))]
             identifier = identifier.filter(item => typeof item == "string").join(".")
         }
-        if (dependencyMap.current.has(identifier)) {
-            const dependent = dependencyMap.current.get(identifier)
-            const dependentChildren = dependent.children;
+        
+        // 将标识符标准化为字符串，用于依赖图谱
+        const currentFieldId = fieldId || identifier;
+        
+        // 检查是否在当前更新链路中已存在，避免循环依赖
+        if (dependencyGraphRef.current.hasCircularDependency(currentFieldId)) {
+            const currentPath = dependencyGraphRef.current.getCurrentPath();
+            console.log(`检测到循环依赖链路: ${[...currentPath, currentFieldId].join(' -> ')}`);
+            return false;
+        }
+        
+        // 将当前字段添加到依赖路径
+        dependencyGraphRef.current.addToPath(currentFieldId);
+        
+        try {
+            if (dependencyMap.current.has(identifier)) {
+                const dependent = dependencyMap.current.get(identifier)
+                const dependentChildren = dependent.children;
 
 
-            if (!init && dependent?.fillRules && Array.isArray(dependent?.fillRules) && dependent?.fillRules.length > 0) {
-                handleFillRules(identifier, parentIdentifier, fieldValues, dependent?.fillRules)
-            }
-            for (let index = 0; index < dependentChildren.length; index++) {
-                const child = dependentChildren[index];
-                if (child.component.props.withVisibleFunc && typeof child.component.props.withVisibleFunc === 'function') {
-                    let needRefresh_ = handleFieldsVisibleFunc(fieldValues, child, parentIdentifier)
-                    needRefresh = needRefresh || needRefresh_
+                if (!init && dependent?.fillRules && Array.isArray(dependent?.fillRules) && dependent?.fillRules.length > 0) {
+                    handleFillRules(identifier, parentIdentifier, fieldValues, dependent?.fillRules)
                 }
+                for (let index = 0; index < dependentChildren.length; index++) {
+                    const child = dependentChildren[index];
+                    if (child.component.props.withVisibleFunc && typeof child.component.props.withVisibleFunc === 'function') {
+                        let needRefresh_ = handleFieldsVisibleFunc(fieldValues, child, parentIdentifier)
+                        needRefresh = needRefresh || needRefresh_
+                    }
 
-                if (child.component.props.withVisible) {
-                    let needRefresh_ = await handleFieldsVisible(fieldValues, child, parentIdentifier, dependent?.componentName)
-                    needRefresh = needRefresh || needRefresh_
-                }
+                    if (child.component.props.withVisible) {
+                        let needRefresh_ = await handleFieldsVisible(fieldValues, child, parentIdentifier, dependent?.componentName)
+                        needRefresh = needRefresh || needRefresh_
+                    }
 
 
-                if (!init && child.component.props.withFill)
-                    handleFieldsWithFill(fieldValues, child, parentIdentifier, dependent?.componentName)
+                    if (!init && child.component.props.withFill)
+                        await handleFieldsWithFill(fieldValues, child, parentIdentifier, dependent?.componentName, currentFieldId)
 
+                }
             }
+        } finally {
+            // 在处理完毕后，从依赖路径中移除当前字段
+            dependencyGraphRef.current.finishField();
         }
+        
         return needRefresh;
-
     };
     const removeLastFieldsValues = (name, isTable = false) => {
         if (!lastFormValues.current) return
@@ -258,6 +314,7 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
         if (changedKeys.length > 0) {
             changedKeys.forEach(key => {
                 recordFieldChange(key, changedFields[key])
+                
             })
             if (handleChange) debounceHandleFieldsChange();
         }
@@ -269,12 +326,40 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
         let current_value = getParamValue("fieldsValue", current_identifier, fieldValues, null)
         let changedFields = {}
 
+        // 将标识符标准化为字符串
+        const sourceFieldId = Array.isArray(current_identifier) 
+            ? current_identifier.filter(item => typeof item == "string").join(".")
+            : current_identifier;
+
         let idGroups = []
         for (let index = 0; index < fillRules.length; index++) {
             const rule = fillRules[index];
             let { source, target } = rule
             let source_value = current_value?.[source]
             let setValue = source_value
+            
+            // 将sourceField格式化为字符串形式，用于依赖跟踪
+            const sourceField = Array.isArray(current_identifier) 
+                ? current_identifier.filter(item => typeof item == "string").join(".")
+                : current_identifier;
+            
+            // 格式化目标字段
+            const targetField = Array.isArray(target) 
+                ? target.filter(item => typeof item == "string").join(".")
+                : target;
+            
+            // // 检查循环依赖 - 使用更高级的依赖图检测
+            // if (dependencyGraphRef.current.hasCircularDependency(targetField)) {
+            //     const currentPath = dependencyGraphRef.current.getCurrentPath();
+            //     console.log(`检测到填充规则中的循环依赖链路: ${[...currentPath, targetField].join(' -> ')}`);
+            //     continue; // 跳过这条规则
+            // }
+            
+            
+            //// 添加到依赖路径
+            // dependencyGraphRef.current.addToPath(targetField);
+            
+            
             // 子表
             if (rule?.type == 1) {
                 if (dependencyMap.current.has(target)) {
@@ -324,15 +409,9 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
                 form.setFieldValue(target, undefined);
             }
             form.setFieldValue(target, setValue)
-            // handleFieldsWith(target, form.getFieldsValue())
-            // setTimeout(() => {
-            // form.setFieldValue(target, setValue)
-            // handleFieldsWith(target, form.getFieldsValue())
-            // if (idGroups.length > 0) handleTableAddRow(idGroups)
-            // }, 0);
-
-
-            // if (idGroups.length > 0) setTimeout(() => handleTableAddRow(idGroups), 0)
+            
+            // 处理完当前字段后从依赖路径中移除
+            // dependencyGraphRef.current.finishField();
         }
 
         setTimeout(() => {
@@ -340,7 +419,6 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
             // console.log("idGroups", idGroups)
             if (idGroups.length > 0) idGroups.forEach(ids => { if (Array.isArray(ids) && ids.length > 0) handleTableAddRow(ids) })
         }, 0)
-
     }
     // 处理级联显示隐藏 @return {boolean} 是否需要重新渲染表单的字段
     const handleFieldsVisibleFunc = (fieldValues, child, parentIdentifier) => {
@@ -458,7 +536,7 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
     }
     // 处理级联数据源
     // 处理级联填充
-    const handleFieldsWithFill = async (fieldValues, child, parentIdentifier, componentName) => {
+    const handleFieldsWithFill = async (fieldValues, child, parentIdentifier, componentName, sourceFieldId) => {
         // console.log("handleFieldsWithFill child.identifier", child.identifier)
         // console.log("handleFieldsWithFill parentIdentifier", parentIdentifier)
         console.log("handleFieldsWithFill componentName", componentName)
@@ -480,89 +558,110 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
             let table_values = getParamValue("fieldsValue", childIdentifier[0], fieldValues, [])
             if (Array.isArray(table_values) && table_values.length > 0)
                 for (let index = 0; index < table_values.length; index++) {
-                    await handleFieldsWithFill(fieldValues, child, [childIdentifier[0], index], componentName)
+                    await handleFieldsWithFill(fieldValues, child, [childIdentifier[0], index], componentName, sourceFieldId)
                 }
           
-
             return
-
         }
-        let withDatas = [];
-        // 先处理依赖数据
-        if (withFill?.withData && withFill?.withData.length > 0 && withDataFetch && typeof withDataFetch === 'function') {
-            for (let index = 0; index < withFill?.withData.length; index++) {
-                const element = withFill?.withData[index];
-                let params = {}
-                params.tableName = element.withTable.table_name
-                params.filter = {}
-                for (let index = 0; index < element.withCondition.length; index++) {
-                    const { value: condition_value, column: condition_column } = element.withCondition[index];
-                    let filter_value = getParamValue(condition_value.group_key, condition_value.field_key, fieldValues, withDatas)
-                    if (Array.isArray(filter_value)) {
-                        if (Array.isArray(childIdentifier) && filter_value.length > withFillIndex) {
-                            filter_value = filter_value[withFillIndex]
+        
+        // 将目标字段ID标准化为字符串
+        const targetFieldId = Array.isArray(childIdentifier) 
+            ? childIdentifier.filter(item => typeof item == "string").join(".")
+            : childIdentifier;
+            
+        // 检查是否在当前依赖链中已存在，避免循环依赖
+        if (dependencyGraphRef.current.hasCircularDependency(targetFieldId)) {
+            const currentPath = dependencyGraphRef.current.getCurrentPath();
+            console.log(`检测到公式计算中的循环依赖链路: ${[...currentPath, targetFieldId].join(' -> ')}`);
+            return;
+        }
+        
+        // // 将当前字段添加到依赖路径
+        // dependencyGraphRef.current.addToPath(targetFieldId);
+        
+        try {
+            let withDatas = [];
+            // 先处理依赖数据
+            if (withFill?.withData && withFill?.withData.length > 0 && withDataFetch && typeof withDataFetch === 'function') {
+                for (let index = 0; index < withFill?.withData.length; index++) {
+                    const element = withFill?.withData[index];
+                    let params = {}
+                    params.tableName = element.withTable.table_name
+                    params.filter = {}
+                    for (let index = 0; index < element.withCondition.length; index++) {
+                        const { value: condition_value, column: condition_column } = element.withCondition[index];
+                        let filter_value = getParamValue(condition_value.group_key, condition_value.field_key, fieldValues, withDatas)
+                        if (Array.isArray(filter_value)) {
+                            if (Array.isArray(childIdentifier) && filter_value.length > withFillIndex) {
+                                filter_value = filter_value[withFillIndex]
+                            }
                         }
-                    }
-                    if (filter_value && typeof filter_value === "string") {
-                        try {
-                            filter_value = JSON.parse(filter_value)
-                        } catch (error) {
+                        if (filter_value && typeof filter_value === "string") {
+                            try {
+                                filter_value = JSON.parse(filter_value)
+                            } catch (error) {
+                            }
                         }
+                        if (filter_value?.value) filter_value = filter_value.value
+                        // if (componentName == "Field.WithSingleSelect" && filter_value) {
+                        //     if (typeof filter_value === "string") {
+                        //         filter_value = JSON.parse(filter_value)
+                        //     }
+                        //     filter_value = filter_value?.value
+                        // }
+                        params.filter[condition_column.column_name] = filter_value
                     }
-                    if (filter_value?.value) filter_value = filter_value.value
-                    // if (componentName == "Field.WithSingleSelect" && filter_value) {
-                    //     if (typeof filter_value === "string") {
-                    //         filter_value = JSON.parse(filter_value)
-                    //     }
-                    //     filter_value = filter_value?.value
-                    // }
-                    params.filter[condition_column.column_name] = filter_value
-                }
 
-                // 访问接口获取数据
-                const response = await withDataFetch(params)
-                if (response.code === 0 && response.data.list) {
-                    withDatas.push({
-                        id: element.id,
-                        data: response.data.list
-                    })
+                    // 访问接口获取数据
+                    const response = await withDataFetch(params)
+                    if (response.code === 0 && response.data.list) {
+                        withDatas.push({
+                            id: element.id,
+                            data: response.data.list
+                        })
+                    }
                 }
             }
-        }
 
-        // 构造计算公式
-        let formula;
-        if (withFill.value && withFill.value.length > 0) {
-            formula = withFill.value.map(item => {
-                let result = "";
-                const { insert, attributes } = item
-                if (typeof insert !== "string") {
-                    if (insert?.span && attributes && attributes.tagKey && attributes.id) {
-                        result = getParamValue(attributes.tagKey, attributes.id, fieldValues, withDatas)
-                        if (Array.isArray(result)) {
-                            if (Array.isArray(childIdentifier) && result.length > withFillIndex) {
-                                result = result[withFillIndex]
+            // 构造计算公式
+            let formula;
+            if (withFill.value && withFill.value.length > 0) {
+                formula = withFill.value.map(item => {
+                    let result = "";
+                    const { insert, attributes } = item
+                    if (typeof insert !== "string") {
+                        if (insert?.span && attributes && attributes.tagKey && attributes.id) {
+                            result = getParamValue(attributes.tagKey, attributes.id, fieldValues, withDatas)
+                            if (Array.isArray(result)) {
+                                if (Array.isArray(childIdentifier) && result.length > withFillIndex) {
+                                    result = result[withFillIndex]
+                                }
+                                if (typeof result === "object" && result !== null)
+                                    result = JSON.stringify(result)
                             }
-                            if (typeof result === "object" && result !== null)
+                            else if (typeof result === "object" && result !== null) {
                                 result = JSON.stringify(result)
+                            }
+                            else if (result.length > 0) result = `"${result}"`
                         }
-                        else if (typeof result === "object" && result !== null) {
-                            result = JSON.stringify(result)
-                        }
-                        else if (result.length > 0) result = `"${result}"`
                     }
-                }
-                else result = insert
-                return result
-            })
-        }
+                    else result = insert
+                    return result
+                })
+            }
 
-        if (formula && formula.length > 0) {
-            const formulaResult = evalFormula(formula);
-            console.log(`${childIdentifier} 计算公式:`, formula)
-            console.log(`${childIdentifier} 计算结果:`, formulaResult)
-            form.setFieldValue(childIdentifier, formulaResult)
-            await handleFieldsWith(childIdentifier, form.getFieldsValue())
+            if (formula && formula.length > 0) {
+                const formulaResult = evalFormula(formula);
+                console.log(`${childIdentifier} 计算公式:`, formula)
+                console.log(`${childIdentifier} 计算结果:`, formulaResult)
+                
+              
+                form.setFieldValue(childIdentifier, formulaResult)
+                await handleFieldsWith(childIdentifier, form.getFieldsValue(), false, targetFieldId)
+            }
+        } finally {
+            // 处理完毕后，从依赖路径中删除当前字段
+            // dependencyGraphRef.current.finishField();
         }
     }
 
@@ -606,6 +705,8 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
         const delay = lockStatus.current === 1 ? 500 : 100;
 
         timeoutRef.current = setTimeout(async () => {
+            // 开始新的更新周期
+            dependencyGraphRef.current.startNewCycle();
 
             const fieldValues = form.getFieldsValue();
             const lockStatus_ = lockStatus.current;
@@ -613,14 +714,25 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
             let needRefresh = false;
             if (!lastFormValues.current) lastFormValues.current = {}
 
+            // 创建已处理字段集合，用于避免多次处理同一字段
+            const processedFields = new Set();
+
             for (let key in changedFieldsState.current) {
                 let field = changedFieldsState.current[key];
                 if (!isEqual(field.value || "", getLastFieldValue(field.name) || "")) {
                     if (lockStatus_ != 1) {
-                        // console.log("handleFieldsWith field.name", field.name)
-                        let needRefresh_ = await handleFieldsWith(field.name, fieldValues);
-                        needRefresh = needRefresh || needRefresh_
-
+                        // 获取字段标识符（字符串形式）
+                        const fieldId = Array.isArray(field.name) 
+                            ? field.name.filter(item => typeof item == "string").join(".")
+                            : field.name;
+                        
+                        // 跳过已处理的字段
+                        if (processedFields.has(fieldId)) continue;
+                        processedFields.add(fieldId);
+                        
+                        // 处理字段依赖关系，传递字段ID和依赖图谱
+                        let needRefresh_ = await handleFieldsWith(field.name, fieldValues, false, fieldId);
+                        needRefresh = needRefresh || needRefresh_;
                     }
                     lastFormValues.current[field.name] = field.value;
                 }
@@ -638,6 +750,8 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
             if (field.name && field.name.length > 0) {
                 // const fieldKey = field.name.filter(item => typeof item == "string").join(".")
                 changedFieldsState.current[field.name] = field;
+                
+               
             }
         })