import React, {useState} from 'react';
import { createForm } from 'rc-form';
import axiosRequest from "../../../utils/request";
import {DatePicker, List, TextareaItem, WhiteSpace, WingBlank, Picker} from "antd-mobile";
import MailA from '../../../components/Adjunct/MailA'
import Upload from 'rc-upload';
import './index.less'

const Send = (props) => {
    const {getFieldProps} = props.form;

    const onSubmit = () => {
        props.form.validateFields({ force: true }, (error) => {
            if (!error) {
                const values = props.form.getFieldsValue();
                console.log(values);
                axiosRequest({
                    method: 'post',
                    url: '/idtAppServiceV6/application/interfaces/addCalendar.jsp',
                    body: values,
                }).then(res => {});
            }
        });
    };

    const district = [
        {label: '111', value: '111'}
    ];


    const [upload, setUpload] = useState([]);
    const uploaderProps = {
        multiple: true,
        beforeUpload(file) {
            const newUpload = [...upload, file];
            setUpload(newUpload);
            return false
        }
    };
    const uploadDelete = uid => {
        const newData = [...upload];
        const Index = newData.findIndex(item => item.uid === uid);
        Index > -1 && newData.splice(Index, 1);
        setUpload(newData)
    };
    return (
        <div>
            <form>
                <List className="send-content">
                    <Picker data={district} cols={1} {...getFieldProps('ss1')}>
                        <List.Item arrow="horizontal">标题</List.Item>
                    </Picker>
                    <DatePicker mode="date" className="send-date-style"{...getFieldProps('endtime')}>
                        <List.Item arrow="horizontal">登记日期</List.Item>
                    </DatePicker>
                    <List.Item extra="11111">登记人</List.Item>
                    <DatePicker mode="date" className="send-date-style"{...getFieldProps('endtime2')}>
                        <List.Item arrow="horizontal">发布日期</List.Item>
                    </DatePicker>
                    <DatePicker mode="date" className="send-date-style"{...getFieldProps('endtime3')}>
                        <List.Item arrow="horizontal">有效期</List.Item>
                    </DatePicker>

                    <TextareaItem
                        title="内容"
                        placeholder="请输入内容"
                        {...getFieldProps('_mail_editor_text')}
                        rows={4}
                    />
                    {/*正文*/}
                    <div className="am-textarea-label upload-title">附件：</div>
                    <WingBlank>
                        {upload.length > 0 && upload.map((item, index) => (
                            <MailA key={index} data={item} onDelete={uploadDelete}/>
                        ))}
                    </WingBlank>
                    <Upload className="auto-upload" {...uploaderProps}>
                        <a className="auto-upload">上传附件 +</a>
                    </Upload>
                    <WhiteSpace/>
                </List>
                <div className="event-footer">
                    <div className="event-footer-button" onClick={onSubmit}>发送</div>
                </div>
            </form>
        </div>
    );
};

export default createForm()(Send);
