import { MovableModalForm } from '@/components';
import { FormInstance, ProFormDigit, ProFormSelect, ProFormText, ProFormTextArea } from '@ant-design/pro-components';
import { Col, Row } from 'antd';
import { useRef, useState } from 'react';

/** 修改缺测替补导入信息 */
const ExamAbsentReplaceImportEditModal: React.FC<{
    data: Partial<API.UploadExamAbsentReplaceOutput>;
    examGrades: API.ExamGradeOutput[];
    onFinish: (values: API.UploadExamAbsentReplaceOutput) => void;
    onClose?: () => void;
}> = ({ data, examGrades, onFinish, onClose }) => {
    const [open, setOpen] = useState<boolean>(true);
    const handleClose = () => { setOpen(false); setTimeout(() => onClose?.(), 300); };

    const formRef = useRef<FormInstance>();

    return (
        <>
            <MovableModalForm<API.UploadExamAbsentReplaceOutput>
                title="修改导入缺测替补学生信息"
                width={800}
                open={open}
                formRef={formRef}
                initialValues={{
                    ...data,
                }}
                modalProps={{
                    centered: true,
                    maskClosable: false,
                    onCancel: () => {
                        formRef?.current?.resetFields();
                        handleClose();
                    },
                }}
                onFinish={async (values) => {
                    const { examGradeId, ...restValues } = values;
                    const eg = examGrades.find(t => t.id === examGradeId);
                    onFinish({
                        ...data,
                        ...restValues,
                        examGradeId,
                        gradeId: eg?.gradeId,
                        isSuccess: true,
                        errorMessage: [],
                    });
                    handleClose();
                }}
            >
                <Row gutter={[24, 0]}>
                    <Col span={12}>
                        <ProFormSelect
                            label="年级"
                            name="examGradeId"
                            options={examGrades?.sort((a, b) => a.grade.gradeNumber - b.grade.gradeNumber)?.map(t => ({ label: `${t.grade.fullName}（${t.gradeBeginName}）`, value: t.id }))}
                            required
                            rules={[{ required: true }]}
                        />
                    </Col>
                    <Col span={12}>
                        <ProFormDigit
                            label="班级"
                            tooltip="班级最小1，最大35"
                            name="classNumber"
                            min={1}
                            max={35}
                            required
                            rules={[{ required: true }]}
                        />
                    </Col>
                    <Col span={12}>
                        <ProFormText
                            label="姓名"
                            name="name"
                            required
                            rules={[{ required: true, min: 2, max: 100 }]}
                            fieldProps={{
                                minLength: 2,
                                maxLength: 100,
                                showCount: true,
                            }}
                        />
                    </Col>
                    <Col span={12}>
                        <ProFormText
                            label="监测号"
                            name="idNumber"
                            dependencies={['certificateType']}
                            fieldProps={{
                                maxLength: 18,
                                showCount: true,
                            }}
                            required
                        />
                    </Col>
                    <Col span={12}>
                        <ProFormText
                            label="家长电话"
                            name="patriarchTel"
                            fieldProps={{
                                maxLength: 50,
                                showCount: true
                            }}
                            required
                            rules={[{ required: true, min: 8 }]}
                        />
                    </Col>
                </Row>
                <ProFormTextArea
                    label="特殊原因"
                    name="applyReason"
                    fieldProps={{
                        maxLength: 2000,
                        rows: 4,
                        showCount: true,
                    }}
                    required
                    rules={[{ required: true, min: 1 }]}
                />
                <ProFormTextArea
                    label="备注"
                    name="remark"
                    fieldProps={{
                        maxLength: 200,
                        rows: 4,
                        showCount: true,
                    }}
                />
            </MovableModalForm >
        </>
    );
};

export default ExamAbsentReplaceImportEditModal;
