@kp-ui/lowcode 1.0.105 → 1.0.106

package/src/components/form-designer/form-widget/index.vue.js

@@ -0,0 +1,200 @@
+import p from "./field-widget/index.js";
+import C from "../../../utils/i18n.js";
+import v from "../../../lib/vuedraggable/src/vuedraggable.js";
+import D from "../../form-render/SubmitButtonRender.vue.js";
+import { resolveComponent as s, createBlock as a, openBlock as r, withCtx as d, createElementVNode as g, createVNode as f, normalizeClass as _, createElementBlock as b, createCommentVNode as y, toDisplayString as w, normalizeStyle as x, mergeProps as F, resolveDynamicComponent as m } from "vue";
+/* empty css           */
+import L from "../../../../_virtual/_plugin-vue_export-helper.js";
+const R = {
+  name: "VFormWidget",
+  componentName: "VFormWidget",
+  mixins: [C],
+  components: {
+    Draggable: v,
+    SubmitButtonRender: D,
+    ...p
+  },
+  props: {
+    designer: Object,
+    formConfig: Object,
+    optionData: {
+      //prop传入的选项数据
+      type: Object,
+      default: () => ({})
+    },
+    globalDsv: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  provide() {
+    return {
+      refList: this.widgetRefList,
+      getFormConfig: () => this.formConfig,
+      getGlobalDsv: () => this.globalDsv,
+      // 全局数据源变量
+      globalOptionData: this.optionData,
+      getOptionData: () => this.optionData,
+      getReadMode: () => !1,
+      globalModel: {
+        formModel: this.formModel
+      },
+      getSubFormFieldFlag: () => !1,
+      getSubFormName: () => "",
+      getDSResultCache: () => this.dsResultCache
+    };
+  },
+  inject: ["getDesignerConfig"],
+  data() {
+    return {
+      formModel: {},
+      widgetRefList: {},
+      dsResultCache: {}
+    };
+  },
+  computed: {
+    labelPosition() {
+      return this.designer.formConfig && this.designer.formConfig.labelPosition ? this.designer.formConfig.labelPosition : "horizontal";
+    },
+    size() {
+      return this.designer.formConfig && this.designer.formConfig.size ? this.designer.formConfig.size : "default";
+    },
+    customClass() {
+      return this.designer.formConfig.customClass || "";
+    },
+    layoutType() {
+      return this.designer.getLayoutType();
+    },
+    canvasMinHeight() {
+      return this.getDesignerConfig().logoHeader !== !1 ? "calc(100vh - 56px - 68px)" : "calc(100vh - 56px - 68px + 48px)";
+    }
+  },
+  watch: {
+    "designer.widgetList": {
+      deep: !0,
+      handler(e) {
+      }
+    },
+    "designer.formConfig": {
+      deep: !0,
+      handler(e) {
+      }
+    }
+  },
+  created() {
+    this.designer.initDesigner(!!this.getDesignerConfig().resetFormJson), this.designer.loadPresetCssCode(this.getDesignerConfig().presetCssCode);
+  },
+  mounted() {
+    this.disableFirefoxDefaultDrop(), this.designer.registerFormWidget(this);
+  },
+  methods: {
+    getWidgetName(e) {
+      return e.type + "-widget";
+    },
+    disableFirefoxDefaultDrop() {
+      navigator.userAgent.toLowerCase().indexOf("firefox") !== -1 && (document.body.ondrop = function(n) {
+        n.stopPropagation(), n.preventDefault();
+      });
+    },
+    onDragEnd(e) {
+    },
+    onDragAdd(e) {
+      const n = e.newIndex;
+      this.designer.widgetList[n] && this.designer.setSelected(this.designer.widgetList[n]), this.designer.emitHistoryChange(), this.designer.emitEvent("field-selected", null);
+    },
+    onDragUpdate() {
+      this.designer.emitHistoryChange();
+    },
+    checkMove(e) {
+      return this.designer.checkWidgetMove(e);
+    },
+    getFormData() {
+      return this.formModel;
+    },
+    getWidgetRef(e, n = !1) {
+      const i = this.widgetRefList[e];
+      return !i && n && this.$message.error(this.i18nt("designer.hint.refNotFound") + e), i;
+    },
+    getSelectedWidgetRef() {
+      const e = this.designer.selectedWidgetName;
+      return this.getWidgetRef(e);
+    },
+    clearWidgetRefList() {
+      Object.keys(this.widgetRefList).forEach((e) => {
+        delete this.widgetRefList[e];
+      });
+    }
+  }
+}, z = { class: "form-widget-container" }, W = {
+  key: 0,
+  class: "no-widget-hint"
+}, k = { class: "transition-group-el" };
+function M(e, n, i, N, E, t) {
+  const c = s("draggable"), h = s("a-form"), u = s("a-config-provider");
+  return r(), a(u, {
+    "component-size": t.size,
+    input: { autocomplete: "off" }
+  }, {
+    default: d(() => [
+      g("div", z, [
+        f(h, {
+          class: _(["full-height-width widget-form tpf-form", [t.customClass, t.layoutType + "-layout"]]),
+          layout: ["horizontal", "vertical", "inline"].includes(t.labelPosition) ? t.labelPosition : "horizontal",
+          size: t.size,
+          "validate-on-rule-change": !1
+        }, {
+          default: d(() => [
+            i.designer.widgetList.length === 0 ? (r(), b("div", W, w(e.i18nt("designer.noWidgetHint")), 1)) : y("", !0),
+            g("div", {
+              class: "form-widget-canvas",
+              style: x({ minHeight: t.canvasMinHeight })
+            }, [
+              f(c, F({
+                list: i.designer.widgetList,
+                "item-key": "id"
+              }, { group: "dragGroup", ghostClass: "ghost", animation: 300 }, {
+                tag: "transition-group",
+                "component-data": { name: "fade" },
+                handle: ".drag-handler",
+                onEnd: t.onDragEnd,
+                onAdd: t.onDragAdd,
+                onUpdate: t.onDragUpdate,
+                move: t.checkMove
+              }), {
+                item: d(({ element: o, index: l }) => [
+                  g("div", k, [
+                    o.category === "container" ? (r(), a(m(t.getWidgetName(o)), {
+                      widget: o,
+                      designer: i.designer,
+                      key: o.id,
+                      "parent-list": i.designer.widgetList,
+                      "index-of-parent-list": l,
+                      "parent-widget": null,
+                      "design-state": !0
+                    }, null, 8, ["widget", "designer", "parent-list", "index-of-parent-list"])) : (r(), a(m(t.getWidgetName(o)), {
+                      field: o,
+                      designer: i.designer,
+                      key: o.id,
+                      "parent-list": i.designer.widgetList,
+                      "index-of-parent-list": l,
+                      "parent-widget": null,
+                      "design-state": !0
+                    }, null, 8, ["field", "designer", "parent-list", "index-of-parent-list"]))
+                  ])
+                ]),
+                _: 1
+              }, 16, ["list", "onEnd", "onAdd", "onUpdate", "move"])
+            ], 4)
+          ]),
+          _: 1
+        }, 8, ["layout", "class", "size"])
+      ])
+    ]),
+    _: 1
+  }, 8, ["component-size"]);
+}
+const B = /* @__PURE__ */ L(R, [["render", M], ["__scopeId", "data-v-14f2c2f3"]]);
+export {
+  B as default
+};
+//# sourceMappingURL=index.vue.js.map

package/src/components/form-designer/form-widget/index.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.vue.js","sources":["../../../../../src/components/form-designer/form-widget/index.vue"],"sourcesContent":["<template>\n    <a-config-provider :component-size=\"size\" :input=\"{ autocomplete: 'off' }\">\n        <div class=\"form-widget-container\">\n            <a-form\n                class=\"full-height-width widget-form tpf-form\"\n                :layout=\"\n                    ['horizontal', 'vertical', 'inline'].includes(labelPosition)\n                        ? labelPosition\n                        : 'horizontal'\n                \"\n                :class=\"[customClass, layoutType + '-layout']\"\n                :size=\"size\"\n                :validate-on-rule-change=\"false\"\n            >\n                <template v-if=\"designer.widgetList.length === 0\">\n                    <div class=\"no-widget-hint\">{{ i18nt('designer.noWidgetHint') }}</div>\n                </template>\n\n                <div class=\"form-widget-canvas\" :style=\"{ minHeight: canvasMinHeight }\">\n                    <draggable\n                        :list=\"designer.widgetList\"\n                        item-key=\"id\"\n                        v-bind=\"{ group: 'dragGroup', ghostClass: 'ghost', animation: 300 }\"\n                        tag=\"transition-group\"\n                        :component-data=\"{ name: 'fade' }\"\n                        handle=\".drag-handler\"\n                        @end=\"onDragEnd\"\n                        @add=\"onDragAdd\"\n                        @update=\"onDragUpdate\"\n                        :move=\"checkMove\"\n                    >\n                        <template #item=\"{ element: widget, index }\">\n                            <div class=\"transition-group-el\">\n                                <template v-if=\"'container' === widget.category\">\n                                    <component\n                                        :is=\"getWidgetName(widget)\"\n                                        :widget=\"widget\"\n                                        :designer=\"designer\"\n                                        :key=\"widget.id\"\n                                        :parent-list=\"designer.widgetList\"\n                                        :index-of-parent-list=\"index\"\n                                        :parent-widget=\"null\"\n                                        :design-state=\"true\"\n                                    />\n                                </template>\n                                <template v-else>\n                                    <component\n                                        :is=\"getWidgetName(widget)\"\n                                        :field=\"widget\"\n                                        :designer=\"designer\"\n                                        :key=\"widget.id\"\n                                        :parent-list=\"designer.widgetList\"\n                                        :index-of-parent-list=\"index\"\n                                        :parent-widget=\"null\"\n                                        :design-state=\"true\"\n                                    />\n                                </template>\n                            </div>\n                        </template>\n                    </draggable>\n                </div>\n            </a-form>\n        </div>\n    </a-config-provider>\n</template>\n\n<script>\n    import FieldComponents from '@/components/form-designer/form-widget/field-widget';\n    import i18n from '@/utils/i18n';\n    import Draggable from '@/lib/vuedraggable/src/vuedraggable';\n    import SubmitButtonRender from '@/components/form-render/SubmitButtonRender.vue';\n\n    export default {\n        name: 'VFormWidget',\n        componentName: 'VFormWidget',\n        mixins: [i18n],\n        components: {\n            Draggable,\n            SubmitButtonRender,\n            ...FieldComponents\n        },\n        props: {\n            designer: Object,\n            formConfig: Object,\n            optionData: {\n                //prop传入的选项数据\n                type: Object,\n                default: () => ({})\n            },\n            globalDsv: {\n                type: Object,\n                default: () => ({})\n            }\n        },\n        provide() {\n            return {\n                refList: this.widgetRefList,\n                getFormConfig: () =>\n                    this.formConfig /* 解决provide传递formConfig属性的响应式更新问题！！ */,\n                getGlobalDsv: () => this.globalDsv, // 全局数据源变量\n                globalOptionData: this.optionData,\n                getOptionData: () => this.optionData,\n                getReadMode: () => false,\n                globalModel: {\n                    formModel: this.formModel\n                },\n                getSubFormFieldFlag: () => false,\n                getSubFormName: () => '',\n                getDSResultCache: () => this.dsResultCache\n            };\n        },\n        inject: ['getDesignerConfig'],\n        data() {\n            return {\n                formModel: {},\n                widgetRefList: {},\n                dsResultCache: {}\n            };\n        },\n        computed: {\n            labelPosition() {\n                if (!!this.designer.formConfig && !!this.designer.formConfig.labelPosition) {\n                    return this.designer.formConfig.labelPosition;\n                }\n\n                return 'horizontal';\n            },\n\n            size() {\n                if (!!this.designer.formConfig && !!this.designer.formConfig.size) {\n                    return this.designer.formConfig.size;\n                }\n\n                return 'default';\n            },\n\n            customClass() {\n                return this.designer.formConfig.customClass || '';\n            },\n\n            layoutType() {\n                return this.designer.getLayoutType();\n            },\n\n            canvasMinHeight() {\n                return this.getDesignerConfig().logoHeader !== false\n                    ? 'calc(100vh - 56px - 68px)'\n                    : 'calc(100vh - 56px - 68px + 48px)';\n            }\n        },\n        watch: {\n            'designer.widgetList': {\n                deep: true,\n                handler(val) {\n                    //\n                }\n            },\n\n            'designer.formConfig': {\n                deep: true,\n                handler(val) {\n                    //\n                }\n            }\n        },\n        created() {\n            this.designer.initDesigner(!!this.getDesignerConfig().resetFormJson); //此行代码已移动到form-designer，以便提前赋值formConfig！！\n            this.designer.loadPresetCssCode(this.getDesignerConfig().presetCssCode);\n        },\n        mounted() {\n            this.disableFirefoxDefaultDrop(); /* 禁用Firefox默认拖拽搜索功能!! */\n            this.designer.registerFormWidget(this);\n        },\n        methods: {\n            getWidgetName(widget) {\n                return widget.type + '-widget';\n            },\n\n            disableFirefoxDefaultDrop() {\n                const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') !== -1;\n                if (isFirefox) {\n                    document.body.ondrop = function (event) {\n                        event.stopPropagation();\n                        event.preventDefault();\n                    };\n                }\n            },\n\n            onDragEnd(evt) {\n                //console.log('drag end000', evt)\n            },\n\n            onDragAdd(evt) {\n                const newIndex = evt.newIndex;\n                if (!!this.designer.widgetList[newIndex]) {\n                    this.designer.setSelected(this.designer.widgetList[newIndex]);\n                }\n\n                this.designer.emitHistoryChange();\n                this.designer.emitEvent('field-selected', null);\n            },\n\n            onDragUpdate() {\n                /* 在VueDraggable内拖拽组件发生位置变化时会触发update，未发生组件位置变化不会触发！！ */\n                this.designer.emitHistoryChange();\n            },\n\n            checkMove(evt) {\n                return this.designer.checkWidgetMove(evt);\n            },\n\n            getFormData() {\n                return this.formModel;\n            },\n\n            getWidgetRef(widgetName, showError = false) {\n                const foundRef = this.widgetRefList[widgetName];\n                if (!foundRef && !!showError) {\n                    this.$message.error(this.i18nt('designer.hint.refNotFound') + widgetName);\n                }\n                return foundRef;\n            },\n\n            getSelectedWidgetRef() {\n                const wName = this.designer.selectedWidgetName;\n                return this.getWidgetRef(wName);\n            },\n\n            clearWidgetRefList() {\n                Object.keys(this.widgetRefList).forEach(key => {\n                    delete this.widgetRefList[key];\n                });\n            }\n        }\n    };\n</script>\n\n<style lang=\"less\" scoped>\n    .form-widget-container {\n        padding: 5px;\n        background: #f1f2f3;\n\n        overflow-x: hidden;\n        overflow-y: auto;\n        // padding-bottom: 70px;\n        .submit {\n            flex: 1;\n            display: flex;\n            justify-content: end;\n            position: absolute;\n            height: 60px;\n            padding: 0 10px;\n            background: #fff;\n            z-index: 99;\n            bottom: 0;\n            left: 5px;\n            right: 5px;\n        }\n\n        .ant-form.full-height-width {\n            overflow-y: auto;\n            height: 100%;\n            padding: 3px;\n            background: #ffffff;\n\n            .no-widget-hint {\n                position: absolute;\n                left: 0;\n                right: 0;\n                top: 0;\n                bottom: 0;\n                height: 100%;\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                text-align: center;\n                font-size: 18px;\n                color: #999999;\n            }\n\n            .form-widget-canvas {\n                //min-height: calc(100vh - 56px - 68px + 48px);\n                display: flex;\n                flex-direction: column;\n                padding: 3px;\n                position: relative;\n                :deep(.container-wrapper) {\n                    margin: 10px 0;\n                    min-width: 0;\n                }\n                :deep(.field-widget-item),\n                :deep(.container-widget-item) {\n                    margin: 0 0 10px 0;\n                    border: 1px dashed #333;\n                    border-radius: 3px;\n                    background: #eee;\n                    height: 30px;\n                    align-items: center;\n                    display: flex;\n                    justify-content: center;\n                    color: #999999;\n                }\n            }\n        }\n\n        /* 隐藏组件拖拽状态中显示的黑点 */\n        :deep(li.container-widget-item),\n        :deep(li.field-widget-item) {\n            list-style: none;\n        }\n\n        .ant-form.Pad-layout {\n            margin: 0 auto;\n            max-width: 960px;\n            border-radius: 15px;\n            box-shadow: 0 0 1px 10px #495060;\n        }\n        .ant-form.H5-layout {\n            margin: 0 auto;\n            width: 420px;\n            border-radius: 15px;\n            //border-width: 10px;\n            box-shadow: 0 0 1px 10px #495060;\n        }\n        .ant-form.widget-form :deep(.ant-row) {\n            padding: 2px;\n            border: 1px dashed rgba(170, 170, 170, 0.75);\n        }\n    }\n\n    .grid-cell {\n        min-height: 30px;\n        border-right: 1px dotted #cccccc;\n    }\n\n    .fade-enter-active,\n    .fade-leave-active {\n        transition: opacity 0.5s;\n    }\n\n    .fade-enter,\n    .fade-leave-to {\n        opacity: 0;\n    }\n</style>\n"],"names":["_sfc_main","i18n","Draggable","SubmitButtonRender","FieldComponents","val","widget","event","evt","newIndex","widgetName","showError","foundRef","wName","key","_hoisted_1","_hoisted_3","_createBlock","_component_a_config_provider","$options","_createElementVNode","_createVNode","_component_a_form","_normalizeClass","$props","_createElementBlock","_hoisted_2","_toDisplayString","_ctx","_component_draggable","_mergeProps","_withCtx","index","_resolveDynamicComponent"],"mappings":"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"}

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

