Browse Source
fix(AppendForm): 修复 批量添加表单配置 按钮点击事件未使用批量方法 问题; 表单排版改用baseColProps一次配置,减少重复代码 (#2504)
* fix(AppendForm): 修复 批量添加表单配置 按钮点击事件未使用批量方法 问题
* perf(AppendForm): 表单排版改用baseColProps一次配置,减少重复代码
Co-authored-by: 苗大 <caoshengmiao@hypergryph.com>
pull/2508/head
Wit〆苗大
4 years ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with
4 additions and
28 deletions
-
src/views/demo/form/AppendForm.vue
|
|
|
@ -4,7 +4,9 @@ |
|
|
|
<BasicForm @register="register" @submit="handleSubmit"> |
|
|
|
<template #add="{ field }"> |
|
|
|
<Button v-if="Number(field) === 0" @click="add">+</Button> |
|
|
|
<Button class="ml-2" v-if="Number(field) === 0" @click="add">批量添加表单配置</Button> |
|
|
|
<Button class="ml-2" v-if="Number(field) === 0" @click="batchAdd"> |
|
|
|
批量添加表单配置 |
|
|
|
</Button> |
|
|
|
<Button v-if="field > 0" @click="del(field)">-</Button> |
|
|
|
</template> |
|
|
|
</BasicForm> |
|
|
|
@ -28,32 +30,24 @@ |
|
|
|
field: 'field0a', |
|
|
|
component: 'Input', |
|
|
|
label: '字段0', |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
required: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
field: 'field0b', |
|
|
|
component: 'Input', |
|
|
|
label: '字段0', |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
required: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
field: '0', |
|
|
|
component: 'Input', |
|
|
|
label: ' ', |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
slot: 'add', |
|
|
|
}, |
|
|
|
], |
|
|
|
labelWidth: 100, |
|
|
|
actionColOptions: { span: 24 }, |
|
|
|
baseColProps: { span: 8 }, |
|
|
|
}); |
|
|
|
|
|
|
|
async function handleSubmit() { |
|
|
|
@ -73,9 +67,6 @@ |
|
|
|
field: `field${n.value}a`, |
|
|
|
component: 'Input', |
|
|
|
label: '字段' + n.value, |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
required: true, |
|
|
|
}, |
|
|
|
'', |
|
|
|
@ -85,9 +76,6 @@ |
|
|
|
field: `field${n.value}b`, |
|
|
|
component: 'Input', |
|
|
|
label: '字段' + n.value, |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
required: true, |
|
|
|
}, |
|
|
|
'', |
|
|
|
@ -98,9 +86,6 @@ |
|
|
|
field: `${n.value}`, |
|
|
|
component: 'Input', |
|
|
|
label: ' ', |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
slot: 'add', |
|
|
|
}, |
|
|
|
'', |
|
|
|
@ -117,27 +102,18 @@ |
|
|
|
field: `field${n.value}a`, |
|
|
|
component: 'Input', |
|
|
|
label: '字段' + n.value, |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
required: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
field: `field${n.value}b`, |
|
|
|
component: 'Input', |
|
|
|
label: '字段' + n.value, |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
required: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
field: `${n.value}`, |
|
|
|
component: 'Input', |
|
|
|
label: ' ', |
|
|
|
colProps: { |
|
|
|
span: 8, |
|
|
|
}, |
|
|
|
slot: 'add', |
|
|
|
}, |
|
|
|
], |
|
|
|
|