@kp-ui/lowcode 1.0.98 → 1.0.99
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/components/form-designer/form-widget/field-widget/select-widget.vue.js +1 -1
- package/src/components/form-designer/form-widget/field-widget/select-widget.vue.js.map +1 -1
- package/src/components/form-designer/index.vue.js +74 -83
- package/src/components/form-designer/index.vue.js.map +1 -1
- package/stats.html +1 -1
- package/styles/style.css +1 -1
- package/types/install.d.ts +0 -26
package/package.json
CHANGED
|
@@ -163,7 +163,7 @@ function z(e, i, t, E, n, p) {
|
|
|
163
163
|
_: 1
|
|
164
164
|
}, 8, ["designer", "field", "rules", "design-state", "parent-widget", "parent-list", "index-of-parent-list", "sub-form-row-index", "sub-form-col-index", "sub-form-row-id"]));
|
|
165
165
|
}
|
|
166
|
-
const H = /* @__PURE__ */ x(R, [["render", z], ["__scopeId", "data-v-
|
|
166
|
+
const H = /* @__PURE__ */ x(R, [["render", z], ["__scopeId", "data-v-25c62f40"]]);
|
|
167
167
|
export {
|
|
168
168
|
H as default
|
|
169
169
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-widget.vue.js","sources":["../../../../../../src/components/form-designer/form-widget/field-widget/select-widget.vue"],"sourcesContent":["<template>\n <form-item-wrapper\n :designer=\"designer\"\n :field=\"field\"\n :rules=\"rules\"\n :design-state=\"designState\"\n :parent-widget=\"parentWidget\"\n :parent-list=\"parentList\"\n :index-of-parent-list=\"indexOfParentList\"\n :sub-form-row-index=\"subFormRowIndex\"\n :sub-form-col-index=\"subFormColIndex\"\n :sub-form-row-id=\"subFormRowId\"\n v-if=\"!handleHidden()\"\n >\n <div class=\"design-select-box\" v-show=\"!isReadMode\">\n <a-select\n ref=\"fieldEditor\"\n v-model:value=\"fieldModel\"\n v-show=\"!isReadMode\"\n :size=\"size\"\n class=\"full-width-input\"\n :disabled=\"handleDisabled()\"\n :allowClear=\"field.options.allowClear\"\n :showArrow=\"true\"\n :dropdownMatchSelectWidth=\"false\"\n :mode=\"field.options.mode\"\n :maxTagCount=\"field.options.maxTagCount\"\n :placeholder=\"field.options.placeholder || i18nt('render.hint.selectPlaceholder')\"\n :onFocus=\"handleFocusCustomEvent\"\n @blur=\"handleBlurCustomEvent\"\n @change=\"handleChangeEvent\"\n :options=\"field.options.optionItems\"\n v-bind=\"selectOps\"\n />\n <!--\n :fieldNames=\"{\n label: field.options.labelKey || 'label',\n value: field.options.valueKey || 'value',\n options: 'options'\n }\"\n @popupScroll=\"onPopupScroll\"\n\n @search=\"remoteQuery\"\n :showSearch=\"field.options.showSearch\"\n -->\n <div v-if=\"field.options.useModal\" class=\"useModal-svg\" @click=\"handleClickIcon\">\n <svg-icon icon-class=\"sousuo\" />\n </div>\n </div>\n <template v-if=\"isReadMode\">\n <a-tooltip placement=\"topLeft\" :title=\"optionLabel\" :overlayStyle=\"{ zIndex: 1000 }\">\n <span class=\"readonly-mode-field\">{{ optionLabel }}</span>\n </a-tooltip>\n </template>\n </form-item-wrapper>\n</template>\n\n<script>\n import FormItemWrapper from './form-item-wrapper';\n import emitter from '@/utils/emitter';\n import i18n, { translate } from '@/utils/i18n';\n import fieldMixin from '@/components/form-designer/form-widget/field-widget/fieldMixin.js';\n import SvgIcon from '@/components/svg-icon';\n import useSelectMixin from '@/mixins/useSelectMixin.js';\n\n export default {\n name: 'select-widget',\n componentName: 'FieldWidget', //必须固定为FieldWidget,用于接收父级组件的broadcast事件\n mixins: [emitter, fieldMixin, i18n, useSelectMixin],\n\n props: {\n field: Object,\n parentWidget: Object,\n parentList: Array,\n indexOfParentList: Number,\n designer: Object,\n\n designState: {\n type: Boolean,\n default: false\n },\n\n subFormRowIndex: {\n /* 子表单组件行索引,从0开始计数 */ type: Number,\n default: -1\n },\n subFormColIndex: {\n /* 子表单组件列索引,从0开始计数 */ type: Number,\n default: -1\n },\n subFormRowId: {\n /* 子表单组件行Id,唯一id且不可变 */ type: String,\n default: ''\n }\n },\n components: { SvgIcon, FormItemWrapper },\n data() {\n return {\n oldFieldValue: null, //field组件change之前的值\n fieldModel: null,\n rules: []\n // pager: {\n // page: 1,\n // pageSize: 20,\n // totalPage: 0,\n // total: 0\n // }\n };\n },\n computed: {\n size() {\n if (!!this.field.options && !!this.field.options.size) {\n return this.field.options.size;\n }\n if (!!this.designer) {\n return this.designer.formConfig.size || 'middle';\n } else {\n return this.formConfig.size || 'middle';\n }\n },\n allowDefaultFirstOption() {\n return !!this.field.options.filterable && !!this.field.options.allowCreate;\n }\n },\n watch: {\n 'field.options.dsEnabled': {\n deep: true,\n handler(val) {\n if (val) {\n this.initOptionItems();\n }\n //\n }\n }\n },\n beforeCreate() {\n /* 这里不能访问方法和属性!! */\n },\n\n created() {\n /* 注意:子组件mounted在父组件created之后、父组件mounted之前触发,故子组件mounted需要用到的prop\n 需要在父组件created中初始化!! */\n this.registerToRefList();\n this.clearOptionItems();\n this.initOptionItems();\n this.initFieldModel();\n this.initEventHandler();\n this.buildFieldRules();\n\n this.handleOnCreated();\n },\n\n mounted() {\n this.handleOnMounted();\n },\n\n beforeUnmount() {\n this.unregisterFromRefList();\n },\n\n methods: {\n /**\n * 获取选中项label\n * @return {*}\n */\n getSelectedLabel() {\n return this.$refs.fieldEditor.selectedLabel;\n }\n // onPopupScroll(e) {\n // if (!this.field.options.loadingPage) return;\n // const { target } = e;\n // const { scrollTop, scrollHeight, clientHeight } = target;\n // if (scrollHeight - (scrollTop + clientHeight) <= 30) {\n // if (this.pager.totalPage > this.pager.page) {\n // this.pager.page += 1;\n // this.initOptionItems(true);\n // }\n // }\n // }\n }\n };\n</script>\n\n<style lang=\"scss\" scoped>\n /* form-item-wrapper已引入,还需要重复引入吗? */\n\n .full-width-input {\n width: 100% !important;\n }\n .design-select-box {\n display: flex;\n width: 100%;\n .ant-select {\n flex: 1 0 0;\n min-width: 0;\n }\n .useModal-svg {\n border: 1px solid #d9d9d9;\n // padding-left: 12px;\n cursor: pointer;\n width: 40px;\n background: #fafafa;\n line-height: 30px;\n border-left: 0;\n text-align: center;\n }\n }\n</style>\n"],"names":["_sfc_main","emitter","fieldMixin","i18n","useSelectMixin","SvgIcon","FormItemWrapper","val","_hoisted_1","_hoisted_2","_ctx","_createBlock","_component_form_item_wrapper","$props","$data","_withDirectives","_createElementVNode","_createVNode","_component_a_select","_mergeProps","$event","$options","_createElementBlock","args","_component_svg_icon","_component_a_tooltip","_toDisplayString"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select-widget.vue.js","sources":["../../../../../../src/components/form-designer/form-widget/field-widget/select-widget.vue"],"sourcesContent":["<template>\n <form-item-wrapper\n :designer=\"designer\"\n :field=\"field\"\n :rules=\"rules\"\n :design-state=\"designState\"\n :parent-widget=\"parentWidget\"\n :parent-list=\"parentList\"\n :index-of-parent-list=\"indexOfParentList\"\n :sub-form-row-index=\"subFormRowIndex\"\n :sub-form-col-index=\"subFormColIndex\"\n :sub-form-row-id=\"subFormRowId\"\n v-if=\"!handleHidden()\"\n >\n <div class=\"design-select-box\" v-show=\"!isReadMode\">\n <a-select\n ref=\"fieldEditor\"\n v-model:value=\"fieldModel\"\n v-show=\"!isReadMode\"\n :size=\"size\"\n class=\"full-width-input\"\n :disabled=\"handleDisabled()\"\n :allowClear=\"field.options.allowClear\"\n :showArrow=\"true\"\n :dropdownMatchSelectWidth=\"false\"\n :mode=\"field.options.mode\"\n :maxTagCount=\"field.options.maxTagCount\"\n :placeholder=\"field.options.placeholder || i18nt('render.hint.selectPlaceholder')\"\n :onFocus=\"handleFocusCustomEvent\"\n @blur=\"handleBlurCustomEvent\"\n @change=\"handleChangeEvent\"\n :options=\"field.options.optionItems\"\n v-bind=\"selectOps\"\n />\n <!--\n :fieldNames=\"{\n label: field.options.labelKey || 'label',\n value: field.options.valueKey || 'value',\n options: 'options'\n }\"\n @popupScroll=\"onPopupScroll\"\n\n @search=\"remoteQuery\"\n :showSearch=\"field.options.showSearch\"\n -->\n <div v-if=\"field.options.useModal\" class=\"useModal-svg\" @click=\"handleClickIcon\">\n <svg-icon icon-class=\"sousuo\" />\n </div>\n </div>\n <template v-if=\"isReadMode\">\n <a-tooltip placement=\"topLeft\" :title=\"optionLabel\" :overlayStyle=\"{ zIndex: 1000 }\">\n <span class=\"readonly-mode-field\">{{ optionLabel }}</span>\n </a-tooltip>\n </template>\n </form-item-wrapper>\n</template>\n\n<script>\n import FormItemWrapper from './form-item-wrapper';\n import emitter from '@/utils/emitter';\n import i18n, { translate } from '@/utils/i18n';\n import fieldMixin from '@/components/form-designer/form-widget/field-widget/fieldMixin.js';\n import SvgIcon from '@/components/svg-icon';\n import useSelectMixin from '@/mixins/useSelectMixin.js';\n\n export default {\n name: 'select-widget',\n componentName: 'FieldWidget', //必须固定为FieldWidget,用于接收父级组件的broadcast事件\n mixins: [emitter, fieldMixin, i18n, useSelectMixin],\n\n props: {\n field: Object,\n parentWidget: Object,\n parentList: Array,\n indexOfParentList: Number,\n designer: Object,\n\n designState: {\n type: Boolean,\n default: false\n },\n\n subFormRowIndex: {\n /* 子表单组件行索引,从0开始计数 */ type: Number,\n default: -1\n },\n subFormColIndex: {\n /* 子表单组件列索引,从0开始计数 */ type: Number,\n default: -1\n },\n subFormRowId: {\n /* 子表单组件行Id,唯一id且不可变 */ type: String,\n default: ''\n }\n },\n components: { SvgIcon, FormItemWrapper },\n data() {\n return {\n oldFieldValue: null, //field组件change之前的值\n fieldModel: null,\n rules: []\n // pager: {\n // page: 1,\n // pageSize: 20,\n // totalPage: 0,\n // total: 0\n // }\n };\n },\n computed: {\n size() {\n if (!!this.field.options && !!this.field.options.size) {\n return this.field.options.size;\n }\n if (!!this.designer) {\n return this.designer.formConfig.size || 'middle';\n } else {\n return this.formConfig.size || 'middle';\n }\n },\n allowDefaultFirstOption() {\n return !!this.field.options.filterable && !!this.field.options.allowCreate;\n }\n },\n watch: {\n 'field.options.dsEnabled': {\n deep: true,\n handler(val) {\n if (val) {\n this.initOptionItems();\n }\n //\n }\n }\n },\n beforeCreate() {\n /* 这里不能访问方法和属性!! */\n },\n\n created() {\n /* 注意:子组件mounted在父组件created之后、父组件mounted之前触发,故子组件mounted需要用到的prop\n 需要在父组件created中初始化!! */\n this.registerToRefList();\n this.clearOptionItems();\n this.initOptionItems();\n this.initFieldModel();\n this.initEventHandler();\n this.buildFieldRules();\n\n this.handleOnCreated();\n },\n\n mounted() {\n this.handleOnMounted();\n },\n\n beforeUnmount() {\n this.unregisterFromRefList();\n },\n\n methods: {\n /**\n * 获取选中项label\n * @return {*}\n */\n getSelectedLabel() {\n return this.$refs.fieldEditor.selectedLabel;\n }\n // onPopupScroll(e) {\n // if (!this.field.options.loadingPage) return;\n // const { target } = e;\n // const { scrollTop, scrollHeight, clientHeight } = target;\n // if (scrollHeight - (scrollTop + clientHeight) <= 30) {\n // if (this.pager.totalPage > this.pager.page) {\n // this.pager.page += 1;\n // this.initOptionItems(true);\n // }\n // }\n // }\n }\n };\n</script>\n\n<style lang=\"scss\" scoped>\n /* form-item-wrapper已引入,还需要重复引入吗? */\n\n .full-width-input {\n width: 100% !important;\n }\n .design-select-box {\n display: flex;\n width: 100%;\n\n .ant-select {\n flex: 1 0 0;\n min-width: 0;\n }\n :deep(.ant-select-selector) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n .useModal-svg {\n border: 1px solid #d9d9d9;\n // padding-left: 12px;\n cursor: pointer;\n width: 40px;\n background: #fafafa;\n line-height: 30px;\n border-left: 0;\n text-align: center;\n border-top-right-radius: 6px;\n border-bottom-right-radius: 6px;\n }\n }\n</style>\n"],"names":["_sfc_main","emitter","fieldMixin","i18n","useSelectMixin","SvgIcon","FormItemWrapper","val","_hoisted_1","_hoisted_2","_ctx","_createBlock","_component_form_item_wrapper","$props","$data","_withDirectives","_createElementVNode","_createVNode","_component_a_select","_mergeProps","$event","$options","_createElementBlock","args","_component_svg_icon","_component_a_tooltip","_toDisplayString"],"mappings":"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"}
|
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import { createDesigner as
|
|
6
|
-
import { TpfConfigProvider as
|
|
7
|
-
import { traverseAllWidgets as
|
|
8
|
-
import
|
|
9
|
-
import { isEmpty as
|
|
10
|
-
import { resolveComponent as
|
|
1
|
+
import w from "./widget-panel/index.vue.js";
|
|
2
|
+
import F from "./toolbar-panel/index.vue.js";
|
|
3
|
+
import b from "./setting-panel/index.vue.js";
|
|
4
|
+
import y from "./form-widget/index.vue.js";
|
|
5
|
+
import { createDesigner as R } from "./designer.js";
|
|
6
|
+
import { TpfConfigProvider as x } from "tmgc2-share";
|
|
7
|
+
import { traverseAllWidgets as E, getAllContainerWidgets as c, getAllFieldWidgets as m, deepClone as u, addWindowResizeHandler as J } from "../../utils/util.js";
|
|
8
|
+
import S, { changeLocale as D } from "../../utils/i18n.js";
|
|
9
|
+
import { isEmpty as H } from "lodash-es";
|
|
10
|
+
import { resolveComponent as n, createBlock as A, openBlock as P, withCtx as r, createVNode as i, createSlots as B, renderList as N, renderSlot as V, createElementVNode as a } from "vue";
|
|
11
11
|
/* empty css */
|
|
12
|
-
import
|
|
13
|
-
const
|
|
12
|
+
import T from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
13
|
+
const U = {
|
|
14
14
|
name: "VFormDesigner",
|
|
15
15
|
componentName: "VFormDesigner",
|
|
16
|
-
mixins: [
|
|
16
|
+
mixins: [S],
|
|
17
17
|
components: {
|
|
18
|
-
TpfConfigProvider:
|
|
19
|
-
WidgetPanel:
|
|
20
|
-
ToolbarPanel:
|
|
21
|
-
SettingPanel:
|
|
22
|
-
VFormWidget:
|
|
18
|
+
TpfConfigProvider: x,
|
|
19
|
+
WidgetPanel: w,
|
|
20
|
+
ToolbarPanel: F,
|
|
21
|
+
SettingPanel: b,
|
|
22
|
+
VFormWidget: y
|
|
23
23
|
},
|
|
24
24
|
props: {
|
|
25
25
|
/* 保存jsonApi */
|
|
@@ -91,7 +91,7 @@ const T = {
|
|
|
91
91
|
chatUrl: "https://www.vform666.com/pages/chat-group/",
|
|
92
92
|
subScribeUrl: "https://www.vform666.com/pages/pro/",
|
|
93
93
|
scrollerHeight: 0,
|
|
94
|
-
designer:
|
|
94
|
+
designer: R(this),
|
|
95
95
|
fieldList: []
|
|
96
96
|
};
|
|
97
97
|
},
|
|
@@ -105,7 +105,7 @@ const T = {
|
|
|
105
105
|
created() {
|
|
106
106
|
},
|
|
107
107
|
mounted() {
|
|
108
|
-
this.initLocale(), this.scrollerHeight = window.innerHeight - 56 - 36 + "px",
|
|
108
|
+
this.initLocale(), this.scrollerHeight = window.innerHeight - 56 - 36 + "px", J(() => {
|
|
109
109
|
this.$nextTick(() => {
|
|
110
110
|
this.scrollerHeight = window.innerHeight - 56 - 36 + "px";
|
|
111
111
|
});
|
|
@@ -126,7 +126,7 @@ const T = {
|
|
|
126
126
|
* @param {*} importObj
|
|
127
127
|
*/
|
|
128
128
|
setJsonImport(e = {}) {
|
|
129
|
-
if (!
|
|
129
|
+
if (!H(e))
|
|
130
130
|
try {
|
|
131
131
|
if (!e || !e.formConfig)
|
|
132
132
|
throw new Error(this.i18nt("designer.hint.invalidJsonFormat"));
|
|
@@ -138,25 +138,8 @@ const T = {
|
|
|
138
138
|
testEEH(e, t) {
|
|
139
139
|
console.log("test", e), console.log("test222222", t);
|
|
140
140
|
},
|
|
141
|
-
showLink(e) {
|
|
142
|
-
return this.designerConfig[e] === void 0 ? !0 : !!this.designerConfig[e];
|
|
143
|
-
},
|
|
144
|
-
openUrl(e, t) {
|
|
145
|
-
if (this.vsCodeFlag) {
|
|
146
|
-
const s = {
|
|
147
|
-
cmd: "openUrl",
|
|
148
|
-
data: {
|
|
149
|
-
url: t
|
|
150
|
-
}
|
|
151
|
-
};
|
|
152
|
-
window.parent.postMessage(s, "*");
|
|
153
|
-
} else {
|
|
154
|
-
const s = e.currentTarget;
|
|
155
|
-
s.href = t;
|
|
156
|
-
}
|
|
157
|
-
},
|
|
158
141
|
changeLanguage(e) {
|
|
159
|
-
|
|
142
|
+
D(e);
|
|
160
143
|
},
|
|
161
144
|
initLocale() {
|
|
162
145
|
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);
|
|
@@ -171,8 +154,8 @@ const T = {
|
|
|
171
154
|
},
|
|
172
155
|
getFormJson() {
|
|
173
156
|
return {
|
|
174
|
-
widgetList:
|
|
175
|
-
formConfig:
|
|
157
|
+
widgetList: u(this.designer.widgetList),
|
|
158
|
+
formConfig: u(this.designer.formConfig)
|
|
176
159
|
};
|
|
177
160
|
},
|
|
178
161
|
clearDesigner() {
|
|
@@ -220,14 +203,14 @@ const T = {
|
|
|
220
203
|
* @returns {*[]}
|
|
221
204
|
*/
|
|
222
205
|
getFieldWidgets(e = null) {
|
|
223
|
-
return e ?
|
|
206
|
+
return e ? m(e) : m(this.designer.widgetList);
|
|
224
207
|
},
|
|
225
208
|
/**
|
|
226
209
|
* 获取所有容器组件
|
|
227
210
|
* @returns {*[]}
|
|
228
211
|
*/
|
|
229
212
|
getContainerWidgets(e = null) {
|
|
230
|
-
return e ?
|
|
213
|
+
return e ? c(e) : c(this.designer.widgetList);
|
|
231
214
|
},
|
|
232
215
|
/**
|
|
233
216
|
* 升级表单json,以补充最新的组件属性
|
|
@@ -238,7 +221,7 @@ const T = {
|
|
|
238
221
|
this.$message.error("Invalid form json!");
|
|
239
222
|
return;
|
|
240
223
|
}
|
|
241
|
-
return
|
|
224
|
+
return E(e.widgetList, (t) => {
|
|
242
225
|
this.designer.upgradeWidgetConfig(t);
|
|
243
226
|
}), this.designer.upgradeFormConfig(e.formConfig), e;
|
|
244
227
|
},
|
|
@@ -281,71 +264,79 @@ const T = {
|
|
|
281
264
|
}
|
|
282
265
|
//TODO: 增加更多方法!!
|
|
283
266
|
}
|
|
284
|
-
},
|
|
285
|
-
function
|
|
286
|
-
const
|
|
287
|
-
return
|
|
288
|
-
default:
|
|
289
|
-
|
|
290
|
-
default:
|
|
291
|
-
|
|
292
|
-
default:
|
|
293
|
-
|
|
294
|
-
width:
|
|
267
|
+
}, I = { class: "container-scroll-bar" };
|
|
268
|
+
function k(e, t, s, M, o, l) {
|
|
269
|
+
const p = n("WidgetPanel"), g = n("a-layout-sider"), W = n("toolbar-panel"), _ = n("a-layout-header"), v = n("VFormWidget"), d = n("a-layout-content"), C = n("setting-panel"), h = n("a-layout"), L = n("TpfConfigProvider");
|
|
270
|
+
return P(), A(L, null, {
|
|
271
|
+
default: r(() => [
|
|
272
|
+
i(h, { class: "main-container full-height" }, {
|
|
273
|
+
default: r(() => [
|
|
274
|
+
i(h, null, {
|
|
275
|
+
default: r(() => [
|
|
276
|
+
i(g, {
|
|
277
|
+
width: o.leftWidth,
|
|
295
278
|
class: "side-panel"
|
|
296
279
|
}, {
|
|
297
|
-
default:
|
|
298
|
-
|
|
280
|
+
default: r(() => [
|
|
281
|
+
i(p, { designer: o.designer }, null, 8, ["designer"])
|
|
299
282
|
]),
|
|
300
283
|
_: 1
|
|
301
284
|
}, 8, ["width"]),
|
|
302
|
-
|
|
303
|
-
default:
|
|
304
|
-
|
|
305
|
-
default:
|
|
306
|
-
|
|
285
|
+
i(d, { class: "center-layout-container" }, {
|
|
286
|
+
default: r(() => [
|
|
287
|
+
i(_, { class: "toolbar-header" }, {
|
|
288
|
+
default: r(() => [
|
|
289
|
+
i(W, {
|
|
307
290
|
saveJsonApi: s.saveJsonApi,
|
|
308
|
-
designer:
|
|
291
|
+
designer: o.designer,
|
|
309
292
|
"global-dsv": s.globalDsv,
|
|
310
293
|
changeLeftWidth: l.changeLeftWidth,
|
|
311
294
|
changeRightWidth: l.changeRightWidth,
|
|
312
|
-
leftWidth:
|
|
313
|
-
rightWidth:
|
|
295
|
+
leftWidth: o.leftWidth,
|
|
296
|
+
rightWidth: o.rightWidth,
|
|
314
297
|
ref: "toolbarRef"
|
|
315
|
-
},
|
|
316
|
-
|
|
317
|
-
name:
|
|
318
|
-
fn:
|
|
319
|
-
|
|
298
|
+
}, B({ _: 2 }, [
|
|
299
|
+
N(e.$slots, (j, f) => ({
|
|
300
|
+
name: f,
|
|
301
|
+
fn: r(() => [
|
|
302
|
+
V(e.$slots, f, {}, void 0, !0)
|
|
320
303
|
])
|
|
321
304
|
}))
|
|
322
305
|
]), 1032, ["saveJsonApi", "designer", "global-dsv", "changeLeftWidth", "changeRightWidth", "leftWidth", "rightWidth"])
|
|
323
306
|
]),
|
|
324
307
|
_: 3
|
|
325
308
|
}),
|
|
326
|
-
|
|
327
|
-
default:
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
designer:
|
|
331
|
-
"form-config":
|
|
309
|
+
i(d, { class: "form-widget-main" }, {
|
|
310
|
+
default: r(() => [
|
|
311
|
+
a("div", I, [
|
|
312
|
+
i(v, {
|
|
313
|
+
designer: o.designer,
|
|
314
|
+
"form-config": o.designer.formConfig,
|
|
332
315
|
"global-dsv": s.globalDsv,
|
|
333
316
|
ref: "formRef"
|
|
334
317
|
}, null, 8, ["designer", "form-config", "global-dsv"])
|
|
335
318
|
])
|
|
336
319
|
]),
|
|
337
320
|
_: 1
|
|
321
|
+
}),
|
|
322
|
+
i(d, { class: "form-widget-footer" }, {
|
|
323
|
+
default: r(() => t[0] || (t[0] = [
|
|
324
|
+
a("div", { id: "footerLeft" }, null, -1),
|
|
325
|
+
a("div", { id: "footerRight" }, null, -1)
|
|
326
|
+
])),
|
|
327
|
+
_: 1,
|
|
328
|
+
__: [0]
|
|
338
329
|
})
|
|
339
330
|
]),
|
|
340
331
|
_: 3
|
|
341
332
|
}),
|
|
342
|
-
|
|
343
|
-
default:
|
|
344
|
-
|
|
345
|
-
designer:
|
|
346
|
-
"selected-widget":
|
|
333
|
+
i(g, { width: o.rightWidth }, {
|
|
334
|
+
default: r(() => [
|
|
335
|
+
i(C, {
|
|
336
|
+
designer: o.designer,
|
|
337
|
+
"selected-widget": o.designer.selectedWidget,
|
|
347
338
|
"global-dsv": s.globalDsv,
|
|
348
|
-
"form-config":
|
|
339
|
+
"form-config": o.designer.formConfig,
|
|
349
340
|
onEditEventHandler: l.testEEH
|
|
350
341
|
}, null, 8, ["designer", "selected-widget", "global-dsv", "form-config", "onEditEventHandler"])
|
|
351
342
|
]),
|
|
@@ -361,7 +352,7 @@ function I(e, t, s, M, i, l) {
|
|
|
361
352
|
_: 3
|
|
362
353
|
});
|
|
363
354
|
}
|
|
364
|
-
const ie = /* @__PURE__ */
|
|
355
|
+
const ie = /* @__PURE__ */ T(U, [["render", k], ["__scopeId", "data-v-eba90d91"]]);
|
|
365
356
|
export {
|
|
366
357
|
ie as default
|
|
367
358
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.vue.js","sources":["../../../../src/components/form-designer/index.vue"],"sourcesContent":["<template>\n <TpfConfigProvider>\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\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 </TpfConfigProvider>\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 { TpfConfigProvider } from 'tmgc2-share';\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 TpfConfigProvider,\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 docUrl: 'https://www.vform666.com/document3.html',\n gitUrl: 'https://github.com/vform666/variant-form3-vite',\n chatUrl: 'https://www.vform666.com/pages/chat-group/',\n subScribeUrl: 'https://www.vform666.com/pages/pro/',\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 showLink(configName) {\n if (this.designerConfig[configName] === undefined) {\n return true;\n }\n\n return !!this.designerConfig[configName];\n },\n\n openUrl(event, url) {\n if (!!this.vsCodeFlag) {\n const msgObj = {\n cmd: 'openUrl',\n data: {\n url\n }\n };\n window.parent.postMessage(msgObj, '*');\n } else {\n const aDom = event.currentTarget;\n aDom.href = url;\n //window.open(url, '_blank') //直接打开新窗口,会被浏览器拦截\n }\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\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","TpfConfigProvider","WidgetPanel","ToolbarPanel","SettingPanel","VFormWidget","createDesigner","addWindowResizeHandler","flag","importObj","isEmpty","ex","eventName","eventParams","configName","event","url","msgObj","aDom","langName","changeLocale","formJson","modifiedFlag","deepClone","fJson","widgetList","getAllFieldWidgets","getAllContainerWidgets","traverseAllWidgets","w","widgetName","showError","dsObj","componentName","externalComponent","_hoisted_1","_createBlock","_component_TpfConfigProvider","_createVNode","_component_a_layout","_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":";;;;;;;;;;;;AAoEI,MAAKA,IAAU;AAAA,EACX,MAAM;AAAA,EACN,eAAe;AAAA,EACf,QAAQ,CAACC,CAAI;AAAA,EACb,YAAY;AAAA,IACR,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,cAAAC;AAAA,IACA,aAAAC;AAAA;EAEJ,OAAO;AAAA;AAAA,IAGH,aAAa;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA;;IAGb,cAAc;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA;;IAIb,eAAe;AAAA,MACX,MAAM;AAAA,MACN,SAAS,MAAM,CAAA;AAAA;;IAGnB,gBAAgB;AAAA,MACZ,MAAM;AAAA,MACN,SAAS,OACE;AAAA,QACH,cAAc;AAAA;AAAA;AAAA;AAAA,QAGd,eAAe;AAAA;AAAA,QACf,oBAAoB;AAAA;AAAA,QAEpB,qBAAqB;AAAA;AAAA,QACrB,mBAAmB;AAAA;AAAA,QACnB,kBAAkB;AAAA;AAAA,QAClB,kBAAkB;AAAA;AAAA,QAClB,kBAAkB;AAAA;AAAA;AAAA,QAGlB,iBAAiB;AAAA;AAAA,QACjB,iBAAiB;AAAA;AAAA,QAEjB,eAAe;AAAA;AAAA,QAEf,eAAe;AAAA;AAAA;;;IAM3B,WAAW;AAAA,MACP,MAAM;AAAA,MACN,SAAS,OAAO,CAAA;AAAA,IACpB;AAAA;EAEJ,OAAO;AACH,WAAO;AAAA,MACH,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,WAAW;AAAA,MACX,WAAW;AAAA;AAAA,MACX,YAAY;AAAA,MACZ,UAAU;AAAA,MAEV,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,cAAc;AAAA,MAEd,gBAAgB;AAAA,MAEhB,UAAUC,EAAe,IAAI;AAAA,MAE7B,WAAW,CAAA;AAAA;EAEnB;AAAA,EACA,UAAU;AACN,WAAO;AAAA,MACH,iBAAiB,MAAM,KAAK;AAAA,MAC5B,mBAAmB,MAAM,KAAK;AAAA,MAC9B,kBAAkB,MAAM,KAAK;AAAA;EAErC;AAAA,EACA,UAAU;AAAA,EAGV;AAAA,EACA,UAAU;AACN,SAAK,WAAU,GAEf,KAAK,iBAAiB,OAAO,cAAc,KAAK,KAAK,MACrDC,EAAuB,MAAM;AACzB,WAAK,UAAU,MAAM;AACjB,aAAK,iBAAiB,OAAO,cAAc,KAAK,KAAK;AAAA,MACzD,CAAC;AAAA,IACL,CAAC,GAED,KAAK,wBAAuB;AAAA,EAChC;AAAA,EACA,SAAS;AAAA,IACL,WAAWC,GAAM;AACb,WAAK,YAAYA;AAAA,IACrB;AAAA,IACA,kBAAkB;AACd,MAAI,KAAK,cAAc,MACnB,KAAK,YAAY,IAEjB,KAAK,YAAY;AAAA,IAEzB;AAAA,IACA,mBAAmB;AACf,MAAI,KAAK,eAAe,MACpB,KAAK,aAAa,IAElB,KAAK,aAAa;AAAA,IAE1B;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAcC,IAAY,IAAI;AAC1B,UAAI,CAAAC,EAAQD,CAAS;AACrB,YAAI;AACA,cAAI,CAACA,KAAa,CAACA,EAAU;AACzB,kBAAM,IAAI,MAAM,KAAK,MAAM,iCAAiC,CAAC;AAQjE,eAAK,SAAS,aAAaA,CAAS,GAEpC,KAAK,SAAS,kBAAiB,GAE/B,KAAK,SAAS,UAAU,sBAAsB,CAAA,CAAE;AAAA,QACpD,SAASE,GAAI;AACT,eAAK,SAAS,MAAMA,IAAK,EAAE;AAAA,QAC/B;AAAA,IACJ;AAAA,IACA,QAAQC,GAAWC,GAAa;AAC5B,cAAQ,IAAI,QAAQD,CAAS,GAC7B,QAAQ,IAAI,cAAcC,CAAW;AAAA,IACzC;AAAA,IAEA,SAASC,GAAY;AACjB,aAAI,KAAK,eAAeA,CAAU,MAAM,SAC7B,KAGJ,CAAC,CAAC,KAAK,eAAeA,CAAU;AAAA,IAC3C;AAAA,IAEA,QAAQC,GAAOC,GAAK;AAChB,UAAM,KAAK,YAAY;AACnB,cAAMC,IAAS;AAAA,UACX,KAAK;AAAA,UACL,MAAM;AAAA,YACF,KAAAD;AAAA,UACJ;AAAA;AAEJ,eAAO,OAAO,YAAYC,GAAQ,GAAG;AAAA,MACzC,OAAO;AACH,cAAMC,IAAOH,EAAM;AACnB,QAAAG,EAAK,OAAOF;AAAA,MAEhB;AAAA,IACJ;AAAA,IAEA,eAAeG,GAAU;AACrB,MAAAC,EAAaD,CAAQ;AAAA,IACzB;AAAA,IACA,aAAa;AACT,WAAK,YAAY,aAAa,QAAQ,eAAe,GAC/C,KAAK,aACP,KAAK,YAAY,KAAK,aAAa,UAEnC,KAAK,YAAY,KAAK,aAAa,SAEvC,KAAK,cAAc,KAAK,MAAM,iBAAiB,KAAK,SAAS,GAC7D,KAAK,eAAe,KAAK,SAAS;AAAA,IACtC;AAAA,IAEA,MAAM,0BAA0B;AAC5B,MAAK,KAAK,iBAGV,KAAK,YAAY,MAAM,KAAK,aAAY,GACxC,QAAQ,IAAI,oBAAoB,KAAK,SAAS;AAAA,IAClD;AAAA,IACA,YAAYE,GAAU;AAClB,cAAQ,IAAI,cAAcA,CAAQ;AAClC,UAAIC,IAAe;AACnB,MAAMD,MACE,OAAOA,KAAa,WAEpBC,IAAe,KAAK,SAAS,aAAa,KAAK,MAAMD,CAAQ,CAAC,IACvDA,EAAS,gBAAgB,WAChCC,IAAe,KAAK,SAAS,aAAaD,CAAQ,IAGlDC,KACA,KAAK,SAAS,kBAAiB;AAAA,IAG3C;AAAA,IAEA,cAAc;AACV,aAAO;AAAA,QACH,YAAYC,EAAU,KAAK,SAAS,UAAU;AAAA,QAC9C,YAAYA,EAAU,KAAK,SAAS,UAAU;AAAA;IAEtD;AAAA,IAEA,gBAAgB;AACZ,WAAK,MAAM,WAAW,gBAAe;AAAA,IACzC;AAAA;AAAA;AAAA;AAAA,IAKA,kBAAkB;AAGd,YAAMC,IAAQ,KAAK,YAAW;AAC9B,WAAK,SAAS,cAAc,EAAI,GAChC,KAAK,SAAS,aAAaA,CAAK;AAAA,IACpC;AAAA;AAAA;AAAA;AAAA,IAKA,cAAc;AACV,WAAK,MAAM,WAAW,YAAW;AAAA,IACrC;AAAA;AAAA;AAAA;AAAA,IAKA,aAAa;AACT,WAAK,MAAM,WAAW,WAAU;AAAA,IACpC;AAAA;AAAA;AAAA;AAAA,IAKA,aAAa;AACT,WAAK,MAAM,WAAW,WAAU;AAAA,IACpC;AAAA;AAAA;AAAA;AAAA,IAKA,aAAa;AACT,WAAK,MAAM,WAAW,WAAU;AAAA,IACpC;AAAA;AAAA;AAAA;AAAA,IAKA,cAAc;AACV,WAAK,MAAM,WAAW,YAAW;AAAA,IACrC;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,gBAAgBC,IAAa,MAAM;AAC/B,aAASA,IACHC,EAAmBD,CAAU,IAC7BC,EAAmB,KAAK,SAAS,UAAU;AAAA,IACrD;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,oBAAoBD,IAAa,MAAM;AACnC,aAASA,IACHE,EAAuBF,CAAU,IACjCE,EAAuB,KAAK,SAAS,UAAU;AAAA,IACzD;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,gBAAgBN,GAAU;AACtB,UAAI,CAACA,EAAS,cAAc,CAACA,EAAS,YAAY;AAC9C,aAAK,SAAS,MAAM,oBAAoB;AACxC;AAAA,MACJ;AAEA,aAAAO,EAAmBP,EAAS,YAAY,CAAAQ,MAAK;AACzC,aAAK,SAAS,oBAAoBA,CAAC;AAAA,MACvC,CAAC,GACD,KAAK,SAAS,kBAAkBR,EAAS,UAAU,GAE5CA;AAAA,IACX;AAAA,IAEA,aAAaS,GAAYC,IAAY,IAAO;AACxC,aAAO,KAAK,MAAM,QAAW,aAAaD,GAAYC,CAAS;AAAA,IACnE;AAAA,IAEA,uBAAuB;AACnB,aAAO,KAAK,MAAM,QAAW,qBAAoB;AAAA,IACrD;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,cAAcC,GAAO;AACjB,WAAK,SAAS,WAAW,YAAY,KAAKA,CAAK;AAAA,IACnD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,MAAMC,GAAeC,GAAmB;AACpC,WAAK,mBAAmBD,CAAa,IAAIC;AAAA,IAC7C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,MAAMD,GAAe;AACjB,aAAO,KAAK,mBAAmB,eAAeA,CAAa;AAAA,IAC/D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,MAAMA,GAAe;AACjB,aAAO,KAAK,mBAAmBA,CAAa;AAAA,IAChD;AAAA;AAAA,EAGJ;GA/YqBE,IAAA,EAAA,OAAM,uBAAsB;;;cAzBrDC,EA+CoBC,GAAA,MAAA;AAAA,eA9ChB,MA6CW;AAAA,MA7CXC,EA6CWC,GAAA,EA7CD,OAAM,6BAA4B,GAAA;AAAA,mBACxC,MA2CW;AAAA,UA3CXD,EA2CWC,GAAA,MAAA;AAAA,uBA1CP,MAEiB;AAAA,cAFjBD,EAEiBE,GAAA;AAAA,gBAFA,OAAOC,EAAA;AAAA,gBAAW,OAAM;AAAA;2BACrC,MAAoC;AAAA,kBAApCH,EAAoCI,GAAA,EAAtB,UAAUD,EAAA,SAAQ,GAAA,MAAA,GAAA,CAAA,UAAA,CAAA;AAAA;;;cAGpCH,EA2BmBK,GAAA,EA3BD,OAAM,0BAAyB,GAAA;AAAA,2BAC7C,MAekB;AAAA,kBAflBL,EAekBM,GAAA,EAfD,OAAM,iBAAgB,GAAA;AAAA,+BACnC,MAagB;AAAA,sBAbhBN,EAagBO,GAAA;AAAA,wBAZX,aAAaC,EAAA;AAAA,wBACb,UAAUL,EAAA;AAAA,wBACV,cAAYK,EAAA;AAAA,wBACZ,iBAAiBC,EAAA;AAAA,wBACjB,kBAAkBA,EAAA;AAAA,wBAClB,WAAWN,EAAA;AAAA,wBACX,YAAYA,EAAA;AAAA,wBACb,KAAI;AAAA;0BAEgCO,EAAA,QAAM,CAAxBC,GAAKC;gCAAsBA;AAAA,gCACzC,MAA8B;AAAA,4BAA9BC,EAA8BH,UAAjBE,GAAQ,CAAA,GAAA,QAAA,EAAA;AAAA;;;;;;kBAIjCZ,EASmBK,GAAA,EATD,OAAM,mBAAkB,GAAA;AAAA,+BACtC,MAOM;AAAA,sBAPNS,EAOM,OAPNjB,GAOM;AAAA,wBANFG,EAKEe,GAAA;AAAA,0BAJG,UAAUZ,EAAA;AAAA,0BACV,eAAaA,EAAA,SAAS;AAAA,0BACtB,cAAYK,EAAA;AAAA,0BACb,KAAI;AAAA;;;;;;;;cAMpBR,EAQiBE,GAAA,EARA,OAAOC,EAAA,WAAU,GAAA;AAAA,2BAC9B,MAME;AAAA,kBANFH,EAMEgB,GAAA;AAAA,oBALG,UAAUb,EAAA;AAAA,oBACV,mBAAiBA,EAAA,SAAS;AAAA,oBAC1B,cAAYK,EAAA;AAAA,oBACZ,eAAaL,EAAA,SAAS;AAAA,oBACtB,oBAAoBM,EAAA;AAAA;;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"index.vue.js","sources":["../../../../src/components/form-designer/index.vue"],"sourcesContent":["<template>\n <TpfConfigProvider>\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 class=\"form-widget-footer\">\n <div id=\"footerLeft\"></div>\n <div id=\"footerRight\"></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 </TpfConfigProvider>\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 { TpfConfigProvider } from 'tmgc2-share';\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 TpfConfigProvider,\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 docUrl: 'https://www.vform666.com/document3.html',\n gitUrl: 'https://github.com/vform666/variant-form3-vite',\n chatUrl: 'https://www.vform666.com/pages/chat-group/',\n subScribeUrl: 'https://www.vform666.com/pages/pro/',\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","TpfConfigProvider","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_TpfConfigProvider","_createVNode","_component_a_layout","_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","_cache","_component_setting_panel"],"mappings":"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"}
|