@fecp/designer 5.6.27 → 5.6.29

package/lib/packages/vue/src/components/forms/form/Form.vue.js

@@ -231,6 +231,12 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
       }
     };
     function layoutUpdated(layoutData) {
+      if (window.__FEC_FORM_PERF && window.__PERF_T0) {
+        console.log(
+          `[联动性能] GridLayout.layoutUpdated +${(performance.now() - window.__PERF_T0).toFixed(1)}ms`
+        );
+        window.__PERF_T0 = 0;
+      }
       emit("layoutUpdated", layoutData);
     }
     const loadFormData = (state) => {
@@ -600,7 +606,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
         (_a = config.labelLinkEventConfig) == null ? void 0 : _a.find((item) => item.name == "Click")
       );
     }
-    const gridLayoutFieldsData = Vue.ref([]);
+    const gridLayoutFieldsData = Vue.shallowRef([]);
     const oriGridLayoutData = Vue.ref([]);
     const formItemRefs = Vue.ref(/* @__PURE__ */ new Map());
     const setFormItemRef = (el, component) => {
@@ -645,6 +651,8 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
         } else if (item.fixedH) {
           item.h = item.h / (localConfig.value.labelPosition == "top" ? 1.5 : 1);
         }
+        item._origX = item.x;
+        item._origY = item.y;
         if (formMode.value == "query") {
           if (item.component.displayMode == "edit") {
             item.hidden = true;
@@ -858,12 +866,66 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     Vue.onBeforeUnmount(() => {
       formItemRefs.value.clear();
     });
-    const findChangedFields = (newData, oldData) => {
+    const linkageTriggerFields = Vue.computed(() => {
+      var _a;
+      const nameSet = /* @__PURE__ */ new Set();
+      const fields = [...fieldsData.value || [], ...hiddenFields.value || []];
+      let undetermined = false;
+      const collectGroup = (group) => {
+        if (!group) {
+          undetermined = true;
+          return;
+        }
+        const conds = group.conditions || [];
+        const groups = group.groups || [];
+        if (conds.length === 0 && groups.length === 0) {
+          undetermined = true;
+        }
+        conds.forEach((cond) => {
+          if (!cond.field) {
+            undetermined = true;
+            return;
+          }
+          const f = fields.find((x) => x.id == cond.field);
+          nameSet.add((f == null ? void 0 : f.fieldName) || cond.field);
+        });
+        groups.forEach(collectGroup);
+      };
+      const walk = (cfg, isConfigItem) => {
+        if (!cfg || typeof cfg !== "object") return;
+        if (Array.isArray(cfg)) {
+          cfg.forEach((item) => walk(item, true));
+          return;
+        }
+        if (cfg.filterConfig !== void 0) {
+          collectGroup(cfg.filterConfig);
+          return;
+        }
+        if (cfg.conditions || cfg.groups) {
+          collectGroup(cfg);
+          return;
+        }
+        if (isConfigItem) {
+          undetermined = true;
+          return;
+        }
+        Object.values(cfg).forEach((v) => walk(v, false));
+      };
+      walk((_a = localConfig.value) == null ? void 0 : _a.linkedConfig, false);
+      return undetermined ? /* @__PURE__ */ new Set() : nameSet;
+    });
+    const findChangedFields = (newData, oldData, onlyFieldNames) => {
       const changedFields = [];
-      const allKeys = /* @__PURE__ */ new Set([
-        ...Object.keys(newData || {}),
-        ...Object.keys(oldData || {})
-      ]);
+      let allKeyList = [
+        .../* @__PURE__ */ new Set([
+          ...Object.keys(newData || {}),
+          ...Object.keys(oldData || {})
+        ])
+      ];
+      if (onlyFieldNames && onlyFieldNames.size > 0) {
+        allKeyList = allKeyList.filter((k) => onlyFieldNames.has(k));
+      }
+      const allKeys = allKeyList;
       let initFlag = false;
       if (Object.keys(oldData || {}).length === 0) {
         initFlag = true;
@@ -883,7 +945,14 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
         if (!newVal && !oldVal && Object.keys(oldData || {}).length === 0) {
           continue;
         }
-        if (JSON.stringify(newVal) != JSON.stringify(oldVal)) {
+        if (newVal === oldVal) {
+          continue;
+        }
+        if (newVal == null || oldVal == null || typeof newVal !== "object" || typeof oldVal !== "object") {
+          changedFields.push(key);
+          continue;
+        }
+        if (!common.isEqual(newVal, oldVal)) {
           changedFields.push(key);
         }
       }
@@ -934,10 +1003,13 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
       return result;
     };
     let isApplyingLinkage = false;
+    let __pendingLinkageFields = null;
+    let __pendingLinkageTimer = null;
     const applyLinkageEffectsForChangedFields = (changedFieldNames) => {
       var _a;
       if (isApplyingLinkage) return;
       isApplyingLinkage = true;
+      const __ptf0 = performance.now();
       const linkedConfig = localConfig.value.linkedConfig || {};
       const fields = [...fieldsData.value, ...hiddenFields.value];
       const relevantConfigs = filterRelevantLinkageConfigs(
@@ -967,7 +1039,9 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
           });
         }
       });
-      const updatedLayoutData = common.cloneDeep(oriGridLayoutData.value || []);
+      const __pt0 = performance.now();
+      const updatedLayoutData = oriGridLayoutData.value;
+      const __pt1 = performance.now();
       relevantConfigs.options.forEach((item) => {
         if (parseFilterConfig.checkFilterMatch(item.filterConfig, formData.value, fields)) {
           const fieldAssignments = item.fieldAssignments || [];
@@ -976,7 +1050,12 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
             const optionsOpt = assignment.optionsOpt || [];
             const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
             if (layoutFieldItem && optionsOpt.length > 0) {
-              const oriOptions = layoutFieldItem.component.optionConfig.options;
+              if (!layoutFieldItem.component._oriOptions) {
+                layoutFieldItem.component._oriOptions = [
+                  ...layoutFieldItem.component.optionConfig.options
+                ];
+              }
+              const oriOptions = layoutFieldItem.component._oriOptions;
               layoutFieldItem.component.optionConfig.options = oriOptions.filter(
                 (item2) => optionsOpt.includes(item2.value)
               );
@@ -1018,23 +1097,29 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
           });
         }
       });