@@ -0,0 +1,340 @@
+import C from "./widget-panel/index.vue.js";
+import F from "./toolbar-panel/index.vue.js";
+import v from "./setting-panel/index.vue.js";
+import b from "./form-widget/index.vue.js";
+import { createDesigner as w } from "./designer.js";
+import { traverseAllWidgets as y, getAllContainerWidgets as f, getAllFieldWidgets as c, deepClone as m, addWindowResizeHandler as R } from "../../utils/util.js";
+import x, { changeLocale as E } from "../../utils/i18n.js";
+import { isEmpty as J } from "lodash-es";
+import { resolveComponent as o, createBlock as S, openBlock as D, withCtx as s, createVNode as r, createSlots as H, renderList as A, renderSlot as B, createElementVNode as N } from "vue";
+/* empty css           */
+import V from "../../../_virtual/_plugin-vue_export-helper.js";
+const P = {
+  name: "VFormDesigner",
+  componentName: "VFormDesigner",
+  mixins: [x],
+  components: {
+    WidgetPanel: C,
+    ToolbarPanel: F,
+    SettingPanel: v,
+    VFormWidget: b
+  },
+  props: {
+    /* 保存jsonApi */
+    saveJsonApi: {
+      type: Function,
+      default: null
+    },
+    /* 后端字段列表API */
+    fieldListApi: {
+      type: Function,
+      default: null
+    },
+    /* 禁止显示的组件名称数组 */
+    bannedWidgets: {
+      type: Array,
+      default: () => []
+    },
+    /* 设计器配置参数 */
+    designerConfig: {
+      type: Object,
+      default: () => ({
+        languageMenu: !0,
+        //是否显示语言切换菜单
+        // externalLink: true, //是否显示GitHub、文档等外部链接
+        // formTemplates: true, //是否显示表单模板
+        eventCollapse: !0,
+        //是否显示组件事件属性折叠面板
+        widgetNameReadonly: !1,
+        //禁止修改组件名称
+        clearDesignerButton: !0,
+        //是否显示清空设计器按钮
+        previewFormButton: !0,
+        //是否显示预览表单按钮
+        importJsonButton: !0,
+        //是否显示导入JSON按钮
+        exportJsonButton: !0,
+        //是否显示导出JSON器按钮
+        exportCodeButton: !0,
+        //是否显示导出代码按钮
+        // generateSFCButton: true, //是否显示生成SFC按钮
+        toolbarMaxWidth: 450,
+        //设计器工具按钮栏最大宽度（单位像素）
+        toolbarMinWidth: 300,
+        //设计器工具按钮栏最小宽度（单位像素）
+        presetCssCode: "",
+        //设计器预设CSS样式代码
+        resetFormJson: !1
+        //是否在设计器初始化时将表单内容重置为空
+      })
+    },
+    /* 全局数据源变量 */
+    globalDsv: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      leftWidth: 270,
+      rightWidth: 300,
+      curLangName: "",
+      curLocale: "",
+      isLoading: !1,
+      //是否正在加载中
+      vsCodeFlag: !1,
+      caseName: "",
+      scrollerHeight: 0,
+      designer: w(this),
+      fieldList: []
+    };
+  },
+  provide() {
+    return {
+      serverFieldList: () => this.fieldList,
+      getDesignerConfig: () => this.designerConfig,
+      getBannedWidgets: () => this.bannedWidgets
+    };
+  },
+  created() {
+  },
+  mounted() {
+    this.initLocale(), this.scrollerHeight = window.innerHeight - 56 - 36 + "px", R(() => {
+      this.$nextTick(() => {
+        this.scrollerHeight = window.innerHeight - 56 - 36 + "px";
+      });
+    }), this.loadFieldListFromServer();
+  },
+  methods: {
+    setLoading(e) {
+      this.isLoading = e;
+    },
+    changeLeftWidth() {
+      this.leftWidth === 270 ? this.leftWidth = 0 : this.leftWidth = 270;
+    },
+    changeRightWidth() {
+      this.rightWidth === 300 ? this.rightWidth = 0 : this.rightWidth = 300;
+    },
+    /**
+     * json回填
+     * @param {*} importObj
+     */
+    setJsonImport(e = {}) {
+      if (!J(e))
+        try {
+          if (!e || !e.formConfig)
+            throw new Error(this.i18nt("designer.hint.invalidJsonFormat"));
+          this.designer.loadFormJson(e), this.designer.emitHistoryChange(), this.designer.emitEvent("form-json-imported", []);
+        } catch (t) {
+          this.$message.error(t + "");
+        }
+    },
+    testEEH(e, t) {
+      console.log("test", e), console.log("test222222", t);
+    },
+    changeLanguage(e) {
+      E(e);
+    },
+    initLocale() {
+      this.curLocale = localStorage.getItem("lowcode_local"), this.vsCodeFlag ? this.curLocale = this.curLocale || "en-US" : this.curLocale = this.curLocale || "zh-CN", this.curLangName = this.i18nt("application." + this.curLocale), this.changeLanguage(this.curLocale);
+    },
+    async loadFieldListFromServer() {
+      this.fieldListApi && (this.fieldList = await this.fieldListApi(), console.log("this.fieldList: ", this.fieldList));
+    },
+    setFormJson(e) {
+      console.log("formJson: ", e);
+      let t = !1;
+      e && (typeof e == "string" ? t = this.designer.loadFormJson(JSON.parse(e)) : e.constructor === Object && (t = this.designer.loadFormJson(e)), t && this.designer.emitHistoryChange());
+    },
+    getFormJson() {
+      return {
+        widgetList: m(this.designer.widgetList),
+        formConfig: m(this.designer.formConfig)
+      };
+    },
+    clearDesigner() {
+      this.$refs.toolbarRef.clearFormWidget();
+    },
+    /**
+     * 刷新表单设计器
+     */
+    refreshDesigner() {
+      const e = this.getFormJson();
+      this.designer.clearDesigner(!0), this.designer.loadFormJson(e);
+    },
+    /**
+     * 预览表单
+     */
+    previewForm() {
+      this.$refs.toolbarRef.previewForm();
+    },
+    /**
+     * 导入表单JSON
+     */
+    importJson() {
+      this.$refs.toolbarRef.importJson();
+    },
+    /**
+     * 导出表单JSON
+     */
+    exportJson() {
+      this.$refs.toolbarRef.exportJson();
+    },
+    /**
+     * 导出Vue/HTML代码
+     */
+    exportCode() {
+      this.$refs.toolbarRef.exportCode();
+    },
+    /**
+     * 生成SFC代码
+     */
+    generateSFC() {
+      this.$refs.toolbarRef.generateSFC();
+    },
+    /**
+     * 获取所有字段组件
+     * @returns {*[]}
+     */
+    getFieldWidgets(e = null) {
+      return e ? c(e) : c(this.designer.widgetList);
+    },
+    /**
+     * 获取所有容器组件
+     * @returns {*[]}
+     */
+    getContainerWidgets(e = null) {
+      return e ? f(e) : f(this.designer.widgetList);
+    },
+    /**
+     * 升级表单json，以补充最新的组件属性
+     * @param formJson
+     */
+    upgradeFormJson(e) {
+      if (!e.widgetList || !e.formConfig) {
+        this.$message.error("Invalid form json!");
+        return;
+      }
+      return y(e.widgetList, (t) => {
+        this.designer.upgradeWidgetConfig(t);
+      }), this.designer.upgradeFormConfig(e.formConfig), e;
+    },
+    getWidgetRef(e, t = !1) {
+      return this.$refs.formRef.getWidgetRef(e, t);
+    },
+    getSelectedWidgetRef() {
+      return this.$refs.formRef.getSelectedWidgetRef();
+    },
+    /**
+     * 添加数据源对象
+     * @param dsObj
+     */
+    addDataSource(e) {
+      this.designer.formConfig.dataSources.push(e);
+    },
+    /**
+     * 增加外部组件引用，可通过getEC()方法获取外部组件，以便在VForm内部调用外部组件方法
+     * @param componentName 外部组件名称
+     * @param externalComponent 外部组件实例
+     */
+    addEC(e, t) {
+      this.externalComponents[e] = t;
+    },
+    /**
+     * 判断外部组件是否可获取
+     * @param componentName 外部组件名称
+     * @returns {boolean}
+     */
+    hasEC(e) {
+      return this.externalComponents.hasOwnProperty(e);
+    },
+    /**
+     * 获取外部组件实例
+     * @param componentName
+     * @returns {*}
+     */
+    getEC(e) {
+      return this.externalComponents[e];
+    }
+    //TODO: 增加更多方法！！
+  }
+}, I = { class: "container-scroll-bar" };
+function k(e, t, n, M, i, l) {
+  const u = o("WidgetPanel"), d = o("a-layout-sider"), p = o("toolbar-panel"), W = o("a-layout-header"), _ = o("VFormWidget"), a = o("a-layout-content"), L = o("setting-panel"), g = o("a-layout");
+  return D(), S(g, { class: "main-container full-height" }, {
+    default: s(() => [
+      r(g, null, {
+        default: s(() => [
+          r(d, {
+            width: i.leftWidth,
+            class: "side-panel"
+          }, {
+            default: s(() => [
+              r(u, { designer: i.designer }, null, 8, ["designer"])
+            ]),
+            _: 1
+          }, 8, ["width"]),
+          r(a, { class: "center-layout-container" }, {
+            default: s(() => [
+              r(W, { class: "toolbar-header" }, {
+                default: s(() => [
+                  r(p, {
+                    saveJsonApi: n.saveJsonApi,
+                    designer: i.designer,
+                    "global-dsv": n.globalDsv,
+                    changeLeftWidth: l.changeLeftWidth,
+                    changeRightWidth: l.changeRightWidth,
+                    leftWidth: i.leftWidth,
+                    rightWidth: i.rightWidth,
+                    ref: "toolbarRef"
+                  }, H({ _: 2 }, [
+                    A(e.$slots, (j, h) => ({
+                      name: h,
+                      fn: s(() => [
+                        B(e.$slots, h, {}, void 0, !0)
+                      ])
+                    }))
+                  ]), 1032, ["saveJsonApi", "designer", "global-dsv", "changeLeftWidth", "changeRightWidth", "leftWidth", "rightWidth"])
+                ]),
+                _: 3
+              }),
+              r(a, { class: "form-widget-main" }, {
+                default: s(() => [
+                  N("div", I, [
+                    r(_, {
+                      designer: i.designer,
+                      "form-config": i.designer.formConfig,
+                      "global-dsv": n.globalDsv,
+                      ref: "formRef"
+                    }, null, 8, ["designer", "form-config", "global-dsv"])
+                  ])
+                ]),
+                _: 1
+              })
+            ]),
+            _: 3
+          }),
+          r(d, { width: i.rightWidth }, {
+            default: s(() => [
+              r(L, {
+                designer: i.designer,
+                "selected-widget": i.designer.selectedWidget,
+                "global-dsv": n.globalDsv,
+                "form-config": i.designer.formConfig,
+                onEditEventHandler: l.testEEH
+              }, null, 8, ["designer", "selected-widget", "global-dsv", "form-config", "onEditEventHandler"])
+            ]),
+            _: 1
+          }, 8, ["width"])
+        ]),
+        _: 3
+      })
+    ]),
+    _: 3
+  });
+}
+const $ = /* @__PURE__ */ V(P, [["render", k], ["__scopeId", "data-v-6c1a72a4"]]);
+export {
+  $ as default
+};
+//# sourceMappingURL=index.vue.js.map

