diff --git a/package.json b/package.json index 34fced4..bb5e8a8 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "variant-form3", - "version": "3.0.9", + "version": "3.0.10", "private": false, "scripts": { "serve": "vite", @@ -14,7 +14,7 @@ "axios": "^0.24.0", "clipboard": "^2.0.8", "core-js": "^3.6.5", - "element-plus": "^2.0.4", + "element-plus": "^2.2.22", "file-saver": "^2.0.5", "mitt": "^3.0.0", "sortablejs": "1.14.0", diff --git a/src/App.vue b/src/App.vue index 342fafc..31714b9 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,7 +1,13 @@ @@ -19,14 +25,17 @@ export default { }, data() { return { - formJson: {"widgetList":[],"formConfig":{"modelName":"formData","refName":"vForm","rulesName":"rules","labelWidth":80,"labelPosition":"left","size":"","labelAlign":"label-left-align","cssCode":"","customClass":"","functions":"","layoutType":"PC","onFormCreated":"","onFormMounted":"","onFormDataChange":"","onFormValidate":""}}, - formData: {}, - optionData: {}, - elLocaleMap: { 'zh-CN': zhCNLang, 'en-US': enUSLang, }, + + //全局数据源变量 + globalDsv: { + testApiHost: 'http://www.test.com/api', + testPort: 8080, + }, + } }, computed: { @@ -37,15 +46,11 @@ export default { }, methods: { - submitForm() { - this.$refs.vFormRef.getFormData().then(formData => { - // Form Validation OK - alert( JSON.stringify(formData) ) - }).catch(error => { - // Form Validation failed - this.$message.error(error) - }) + doTest() { + let fieldList = this.$refs.vfDesignerRef.getFieldWidgets(null, true) + console.log('test', fieldList) } + } } diff --git a/src/components/form-designer/form-widget/container-widget/containerMixin.js b/src/components/form-designer/form-widget/container-widget/containerMixin.js index 4f9d272..c9064e4 100644 --- a/src/components/form-designer/form-widget/container-widget/containerMixin.js +++ b/src/components/form-designer/form-widget/container-widget/containerMixin.js @@ -1,5 +1,5 @@ export default { - inject: ['getFormConfig'], + inject: ['getFormConfig', 'getGlobalDsv'], computed: { formConfig() { diff --git a/src/components/form-designer/form-widget/field-widget/fieldMixin.js b/src/components/form-designer/form-widget/field-widget/fieldMixin.js index 47294c7..b274562 100644 --- a/src/components/form-designer/form-widget/field-widget/fieldMixin.js +++ b/src/components/form-designer/form-widget/field-widget/fieldMixin.js @@ -3,7 +3,7 @@ import FormValidators from '@/utils/validators' import eventBus from "@/utils/event-bus" export default { - inject: ['refList', 'getFormConfig', 'globalOptionData', 'globalModel', 'getOptionData'], + inject: ['refList', 'getFormConfig', 'getGlobalDsv', 'globalOptionData', 'globalModel', 'getOptionData'], computed: { formConfig() { diff --git a/src/components/form-designer/form-widget/index.vue b/src/components/form-designer/form-widget/index.vue index 67250ea..d032bd3 100644 --- a/src/components/form-designer/form-widget/index.vue +++ b/src/components/form-designer/form-widget/index.vue @@ -51,11 +51,16 @@ type: Object, default: () => ({}) }, + globalDsv: { + type: Object, + default: () => ({}) + }, }, provide() { return { refList: this.widgetRefList, getFormConfig: () => this.formConfig, /* 解决provide传递formConfig属性的响应式更新问题!! */ + getGlobalDsv: () => this.globalDsv, // 全局数据源变量 globalOptionData: this.optionData, getOptionData: () => this.optionData, globalModel: { diff --git a/src/components/form-designer/index.vue b/src/components/form-designer/index.vue index 3e77f32..2a8ddf0 100644 --- a/src/components/form-designer/index.vue +++ b/src/components/form-designer/index.vue @@ -39,7 +39,7 @@ - + @@ -47,7 +47,7 @@ - + @@ -55,7 +55,7 @@ + :form-config="designer.formConfig" :global-dsv="globalDsv" @edit-event-handler="testEEH" /> @@ -126,6 +126,12 @@ } }, + /* 全局数据源变量 */ + globalDsv: { + type: Object, + default: () => ({}) + }, + }, data() { return { diff --git a/src/components/form-designer/setting-panel/index.vue b/src/components/form-designer/setting-panel/index.vue index 1042981..bd35f44 100644 --- a/src/components/form-designer/setting-panel/index.vue +++ b/src/components/form-designer/setting-panel/index.vue @@ -120,6 +120,10 @@ designer: Object, selectedWidget: Object, formConfig: Object, + globalDsv: { + type: Object, + default: () => ({}) + }, }, inject: ['getDesignerConfig'], data() { diff --git a/src/components/form-designer/toolbar-panel/index.vue b/src/components/form-designer/toolbar-panel/index.vue index dbca38c..02d26e1 100644 --- a/src/components/form-designer/toolbar-panel/index.vue +++ b/src/components/form-designer/toolbar-panel/index.vue @@ -51,7 +51,7 @@
@@ -213,7 +213,11 @@ SvgIcon, }, props: { - designer: Object + designer: Object, + globalDsv: { + type: Object, + default: () => ({}) + }, }, inject: ['getDesignerConfig'], data() { @@ -295,6 +299,10 @@ return this.designer.getLayoutType() }, + designerDsv() { + return this.globalDsv + } + }, watch: { 'designer.widgetList': { diff --git a/src/components/form-render/container-item/containerItemMixin.js b/src/components/form-render/container-item/containerItemMixin.js index 0ff24bb..6467035 100644 --- a/src/components/form-render/container-item/containerItemMixin.js +++ b/src/components/form-render/container-item/containerItemMixin.js @@ -1,6 +1,7 @@ import { traverseFieldWidgetsOfContainer } from "@/utils/util"; export default { + inject: ['getFormConfig', 'getGlobalDsv'], computed: { customClass() { return this.widget.options.customClass || '' diff --git a/src/components/form-render/index.vue b/src/components/form-render/index.vue index 2afb50b..b29ed38 100644 --- a/src/components/form-render/index.vue +++ b/src/components/form-render/index.vue @@ -72,13 +72,18 @@ previewState: { //是否表单预览状态 type: Boolean, default: false - } + }, + globalDsv: { // 全局数据源变量 + type: Object, + default: () => ({}) + }, }, provide() { return { refList: this.widgetRefList, sfRefList: this.subFormRefList, //收集SubForm引用 getFormConfig: () => this.formJsonObj.formConfig, /* 解决provide传递formConfig属性的响应式更新问题!! */ + getGlobalDsv: () => this.globalDsv, // 全局数据源变量 globalOptionData: this.optionData, getOptionData: () => this.optionData, /* 该方法用于在异步更新option-data之后重新获取到最新值 */ globalModel: { @@ -696,6 +701,14 @@ return this.externalComponents[componentName] }, + /** + * 获取globalDsv对象 + * @returns {*} + */ + getGlobalDsv() { + return this.globalDsv + }, + //--------------------- 以上为组件支持外部调用的API方法 end ------------------// }, diff --git a/src/utils/config.js b/src/utils/config.js index 8129c75..874065f 100644 --- a/src/utils/config.js +++ b/src/utils/config.js @@ -1,4 +1,4 @@ -export const VARIANT_FORM_VERSION = '3.0.9' +export const VARIANT_FORM_VERSION = '3.0.10' //export const MOCK_CASE_URL = 'https://www.fastmock.site/mock/2de212e0dc4b8e0885fea44ab9f2e1d0/vform/' export const MOCK_CASE_URL = 'https://ks3-cn-beijing.ksyuncs.com/vform-static/vcase/'