import React from 'react';
import {  Input, Button, DatePicker, Drawer, message } from 'kts-xui';
import agent from '../../Server';
import { Form,Space } from 'kts-components-antd-x4';
const { RangePicker } = DatePicker;
interface IProps {
    onClose: () => void;
    onSuccess?: () => void;
    type: number;
}
//添加商品
const GoodsPanel = (props: IProps) => {
    const [form] = Form.useForm();
    const onFinish = async (values: any) => {
        values = values.goods.map((item: any) => {
            return {
                productName: item['productName'],
                specification: item['specification'],
                authStartTime: item['validdate'][0].format('YYYY-MM-DD'),
                authEndTime: item['validdate'][1].format('YYYY-MM-DD'),
                type: props.type
            }
        });
        const res: any = await agent.post('/verifierparty/config/default/scope/batch/save', values, this);
        if (res.err) {
            return false;
        }
        if (res.res) {
            if (res.res.failList.length > 0) {
                const tips = res.res.failList.map((item, index) => {
                    return <div key={index}>{item.productName}/{item.specification}</div>
                })
                message.warn('重复导入');
                // Modal.confirm({
                //     title: '以下商品导入失败',
                //     content: tips,
                // })
            } else {
                message.success('操作成功');
                props.onSuccess && props.onSuccess();
            }
        }
    };
    const submit = () => {
        form.submit();
    }
    const initValues = [{ productName: '', specification: '' }]
    return (
        <div>
            <Drawer
                title='创建商品'
                visible={true}
                onClose={props.onClose}
                footer={<Space>
                    <Button type="primary" onClick={submit}>添加</Button>
                    <Button onClick={props.onClose}>取消</Button>
                </Space>}
            >
                <Form form={form} layout='vertical' onFinish={onFinish} autoComplete="off">
                    <Form.List name="goods" initialValue={initValues}>
                        {(fields, { add, remove }) => (
                            <>
                                {fields.map(({ key, name, fieldKey, ...restField }) => (
                                    <div key={key}>
                                        <Form.Item
                                            {...restField}
                                            label='商品名称'
                                            name={[name, 'productName']}
                                            fieldKey={[fieldKey as any, 'productName']}
                                            rules={[{ required: true, message: '请输入必填项' }]}
                                        >
                                            <Input maxLength={80} />
                                        </Form.Item>
                                        <Form.Item
                                            {...restField}
                                            label='规格型号'
                                            name={[name, 'specification']}
                                            fieldKey={[fieldKey as any, 'specification']}
                                            rules={[{ required: true, message: '请输入必填项' }]}
                                        >
                                            <Input maxLength={20} />
                                        </Form.Item>
                                        <Form.Item
                                            {...restField}
                                            label='授权有效时间'
                                            name={[name, 'validdate']}
                                            fieldKey={[fieldKey as any, 'validdate']}
                                            rules={[{ required: true, message: '请输入必填项' }]}
                                        >
                                            <RangePicker format="YYYY-MM-DD " style={{ width: '100%' }} />
                                        </Form.Item>
                                        {/* <div style={{ textAlign: 'right' }}><a style={{ color: 'red' }} onClick={() => remove(name)} >删除</a></div> */}
                                    </div>
                                ))}
                                {/* <Form.Item>
                                    <a onClick={() => add()} ><Icon type="plus-circle" /> 添加一行商品</a>
                                </Form.Item> */}
                            </>
                        )}
                    </Form.List>
                </Form >
            </Drawer>
        </div >
    );
};
export default GoodsPanel