// 创建“el-tab-pane”
|
function createTabPaneHtml(tabs) {
|
let tabPaneHtml = ''
|
const slot = tabs.__slot__
|
if (slot && slot.tabPanes && slot.tabPanes.length) {
|
slot.tabPanes.forEach(tabPane => {
|
tabPaneHtml += `<el-tab-pane label="${tabPane.label}">${tabPane.label}</el-tab-pane>\n`
|
})
|
}
|
return tabPaneHtml
|
}
|
|
// 创建“el-tabs”
|
// <el-tabs type="border-card">
|
// <el-tab-pane label="标签1">标签1</el-tab-pane>
|
// <el-tab-pane label="标签2">标签2</el-tab-pane>
|
// </el-tabs>
|
function createTabsHtml(formJson, tabs) {
|
const width = tabs.style && tabs.style.width ? ':style="{width: \'100%\'}"' : ''
|
const type = tabs.type ? `type="${tabs.type}"` : ''
|
|
// 创建“el-tab-pane”
|
const tabPaneHtml = createTabPaneHtml(tabs)
|
|
return `<el-tabs ${type} ${width}>${tabPaneHtml}</el-tabs>`
|
}
|
|
/**
|
* 获取“标签页”HTML
|
* @param formJson 表单结构
|
* @param tabs “标签页”组件
|
* @returns {string} “标签页”HTML
|
*/
|
export default function getTabsHtml(formJson, tabs) {
|
// 创建“el-tabs”
|
const tabsHtml = createTabsHtml(formJson, tabs)
|
|
return tabsHtml
|
}
|