-      const rules = {};
-      updatedLayoutData.forEach(({ component }) => {
-        if (component.fieldName) {
-          const fieldRules = validation.generateFieldRules(component, formData, fields);
-          if (fieldRules.length > 0) {
-            rules[component.fieldName] = fieldRules;
+      const __ptr0 = performance.now();
+      if ((((_a = relevantConfigs.required) == null ? void 0 : _a.length) || 0) > 0) {
+        const rules = {};
+        updatedLayoutData.forEach(({ component }) => {
+          if (component.fieldName) {
+            const fieldRules = validation.generateFieldRules(component, formData, fields);
+            if (fieldRules.length > 0) {
+              rules[component.fieldName] = fieldRules;
+            }
+          }
+        });
+        for (let fieldName in prodRules.value) {
+          if (rules[fieldName]) {
+            rules[fieldName].push(...prodRules.value[fieldName]);
+          } else {
+            rules[fieldName] = prodRules.value[fieldName];
           }
         }
-      });
-      for (let fieldName in prodRules.value) {
-        if (rules[fieldName]) {
-          rules[fieldName].push(...prodRules.value[fieldName]);
-        } else {
-          rules[fieldName] = prodRules.value[fieldName];
+        if (JSON.stringify(rules) !== JSON.stringify(formRules.value)) {
+          formRules.value = rules;
         }
       }
-      formRules.value = rules;
+      const __ptr1 = performance.now();
       if (formMode.value != "query") {
         relevantConfigs.readonly.forEach((item) => {
           const dataLinkFieldList = item.dataLinkFieldList || [];
@@ -1075,18 +1160,70 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
           }
         });
       }
-      const fieldsConfigArr = updatedLayoutData.filter((item) => !item.hidden);
-      gridLayoutFieldsData.value = sortLayoutItems(fieldsConfigArr);
-      (_a = gridLayout == null ? void 0 : gridLayout.value) == null ? void 0 : _a.resizeEvent();
+      const __pt2 = performance.now();
+      const oldVisibleKey = gridLayoutFieldsData.value.map((i) => i.id).sort().join(",");
+      const newVisibleKey = updatedLayoutData.filter((item) => !item.hidden).map((i) => i.id).sort().join(",");
+      const __pt3 = performance.now();
+      const rebuild = oldVisibleKey !== newVisibleKey;
+      if (rebuild) {
+        updatedLayoutData.forEach((item) => {
+          if (item._origX !== void 0) item.x = item._origX;
+          if (item._origY !== void 0) item.y = item._origY;
+        });
+        const fieldsConfigArr = updatedLayoutData.filter((item) => !item.hidden);
+        gridLayoutFieldsData.value = compactLayoutVertical(
+          fieldsConfigArr,
+          localConfig.value.columns
+        );
+      }
+      const __pt4 = performance.now();
+      if (window.__FEC_FORM_PERF) {
+        window.__PERF_T0 = __pt4;
+        console.log(
+          `[联动性能] 字段总数 ${oriGridLayoutData.value.length} | 联动触发字段 ${linkageTriggerFields.value.size || "全量"} | 筛选配置 ${(__pt0 - __ptf0).toFixed(1)}ms | 浅拷贝 ${(__pt1 - __pt0).toFixed(1)}ms | 规则生成 ${(__ptr1 - __ptr0).toFixed(
+            1
+          )}ms | 联动处理 ${(__pt2 - __pt1).toFixed(1)}ms | 显隐比对 ${(__pt3 - __pt2).toFixed(1)}ms | 重建=${rebuild} ${(__pt4 - __pt3).toFixed(1)}ms`
+        );
+        Vue.nextTick(() => {
+          const __pt5 = performance.now();
+          const __fiN = window.__FI_UPDATED || 0;
+          const __fiT = window.__FI_TIME || 0;
+          window.__FI_UPDATED = 0;
+          window.__FI_TIME = 0;
+          requestAnimationFrame(() => {
+            const __pt6 = performance.now();
+            console.log(
+              `[联动性能] JS补丁 ${(__pt5 - __pt4).toFixed(1)}ms | 浏览器 ${(__pt6 - __pt5).toFixed(1)}ms | FormItem重渲染 ${__fiN}次 ${__fiN ? `${__fiT.toFixed(1)}ms` : ""}`
+            );
+          });
+        });
+      }
       isApplyingLinkage = false;
     };
-    function sortLayoutItems(arr) {
-      return [...arr].sort((a, b) => {
-        if (a.y !== b.y) {
-          return a.y - b.y;
-        }
+    function compactLayoutVertical(arr, cols) {
+      const colNum = Math.max(1, Math.floor(cols) || 12);
+      const sorted = [...arr].sort((a, b) => {
+        if (a.y !== b.y) return a.y - b.y;
         return a.x - b.x;
       });
+      const colBottom = new Array(colNum).fill(0);
+      for (let k = 0; k < sorted.length; k++) {
+        const item = sorted[k];
+        let sx = Math.floor(item.x);
+        if (sx < 0) sx = 0;
+        if (sx > colNum - 1) sx = colNum - 1;
+        let sw = Math.floor(item.w);
+        if (sw < 1) sw = 1;
+        if (sx + sw > colNum) sw = colNum - sx;
+        let ny = 0;
+        for (let c = sx, ce = sx + sw; c < ce; c++) {
+          if (colBottom[c] > ny) ny = colBottom[c];
+        }
+        item.y = ny;
+        const bottom = ny + item.h;
+        for (let c = sx, ce = sx + sw; c < ce; c++) colBottom[c] = bottom;
+      }
+      return sorted;
     }
     const subTableCounts = Vue.ref({});
     const navLinkCompId = Vue.ref("");
@@ -1150,12 +1287,20 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
           return;
         }
         const lastValue = { ...prevFormData.value };
-        if (common.isEqual(newVal, lastValue)) {
-          return;
-        }
-        const changedFields = findChangedFields(newVal, lastValue);
+        const changedFields = isApplyingLinkage ? [] : (
+          // [性能优化] 去掉全量 isEqual 深比较，改由 findChangedFields 的结果判定；
+          // 只比较参与联动的字段（initLinkage 初始化时仍走全量，保证所有联动被应用）
+          findChangedFields(newVal, lastValue, linkageTriggerFields.value)
+        );
         if (changedFields.length > 0) {
-          applyLinkageEffectsForChangedFields(changedFields);
+          __pendingLinkageFields = [.../* @__PURE__ */ new Set([...__pendingLinkageFields || [], ...changedFields])];
+          if (__pendingLinkageTimer) clearTimeout(__pendingLinkageTimer);
+          __pendingLinkageTimer = setTimeout(() => {
+            __pendingLinkageTimer = null;
+            const fields = __pendingLinkageFields;
+            __pendingLinkageFields = null;
+            applyLinkageEffectsForChangedFields(fields);
+          }, 0);
         }
         prevFormData.value = { ...formData.value };
         isSyncingToParent = true;
@@ -1167,7 +1312,6 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
       { deep: true }
     );
     function setFormItemHeight(id, fixedH, h) {
-      var _a;
       const item = gridLayoutFieldsData.value.find((item2) => item2.id == id);
       if (!fixedH) {
         item.h = h * 60;
@@ -1180,7 +1324,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
       } else if (fixedH) {
         oriItem.h = h / (localConfig.value.labelPosition == "top" ? 1.5 : 1);
       }
-      (_a = gridLayout == null ? void 0 : gridLayout.value) == null ? void 0 : _a.resizeEvent();
+      Vue.triggerRef(gridLayoutFieldsData);
     }
     Vue.provide("formData", formData);
     Vue.provide("localConfig", localConfig);
@@ -1262,7 +1406,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
                         "onUpdate:layout": _cache[1] || (_cache[1] = ($event) => gridLayoutFieldsData.value = $event),
                         "row-height": rowHeight.value,
                         margin: [0, 0],
-                        "use-css-transforms": false,
+                        "use-css-transforms": true,
                         "col-num": localConfig.value.columns,
                         "is-draggable": false,
                         "is-resizable": false,
@@ -1332,5 +1476,5 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     };
   }
 });
-const _Form = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-2a14b0ea"]]);
+const _Form = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-dbb5150d"]]);
 exports.default = _Form;

package/lib/packages/vue/src/components/forms/formItem/FormItem.vue.js

@@ -89,6 +89,16 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emit = __emit;
+    if (typeof window !== "undefined" && window.__FEC_FORM_PERF) {
+      let __uStart = 0;
+      Vue.onBeforeUpdate(() => {
+        __uStart = performance.now();
+      });
+      Vue.onUpdated(() => {
+        window.__FI_UPDATED = (window.__FI_UPDATED || 0) + 1;
+        window.__FI_TIME = (window.__FI_TIME || 0) + (performance.now() - __uStart);
+      });
+    }
     function handleChange(config, val) {
       emit("change", config, val);
     }
@@ -316,5 +326,5 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     };
   }
 });
-const _FormItem = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-4bbb491d"]]);
+const _FormItem = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-11dbadbd"]]);
 exports.default = _FormItem;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fecp/designer",
-  "version": "5.6.27",
+  "version": "5.6.29",
   "main": "lib/designer/index.js",
   "module": "es/designer/index.mjs",
   "files": [