@kp-ui/lowcode 1.0.25 → 1.0.27

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

@@ -1,24 +1,24 @@
-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 { saveAs as M } from "file-saver";
-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";
+import VFormRender from "../../../../render.js";
+import CodeEditor from "../../code-editor/index.vue.js";
+import { traverseAllWidgets, generateId, copyToClipboard, getQueryParam, addWindowResizeHandler, getLocat } from "../../../utils/util.js";
+import i18n from "../../../utils/i18n.js";
+import { generateCode } from "../../../utils/code-generator.js";
+import { saveAs } from "file-saver";
+import axios from "axios";
+import SvgIcon from "../../svg-icon/index.vue.js";
+import { fmtHttpParams } from "../../../utils/request/fmtHttpParams.js";
+import { cloneDeep } from "lodash-es";
+import { resolveComponent, createElementBlock, openBlock, createElementVNode, createVNode, createBlock, createCommentVNode, withCtx, normalizeStyle, createTextVNode, toDisplayString, Fragment, renderList, renderSlot, normalizeClass } from "vue";
 /* empty css           */
-import Q from "../../../../_virtual/_plugin-vue_export-helper.js";
-const G = {
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
   name: "ToolbarPanel",
-  mixins: [j],
+  mixins: [i18n],
   components: {
-    VFormRender: H,
-    CodeEditor: P,
+    VFormRender,
+    CodeEditor,
     // Clipboard,
-    SvgIcon: R
+    SvgIcon
   },
   props: {
     leftWidth: Number,
@@ -35,17 +35,17 @@ const G = {
   inject: ["getDesignerConfig"],
   data() {
     return {
-      cloneDeep: w,
-      vfCtx: { type: "add", ...E() },
+      cloneDeep,
+      vfCtx: { type: "add", ...getLocat() },
       designerConfig: this.getDesignerConfig(),
       toolbarWidth: 460,
-      showPreviewDialogFlag: !1,
-      showImportJsonDialogFlag: !1,
-      showExportJsonDialogFlag: !1,
-      showExportCodeDialogFlag: !1,
-      showFormDataDialogFlag: !1,
-      showExportSFCDialogFlag: !1,
-      showNodeTreeDrawerFlag: !1,
+      showPreviewDialogFlag: false,
+      showImportJsonDialogFlag: false,
+      showExportJsonDialogFlag: false,
+      showExportCodeDialogFlag: false,
+      showFormDataDialogFlag: false,
+      showExportSFCDialogFlag: false,
+      showNodeTreeDrawerFlag: false,
       nodeTreeData: [],
       importTemplate: "",
       jsonContent: "",
@@ -85,8 +85,8 @@ const G = {
       return {
         // widgetList: this.designer.widgetList,
         // formConfig: this.designer.formConfig
-        widgetList: w(this.designer.widgetList),
-        formConfig: w(this.designer.formConfig)
+        widgetList: cloneDeep(this.designer.widgetList),
+        formConfig: cloneDeep(this.designer.formConfig)
       };
     },
     undoDisabled() {
@@ -104,23 +104,28 @@ const G = {
   },
   watch: {
     "designer.widgetList": {
-      deep: !0,
-      handler(e) {
+      deep: true,
+      handler(val) {
       }
     }
   },
   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, _(() => {
+    const maxTBWidth = this.designerConfig.toolbarMaxWidth || 460;
+    const minTBWidth = this.designerConfig.toolbarMinWidth || 300;
+    const newTBWidth = window.innerWidth - 260 - 300 - 320 - 80;
+    this.toolbarWidth = newTBWidth >= maxTBWidth ? maxTBWidth : newTBWidth <= minTBWidth ? minTBWidth : newTBWidth;
+    addWindowResizeHandler(() => {
       this.$nextTick(() => {
-        const d = window.innerWidth - 260 - 300 - 320 - 80;
-        this.toolbarWidth = d >= e ? e : d <= t ? t : d;
+        const newTBWidth2 = window.innerWidth - 260 - 300 - 320 - 80;
+        this.toolbarWidth = newTBWidth2 >= maxTBWidth ? maxTBWidth : newTBWidth2 <= minTBWidth ? minTBWidth : newTBWidth2;
       });
     });
   },
   methods: {
     saveJson() {
-      this.saveJsonApi && this.saveJsonApi(this.formJson);
+      if (this.saveJsonApi) {
+        this.saveJsonApi(this.formJson);
+      }
     },
     setReadMode() {
       this.$refs.preForm.setFormData({
@@ -142,67 +147,94 @@ const G = {
         ]
       });
     },
-    showToolButton(e) {
-      return this.designerConfig[e] === void 0 ? !0 : !!this.designerConfig[e];
+    showToolButton(configName) {
+      if (this.designerConfig[configName] === void 0) {
+        return true;
+      }
+      return !!this.designerConfig[configName];
     },
-    buildTreeNodeOfWidget(e, t) {
-      const s = {
-        id: e.id,
-        label: e.options.label || e.type
+    buildTreeNodeOfWidget(widget, treeNode) {
+      const curNode = {
+        id: widget.id,
+        label: widget.options.label || widget.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);
+      treeNode.push(curNode);
+      if (widget.category === void 0) {
+        return;
+      }
+      curNode.children = [];
+      if (widget.type === "grid") {
+        widget.cols.map((col) => {
+          const colNode = {
+            id: col.id,
+            label: col.options.name || widget.type,
+            children: []
+          };
+          curNode.children.push(colNode);
+          col.widgetList.map((wChild) => {
+            this.buildTreeNodeOfWidget(wChild, colNode.children);
+          });
+        });
+      } else if (widget.type === "table") {
+        widget.rows.map((row) => {
+          const rowNode = {
+            id: row.id,
+            label: "table-row",
+            selectable: false,
+            children: []
+          };
+          curNode.children.push(rowNode);
+          row.cols.map((cell) => {
+            if (!!cell.merged) {
+              return;
+            }
+            const rowChildren = rowNode.children;
+            const cellNode = {
+              id: cell.id,
+              label: "table-cell",
+              children: []
+            };
+            rowChildren.push(cellNode);
+            cell.widgetList.map((wChild) => {
+              this.buildTreeNodeOfWidget(wChild, cellNode.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",
+      } else if (widget.type === "tab") {
+        widget.tabs.map((tab) => {
+          const tabNode = {
+            id: tab.id,
+            label: tab.options.name || widget.type,
+            selectable: false,
             children: []
           };
-          g.push(a), l.widgetList.map((D) => {
-            this.buildTreeNodeOfWidget(D, a.children);
+          curNode.children.push(tabNode);
+          tab.widgetList.map((wChild) => {
+            this.buildTreeNodeOfWidget(wChild, tabNode.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);
+      } else if (widget.type === "sub-form") {
+        widget.widgetList.map((wChild) => {
+          this.buildTreeNodeOfWidget(wChild, curNode.children);
+        });
+      } else if (widget.category === "container") {
+        widget.widgetList.map((wChild) => {
+          this.buildTreeNodeOfWidget(wChild, curNode.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);
+      this.nodeTreeData.length = 0;
+      this.designer.widgetList.forEach((wItem) => {
+        this.buildTreeNodeOfWidget(wItem, this.nodeTreeData);
       });
     },
     showNodeTreeDrawer() {
-      this.refreshNodeTree(), this.showNodeTreeDrawerFlag = !0, this.$nextTick(() => {
-        this.designer.selectedId;
+      this.refreshNodeTree();
+      this.showNodeTreeDrawerFlag = true;
+      this.$nextTick(() => {
+        if (!!this.designer.selectedId) ;
       });
     },
     undoHistory() {
@@ -211,53 +243,64 @@ const G = {
     redoHistory() {
       this.designer.redoHistoryStep();
     },
-    changeLayoutType(e) {
-      this.designer.changeLayoutType(e);
+    changeLayoutType(newType) {
+      this.designer.changeLayoutType(newType);
     },
     clearFormWidget() {
-      this.designer.clearDesigner(), this.designer.formWidget.clearWidgetRefList(), this.$message.success("ok");
+      this.designer.clearDesigner();
+      this.designer.formWidget.clearWidgetRefList();
+      this.$message.success("ok");
     },
     previewForm() {
-      this.showPreviewDialogFlag = !0;
+      this.showPreviewDialogFlag = true;
     },
-    saveAsFile(e, t) {
-      const s = "json.json";
-      if (A("vscode") == 1) {
-        this.vsSaveFile(s, e);
+    saveAsFile(fileContent, defaultFileName) {
+      const value = "json.json";
+      if (getQueryParam("vscode") == 1) {
+        this.vsSaveFile(value, fileContent);
         return;
       }
-      const d = new Blob([e], { type: "text/plain;charset=utf-8" });
-      M(d, s);
+      const fileBlob = new Blob([fileContent], { type: "text/plain;charset=utf-8" });
+      saveAs(fileBlob, value);
     },
-    vsSaveFile(e, t) {
-      const s = {
+    vsSaveFile(fileName, fileContent) {
+      const msgObj = {
         cmd: "writeFile",
         data: {
-          fileName: e,
-          code: t
+          fileName,
+          code: fileContent
         }
       };
-      window.parent.postMessage(s, "*");
+      window.parent.postMessage(msgObj, "*");
     },
     importJson() {
-      this.importTemplate = JSON.stringify(this.designer.getImportTemplate(), null, "  "), this.showImportJsonDialogFlag = !0;
+      this.importTemplate = JSON.stringify(this.designer.getImportTemplate(), null, "  ");
+      this.showImportJsonDialogFlag = true;
     },
     doJsonImport() {
       try {
-        const e = JSON.parse(this.importTemplate);
-        if (!e || !e.formConfig)
+        const importObj = JSON.parse(this.importTemplate);
+        if (!importObj || !importObj.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 + "");
+        }
+        this.designer.loadFormJson(importObj);
+        this.showImportJsonDialogFlag = false;
+        this.$message.success(this.i18nt("designer.hint.importJsonSuccess"));
+        this.designer.emitHistoryChange();
+        this.designer.emitEvent("form-json-imported", []);
+      } catch (ex) {
+        this.$message.error(ex + "");
       }
     },
     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;
+      const widgetList = cloneDeep(this.designer.widgetList);
+      const formConfig = cloneDeep(this.designer.formConfig);
+      this.jsonContent = JSON.stringify({ widgetList, formConfig }, null, "  ");
+      this.jsonRawContent = JSON.stringify({ widgetList, formConfig });
+      this.showExportJsonDialogFlag = true;
     },
     copyFormJson(e) {
-      b(
+      copyToClipboard(
         this.jsonRawContent,
         e,
         this.$message,
@@ -266,13 +309,15 @@ const G = {
       );
     },
     saveFormJson() {
-      this.saveAsFile(this.jsonContent, `vform${C()}.json`);
+      this.saveAsFile(this.jsonContent, `vform${generateId()}.json`);
     },
     exportCode() {
-      this.vueCode = x(this.formJson), this.htmlCode = x(this.formJson, "html"), this.showExportCodeDialogFlag = !0;
+      this.vueCode = generateCode(this.formJson);
+      this.htmlCode = generateCode(this.formJson, "html");
+      this.showExportCodeDialogFlag = true;
     },
     copyVueCode(e) {
-      b(
+      copyToClipboard(
         this.vueCode,
         e,
         this.$message,
@@ -281,7 +326,7 @@ const G = {
       );
     },
     copyHtmlCode(e) {
-      b(
+      copyToClipboard(
         this.htmlCode,
         e,
         this.$message,
@@ -290,15 +335,15 @@ const G = {
       );
     },
     saveVueCode() {
-      this.saveAsFile(this.vueCode, `vform${C()}.vue`);
+      this.saveAsFile(this.vueCode, `vform${generateId()}.vue`);
     },
     saveHtmlCode() {
-      this.saveAsFile(this.htmlCode, `vform${C()}.html`);
+      this.saveAsFile(this.htmlCode, `vform${generateId()}.html`);
     },
     generateSFC() {
     },
     copyV2SFC(e) {
-      b(
+      copyToClipboard(
         this.sfcCode,
         e,
         this.$message,
@@ -307,7 +352,7 @@ const G = {
       );
     },
     copyV3SFC(e) {
-      b(
+      copyToClipboard(
         this.sfcCodeV3,
         e,
         this.$message,
@@ -316,30 +361,39 @@ const G = {
       );
     },
     saveV2SFC() {
-      this.saveAsFile(this.sfcCode, `vformV2-${C()}.vue`);
+      this.saveAsFile(this.sfcCode, `vformV2-${generateId()}.vue`);
     },
     saveV3SFC() {
-      this.saveAsFile(this.sfcCodeV3, `vformV3-${C()}.vue`);
+      this.saveAsFile(this.sfcCodeV3, `vformV3-${generateId()}.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);
+      const data = await this.$refs["preForm"].getFormData();
+      const formConfig = this.designer.formConfig;
+      const res = await fmtHttpParams.call(this, formConfig.serveList.vformUpdate, data);
+      console.log("res: insertData", res);
     },
-    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);
+    async showData(_id) {
+      const formConfig = this.designer.formConfig;
+      const dsResult = await fmtHttpParams(formConfig.serveList.vformDetail, { _id });
+      const leaveDates = [{ date: "2024-10-28" }, { date: "2024-10-29" }, { date: "2024-10-20" }];
+      this.$refs["preForm"].getWidgetRef("leaveDates").setValue(leaveDates);
+      this.$refs.preForm.setFormData({
+        ...dsResult
+      });
+      this.$refs.preForm.setReadMode(true);
     },
     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);
+      this.$refs["preForm"].getFormData().then((formData) => {
+        console.log("formData: ", formData);
+        this.formDataJson = JSON.stringify(formData, null, "  ");
+        this.formDataRawJson = JSON.stringify(formData);
+        this.showFormDataDialogFlag = true;
+      }).catch((error) => {
+        this.$message.error(error);
       });
     },
     copyFormDataJson(e) {
-      b(
+      copyToClipboard(
         this.formDataRawJson,
         e,
         this.$message,
@@ -348,38 +402,39 @@ const G = {
       );
     },
     saveFormData() {
-      this.saveAsFile(this.htmlCode, `formData${C()}.json`);
+      this.saveAsFile(this.htmlCode, `formData${generateId()}.json`);
     },
     resetForm() {
-      this.$refs.preForm.resetForm();
+      this.$refs["preForm"].resetForm();
     },
     setFormDisabled() {
-      this.$refs.preForm.disableForm();
+      this.$refs["preForm"].disableForm();
     },
     setFormEnabled() {
-      this.$refs.preForm.enableForm();
+      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);
+      axios.get("https://www.fastmock.site/mock/e9710039bb5f11262d1a0f2f0bbe08c8/vform3/getFS").then((res) => {
+        const newFormJson = res.data;
+        this.$refs.preForm.setFormJson(newFormJson);
+        this.$nextTick(() => {
+          const newFormData = { input30696: "668899" };
+          this.$refs.preForm.setFormData(newFormData);
         });
-      }).catch((e) => {
+      }).catch((err) => {
       });
     },
     testSetFormJson() {
-      const e = {
+      const newFormJson = {
         widgetList: [
           {
             type: "static-text",
             icon: "static-text",
-            formItemFlag: !1,
+            formItemFlag: false,
             options: {
               name: "statictext111193",
               columnWidth: "200px",
-              hidden: !1,
+              hidden: false,
               textContent: "多列表单",
               customClass: [],
               onCreated: "",
@@ -391,14 +446,14 @@ const G = {
           {
             type: "divider",
             icon: "divider",
-            formItemFlag: !1,
+            formItemFlag: false,
             options: {
               name: "divider102346",
               label: "",
               columnWidth: "200px",
               direction: "horizontal",
               contentPosition: "center",
-              hidden: !1,
+              hidden: false,
               customClass: [],
               onCreated: "",
               onMounted: ""
@@ -414,12 +469,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "input",
                     icon: "text-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "input12931",
                       label: "发件人姓名",
@@ -430,13 +485,13 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      allowClear: !0,
-                      showPassword: !1,
-                      required: !0,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      allowClear: true,
+                      showPassword: false,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -445,11 +500,11 @@ const G = {
                       labelTooltip: null,
                       minLength: null,
                       maxLength: null,
-                      showCount: !1,
+                      showCount: false,
                       addonBefore: "",
                       addonAfter: "",
-                      appendButton: !1,
-                      appendButtonDisabled: !1,
+                      appendButton: false,
+                      appendButtonDisabled: false,
                       buttonIcon: "el-icon-search",
                       onCreated: "",
                       onMounted: "",
@@ -464,12 +519,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol25469",
-                  hidden: !1,
+                  hidden: false,
                   span: 12,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -481,12 +536,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "input",
                     icon: "text-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "input23031",
                       label: "发件人号码",
@@ -497,13 +552,13 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      allowClear: !0,
-                      showPassword: !1,
-                      required: !0,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      allowClear: true,
+                      showPassword: false,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -512,11 +567,11 @@ const G = {
                       labelTooltip: null,
                       minLength: null,
                       maxLength: null,
-                      showCount: !1,
+                      showCount: false,
                       addonBefore: "",
                       addonAfter: "",
-                      appendButton: !1,
-                      appendButtonDisabled: !1,
+                      appendButton: false,
+                      appendButtonDisabled: false,
                       buttonIcon: "el-icon-search",
                       onCreated: "",
                       onMounted: "",
@@ -531,12 +586,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol25125",
-                  hidden: !1,
+                  hidden: false,
                   span: 12,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -548,22 +603,22 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "switch",
                     icon: "switch-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "switch96070",
                       label: "是否保密",
                       labelAlign: "",
-                      defaultValue: !0,
+                      defaultValue: true,
                       columnWidth: "200px",
                       labelWidth: null,
-                      labelHidden: !1,
-                      disabled: !1,
-                      hidden: !1,
+                      labelHidden: false,
+                      disabled: false,
+                      hidden: false,
                       customClass: [],
                       labelIconClass: null,
                       labelIconPosition: "rear",
@@ -583,12 +638,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol44470",
-                  hidden: !1,
+                  hidden: false,
                   span: 24,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -600,12 +655,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "textarea",
                     icon: "textarea-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "textarea21654",
                       label: "发件人地址",
@@ -616,11 +671,11 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      required: !0,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -629,7 +684,7 @@ const G = {
                       labelTooltip: null,
                       minLength: null,
                       maxLength: null,
-                      showCount: !1,
+                      showCount: false,
                       onCreated: "",
                       onMounted: "",
                       onInput: "",
@@ -643,12 +698,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol98223",
-                  hidden: !1,
+                  hidden: false,
                   span: 24,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -657,20 +712,20 @@ const G = {
                 id: "grid-col-98223"
               }
             ],
-            options: { name: "grid35834", hidden: !1, gutter: 12, customClass: [] },
+            options: { name: "grid35834", hidden: false, gutter: 12, customClass: [] },
             id: "grid35834"
           },
           {
             type: "divider",
             icon: "divider",
-            formItemFlag: !1,
+            formItemFlag: false,
             options: {
               name: "divider69240",
               label: "",
               columnWidth: "200px",
               direction: "horizontal",
               contentPosition: "center",
-              hidden: !1,
+              hidden: false,
               customClass: [],
               onCreated: "",
               onMounted: ""
@@ -686,12 +741,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "input",
                     icon: "text-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "input113152",
                       label: "收件人姓名111",
@@ -702,13 +757,13 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      allowClear: !0,
-                      showPassword: !1,
-                      required: !0,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      allowClear: true,
+                      showPassword: false,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -717,11 +772,11 @@ const G = {
                       labelTooltip: null,
                       minLength: null,
                       maxLength: null,
-                      showCount: !1,
+                      showCount: false,
                       addonBefore: "",
                       addonAfter: "",
-                      appendButton: !1,
-                      appendButtonDisabled: !1,
+                      appendButton: false,
+                      appendButtonDisabled: false,
                       buttonIcon: "el-icon-search",
                       onCreated: "",
                       onMounted: "",
@@ -736,12 +791,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol47242",
-                  hidden: !1,
+                  hidden: false,
                   span: 12,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -753,12 +808,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "input",
                     icon: "text-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "input40240",
                       label: "收件人号码",
@@ -769,13 +824,13 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      allowClear: !0,
-                      showPassword: !1,
-                      required: !0,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      allowClear: true,
+                      showPassword: false,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -784,11 +839,11 @@ const G = {
                       labelTooltip: null,
                       minLength: null,
                       maxLength: null,
-                      showCount: !1,
+                      showCount: false,
                       addonBefore: "",
                       addonAfter: "",
-                      appendButton: !1,
-                      appendButtonDisabled: !1,
+                      appendButton: false,
+                      appendButtonDisabled: false,
                       buttonIcon: "el-icon-search",
                       onCreated: "",
                       onMounted: "",
@@ -803,12 +858,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol27970",
-                  hidden: !1,
+                  hidden: false,
                   span: 12,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -820,12 +875,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "checkbox",
                     icon: "checkbox-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "checkbox63174",
                       label: "接收时间段",
@@ -834,18 +889,18 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       displayStyle: "inline",
-                      buttonStyle: !1,
-                      border: !1,
+                      buttonStyle: false,
+                      border: false,
                       labelWidth: null,
-                      labelHidden: !1,
-                      disabled: !1,
-                      hidden: !1,
+                      labelHidden: false,
+                      disabled: false,
+                      hidden: false,
                       optionItems: [
                         { label: "上午9:00 - 11:30", value: 1 },
                         { label: "下午12:30 - 18:00", value: 2 },
                         { label: "晚上18:00 - 21:00", value: 3 }
                       ],
-                      required: !0,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -862,12 +917,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol74653",
-                  hidden: !1,
+                  hidden: false,
                   span: 24,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -879,12 +934,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "input",
                     icon: "text-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "input78584",
                       label: "收件人地址",
@@ -895,13 +950,13 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      allowClear: !0,
-                      showPassword: !1,
-                      required: !0,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      allowClear: true,
+                      showPassword: false,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -910,11 +965,11 @@ const G = {
                       labelTooltip: null,
                       minLength: null,
                       maxLength: null,
-                      showCount: !1,
+                      showCount: false,
                       addonBefore: "",
                       addonAfter: "",
-                      appendButton: !1,
-                      appendButtonDisabled: !1,
+                      appendButton: false,
+                      appendButtonDisabled: false,
                       buttonIcon: "el-icon-search",
                       onCreated: "",
                       onMounted: "",
@@ -929,12 +984,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol63781",
-                  hidden: !1,
+                  hidden: false,
                   span: 24,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -943,20 +998,20 @@ const G = {
                 id: "grid-col-63781"
               }
             ],
-            options: { name: "grid114672", hidden: !1, gutter: 12, customClass: [] },
+            options: { name: "grid114672", hidden: false, gutter: 12, customClass: [] },
             id: "grid114672"
           },
           {
             type: "divider",
             icon: "divider",
-            formItemFlag: !1,
+            formItemFlag: false,
             options: {
               name: "divider75887",
               label: "",
               columnWidth: "200px",
               direction: "horizontal",
               contentPosition: "center",
-              hidden: !1,
+              hidden: false,
               customClass: [],
               onCreated: "",
               onMounted: ""
@@ -972,12 +1027,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "time-range",
                     icon: "time-range-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "timerange47503",
                       label: "送货时间",
@@ -988,14 +1043,14 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      allowClear: !0,
-                      editable: !1,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      allowClear: true,
+                      editable: false,
                       format: "HH:mm:ss",
-                      required: !0,
+                      required: true,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -1014,12 +1069,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol109912",
-                  hidden: !1,
+                  hidden: false,
                   span: 24,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -1031,12 +1086,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "slider",
                     icon: "slider-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "slider54714",
                       label: "价格保护",
@@ -1044,10 +1099,10 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      required: !1,
+                      labelHidden: false,
+                      disabled: false,
+                      hidden: false,
+                      required: false,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -1057,7 +1112,7 @@ const G = {
                       min: 0,
                       max: 100,
                       step: 10,
-                      range: !1,
+                      range: false,
                       height: null,
                       onCreated: "",
                       onMounted: "",
@@ -1070,12 +1125,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol114653",
-                  hidden: !1,
+                  hidden: false,
                   span: 24,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -1087,12 +1142,12 @@ const G = {
                 type: "grid-col",
                 category: "container",
                 icon: "grid-col",
-                internal: !0,
+                internal: true,
                 widgetList: [
                   {
                     type: "textarea",
                     icon: "textarea-field",
-                    formItemFlag: !0,
+                    formItemFlag: true,
                     options: {
                       name: "textarea64794",
                       label: "其他信息",
@@ -1103,11 +1158,11 @@ const G = {
                       columnWidth: "200px",
                       size: "",
                       labelWidth: null,
-                      labelHidden: !1,
-                      readonly: !1,
-                      disabled: !1,
-                      hidden: !1,
-                      required: !1,
+                      labelHidden: false,
+                      readonly: false,
+                      disabled: false,
+                      hidden: false,
+                      required: false,
                       validation: "",
                       validationHint: "",
                       customClass: [],
@@ -1116,7 +1171,7 @@ const G = {
                       labelTooltip: null,
                       minLength: null,
                       maxLength: null,
-                      showCount: !1,
+                      showCount: false,
                       onCreated: "",
                       onMounted: "",
                       onInput: "",
@@ -1130,12 +1185,12 @@ const G = {
                 ],
                 options: {
                   name: "gridCol80867",
-                  hidden: !1,
+                  hidden: false,
                   span: 24,
                   offset: 0,
                   push: 0,
                   pull: 0,
-                  responsive: !1,
+                  responsive: false,
                   md: 12,
                   sm: 12,
                   xs: 12,
@@ -1144,7 +1199,7 @@ const G = {
                 id: "grid-col-80867"
               }
             ],
-            options: { name: "grid28709", hidden: !1, gutter: 12, customClass: [] },
+            options: { name: "grid28709", hidden: false, gutter: 12, customClass: [] },
             id: "grid28709"
           }
         ],
@@ -1161,7 +1216,8 @@ const G = {
           onFormValidate: ""
         }
       };
-      this.$refs.preForm.setFormJson(e), this.$nextTick(() => {
+      this.$refs.preForm.setFormJson(newFormJson);
+      this.$nextTick(() => {
         this.$refs.preForm.setFormData({
           input12931: "asdf",
           input23031: "input23031",
@@ -1172,97 +1228,123 @@ const G = {
       });
     },
     testSetFormData() {
-      const e = {
+      const testFD = {
         input89263: "899668"
       };
-      this.$refs.preForm.setFormData(e);
+      this.$refs.preForm.setFormData(testFD);
     },
     testReloadOptionData() {
-      this.testOptionData.select001.push({
+      this.testOptionData["select001"].push({
         label: "aaa",
         value: 888
-      }), this.$refs.preForm.reloadOptionData();
+      });
+      this.$refs.preForm.reloadOptionData();
     },
-    handleFormChange(e, t, s, d) {
-      console.log("formModel", d);
+    handleFormChange(fieldName, newValue, oldValue, formModel) {
+      console.log("formModel", formModel);
     },
-    testOnAppendButtonClick(e) {
-      console.log("test", e);
+    testOnAppendButtonClick(clickedWidget) {
+      console.log("test", clickedWidget);
     },
-    testOnButtonClick(e) {
-      console.log("test", e);
+    testOnButtonClick(button) {
+      console.log("test", button);
     },
-    onMyEmitTest(e) {
-      console.log("-----", e);
+    onMyEmitTest(aaa) {
+      console.log("-----", aaa);
     },
-    findWidgetById(e) {
-      let t = null;
-      return N(this.designer.widgetList, (s) => {
-        s.id === e && (t = s);
-      }), t;
+    findWidgetById(wId) {
+      let foundW = null;
+      traverseAllWidgets(this.designer.widgetList, (w) => {
+        if (w.id === wId) {
+          foundW = w;
+        }
+      });
+      return foundW;
     },
-    onNodeTreeClick(e, t, s) {
-      if (e.selectable !== void 0 && !e.selectable)
+    onNodeTreeClick(nodeData, node, nodeEl) {
+      if (nodeData.selectable !== void 0 && !nodeData.selectable) {
         this.$message.info(this.i18nt("designer.hint.currentNodeCannotBeSelected"));
-      else {
-        const d = e.id, o = this.findWidgetById(d);
-        o && this.designer.setSelected(o);
+      } else {
+        const selectedId = nodeData.id;
+        const foundW = this.findWidgetById(selectedId);
+        if (!!foundW) {
+          this.designer.setSelected(foundW);
+        }
       }
     }
   }
-}, 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"), B = p("a-alert"), F = p("code-editor"), k = p("a-tab-pane"), S = p("a-tabs");
-  return f(), T("div", X, [
-    m("div", Y, [
-      i(a, {
+};
+const _hoisted_1 = { class: "toolbar-container" };
+const _hoisted_2 = { class: "left-toolbar" };
+const _hoisted_3 = { class: "right-toolbar" };
+const _hoisted_4 = { class: "right-toolbar-con" };
+const _hoisted_5 = { class: "dialog-footer" };
+const _hoisted_6 = { class: "dialog-footer" };
+const _hoisted_7 = { class: "dialog-footer" };
+const _hoisted_8 = { style: { "border": "1px solid #dcdfe6" } };
+const _hoisted_9 = { class: "dialog-footer" };
+const _hoisted_10 = { class: "dialog-footer" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_svg_icon = resolveComponent("svg-icon");
+  const _component_a_button = resolveComponent("a-button");
+  const _component_a_tree = resolveComponent("a-tree");
+  const _component_a_drawer = resolveComponent("a-drawer");
+  const _component_VFormRender = resolveComponent("VFormRender");
+  const _component_a_modal = resolveComponent("a-modal");
+  const _component_a_alert = resolveComponent("a-alert");
+  const _component_code_editor = resolveComponent("code-editor");
+  const _component_a_tab_pane = resolveComponent("a-tab-pane");
+  const _component_a_tabs = resolveComponent("a-tabs");
+  return openBlock(), createElementBlock("div", _hoisted_1, [
+    createElementVNode("div", _hoisted_2, [
+      createVNode(_component_a_button, {
         type: "link",
-        onClick: t[0] || (t[0] = (r) => s.changeLeftWidth())
+        onClick: _cache[0] || (_cache[0] = ($event) => $props.changeLeftWidth())
       }, {
-        default: n(() => [
-          i(g, {
-            style: J(`transform:${s.leftWidth === 0 ? "rotate(180deg)" : "rotate(0deg)"}`),
+        default: withCtx(() => [
+          createVNode(_component_svg_icon, {
+            style: normalizeStyle(`transform:${$props.leftWidth === 0 ? "rotate(180deg)" : "rotate(0deg)"}`),
             "icon-class": "a-ipadarrow_back"
           }, null, 8, ["style"])
         ]),
         _: 1
       }),
-      i(a, {
+      createVNode(_component_a_button, {
         type: "link",
-        disabled: l.undoDisabled,
-        title: e.i18nt("designer.toolbar.undoHint"),
-        onClick: l.undoHistory
+        disabled: $options.undoDisabled,
+        title: _ctx.i18nt("designer.toolbar.undoHint"),
+        onClick: $options.undoHistory
       }, {
-        default: n(() => [
-          i(g, { "icon-class": "undo" })
+        default: withCtx(() => [
+          createVNode(_component_svg_icon, { "icon-class": "undo" })
         ]),
         _: 1
       }, 8, ["disabled", "title", "onClick"]),
-      i(a, {
+      createVNode(_component_a_button, {
         type: "link",
-        disabled: l.redoDisabled,
-        title: e.i18nt("designer.toolbar.redoHint"),
-        onClick: l.redoHistory
+        disabled: $options.redoDisabled,
+        title: _ctx.i18nt("designer.toolbar.redoHint"),
+        onClick: $options.redoHistory
       }, {
-        default: n(() => [
-          i(g, { "icon-class": "redo" })
+        default: withCtx(() => [
+          createVNode(_component_svg_icon, { "icon-class": "redo" })
         ]),
         _: 1
       }, 8, ["disabled", "title", "onClick"])
     ]),
-    i(I, {
-      title: e.i18nt("designer.toolbar.nodeTreeTitle"),
+    createVNode(_component_a_drawer, {
+      title: _ctx.i18nt("designer.toolbar.nodeTreeTitle"),
       direction: "ltr",
-      visible: o.showNodeTreeDrawerFlag,
-      "onUpdate:visible": t[1] || (t[1] = (r) => o.showNodeTreeDrawerFlag = r),
+      visible: $data.showNodeTreeDrawerFlag,
+      "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => $data.showNodeTreeDrawerFlag = $event),
       width: 280,
-      "destroy-on-close": !0,
+      "destroy-on-close": true,
       class: "node-tree-drawer"
     }, {
-      default: n(() => [
-        i(D, {
+      default: withCtx(() => [
+        createVNode(_component_a_tree, {
           ref: "nodeTree",
-          treeData: o.nodeTreeData,
+          treeData: $data.nodeTreeData,
           "default-expand-all": "",
           "highlight-current": "",
           class: "node-tree",
@@ -1272,426 +1354,428 @@ function se(e, t, s, d, o, l) {
       ]),
       _: 1
     }, 8, ["title", "visible"]),
-    m("div", Z, [
-      m("div", $, [
-        l.showToolButton("clearDesignerButton") ? (f(), h(a, {
+    createElementVNode("div", _hoisted_3, [
+      createElementVNode("div", _hoisted_4, [
+        $options.showToolButton("clearDesignerButton") ? (openBlock(), createBlock(_component_a_button, {
           key: 0,
           type: "link",
-          onClick: l.clearFormWidget
+          onClick: $options.clearFormWidget
         }, {
-          default: n(() => [
-            i(g, { "icon-class": "el-delete" }),
-            u(c(e.i18nt("designer.toolbar.clear")), 1)
+          default: withCtx(() => [
+            createVNode(_component_svg_icon, { "icon-class": "el-delete" }),
+            createTextVNode(toDisplayString(_ctx.i18nt("designer.toolbar.clear")), 1)
           ]),
           _: 1
-        }, 8, ["onClick"])) : y("", !0),
-        l.showToolButton("previewFormButton") ? (f(), h(a, {
+        }, 8, ["onClick"])) : createCommentVNode("", true),
+        $options.showToolButton("previewFormButton") ? (openBlock(), createBlock(_component_a_button, {
           key: 1,
           type: "link",
-          onClick: l.previewForm
+          onClick: $options.previewForm
         }, {
-          default: n(() => [
-            i(g, { "icon-class": "el-view" }),
-            u(c(e.i18nt("designer.toolbar.preview")), 1)
+          default: withCtx(() => [
+            createVNode(_component_svg_icon, { "icon-class": "el-view" }),
+            createTextVNode(toDisplayString(_ctx.i18nt("designer.toolbar.preview")), 1)
           ]),
           _: 1
-        }, 8, ["onClick"])) : y("", !0),
-        l.showToolButton("importJsonButton") ? (f(), h(a, {
+        }, 8, ["onClick"])) : createCommentVNode("", true),
+        $options.showToolButton("importJsonButton") ? (openBlock(), createBlock(_component_a_button, {
           key: 2,
           type: "link",
-          onClick: l.importJson
+          onClick: $options.importJson
         }, {
-          default: n(() => [
-            u(c(e.i18nt("designer.toolbar.importJson")), 1)
+          default: withCtx(() => [
+            createTextVNode(toDisplayString(_ctx.i18nt("designer.toolbar.importJson")), 1)
           ]),
           _: 1
-        }, 8, ["onClick"])) : y("", !0),
-        l.showToolButton("exportJsonButton") ? (f(), h(a, {
+        }, 8, ["onClick"])) : createCommentVNode("", true),
+        $options.showToolButton("exportJsonButton") ? (openBlock(), createBlock(_component_a_button, {
           key: 3,
           type: "link",
-          onClick: l.exportJson
+          onClick: $options.exportJson
         }, {
-          default: n(() => [
-            u(c(e.i18nt("designer.toolbar.exportJson")), 1)
+          default: withCtx(() => [
+            createTextVNode(toDisplayString(_ctx.i18nt("designer.toolbar.exportJson")), 1)
           ]),
           _: 1
-        }, 8, ["onClick"])) : y("", !0),
-        l.showToolButton("exportCodeButton") ? (f(), h(a, {
+        }, 8, ["onClick"])) : createCommentVNode("", true),
+        $options.showToolButton("exportCodeButton") ? (openBlock(), createBlock(_component_a_button, {
           key: 4,
           type: "link",
-          onClick: l.saveJson
+          onClick: $options.saveJson
         }, {
-          default: n(() => [
-            u(" 保存 ")
+          default: withCtx(() => [
+            createTextVNode(" 保存 ")
           ]),
           _: 1
-        }, 8, ["onClick"])) : y("", !0),
-        i(a, {
+        }, 8, ["onClick"])) : createCommentVNode("", true),
+        createVNode(_component_a_button, {
           type: "link",
-          onClick: t[2] || (t[2] = (r) => s.changeRightWidth())
+          onClick: _cache[2] || (_cache[2] = ($event) => $props.changeRightWidth())
         }, {
-          default: n(() => [
-            i(g, {
-              style: J(`transform:${s.rightWidth === 0 ? "rotate(0deg)" : "rotate(180deg)"}`),
+          default: withCtx(() => [
+            createVNode(_component_svg_icon, {
+              style: normalizeStyle(`transform:${$props.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))
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.$slots, (idx, slotName) => {
+          return renderSlot(_ctx.$slots, slotName, {}, void 0, true);
+        }), 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,
+    createVNode(_component_a_modal, {
+      title: _ctx.i18nt("designer.toolbar.preview"),
+      visible: $data.showPreviewDialogFlag,
+      "onUpdate:visible": _cache[5] || (_cache[5] = ($event) => $data.showPreviewDialogFlag = $event),
+      "show-close": true,
+      "close-on-click-modal": false,
+      "close-on-press-escape": false,
       center: "",
-      "destroy-on-close": !0,
-      "append-to-body": !0,
+      "destroy-on-close": true,
+      "append-to-body": true,
       class: "drag-dialog",
       width: "75%",
-      fullscreen: l.layoutType === "H5" || l.layoutType === "Pad"
+      fullscreen: $options.layoutType === "H5" || $options.layoutType === "Pad"
     }, {
-      footer: n(() => [
-        m("div", ee, [
-          i(a, {
-            onClick: t[3] || (t[3] = (r) => l.showData(1))
+      footer: withCtx(() => [
+        createElementVNode("div", _hoisted_5, [
+          createVNode(_component_a_button, {
+            onClick: _cache[3] || (_cache[3] = ($event) => $options.showData(1))
           }, {
-            default: n(() => [
-              u("数据回显 _id 1")
+            default: withCtx(() => [
+              createTextVNode("数据回显 _id 1")
             ]),
             _: 1
           }),
-          i(a, {
+          createVNode(_component_a_button, {
             type: "primary",
-            onClick: l.getFormData
+            onClick: $options.getFormData
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.getFormData")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.getFormData")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
+          createVNode(_component_a_button, {
             type: "primary",
-            onClick: l.resetForm
+            onClick: $options.resetForm
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.resetForm")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.resetForm")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
+          createVNode(_component_a_button, {
             type: "primary",
-            onClick: l.setFormDisabled
+            onClick: $options.setFormDisabled
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.disableForm")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.disableForm")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
+          createVNode(_component_a_button, {
             type: "primary",
-            onClick: l.setFormEnabled
+            onClick: $options.setFormEnabled
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.enableForm")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.enableForm")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
-            onClick: t[4] || (t[4] = (r) => o.showPreviewDialogFlag = !1)
+          createVNode(_component_a_button, {
+            onClick: _cache[4] || (_cache[4] = ($event) => $data.showPreviewDialogFlag = false)
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.closePreview")), 1)
             ]),
             _: 1
           }),
-          (f(), h(a, {
+          (openBlock(), createBlock(_component_a_button, {
             key: 0,
-            onClick: l.setReadMode
+            onClick: $options.setReadMode
           }, {
-            default: n(() => [
-              u("测试变只读")
+            default: withCtx(() => [
+              createTextVNode("测试变只读")
             ]),
             _: 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" : ""]])
+      default: withCtx(() => [
+        createElementVNode("div", null, [
+          createElementVNode("div", {
+            class: normalizeClass(["form-render-wrapper", [$options.layoutType === "H5" ? "h5-layout" : $options.layoutType === "Pad" ? "pad-layout" : ""]])
           }, [
-            i(W, {
-              vfCtx: o.vfCtx,
+            createVNode(_component_VFormRender, {
+              vfCtx: $data.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
+              "form-json": $data.cloneDeep($options.formJson),
+              "form-data": $data.testFormData,
+              "preview-state": true,
+              "option-data": $data.testOptionData,
+              "global-dsv": $options.designerDsv,
+              onMyEmitTest: $options.onMyEmitTest,
+              onAppendButtonClick: $options.testOnAppendButtonClick,
+              onButtonClick: $options.testOnButtonClick,
+              onFormChange: $options.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,
+    createVNode(_component_a_modal, {
+      title: _ctx.i18nt("designer.toolbar.importJson"),
+      visible: $data.showImportJsonDialogFlag,
+      "onUpdate:visible": _cache[8] || (_cache[8] = ($event) => $data.showImportJsonDialogFlag = $event),
+      "show-close": true,
       class: "drag-dialog",
-      "append-to-body": !0,
+      "append-to-body": true,
       center: "",
       width: "1200px",
-      "close-on-click-modal": !1,
-      "close-on-press-escape": !1,
-      "destroy-on-close": !0
+      "close-on-click-modal": false,
+      "close-on-press-escape": false,
+      "destroy-on-close": true
     }, {
-      footer: n(() => [
-        m("div", te, [
-          i(a, {
+      footer: withCtx(() => [
+        createElementVNode("div", _hoisted_6, [
+          createVNode(_component_a_button, {
             type: "primary",
-            onClick: l.doJsonImport
+            onClick: $options.doJsonImport
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.import")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.import")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
-            onClick: t[7] || (t[7] = (r) => o.showImportJsonDialogFlag = !1)
+          createVNode(_component_a_button, {
+            onClick: _cache[7] || (_cache[7] = ($event) => $data.showImportJsonDialogFlag = false)
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.cancel")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.cancel")), 1)
             ]),
             _: 1
           })
         ])
       ]),
-      default: n(() => [
-        i(B, {
+      default: withCtx(() => [
+        createVNode(_component_a_alert, {
           type: "info",
-          message: e.i18nt("designer.hint.importJsonHint"),
+          message: _ctx.i18nt("designer.hint.importJsonHint"),
           "show-icon": "",
           class: "alert-padding"
         }, null, 8, ["message"]),
-        i(F, {
+        createVNode(_component_code_editor, {
           mode: "json",
-          readonly: !1,
-          modelValue: o.importTemplate,
-          "onUpdate:modelValue": t[6] || (t[6] = (r) => o.importTemplate = r)
+          readonly: false,
+          modelValue: $data.importTemplate,
+          "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => $data.importTemplate = $event)
         }, 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,
+    createVNode(_component_a_modal, {
+      title: _ctx.i18nt("designer.toolbar.exportJson"),
+      visible: $data.showExportJsonDialogFlag,
+      "onUpdate:visible": _cache[11] || (_cache[11] = ($event) => $data.showExportJsonDialogFlag = $event),
+      "show-close": true,
       class: "drag-dialog",
       center: "",
       "append-to-body": "",
       width: "1200px",
-      "close-on-click-modal": !1,
-      "close-on-press-escape": !1,
-      "destroy-on-close": !0
+      "close-on-click-modal": false,
+      "close-on-press-escape": false,
+      "destroy-on-close": true
     }, {
-      footer: n(() => [
-        m("div", oe, [
-          i(a, {
+      footer: withCtx(() => [
+        createElementVNode("div", _hoisted_7, [
+          createVNode(_component_a_button, {
             type: "primary",
             class: "copy-json-btn",
-            "data-clipboard-text": o.jsonRawContent,
-            onClick: l.copyFormJson
+            "data-clipboard-text": $data.jsonRawContent,
+            onClick: $options.copyFormJson
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.copyJson")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.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)
+          createVNode(_component_a_button, { onClick: $options.saveFormJson }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.saveFormJson")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
-            onClick: t[10] || (t[10] = (r) => o.showExportJsonDialogFlag = !1)
+          createVNode(_component_a_button, {
+            onClick: _cache[10] || (_cache[10] = ($event) => $data.showExportJsonDialogFlag = false)
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.closePreview")), 1)
             ]),
             _: 1
           })
         ])
       ]),
-      default: n(() => [
-        i(F, {
+      default: withCtx(() => [
+        createVNode(_component_code_editor, {
           mode: "json",
-          readonly: !0,
-          modelValue: o.jsonContent,
-          "onUpdate:modelValue": t[9] || (t[9] = (r) => o.jsonContent = r)
+          readonly: true,
+          modelValue: $data.jsonContent,
+          "onUpdate:modelValue": _cache[9] || (_cache[9] = ($event) => $data.jsonContent = $event)
         }, 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,
+    createVNode(_component_a_modal, {
+      title: _ctx.i18nt("designer.hint.exportFormData"),
+      visible: $data.showFormDataDialogFlag,
+      "onUpdate:visible": _cache[14] || (_cache[14] = ($event) => $data.showFormDataDialogFlag = $event),
+      "show-close": true,
       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
+      "close-on-click-modal": false,
+      "close-on-press-escape": false,
+      "destroy-on-close": true,
+      "append-to-body": true
     }, {
-      footer: n(() => [
-        m("div", ie, [
-          i(a, {
+      footer: withCtx(() => [
+        createElementVNode("div", _hoisted_9, [
+          createVNode(_component_a_button, {
             type: "primary",
             class: "copy-form-data-json-btn",
-            "data-clipboard-text": o.formDataRawJson,
-            onClick: l.copyFormDataJson
+            "data-clipboard-text": $data.formDataRawJson,
+            onClick: $options.copyFormDataJson
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.copyFormData")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.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)
+          createVNode(_component_a_button, { onClick: $options.saveFormData }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.saveFormData")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
-            onClick: t[13] || (t[13] = (r) => o.showFormDataDialogFlag = !1)
+          createVNode(_component_a_button, {
+            onClick: _cache[13] || (_cache[13] = ($event) => $data.showFormDataDialogFlag = false)
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.closePreview")), 1)
             ]),
             _: 1
           })
         ])
       ]),
-      default: n(() => [
-        m("div", le, [
-          i(F, {
+      default: withCtx(() => [
+        createElementVNode("div", _hoisted_8, [
+          createVNode(_component_code_editor, {
             mode: "json",
-            readonly: !0,
-            modelValue: o.formDataJson,
-            "onUpdate:modelValue": t[12] || (t[12] = (r) => o.formDataJson = r)
+            readonly: true,
+            modelValue: $data.formDataJson,
+            "onUpdate:modelValue": _cache[12] || (_cache[12] = ($event) => $data.formDataJson = $event)
           }, null, 8, ["modelValue"])
         ])
       ]),
       _: 1
     }, 8, ["title", "visible"]),
-    o.showExportSFCDialogFlag ? (f(), h(v, {
+    $data.showExportSFCDialogFlag ? (openBlock(), createBlock(_component_a_modal, {
       key: 0,
-      title: e.i18nt("designer.toolbar.generateSFC"),
-      visible: o.showExportSFCDialogFlag,
-      "onUpdate:visible": t[19] || (t[19] = (r) => o.showExportSFCDialogFlag = r),
+      title: _ctx.i18nt("designer.toolbar.generateSFC"),
+      visible: $data.showExportSFCDialogFlag,
+      "onUpdate:visible": _cache[19] || (_cache[19] = ($event) => $data.showExportSFCDialogFlag = $event),
       "append-to-body": "",
-      "show-close": !0,
+      "show-close": true,
       class: "drag-dialog",
       center: "",
       width: "65%",
-      "close-on-click-modal": !1,
-      "close-on-press-escape": !1,
-      "destroy-on-close": !0
+      "close-on-click-modal": false,
+      "close-on-press-escape": false,
+      "destroy-on-close": true
     }, {
-      footer: n(() => [
-        m("div", ne, [
-          i(a, {
+      footer: withCtx(() => [
+        createElementVNode("div", _hoisted_10, [
+          createVNode(_component_a_button, {
             type: "primary",
             class: "copy-vue2-sfc-btn",
-            "data-clipboard-text": o.sfcCode,
-            onClick: l.copyV2SFC
+            "data-clipboard-text": $data.sfcCode,
+            onClick: $options.copyV2SFC
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.copyVue2SFC")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.copyVue2SFC")), 1)
             ]),
             _: 1
           }, 8, ["data-clipboard-text", "onClick"]),
-          i(a, {
+          createVNode(_component_a_button, {
             type: "primary",
             class: "copy-vue3-sfc-btn",
-            "data-clipboard-text": o.sfcCodeV3,
-            onClick: l.copyV3SFC
+            "data-clipboard-text": $data.sfcCodeV3,
+            onClick: $options.copyV3SFC
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.copyVue3SFC")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.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)
+          createVNode(_component_a_button, { onClick: $options.saveV2SFC }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.saveVue2SFC")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, { onClick: l.saveV3SFC }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.saveVue3SFC")), 1)
+          createVNode(_component_a_button, { onClick: $options.saveV3SFC }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.saveVue3SFC")), 1)
             ]),
             _: 1
           }, 8, ["onClick"]),
-          i(a, {
-            onClick: t[18] || (t[18] = (r) => o.showExportSFCDialogFlag = !1)
+          createVNode(_component_a_button, {
+            onClick: _cache[18] || (_cache[18] = ($event) => $data.showExportSFCDialogFlag = false)
           }, {
-            default: n(() => [
-              u(c(e.i18nt("designer.hint.closePreview")), 1)
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.i18nt("designer.hint.closePreview")), 1)
             ]),
             _: 1
           })
         ])
       ]),
-      default: n(() => [
-        i(S, {
+      default: withCtx(() => [
+        createVNode(_component_a_tabs, {
           type: "border-card",
           class: "no-box-shadow no-padding",
-          activeKey: o.activeSFCTab,
-          "onUpdate:activeKey": t[17] || (t[17] = (r) => o.activeSFCTab = r)
+          activeKey: $data.activeSFCTab,
+          "onUpdate:activeKey": _cache[17] || (_cache[17] = ($event) => $data.activeSFCTab = $event)
         }, {
-          default: n(() => [
-            i(k, {
+          default: withCtx(() => [
+            createVNode(_component_a_tab_pane, {
               tab: "Vue2",
               key: "vue2"
             }, {
-              default: n(() => [
-                i(F, {
+              default: withCtx(() => [
+                createVNode(_component_code_editor, {
                   mode: "html",
-                  readonly: !0,
-                  modelValue: o.sfcCode,
-                  "onUpdate:modelValue": t[15] || (t[15] = (r) => o.sfcCode = r),
-                  "user-worker": !1
+                  readonly: true,
+                  modelValue: $data.sfcCode,
+                  "onUpdate:modelValue": _cache[15] || (_cache[15] = ($event) => $data.sfcCode = $event),
+                  "user-worker": false
                 }, null, 8, ["modelValue"])
               ]),
               _: 1
             }),
-            i(k, {
+            createVNode(_component_a_tab_pane, {
               tab: "Vue3",
               key: "vue3"
             }, {
-              default: n(() => [
-                i(F, {
+              default: withCtx(() => [
+                createVNode(_component_code_editor, {
                   mode: "html",
-                  readonly: !0,
-                  modelValue: o.sfcCodeV3,
-                  "onUpdate:modelValue": t[16] || (t[16] = (r) => o.sfcCodeV3 = r),
-                  "user-worker": !1
+                  readonly: true,
+                  modelValue: $data.sfcCodeV3,
+                  "onUpdate:modelValue": _cache[16] || (_cache[16] = ($event) => $data.sfcCodeV3 = $event),
+                  "user-worker": false
                 }, null, 8, ["modelValue"])
               ]),
               _: 1
@@ -1701,10 +1785,10 @@ function se(e, t, s, d, o, l) {
         }, 8, ["activeKey"])
       ]),
       _: 1
-    }, 8, ["title", "visible"])) : y("", !0)
+    }, 8, ["title", "visible"])) : createCommentVNode("", true)
   ]);
 }
-const ve = /* @__PURE__ */ Q(G, [["render", se], ["__scopeId", "data-v-5efa2dd6"]]);
+const ToolbarPanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-5efa2dd6"]]);
 export {
-  ve as default
+  ToolbarPanel as default
 };