import { DatePicker, Form, Input, InputNumber, Select, Space } from "antd";
import React from "react";


/**
 * 模板充值活动
 * @returns 
 */
const RechargeActivityLinkDTO: React.FC<BOOKLINK.BookLinkChildProps> = ({ restField, name }) => {

    return <>
        <Form.Item
            {...restField}
            name={[name, 'rechargeActivityLinkDTO', 'activityName']}
            label={<strong>活动名称</strong>}
            rules={[{ required: true, message: '请输入活动名称!' }]}
        >
            <Input placeholder="请输入活动名称" style={{ width: '100%' }} allowClear />
        </Form.Item>

        <Form.Item
            {...restField}
            name={[name, 'rechargeActivityLinkDTO', 'activityTime']}
            label={<strong>活动时间</strong>}
            rules={[{ required: true, message: '请选择活动时间!' }]}
        >
            <DatePicker.RangePicker />
        </Form.Item>

        <Form.Item
            label={<strong>充值档位</strong>}
            required
        >
            <Space>
                <Form.Item
                    {...restField}
                    name={[name, 'rechargeActivityLinkDTO', 'rechargeAmount']}
                    rules={[{ required: true, message: '请输入充值金额（0.1~300）!' }]}
                    noStyle
                >
                    <InputNumber addonBefore="价位" suffix="元" min={0.1} max={300} placeholder="请输入" style={{ width: '100%' }} />
                </Form.Item>
                <Form.Item
                    {...restField}
                    name={[name, 'rechargeActivityLinkDTO', 'giftAmount']}
                    rules={[{ required: true, message: '请输入赠送金额!' }]}
                    noStyle
                >
                    <InputNumber addonBefore="赠送" suffix="元" placeholder="请输入" style={{ width: '100%' }} />
                </Form.Item>
            </Space>
        </Form.Item>
        <Form.Item
            {...restField}
            name={[name, 'rechargeActivityLinkDTO', 'rechargeCount']}
            label={<strong>充值次数</strong>}
            rules={[{ required: true, message: '请选择充值次数!' }]}
        >
            <Select
                showSearch
                placeholder="请选择充值次数"
                filterOption={(input, option) =>
                    ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
                }
                allowClear
                options={[{label: '不限次', value: -1}, {label: '1次', value: 1}, {label: '2次', value: 2}, {label: '3次', value: 3}]}
            />
        </Form.Item>
    </>
}

export default React.memo(RechargeActivityLinkDTO);