@fecp/designer 5.6.23 → 5.6.24

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

@@ -0,0 +1,1370 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+require("../../../../../../node_modules/element-plus/es/index.js");
+;/* empty css                                                                */
+;/* empty css                                                                    */
+;/* empty css                                                                        */
+;/* empty css                                                                     */
+;/* empty css                                                                     */
+;/* empty css                                                                   */
+;/* empty css                                                                  */
+;/* empty css                                                                   */
+const Vue = require("vue");
+require("../../../../../../node_modules/grid-layout-plus/es/index.js");
+const getInstance = require("../../../utils/getInstance.js");
+const getJsonAsyncUtil = require("../../../utils/getJsonAsyncUtil.js");
+const index$8 = require("../formItem/index.js");
+const datasource = require("../../../utils/datasource.js");
+const validation = require("./validation.js");
+const parseRouteParams = require("../../../utils/parseRouteParams.js");
+const common = require("../../../utils/common.js");
+;/* empty css                                                                      */
+;/* empty css                                                                     */
+;/* empty css                                                                     */
+const calculate = require("../../../utils/formulajs/calculate.js");
+const eventFlowHandler = require("../../../utils/eventFlow/eventFlowHandler.js");
+require("vxe-table");
+require("xe-utils");
+;/* empty css                                                      */
+;/* empty css                                                                    */
+;/* empty css                                                                        */
+;/* empty css                                                                     */
+;/* empty css                                                                  */
+;/* empty css                                                                     */
+;/* empty css                                                                           */
+;/* empty css                                                                     */
+;/* empty css                                                                         */
+;/* empty css                           */
+const _pluginVue_exportHelper = require("../../../../../../_virtual/_plugin-vue_export-helper.js");
+const parseFilterConfig = require("../../../utils/parseFilterConfig.js");
+;/* empty css                              */
+;/* empty css                                                                   */
+;/* empty css                                                                    */
+;/* empty css                                                                      */
+;/* empty css                            */
+;/* empty css                                                                      */
+;/* empty css                                                                        */
+;/* empty css                                                                           */
+;/* empty css                                                                                */
+require("../../../../../../node_modules/element-plus/theme-chalk/el-date-picker.css.js");
+require("../text/index.js");
+require("../select/index.js");
+require("../multipleSelection/index.js");
+require("../date/index.js");
+require("../number/index.js");
+;/* empty css                            */
+;/* empty css                                                                                  */
+;/* empty css                                                                       */
+;/* empty css                                                                             */
+;/* empty css                                                                              */
+;/* empty css                                                                   */
+require("../../../../../../node_modules/element-plus/theme-chalk/el-tab-pane.css.js");
+;/* empty css                             */
+const eventBus = require("../../../utils/eventBus.js");
+require("../../../../../../node_modules/decimal.js/decimal.js");
+const vuex_esmBundler = require("../../../../../../node_modules/vuex/dist/vuex.esm-bundler.js");
+;/* empty css                      */
+const usePageEvents = require("../../../composables/usePageEvents.js");
+const index$5 = require("../../details/header/index.js");
+const index$6 = require("../../details/main/index.js");
+const index$9 = require("../../details/footer/index.js");
+const FormAnchorNav = require("./FormAnchorNav.vue2.js");
+const RightAnchorNav = require("./RightAnchorNav.vue2.js");
+const moment = require("../../../../../../node_modules/moment/dist/moment.js");
+const index$2 = require("../../../api/index.js");
+const importantDataChange = require("../../../utils/importantDataChange.js");
+;/* empty css          */
+;/* empty css                               */
+;/* empty css                                                     */
+;/* empty css                                                           */
+;/* empty css                                                      */
+;/* empty css                                                     */
+;/* empty css                                                        */
+;/* empty css                                                       */
+;/* empty css                                                                  */
+;/* empty css                                                        */
+;/* empty css                                                      */
+;/* empty css                                                       */
+;/* empty css                                                                          */
+const index = require("../../../../../../node_modules/element-plus/es/hooks/use-locale/index.js");
+const index$1 = require("../../../../../../node_modules/element-plus/es/components/message/index.js");
+const index$3 = require("../../../../../../node_modules/element-plus/es/components/container/index.js");
+const index$4 = require("../../../../../../node_modules/element-plus/es/components/col/index.js");
+const index$7 = require("../../../../../../node_modules/element-plus/es/components/form/index.js");
+const gridLayout_vue = require("../../../../../../node_modules/grid-layout-plus/es/components/grid-layout.vue.js");
+const _hoisted_1 = ["name", "value"];
+const _sfc_main = /* @__PURE__ */ Object.assign({
+  inheritAttrs: false
+}, {
+  __name: "Form",
+  props: {
+    templateKey: {
+      type: String,
+      default: ""
+    },
+    initOption: {
+      type: Object,
+      default: () => {
+      }
+    },
+    modelValue: {
+      type: Object,
+      default: () => {
+      }
+    },
+    isSubForm: {
+      type: Boolean,
+      default: false
+    },
+    isDialog: {
+      type: Boolean,
+      default: false
+    },
+    canPageEvent: {
+      type: Boolean,
+      default: true
+    },
+    initSearchData: {
+      type: Object,
+      default: {}
+    },
+    initFormMode: {
+      type: String,
+      default: ""
+    },
+    isApproval: {
+      type: Boolean,
+      default: false
+    },
+    class: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: [
+    "submit",
+    "change",
+    "validate",
+    "loaded",
+    "update:modelValue",
+    "layoutUpdated"
+  ],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const store = vuex_esmBundler.useStore();
+    window.$user = store.getters.user;
+    const props = __props;
+    index.useLocale();
+    const emit = __emit;
+    const instance = Vue.getCurrentInstance();
+    const ctx = getInstance.getCurrentVueInstance();
+    const fecFormRef = Vue.ref(null);
+    const formRef = Vue.ref(null);
+    const gridLayout = Vue.ref(null);
+    const configLoading = Vue.ref(true);
+    const localConfig = Vue.ref({});
+    const formData = Vue.ref({});
+    const formRules = Vue.ref({});
+    const dataSourceOptions = Vue.ref({});
+    const dictionaryOptions = Vue.ref({});
+    const productData = Vue.ref({});
+    const fieldsData = Vue.ref([]);
+    const hiddenFields = Vue.ref([]);
+    const dataChangeManager = Vue.ref(null);
+    const prevFormData = Vue.ref({});
+    let linkaged = false;
+    const rowHeight = Vue.ref(1);
+    const pageEvents = props.canPageEvent ? usePageEvents.usePageEvents(() => ({
+      pageEventConfig: localConfig.value.pageEventConfig,
+      fields: [...fieldsData.value, ...hiddenFields.value],
+      instance,
+      formData: formData.value,
+      localConfig: localConfig.value,
+      initSearchData: props.initSearchData,
+      components: {
+        form: ctx
+      }
+    })) : null;
+    if (pageEvents) {
+      pageEvents.handleBeforeUnmount();
+      pageEvents.handleUnmounted();
+    }
+    const formMode = Vue.ref("");
+    Vue.watch(
+      () => props.templateKey,
+      (key) => {
+        if (key) {
+          loadConfig("dynamic");
+        }
+      }
+    );
+    let isSyncingToParent = false;
+    Vue.watch(
+      () => props.modelValue,
+      (newVal, oldVal) => {
+        if (isSyncingToParent) return;
+        if (JSON.stringify(newVal) !== JSON.stringify(oldVal)) {
+          loadFormData("change");
+        }
+      }
+    );
+    const loadConfig = async (state) => {
+      if (!props.templateKey && (!props.initOption || Object.keys(props.initOption).length == 0)) {
+        return;
+      }
+      prevFormData.value = {};
+      linkaged = false;
+      configLoading.value = true;
+      try {
+        let option = await getJsonAsyncUtil.default(
+          ctx.$http,
+          props.templateKey,
+          "form",
+          props.initOption
+        );
+        rowHeight.value = option.labelPosition == "top" ? 1.5 : 1;
+        localConfig.value = option;
+        if (props.initFormMode) {
+          formMode.value = props.initFormMode;
+        } else {
+          formMode.value = option.formMode;
+        }
+        fieldsData.value = option.fieldsData.map((item) => {
+          if (formMode.value == "query") {
+            item.component.disabled = true;
+          }
+          return item.component;
+        });
+        hiddenFields.value = option.hiddenFields || [];
+        loadFormData(state);
+        loadEventFlow();
+        if (pageEvents && localConfig.value.pageEventConfig) {
+          const onCreatedEvent = localConfig.value.pageEventConfig.find(
+            (e) => e.name === "onCreated"
+          );
+          if (onCreatedEvent) {
+            console.log("🚀 页面 onCreated 事件触发");
+            try {
+              await pageEvents.executeEvent("onCreated");
+            } catch (error) {
+            }
+          }
+        }
+        await loadFieldDataSources();
+        await loadProductData();
+        applyProductConfigToForm();
+        mergeOptionsToFields();
+        initGridLayoutDataConfig();
+        initLinkage();
+        await initImportantDataChange();
+        emit("loaded", option, getFormData());
+      } catch (error) {
+        console.error("加载配置失败:", error);
+        index$1.ElMessage.error("加载配置失败");
+      } finally {
+        configLoading.value = false;
+      }
+    };
+    function layoutUpdated(layoutData) {
+      emit("layoutUpdated", layoutData);
+    }
+    const loadFormData = (state) => {
+      var _a;
+      const defaultData = {};
+      const rules = {};
+      if (fieldsData.value) {
+        (_a = fieldsData.value) == null ? void 0 : _a.forEach((component) => {
+          if (component.fieldName) {
+            let defaultValue = component.defaultValue || null;
+            if (component.fieldType == "number") {
+              defaultValue = Number(defaultValue || 0);
+            }
+            defaultData[component.fieldName] = defaultValue;
+          }
+          if (state != "change") {
+            if (component.fieldName) {
+              const fieldRules = validation.generateFieldRules(component, formData, [
+                ...fieldsData.value,
+                ...hiddenFields.value
+              ]);
+              if (fieldRules.length > 0) {
+                rules[component.fieldName] = fieldRules;
+              }
+            }
+          }
+        });
+      }
+      if (hiddenFields.value && hiddenFields.value.length > 0) {
+        hiddenFields.value.forEach((field) => {
+          if (field.fieldName) {
+            if (typeof field.value == "object") {
+              const value = parseRouteParams.parseSingleParamValue(
+                field.value || field.defaultValue,
+                defaultData,
+                [...fieldsData.value, ...hiddenFields.value]
+              );
+              if (value) {
+                defaultData[field.fieldName] = value;
+              }
+            } else if (field.value) {
+              defaultData[field.fieldName] = field.value;
+            }
+          }
+        });
+      }
+      if (state == "dynamic") {
+        formData.value = { ...setFormData(props.modelValue, true), ...defaultData };
+      } else {
+        formData.value = { ...defaultData, ...setFormData(props.modelValue, true) };
+      }
+      if (state != "change") {
+        formRules.value = rules;
+      }
+    };
+    const loadFieldDataSources = async () => {
+      var _a, _b;
+      const fields = fieldsData.value || [];
+      const fieldDataSources = /* @__PURE__ */ new Set();
+      const dictionaryKeys = /* @__PURE__ */ new Set();
+      for (const component of fields) {
+        const fieldType = component.fieldType;
+        if ((fieldType === "select" || fieldType === "multipleSelection" || fieldType === "radio" || fieldType === "checkbox" || fieldType === "cascader") && component.optionConfig) {
+          const { optionSource, dataSourceValue, dictionaryValue } = component.optionConfig;
+          if (optionSource === "dataSource" && dataSourceValue) {
+            fieldDataSources.add(dataSourceValue);
+          } else if (optionSource === "dictionary" && dictionaryValue) {
+            dictionaryKeys.add(dictionaryValue);
+          }
+        }
+      }
+      for (const dataSourceId of fieldDataSources) {
+        if (dataSourceOptions.value[dataSourceId]) continue;
+        try {
+          const dsManager = datasource.createDataSource({
+            http: ctx.$http,
+            dataSources: localConfig.value.dataSources,
+            currentDataSourceId: dataSourceId,
+            pagination: false,
+            data: formData.value,
+            fields: [...fieldsData.value, ...hiddenFields.value]
+          });
+          const data = await dsManager.fetch();
+          let options = [];
+          if (Array.isArray(data)) {
+            options = data;
+          } else if (typeof data === "object") {
+            options = Array.isArray(data.data) ? data.data : ((_a = data.data) == null ? void 0 : _a.records) || ((_b = data.data) == null ? void 0 : _b.list) || [];
+          }
+          dataSourceOptions.value[dataSourceId] = options;
+          dsManager.destroy();
+        } catch (error) {
+          console.error(`Failed to load data source ${dataSourceId}:`, error);
+        }
+      }
+      if (dictionaryKeys.size > 0) {
+        try {
+          const keyName = Array.from(dictionaryKeys).join(",");
+          const response = await ctx.$http.postForm(
+            "/" + window.$servers.base + "/parm/sysParmDic/getDicListByKey",
+            {
+              keyName
+            }
+          );
+          const dictionaryData = response;
+          if (typeof dictionaryData === "object") {
+            Object.keys(dictionaryData).forEach((dictKey) => {
+              if (dictionaryKeys.has(dictKey)) {
+                const dictItems = dictionaryData[dictKey];
+                if (Array.isArray(dictItems)) {
+                  dictionaryOptions.value[dictKey] = dictItems;
+                }
+              }
+            });
+          }
+        } catch (error) {
+          console.error("Failed to load dictionary data:", error);
+        }
+      }
+    };
+    const mergeOptionsToFields = () => {
+      if (fieldsData.value) {
+        fieldsData.value.forEach((component) => {
+          if (!component.optionConfig) return;
+          const {
+            optionSource,
+            dataSourceValue,
+            dictionaryValue,
+            displayField,
+            valueField,
+            idField,
+            pidField
+          } = component.optionConfig;
+          if (optionSource === "dataSource" && dataSourceOptions.value[dataSourceValue]) {
+            const rawOptions = dataSourceOptions.value[dataSourceValue];
+            const labelField = displayField || "label";
+            const keyField = valueField || "value";
+            component.optionConfig.options = rawOptions.map((item) => ({
+              label: item[labelField],
+              value: item[keyField],
+              disabled: item.disabled || false,
+              ...item
+            }));
+          } else if (optionSource === "dictionary" && dictionaryOptions.value[dictionaryValue]) {
+            const rawOptions = dictionaryOptions.value[dictionaryValue];
+            const labelField = "optName";
+            const keyField = "optCode";
+            component.optionConfig.options = rawOptions.map((item) => ({
+              label: item[labelField],
+              value: item[keyField],
+              disabled: item.disabled || false
+            }));
+          } else if (optionSource === "custom") {
+            component.optionConfig.options = component.optionConfig.options || [];
+          }
+          applyProductConfigFilter(component);
+        });
+      }
+    };
+    const loadProductData = async () => {
+      if (!localConfig.value || !localConfig.value.prodConfig) {
+        return;
+      }
+      const { prodId } = localConfig.value.prodConfig;
+      if (!prodId) {
+        return;
+      }
+      const field = [...fieldsData.value, ...hiddenFields.value].find(
+        (item) => item.id == prodId.value
+      );
+      if (!field) {
+        return;
+      }
+      const prodIdValue = formData.value[field.fieldName];
+      if (!prodIdValue) {
+        return;
+      }
+      try {
+        const response = await index$2.default.getProductData(ctx.$http, prodIdValue);
+        productData.value = response;
+        console.log("产品数据加载成功:", productData.value);
+      } catch (error) {
+        console.error("获取产品数据失败:", error);
+        productData.value = {};
+      }
+    };
+    const prodRules = Vue.ref({});
+    const applyProductConfigToForm = () => {
+      if (!localConfig.value || !localConfig.value.prodConfig || !productData.value) {
+        return;
+      }
+      const { defaultValueConfigs, validationConfigs } = localConfig.value.prodConfig;
+      if (defaultValueConfigs && defaultValueConfigs.length > 0) {
+        defaultValueConfigs.forEach((config) => {
+          if (config.pageField && config.productConfigField) {
+            const defaultValue = productData.value[config.productConfigField];
+            if (defaultValue !== void 0) {
+              const formField = [...fieldsData.value, ...hiddenFields.value].find(
+                (item) => item.id == config.pageField
+              );
+              if (formField && !formData.value[formField.fieldName]) {
+                formData.value[formField.fieldName] = defaultValue;
+              }
+            }
+          }
+        });
+      }
+      if (validationConfigs && validationConfigs.length > 0) {
+        validationConfigs.forEach((config) => {
+          if (config.pageField && (config.minProductField || config.maxProductField)) {
+            const minValue = productData.value[config.minProductField];
+            const maxValue = productData.value[config.maxProductField];
+            if (minValue !== void 0 || maxValue !== void 0) {
+              const formField = [...fieldsData.value, ...hiddenFields.value].find(
+                (item) => item.id == config.pageField
+              );
+              if (formField && !prodRules.value[formField.fieldName]) {
+                prodRules.value[formField.fieldName] = [];
+              }
+              const customValidator = (rule, value, callback) => {
+                if (value === null || value === void 0 || value === "") {
+                  callback();
+                  return;
+                }
+                const numValue = Number(value);
+                if (isNaN(numValue)) {
+                  callback(new Error("请输入有效的数字"));
+                  return;
+                }
+                const formatValue = (val) => {
+                  if (val === void 0 || val === null) return "";
+                  const num = Number(val);
+                  if (config.format === "amount") {
+                    return `${num.toLocaleString()}元`;
+                  } else if (config.format === "percent") {
+                    return `${(num * 100).toFixed(2)}%`;
+                  }
+                  return num;
+                };
+                let errorMessage = "";
+                if (minValue !== void 0 && numValue < Number(minValue)) {
+                  errorMessage = `不能小于 ${formatValue(minValue)}`;
+                }
+                if (maxValue !== void 0 && numValue > Number(maxValue)) {
+                  if (errorMessage) {
+                    errorMessage = `${errorMessage} 且 不能大于 ${formatValue(
+                      maxValue
+                    )}`;
+                  } else {
+                    errorMessage = `不能大于 ${formatValue(maxValue)}`;
+                  }
+                }
+                if (errorMessage) {
+                  callback(new Error(errorMessage));
+                } else {
+                  callback();
+                }
+              };
+              const customRule = {
+                validator: customValidator,
+                trigger: "blur"
+              };
+              prodRules.value[formField.fieldName].push(customRule);
+            }
+          }
+        });
+        for (let fieldName in prodRules.value) {
+          if (formRules.value[fieldName]) {
+            formRules.value[fieldName].push(...prodRules.value[fieldName]);
+          } else {
+            formRules.value[fieldName] = prodRules.value[fieldName];
+          }
+        }
+      }
+    };
+    const applyProductConfigFilter = (component) => {
+      if (!localConfig.value || !localConfig.value.prodConfig || !productData.value) {
+        return;
+      }
+      const { optionConfigs } = localConfig.value.prodConfig;
+      if (!optionConfigs || !component.optionConfig || !component.optionConfig.options) {
+        return;
+      }
+      const componentConfig = optionConfigs.find(
+        (item) => item.pageField == component.id
+      );
+      if (!componentConfig || !componentConfig.productConfigField) {
+        return;
+      }
+      const fieldValue = productData.value[componentConfig.productConfigField];
+      if (!fieldValue) {
+        return;
+      }
+      const allowedValues = Array.isArray(fieldValue) ? fieldValue : fieldValue.split("|");
+      component.optionConfig.options = component.optionConfig.options.filter(
+        (option) => {
+          const optionValue = option.value !== void 0 ? option.value : option;
+          return allowedValues.includes(optionValue);
+        }
+      );
+      if (component.optionConfig.options.length === 0) {
+        component.optionConfig.options = [
+          {
+            label: `无可用选项（产品配置限制）`,
+            value: "",
+            disabled: true
+          }
+        ];
+      }
+    };
+    const initImportantDataChange = async () => {
+      var _a;
+      const importantDataChangeConfig = ((_a = localConfig.value) == null ? void 0 : _a.importantDataChange) || [];
+      if (importantDataChangeConfig.length === 0) return;
+      const fieldMap = {};
+      [...fieldsData.value, ...hiddenFields.value].forEach((field) => {
+        if (field.fieldName) {
+          fieldMap[field.id] = { fieldName: field.fieldName };
+        }
+      });
+      dataChangeManager.value = new importantDataChange.ImportantDataChangeManager(
+        importantDataChangeConfig,
+        {
+          http: ctx.$http,
+          fieldMap,
+          model: formData.value
+        }
+      );
+      try {
+        await dataChangeManager.value.fetchChanges();
+      } catch (e) {
+        console.warn("[ImportantDataChange] 拉取变更日志失败:", e);
+      }
+    };
+    const handleEvent = Vue.ref(null);
+    function loadEventFlow() {
+      const {
+        getEventHandlers: createEventHandlers,
+        handleEvent: createHandleEvent
+      } = eventFlowHandler.useEventFlow({
+        fields: [...fieldsData.value, ...hiddenFields.value],
+        instance,
+        localConfig: localConfig.value,
+        components: {
+          form: ctx
+        }
+      });
+      handleEvent.value = createHandleEvent;
+      const getEventHandlers = (row, item, eventConfig) => {
+        return createEventHandlers(item, row, eventConfig);
+      };
+      fieldsData.value.forEach((component) => {
+        if (component.fieldName) {
+          component.eventHandlers = getEventHandlers(
+            formData.value,
+            component,
+            component.eventConfig
+          );
+        }
+      });
+    }
+    function handleLabelLink(config) {
+      var _a;
+      handleEvent.value(
+        getFormData(),
+        config,
+        (_a = config.labelLinkEventConfig) == null ? void 0 : _a.find((item) => item.name == "Click")
+      );
+    }
+    const gridLayoutFieldsData = Vue.ref([]);
+    const oriGridLayoutData = Vue.ref([]);
+    const formItemRefs = Vue.ref(/* @__PURE__ */ new Map());
+    const setFormItemRef = (el, component) => {
+      if (!el) {
+        if (component && component.id) {
+          formItemRefs.value.delete(component.id);
+        }
+        return;
+      }
+      if (component && component.id) {
+        formItemRefs.value.set(String(component.id), el);
+      }
+    };
+    const getFormItemRef = (fieldId) => {
+      const formItem = formItemRefs.value.get(fieldId);
+      if (!formItem) {
+        console.log(`未找到 fieldId: ${fieldId} 的 FormItem 组件`);
+        return null;
+      }
+      console.log(`找到 FormItem 组件:`, formItem);
+      if (typeof formItem.getInnerComponentRef === "function") {
+        const innerRef = formItem.getInnerComponentRef();
+        console.log(`内部组件 ref:`, innerRef);
+        return innerRef;
+      } else {
+        console.log(`FormItem 组件没有 getInnerComponentRef 方法`);
+        return null;
+      }
+    };
+    function initGridLayoutDataConfig() {
+      let gridLayoutData = common.cloneDeep(localConfig.value.fieldsData || []);
+      gridLayoutData = gridLayoutData.map((item) => {
+        item.isResizable = false;
+        const component = item.component;
+        item.y = item.y * 60;
+        if (component.fieldType == "subTitle" || component.fieldType == "h2") {
+          item.h = item.h * 40;
+        } else if (component.fieldType == "divider") {
+          item.h = item.h * 0;
+        } else if (!item.fixedH) {
+          item.h = item.h * 60;
+        } else if (item.fixedH) {
+          item.h = item.h / (localConfig.value.labelPosition == "top" ? 1.5 : 1);
+        }
+        if (formMode.value == "query") {
+          if (item.component.displayMode == "edit") {
+            item.hidden = true;
+          }
+        } else {
+          if (item.component.displayMode == "query") {
+            item.hidden = true;
+          }
+        }
+        return item;
+      });
+      oriGridLayoutData.value = gridLayoutData;
+    }
+    const getFieldError = (fieldName) => {
+      var _a;
+      if (!formRef.value) return "";
+      const field = (_a = formRef.value.fields) == null ? void 0 : _a.find((f) => f.prop === fieldName);
+      return (field == null ? void 0 : field.validateMessage) || "";
+    };
+    const handleFieldChange = (config, value) => {
+      console.log("🚀 ~ handleFieldChange ~ value:", config.fieldName, value);
+    };
+    const handleCustomButtonClick = (button) => {
+      var _a;
+      const opt = { ...button };
+      opt.isApproval = false;
+      handleEvent.value(
+        getFormData(),
+        opt,
+        (_a = button.eventConfig) == null ? void 0 : _a.find((item) => item.name == "Click")
+      );
+    };
+    const handleActionClick = (button) => {
+      var _a;
+      handleEvent.value(
+        getFormData(),
+        button,
+        (_a = button.eventConfig) == null ? void 0 : _a.find((item) => item.name == "Click")
+      );
+    };
+    const hasSaveButton = () => {
+      var _a, _b;
+      return (_b = (_a = localConfig.value.pageFooterConfig) == null ? void 0 : _a.actions) == null ? void 0 : _b.some(
+        (item) => item.isApproval
+      );
+    };
+    const handleApprovalEvent = (isSubmit) => {
+      return new Promise((resolve, reject) => {
+        var _a, _b;
+        const actions = ((_a = localConfig.value.pageFooterConfig) == null ? void 0 : _a.actions) || [];
+        const approvalAction = actions.find((item) => item.isApproval);
+        if (approvalAction) {
+          let action = { ...approvalAction };
+          if (!isSubmit) {
+            action.isApproval = false;
+          }
+          handleEvent.value(
+            formData.value,
+            action,
+            (_b = approvalAction.eventConfig) == null ? void 0 : _b.find((item) => item.name == "Click")
+          ).then(() => {
+            resolve();
+          }).catch((error) => {
+            reject(error);
+          });
+        }
+      });
+    };
+    const validate = () => {
+      var _a;
+      const subFormComps = gridLayoutFieldsData.value.filter((item) => item.component.fieldType == "subForm").map((item) => item.component);
+      const subFormPromises = subFormComps.map((subForm) => {
+        var _a2, _b;
+        const subFormRef = getFormItemRef(String(subForm.id));
+        return ((_b = (_a2 = subFormRef == null ? void 0 : subFormRef.subFormRef) == null ? void 0 : _a2.validate) == null ? void 0 : _b.call(_a2)) || Promise.resolve();
+      });
+      subFormPromises.push((_a = formRef.value) == null ? void 0 : _a.validate());
+      return Promise.all(subFormPromises).then(() => getFormData());
+    };
+    const docValidate = () => {
+      const documentComps = gridLayoutFieldsData.value.filter((item) => item.component.fieldType == "document").map((item) => item.component);
+      const compPromises = documentComps.map((comp) => {
+        var _a;
+        const compRef = getFormItemRef(String(comp.id));
+        return ((_a = compRef == null ? void 0 : compRef.validate) == null ? void 0 : _a.call(compRef)) || Promise.resolve();
+      });
+      return Promise.all(compPromises);
+    };
+    const resetFields = () => {
+      var _a, _b;
+      (_a = formRef.value) == null ? void 0 : _a.clearValidate();
+      (_b = formRef.value) == null ? void 0 : _b.resetFields();
+      loadFormData();
+    };
+    const valueFormatMap = {
+      date: "YYYYMMDD",
+      week: "YYYYMMDD",
+      month: "YYYYMM",
+      year: "YYYY",
+      datetime: "YYYYMMDDHHmmss"
+    };
+    const formValueFormatMap = {
+      date: "YYYY/MM/DD",
+      week: "YYYY/MM/DD",
+      month: "YYYY/MM",
+      year: "YYYY",
+      datetime: "YYYY/MM/DD HH:mm:ss"
+    };
+    const getFormData = () => {
+      const result = { ...formData.value };
+      const processField = (field) => {
+        const fieldName = field.fieldName;
+        const fieldType = field.fieldType;
+        const value = result[fieldName];
+        if (fieldName && (fieldType === "checkbox" || fieldType === "multipleSelection" || fieldType === "cascader" || fieldType === "area" || fieldType === "industry")) {
+          let splitStr = "|";
+          if (fieldType === "cascader" || fieldType === "area" || fieldType === "industry") {
+            splitStr = ",";
+          }
+          if (Array.isArray(value)) {
+            result[fieldName] = value.join(splitStr);
+          }
+        } else if (fieldName && fieldType === "date" && value) {
+          const dateValueType = field.dateValueType;
+          const valueFormat = valueFormatMap[field.dateType] || "YYYYMMDD";
+          const formValueFormat = formValueFormatMap[field.dateType] || "YYYY/MM/DD";
+          switch (dateValueType) {
+            case "date":
+              result[fieldName] = moment.default(value, formValueFormat).toDate();
+              break;
+            case "timestamp":
+              result[fieldName] = moment.default(value, formValueFormat).valueOf();
+              break;
+            case "string":
+            default:
+              result[fieldName] = moment.default(value, formValueFormat).format(
+                valueFormat
+              );
+              break;
+          }
+        }
+        if (fieldType != "number" && !result[fieldName]) {
+          result[fieldName] = "";
+        }
+      };
+      if (fieldsData.value) {
+        fieldsData.value.forEach((component) => {
+          processField(component);
+        });
+      }
+      if (hiddenFields.value && hiddenFields.value.length > 0) {
+        hiddenFields.value.forEach((field) => {
+          processField(field);
+        });
+      }
+      return result;
+    };
+    const setFormData = (data, flag = false) => {
+      const processedData = { ...data };
+      const processField = (field) => {
+        const fieldName = field.fieldName;
+        const fieldType = field.fieldType;
+        if (!processedData.hasOwnProperty(fieldName)) {
+          return;
+        }
+        const value = processedData[fieldName];
+        if (fieldName && (fieldType === "checkbox" || fieldType === "multipleSelection" || fieldType === "cascader" || fieldType === "area" || fieldType === "industry")) {
+          let splitStr = "|";
+          if (fieldType === "cascader" || fieldType === "area" || fieldType === "industry") {
+            splitStr = ",";
+          }
+          if (typeof value === "string" && value.includes(splitStr)) {
+            processedData[fieldName] = value.split(splitStr);
+          } else if (typeof value === "string" && value !== "") {
+            processedData[fieldName] = [value];
+          } else if (value === "" || value === null || value === void 0) {
+            processedData[fieldName] = [];
+          }
+          processedData[fieldName] = processedData[fieldName].map((item) => {
+            if (item.indexOf(",") > -1) {
+              return item.split(",");
+            }
+            return item;
+          });
+        } else if (fieldName && fieldType === "date" && value) {
+          const valueFormat = valueFormatMap[field.dateType] || "YYYYMMDD";
+          const formValueFormat = formValueFormatMap[field.dateType] || "YYYY/MM/DD";
+          processedData[fieldName] = moment.default(value, valueFormat).format(
+            formValueFormat
+          );
+        }
+      };
+      if (fieldsData.value) {
+        fieldsData.value.forEach((component) => {
+          processField(component);
+        });
+      }
+      if (hiddenFields.value && hiddenFields.value.length > 0) {
+        hiddenFields.value.forEach((field) => {
+          processField(field);
+        });
+      }
+      if (flag) {
+        return common.removeEmptyValues(processedData);
+      }
+      Object.assign(formData.value, processedData);
+    };
+    Vue.onMounted(() => {
+      loadConfig();
+    });
+    Vue.onBeforeUnmount(() => {
+      formItemRefs.value.clear();
+    });
+    const findChangedFields = (newData, oldData) => {
+      const changedFields = [];
+      const allKeys = /* @__PURE__ */ new Set([
+        ...Object.keys(newData || {}),
+        ...Object.keys(oldData || {})
+      ]);
+      let initFlag = false;
+      if (Object.keys(oldData || {}).length === 0) {
+        initFlag = true;
+      }
+      for (const key of allKeys) {
+        if (initFlag) {
+          changedFields.push(key);
+          continue;
+        }
+        const hasKeyInNew = newData && Object.prototype.hasOwnProperty.call(newData, key);
+        const hasKeyInOld = oldData && Object.prototype.hasOwnProperty.call(oldData, key);
+        if (!hasKeyInNew && !hasKeyInOld) {
+          continue;
+        }
+        const newVal = hasKeyInNew ? newData[key] : void 0;
+        const oldVal = hasKeyInOld ? oldData[key] : void 0;
+        if (!newVal && !oldVal && Object.keys(oldData || {}).length === 0) {
+          continue;
+        }
+        if (JSON.stringify(newVal) != JSON.stringify(oldVal)) {
+          changedFields.push(key);
+        }
+      }
+      return changedFields;
+    };
+    const filterRelevantLinkageConfigs = (changedFieldNames, linkedConfig, fields) => {
+      const result = {
+        dataLink: [],
+        visibility: [],
+        required: [],
+        readonly: [],
+        disabled: [],
+        options: []
+      };
+      if (!linkedConfig || changedFieldNames.length === 0) {
+        return result;
+      }
+      const changedFieldIds = changedFieldNames.map((fieldName) => {
+        const field = fields.find((f) => f.fieldName == fieldName);
+        return field ? field.id : null;
+      }).filter((id) => id !== null);
+      if (linkedConfig.dataLink) {
+        result.dataLink = linkedConfig.dataLink.filter((item) => {
+          return changedFieldIds.some(
+            (fieldId) => parseFilterConfig.checkFieldInFilterConfig(item.filterConfig, fieldId) || parseFilterConfig.checkFieldInResultConfig(item.fieldAssignments, fieldId, fields)
+          );
+        });
+      }
+      if (linkedConfig.options) {
+        result.options = linkedConfig.options.filter((item) => {
+          return changedFieldIds.some(
+            (fieldId) => parseFilterConfig.checkFieldInFilterConfig(item.filterConfig, fieldId)
+          );
+        });
+      }
+      if (linkedConfig.visibility) {
+        result.visibility = linkedConfig.visibility;
+      }
+      if (linkedConfig.required) {
+        result.required = linkedConfig.required;
+      }
+      if (linkedConfig.readonly) {
+        result.readonly = linkedConfig.readonly;
+      }
+      if (linkedConfig.disabled) {
+        result.disabled = linkedConfig.disabled;
+      }
+      return result;
+    };
+    let isApplyingLinkage = false;
+    const applyLinkageEffectsForChangedFields = (changedFieldNames) => {
+      var _a;
+      if (isApplyingLinkage) return;
+      isApplyingLinkage = true;
+      const linkedConfig = localConfig.value.linkedConfig || {};
+      const fields = [...fieldsData.value, ...hiddenFields.value];
+      const relevantConfigs = filterRelevantLinkageConfigs(
+        changedFieldNames,
+        linkedConfig,
+        fields
+      );
+      relevantConfigs.dataLink.forEach((item) => {
+        if (parseFilterConfig.checkFilterMatch(item.filterConfig, formData.value, fields)) {
+          const fieldAssignments = item.fieldAssignments || [];
+          fieldAssignments.forEach((assignment) => {
+            var _a2, _b;
+            const fieldId = assignment.fieldId;
+            const formulaText = (_b = (_a2 = assignment.formula) == null ? void 0 : _a2.value) == null ? void 0 : _b.text;
+            const field = fields.find((f) => f.id == fieldId);
+            if (field && formulaText) {
+              const calcResult = calculate.calculate({
+                text: formulaText,
+                marks: [],
+                value: formData.value,
+                fieldsList: fields
+              });
+              if (!common.isEqual(formData.value[field.fieldName], calcResult)) {
+                formData.value[field.fieldName] = calcResult;
+              }
+            }
+          });
+        }
+      });
+      const updatedLayoutData = common.cloneDeep(oriGridLayoutData.value || []);
+      relevantConfigs.options.forEach((item) => {
+        if (parseFilterConfig.checkFilterMatch(item.filterConfig, formData.value, fields)) {
+          const fieldAssignments = item.fieldAssignments || [];
+          fieldAssignments.forEach((assignment) => {
+            const fieldId = assignment.fieldId;
+            const optionsOpt = assignment.optionsOpt || [];
+            const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
+            if (layoutFieldItem && optionsOpt.length > 0) {
+              const oriOptions = layoutFieldItem.component.optionConfig.options;
+              layoutFieldItem.component.optionConfig.options = oriOptions.filter(
+                (item2) => optionsOpt.includes(item2.value)
+              );
+            }
+          });
+        }
+      });
+      relevantConfigs.visibility.forEach((item) => {
+        const dataLinkFieldList = item.dataLinkFieldList || [];
+        dataLinkFieldList.forEach((fieldId) => {
+          const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
+          if (layoutFieldItem) {
+            layoutFieldItem.hidden = true;
+          }
+        });
+        if (parseFilterConfig.checkFilterMatch(item.filterConfig, formData.value, fields)) {
+          dataLinkFieldList.forEach((fieldId) => {
+            const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
+            if (layoutFieldItem) {
+              layoutFieldItem.hidden = false;
+            }
+          });
+        }
+      });
+      relevantConfigs.required.forEach((item) => {
+        const dataLinkFieldList = item.dataLinkFieldList || [];
+        dataLinkFieldList.forEach((fieldId) => {
+          const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
+          if (layoutFieldItem) {
+            layoutFieldItem.component.required = false;
+          }
+        });
+        if (parseFilterConfig.checkFilterMatch(item.filterConfig, formData.value, fields)) {
+          dataLinkFieldList.forEach((fieldId) => {
+            const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
+            if (layoutFieldItem) {
+              layoutFieldItem.component.required = true;
+            }
+          });
+        }
+      });
+      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];
+        }
+      }
+      formRules.value = rules;
+      if (formMode.value != "query") {
+        relevantConfigs.readonly.forEach((item) => {
+          const dataLinkFieldList = item.dataLinkFieldList || [];
+          dataLinkFieldList.forEach((fieldId) => {
+            const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
+            if (layoutFieldItem) {
+              layoutFieldItem.component.readOnly = false;
+            }
+          });
+          if (parseFilterConfig.checkFilterMatch(item.filterConfig, formData.value, fields)) {
+            dataLinkFieldList.forEach((fieldId) => {
+              const layoutFieldItem = updatedLayoutData.find(
+                (g) => g.id == fieldId
+              );
+              if (layoutFieldItem) {
+                layoutFieldItem.component.readOnly = true;
+              }
+            });
+          }
+        });
+        relevantConfigs.disabled.forEach((item) => {
+          const dataLinkFieldList = item.dataLinkFieldList || [];
+          dataLinkFieldList.forEach((fieldId) => {
+            const layoutFieldItem = updatedLayoutData.find((g) => g.id == fieldId);
+            if (layoutFieldItem) {
+              layoutFieldItem.component.disabled = false;
+            }
+          });
+          if (parseFilterConfig.checkFilterMatch(item.filterConfig, formData.value, fields)) {
+            dataLinkFieldList.forEach((fieldId) => {
+              const layoutFieldItem = updatedLayoutData.find(
+                (g) => g.id == fieldId
+              );
+              if (layoutFieldItem) {
+                layoutFieldItem.component.disabled = true;
+              }
+            });
+          }
+        });
+      }
+      const fieldsConfigArr = updatedLayoutData.filter((item) => !item.hidden);
+      gridLayoutFieldsData.value = sortLayoutItems(fieldsConfigArr);
+      (_a = gridLayout == null ? void 0 : gridLayout.value) == null ? void 0 : _a.resizeEvent();
+      isApplyingLinkage = false;
+    };
+    function sortLayoutItems(arr) {
+      return [...arr].sort((a, b) => {
+        if (a.y !== b.y) {
+          return a.y - b.y;
+        }
+        return a.x - b.x;
+      });
+    }
+    const subTableCounts = Vue.ref({});
+    const navLinkCompId = Vue.ref("");
+    const anchorNavLinks = Vue.computed(() => {
+      var _a;
+      const baseId = (_a = gridLayoutFieldsData.value) == null ? void 0 : _a[0].id;
+      const list = gridLayoutFieldsData.value.map((item) => {
+        if (item.component.fieldType == "h2") {
+          return {
+            id: item.id,
+            title: item.component.label
+          };
+        } else if (item.component.titleMode == "label") {
+          return {
+            id: item.id,
+            title: item.component.label,
+            count: subTableCounts.value[item.id] ?? 0
+          };
+        } else {
+          return null;
+        }
+      }).filter(Boolean);
+      if (list.length == 0) {
+        return list;
+      }
+      return [{ id: baseId, title: "基本信息" }, ...list];
+    });
+    eventBus.default.on("onSubTableDataLoaded", ({ subTableConfig, visibleData }) => {
+      const id = subTableConfig.id;
+      const count = (visibleData == null ? void 0 : visibleData.length) || 0;
+      subTableCounts.value[id] = count;
+    });
+    const navType = Vue.computed(() => {
+      var _a;
+      if ((localConfig.value.navigationEnabled ?? true) && !props.isSubForm && ((_a = anchorNavLinks.value) == null ? void 0 : _a.length) > 0 && fecFormRef.value) {
+        if (fecFormRef.value.$el.closest(".fec-layout-row")) {
+          return "top";
+        } else {
+          if (!props.isDialog) {
+            return "right";
+          } else {
+            return "";
+          }
+        }
+      } else {
+        return "";
+      }
+    });
+    function initLinkage() {
+      const changedFields = findChangedFields(formData.value, prevFormData.value);
+      if (changedFields.length > 0) {
+        applyLinkageEffectsForChangedFields(changedFields);
+      }
+      prevFormData.value = { ...formData.value };
+      linkaged = true;
+    }
+    Vue.watch(
+      formData,
+      (newVal, oldVal) => {
+        if (!linkaged) {
+          return;
+        }
+        const lastValue = { ...prevFormData.value };
+        if (common.isEqual(newVal, lastValue)) {
+          return;
+        }
+        const changedFields = findChangedFields(newVal, lastValue);
+        if (changedFields.length > 0) {
+          applyLinkageEffectsForChangedFields(changedFields);
+        }
+        prevFormData.value = { ...formData.value };
+        isSyncingToParent = true;
+        emit("update:modelValue", getFormData());
+        Vue.nextTick(() => {
+          isSyncingToParent = false;
+        });
+      },
+      { deep: true }
+    );
+    function setFormItemHeight(id, fixedH, h) {
+      var _a;
+      const item = gridLayoutFieldsData.value.find((item2) => item2.id == id);
+      if (!fixedH) {
+        item.h = h * 60;
+      } else if (fixedH) {
+        item.h = h / (localConfig.value.labelPosition == "top" ? 1.5 : 1);
+      }
+      const oriItem = oriGridLayoutData.value.find((item2) => item2.id == id);
+      if (!fixedH) {
+        oriItem.h = h * 60;
+      } 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.provide("formData", formData);
+    Vue.provide("localConfig", localConfig);
+    Vue.provide("fieldsData", fieldsData);
+    Vue.provide("hiddenFields", hiddenFields);
+    Vue.provide("rowHeight", rowHeight);
+    Vue.provide("gridLayout", gridLayout);
+    Vue.provide("gridLayoutFieldsData", gridLayoutFieldsData);
+    Vue.provide("setFormItemHeight", setFormItemHeight);
+    Vue.provide("formCtx", ctx);
+    Vue.provide("handleEvent", handleEvent);
+    Vue.provide("getFormData", getFormData);
+    __expose({
+      validate,
+      docValidate,
+      resetFields,
+      getFormData,
+      setFormData,
+      getFormItemRef,
+      formRef,
+      localConfig,
+      handleApprovalEvent,
+      hasSaveButton
+    });
+    return (_ctx, _cache) => {
+      const _component_el_form = index$7.ElForm;
+      const _component_el_col = index$4.ElCol;
+      const _component_el_container = index$3.ElContainer;
+      const _directive_fec_layout = Vue.resolveDirective("fec-layout");
+      return !configLoading.value ? Vue.withDirectives((Vue.openBlock(), Vue.createBlock(_component_el_container, {
+        key: 0,
+        class: Vue.normalizeClass(["fec-form", __props.class]),
+        "data-id": localConfig.value.templateKey,
+        "data-name": localConfig.value.templateName,
+        "data-pkId": localConfig.value.pkId,
+        "data-version": "v5",
+        ref_key: "fecFormRef",
+        ref: fecFormRef
+      }, {
+        default: Vue.withCtx(() => [
+          Vue.createVNode(_component_el_col, {
+            span: Vue.unref(navType) == "right" ? 21 : 24,
+            class: "fec-form-col",
+            style: Vue.normalizeStyle({ marginRight: Vue.unref(navType) == "right" ? "4px" : "0" })
+          }, {
+            default: Vue.withCtx(() => [
+              Vue.createVNode(Vue.unref(index$5.header), {
+                showBack: !__props.isSubForm && !__props.isDialog,
+                isApproval: __props.isApproval,
+                pageHeaderConfig: localConfig.value.pageHeaderConfig,
+                onActionClick: handleActionClick
+              }, null, 8, ["showBack", "isApproval", "pageHeaderConfig"]),
+              Vue.unref(navType) == "top" ? (Vue.openBlock(), Vue.createBlock(FormAnchorNav.default, {
+                key: 0,
+                fecFormRef: fecFormRef.value,
+                links: Vue.unref(anchorNavLinks),
+                modelValue: navLinkCompId.value,
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => navLinkCompId.value = $event)
+              }, null, 8, ["fecFormRef", "links", "modelValue"])) : Vue.createCommentVNode("", true),
+              Vue.createVNode(Vue.unref(index$6.main), null, {
+                default: Vue.withCtx(() => [
+                  Vue.createVNode(_component_el_form, {
+                    ref_key: "formRef",
+                    ref: formRef,
+                    model: formData.value,
+                    rules: formRules.value,
+                    "label-position": localConfig.value.labelPosition,
+                    style: { padding: "0", width: "100%" },
+                    class: Vue.normalizeClass({ "fec-el-form": !__props.isSubForm }),
+                    "validate-on-rule-change": false,
+                    size: "large",
+                    "scroll-to-error": ""
+                  }, {
+                    default: Vue.withCtx(() => [
+                      Vue.createVNode(Vue.unref(gridLayout_vue.default), {
+                        ref_key: "gridLayout",
+                        ref: gridLayout,
+                        layout: gridLayoutFieldsData.value,
+                        "onUpdate:layout": _cache[1] || (_cache[1] = ($event) => gridLayoutFieldsData.value = $event),
+                        "row-height": rowHeight.value,
+                        margin: [0, 0],
+                        "use-css-transforms": false,
+                        "col-num": localConfig.value.columns,
+                        "is-draggable": false,
+                        "is-resizable": false,
+                        onLayoutUpdated: layoutUpdated
+                      }, {
+                        item: Vue.withCtx(({ item: { component } }) => [
+                          Vue.createVNode(Vue.unref(index$8.FormItem), {
+                            ref: (el) => setFormItemRef(el, component),
+                            modelValue: formData.value[component.fieldName],
+                            "onUpdate:modelValue": ($event) => formData.value[component.fieldName] = $event,
+                            config: component,
+                            localConfig: localConfig.value,
+                            error: getFieldError(component.fieldName),
+                            formRef: formRef.value,
+                            formMode: formMode.value,
+                            dataChangeManager: dataChangeManager.value,
+                            onChange: handleFieldChange,
+                            onLabelLink: handleLabelLink
+                          }, null, 8, ["modelValue", "onUpdate:modelValue", "config", "localConfig", "error", "formRef", "formMode", "dataChangeManager"])
+                        ]),
+                        _: 1
+                      }, 8, ["layout", "row-height", "col-num"]),
+                      (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(hiddenFields.value, (field) => {
+                        return Vue.openBlock(), Vue.createElementBlock("input", {
+                          key: field.fieldName,
+                          type: "hidden",
+                          name: field.fieldName,
+                          value: formData.value[field.fieldName]
+                        }, null, 8, _hoisted_1);
+                      }), 128))
+                    ]),
+                    _: 1
+                  }, 8, ["model", "rules", "label-position", "class"])
+                ]),
+                _: 1
+              }),
+              !__props.isSubForm && !__props.isDialog && !__props.isApproval ? (Vue.openBlock(), Vue.createBlock(Vue.unref(index$9.footer), {
+                key: 1,
+                formMode: formMode.value,
+                pageFooterConfig: localConfig.value.pageFooterConfig,
+                onCustomButtonClick: handleCustomButtonClick
+              }, null, 8, ["formMode", "pageFooterConfig"])) : Vue.createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["span", "style"]),
+          Vue.unref(navType) == "right" ? (Vue.openBlock(), Vue.createBlock(_component_el_col, {
+            key: 0,
+            span: 3,
+            class: "fec-form-col",
+            style: { "margin-left": "4px" }
+          }, {
+            default: Vue.withCtx(() => [
+              Vue.createVNode(RightAnchorNav.default, {
+                fecFormRef: fecFormRef.value,
+                links: Vue.unref(anchorNavLinks),
+                modelValue: navLinkCompId.value,
+                "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => navLinkCompId.value = $event)
+              }, null, 8, ["fecFormRef", "links", "modelValue"])
+            ]),
+            _: 1
+          })) : Vue.createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["class", "data-id", "data-name", "data-pkId"])), [
+        [_directive_fec_layout]
+      ]) : Vue.createCommentVNode("", true);
+    };
+  }
+});
+const _Form = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-2a14b0ea"]]);
+exports.default = _Form;