Commit b90d3572a9797d0c87ea27bf1a4a3f62eb3bc52c

Authored by Wit〆苗大
Committed by GitHub
1 parent 16574395

fix(AppendForm): 修复 批量添加表单配置 按钮点击事件未使用批量方法 问题; 表单排版改用baseColProps一次配置,减少重复代码 (#2504)

* fix(AppendForm): 修复 批量添加表单配置 按钮点击事件未使用批量方法 问题

* perf(AppendForm): 表单排版改用baseColProps一次配置,减少重复代码

Co-authored-by: 苗大 <caoshengmiao@hypergryph.com>
src/views/demo/form/AppendForm.vue
@@ -4,7 +4,9 @@ @@ -4,7 +4,9 @@
4 <BasicForm @register="register" @submit="handleSubmit"> 4 <BasicForm @register="register" @submit="handleSubmit">
5 <template #add="{ field }"> 5 <template #add="{ field }">
6 <Button v-if="Number(field) === 0" @click="add">+</Button> 6 <Button v-if="Number(field) === 0" @click="add">+</Button>
7 - <Button class="ml-2" v-if="Number(field) === 0" @click="add">批量添加表单配置</Button> 7 + <Button class="ml-2" v-if="Number(field) === 0" @click="batchAdd">
  8 + 批量添加表单配置
  9 + </Button>
8 <Button v-if="field > 0" @click="del(field)">-</Button> 10 <Button v-if="field > 0" @click="del(field)">-</Button>
9 </template> 11 </template>
10 </BasicForm> 12 </BasicForm>
@@ -28,32 +30,24 @@ @@ -28,32 +30,24 @@
28 field: 'field0a', 30 field: 'field0a',
29 component: 'Input', 31 component: 'Input',
30 label: '字段0', 32 label: '字段0',
31 - colProps: {  
32 - span: 8,  
33 - },  
34 required: true, 33 required: true,
35 }, 34 },
36 { 35 {
37 field: 'field0b', 36 field: 'field0b',
38 component: 'Input', 37 component: 'Input',
39 label: '字段0', 38 label: '字段0',
40 - colProps: {  
41 - span: 8,  
42 - },  
43 required: true, 39 required: true,
44 }, 40 },
45 { 41 {
46 field: '0', 42 field: '0',
47 component: 'Input', 43 component: 'Input',
48 label: ' ', 44 label: ' ',
49 - colProps: {  
50 - span: 8,  
51 - },  
52 slot: 'add', 45 slot: 'add',
53 }, 46 },
54 ], 47 ],
55 labelWidth: 100, 48 labelWidth: 100,
56 actionColOptions: { span: 24 }, 49 actionColOptions: { span: 24 },
  50 + baseColProps: { span: 8 },
57 }); 51 });
58 52
59 async function handleSubmit() { 53 async function handleSubmit() {
@@ -73,9 +67,6 @@ @@ -73,9 +67,6 @@
73 field: `field${n.value}a`, 67 field: `field${n.value}a`,
74 component: 'Input', 68 component: 'Input',
75 label: '字段' + n.value, 69 label: '字段' + n.value,
76 - colProps: {  
77 - span: 8,  
78 - },  
79 required: true, 70 required: true,
80 }, 71 },
81 '', 72 '',
@@ -85,9 +76,6 @@ @@ -85,9 +76,6 @@
85 field: `field${n.value}b`, 76 field: `field${n.value}b`,
86 component: 'Input', 77 component: 'Input',
87 label: '字段' + n.value, 78 label: '字段' + n.value,
88 - colProps: {  
89 - span: 8,  
90 - },  
91 required: true, 79 required: true,
92 }, 80 },
93 '', 81 '',
@@ -98,9 +86,6 @@ @@ -98,9 +86,6 @@
98 field: `${n.value}`, 86 field: `${n.value}`,
99 component: 'Input', 87 component: 'Input',
100 label: ' ', 88 label: ' ',
101 - colProps: {  
102 - span: 8,  
103 - },  
104 slot: 'add', 89 slot: 'add',
105 }, 90 },
106 '', 91 '',
@@ -117,27 +102,18 @@ @@ -117,27 +102,18 @@
117 field: `field${n.value}a`, 102 field: `field${n.value}a`,
118 component: 'Input', 103 component: 'Input',
119 label: '字段' + n.value, 104 label: '字段' + n.value,
120 - colProps: {  
121 - span: 8,  
122 - },  
123 required: true, 105 required: true,
124 }, 106 },
125 { 107 {
126 field: `field${n.value}b`, 108 field: `field${n.value}b`,
127 component: 'Input', 109 component: 'Input',
128 label: '字段' + n.value, 110 label: '字段' + n.value,
129 - colProps: {  
130 - span: 8,  
131 - },  
132 required: true, 111 required: true,
133 }, 112 },
134 { 113 {
135 field: `${n.value}`, 114 field: `${n.value}`,
136 component: 'Input', 115 component: 'Input',
137 label: ' ', 116 label: ' ',
138 - colProps: {  
139 - span: 8,  
140 - },  
141 slot: 'add', 117 slot: 'add',
142 }, 118 },
143 ], 119 ],