107 lines
3.1 KiB
TypeScript
107 lines
3.1 KiB
TypeScript
/* 境外企业 表单项 */
|
|
import React from 'react';
|
|
import { Form, Input, Button, Row, Col, Upload } from 'antd';
|
|
import {
|
|
MobileOutlined,
|
|
UploadOutlined
|
|
} from '@ant-design/icons';
|
|
|
|
import { validateFileSize } from '@/utils/utils';
|
|
|
|
|
|
interface ForeignFormProps {
|
|
form: any;
|
|
countdown: number;
|
|
handleGetCaptcha: () => void;
|
|
surveyQuestions?: API.SurveyQuestionResponse; // 本身就是数组类型
|
|
}
|
|
|
|
/**
|
|
* 个人注册表单
|
|
* 基本信息部分为个人
|
|
*/
|
|
const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCaptcha, surveyQuestions }) => {
|
|
|
|
return (
|
|
<>
|
|
{/* 境外企业特有的基本信息部分 */}
|
|
<div className="form-section-title">基本信息</div>
|
|
|
|
<Row gutter={24}>
|
|
<Col span={13}>
|
|
<Form.Item
|
|
name={['coscoSupplierBase', 'name']}
|
|
label="姓名"
|
|
rules={[{ required: true, message: '请输入姓名' }]}
|
|
>
|
|
<Input placeholder="请输入姓名" />
|
|
</Form.Item>
|
|
</Col>
|
|
|
|
<Col span={13}>
|
|
<Form.Item
|
|
name={['coscoSupplierBase', 'idCard']}
|
|
label="身份证号"
|
|
rules={[{ required: true, message: '请输入身份证号' }]}
|
|
>
|
|
<Input placeholder="请填写正确的身份证号" />
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={13}>
|
|
<Form.Item
|
|
name={['coscoSupplierBase', 'contactPhone']}
|
|
label="联系电话"
|
|
rules={[
|
|
{ required: true, message: '请输入联系电话' },
|
|
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的联系电话' },
|
|
]}
|
|
>
|
|
<Input
|
|
placeholder="请输入11位联系电话"
|
|
prefix={<MobileOutlined />}
|
|
/>
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={13}>
|
|
<Form.Item
|
|
name={['coscoSupplierBase', 'personBank']}
|
|
label="开户行"
|
|
rules={[{ required: true, message: '请输入开户行' }]}
|
|
>
|
|
<Input placeholder="请输入开户行" />
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={13}>
|
|
<Form.Item
|
|
name={['coscoSupplierBase', 'personAccount']}
|
|
label="银行账号"
|
|
rules={[{ required: true, message: '请输入银行账号' }]}
|
|
>
|
|
<Input placeholder="请输入银行账号" />
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={13}>
|
|
<Form.Item
|
|
name="attachments"
|
|
label="相关证照"
|
|
extra="pdf,jpg,jpeg,png类型的文件,大小不超过10MB"
|
|
rules={[{ required: true, message: '请上传相关证照' }]}
|
|
>
|
|
<Upload
|
|
name="file"
|
|
action="/api/fileConfig/files/upload"
|
|
listType="text"
|
|
maxCount={1}
|
|
beforeUpload={(file) => validateFileSize(file, 10, ['pdf', 'jpg', 'jpeg', 'png'])}
|
|
>
|
|
<Button icon={<UploadOutlined />}>上传文件</Button>
|
|
</Upload>
|
|
</Form.Item>
|
|
</Col>
|
|
</Row>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default ForeignForm;
|