注册组件修改字段

This commit is contained in:
linxd
2025-07-15 10:21:24 +08:00
parent 85fddd0501
commit 3d5255109c
3 changed files with 154 additions and 122 deletions

View File

@ -261,6 +261,14 @@ export const QualificationSection: React.FC<CommonFormSectionsProps> = ({ form }
* 包含纳税人类型、开票抬头、纳税人识别号、开票地址等
*/
export const InvoiceSection: React.FC<CommonFormSectionsProps> = ({ form }) => {
const [taxpayerTypeOptions, setTaxpayerTypeOptions] = useState<DictItem[]>([]);
useEffect(() => {
getDictList('taxpayer_type').then(res => {
if (res.code === 200) {
setTaxpayerTypeOptions(res.data);
}
});
}, []);
return (
<>
<div className="form-section-title"></div>
@ -272,10 +280,10 @@ export const InvoiceSection: React.FC<CommonFormSectionsProps> = ({ form }) => {
label="纳税人类型"
rules={[{ required: true, message: '请选择纳税人类型' }]}
>
<Select placeholder="请选择纳税人类型">
<Option value="general"></Option>
<Option value="small"></Option>
</Select>
<Select placeholder="请选择纳税人类型" options={taxpayerTypeOptions.map(item => ({
label: item.dicName,
value: item.code,
}))} />
</Form.Item>
</Col>
<Col span={8}>

View File

@ -45,13 +45,21 @@ const DomesticForm: React.FC<DomesticFormProps> = ({
surveyQuestions,
}) => {
const [contactsTypeOptions, setContactsTypeOptions] = useState<DictItem[]>([]);
// 企业类别
const [companyTypeOptions, setCompanyTypeOptions] = useState<DictItem[]>([]);
useEffect(() => {
// 从字典中 联系人身份类别contacts_type 获取数据
getDictList('contacts_type').then(res => {
getDictList('contacts_type').then((res) => {
if (res.code === 200) {
setContactsTypeOptions(res.data);
}
});
// 企业类别
getDictList('enterprise_type').then((res) => {
if (res.code === 200) {
setCompanyTypeOptions(res.data);
}
});
}, []);
return (
<>
@ -131,12 +139,13 @@ const DomesticForm: React.FC<DomesticFormProps> = ({
label="企业类别"
rules={[{ required: true, message: '请选择企业类别' }]}
>
<Select placeholder="请选择企业类别">
<Option value="limited"></Option>
<Option value="joint"></Option>
<Option value="individual"></Option>
<Option value="other"></Option>
</Select>
<Select
placeholder="请选择企业类别"
options={companyTypeOptions.map((item) => ({
label: item.dicName,
value: item.code,
}))}
/>
</Form.Item>
</Col>
{/* <Col span={8}>
@ -207,8 +216,22 @@ const DomesticForm: React.FC<DomesticFormProps> = ({
{ required: true, message: '请输入联系人手机号' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入有效的手机号' },
]}
extra="该手机号用于后续联系和找回密码"
>
<Input prefix={<MobileOutlined />} placeholder="请输入11位手机号码" />
<Input
prefix={<MobileOutlined />}
placeholder="请输入11位手机号码"
addonAfter={
<Button
type="link"
size="small"
disabled={countdown > 0}
onClick={handleGetCaptcha}
>
{countdown > 0 ? `${countdown}s` : '获取验证码'}
</Button>
}
/>
</Form.Item>
</Col>
<Col span={8}>
@ -217,21 +240,7 @@ const DomesticForm: React.FC<DomesticFormProps> = ({
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}>
@ -245,15 +254,25 @@ const DomesticForm: React.FC<DomesticFormProps> = ({
</Col> */}
<Col span={8}>
<Form.Item label="联系人证件号码" required>
<Space.Compact size='large'>
<Form.Item name="contactIdType" noStyle rules={[{ required: true, message: '请选择联系人证件类型' }]}>
<Space.Compact size="large">
<Form.Item
name="contactIdType"
noStyle
rules={[{ required: true, message: '请选择联系人证件类型' }]}
>
<Select placeholder="请选择类型">
{contactsTypeOptions.map(item => (
<Option key={item.code} value={item.code}>{item.dicName}</Option>
{contactsTypeOptions.map((item) => (
<Option key={item.code} value={item.code}>
{item.dicName}
</Option>
))}
</Select>
</Form.Item>
<Form.Item name="contactIdNumber" noStyle rules={[{ required: true, message: '请填写联系人正确的身份证号' }]}>
<Form.Item
name="contactIdNumber"
noStyle
rules={[{ required: true, message: '请填写联系人正确的身份证号' }]}
>
<Input placeholder="请填写联系人正确的身份证号" />
</Form.Item>
</Space.Compact>

View File

@ -1,11 +1,7 @@
/* 境外企业 表单项 */
import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Select, Row, Col, Cascader } from 'antd';
import {
MobileOutlined,
MailOutlined,
EnvironmentOutlined,
} from '@ant-design/icons';
import { MobileOutlined, MailOutlined, EnvironmentOutlined } from '@ant-design/icons';
/**
* 引入通用表单组件
*/
@ -18,6 +14,8 @@ import {
} from './CommonFormSections';
import { getregionInternational } from '@/servers/api/register';
import { getDictList } from '@/servers/api/dicts';
import type { DictItem } from '@/servers/api/dicts';
const { Option } = Select;
const { TextArea } = Input;
@ -34,15 +32,36 @@ interface ForeignFormProps {
* 基本信息部分为境外企业特有
* 其他部分使用通用表单组件
*/
const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCaptcha, surveyQuestions }) => {
const ForeignForm: React.FC<ForeignFormProps> = ({
form,
countdown,
handleGetCaptcha,
surveyQuestions,
}) => {
// 全球
const [regionOptions, setRegionOptions] = useState<API.RegionOption[]>([]);
// 企业类别
const [companyTypeOptions, setCompanyTypeOptions] = useState<DictItem[]>([]);
// 币种
const [currencyOptions, setCurrencyOptions] = useState<DictItem[]>([]);
useEffect(() => {
getregionInternational().then(res => {
getregionInternational().then((res) => {
if (res.code === 200) {
setRegionOptions(res.data);
}
});
// 企业类别
getDictList('enterprise_type').then((res) => {
if (res.code === 200) {
setCompanyTypeOptions(res.data);
}
});
// 币种
getDictList('currency').then((res) => {
if (res.code === 200) {
setCurrencyOptions(res.data);
}
});
}, []);
return (
@ -70,12 +89,8 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="companyRegNumber"
label="公司注册号"
rules={[{ required: true, message: '请输入公司注册号' }]}
>
<Input placeholder="请输入公司注册号" />
<Form.Item name="vat" label="税号">
<Input placeholder="请输入税号" />
</Form.Item>
</Col>
<Col span={8}>
@ -85,15 +100,13 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
rules={[{ required: true, message: '请选择国家/地区' }]}
>
<Select placeholder="请选择国家/地区">
{
regionOptions.map((item) => {
return <Option value={item.id}>{item.name}</Option>
})
}
{regionOptions.map((item) => {
return <Option value={item.id}>{item.name}</Option>;
})}
</Select>
</Form.Item>
</Col>
<Col span={8}>
{/* <Col span={8}>
<Form.Item
name="registrationPassword"
label="登录密码"
@ -127,8 +140,8 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
>
<Input.Password placeholder="请再次输入密码" />
</Form.Item>
</Col>
<Col span={8}>
</Col> */}
{/* <Col span={8}>
<Form.Item
name="registeredAddress"
label="注册地址"
@ -136,10 +149,23 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
>
<Input prefix={<EnvironmentOutlined />} placeholder="请具体注明" />
</Form.Item>
</Col> */}
<Col span={8}>
<Form.Item
name="officeAddress"
label="办公地址"
rules={[{ required: true, message: '请输入办公地址' }]}
>
<Input prefix={<EnvironmentOutlined />} placeholder="请具体注明" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item name="officeAddress" label="办公地址">
<Input prefix={<EnvironmentOutlined />} placeholder="请具体注明" />
<Form.Item
name="businessScope"
label="经营范围"
rules={[{ required: true, message: '请输入经营范围' }]}
>
<TextArea placeholder="请输入经营范围" rows={2} maxLength={200} showCount />
</Form.Item>
</Col>
<Col span={8}>
@ -148,30 +174,24 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="legalPerson"
label="企业法定代表人"
rules={[{ required: true, message: '请输入企业法定代表人' }]}
>
<Form.Item name="legalPerson" label="企业法定代表人">
<Input placeholder="请输入企业法定代表人" />
</Form.Item>
</Col>
{/*
<Col span={8}>
<Form.Item
name="companyType"
label="企业性质"
rules={[{ required: true, message: '请选择企业性质' }]}
label="企业类别"
rules={[{ required: true, message: '请选择企业类别' }]}
>
<Select placeholder="请选择企业性质">
<Option value="corporation"></Option>
<Option value="partnership"></Option>
<Option value="joint"></Option>
<Option value="sole"></Option>
<Option value="other"></Option>
</Select>
<Select placeholder="请选择企业类别" options={companyTypeOptions.map(item => ({
label: item.dicName,
value: item.code,
}))} />
</Form.Item>
</Col>
<Col span={8}>
</Col> */}
{/* <Col span={8}>
<Form.Item
name="supplierType"
label="供应商类型"
@ -184,21 +204,18 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
<Option value="other">其他</Option>
</Select>
</Form.Item>
</Col>
</Col> */}
<Col span={8}>
<Form.Item
label="注册资本"
required
>
<Form.Item label="注册资本" required>
<Input.Group compact style={{ display: 'flex' }}>
<Form.Item name="capitalCurrency" noStyle initialValue="USD">
<Select style={{ width: 100, borderRadius: '2px 0 0 2px' }}>
<Option value="USD"></Option>
<Option value="EUR"></Option>
<Option value="GBP"></Option>
<Option value="JPY"></Option>
<Option value="HKD"></Option>
</Select>
<Select
style={{ width: 100, borderRadius: '2px 0 0 2px' }}
options={currencyOptions.map((item) => ({
label: item.dicName,
value: item.code,
}))}
/>
</Form.Item>
<Form.Item
name="capitalAmount"
@ -214,16 +231,7 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
</Input.Group>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="businessScope"
label="经营范围"
rules={[{ required: true, message: '请输入经营范围' }]}
>
<TextArea placeholder="请输入经营范围" rows={2} maxLength={200} showCount />
</Form.Item>
</Col>
<Col span={8}></Col>
<Col span={8}>
<Form.Item
name="contactName"
@ -235,16 +243,17 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
</Col>
<Col span={8}>
<Form.Item
name="contactPhone"
label="联系人手机"
name="contactEmail"
label="联系人邮箱"
rules={[
{ required: true, message: '请输入联系人手机号码' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码' },
{ type: 'email', message: '请输入有效的电子邮箱' },
{ required: true, message: '请输入电子邮箱' },
]}
extra="该邮箱用于后续联系和找回密码"
>
<Input
placeholder="请输入11位手机号码"
prefix={<MobileOutlined />}
placeholder="请输入电子邮箱"
prefix={<MailOutlined />}
addonAfter={
<Button
type="link"
@ -266,12 +275,19 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
{ required: true, message: '请输入验证码' },
{ pattern: /^\d{6}$/, message: '请输入6位数字验证码' },
]}
extra="该手机号用于后续联系和找回密码"
>
<Input placeholder="请输入验证码" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="contactPhone"
label="联系人手机"
>
<Input placeholder="请输入企业联系电话" prefix={<MobileOutlined />} />
</Form.Item>
</Col>
{/* <Col span={8}>
<Form.Item
name="contactIdType"
label="联系人身份类别"
@ -291,24 +307,13 @@ const ForeignForm: React.FC<ForeignFormProps> = ({ form, countdown, handleGetCap
>
<Input placeholder="请填写联系人正确的身份证号" />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
name="contactEmail"
label="联系人邮箱"
rules={[
{ type: 'email', message: '请输入有效的电子邮箱' },
{ required: true, message: '请输入电子邮箱' },
]}
>
<Input prefix={<MailOutlined />} placeholder="XXX@XXX.com" />
</Form.Item>
</Col>
<Col span={8}>
</Col> */}
{/* <Col span={8}>
<Form.Item name="telephone" label="固定电话">
<Input placeholder="请输入企业联系电话" />
</Form.Item>
</Col>
</Col> */}
</Row>
{/* 使用通用表单组件 */}