package/src/components/form-designer/index.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.vue.js","sources":["../../../../src/components/form-designer/index.vue"],"sourcesContent":["<template>\n    <a-layout class=\"main-container full-height\">\n        <a-layout>\n            <a-layout-sider :width=\"leftWidth\" class=\"side-panel\">\n                <WidgetPanel :designer=\"designer\" />\n            </a-layout-sider>\n\n            <a-layout-content class=\"center-layout-container\">\n                <a-layout-header class=\"toolbar-header\">\n                    <toolbar-panel\n                        :saveJsonApi=\"saveJsonApi\"\n                        :designer=\"designer\"\n                        :global-dsv=\"globalDsv\"\n                        :changeLeftWidth=\"changeLeftWidth\"\n                        :changeRightWidth=\"changeRightWidth\"\n                        :leftWidth=\"leftWidth\"\n                        :rightWidth=\"rightWidth\"\n                        ref=\"toolbarRef\"\n                    >\n                        <template v-for=\"(idx, slotName) in $slots\" #[slotName]>\n                            <slot :name=\"slotName\"></slot>\n                        </template>\n                    </toolbar-panel>\n                </a-layout-header>\n                <a-layout-content class=\"form-widget-main\">\n                    <div class=\"container-scroll-bar\">\n                        <VFormWidget\n                            :designer=\"designer\"\n                            :form-config=\"designer.formConfig\"\n                            :global-dsv=\"globalDsv\"\n                            ref=\"formRef\"\n                        />\n                    </div>\n                </a-layout-content>\n            </a-layout-content>\n            <a-layout-sider :width=\"rightWidth\">\n                <setting-panel\n                    :designer=\"designer\"\n                    :selected-widget=\"designer.selectedWidget\"\n                    :global-dsv=\"globalDsv\"\n                    :form-config=\"designer.formConfig\"\n                    @edit-event-handler=\"testEEH\"\n                />\n            </a-layout-sider>\n        </a-layout>\n    </a-layout>\n</template>\n\n<script>\n    import WidgetPanel from './widget-panel/index.vue';\n    import ToolbarPanel from './toolbar-panel/index.vue';\n    import SettingPanel from './setting-panel/index.vue';\n    import VFormWidget from './form-widget/index.vue';\n    import { createDesigner } from '@/components/form-designer/designer';\n    import {\n        addWindowResizeHandler,\n        deepClone,\n        getAllContainerWidgets,\n        getAllFieldWidgets,\n        traverseAllWidgets\n    } from '@/utils/util';\n    import i18n, { changeLocale } from '@/utils/i18n';\n    import { isEmpty } from 'lodash-es';\n\n    export default {\n        name: 'VFormDesigner',\n        componentName: 'VFormDesigner',\n        mixins: [i18n],\n        components: {\n            WidgetPanel,\n            ToolbarPanel,\n            SettingPanel,\n            VFormWidget\n        },\n        props: {\n            /* 保存jsonApi */\n\n            saveJsonApi: {\n                type: Function,\n                default: null\n            },\n            /* 后端字段列表API */\n            fieldListApi: {\n                type: Function,\n                default: null\n            },\n\n            /* 禁止显示的组件名称数组 */\n            bannedWidgets: {\n                type: Array,\n                default: () => []\n            },\n            /* 设计器配置参数 */\n            designerConfig: {\n                type: Object,\n                default: () => {\n                    return {\n                        languageMenu: true, //是否显示语言切换菜单\n                        // externalLink: true, //是否显示GitHub、文档等外部链接\n                        // formTemplates: true, //是否显示表单模板\n                        eventCollapse: true, //是否显示组件事件属性折叠面板\n                        widgetNameReadonly: false, //禁止修改组件名称\n\n                        clearDesignerButton: true, //是否显示清空设计器按钮\n                        previewFormButton: true, //是否显示预览表单按钮\n                        importJsonButton: true, //是否显示导入JSON按钮\n                        exportJsonButton: true, //是否显示导出JSON器按钮\n                        exportCodeButton: true, //是否显示导出代码按钮\n                        // generateSFCButton: true, //是否显示生成SFC按钮\n\n                        toolbarMaxWidth: 450, //设计器工具按钮栏最大宽度（单位像素）\n                        toolbarMinWidth: 300, //设计器工具按钮栏最小宽度（单位像素）\n\n                        presetCssCode: '', //设计器预设CSS样式代码\n\n                        resetFormJson: false //是否在设计器初始化时将表单内容重置为空\n                    };\n                }\n            },\n\n            /* 全局数据源变量 */\n            globalDsv: {\n                type: Object,\n                default: () => ({})\n            }\n        },\n        data() {\n            return {\n                leftWidth: 270,\n                rightWidth: 300,\n                curLangName: '',\n                curLocale: '',\n                isLoading: false, //是否正在加载中\n                vsCodeFlag: false,\n                caseName: '',\n\n                scrollerHeight: 0,\n\n                designer: createDesigner(this),\n\n                fieldList: []\n            };\n        },\n        provide() {\n            return {\n                serverFieldList: () => this.fieldList,\n                getDesignerConfig: () => this.designerConfig,\n                getBannedWidgets: () => this.bannedWidgets\n            };\n        },\n        created() {\n            // this.vsCodeFlag = getQueryParam('vscode') == 1;\n            // this.caseName = getQueryParam('case');\n        },\n        mounted() {\n            this.initLocale();\n\n            this.scrollerHeight = window.innerHeight - 56 - 36 + 'px';\n            addWindowResizeHandler(() => {\n                this.$nextTick(() => {\n                    this.scrollerHeight = window.innerHeight - 56 - 36 + 'px';\n                });\n            });\n\n            this.loadFieldListFromServer();\n        },\n        methods: {\n            setLoading(flag) {\n                this.isLoading = flag;\n            },\n            changeLeftWidth() {\n                if (this.leftWidth === 270) {\n                    this.leftWidth = 0;\n                } else {\n                    this.leftWidth = 270;\n                }\n            },\n            changeRightWidth() {\n                if (this.rightWidth === 300) {\n                    this.rightWidth = 0;\n                } else {\n                    this.rightWidth = 300;\n                }\n            },\n            /**\n             * json回填\n             * @param {*} importObj\n             */\n            setJsonImport(importObj = {}) {\n                if (isEmpty(importObj)) return;\n                try {\n                    if (!importObj || !importObj.formConfig) {\n                        throw new Error(this.i18nt('designer.hint.invalidJsonFormat'));\n                    }\n\n                    // const fJsonVer = importObj?.formConfig?.jsonVersion || '';\n                    // if (!fJsonVer || fJsonVer !== 3) {\n                    //   throw new Error(this.i18nt('designer.hint.jsonVersionMismatch'));\n                    // }\n\n                    this.designer.loadFormJson(importObj);\n\n                    this.designer.emitHistoryChange();\n\n                    this.designer.emitEvent('form-json-imported', []);\n                } catch (ex) {\n                    this.$message.error(ex + '');\n                }\n            },\n            testEEH(eventName, eventParams) {\n                console.log('test', eventName);\n                console.log('test222222', eventParams);\n            },\n\n            changeLanguage(langName) {\n                changeLocale(langName);\n            },\n            initLocale() {\n                this.curLocale = localStorage.getItem('lowcode_local');\n                if (!!this.vsCodeFlag) {\n                    this.curLocale = this.curLocale || 'en-US';\n                } else {\n                    this.curLocale = this.curLocale || 'zh-CN';\n                }\n                this.curLangName = this.i18nt('application.' + this.curLocale);\n                this.changeLanguage(this.curLocale);\n            },\n\n            async loadFieldListFromServer() {\n                if (!this.fieldListApi) {\n                    return;\n                }\n                this.fieldList = await this.fieldListApi();\n                console.log('this.fieldList: ', this.fieldList);\n            },\n            setFormJson(formJson) {\n                console.log('formJson: ', formJson);\n                let modifiedFlag = false;\n                if (!!formJson) {\n                    if (typeof formJson === 'string') {\n                        //TODO\n                        modifiedFlag = this.designer.loadFormJson(JSON.parse(formJson));\n                    } else if (formJson.constructor === Object) {\n                        modifiedFlag = this.designer.loadFormJson(formJson);\n                    }\n\n                    if (modifiedFlag) {\n                        this.designer.emitHistoryChange();\n                    }\n                }\n            },\n\n            getFormJson() {\n                return {\n                    widgetList: deepClone(this.designer.widgetList),\n                    formConfig: deepClone(this.designer.formConfig)\n                };\n            },\n\n            clearDesigner() {\n                this.$refs.toolbarRef.clearFormWidget();\n            },\n\n            /**\n             * 刷新表单设计器\n             */\n            refreshDesigner() {\n                //this.designer.loadFormJson( this.getFormJson() )  //只有第一次调用生效？？\n\n                const fJson = this.getFormJson();\n                this.designer.clearDesigner(true); //不触发历史记录变更\n                this.designer.loadFormJson(fJson);\n            },\n\n            /**\n             * 预览表单\n             */\n            previewForm() {\n                this.$refs.toolbarRef.previewForm();\n            },\n\n            /**\n             * 导入表单JSON\n             */\n            importJson() {\n                this.$refs.toolbarRef.importJson();\n            },\n\n            /**\n             * 导出表单JSON\n             */\n            exportJson() {\n                this.$refs.toolbarRef.exportJson();\n            },\n\n            /**\n             * 导出Vue/HTML代码\n             */\n            exportCode() {\n                this.$refs.toolbarRef.exportCode();\n            },\n\n            /**\n             * 生成SFC代码\n             */\n            generateSFC() {\n                this.$refs.toolbarRef.generateSFC();\n            },\n\n            /**\n             * 获取所有字段组件\n             * @returns {*[]}\n             */\n            getFieldWidgets(widgetList = null) {\n                return !!widgetList\n                    ? getAllFieldWidgets(widgetList)\n                    : getAllFieldWidgets(this.designer.widgetList);\n            },\n\n            /**\n             * 获取所有容器组件\n             * @returns {*[]}\n             */\n            getContainerWidgets(widgetList = null) {\n                return !!widgetList\n                    ? getAllContainerWidgets(widgetList)\n                    : getAllContainerWidgets(this.designer.widgetList);\n            },\n\n            /**\n             * 升级表单json，以补充最新的组件属性\n             * @param formJson\n             */\n            upgradeFormJson(formJson) {\n                if (!formJson.widgetList || !formJson.formConfig) {\n                    this.$message.error('Invalid form json!');\n                    return;\n                }\n\n                traverseAllWidgets(formJson.widgetList, w => {\n                    this.designer.upgradeWidgetConfig(w);\n                });\n                this.designer.upgradeFormConfig(formJson.formConfig);\n\n                return formJson;\n            },\n\n            getWidgetRef(widgetName, showError = false) {\n                return this.$refs['formRef'].getWidgetRef(widgetName, showError);\n            },\n\n            getSelectedWidgetRef() {\n                return this.$refs['formRef'].getSelectedWidgetRef();\n            },\n\n            /**\n             * 添加数据源对象\n             * @param dsObj\n             */\n            addDataSource(dsObj) {\n                this.designer.formConfig.dataSources.push(dsObj);\n            },\n\n            /**\n             * 增加外部组件引用，可通过getEC()方法获取外部组件，以便在VForm内部调用外部组件方法\n             * @param componentName 外部组件名称\n             * @param externalComponent 外部组件实例\n             */\n            addEC(componentName, externalComponent) {\n                this.externalComponents[componentName] = externalComponent;\n            },\n\n            /**\n             * 判断外部组件是否可获取\n             * @param componentName 外部组件名称\n             * @returns {boolean}\n             */\n            hasEC(componentName) {\n                return this.externalComponents.hasOwnProperty(componentName);\n            },\n\n            /**\n             * 获取外部组件实例\n             * @param componentName\n             * @returns {*}\n             */\n            getEC(componentName) {\n                return this.externalComponents[componentName];\n            }\n\n            //TODO: 增加更多方法！！\n        }\n    };\n</script>\n\n<style lang=\"scss\" scoped>\n    .ant-layout.main-container {\n        background: #fff;\n\n        .ant-layout-sider {\n            background: #fff;\n        }\n\n        :deep(aside) {\n            /* 防止aside样式被外部样式覆盖！！ */\n            margin: 0;\n            padding: 0;\n            background: inherit;\n        }\n    }\n\n    .ant-layout.full-height {\n        height: 100%;\n        overflow-y: hidden;\n    }\n\n    .ant-layout-content.center-layout-container {\n        min-width: 680px;\n        border-left: 2px dotted #ebeef5;\n        border-right: 2px dotted #ebeef5;\n        display: flex;\n        flex-direction: column;\n    }\n    .form-widget-footer {\n        flex: 0 0 50px;\n        align-items: center;\n        background: #fff;\n        display: flex;\n        justify-content: space-between;\n        padding: 0 15px;\n    }\n\n    .ant-layout-header.main-header {\n        border-bottom: 2px dotted #ebeef5;\n        background: #fff;\n        padding: 0;\n\n        height: 48px !important;\n        line-height: 48px !important;\n        min-width: 800px;\n    }\n\n    div.main-title {\n        font-size: 18px;\n        color: #242424;\n        display: flex;\n        align-items: center;\n        justify-items: center;\n\n        img {\n            cursor: pointer;\n            width: 36px;\n            height: 36px;\n        }\n\n        span.bold {\n            font-size: 20px;\n            font-weight: bold;\n            margin: 0 6px 0 6px;\n        }\n\n        span.version-span {\n            font-size: 14px;\n            color: #101f1c;\n            margin-left: 6px;\n        }\n    }\n\n    .float-left {\n        float: left;\n    }\n\n    .float-right {\n        float: right;\n    }\n\n    div.external-link {\n        display: flex;\n        align-items: center;\n\n        a {\n            font-size: 13px;\n            text-decoration: none;\n            margin-right: 10px;\n            color: #606266;\n        }\n    }\n\n    .ant-layout-header.toolbar-header {\n        font-size: 14px;\n        border-bottom: 1px dotted #cccccc;\n        height: 42px !important;\n        background: #fff;\n        padding: 0;\n    }\n\n    .ant-layout-sider.side-panel {\n        width: 260px !important;\n        overflow-y: hidden;\n    }\n    // .left-aside-toggle-bar {\n    //   position: relative;\n    //   width: 0px;\n    //   .icons {\n    //     position: absolute;\n    //     right: 100%;\n    //     top: 50%;\n    //     transform: translate(100%, -50%);\n    //     z-index: 9999;\n    //     background: #fff;\n    //     width: 12px !important;\n    //     height: 36px !important;\n    //   }\n    // }\n\n    .ant-layout-content.form-widget-main {\n        padding: 0;\n        position: relative;\n        overflow-x: hidden;\n        flex: 1 0 0;\n    }\n\n    .container-scroll-bar {\n        height: 100%;\n        & > :deep(.form-widget-container) {\n            height: 100%;\n        }\n    }\n</style>\n"],"names":["_sfc_main","i18n","WidgetPanel","ToolbarPanel","SettingPanel","VFormWidget","createDesigner","addWindowResizeHandler","flag","importObj","isEmpty","ex","eventName","eventParams","langName","changeLocale","formJson","modifiedFlag","deepClone","fJson","widgetList","getAllFieldWidgets","getAllContainerWidgets","traverseAllWidgets","w","widgetName","showError","dsObj","componentName","externalComponent","_hoisted_1","_createBlock","_component_a_layout","_createVNode","_component_a_layout_sider","$data","_component_WidgetPanel","_component_a_layout_content","_component_a_layout_header","_component_toolbar_panel","$props","$options","_ctx","idx","slotName","_renderSlot","_createElementVNode","_component_VFormWidget","_component_setting_panel"],"mappings":"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"}

