/* 境外企业 表单项 */ import React, { useEffect, useState } from 'react'; import { Form, Input, Select, Row, Col, message, Upload, Button } from 'antd'; import type { UploadProps } from 'antd'; import { UploadOutlined } from '@ant-design/icons'; import { uploadFile } from '../services'; import type { UploadFile } from 'antd/es/upload/interface'; import { getDictList } from '@/servers/api/dicts'; import type { DictItem } from '@/servers/api/dicts'; const { Option } = Select; interface ForeignFormProps { form: any; countdown: number; handleGetCaptcha: () => void; } /** * 境外企业注册表单 * 基本信息部分为境外企业特有 * 其他部分使用通用表单组件 */ const DomesticForm: React.FC = ({ form, countdown, handleGetCaptcha }) => { const [contactsType, setContactsType] = useState([]); const [enterpriseType, setEnterpriseType] = useState([]); //上传得图片 const [licenceFileList, setLicenceFileList] = useState([]); useEffect(() => { getDictList('contacts_type').then((res) => { if (res.code === 200) { setContactsType(res.data); } }); getDictList('enterprise_type').then((res) => { if (res.code === 200) { setEnterpriseType(res.data); } }); const licenceAccessory = form.getFieldValue(['coscoSupplierBase', 'licenceAccessory']); if (licenceAccessory) { setLicenceFileList([{ uid: '-1', name: '营业执照', status: 'done', url: licenceAccessory, thumbUrl: licenceAccessory, }]); } else { setLicenceFileList([]); } }, []) //上传接口 const uploadProps: UploadProps = { name: 'file', accept: 'image/*', fileList: licenceFileList, maxCount: 1, showUploadList: true, beforeUpload: (file) => { if (file.size > 1048576) { // 1MB message.error('文件大小不能超过1MB'); return Upload.LIST_IGNORE; // 阻止上传 } return true; }, customRequest: async ({ file, onSuccess, onError }) => { try { const realFile = file as File; const res = await uploadFile(realFile); const uploadedFile: UploadFile = { uid: String(res.fileSize), name: res.fileName, status: 'done', url: res.url, thumbUrl: res.url, }; setLicenceFileList([uploadedFile]); // 让表单跟随 form.setFieldsValue({ coscoSupplierBase: { ...form.getFieldValue('coscoSupplierBase'), licenceAccessoryD: [uploadedFile] } }); onSuccess?.(uploadedFile, new XMLHttpRequest()) message.success('上传成功'); } catch (err: any) { onError?.(err); message.error(err.message || '上传失败'); } }, onRemove: () => { setLicenceFileList([]); form.setFieldsValue({ coscoSupplierBase: { ...form.getFieldValue('coscoSupplierBase'), licenceAccessoryD: [] } }); return true; } }; return ( <> {/* 境外企业特有的基本信息部分 */}
基本信息
{/* */} prev.coscoSupplierBase?.contactsType !== curr.coscoSupplierBase?.contactsType } noStyle > {({ getFieldValue }) => { const contactsType = getFieldValue(['coscoSupplierBase', 'contactsType']); let label = '身份证号'; // 可自定义规则 if (contactsType === '1') { label = '身份证号'; } else if (contactsType === '0') { label = '护照号'; } else { label = ''; } if (!label) { return null; // label为空,不渲染 } return ( ); }} Array.isArray(e) ? e : e?.fileList} rules={[{ required: true, message: '请上传营业执照' }]} > {licenceFileList.length < 1 && ( )} ); }; export default DomesticForm;