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 | +} |