package/src/components/form-designer/refMixinDesign.js

@@ -0,0 +1,19 @@
+const e = {
+  methods: {
+    initRefList() {
+      this.refList !== null && this.widget.options.name && (this.refList[this.widget.options.name] = this);
+    },
+    getWidgetRef(t, s) {
+      const i = this.refList[t];
+      return !i && s && this.$message.error(this.i18nt("render.hint.refNotFound") + t), i;
+    },
+    /* 该方法用于组件重名检查！！ */
+    registerToRefList(t) {
+      this.refList !== null && this.widget.options.name && (t && delete this.refList[t], this.refList[this.widget.options.name] = this);
+    }
+  }
+};
+export {
+  e as default
+};
+//# sourceMappingURL=refMixinDesign.js.map

package/src/components/form-designer/refMixinDesign.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"refMixinDesign.js","sources":["../../../../src/components/form-designer/refMixinDesign.js"],"sourcesContent":["export default {\n  methods: {\n    initRefList() {\n      if (this.refList !== null && !!this.widget.options.name) {\n        this.refList[this.widget.options.name] = this;\n      }\n    },\n\n    getWidgetRef(widgetName, showError) {\n      const foundRef = this.refList[widgetName];\n      if (!foundRef && !!showError) {\n        this.$message.error(this.i18nt('render.hint.refNotFound') + widgetName);\n      }\n      return foundRef;\n    },\n\n    /* 该方法用于组件重名检查！！ */\n    registerToRefList(oldRefName) {\n      if (this.refList !== null && !!this.widget.options.name) {\n        if (!!oldRefName) {\n          delete this.refList[oldRefName];\n        }\n        this.refList[this.widget.options.name] = this;\n      }\n    }\n  }\n};\n"],"names":["refMixinDesign","widgetName","showError","foundRef","oldRefName"],"mappings":"AAAA,MAAAA,IAAe;AAAA,EACb,SAAS;AAAA,IACP,cAAc;AACZ,MAAI,KAAK,YAAY,QAAU,KAAK,OAAO,QAAQ,SACjD,KAAK,QAAQ,KAAK,OAAO,QAAQ,IAAI,IAAI;AAAA,IAE7C;AAAA,IAEA,aAAaC,GAAYC,GAAW;AAClC,YAAMC,IAAW,KAAK,QAAQF,CAAU;AACxC,aAAI,CAACE,KAAcD,KACjB,KAAK,SAAS,MAAM,KAAK,MAAM,yBAAyB,IAAID,CAAU,GAEjEE;AAAA,IACT;AAAA;AAAA,IAGA,kBAAkBC,GAAY;AAC5B,MAAI,KAAK,YAAY,QAAU,KAAK,OAAO,QAAQ,SAC3CA,KACJ,OAAO,KAAK,QAAQA,CAAU,GAEhC,KAAK,QAAQ,KAAK,OAAO,QAAQ,IAAI,IAAI;AAAA,IAE7C;AAAA,EACJ;AACA;"}