From cfbe3c6cd5cac743fafb747fc5e6f9697ace62df Mon Sep 17 00:00:00 2001 From: wangqing <250543222@qq.com> Date: Sun, 23 May 2021 22:10:01 +0800 Subject: [PATCH] fix: radio checkbox other input --- src/components/generator/config.js | 6 +-- src/components/parser/Parser.vue | 52 ++++++++++++------- .../render/slots/el-checkbox-group.js | 20 +++++-- src/components/render/slots/el-radio-group.js | 18 ++++--- 4 files changed, 64 insertions(+), 32 deletions(-) diff --git a/src/components/generator/config.js b/src/components/generator/config.js index 14a53a0..cacc975 100644 --- a/src/components/generator/config.js +++ b/src/components/generator/config.js @@ -695,7 +695,7 @@ export const personalInfoComponents = [ append: '' }, placeholder: '请输入手机号', - style: { width: '100%' }, + style: {width: '100%'}, clearable: true, 'prefix-icon': 'el-icon-mobile', 'suffix-icon': '', @@ -731,7 +731,7 @@ export const personalInfoComponents = [ append: '' }, placeholder: '请输入邮箱', - style: { width: '100%' }, + style: {width: '100%'}, clearable: true, 'prefix-icon': 'el-icon-message', 'suffix-icon': '', @@ -767,7 +767,7 @@ export const personalInfoComponents = [ append: '' }, placeholder: '请输入身份证', - style: { width: '100%' }, + style: {width: '100%'}, clearable: true, 'prefix-icon': 'el-icon-postcard', 'suffix-icon': '', diff --git a/src/components/parser/Parser.vue b/src/components/parser/Parser.vue index f0e3675..682b247 100644 --- a/src/components/parser/Parser.vue +++ b/src/components/parser/Parser.vue @@ -194,12 +194,14 @@ function setValue(event, config, scheme) { function nextPage(page) { switchPage.call(this, 'next', page) } + /** * 分页上一页 */ function prevPage(page) { switchPage.call(this, 'prev', page) } + /** * 切换页 */ @@ -212,7 +214,11 @@ function switchPage(eventName, page) { }, 100) return false } else { - this.$emit(eventName, {page: page, formModel: this[this.formConf.formModel], labelFormModel: this[this.formConf.labelFormModel]}) + this.$emit(eventName, { + page: page, + formModel: this[this.formConf.formModel], + labelFormModel: this[this.formConf.labelFormModel] + }) } return true }) @@ -223,19 +229,30 @@ function switchPage(eventName, page) { */ function setOtherValueLabel(event, config) { let value = this[this.formConf.formModel][config.__vModel__] - this.$set(this[this.formConf.labelFormModel], `${config.__vModel__}other`, event) - setValueLabel.call(this, value, config.__config__, config) + // 临时保存其他的选项值 + this.$nextTick(() => { + console.log(this[this.formConf.labelFormModel]) + this.$set(this[this.formConf.labelFormModel], `${config.__vModel__}other`, event) + console.log(this[this.formConf.labelFormModel]) + setValueLabel.call(this, value, config.__config__, config) + }) + } /** + * this.formConf.formModel 保存表单的原始值 如checkbox radio的值是 1,2,3等 + * this.formConf.labelFormModel 保存显示的值 如选项一 选项二等 * 保存选项的label值 * @param event * @param config * @param scheme */ function setValueLabel(event, config, scheme) { + // 需要处理的类型 如果是input等则不需要处理 let tagOptionKey = processType[config.tag] if (tagOptionKey) { + // eslint-disable-next-line no-debugger + // debugger if (event instanceof Array) { let labelArr = new Array() event.forEach(item => { @@ -251,7 +268,8 @@ function setValueLabel(event, config, scheme) { } else { // 多选 单选 其他自定义输入 if (event == 0) { - this.$set(this[this.formConf.labelFormModel], `${config.__vModel__}`, this[this.formConf.labelFormModel][`${config.__vModel__}other`]) + console.log(this[this.formConf.labelFormModel][`${scheme.__vModel__}other`]) + this.$set(this[this.formConf.labelFormModel], `${scheme.__vModel__}`, this[this.formConf.labelFormModel][`${scheme.__vModel__}other`]) } else { let item = _.find(_.get(scheme, tagOptionKey), {'value': event}) this.$set(this[this.formConf.labelFormModel], scheme.__vModel__, item.label) @@ -289,7 +307,7 @@ function buildListeners(scheme) { listeners.input = event => setValue.call(this, event, config, scheme) listeners.upload = (response, file, fileList) => setUpload.call(this, config, scheme, response, file, fileList) listeners.deleteUpload = (file, fileList) => deleteUpload.call(this, config, scheme, file, fileList) - listeners.selectOtherChange = (event, config) => setOtherValueLabel.call(this, event, config) + listeners.otherChange = (event, config) => setOtherValueLabel.call(this, event, config) listeners.prev = page => prevPage.call(this, page) listeners.next = page => nextPage.call(this, page) return listeners @@ -354,8 +372,6 @@ export default { }, initFormData(componentList, formData) { // 设置默认值 - // eslint-disable-next-line no-debugger - debugger componentList.forEach(cur => { const config = cur.__config__ if (cur.__vModel__ && !formData[cur.__vModel__]) { @@ -426,18 +442,18 @@ export default { } diff --git a/src/components/render/slots/el-checkbox-group.js b/src/components/render/slots/el-checkbox-group.js index 72b65be..3bb3baa 100644 --- a/src/components/render/slots/el-checkbox-group.js +++ b/src/components/render/slots/el-checkbox-group.js @@ -6,11 +6,21 @@ export default { list.push({item.label}) } else { if (item.value == 0) { - list.push({item.label} - { - that.$emit('selectOtherChange', event.target.value, conf) - }}/>) + list.push( +
+ {item.label} + + { + console.log(event) + that.$emit('otherChange', event.target.value, conf) + }} + onChange={event => { + that.$emit('otherChange', event.target.value, conf) + }}/> +
+ ) } else { list.push({item.label}) } diff --git a/src/components/render/slots/el-radio-group.js b/src/components/render/slots/el-radio-group.js index 8761e60..a79ebd4 100644 --- a/src/components/render/slots/el-radio-group.js +++ b/src/components/render/slots/el-radio-group.js @@ -6,12 +6,18 @@ export default { list.push({item.label}) } else { if (item.value == 0) { - list.push( - {item.label} { - // eslint-disable-next-line vue/custom-event-name-casing - that.$emit('selectOtherChange', event.target.value, conf) - }}/> - ) + list.push( + + {item.label} + { + console.log(event) + that.$emit('otherChange', event.target.value, conf) + }} + onChange={event => { + that.$emit('otherChange', event.target.value, conf) + }}/> + ) } else { list.push({item.label}) }