/**
|
* 用“el-form-item”包裹“组件html”
|
* @param formJson 表单配置
|
* @param component 组件(oneText, multiText, select, radio...)
|
* @param componentHtml 组件html
|
* @returns {string}
|
*/
|
export function formItemWrapper(formJson, component, componentHtml) {
|
const config = component.__config__
|
|
// 标题
|
let label = `label="${config.label}"`
|
// 标题宽度
|
let labelWidth = ''
|
// 必填
|
const required = config.required ? 'required' : ''
|
|
// 如果配置了标题宽度
|
if (config.labelWidth && config.labelWidth !== formJson.labelWidth) {
|
labelWidth = `label-width="${config.labelWidth}px"`
|
}
|
|
// 如果不显示标题
|
if (config.showLabel === false) {
|
label = ''
|
labelWidth = 'label-width="0"'
|
}
|
|
// 用“el-form-item”包裹
|
return `<el-form-item ${labelWidth} ${label} prop="${component.__vModel__}" ${required}>
|
${componentHtml}
|
</el-form-item>`
|
}
|
|
/**
|
* 用“el-col”包裹“el-form-item”
|
* @param component 组件(oneText, multiText, select, radio...)
|
* @param formItemHtml formItemHtml
|
* @returns {string}
|
*/
|
export function colWrapper(component, formItemHtml) {
|
return `<el-col :span="${component.__config__.span}">
|
${formItemHtml}
|
</el-col>`
|
}
|
|
export function templateWrapper(str) {
|
return `<template>
|
<div>
|
${str}
|
</div>
|
</template>`
|
}
|
|
export function scriptWrapper(str) {
|
return `<script>
|
${str}
|
</script>`
|
}
|
|
export function styleWrapper(cssStr) {
|
return `<style>
|
${cssStr}
|
</style>`
|
}
|
|
export function dialogWrapper(formHtml) {
|
return `
|
<el-dialog v-bind="$attrs" v-on="$listeners" @open="onOpen" @close="onClose" title="Dialog Titile">
|
${formHtml}
|
<div slot="footer">
|
<el-button @click="close">取消</el-button>
|
<el-button type="primary" @click="handelConfirm">确定</el-button>
|
</div>
|
</el-dialog>`
|
}
|
|
/**
|
* 获取“vModel”属性的HTML
|
* @param formJson 表单配置
|
* @param component 组件(oneText, multiText, select, radio...)
|
* @param parent 父组件(dialog, table...)
|
* @returns {string}
|
*/
|
export function getVModelHtml(formJson, component, parent) {
|
let vModel = `v-model="${formJson.formModel}.${component.__vModel__}"`
|
|
if (component.inTable) { // 如果该组件在表格中
|
vModel = `v-model="scope.row.${component.__vModel__}"`
|
} else if (parent && parent.FComponentType === 'dialog') { // 如果该组件在弹框中
|
vModel = `v-model="${parent.FFormDataParamName}.${component.__vModel__}"`
|
}
|
|
return vModel
|
}
|