@kp-ui/lowcode 1.0.20 → 1.0.23

package/src/components/form-designer/toolbar-panel/index.vue.js

@@ -0,0 +1,1710 @@
+import H from "../../../../render.js";
+import P from "../../code-editor/index.vue.js";
+import { traverseAllWidgets as N, generateId as C, copyToClipboard as b, getQueryParam as A, addWindowResizeHandler as _, getLocat as E } from "../../../utils/util.js";
+import j from "../../../utils/i18n.js";
+import { generateCode as x } from "../../../utils/code-generator.js";
+import { F as M } from "../../../../node_modules/.pnpm/file-saver@2.0.5/node_modules/file-saver/dist/FileSaver.min.js";
+import O from "axios";
+import R from "../../svg-icon/index.vue.js";
+import { fmtHttpParams as V } from "../../../utils/request/fmtHttpParams.js";
+import { cloneDeep as w } from "lodash-es";
+import { resolveComponent as p, createElementBlock as T, openBlock as f, createElementVNode as m, createVNode as i, createBlock as h, createCommentVNode as y, withCtx as n, normalizeStyle as J, createTextVNode as u, toDisplayString as c, Fragment as z, renderList as U, renderSlot as q, normalizeClass as K } from "vue";
+/* empty css           */
+import Q from "../../../../_virtual/_plugin-vue_export-helper.js";
+const G = {
+  name: "ToolbarPanel",
+  mixins: [j],
+  components: {
+    VFormRender: H,
+    CodeEditor: P,
+    // Clipboard,
+    SvgIcon: R
+  },
+  props: {
+    leftWidth: Number,
+    rightWidth: Number,
+    changeRightWidth: Function,
+    changeLeftWidth: Function,
+    designer: Object,
+    saveJsonApi: Function,
+    globalDsv: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  inject: ["getDesignerConfig"],
+  data() {
+    return {
+      cloneDeep: w,
+      vfCtx: { type: "add", ...E() },
+      designerConfig: this.getDesignerConfig(),
+      toolbarWidth: 460,
+      showPreviewDialogFlag: !1,
+      showImportJsonDialogFlag: !1,
+      showExportJsonDialogFlag: !1,
+      showExportCodeDialogFlag: !1,
+      showFormDataDialogFlag: !1,
+      showExportSFCDialogFlag: !1,
+      showNodeTreeDrawerFlag: !1,
+      nodeTreeData: [],
+      importTemplate: "",
+      jsonContent: "",
+      jsonRawContent: "",
+      formDataJson: "",
+      formDataRawJson: "",
+      vueCode: "",
+      htmlCode: "",
+      sfcCode: "",
+      sfcCodeV3: "",
+      activeCodeTab: "vue",
+      activeSFCTab: "vue2",
+      testFormData: {
+        // 'userName': '666888',
+        // 'productItems': [
+        //   {'pName': 'iPhone12', 'pNum': 10},
+        //   {'pName': 'P50', 'pNum': 16},
+        // ]
+        select62173: 2
+      },
+      testOptionData: {
+        select62173: [
+          { label: "01", value: 1 },
+          { label: "22", value: 2 },
+          { label: "333", value: 3 }
+        ],
+        select001: [
+          { label: "辣椒", value: 1 },
+          { label: "菠萝", value: 2 },
+          { label: "丑橘子", value: 3 }
+        ]
+      }
+    };
+  },
+  computed: {
+    formJson() {
+      return {
+        // widgetList: this.designer.widgetList,
+        // formConfig: this.designer.formConfig
+        widgetList: w(this.designer.widgetList),
+        formConfig: w(this.designer.formConfig)
+      };
+    },
+    undoDisabled() {
+      return !this.designer.undoEnabled();
+    },
+    redoDisabled() {
+      return !this.designer.redoEnabled();
+    },
+    layoutType() {
+      return this.designer.getLayoutType();
+    },
+    designerDsv() {
+      return this.globalDsv;
+    }
+  },
+  watch: {
+    "designer.widgetList": {
+      deep: !0,
+      handler(e) {
+      }
+    }
+  },
+  mounted() {
+    const e = this.designerConfig.toolbarMaxWidth || 460, t = this.designerConfig.toolbarMinWidth || 300, s = window.innerWidth - 260 - 300 - 320 - 80;
+    this.toolbarWidth = s >= e ? e : s <= t ? t : s, _(() => {
+      this.$nextTick(() => {
+        const d = window.innerWidth - 260 - 300 - 320 - 80;
+        this.toolbarWidth = d >= e ? e : d <= t ? t : d;
+      });
+    });
+  },
+  methods: {
+    saveJson() {
+      this.saveJsonApi && this.saveJsonApi(this.formJson);
+    },
+    setReadMode() {
+      this.$refs.preForm.setFormData({
+        fileupload26481: [
+          {
+            // fileCode: '88927836217345',
+            // fileSavePath: 'file/',
+            // fileSaveName: '88927836217345.xlsx',
+            // fileName: '备料清单导入模板.xlsx',
+            // fileType: '.xlsx',
+            // fileSize: 11239,
+            // name: '备料清单导入模板.xlsx',
+            // uid: '__AUTO__1717584897101_0__',
+            fileCode: "89046755221505",
+            fileName: "首页-透明工厂.png",
+            guidebookId: 89046782484481,
+            id: 89046782484482
+          }
+        ]
+      });
+    },
+    showToolButton(e) {
+      return this.designerConfig[e] === void 0 ? !0 : !!this.designerConfig[e];
+    },
+    buildTreeNodeOfWidget(e, t) {
+      const s = {
+        id: e.id,
+        label: e.options.label || e.type
+        //selectable: true,
+      };
+      t.push(s), e.category !== void 0 && (s.children = [], e.type === "grid" ? e.cols.map((d) => {
+        const o = {
+          id: d.id,
+          label: d.options.name || e.type,
+          children: []
+        };
+        s.children.push(o), d.widgetList.map((l) => {
+          this.buildTreeNodeOfWidget(l, o.children);
+        });
+      }) : e.type === "table" ? e.rows.map((d) => {
+        const o = {
+          id: d.id,
+          label: "table-row",
+          selectable: !1,
+          children: []
+        };
+        s.children.push(o), d.cols.map((l) => {
+          if (l.merged)
+            return;
+          const g = o.children, a = {
+            id: l.id,
+            label: "table-cell",
+            children: []
+          };
+          g.push(a), l.widgetList.map((D) => {
+            this.buildTreeNodeOfWidget(D, a.children);
+          });
+        });
+      }) : e.type === "tab" ? e.tabs.map((d) => {
+        const o = {
+          id: d.id,
+          label: d.options.name || e.type,
+          selectable: !1,
+          children: []
+        };
+        s.children.push(o), d.widgetList.map((l) => {
+          this.buildTreeNodeOfWidget(l, o.children);
+        });
+      }) : e.type === "sub-form" ? e.widgetList.map((d) => {
+        this.buildTreeNodeOfWidget(d, s.children);
+      }) : e.category === "container" && e.widgetList.map((d) => {
+        this.buildTreeNodeOfWidget(d, s.children);
+      }));
+    },
+    refreshNodeTree() {
+      this.nodeTreeData.length = 0, this.designer.widgetList.forEach((e) => {
+        this.buildTreeNodeOfWidget(e, this.nodeTreeData);
+      });
+    },
+    showNodeTreeDrawer() {
+      this.refreshNodeTree(), this.showNodeTreeDrawerFlag = !0, this.$nextTick(() => {
+        this.designer.selectedId;
+      });
+    },
+    undoHistory() {
+      this.designer.undoHistoryStep();
+    },
+    redoHistory() {
+      this.designer.redoHistoryStep();
+    },
+    changeLayoutType(e) {
+      this.designer.changeLayoutType(e);
+    },
+    clearFormWidget() {
+      this.designer.clearDesigner(), this.designer.formWidget.clearWidgetRefList(), this.$message.success("ok");
+    },
+    previewForm() {
+      this.showPreviewDialogFlag = !0;
+    },
+    saveAsFile(e, t) {
+      const s = "json.json";
+      if (A("vscode") == 1) {
+        this.vsSaveFile(s, e);
+        return;
+      }
+      const d = new Blob([e], { type: "text/plain;charset=utf-8" });
+      M.saveAs(d, s);
+    },
+    vsSaveFile(e, t) {
+      const s = {
+        cmd: "writeFile",
+        data: {
+          fileName: e,
+          code: t
+        }
+      };
+      window.parent.postMessage(s, "*");
+    },
+    importJson() {
+      this.importTemplate = JSON.stringify(this.designer.getImportTemplate(), null, "  "), this.showImportJsonDialogFlag = !0;
+    },
+    doJsonImport() {
+      try {
+        const e = JSON.parse(this.importTemplate);
+        if (!e || !e.formConfig)
+          throw new Error(this.i18nt("designer.hint.invalidJsonFormat"));
+        this.designer.loadFormJson(e), this.showImportJsonDialogFlag = !1, this.$message.success(this.i18nt("designer.hint.importJsonSuccess")), this.designer.emitHistoryChange(), this.designer.emitEvent("form-json-imported", []);
+      } catch (e) {
+        this.$message.error(e + "");
+      }
+    },
+    exportJson() {
+      const e = w(this.designer.widgetList), t = w(this.designer.formConfig);
+      this.jsonContent = JSON.stringify({ widgetList: e, formConfig: t }, null, "  "), this.jsonRawContent = JSON.stringify({ widgetList: e, formConfig: t }), this.showExportJsonDialogFlag = !0;
+    },
+    copyFormJson(e) {
+      b(
+        this.jsonRawContent,
+        e,
+        this.$message,
+        this.i18nt("designer.hint.copyJsonSuccess"),
+        this.i18nt("designer.hint.copyJsonFail")
+      );
+    },
+    saveFormJson() {
+      this.saveAsFile(this.jsonContent, `vform${C()}.json`);
+    },
+    exportCode() {
+      this.vueCode = x(this.formJson), this.htmlCode = x(this.formJson, "html"), this.showExportCodeDialogFlag = !0;
+    },
+    copyVueCode(e) {
+      b(
+        this.vueCode,
+        e,
+        this.$message,
+        this.i18nt("designer.hint.copyVueCodeSuccess"),
+        this.i18nt("designer.hint.copyVueCodeFail")
+      );
+    },
+    copyHtmlCode(e) {
+      b(
+        this.htmlCode,
+        e,
+        this.$message,
+        this.i18nt("designer.hint.copyHtmlCodeSuccess"),
+        this.i18nt("designer.hint.copyHtmlCodeFail")
+      );
+    },
+    saveVueCode() {
+      this.saveAsFile(this.vueCode, `vform${C()}.vue`);
+    },
+    saveHtmlCode() {
+      this.saveAsFile(this.htmlCode, `vform${C()}.html`);
+    },
+    generateSFC() {
+    },
+    copyV2SFC(e) {
+      b(
+        this.sfcCode,
+        e,
+        this.$message,
+        this.i18nt("designer.hint.copySFCSuccess"),
+        this.i18nt("designer.hint.copySFCFail")
+      );
+    },
+    copyV3SFC(e) {
+      b(
+        this.sfcCodeV3,
+        e,
+        this.$message,
+        this.i18nt("designer.hint.copySFCSuccess"),
+        this.i18nt("designer.hint.copySFCFail")
+      );
+    },
+    saveV2SFC() {
+      this.saveAsFile(this.sfcCode, `vformV2-${C()}.vue`);
+    },
+    saveV3SFC() {
+      this.saveAsFile(this.sfcCodeV3, `vformV3-${C()}.vue`);
+    },
+    async insertData() {
+      const e = await this.$refs.preForm.getFormData(), t = this.designer.formConfig, s = await V.call(this, t.serveList.vformUpdate, e);
+      console.log("res: insertData", s);
+    },
+    async showData(e) {
+      const t = this.designer.formConfig, s = await V(t.serveList.vformDetail, { _id: e }), d = [{ date: "2024-10-28" }, { date: "2024-10-29" }, { date: "2024-10-20" }];
+      this.$refs.preForm.getWidgetRef("leaveDates").setValue(d), this.$refs.preForm.setFormData({
+        ...s
+      }), this.$refs.preForm.setReadMode(!0);
+    },
+    getFormData() {
+      this.$refs.preForm.getFormData().then((e) => {
+        console.log("formData: ", e), this.formDataJson = JSON.stringify(e, null, "  "), this.formDataRawJson = JSON.stringify(e), this.showFormDataDialogFlag = !0;
+      }).catch((e) => {
+        this.$message.error(e);
+      });
+    },
+    copyFormDataJson(e) {
+      b(
+        this.formDataRawJson,
+        e,
+        this.$message,
+        this.i18nt("designer.hint.copyJsonSuccess"),
+        this.i18nt("designer.hint.copyJsonFail")
+      );
+    },
+    saveFormData() {
+      this.saveAsFile(this.htmlCode, `formData${C()}.json`);
+    },
+    resetForm() {
+      this.$refs.preForm.resetForm();
+    },
+    setFormDisabled() {
+      this.$refs.preForm.disableForm();
+    },
+    setFormEnabled() {
+      this.$refs.preForm.enableForm();
+    },
+    testLoadForm() {
+      O.get("https://www.fastmock.site/mock/e9710039bb5f11262d1a0f2f0bbe08c8/vform3/getFS").then((e) => {
+        const t = e.data;
+        this.$refs.preForm.setFormJson(t), this.$nextTick(() => {
+          const s = { input30696: "668899" };
+          this.$refs.preForm.setFormData(s);
+        });
+      }).catch((e) => {
+      });
+    },
+    testSetFormJson() {
+      const e = {
+        widgetList: [
+          {
+            type: "static-text",
+            icon: "static-text",
+            formItemFlag: !1,
+            options: {
+              name: "statictext111193",
+              columnWidth: "200px",
+              hidden: !1,
+              textContent: "多列表单",
+              customClass: [],
+              onCreated: "",
+              onMounted: "",
+              label: "static-text"
+            },
+            id: "statictext111193"
+          },
+          {
+            type: "divider",
+            icon: "divider",
+            formItemFlag: !1,
+            options: {
+              name: "divider102346",
+              label: "",
+              columnWidth: "200px",
+              direction: "horizontal",
+              contentPosition: "center",
+              hidden: !1,
+              customClass: [],
+              onCreated: "",
+              onMounted: ""
+            },
+            id: "divider102346"
+          },
+          {
+            type: "grid",
+            category: "container",
+            icon: "grid",
+            cols: [
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "input",
+                    icon: "text-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "input12931",
+                      label: "发件人姓名",
+                      labelAlign: "",
+                      type: "text",
+                      defaultValue: "",
+                      placeholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      allowClear: !0,
+                      showPassword: !1,
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      minLength: null,
+                      maxLength: null,
+                      showCount: !1,
+                      addonBefore: "",
+                      addonAfter: "",
+                      appendButton: !1,
+                      appendButtonDisabled: !1,
+                      buttonIcon: "el-icon-search",
+                      onCreated: "",
+                      onMounted: "",
+                      onInput: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "input12931"
+                  }
+                ],
+                options: {
+                  name: "gridCol25469",
+                  hidden: !1,
+                  span: 12,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-25469"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "input",
+                    icon: "text-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "input23031",
+                      label: "发件人号码",
+                      labelAlign: "",
+                      type: "text",
+                      defaultValue: "",
+                      placeholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      allowClear: !0,
+                      showPassword: !1,
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      minLength: null,
+                      maxLength: null,
+                      showCount: !1,
+                      addonBefore: "",
+                      addonAfter: "",
+                      appendButton: !1,
+                      appendButtonDisabled: !1,
+                      buttonIcon: "el-icon-search",
+                      onCreated: "",
+                      onMounted: "",
+                      onInput: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "input23031"
+                  }
+                ],
+                options: {
+                  name: "gridCol25125",
+                  hidden: !1,
+                  span: 12,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-25125"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "switch",
+                    icon: "switch-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "switch96070",
+                      label: "是否保密",
+                      labelAlign: "",
+                      defaultValue: !0,
+                      columnWidth: "200px",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      switchWidth: 40,
+                      checkedValue: "",
+                      unCheckedValue: "",
+                      activeColor: null,
+                      inactiveColor: null,
+                      onCreated: "",
+                      onMounted: "",
+                      onChange: "",
+                      onValidate: ""
+                    },
+                    id: "switch96070"
+                  }
+                ],
+                options: {
+                  name: "gridCol44470",
+                  hidden: !1,
+                  span: 24,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-44470"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "textarea",
+                    icon: "textarea-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "textarea21654",
+                      label: "发件人地址",
+                      labelAlign: "",
+                      rows: 3,
+                      defaultValue: "",
+                      placeholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      minLength: null,
+                      maxLength: null,
+                      showCount: !1,
+                      onCreated: "",
+                      onMounted: "",
+                      onInput: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "textarea21654"
+                  }
+                ],
+                options: {
+                  name: "gridCol98223",
+                  hidden: !1,
+                  span: 24,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-98223"
+              }
+            ],
+            options: { name: "grid35834", hidden: !1, gutter: 12, customClass: [] },
+            id: "grid35834"
+          },
+          {
+            type: "divider",
+            icon: "divider",
+            formItemFlag: !1,
+            options: {
+              name: "divider69240",
+              label: "",
+              columnWidth: "200px",
+              direction: "horizontal",
+              contentPosition: "center",
+              hidden: !1,
+              customClass: [],
+              onCreated: "",
+              onMounted: ""
+            },
+            id: "divider69240"
+          },
+          {
+            type: "grid",
+            category: "container",
+            icon: "grid",
+            cols: [
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "input",
+                    icon: "text-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "input113152",
+                      label: "收件人姓名111",
+                      labelAlign: "",
+                      type: "text",
+                      defaultValue: "",
+                      placeholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      allowClear: !0,
+                      showPassword: !1,
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      minLength: null,
+                      maxLength: null,
+                      showCount: !1,
+                      addonBefore: "",
+                      addonAfter: "",
+                      appendButton: !1,
+                      appendButtonDisabled: !1,
+                      buttonIcon: "el-icon-search",
+                      onCreated: "",
+                      onMounted: "",
+                      onInput: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "input113152"
+                  }
+                ],
+                options: {
+                  name: "gridCol47242",
+                  hidden: !1,
+                  span: 12,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-47242"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "input",
+                    icon: "text-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "input40240",
+                      label: "收件人号码",
+                      labelAlign: "",
+                      type: "text",
+                      defaultValue: "",
+                      placeholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      allowClear: !0,
+                      showPassword: !1,
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      minLength: null,
+                      maxLength: null,
+                      showCount: !1,
+                      addonBefore: "",
+                      addonAfter: "",
+                      appendButton: !1,
+                      appendButtonDisabled: !1,
+                      buttonIcon: "el-icon-search",
+                      onCreated: "",
+                      onMounted: "",
+                      onInput: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "input40240"
+                  }
+                ],
+                options: {
+                  name: "gridCol27970",
+                  hidden: !1,
+                  span: 12,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-27970"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "checkbox",
+                    icon: "checkbox-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "checkbox63174",
+                      label: "接收时间段",
+                      labelAlign: "",
+                      defaultValue: [],
+                      columnWidth: "200px",
+                      size: "",
+                      displayStyle: "inline",
+                      buttonStyle: !1,
+                      border: !1,
+                      labelWidth: null,
+                      labelHidden: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      optionItems: [
+                        { label: "上午9:00 - 11:30", value: 1 },
+                        { label: "下午12:30 - 18:00", value: 2 },
+                        { label: "晚上18:00 - 21:00", value: 3 }
+                      ],
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      onCreated: "",
+                      onMounted: "",
+                      onChange: "",
+                      onValidate: ""
+                    },
+                    id: "checkbox63174"
+                  }
+                ],
+                options: {
+                  name: "gridCol74653",
+                  hidden: !1,
+                  span: 24,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-74653"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "input",
+                    icon: "text-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "input78584",
+                      label: "收件人地址",
+                      labelAlign: "",
+                      type: "text",
+                      defaultValue: "",
+                      placeholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      allowClear: !0,
+                      showPassword: !1,
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      minLength: null,
+                      maxLength: null,
+                      showCount: !1,
+                      addonBefore: "",
+                      addonAfter: "",
+                      appendButton: !1,
+                      appendButtonDisabled: !1,
+                      buttonIcon: "el-icon-search",
+                      onCreated: "",
+                      onMounted: "",
+                      onInput: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "input78584"
+                  }
+                ],
+                options: {
+                  name: "gridCol63781",
+                  hidden: !1,
+                  span: 24,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-63781"
+              }
+            ],
+            options: { name: "grid114672", hidden: !1, gutter: 12, customClass: [] },
+            id: "grid114672"
+          },
+          {
+            type: "divider",
+            icon: "divider",
+            formItemFlag: !1,
+            options: {
+              name: "divider75887",
+              label: "",
+              columnWidth: "200px",
+              direction: "horizontal",
+              contentPosition: "center",
+              hidden: !1,
+              customClass: [],
+              onCreated: "",
+              onMounted: ""
+            },
+            id: "divider75887"
+          },
+          {
+            type: "grid",
+            category: "container",
+            icon: "grid",
+            cols: [
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "time-range",
+                    icon: "time-range-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "timerange47503",
+                      label: "送货时间",
+                      labelAlign: "",
+                      defaultValue: null,
+                      startPlaceholder: "",
+                      endPlaceholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      allowClear: !0,
+                      editable: !1,
+                      format: "HH:mm:ss",
+                      required: !0,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      onCreated: "",
+                      onMounted: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "timerange47503"
+                  }
+                ],
+                options: {
+                  name: "gridCol109912",
+                  hidden: !1,
+                  span: 24,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-109912"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "slider",
+                    icon: "slider-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "slider54714",
+                      label: "价格保护",
+                      labelAlign: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      required: !1,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      min: 0,
+                      max: 100,
+                      step: 10,
+                      range: !1,
+                      height: null,
+                      onCreated: "",
+                      onMounted: "",
+                      onChange: "",
+                      onValidate: ""
+                      // showStops: true
+                    },
+                    id: "slider54714"
+                  }
+                ],
+                options: {
+                  name: "gridCol114653",
+                  hidden: !1,
+                  span: 24,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-114653"
+              },
+              {
+                type: "grid-col",
+                category: "container",
+                icon: "grid-col",
+                internal: !0,
+                widgetList: [
+                  {
+                    type: "textarea",
+                    icon: "textarea-field",
+                    formItemFlag: !0,
+                    options: {
+                      name: "textarea64794",
+                      label: "其他信息",
+                      labelAlign: "",
+                      rows: 3,
+                      defaultValue: "",
+                      placeholder: "",
+                      columnWidth: "200px",
+                      size: "",
+                      labelWidth: null,
+                      labelHidden: !1,
+                      readonly: !1,
+                      disabled: !1,
+                      hidden: !1,
+                      required: !1,
+                      validation: "",
+                      validationHint: "",
+                      customClass: [],
+                      labelIconClass: null,
+                      labelIconPosition: "rear",
+                      labelTooltip: null,
+                      minLength: null,
+                      maxLength: null,
+                      showCount: !1,
+                      onCreated: "",
+                      onMounted: "",
+                      onInput: "",
+                      onChange: "",
+                      onFocus: "",
+                      onBlur: "",
+                      onValidate: ""
+                    },
+                    id: "textarea64794"
+                  }
+                ],
+                options: {
+                  name: "gridCol80867",
+                  hidden: !1,
+                  span: 24,
+                  offset: 0,
+                  push: 0,
+                  pull: 0,
+                  responsive: !1,
+                  md: 12,
+                  sm: 12,
+                  xs: 12,
+                  customClass: []
+                },
+                id: "grid-col-80867"
+              }
+            ],
+            options: { name: "grid28709", hidden: !1, gutter: 12, customClass: [] },
+            id: "grid28709"
+          }
+        ],
+        formConfig: {
+          labelWidth: 150,
+          labelPosition: "horizontal",
+          size: "",
+          labelAlign: "label-right-align",
+          cssCode: "",
+          customClass: [],
+          functions: "",
+          onFormCreated: "",
+          onFormDataChange: "",
+          onFormValidate: ""
+        }
+      };
+      this.$refs.preForm.setFormJson(e), this.$nextTick(() => {
+        this.$refs.preForm.setFormData({
+          input12931: "asdf",
+          input23031: "input23031",
+          textarea21654: "textarea21654",
+          input113152: "input113152",
+          input40240: "input40240"
+        });
+      });
+    },
+    testSetFormData() {
+      const e = {
+        input89263: "899668"
+      };
+      this.$refs.preForm.setFormData(e);
+    },
+    testReloadOptionData() {
+      this.testOptionData.select001.push({
+        label: "aaa",
+        value: 888
+      }), this.$refs.preForm.reloadOptionData();
+    },
+    handleFormChange(e, t, s, d) {
+      console.log("formModel", d);
+    },
+    testOnAppendButtonClick(e) {
+      console.log("test", e);
+    },
+    testOnButtonClick(e) {
+      console.log("test", e);
+    },
+    onMyEmitTest(e) {
+      console.log("-----", e);
+    },
+    findWidgetById(e) {
+      let t = null;
+      return N(this.designer.widgetList, (s) => {
+        s.id === e && (t = s);
+      }), t;
+    },
+    onNodeTreeClick(e, t, s) {
+      if (e.selectable !== void 0 && !e.selectable)
+        this.$message.info(this.i18nt("designer.hint.currentNodeCannotBeSelected"));
+      else {
+        const d = e.id, o = this.findWidgetById(d);
+        o && this.designer.setSelected(o);
+      }
+    }
+  }
+}, X = { class: "toolbar-container" }, Y = { class: "left-toolbar" }, Z = { class: "right-toolbar" }, $ = { class: "right-toolbar-con" }, ee = { class: "dialog-footer" }, te = { class: "dialog-footer" }, oe = { class: "dialog-footer" }, le = { style: { border: "1px solid #dcdfe6" } }, ie = { class: "dialog-footer" }, ne = { class: "dialog-footer" };
+function se(e, t, s, d, o, l) {
+  const g = p("svg-icon"), a = p("a-button"), D = p("a-tree"), I = p("a-drawer"), W = p("VFormRender"), v = p("a-modal"), S = p("a-alert"), F = p("code-editor"), k = p("a-tab-pane"), B = p("a-tabs");
+  return f(), T("div", X, [
+    m("div", Y, [
+      i(a, {
+        type: "link",
+        onClick: t[0] || (t[0] = (r) => s.changeLeftWidth())
+      }, {
+        default: n(() => [
+          i(g, {
+            style: J(`transform:${s.leftWidth === 0 ? "rotate(180deg)" : "rotate(0deg)"}`),
+            "icon-class": "a-ipadarrow_back"
+          }, null, 8, ["style"])
+        ]),
+        _: 1
+      }),
+      i(a, {
+        type: "link",
+        disabled: l.undoDisabled,
+        title: e.i18nt("designer.toolbar.undoHint"),
+        onClick: l.undoHistory
+      }, {
+        default: n(() => [
+          i(g, { "icon-class": "undo" })
+        ]),
+        _: 1
+      }, 8, ["disabled", "title", "onClick"]),
+      i(a, {
+        type: "link",
+        disabled: l.redoDisabled,
+        title: e.i18nt("designer.toolbar.redoHint"),
+        onClick: l.redoHistory
+      }, {
+        default: n(() => [
+          i(g, { "icon-class": "redo" })
+        ]),
+        _: 1
+      }, 8, ["disabled", "title", "onClick"])
+    ]),
+    i(I, {
+      title: e.i18nt("designer.toolbar.nodeTreeTitle"),
+      direction: "ltr",
+      visible: o.showNodeTreeDrawerFlag,
+      "onUpdate:visible": t[1] || (t[1] = (r) => o.showNodeTreeDrawerFlag = r),
+      width: 280,
+      "destroy-on-close": !0,
+      class: "node-tree-drawer"
+    }, {
+      default: n(() => [
+        i(D, {
+          ref: "nodeTree",
+          treeData: o.nodeTreeData,
+          "default-expand-all": "",
+          "highlight-current": "",
+          class: "node-tree",
+          "icon-class": "el-icon-arrow-right",
+          fieldNames: { children: "children", title: "label", key: "id" }
+        }, null, 8, ["treeData"])
+      ]),
+      _: 1
+    }, 8, ["title", "visible"]),
+    m("div", Z, [
+      m("div", $, [
+        l.showToolButton("clearDesignerButton") ? (f(), h(a, {
+          key: 0,
+          type: "link",
+          onClick: l.clearFormWidget
+        }, {
+          default: n(() => [
+            i(g, { "icon-class": "el-delete" }),
+            u(c(e.i18nt("designer.toolbar.clear")), 1)
+          ]),
+          _: 1
+        }, 8, ["onClick"])) : y("", !0),
+        l.showToolButton("previewFormButton") ? (f(), h(a, {
+          key: 1,
+          type: "link",
+          onClick: l.previewForm
+        }, {
+          default: n(() => [
+            i(g, { "icon-class": "el-view" }),
+            u(c(e.i18nt("designer.toolbar.preview")), 1)
+          ]),
+          _: 1
+        }, 8, ["onClick"])) : y("", !0),
+        l.showToolButton("importJsonButton") ? (f(), h(a, {
+          key: 2,
+          type: "link",
+          onClick: l.importJson
+        }, {
+          default: n(() => [
+            u(c(e.i18nt("designer.toolbar.importJson")), 1)
+          ]),
+          _: 1
+        }, 8, ["onClick"])) : y("", !0),
+        l.showToolButton("exportJsonButton") ? (f(), h(a, {
+          key: 3,
+          type: "link",
+          onClick: l.exportJson
+        }, {
+          default: n(() => [
+            u(c(e.i18nt("designer.toolbar.exportJson")), 1)
+          ]),
+          _: 1
+        }, 8, ["onClick"])) : y("", !0),
+        l.showToolButton("exportCodeButton") ? (f(), h(a, {
+          key: 4,
+          type: "link",
+          onClick: l.saveJson
+        }, {
+          default: n(() => [
+            u(" 保存 ")
+          ]),
+          _: 1
+        }, 8, ["onClick"])) : y("", !0),
+        i(a, {
+          type: "link",
+          onClick: t[2] || (t[2] = (r) => s.changeRightWidth())
+        }, {
+          default: n(() => [
+            i(g, {
+              style: J(`transform:${s.rightWidth === 0 ? "rotate(0deg)" : "rotate(180deg)"}`),
+              "icon-class": "a-ipadarrow_back"
+            }, null, 8, ["style"])
+          ]),
+          _: 1
+        }),
+        (f(!0), T(z, null, U(e.$slots, (r, L) => q(e.$slots, L, {}, void 0, !0)), 256))
+      ])
+    ]),
+    i(v, {
+      title: e.i18nt("designer.toolbar.preview"),
+      visible: o.showPreviewDialogFlag,
+      "onUpdate:visible": t[5] || (t[5] = (r) => o.showPreviewDialogFlag = r),
+      "show-close": !0,
+      "close-on-click-modal": !1,
+      "close-on-press-escape": !1,
+      center: "",
+      "destroy-on-close": !0,
+      "append-to-body": !0,
+      class: "drag-dialog",
+      width: "75%",
+      fullscreen: l.layoutType === "H5" || l.layoutType === "Pad"
+    }, {
+      footer: n(() => [
+        m("div", ee, [
+          i(a, {
+            onClick: t[3] || (t[3] = (r) => l.showData(1))
+          }, {
+            default: n(() => [
+              u("数据回显 _id 1")
+            ]),
+            _: 1
+          }),
+          i(a, {
+            type: "primary",
+            onClick: l.getFormData
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.getFormData")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            type: "primary",
+            onClick: l.resetForm
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.resetForm")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            type: "primary",
+            onClick: l.setFormDisabled
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.disableForm")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            type: "primary",
+            onClick: l.setFormEnabled
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.enableForm")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            onClick: t[4] || (t[4] = (r) => o.showPreviewDialogFlag = !1)
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            ]),
+            _: 1
+          }),
+          (f(), h(a, {
+            key: 0,
+            onClick: l.setReadMode
+          }, {
+            default: n(() => [
+              u("测试变只读")
+            ]),
+            _: 1
+          }, 8, ["onClick"]))
+        ])
+      ]),
+      default: n(() => [
+        m("div", null, [
+          m("div", {
+            class: K(["form-render-wrapper", [l.layoutType === "H5" ? "h5-layout" : l.layoutType === "Pad" ? "pad-layout" : ""]])
+          }, [
+            i(W, {
+              vfCtx: o.vfCtx,
+              ref: "preForm",
+              "form-json": o.cloneDeep(l.formJson),
+              "form-data": o.testFormData,
+              "preview-state": !0,
+              "option-data": o.testOptionData,
+              "global-dsv": l.designerDsv,
+              onMyEmitTest: l.onMyEmitTest,
+              onAppendButtonClick: l.testOnAppendButtonClick,
+              onButtonClick: l.testOnButtonClick,
+              onFormChange: l.handleFormChange
+            }, null, 8, ["vfCtx", "form-json", "form-data", "option-data", "global-dsv", "onMyEmitTest", "onAppendButtonClick", "onButtonClick", "onFormChange"])
+          ], 2)
+        ])
+      ]),
+      _: 1
+    }, 8, ["title", "visible", "fullscreen"]),
+    i(v, {
+      title: e.i18nt("designer.toolbar.importJson"),
+      visible: o.showImportJsonDialogFlag,
+      "onUpdate:visible": t[8] || (t[8] = (r) => o.showImportJsonDialogFlag = r),
+      "show-close": !0,
+      class: "drag-dialog",
+      "append-to-body": !0,
+      center: "",
+      width: "1200px",
+      "close-on-click-modal": !1,
+      "close-on-press-escape": !1,
+      "destroy-on-close": !0
+    }, {
+      footer: n(() => [
+        m("div", te, [
+          i(a, {
+            type: "primary",
+            onClick: l.doJsonImport
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.import")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            onClick: t[7] || (t[7] = (r) => o.showImportJsonDialogFlag = !1)
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.cancel")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ]),
+      default: n(() => [
+        i(S, {
+          type: "info",
+          message: e.i18nt("designer.hint.importJsonHint"),
+          "show-icon": "",
+          class: "alert-padding"
+        }, null, 8, ["message"]),
+        i(F, {
+          mode: "json",
+          readonly: !1,
+          modelValue: o.importTemplate,
+          "onUpdate:modelValue": t[6] || (t[6] = (r) => o.importTemplate = r)
+        }, null, 8, ["modelValue"])
+      ]),
+      _: 1
+    }, 8, ["title", "visible"]),
+    i(v, {
+      title: e.i18nt("designer.toolbar.exportJson"),
+      visible: o.showExportJsonDialogFlag,
+      "onUpdate:visible": t[11] || (t[11] = (r) => o.showExportJsonDialogFlag = r),
+      "show-close": !0,
+      class: "drag-dialog",
+      center: "",
+      "append-to-body": "",
+      width: "1200px",
+      "close-on-click-modal": !1,
+      "close-on-press-escape": !1,
+      "destroy-on-close": !0
+    }, {
+      footer: n(() => [
+        m("div", oe, [
+          i(a, {
+            type: "primary",
+            class: "copy-json-btn",
+            "data-clipboard-text": o.jsonRawContent,
+            onClick: l.copyFormJson
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.copyJson")), 1)
+            ]),
+            _: 1
+          }, 8, ["data-clipboard-text", "onClick"]),
+          i(a, { onClick: l.saveFormJson }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.saveFormJson")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            onClick: t[10] || (t[10] = (r) => o.showExportJsonDialogFlag = !1)
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ]),
+      default: n(() => [
+        i(F, {
+          mode: "json",
+          readonly: !0,
+          modelValue: o.jsonContent,
+          "onUpdate:modelValue": t[9] || (t[9] = (r) => o.jsonContent = r)
+        }, null, 8, ["modelValue"])
+      ]),
+      _: 1
+    }, 8, ["title", "visible"]),
+    i(v, {
+      title: e.i18nt("designer.hint.exportFormData"),
+      visible: o.showFormDataDialogFlag,
+      "onUpdate:visible": t[14] || (t[14] = (r) => o.showFormDataDialogFlag = r),
+      "show-close": !0,
+      class: "nested-drag-dialog dialog-title-light-bg",
+      center: "",
+      "close-on-click-modal": !1,
+      "close-on-press-escape": !1,
+      "destroy-on-close": !0,
+      "append-to-body": !0
+    }, {
+      footer: n(() => [
+        m("div", ie, [
+          i(a, {
+            type: "primary",
+            class: "copy-form-data-json-btn",
+            "data-clipboard-text": o.formDataRawJson,
+            onClick: l.copyFormDataJson
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.copyFormData")), 1)
+            ]),
+            _: 1
+          }, 8, ["data-clipboard-text", "onClick"]),
+          i(a, { onClick: l.saveFormData }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.saveFormData")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            onClick: t[13] || (t[13] = (r) => o.showFormDataDialogFlag = !1)
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ]),
+      default: n(() => [
+        m("div", le, [
+          i(F, {
+            mode: "json",
+            readonly: !0,
+            modelValue: o.formDataJson,
+            "onUpdate:modelValue": t[12] || (t[12] = (r) => o.formDataJson = r)
+          }, null, 8, ["modelValue"])
+        ])
+      ]),
+      _: 1
+    }, 8, ["title", "visible"]),
+    o.showExportSFCDialogFlag ? (f(), h(v, {
+      key: 0,
+      title: e.i18nt("designer.toolbar.generateSFC"),
+      visible: o.showExportSFCDialogFlag,
+      "onUpdate:visible": t[19] || (t[19] = (r) => o.showExportSFCDialogFlag = r),
+      "append-to-body": "",
+      "show-close": !0,
+      class: "drag-dialog",
+      center: "",
+      width: "65%",
+      "close-on-click-modal": !1,
+      "close-on-press-escape": !1,
+      "destroy-on-close": !0
+    }, {
+      footer: n(() => [
+        m("div", ne, [
+          i(a, {
+            type: "primary",
+            class: "copy-vue2-sfc-btn",
+            "data-clipboard-text": o.sfcCode,
+            onClick: l.copyV2SFC
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.copyVue2SFC")), 1)
+            ]),
+            _: 1
+          }, 8, ["data-clipboard-text", "onClick"]),
+          i(a, {
+            type: "primary",
+            class: "copy-vue3-sfc-btn",
+            "data-clipboard-text": o.sfcCodeV3,
+            onClick: l.copyV3SFC
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.copyVue3SFC")), 1)
+            ]),
+            _: 1
+          }, 8, ["data-clipboard-text", "onClick"]),
+          i(a, { onClick: l.saveV2SFC }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.saveVue2SFC")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, { onClick: l.saveV3SFC }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.saveVue3SFC")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"]),
+          i(a, {
+            onClick: t[18] || (t[18] = (r) => o.showExportSFCDialogFlag = !1)
+          }, {
+            default: n(() => [
+              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ]),
+      default: n(() => [
+        i(B, {
+          type: "border-card",
+          class: "no-box-shadow no-padding",
+          activeKey: o.activeSFCTab,
+          "onUpdate:activeKey": t[17] || (t[17] = (r) => o.activeSFCTab = r)
+        }, {
+          default: n(() => [
+            i(k, {
+              tab: "Vue2",
+              key: "vue2"
+            }, {
+              default: n(() => [
+                i(F, {
+                  mode: "html",
+                  readonly: !0,
+                  modelValue: o.sfcCode,
+                  "onUpdate:modelValue": t[15] || (t[15] = (r) => o.sfcCode = r),
+                  "user-worker": !1
+                }, null, 8, ["modelValue"])
+              ]),
+              _: 1
+            }),
+            i(k, {
+              tab: "Vue3",
+              key: "vue3"
+            }, {
+              default: n(() => [
+                i(F, {
+                  mode: "html",
+                  readonly: !0,
+                  modelValue: o.sfcCodeV3,
+                  "onUpdate:modelValue": t[16] || (t[16] = (r) => o.sfcCodeV3 = r),
+                  "user-worker": !1
+                }, null, 8, ["modelValue"])
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["activeKey"])
+      ]),
+      _: 1
+    }, 8, ["title", "visible"])) : y("", !0)
+  ]);
+}
+const ve = /* @__PURE__ */ Q(G, [["render", se], ["__scopeId", "data-v-5efa2dd6"]]);
+export {
+  ve as default
+};