Commit 5f84f995af780f21da51ca98645ff4186ab53fbf
1 parent
bb887c0d
feat(editor)
en: add text enum editor for radio, checkbox plugin zh: 为单选框、多选框增加枚举型文本编辑器
Showing
1 changed file
with
51 additions
and
0 deletions
front-end/h5/src/components/core/support/prop-multi-items-editor/text.js
0 → 100644
| 1 | +export default { | |
| 2 | + name: 'lbs-prop-text-enum-editor', | |
| 3 | + render () { | |
| 4 | + return <div> | |
| 5 | + { | |
| 6 | + this.innerItems.map((item, index) => ( | |
| 7 | + <div> | |
| 8 | + <a-input value={item.value} onChange={e => { item.value = e.target.value }}></a-input> | |
| 9 | + <a-button type="dashed" shape="circle" icon="plus" onClick={this.add} /> | |
| 10 | + <a-button type="dashed" shape="circle" icon="minus" onClick={(item, index) => this.minus(item, index)} /> | |
| 11 | + </div> | |
| 12 | + )) | |
| 13 | + } | |
| 14 | + </div> | |
| 15 | + }, | |
| 16 | + props: { | |
| 17 | + value: { | |
| 18 | + type: Array, | |
| 19 | + default: () => [{ | |
| 20 | + value: 'default', | |
| 21 | + label: 'default' | |
| 22 | + }] | |
| 23 | + } | |
| 24 | + }, | |
| 25 | + computed: { | |
| 26 | + innerItems: { | |
| 27 | + get () { | |
| 28 | + return this.value | |
| 29 | + }, | |
| 30 | + set (val) { | |
| 31 | + this.$emit('input', val) | |
| 32 | + } | |
| 33 | + } | |
| 34 | + }, | |
| 35 | + methods: { | |
| 36 | + add () { | |
| 37 | + this.$emit('change', [ | |
| 38 | + ...this.innerItems, | |
| 39 | + { | |
| 40 | + value: `选项${this.innerItems.length + 1}`, | |
| 41 | + label: `选项${this.innerItems.length + 1}-label` | |
| 42 | + } | |
| 43 | + ]) | |
| 44 | + }, | |
| 45 | + minus (item, index) { | |
| 46 | + const items = this.innerItems.slice(0) | |
| 47 | + items.splice(index, 1) | |
| 48 | + this.$emit('change', items) | |
| 49 | + } | |
| 50 | + } | |
| 51 | +} | ... | ... |