import { Button } from 'antd'; import React, { useRef } from 'react'; import { XForm } from '../packages/react/src/index'; import { ISchema } from '../packages/types/src/index'; const schema: ISchema = [ { key: 'array1', type: 'Array', ui: { label: 'Table' }, props: { type: 'Table' }, children: [ { key: 'name', type: 'Input', ui: { label: '姓名' } }, { key: 'age', type: 'InputNumber', ui: { label: '年龄' } }, { key: 'sex', type: 'Radio', ui: { label: '性别' }, options: [ { name: '男', value: 'male' }, { name: '女', value: 'female' } ] } ], rules: [ { type: 'array', required: true, defaultField: { type: 'object', fields: { name: { type: 'string', required: true }, age: { type: 'number', required: true }, sex: { type: 'string', required: true } } }, trigger: 'change' } ] }, { key: 'array2', type: 'Array', ui: { label: 'Card' }, props: { type: 'Card' }, children: [ { key: 'input111', type: 'Input', ui: { label: '姓名' } }, { key: 'input222', type: 'Input', ui: { label: '年龄' } }, { key: 'input333', type: 'Select', value: 1, ui: { label: '性别' }, options: [ { name: '男', value: 1 }, { name: '女', value: 0 } ] } ], rules: [ { type: 'array', required: true, defaultField: { type: 'object', fields: { name: { type: 'string', required: true }, age: { type: 'number', required: true }, sex: { type: 'string', required: true } } }, trigger: 'change' } ] }, { key: 'hint', type: 'Input', status: 'preview', ui: { label: '以下都是展平的嵌套对象' } }, { key: 'group1', type: 'Object', ui: { label: '嵌套' }, children: [ { key: 'input1.1', type: 'Input', value: '111', ui: { label: '姓名' } }, { key: 'group1.1', type: 'Object', ui: { label: '成绩' }, children: [ { key: 'input1.1.1', type: 'Input', value: '111', ui: { label: '体育' } }, { key: 'group1.1.1', type: 'Object', ui: { label: '主科' }, children: [ { key: 'input1.1.1.1', type: 'Input', value: '111', ui: { label: '语文' } } ] } ] }, { key: 'input1.2', type: 'Input', value: '111', ui: { label: '身高' } } ] }, { key: 'activityName', type: 'Input', ui: { label: '活动名称' }, props: { placeholder: '不能超过三十个字' } }, { key: 'ranks', type: 'Array', ui: { label: '榜单配置', required: true }, props: { type: 'Card', max: 10, min: 1 }, children: [ { key: 'liveType', type: 'Radio', value: 0, ui: { label: '榜单分区', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, options: [ { name: '全区', value: 0 }, { name: '视频', value: 1 }, { name: '音频', value: 2 } ] }, { key: 'rankMemberType', type: 'Radio', value: 1, ui: { label: '榜单类型', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, options: [ { name: '主播榜', value: 1 }, { name: '用户榜', value: 2 } ] }, { key: 'rankGiftType', type: 'Radio', value: 1, ui: { label: '统计内容', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, options: [ { name: '音符榜(统计所有礼物)', value: 1 }, { name: '道具榜(统计特定礼物)', value: 2 } ] }, { key: 'giftIntegralRatio', type: 'InputNumber', value: 1, ui: { label: '积分计算', tooltip: '1音符等于多少积分', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, props: { placeholder: '>0两位小数', min: 0.01, step: 0.01 }, listeners: [ { watch: ['rankGiftType'], condition: 'rankGiftType.value != 1', set: { status: 'hidden' } } ], rules: [ { required: true, message: '请填写积分计算' } ] }, { key: 'notScoreFreeGift', type: 'Switch', value: false, ui: { label: '免费礼物不计入积分', tooltip: '不勾选此项,免费礼物会按照比例计入积分', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, listeners: [ { watch: ['rankGiftType'], condition: 'rankGiftType.value != 1', set: { status: 'hidden' } } ] }, { key: 'specifyGifts', type: 'Array', status: 'edit', ui: { label: '积分计算', tooltip: '最多添加 10 个礼物', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, props: { type: 'Table', max: 10, min: 1 }, children: [ { key: 'giftId', type: 'InputNumber', ui: { label: '礼物Id', required: true }, props: { placeholder: '背包Id', min: 1, step: 1 }, rules: [ { required: true, message: '请填写礼物Id' } ] }, { key: 'giftName', type: 'Input', status: 'preview', ui: { label: '礼物名称' }, listeners: [ { watch: ['giftId'], set: (_valid, field, form) => { const id = form.getValue('giftId'); if (!id) { return; } field.setValue(id); } } ] }, { key: 'ratio', type: 'InputNumber', value: 1, ui: { label: '对应积分', required: true }, props: { placeholder: '>=1整数', min: 1, step: 1 }, rules: [ { required: true, message: '请填写对应积分' } ] } ], listeners: [ { watch: ['rankGiftType'], condition: 'rankGiftType.value != 2', set: { status: 'hidden' } } ], rules: [ { type: 'array', required: true, message: '请添加至少一个礼物' } ] }, { key: 'topLimit', type: 'InputNumber', value: 200, ui: { label: '榜单显示个数', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, props: { placeholder: '>=1整数', min: 1, step: 1 }, rules: [ { required: true, message: '请填写榜单显示个数' } ] }, { key: 'userIdsType', type: 'Radio', value: 0, ui: { label: '参与活动UID', required: true, labelCol: { span: 6 }, wrapperCol: { span: 18 } }, options: [ { name: '全区', value: 0 }, { name: '黑名单', value: 1 }, { name: '白名单', value: 2 } ] }, { key: 'blackUserIds', type: 'TextArea', ui: { label: '黑名单', labelCol: { span: 6 }, wrapperCol: { span: 18 } }, props: { placeholder: '请输入UID,多个UID请用英文逗号或换行分隔', autoSize: true }, listeners: [ { watch: ['userIdsType'], condition: 'userIdsType.value != 2', set: { status: 'hidden' } } ], rules: [ { required: true, message: '请填写黑名单' } ] }, { key: 'whiteUserIds', type: 'TextArea', ui: { label: '白名单', labelCol: { span: 6 }, wrapperCol: { span: 18 } }, props: { placeholder: '请输入UID,多个UID请用英文逗号或换行分隔', autoSize: true }, listeners: [ { watch: ['userIdsType'], condition: 'userIdsType.value != 3', set: { status: 'hidden' } } ], rules: [ { required: true, message: '请填写白名单' } ] } ], rules: [ { type: 'array', required: true, message: '请添加至少一个榜单' } ] } ]; export default function() { const formRef = useRef(null); const onSubmit = () => { formRef.current.submit().then((data: any) => { console.log(data); }); }; const onReset = () => { formRef.current.reset(); }; const onEmpty = () => { formRef.current.empty(); }; return ( <>
); }