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

const Send = (props) => {
    const {getFieldProps, setFieldsValue} = 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 [upload2, setUpload2] = 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)
    };
    const uploaderProps2 = {
        multiple: true,
        beforeUpload(file) {
            const newUpload = [...upload2, file];
            setUpload2(newUpload);
            return false
        }
    };
    const uploadDelete2 = uid => {
        const newData = [...upload2];
        const Index = newData.findIndex(item => item.uid === uid);
        Index > -1 && newData.splice(Index, 1);
        setUpload2(newData)
    }
    return (
        <div>
            <form>
                <List className="send-content">
                    <InputItem {...getFieldProps('s1')}>标题</InputItem>
                    <InputItem {...getFieldProps('s2')}>拟稿人</InputItem>
                    <InputItem {...getFieldProps('s3')}>拟稿电话</InputItem>
                    <InputItem {...getFieldProps('s4')}>拟稿部门</InputItem>
                    <DatePicker className="send-date-style"{...getFieldProps('endtime')}>
                        <List.Item arrow="horizontal">拟稿日期</List.Item>
                    </DatePicker>
                    <Picker data={district} cols={1} {...getFieldProps('ss1')}>
                        <List.Item arrow="horizontal">核稿人</List.Item>
                    </Picker>
                    <Picker data={district} cols={1} {...getFieldProps('ss2')}>
                        <List.Item arrow="horizontal">复核人</List.Item>
                    </Picker>
                    <Picker data={district} cols={1} {...getFieldProps('ss3')}>
                        <List.Item arrow="horizontal">紧急程度</List.Item>
                    </Picker>
                    <Picker data={district} cols={1} {...getFieldProps('ss4')}>
                        <List.Item arrow="horizontal">密级</List.Item>
                    </Picker>
                    <Picker data={district} cols={1} {...getFieldProps('ss5')}>
                        <List.Item arrow="horizontal">公开属性</List.Item>
                    </Picker>
                    <List.Item extra={
                        <Switch
                            {...getFieldProps('Switch1', {
                                initialValue: true,
                                valuePropName: 'checked',
                            })}
                            onClick={(checked) => setFieldsValue({Switch1: checked,})}
                        />
                    }>是否解读</List.Item>


                    <Picker data={district} cols={1} {...getFieldProps('ss6')}>
                        <List.Item arrow="horizontal">文种</List.Item>
                    </Picker>
                    <Picker data={district} cols={1} {...getFieldProps('ss7')}>
                        <List.Item arrow="horizontal">主送机关</List.Item>
                    </Picker>
                    <Picker data={district} cols={1} {...getFieldProps('ss8')}>
                        <List.Item arrow="horizontal">抄送机关</List.Item>
                    </Picker>


                    <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/>*/}
                    {/*附件*/}
                    <div className="am-textarea-label upload-title">附件：</div>
                    <WingBlank>
                        {upload2.length > 0 && upload2.map((item, index) => (
                            <MailA key={index} data={item} onDelete={uploadDelete2}/>
                        ))}
                    </WingBlank>
                    <Upload className="auto-upload" {...uploaderProps2}>
                        <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);
