import * as React from 'react';
import { Button, Drawer, Form, Input, message } from 'kts-xui';
import { Modal } from 'kts-components-antd-x4';
import agent from '../Server';
const { confirm } = Modal;
/** Props接口 */
interface IProps {
    children: any;
    list: string[];
    onRefresh:()=>void;
}
/**
 * 拒绝操作面板
 */
export default function Component(props: IProps) {
    const [loading, setLoading] = React.useState(false);
    const [modal, setModal] = React.useState(false);
    const [form] = Form.useForm();
    const onClose = () => {
        setModal(false)
        form.resetFields();
    }
    const onSubmit = () => {
        form.submit();

    }
    //提交表单
    const onFinish = values => {
        if (props.list.length > 0) {
            const data = {
                ...values,
                dryRun: false,
                includeManyTaskUuid: props.list,
            }
            submitBatch(data);
        }
    }
    //批量提交
    const submitBatch = async (data) => {
        if (!loading) {
            setLoading(true)
            const res: any = await agent.post('/collector/task/batchReject', data, null);
            setLoading(false)
            if (res.err) {
                return;
            } else {
                message.success('操作成功');
                onClose();
                props.onRefresh();
            }
        }
    }
    //打开面板
    const showModal = async () => {
        setModal(true)
    }
    return (
        <div>
            <div style={{ padding: 0,width:'100%' }} onClick={showModal}>{props.children}</div>
            <Drawer
                title="拒绝完成"
                onClose={onClose}
                visible={modal}
                footer={
                    <div
                        style={{
                            textAlign: 'right',
                        }}
                    >
                        <Button style={{ marginRight: 8 }} key='1' type="primary" onClick={onSubmit}>拒绝</Button>
                        <Button key='2' onClick={onClose}>取消</Button>
                    </div>}
            >
                <Form
                    form={form}
                    layout='vertical'
                    onFinish={onFinish}
                >
                    <Form.Item
                        name='reason'
                        label='拒绝原因'
                        rules={[
                            { required: true, max: 200 }
                        ]}
                    >
                        <Input />
                    </Form.Item>
                </Form>
            </Drawer>

        </div>
    );

}