import { Field, Checkbox, CheckboxGroup } from 'vant' import { VisualEditorComponent } from '@/visual-editor/visual-editor.utils' import { createFieldProps } from './createFieldProps' import { useGlobalProperties } from '@/hooks/useGlobalProperties' import { createEditorInputProp, createEditorSelectProp, createEditorTableProp } from '@/visual-editor/visual-editor.props' export default { key: 'checkbox', moduleName: 'baseWidgets', label: '表单项类型 - 复选框', preview: () => ( one two ), render: ({ size, block, props }) => { const { registerRef } = useGlobalProperties() return ( ( registerRef(el, block._vid)} {...props} v-model={props.modelValue} > {props.options?.map((item) => ( {item.label} ))} ) }} /> ) }, props: { modelValue: createEditorInputProp({ label: '默认值', defaultValue: [] }), name: createEditorInputProp({ label: '名称,提交表单的标识符', defaultValue: 'checkbox' }), label: createEditorInputProp({ label: '输入框左侧文本', defaultValue: '复选框' }), options: createEditorTableProp({ label: '默认选项', option: { options: [ { label: '显示值', field: 'label' }, { label: '绑定值', field: 'value' }, { label: '备注', field: 'comments' } ], showKey: 'label' }, defaultValue: [ { label: '萝卜', value: 'radish' }, { label: '青菜', value: 'greens' } ] }), direction: createEditorSelectProp({ label: '排列方向', options: [ { label: '水平', val: 'horizontal' }, { label: '垂直', val: 'vertical' } ], defaultValue: 'horizontal' }), ...createFieldProps() }, resize: { width: true }, model: { default: '绑定字段' } } as VisualEditorComponent