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

package/dist/src/visual/config-page/DashboardDesign.js

@@ -0,0 +1,605 @@
+import { __vitePreload as __epxPackagePreload } from "../../../_virtual/preload-helper.js";
+import { defineAsyncComponent, resolveComponent, openBlock, createElementBlock, normalizeStyle, normalizeClass, createBlock, withCtx, createVNode, toDisplayString, createCommentVNode, createElementVNode, createTextVNode } from "vue";
+import { buildThemeCss, buildThemeChartConfig } from "@epxing/dashboard/src/theme-style";
+import { normalizeGridItem } from "@epxing/dashboard/src/layout-util";
+import { isContainerType, getContainerGrid, isLegacyConfig, getPageGrid } from "@epxing/dashboard/src/grid/model";
+import { createDesignState } from "@epxing/dashboard/src/grid/designState";
+import DesignItem from "@epxing/dashboard/src/DesignItem.vue";
+import { chartConfigRequiresReload } from "@epxing/utils/src/chart-config-update";
+/* empty css                    */
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  name: "epx-visual-config-dashboard-design",
+  components: {
+    // 设计态画布（gridstack 封装）按需加载，运行态不拉 gridstack
+    "epx-dashboard-design-grid": defineAsyncComponent(() => __epxPackagePreload(() => import("@epxing/dashboard/src/DesignGrid.vue"), true ? [] : void 0, import.meta.url)),
+    "epx-dashboard-design-item": DesignItem
+  },
+  props: {
+    pageMetaId: String,
+    pageId: String,
+    upCompId: String,
+    globalConfigs: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    allComponentList: {
+      type: Array,
+      default() {
+        return [];
+      }
+    },
+    itemConfigs: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    componentList: {
+      type: Array,
+      default() {
+        return [];
+      }
+    },
+    theme: {
+      type: String,
+      default: "light"
+    },
+    themeStyles: Object,
+    // 主题面板处于"移动端"编辑态：加 .is-mobile-preview 类，桌面宽画布也预览移动端覆盖
+    mobilePreview: Boolean
+  },
+  provide() {
+    return {
+      upPage: this,
+      pageMetaId: this.pageMetaId,
+      pageId: this.pageId,
+      changeItemConfigs: this.changeItemConfigs,
+      // 主题图表配置下发，跨容器层注入到图表组件，保持响应式（设计器实时调色板）
+      getThemeChartConfig: () => this.themeChartConfig,
+      // 设计态共享选中态：容器内网格与页面级画布共用同一份，选中项只有一个
+      epxDashboardDesign: this.design,
+      // 配置是否旧版（与运行态 Dashboard.vue 同一 provide）：容器里的嵌套容器据此选历史写死值 / 继承本容器网格
+      getDashboardLegacy: () => isLegacyConfig(this.globalConfigs)
+    };
+  },
+  inject: ["changeItemConfigs"],
+  data() {
+    return {
+      reloadComponent: {},
+      oldItemConfigs: {},
+      layout: [],
+      // 设计态选中态（activeComponent 由它派生），provide 给容器内网格共用
+      design: createDesignState(),
+      // 'auto' 行高 / 间距（旧 autoHeight）的换算基准：document.body 高度
+      bodyHeight: 0,
+      // 画布可视高度：根网格按它撑满画布，指针移到空白处才不会触发库的「离开网格」
+      canvasHeight: 0
+    };
+  },
+  computed: {
+    getCompConfigs() {
+      return (component) => {
+        const { configs = {}, id, title, contentType, ...otherConfigs } = component;
+        const compId = id;
+        const itemConfig = this.itemConfigs[compId] || {};
+        const _configs = { ...otherConfigs, ...configs, ...itemConfig };
+        if (title) {
+          _configs.componentName = title;
+        }
+        return _configs;
+      };
+    },
+    componentStyle() {
+      return (component) => {
+        const componentStyle = component.style || {};
+        return componentStyle;
+      };
+    },
+    dashboardStyle() {
+      const { backgroundColor, backgroundImage } = this.globalConfigs;
+      return {
+        backgroundColor,
+        backgroundImage: backgroundImage ? `url(${this.$util.getFileUrl(backgroundImage)})` : null
+      };
+    },
+    themeChartConfig() {
+      return buildThemeChartConfig(this.themeStyles || {}, this.mobilePreview);
+    },
+    // 页面级网格参数：与运行态同一取法（旧配置的 autoHeight ⇒ rowHeight / gap 'auto'），几何才能一致
+    gridParams() {
+      return getPageGrid(this.globalConfigs);
+    },
+    // 容器项内部网格参数（与运行态 pageGridMixin.containerGrid 同源）：显式 grid 优先，旧配置用历史写死值，v3 无 grid 继承页面网格；非容器 undefined
+    containerGrid() {
+      return (component) => isContainerType(component.contentType) ? getContainerGrid(component, this.gridParams, isLegacyConfig(this.globalConfigs)) : void 0;
+    },
+    // 预览类组件（entity-list / num-statistic 的 --preview）要的 designer 契约：页面对象、组件配置，
+    // 以及按内容类型查组件记录（预览 mixin 挂载时读 widgetInfo.CONTAINER，缺了会抛错打断 Vue 调度，R24）。
+    // dragState 与拖放方法是给预览 mixin 的兜底：它对 items !== undefined 的项（外壳给每项补了 items: []，num-statistic 也算容器）
+    // 绑 HTML5 dragenter / dragover / drop 事件并读 dragState、调这些方法；看板设计器没有组件库 HTML5 拖拽，空实现即可
+    previewDesigner() {
+      const noop = () => {
+      };
+      return {
+        page: { metaId: this.pageMetaId },
+        widgetConfig: this.itemConfigs,
+        getWidgetByType: (code) => this.allComponentList.find((item) => item.CODE === code) || null,
+        dragState: {},
+        setDragOverTarget: noop,
+        setDragOverTargetElement: noop,
+        setPreviewDragTarget: noop,
+        clearDragOverTarget: noop,
+        clearDragInsertLine: noop,
+        clearPreviewDragTarget: noop,
+        handleDrop: noop
+      };
+    },
+    // 行高 / 间距按视口等比（旧 autoHeight 或 v3 显式 'auto'）时才需要随窗口维护 bodyHeight
+    autoGrid() {
+      return this.gridParams.rowHeight === "auto" || this.gridParams.padding === "auto";
+    },
+    activeComponent() {
+      return this.design.state.activeItem;
+    }
+  },
+  watch: {
+    componentList: {
+      handler(v) {
+        this.layout = [...v];
+      },
+      immediate: true
+    },
+    itemConfigs: {
+      handler(v) {
+        for (const key in this.itemConfigs) {
+          const compConfig = this.itemConfigs[key] || {};
+          const oldCompConfig = this.oldItemConfigs[key] || {};
+          if (!this.$_.isEqual(compConfig, oldCompConfig)) {
+            const findItem = (key2, arr = this.componentList) => {
+              for (const item2 of arr) {
+                if (item2.id === key2) {
+                  return item2;
+                } else if (item2.children) {
+                  const childItem = findItem(key2, item2.children);
+                  if (childItem) return childItem;
+                }
+              }
+            };
+            const item = findItem(key) || {};
+            if (item.contentType !== "report-chart" && item.contentType !== "chart" || compConfig.id !== oldCompConfig.id) {
+              this.reloadComponent[key] = true;
+              this.$nextTick(() => {
+                this.reloadComponent[key] = false;
+              });
+            }
+          }
+        }
+        this.oldItemConfigs = this.$_.cloneDeep(this.itemConfigs);
+      },
+      deep: true
+    },
+    theme() {
+    },
+    layout: {
+      // Vue3 起浅层 watcher 不响应 push/splice，而设计器新增 / 删除组件走的正是 push/splice
+      deep: 1,
+      handler(v) {
+        for (const item of v) {
+          if (!item) continue;
+          normalizeGridItem(item);
+        }
+      },
+      immediate: true
+    },
+    autoGrid: {
+      handler(v) {
+        if (v) {
+          this.calculateHeight();
+          window.addEventListener("resize", this.calculateHeight);
+        } else {
+          window.removeEventListener("resize", this.calculateHeight);
+        }
+      },
+      immediate: true
+    },
+    themeStyles: {
+      handler(v) {
+        if (v) {
+          const styles = buildThemeCss(v, `.epx-dashboard-${this.pageId}`, (path) => this.$util.getFileUrl(path), { containerSelector: "", hoverAncestor: ".drag-component", mobilePreview: true });
+          let styleElement = document.head.querySelector(`#dashboard-${this.pageId}`);
+          if (!styleElement) {
+            styleElement = document.createElement("style");
+            styleElement.id = `dashboard-${this.pageId}`;
+            styleElement.type = "text/css";
+            styleElement.textContent = styles;
+            document.head.appendChild(styleElement);
+          } else {
+            styleElement.textContent = styles;
+          }
+        }
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.measureCanvas();
+    if (typeof ResizeObserver !== "undefined") {
+      this.canvasObserver = new ResizeObserver(() => this.measureCanvas());
+      this.canvasObserver.observe(this.$refs.dashboard);
+    }
+  },
+  beforeUnmount() {
+    window.removeEventListener("resize", this.calculateHeight);
+    if (this.canvasObserver) this.canvasObserver.disconnect();
+  },
+  methods: {
+    // upPage 契约：设计器内组件 $refeshPage() / 外壳 $refesh() 会调到这里；画布由网格引擎维护，无需刷新
+    $refesh() {
+    },
+    // 库改了坐标（拖拽 / 缩放 / 推挤 / 首次对账）：画布已就地写回 item.x/y/w/h，只需通知外壳保存
+    onLayoutChange() {
+      this.$emit("change-items", this.layout);
+    },
+    // 跨网格搬出（项被拖进容器）：源侧必须同步移出数据，否则下一次同步会把壳重新加回来
+    onTransferOut(item) {
+      this.deleteComponent(item, false);
+    },
+    // 跨网格搬入（容器内项拖回页面）：画布已按本网格换算过 w/h
+    onTransferIn(item) {
+      this.layout.push(item);
+      this.$emit("change-items", this.layout);
+    },
+    openConfig(...props) {
+      this.$emit("open-config", ...props);
+    },
+    openConfigPanel(component) {
+      this.design.select(component, "page");
+    },
+    setChartConfig(v) {
+      const that = this;
+      const id = that.activeComponent.id;
+      const before = that.getCompConfigs(that.activeComponent, id);
+      const reload = chartConfigRequiresReload(before, v, that.$_.isEqual);
+      that.changeItemConfigs(id, that.$_.cloneDeep(v), null, "cover");
+      if (reload) {
+        that.reloadComponent[id] = true;
+        that.$nextTick(() => {
+          that.reloadComponent[id] = false;
+        });
+      }
+      that.$forceUpdate();
+    },
+    editComponent() {
+      const componentInfo = this.allComponentList.find((item) => item.CODE === this.activeComponent.contentType) || { CODE: this.activeComponent.contentType };
+      const configs = this.getCompConfigs(this.activeComponent, this.activeComponent.id);
+      if (componentInfo.CODE === "chart") {
+        this.$createPage({
+          metaId: "FM_REPORT_BASE",
+          openType: "2",
+          defaultFullscreen: true,
+          withHeader: false,
+          component: "chart-design",
+          chartConfigs: configs,
+          setChartConfig: this.setChartConfig.bind(this)
+        });
+      } else {
+        this.$emit("open-config", this.activeComponent.id, componentInfo, configs);
+      }
+    },
+    designReport() {
+      const configs = this.getCompConfigs(this.activeComponent, this.activeComponent.id);
+      this.goPage({
+        openMode: "2",
+        component: "report-design",
+        params: {
+          defaultFullscreen: true,
+          withHeader: false,
+          id: configs.id,
+          callback: () => {
+            this.reloadComponent[this.activeComponent.id] = true;
+            this.$nextTick(() => {
+              this.reloadComponent[this.activeComponent.id] = false;
+            });
+          }
+        }
+      });
+    },
+    designForm() {
+      const configs = this.getCompConfigs(this.activeComponent, this.activeComponent.id);
+      if (configs.id) {
+        this.$http.get({
+          entityId: "FM_FORM",
+          id: configs.id
+        }).then((data) => {
+          this.goPage({
+            component: data.data.TYPE === "excelReport" ? "excel-design" : "form-design",
+            metaId: "FM_FORM",
+            params: {
+              id: configs.id,
+              callback: () => {
+                this.reloadComponent[this.activeComponent.id] = true;
+                this.$nextTick(() => {
+                  this.reloadComponent[this.activeComponent.id] = false;
+                });
+              }
+            }
+          });
+        });
+      }
+    },
+    copyReport() {
+      this.$prompt("请输入报表名称", "复制报表", {
+        confirmButtonText: this.$t("confirm"),
+        cancelButtonText: this.$t("cancel"),
+        inputPattern: /.+/,
+        inputErrorMessage: "请输入报表名称"
+      }).then(({ value }) => {
+        const configs = this.getCompConfigs(this.activeComponent, this.activeComponent.id);
+        this.$http.get({
+          entityId: "FM_REPORT_BASE",
+          id: configs.id
+        }).then((oldData) => {
+          const form = {};
+          for (const key in oldData.data) {
+            if (!key.includes("#")) form["bean." + key] = oldData.data[key];
+          }
+          this.$http.save({
+            action: "copy",
+            entityId: "FM_REPORT_BASE",
+            oldRecordId: configs.id,
+            ...form,
+            "bean.NAME": value,
+            "bean.ID": ""
+          }).then((data) => {
+            this.$emit("add-report-to-dashboard", data, { w: this.activeComponent.w, h: this.activeComponent.h });
+            this.$message.success("复制成功");
+          }).catch((err) => {
+            this.$message.error(err.message);
+          });
+        }).catch((err) => {
+          this.$message.error(err.message);
+        });
+      });
+    },
+    copyComponent(item) {
+      const configs = this.getCompConfigs(item, item.id);
+      const newItem = {
+        CODE: item.contentType,
+        TITLE: item.title,
+        ...item
+      };
+      this.$emit("add-component-to-dashboard", newItem, configs);
+    },
+    deleteComponent(component, deleteConfig) {
+      const activeComponent = component || this.activeComponent;
+      const index = this.layout.findIndex((item) => item.id === activeComponent.id);
+      if (activeComponent.contentType === "report-chat") {
+        const configs = this.getCompConfigs(activeComponent, activeComponent.id);
+        this.$http.removeMulti({
+          entityId: "FM_REPORT_BASE",
+          ids: configs.id
+        });
+      }
+      if (index !== -1) {
+        this.layout.splice(index, 1);
+        this.$emit("change-items", this.layout);
+        if (deleteConfig) this.$emit("delete-configs", activeComponent.id);
+        if (this.design.isActive(activeComponent)) this.design.clear();
+      }
+    },
+    deleteReport(command) {
+      const activeComponent = this.activeComponent;
+      const index = this.layout.findIndex((item) => item.id === activeComponent.id);
+      if (index !== -1) {
+        this.layout.splice(index, 1);
+        this.$emit("change-items", this.layout);
+        this.$emit("delete-configs", activeComponent.id);
+      }
+      if (command === "all") {
+        const configs = this.getCompConfigs(activeComponent, activeComponent.id);
+        this.$http.removeMulti({
+          entityId: "FM_REPORT_BASE",
+          ids: configs.id
+        });
+      }
+      this.design.clear();
+    },
+    changeSubItems(item, v) {
+      const index = this.layout.findIndex((layoutItem) => layoutItem.id === item.id);
+      if (index !== -1) this.layout.splice(index, 1, { ...this.layout[index], items: v });
+      this.$emit("change-items", this.layout);
+    },
+    calculateHeight() {
+      this.bodyHeight = document.body.offsetHeight;
+    },
+    measureCanvas() {
+      if (this.$refs.dashboard) this.canvasHeight = this.$refs.dashboard.clientHeight;
+    }
+  }
+};
+const _hoisted_1 = {
+  key: 0,
+  class: "drag-component"
+};
+const _hoisted_2 = { key: 1 };
+const _hoisted_3 = ["onClick"];
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = ["onClick"];
+const _hoisted_7 = ["onClick"];
+const _hoisted_8 = ["onClick"];
+const _hoisted_9 = {
+  key: 1,
+  class: "null-component"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_epx_component = resolveComponent("epx-component");
+  const _component_el_dropdown_item = resolveComponent("el-dropdown-item");
+  const _component_el_dropdown_menu = resolveComponent("el-dropdown-menu");
+  const _component_el_dropdown = resolveComponent("el-dropdown");
+  const _component_epx_dashboard_design_item = resolveComponent("epx-dashboard-design-item");
+  const _component_epx_dashboard_design_grid = resolveComponent("epx-dashboard-design-grid");
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(["epx-dashboard", "epx-dashboard-" + $props.pageId, "dashboard-design", "dashboard-design--" + $props.theme, { "is-mobile-preview": $props.mobilePreview }]),
+    style: normalizeStyle($options.dashboardStyle),
+    ref: "dashboard"
+  }, [
+    $data.layout.length > 0 ? (openBlock(), createBlock(_component_epx_dashboard_design_grid, {
+      key: 0,
+      ref: "designGrid",
+      items: $data.layout,
+      grid: $options.gridParams,
+      "body-height": $data.bodyHeight,
+      "min-height": $data.canvasHeight,
+      "show-grid-lines": !!$props.globalConfigs.showGridLines,
+      onChange: $options.onLayoutChange,
+      onTransferOut: $options.onTransferOut,
+      onTransferIn: $options.onTransferIn
+    }, {
+      item: withCtx(({ item }) => [
+        createVNode(_component_epx_dashboard_design_item, {
+          item,
+          active: $data.design.isActive(item),
+          floatable: $options.gridParams.mode !== "float",
+          onSelect: $options.openConfigPanel
+        }, {
+          operates: withCtx(() => [
+            item.contentType === "report-chart" ? (openBlock(), createElementBlock("i", {
+              key: 0,
+              class: "component-operate__item el-icon-edit-outline",
+              onClick: ($event) => {
+                $options.openConfigPanel(item);
+                $options.designReport();
+              }
+            }, null, 8, _hoisted_3)) : createCommentVNode("", true),
+            item.contentType === "report-html" ? (openBlock(), createElementBlock("i", {
+              key: 1,
+              class: "component-operate__item el-icon-edit-outline",
+              onClick: ($event) => {
+                $options.openConfigPanel(item);
+                $options.designForm();
+              }
+            }, null, 8, _hoisted_4)) : createCommentVNode("", true),
+            createElementVNode("i", {
+              class: "component-operate__item el-icon-setting",
+              onClick: ($event) => {
+                $options.openConfigPanel(item);
+                $options.editComponent();
+              }
+            }, null, 8, _hoisted_5),
+            item.contentType === "report-chart" ? (openBlock(), createElementBlock("i", {
+              key: 2,
+              class: "component-operate__item el-icon-copy-document",
+              onClick: ($event) => {
+                $options.openConfigPanel(item);
+                $options.copyReport();
+              }
+            }, null, 8, _hoisted_6)) : (openBlock(), createElementBlock("i", {
+              key: 3,
+              class: "component-operate__item el-icon-copy-document",
+              onClick: ($event) => $options.copyComponent(item)
+            }, null, 8, _hoisted_7)),
+            item.contentType === "report-chart" ? (openBlock(), createBlock(_component_el_dropdown, {
+              key: 4,
+              class: "componnet-dropdown",
+              onCommand: (command) => {
+                $options.openConfigPanel(item);
+                $options.deleteReport(command);
+              }
+            }, {
+              dropdown: withCtx(() => [
+                createVNode(_component_el_dropdown_menu, null, {
+                  default: withCtx(() => [
+                    createVNode(_component_el_dropdown_item, { command: "only" }, {
+                      default: withCtx(() => [..._cache[2] || (_cache[2] = [
+                        createTextVNode("仅从仪表盘中删除", -1)
+                      ])]),
+                      _: 1
+                    }),
+                    createVNode(_component_el_dropdown_item, { command: "all" }, {
+                      default: withCtx(() => [..._cache[3] || (_cache[3] = [
+                        createTextVNode("从仪表盘和报表库中删除", -1)
+                      ])]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              default: withCtx(() => [
+                _cache[4] || (_cache[4] = createElementVNode("i", { class: "component-operate__item el-icon-delete" }, null, -1))
+              ]),
+              _: 1
+            }, 8, ["onCommand"])) : (openBlock(), createElementBlock("i", {
+              key: 5,
+              class: "component-operate__item el-icon-delete",
+              onClick: ($event) => $options.deleteComponent(item, true)
+            }, null, 8, _hoisted_8))
+          ]),
+          default: withCtx(() => [
+            item.contentType && !$data.reloadComponent[item.id] ? (openBlock(), createElementBlock("div", _hoisted_1, [
+              item.contentType === "entity-list" || item.contentType === "num-statistic" ? (openBlock(), createBlock(_component_epx_component, {
+                key: 0,
+                class: "epx-dashboard__component",
+                name: `${item.contentType}--preview`,
+                ref: `component_${item.i}`,
+                widget: item,
+                designer: $options.previewDesigner,
+                "component-style": $options.componentStyle(item),
+                "is-dashboard": "",
+                "design-mode": "",
+                theme: $props.theme
+              }, null, 8, ["name", "widget", "designer", "component-style", "theme"])) : (openBlock(), createBlock(_component_epx_component, {
+                class: "epx-dashboard__component",
+                name: item.contentType,
+                ref: `component_${item.i}`,
+                items: item.items,
+                itemConfigs: $props.itemConfigs,
+                "is-dashboard": "",
+                "design-mode": "",
+                key: item.id,
+                "dashboard-id": $props.upCompId,
+                "comp-id": $props.upCompId ? $props.upCompId + "-" + item.id : item.id,
+                "comp-item": item,
+                "comp-title": item.title,
+                "comp-style": $options.componentStyle(item),
+                "comp-configs": $options.getCompConfigs(item, item.id),
+                theme: $props.theme,
+                mode: "design",
+                "comp-grid": $options.containerGrid(item),
+                allComponentList: $props.allComponentList,
+                themeChartConfig: $options.themeChartConfig,
+                onChangeItems: (v) => $options.changeSubItems(item, v),
+                onOpenConfig: $options.openConfig
+              }, null, 8, ["name", "items", "itemConfigs", "dashboard-id", "comp-id", "comp-item", "comp-title", "comp-style", "comp-configs", "theme", "comp-grid", "allComponentList", "themeChartConfig", "onChangeItems", "onOpenConfig"]))
+            ])) : (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(item.id), 1))
+          ]),
+          _: 2
+        }, 1032, ["item", "active", "floatable", "onSelect"])
+      ]),
+      _: 1
+    }, 8, ["items", "grid", "body-height", "min-height", "show-grid-lines", "onChange", "onTransferOut", "onTransferIn"])) : (openBlock(), createElementBlock("div", _hoisted_9, [
+      createElementVNode("div", {
+        class: "add-component-btn",
+        onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("add-report"))
+      }, [..._cache[5] || (_cache[5] = [
+        createElementVNode("i", { class: "epx-icon-color-tianjiabaobiao" }, null, -1),
+        createElementVNode("span", null, "添加报表", -1)
+      ])]),
+      createElementVNode("div", {
+        class: "add-component-btn",
+        onClick: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("add-component"))
+      }, [..._cache[6] || (_cache[6] = [
+        createElementVNode("i", { class: "epx-icon-color-tianjiazujian" }, null, -1),
+        createElementVNode("span", null, "添加组件", -1)
+      ])])
+    ]))
+  ], 6);
+}
+const DashboardDesign = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-bab07ec8"]]);
+export {
+  DashboardDesign as default
+};

package/dist/src/visual/config-page/DashboardGlobalConfig.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./DashboardGlobalConfig.vue.js";
+/* empty css                           */
+export {
+  _sfc_main as default
+};