liuc/fe_supplier_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
linxd
2025-06-17 14:20:06 +08:00
commit 08424ecdb8
112 changed files with 26341 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

281
src/pages/register/supplier/DomesticForm.tsx Normal file
View File

@ -0,0 +1,281 @@
/* 境内企业/机构 表单项 */
import React from 'react';
import { Form, Input, Button, Select, Upload, DatePicker, Row, Col, message } from 'antd';
import {
MobileOutlined,
MailOutlined,
EnvironmentOutlined,
UploadOutlined,
} from '@ant-design/icons';
/**
* 引入通用表单组件
*/
import {
QualificationSection,
InvoiceSection,
BankAccountSection,
SurveySection,
AttachmentSection,
} from './CommonFormSections';
import { validateFileSize } from '@/utils/utils';
const { Option } = Select;
const { TextArea } = Input;
// 移除不再需要的addressOptions
interface DomesticFormProps {
form: any;
countdown: number;
handleGetCaptcha: () => void;
surveyQuestions?: API.SurveyQuestionResponse; // 本身就是数组类型
}
/**
* 境内企业注册表单
* 基本信息部分为境内企业特有
* 其他部分使用通用表单组件
*/
const DomesticForm: React.FC<DomesticFormProps> = ({
form,
countdown,
handleGetCaptcha,
surveyQuestions,
}) => {
return (
<>
<div className="form-section-title">基本信息</div>
{/* 营业执照附件和有效期 */}
<Row gutter={24}>
<Col span={8}>
<Form.Item
name={['coscoSupplierBase', 'licenceAccessory']}
label="营业执照附件"
extra="pdf,jpg,jpeg,png类型的文件,大小不超过10MB"
rules={[{ required: true, message: '请上传营业执照附件' }]}
>
<Upload
name="businessLicense"
action="/api/upload"
listType="text"
maxCount={1}
beforeUpload={(file) => validateFileSize(file, 10, ['pdf', 'jpg', 'jpeg', 'png'])}
>
<Button icon={<UploadOutlined />}>上传文件</Button>
</Upload>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name={['coscoSupplierBase', 'licenceDate']}
label="营业执照有效期"
rules={[{ required: false, message: '请选择营业执照有效期' }]}
>
<DatePicker
placeholder="请选择日期"
style={{ width: '100%' }}
format="YYYY-MM-DD"
/>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name={['coscoSupplierBase', 'name']}
label="企业名称"
rules={[{ required: true, message: '请输入企业名称' }]}
>
<Input placeholder="请输入企业名称" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="socialCreditCode"
label="统一社会信用代码"
rules={[
{ required: true, message: '请输入统一社会信用代码' },
{ pattern: /^[0-9A-HJ-NPQRTUWXY]{18}$/, message: '请输入正确的统一社会信用代码' },
]}
>
<Input placeholder="请输入正确的统一社会信用代码" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="legalPerson"
label="企业法定代表人"
rules={[{ required: true, message: '请输入企业法定代表人/负责人' }]}
>
<Input placeholder="张三" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="registeredCapital"
label="注册资本"
rules={[{ required: true, message: '请输入注册资本' }]}
>
<Input
type="number"
placeholder="请输入金额"
addonBefore="人民币"
addonAfter="万元"
/>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="companyType"
label="企业性质"
rules={[{ required: true, message: '请选择企业性质' }]}
>
<Select placeholder="请选择企业性质">
<Option value="limited">有限责任公司</Option>
<Option value="joint">股份有限公司</Option>
<Option value="individual">个体工商户</Option>
<Option value="other">其他</Option>
</Select>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="supplierType"
label="供应商类型"
rules={[{ required: true, message: '请选择供应商类型' }]}
>
<Select placeholder="请选择类型">
<Option value="manufacturer">制造商</Option>
<Option value="agent">代理商</Option>
<Option value="service">服务商</Option>
<Option value="other">其他</Option>
</Select>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item name="parentCompanyInfo" label="母公司/出资人">
<Input placeholder="请输入母公司或出资人信息" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="registeredAddress"
label="注册地址"
rules={[{ required: true, message: '请输入注册地址' }]}
>
<Input prefix={<EnvironmentOutlined />} placeholder="上海市普陀区XX路1888号" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item name="officeAddress" label="办公地址">
<Input
prefix={<EnvironmentOutlined />}
placeholder="请具体注明省、市、区、路、门牌号"
/>
</Form.Item>
</Col>
<Col span={24}>
<Form.Item
name="businessScope"
label="经营范围"
rules={[{ required: true, message: '请输入经营范围' }]}
labelCol={{ span: 2 }}
wrapperCol={{ span: 22 }}
>
<TextArea
placeholder="金融专用产品、广告传媒"
rows={2}
maxLength={200}
showCount
style={{ resize: 'none' }}
/>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="contactPerson"
label="联系人姓名"
rules={[{ required: true, message: '请输入联系人姓名' }]}
>
<Input placeholder="请输入联系人姓名" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="contactPhone"
label="联系人手机"
rules={[
{ required: true, message: '请输入联系人手机号' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入有效的手机号' },
]}
>
<Input prefix={<MobileOutlined />} placeholder="请输入11位手机号码" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="captcha"
label="验证码"
rules={[{ required: true, message: '请输入验证码' }]}
>
<Row gutter={8}>
<Col span={14}>
<Input placeholder="请输入短信验证码" />
</Col>
<Col span={10}>
<Button
type="primary"
style={{ marginTop: 0 }}
disabled={countdown > 0}
onClick={handleGetCaptcha}
>
{countdown > 0 ? `${countdown}s` : '获取验证码'}
</Button>
</Col>
</Row>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item name="contactIdType" label="联系人身份类别">
<Select placeholder="请选择类型">
<Option value="idcard">居民身份证</Option>
<Option value="passport">护照</Option>
<Option value="other">其他证件</Option>
</Select>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item name="contactIdNumber" label="联系人证件号码">
<Input placeholder="请填写联系人正确的身份证号" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="contactEmail"
label="联系人邮箱"
rules={[
{ type: 'email', message: '请输入有效的电子邮箱' },
{ required: true, message: '请输入电子邮箱' },
]}
>
<Input prefix={<MailOutlined />} placeholder="请输入企业联系电话" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item name="telephone" label="固定电话">
<Input placeholder="XXX@XXX.com" />
</Form.Item>
</Col>
</Row>
{/* 使用通用表单组件 */}
<QualificationSection form={form} />
<InvoiceSection form={form} />
<BankAccountSection form={form} />
<SurveySection form={form} surveyQuestions={surveyQuestions} />
<AttachmentSection form={form} />
</>
);
};
export default DomesticForm;