@epxing/designer 0.0.0-stage → 5.3.0-beta.2

package/dist/src/visual/Config.vue.js

@@ -0,0 +1,862 @@
+import { __vitePreload as __epxPackagePreload } from "../../_virtual/preload-helper.js";
+import { createVNode, resolveComponent, createTextVNode, isVNode } from "vue";
+import { mapGetters } from "vuex";
+import { captureRef } from "@epxing/core/src/capture-ref";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const _sfc_main = {
+  name: "epx-visual-config",
+  navConfigs: {
+    flag: false
+  },
+  data() {
+    return {
+      pageMetaId: null,
+      loadConfig: false,
+      pageGlobalConfigs: {},
+      showPageComponent: true,
+      resetDCModalVisible: false,
+      pageConfigs: {},
+      selectComponentList: [],
+      componentList: [],
+      selectTab: "component",
+      allComponentConfigs: {},
+      defaultContainerItems: {},
+      actionList: [],
+      ruleList: [],
+      relationList: [],
+      pageParams: [],
+      allFieldList: [],
+      scopeConfigs: {},
+      isSaveConfig: false
+    };
+  },
+  computed: {
+    ...mapGetters(["getPageById"]),
+    currentMetaId() {
+      return this.$query.entityId || this.pageMetaId;
+    },
+    currentPage() {
+      const page = this.getPageById(this.$query.id);
+      return page;
+    },
+    currentMeta() {
+      return this.metas[this.currentMetaId] || null;
+    },
+    page_config() {
+      const {
+        config = "{}"
+      } = this.$query;
+      if (typeof config === "string") {
+        try {
+          return eval("(" + config + ")");
+        } catch (error) {
+          return {};
+        }
+      }
+      return config;
+    },
+    items() {
+      const {
+        items = []
+      } = this.pageConfigs;
+      return items;
+    },
+    getComponentConfigs() {
+      return (component) => {
+        const {
+          configs = {},
+          flex,
+          title
+        } = component;
+        const itemConfig = this.allComponentConfigs[component.id] || {};
+        return {
+          ...configs,
+          ...itemConfig,
+          flex,
+          componentName: title
+        };
+      };
+    },
+    getComponentInfo() {
+      return (component) => {
+        const componentInfo = this.componentList.find((item) => (item.componentName || item.CODE) === component.contentType) || {};
+        return {
+          ...componentInfo
+        };
+      };
+    },
+    getPageItems() {
+      return (id) => {
+        const configComponentOuter = this.$refs[`config-${id}`];
+        if (configComponentOuter) {
+          const configComponent = configComponentOuter.$refs.component;
+          return configComponent.getConfigs();
+        }
+      };
+    }
+  },
+  provide() {
+    const {
+      id
+    } = this.$query;
+    return {
+      pageId: id,
+      pageConfigs: this.page_config,
+      getPageMetaId: () => this.currentMetaId,
+      getItemConfigs: () => this.allComponentConfigs,
+      getDefaultContainerItems: () => this.defaultContainerItems,
+      changeItemConfigs: this.changeItemConfigs,
+      setContainerDefaultItems: this.setContainerDefaultItems,
+      getVisualComponent: this.getVisualComponent
+    };
+  },
+  methods: {
+    getPageInfo() {
+      this.getPageId().then((page) => {
+        const {
+          metaId
+        } = page;
+        if (metaId) this.pageMetaId = metaId;
+        this.getMetaId().then(() => {
+          this.getDefaultConfig();
+          this.loadConfig = true;
+        });
+      });
+    },
+    getPageId() {
+      if (!this.$query.id || this.currentPage) {
+        return Promise.resolve(this.currentPage);
+      }
+      return this.$store.dispatch({
+        type: "ADD_PAGE",
+        pageId: this.$query.id
+      });
+    },
+    getMetaId() {
+      if (!this.currentMetaId || this.currentMeta) {
+        return Promise.resolve(this.currentMeta);
+      } else {
+        return this.$store.dispatch({
+          type: "ADD_META",
+          metaId: this.currentMetaId
+        });
+      }
+    },
+    getDefaultConfig() {
+      const {
+        config: pageConfigs = {}
+      } = this.currentPage || {};
+      const {
+        itemConfigs = {},
+        items = [],
+        ...globalConfigs
+      } = pageConfigs;
+      this.allComponentConfigs = this.$_.cloneDeep(itemConfigs);
+      this.selectComponentList = this.$_.cloneDeep(items);
+      this.pageGlobalConfigs = this.$_.cloneDeep(globalConfigs);
+      this.getAllFieldList();
+      this.getActionList();
+      this.getRuleList();
+      this.getScopeConfigs();
+      this.getEntityRelation();
+    },
+    /**
+     * 获取组件列表
+     */
+    getAllComponents() {
+      this.$http.list({
+        entityId: "FM_PAGE",
+        "scope.TYPE": "01"
+      }).then((data) => {
+        const componentList = data.entitys;
+        componentList.forEach((item) => {
+          item.componentName = item.CODE;
+          if (item.COMPONENT_TYPE === "page") {
+            const componentName = this.getComponetName(item);
+            item.componentName = componentName;
+          }
+          const visualComponentName = this.getVisualComponent(item);
+          item.visualComponentName = visualComponentName;
+        });
+        this.componentList = [...componentList];
+      });
+    },
+    // getAllFieldList () {
+    //   if (!this.currentMetaId) return
+    //   this.$http.entityFieldTreeStore({
+    //     metaId: this.currentMetaId,
+    //     allSub: true,
+    //     node: 'root'
+    //   })
+    //     .then(data => {
+    //       // eslint-disable-next-line no-eval
+    //       const treeFieldStore = eval('(' + data + ')')
+    //       if (treeFieldStore && treeFieldStore[0] && treeFieldStore[0].code === this.currentMetaId) {
+    //         treeFieldStore[0].isUnFold = true
+    //         this.allFieldList = [...treeFieldStore]
+    //       }
+    //     })
+    // },
+    formatFields(arr, flag = "") {
+      arr.forEach((item) => {
+        if (!item.field) item.field = flag ? flag.toUpperCase() + "|" + item.code : item.code;
+        if (!item.codeKey) item.codeKey = item.relatedEntity;
+        if (item.relationMeta) {
+          const {
+            children,
+            linkFlag,
+            relationMetaList
+          } = item.relationMeta;
+          item.children = children;
+          item.linkFlag = flag ? flag + "|" + linkFlag : linkFlag;
+          if (relationMetaList) {
+            relationMetaList.forEach((meta) => {
+              meta.isSub = true;
+              meta.type = "meta";
+              meta.linkFlag = item.linkFlag + "|" + meta.linkFlag;
+              meta.field = item.linkFlag;
+              meta.children = meta.children.map((child) => ({
+                ...child,
+                relationSort: "1"
+              }));
+            });
+            item.children.push(...relationMetaList);
+          }
+        }
+        if (item.children) this.formatFields(item.children, item.linkFlag);
+      });
+    },
+    // 筛选条件字段
+    getAllFieldList(v) {
+      if (!this.currentMetaId || v === this.pageMetaId && this.pageAllFieldList) return;
+      this.$http.get({
+        action: "metaRelationTree",
+        entityId: "FM_ENTITY",
+        metaId: this.currentMetaId,
+        allSub: true
+      }).then((data) => {
+        if (data) {
+          if (data.relationMetaList) {
+            data.relationMetaList.forEach((meta) => {
+              meta.isSub = true;
+              meta.type = "meta";
+              meta.field = meta.linkFlag;
+              meta.children = meta.children.map((child) => ({
+                ...child,
+                relationSort: "1",
+                field: meta.linkFlag.toUpperCase() + "|" + child.code
+              }));
+            });
+            data.children.push(...data.relationMetaList);
+          }
+          data.isMain = true;
+          data.isUnFold = true;
+          const fields = [data];
+          this.formatFields(fields);
+          console.log(fields);
+          if (data.id === this.currentMetaId) {
+            this.allFieldList = [...fields];
+            this.componentTreeFieldStore = [...fields];
+          }
+        }
+      });
+    },
+    getEntityRelation() {
+      this.$http.$get({
+        entityId: "FM_ENTITY_RELATION",
+        action: "getEntityRelationTree",
+        mainEntity: this.currentMetaId
+      }).then((data) => {
+        data.forEach((relation) => {
+          relation.label = relation.title;
+          relation.value = relation.flag;
+          relation.children = relation.childrens;
+          if (relation.childrens) {
+            relation.childrens.forEach((childRelation) => {
+              childRelation.value = relation.flag + "#" + childRelation.flag;
+              childRelation.label = childRelation.title;
+            });
+          }
+        });
+        this.relationList = data;
+      });
+    },
+    // 获取对象接口
+    getActionList() {
+      this.$http.list({
+        action: "getEntityAllApi",
+        entityId: "FM_ENTITY_API",
+        metaId: this.currentMetaId
+      }).then((data) => {
+        this.actionList = data.entitys.map((item) => ({
+          label: item.LABEL || item.NAME,
+          value: item.NAME
+        }));
+      });
+    },
+    // 获取对象接口
+    getRuleList() {
+      this.$http.list({
+        entityId: "ACT_RE_MODEL",
+        "scope.ENTITY": this.currentMetaId,
+        "scope.CATEGORY": "2"
+      }).then((data) => {
+        this.ruleList = data.entitys.map((item) => ({
+          label: item.NAME || item.KEY,
+          value: item.KEY
+        }));
+      });
+    },
+    /**
+     * 获取查询配置
+     */
+    getScopeConfigs() {
+      this.$http.list({
+        action: "getAllSearchConfig",
+        entityId: "FM_SEARCH_CONFIG"
+      }).then((data) => {
+        this.scopeConfigs = data;
+      });
+    },
+    changeItemConfigs(key, configs = {}, type) {
+      if (key === "page") {
+        this.pageGlobalConfigs = {
+          ...this.pageGlobalConfigs,
+          ...configs
+        };
+      } else {
+        const itemConfig = this.allComponentConfigs[key] || {};
+        let componentConfigs = {};
+        const componentAttris = ["flex", "layout", "direction", "justify", "align", "style", "componentName", "span", "xsspan", "items", "countScopeParams"];
+        let componentAttriMap = {};
+        for (const key2 in configs) {
+          const isAttri = componentAttris.find((item) => item === key2 || item + ".i18n" === key2);
+          if (isAttri || type === "component") {
+            componentAttriMap = {
+              ...componentAttriMap,
+              [key2.replace(/^componentName(.i18n)?$/, "title$1")]: configs[key2]
+            };
+          } else {
+            componentConfigs = {
+              ...componentConfigs,
+              [key2]: configs[key2]
+            };
+          }
+        }
+        this.allComponentConfigs[key] = {
+          ...itemConfig,
+          ...componentConfigs
+        };
+        const selectComponentList = [...this.selectComponentList];
+        const ids = key.split("-");
+        ids.reduce((componentList, id, index) => {
+          const component = componentList.find((item) => item.id === id) || {};
+          if (index === ids.length - 1) {
+            for (const attri in componentAttriMap) {
+              if (componentAttriMap[attri] !== void 0) {
+                component[attri] = componentAttriMap[attri];
+                if (component[attri] === null) delete component[attri];
+              }
+            }
+            return null;
+          }
+          if (!component.items) component.items = [];
+          return component.items;
+        }, selectComponentList);
+        this.selectComponentList = [...selectComponentList];
+      }
+    },
+    getComponetName(component) {
+      if (component && component.PATH) {
+        let project = "frame";
+        let pathName = "";
+        const pagePath = component.PATH;
+        const rootMatch = pagePath.match(/^@\/\w+\//);
+        if (rootMatch) {
+          project = rootMatch[0].replace(/[@|/]/g, "");
+          pathName = pagePath.split(rootMatch)[1].replace(".vue", "");
+        }
+        const componentPath = pathName.replace("views/", "").replace("packages/", "").replace("components/", "").replace(/\//g, "-").replace(/(\w)([A-Z])/g, "$1-$2").toLowerCase();
+        const componentName = (project === "frame" ? "" : project + "-") + componentPath;
+        return componentName;
+      }
+      return null;
+    },
+    getVisualComponent(component) {
+      if (component && component.VISUAL_CONFIG_PATH) {
+        let pathName = "";
+        const pagePath = component.VISUAL_CONFIG_PATH;
+        const rootMatch = pagePath.match(/^@\/((frame|product|project)\/)?/);
+        if (rootMatch) {
+          pathName = pagePath.split(rootMatch[0])[1].replace(".vue", "");
+        }
+        const componentPath = pathName.replace(/(views|components|packages)\//, "").replace(/\//g, "-").replace(/(\w)([A-Z])/g, "$1-$2").toLowerCase();
+        const componentName = componentPath;
+        return componentName;
+      }
+      return null;
+    },
+    resetToDefautComponents() {
+      const {
+        pageInstance = {}
+      } = this.$query;
+      const {
+        items = []
+      } = pageInstance.$options || {};
+      items.forEach((item) => {
+        const selectItem = this.componentList.find((comp) => comp.CODE === item.contentType);
+        const componentName = this.getVisualComponent(selectItem);
+        item.visualComponentName = componentName;
+        item.componentType = selectItem.COMPONENT_TYPE;
+      });
+      this.selectComponentList = [...items];
+      this.resetDCModalVisible = false;
+    },
+    clickSelectComponent(component) {
+      this.scrollToComponent(component.id);
+    },
+    foldComponent(component) {
+      if (component.componentType === "container") {
+        const componentList = [...this.selectComponentList];
+        this.setFoldComponentItem(componentList, component.id);
+        this.selectComponentList = [...componentList];
+      }
+    },
+    setFoldComponentItem(componentList, id) {
+      for (let i = 0; i < componentList.length; i++) {
+        const component = componentList[i];
+        if (component.id === id) {
+          component.fold = !component.fold;
+          return component;
+        } else {
+          const {
+            items = []
+          } = component.configs || {};
+          if (items.length > 0) {
+            this.setFoldComponentItem(component.configs.items, id);
+          }
+        }
+      }
+    },
+    scrollToComponent(componentId) {
+      const configComponent = this.$refs[`config-${componentId}`];
+      if (configComponent) {
+        const el = configComponent.$el || configComponent;
+        const configContainer = this.$refs.configContainer;
+        configContainer.scrollTop = el.offsetTop - 50;
+      }
+    },
+    scrollToConfig(componentId) {
+      const component = this.$refs.visualComponent;
+      if (!component) return;
+      const configComponent = component.$refs[`config-${componentId}`];
+      if (configComponent) {
+        const el = configComponent.$el || configComponent;
+        const configContainer = this.$refs.configContainer;
+        configContainer.scrollTop = el.offsetTop - 20;
+      }
+    },
+    setSelectComponent(componentList, upId, comp) {
+      for (let i = 0; i < componentList.length; i++) {
+        const component = componentList[i];
+        if (component.id === upId) {
+          if (!component.configs) component.configs = {};
+          if (!component.configs.items) component.configs.items = [];
+          component.configs.items.push(comp);
+          return component;
+        } else {
+          const {
+            items = []
+          } = component.configs || {};
+          if (items.length > 0) {
+            this.setSelectComponent(component.configs.items, upId, comp);
+          }
+        }
+      }
+    },
+    deleteSelectComponentItem(componentList, id) {
+      for (let i = 0; i < componentList.length; i++) {
+        const component = componentList[i] || {};
+        if (component.id === id) {
+          componentList.splice(i, 1);
+        } else {
+          const {
+            items = []
+          } = component.configs || this.allComponentConfigs[component.id] || {};
+          if (items.length > 0) {
+            this.deleteSelectComponentItem(items, id);
+          }
+        }
+      }
+    },
+    deleteSelectComponent(id, e) {
+      e.stopPropagation();
+      const selectComponentList = [...this.selectComponentList];
+      const ids = id.split("-");
+      ids.reduce((componentList, id2, index) => {
+        if (index === ids.length - 1) {
+          const componentIndex = componentList.findIndex((item) => item.id === id2) || {};
+          componentList.splice(componentIndex, 1);
+        } else {
+          const componentItem = componentList.find((item) => item.id === id2) || {};
+          return componentItem.items;
+        }
+      }, selectComponentList);
+      this.selectComponentList = selectComponentList;
+      this.$forceUpdate();
+    },
+    addComponentItem(ids, index, componentList, comp) {
+      const id = ids[index];
+      const componentItem = componentList.find((item) => item.id === id) || {};
+      if (!componentItem.items) componentItem.items = [];
+      if (index === ids.length - 1) {
+        componentItem.items.push(comp);
+      } else {
+        this.addComponentItem(ids, index + 1, componentItem.items, comp);
+      }
+    },
+    addComponent(component, upId) {
+      const newComp = {
+        id: component.id,
+        title: component.TITLE,
+        contentType: component.componentName || component.CODE
+      };
+      if (component.CONTAINER === "1") {
+        newComp.items = [];
+      }
+      if (upId === "root") {
+        this.selectComponentList.push(newComp);
+      } else {
+        const selectComponentList = [...this.selectComponentList];
+        const ids = upId.split("-");
+        const componentList = ids.reduce((componentList2, id) => {
+          const componentItem = componentList2.find((item) => item.id === id) || {};
+          if (!componentItem.items) componentItem.items = [];
+          return componentItem.items;
+        }, selectComponentList);
+        componentList.push(newComp);
+        this.selectComponentList = selectComponentList;
+        this.$forceUpdate();
+      }
+    },
+    changeConfigs(id, configs) {
+      const componentConfigs = this.allComponentConfigs[id] || {};
+      this.allComponentConfigs[id] = {
+        ...componentConfigs,
+        ...configs
+      };
+    },
+    setContainerDefaultItems(id, items) {
+      if (id === "page") {
+        const {
+          config: pageConfigs = {}
+        } = this.currentPage || {};
+        if (!pageConfigs.items) this.selectComponentList = items;
+      } else {
+        const selectComponentList = [...this.selectComponentList];
+        const ids = id.split("-");
+        ids.reduce((componentList, id2, index) => {
+          const componentItem = componentList.find((item) => item.id === id2) || {};
+          if (!componentItem.items) {
+            if (index === ids.length - 1) componentItem.items = items;
+            else componentItem.items = [];
+          }
+          return componentItem.items;
+        }, selectComponentList);
+        this.selectComponentList = selectComponentList;
+      }
+    },
+    setComponentConfig(componentList, itemConfigs = {}, upId) {
+      componentList.forEach((component) => {
+        const componentId = upId ? upId + "-" + component.id : component.id;
+        const configComponentOuter = this.$refs[`config-${component.id}`];
+        if (configComponentOuter) {
+          const configComponent = configComponentOuter.$refs.component;
+          if (configComponent) {
+            const configs = configComponent.getConfigs() || {};
+            const {
+              span,
+              flex,
+              componentName
+            } = configs;
+            if (span) component.span = span;
+            delete component.configs;
+            if (componentName) {
+              component.title = componentName;
+              delete configs.componentName;
+            }
+            if (flex) {
+              component.flex = flex;
+              delete configs.flex;
+            }
+            const defaulConfigs = itemConfigs[componentId] || {};
+            itemConfigs[componentId] = {
+              ...defaulConfigs,
+              ...configs
+            };
+          }
+        }
+        const {
+          items = []
+        } = component;
+        if (items.length > 0) {
+          this.setComponentConfig(items, itemConfigs, componentId);
+        }
+      });
+    },
+    saveConfigs(event, next, errorFn) {
+      const selectComponentList = [...this.selectComponentList];
+      const itemConfigs = {
+        ...this.allComponentConfigs
+      };
+      this.setComponentConfig(selectComponentList, itemConfigs, "");
+      for (const key in itemConfigs) {
+        const itemConfig = itemConfigs[key];
+        for (const itemKey in itemConfig) {
+          if (itemConfig[itemKey] === null || itemConfig[itemKey] === void 0) {
+            delete itemConfig[itemKey];
+          }
+        }
+        if (this.$_.isEmpty(itemConfig)) {
+          delete itemConfigs[key];
+        }
+      }
+      this.selectComponentList = [...selectComponentList];
+      const config2 = {
+        ...this.pageGlobalConfigs
+      };
+      config2.items = selectComponentList;
+      config2.itemConfigs = itemConfigs;
+      this.isSaveConfig = true;
+      __epxPackagePreload(() => import(
+        /* webpackChunkName: "standalone" */
+        "@babel/standalone"
+      ), true ? [] : void 0, import.meta.url).then((babel) => {
+        const es5 = babel.transform(config2.JS, {
+          presets: ["env"]
+        });
+        config2.compileJS = es5.code;
+        for (const key in config2) {
+          if (config2[key] === null) {
+            delete config2[key];
+          }
+        }
+        this.savePageConfigs(config2, next, errorFn);
+      });
+    },
+    savePageConfigs(config2) {
+      let formParams = {};
+      const globalConfig = this.$refs.globalConfig;
+      if (globalConfig) {
+        const formComp = this.getComponentById("form", globalConfig);
+        const inner = formComp && formComp.$refs.component;
+        if (inner && inner.getFormData) {
+          formParams = inner.getFormData() || {};
+        }
+      }
+      this.$http.update({
+        entityId: this.$metaId,
+        ...formParams,
+        [`bean.${this.$metaKey}`]: this.$query.id,
+        "bean.CONTENT": JSON.stringify(config2, null, "	")
+      }).then((data) => {
+        this.$message.success("保存成功");
+        this.$store.commit("DELETE_PAGE", {
+          pageId: this.$query.id
+        });
+        this.backPage({
+          reload: true
+        });
+        this.isSaveConfig = false;
+      }).catch((err) => {
+        this.$message.error(err.message || "保存失败");
+        this.isSaveConfig = false;
+      });
+    },
+    renderComponent() {
+      return createVNode("div", {
+        "class": "component-config"
+      }, [createVNode("div", {
+        "class": "component-container"
+      }, [createVNode("p", {
+        "class": "select-components__header"
+      }, [createVNode("i", {
+        "class": "epx-icon-component"
+      }, null), createVNode("span", null, [createTextVNode("已选组件")])]), createVNode("div", {
+        "class": "select-components"
+      }, [createVNode("div", {
+        "class": ["component-config__item", {
+          fold: !this.showPageComponent
+        }]
+      }, [createVNode("p", {
+        "class": "select-component-item__header",
+        "onClick": this.scrollToComponent.bind(this, "page")
+      }, [createVNode("span", null, [this.currentPage.title, createVNode("i", {
+        "class": ["el-icon-arrow-up", "fr"],
+        "onClick": () => this.showPageComponent = !this.showPageComponent
+      }, null)])]), this.showPageComponent && createVNode(resolveComponent("epx-config-select-items"), {
+        "metaId": this.currentMetaId,
+        "all-component-list": this.componentList,
+        "component-list": this.selectComponentList,
+        "onDelete": this.deleteSelectComponent.bind(this),
+        "onAdd": ([component, upId]) => this.addComponent(component, upId),
+        "onChangeConfigs": this.changeConfigs.bind(this),
+        "onScrollToConfig": this.scrollToConfig
+      }, null)])]), createVNode(resolveComponent("el-popover"), {
+        "placement": "top",
+        "width": "160",
+        "value": this.resetDCModalVisible,
+        "trigger": "manual"
+      }, {
+        default: () => [createVNode("p", null, [createTextVNode("是否初始化页面组件？")]), createVNode("div", {
+          "style": "text-align: right; margin: 0"
+        }, [createVNode(resolveComponent("el-button"), {
+          "size": "small",
+          "type": "primary",
+          "link": true,
+          "onClick": () => this.resetDCModalVisible = false
+        }, {
+          default: () => [createTextVNode("取消")]
+        }), createVNode(resolveComponent("el-button"), {
+          "type": "primary",
+          "size": "small",
+          "onClick": this.resetToDefautComponents.bind(this)
+        }, {
+          default: () => [createTextVNode("确定")]
+        })])],
+        reference: () => createVNode(resolveComponent("el-button"), {
+          "type": "primary",
+          "link": true,
+          "style": {
+            marginTop: "10px",
+            color: "#999"
+          },
+          "onClick": () => this.resetDCModalVisible = true
+        }, {
+          default: () => [createTextVNode("初始化页面组件")]
+        })
+      })]), createVNode("div", {
+        "ref": "configContainer",
+        "class": "component-config__container"
+      }, [createVNode(resolveComponent("epx-visual-config-item"), {
+        "ref": "visualComponent",
+        "metaId": this.currentMetaId,
+        "all-component-list": this.componentList,
+        "component-list": this.selectComponentList,
+        "globalConfigs": this.pageGlobalConfigs,
+        "pageActionList": this.actionList,
+        "pageRuleList": this.ruleList,
+        "pageAllFieldList": this.allFieldList,
+        "pageRelationList": this.relationList,
+        "pageParams": this.pageParams,
+        "scopeConfigs": this.scopeConfigs
+      }, null)])]);
+    },
+    /**
+     * 头部区域
+     */
+    renderHeader() {
+      return createVNode("div", {
+        "class": "header"
+      }, [createVNode("div", {
+        "class": "title fl"
+      }, [createVNode("i", {
+        "class": "el-icon-arrow-left",
+        "onClick": this.backPage
+      }, null), createVNode("span", {
+        "class": ""
+      }, [this.currentPage.title])]), createVNode("div", {
+        "class": "operate fr"
+      }, [createVNode(resolveComponent("el-button"), {
+        "type": "primary",
+        "size": "default",
+        "onClick": this.saveConfigs.bind(this),
+        "loading": this.isSaveConfig
+      }, {
+        default: () => [createTextVNode("保存页面配置")]
+      })])]);
+    },
+    renderBody() {
+      let _slot;
+      return createVNode(resolveComponent("el-tabs"), {
+        "class": "config-tabs",
+        "type": "card",
+        "modelValue": this.selectTab,
+        "onTabClick": (tab) => this.selectTab = tab.name
+      }, {
+        default: () => [createVNode(resolveComponent("el-tab-pane"), {
+          "lazy": true,
+          "label": "页面组件",
+          "name": "component"
+        }, _isSlot(_slot = this.renderComponent()) ? _slot : {
+          default: () => [_slot]
+        }), createVNode(resolveComponent("el-tab-pane"), {
+          "lazy": true,
+          "label": "全局设置",
+          "name": "global"
+        }, {
+          default: () => [createVNode(resolveComponent("epx-page"), {
+            "ref": captureRef(this, "globalConfig"),
+            "metaId": "FM_PAGE_CONFIG",
+            "flag": "v_page_global_config",
+            "current-query": {
+              ...this.$query,
+              pageType: "EDIT"
+            }
+          }, null)]
+        }), this.currentMetaId && createVNode(resolveComponent("el-tab-pane"), {
+          "lazy": true,
+          "label": "对象信息",
+          "name": "meta"
+        }, {
+          default: () => [createVNode(resolveComponent("epx-add-form"), {
+            "comp-configs": {
+              metaId: "FM_ENTITY",
+              pageType: "EDIT"
+            },
+            "pageType": "EDIT",
+            "currentQuery": {
+              id: this.currentMetaId,
+              pageType: "EDIT"
+            }
+          }, null)]
+        }), createVNode(resolveComponent("el-tab-pane"), {
+          "lazy": true,
+          "label": "关联页面",
+          "name": "page"
+        }, {
+          default: () => [createVNode(resolveComponent("epx-page-chart"), {
+            "page": this.currentPage,
+            "pageConfigs": this.currentPage.config,
+            "selectComponentList": this.selectComponentList,
+            "componentList": this.componentList
+          }, null)]
+        }), createVNode(resolveComponent("el-tab-pane"), {
+          "lazy": true,
+          "label": "JS事件",
+          "name": "js"
+        }, {
+          default: () => [createVNode(resolveComponent("epx-js-panel"), {
+            "value": this.pageGlobalConfigs.JS,
+            "onChange": (v) => this.pageGlobalConfigs.JS = v
+          }, null)]
+        })]
+      });
+    }
+  },
+  render(h) {
+    if (!this.loadConfig) return;
+    return createVNode("div", {
+      "class": "config"
+    }, [this.renderHeader(), this.renderBody()]);
+  },
+  created() {
+    this.getPageInfo();
+    this.getAllComponents();
+  }
+};
+export {
+  _sfc_main as default
+};