表单构建布局型组件新增按钮

This commit is contained in:
RuoYi
2020-10-03 17:47:24 +08:00
parent 0d79f10c2f
commit 669c42795a
4 changed files with 42 additions and 0 deletions

View File

@ -406,6 +406,21 @@ export const layoutComponents = [
layoutTree: true,
children: [],
document: 'https://element.eleme.cn/#/zh-CN/component/layout'
},
{
layout: 'colFormItem',
label: '按钮',
changeTag: true,
labelWidth: null,
tag: 'el-button',
tagIcon: 'button',
span: 24,
default: '主要按钮',
type: 'primary',
icon: 'el-icon-search',
size: 'medium',
disabled: false,
document: 'https://element.eleme.cn/#/zh-CN/component/button'
}
]

View File

@ -107,6 +107,18 @@ const layouts = {
}
const tags = {
'el-button': el => {
const {
tag, disabled
} = attrBuilder(el)
const type = el.type ? `type="${el.type}"` : ''
const icon = el.icon ? `icon="${el.icon}"` : ''
const size = el.size ? `size="${el.size}"` : ''
let child = buildElButtonChild(el)
if (child) child = `\n${child}\n` // 换行
return `<${el.tag} ${type} ${icon} ${size} ${disabled}>${child}</${el.tag}>`
},
'el-input': el => {
const {
disabled, vModel, clearable, placeholder, width
@ -272,6 +284,15 @@ function attrBuilder(el) {
}
}
// el-buttin 子级
function buildElButtonChild(conf) {
const children = []
if (conf.default) {
children.push(conf.default)
}
return children.join('\n')
}
// el-input innerHTML
function buildElInputChild(conf) {
const children = []

View File

@ -26,6 +26,11 @@ function vModel(self, dataObject, defaultValue) {
}
const componentChild = {
'el-button': {
default(h, conf, key) {
return conf[key]
},
},
'el-input': {
prepend(h, conf, key) {
return <template slot="prepend">{conf[key]}</template>