17 KiB
企业贷款申请表单按原型截图改造 设计文档
背景
产品提供了"授信管理 > 企业贷款申请"页面的新原型截图(页面标题"提款申请 > 授信申请单",来自旧版"电商服务工具平台",用户已确认这是本次要对齐的目标设计),与当前 src/views/credit/loan-application/EnterpriseLoanForm.vue(阶段设计,参照《缺失的后端接口.md》1.12节 credit-apply/enterprise-loan-application 契约实现)相比,卡片分组、字段数量与顺序均大幅不同:
- 截图结构:授信基础信息 → 法定代表人信息(含"展开 更多信息")→ 企业信息(含"展开 更多信息")→ 影像信息(含"他行"征信报告、下载模板项)。
- 现状结构:基础信息 → 融资条件 → 企业信息 → 特殊融资用途标识 → 法定代表人信息 → 法人配偶信息 → 紧急联系人信息 → 影像资料。
对照后端契约 CreateEnterpriseLoanDraftBto/UpdateEnterpriseLoanApplicationBto(64字段,均无 required 约束)核对,截图新增的"更多信息"区域约 60+ 个字段后端完全没有承接位置。经与产品确认,本次采用以下原则(与今日同批完成的 PersonalLoanForm.vue 改造采用的"无字段仅本地展示不提交"策略不同,此处产品明确要求严格对齐截图):
- 完全按截图结构重写,现状"融资条件""特殊融资用途标识""法人配偶信息"三张卡片,以及"是否市场经营者""是否政府融资平台""贷款钱包账号"三个字段,截图均未出现,随本次改造一并移除(不在 UI 呈现,也不再提交,历史数据不受影响,仅本页面不可编辑)。
- 截图有但后端无对应字段的约 60+ 项,前端仍新建
form.xxx本地字段正常渲染输入控件,随表单一起提交(对象里直接带上,用推测的驼峰字段名),后端如做了未知属性容错则忽略,如严格校验则可能报错——此风险已与产品确认接受,逐项登记进《缺失的后端接口.md》Part 25,待后端评估是否正式建字段。 - 底部"手机号+获取验证码"验证交互:项目内没有任何"贷款申请场景发码"接口(唯一的
send-sms-code是登录场景专用),本次不实现验证码发送/校验交互;"手机号"字段保留,挪到"授信基础信息"卡片内作为普通输入框,绑定已有的phoneNo字段(无验证逻辑)。 - "展开 更多信息"交互复用项目现状模式:一个"展开/收起"链接 +
v-if控制字段区域显隐(PersonalLoanForm.vue"经营实体信息"区已有同类"链接/开关 + v-if"先例,本次两处更多信息区各自维护一个ref<boolean>)。
一、整体卡片结构
EnterpriseLoanForm.vue 重写为以下卡片顺序:
- 授信基础信息
- 法定代表人信息(含"展开 更多信息"次级区域)
- 企业信息(含"展开 更多信息"次级区域)
- 影像信息
- 提交 / 取消按钮(沿用现状右上角
a-page-header#extra布局,不引入个人贷款申请那套"二次确认弹窗+二维码"模式——截图本身没有该交互,维持企业贷款申请现状"提交后直接返回列表"的简单流程)
整体移除(现状已实现但截图未出现,随本次改造删除 UI 与提交逻辑):
| 移除内容 | 原字段 |
|---|---|
| "融资条件"卡片(8字段) | goodsCategory、paymentCycle、singleOrderLimit、financingRatio、estimatedReturnRate、loanTerm、orderFinancingTerm、loanPurpose(注:loanPurpose 字段被"授信品种"复用,见下,不是整个删除) |
| "特殊融资用途标识"卡片(5字段) | repayFundSource、acceptAgricultureType、industryAdjustType、industryUpgradeFlag、newIndustryType |
| "法人配偶信息"卡片(5字段) | spouseName、spousePhone、spouseGender、spouseCertType、spouseCertId |
| "紧急联系人信息"独立卡片 | 迁移进"法定代表人-更多信息"区"紧急联系人"一项,字段 emergencyContactName/emergencyContactPhone 不丢,仅位置变化 |
| 企业信息卡片内 2 个字段 | isMarketOperator(是否市场经营者)、isGovernmentPlatform(是否政府融资平台)——截图企业信息区无对应展示位,随卡片重写一并去掉 |
| 基础信息卡片内 1 个字段 | accountNo(贷款钱包账号选择下拉)——截图授信基础信息区无对应展示位,随卡片重写去掉;如后续发现贷款放款环节仍需指定钱包账号,需产品重新确认放置位置 |
以上"是否市场经营者/是否政府融资平台/贷款钱包账号"三项的移除是本设计文档新增的判断(用户此前只明确确认了融资条件/特殊融资用途标识/法人配偶信息三项),请在下方"spec 自查"通过后重点复核这一点,如需保留请在 review 阶段告知。
二、字段清单与映射
标记:✅ 复用现有后端字段(沿用 form.xxx);🆕 前端新增本地字段,一起提交(用推测字段名);⚠️ 语义映射到现有字段但命名不完全对应,已确认按此处理。
2.1 授信基础信息
| 截图字段 | 处理 | 说明 |
|---|---|---|
| 授信申请人 | ✅ customerId/customerName |
沿用 WalletCustomerPicker |
| 机构 | ✅ organizationId |
沿用 OrgTreeSelect |
| 产品 | ✅ loanProductCode |
沿用现状文本输入框,不新增选择器 |
| 授信品种 | ⚠️ loanPurpose |
语义最接近的现有字段承接 |
| 手机号码 | ✅ phoneNo |
从底部验证区挪到此卡片,普通输入框 |
| 申请金额(万元) | ✅ loanAmount |
现状 label 是"申请金额(元)",本次按截图改为"(万元)",仅改文案,不做单位换算(后端字段本身是无单位约束的字符串),登记为缺口供后端确认单位口径 |
| 申请利率(%) | ✅ applicationInterestRate |
不变 |
| 授信种类 | 🆕 creditCategory |
a-select,选项常量 CREDIT_CATEGORY_OPTIONS(新增于 creditEnums.js),目前只有截图可见的一项 {value:'OTHER_COMPREHENSIVE_LIMIT', label:'其他综合额度'},默认选中;完整选项列表待业务确认,不臆造 |
2.2 法定代表人信息
| 截图字段 | 处理 |
|---|---|
| 姓名 | ✅ legalPersonName |
| 身份证号码 | ✅ legalPersonCertId |
| 手机号码 | ✅ legalPersonMobile |
| 性别 | ✅ legalPersonGender |
| 出生日期 | ✅ legalPersonBirthday |
| 证件到期日期 + 长期 | ✅ legalPersonCertExpiry,新增 🆕 legalPersonCertExpiryLongTerm(勾选态,本地布尔,不提交,仅控制日期选择器禁用+回填哨兵日期) |
| 婚姻状况 | ✅ legalPersonMarital |
| 现居住地址 | ✅ legalPersonResidence |
| 通讯地址 | 🆕 legalPersonMailAddress(截图"更多信息"区重复出现同名字段,合并为同一个,不重复渲染两次) |
| 最高学历 | ✅ legalPersonEducation |
| 是否本地置业 | 🆕 isLocalPropertyOwner(Y/N,a-radio-group) |
| 子女是否本地就学 | 🆕 isChildLocalSchool(Y/N) |
更多信息(链接 + v-if,本地 ref legalPersonMoreVisible):
| 截图字段 | 处理 |
|---|---|
| 个人开户户名 | 🆕 legalPersonAccountType,枚举 LOCAL_CUSTOMER(本地客户)/NON_LOCAL_CUSTOMER(异地客户) |
| 是否本地户籍 | 🆕 legalPersonLocalHousehold(Y/N) |
| 个人是否有社保医保 | 🆕 legalPersonHasSocialInsurance(Y/N) |
| 民族 | ✅ legalPersonNationality |
| 经营公司名称 | 🆕 legalPersonBusinessCompanyName |
| 经营公司营业性质用途 | 🆕 legalPersonBusinessNature |
| 经营地址 | 🆕 legalPersonBusinessAddress |
| 经营邮编 | 🆕 legalPersonBusinessZipCode |
| 住处邮编 | 🆕 legalPersonResidenceZipCode(⚠️ 截图该行文字密集易读错,若实际是别的字段含义,review 时请指正) |
| 资信业务 | 🆕 legalPersonCreditBusiness |
| 电子邮箱 | ✅ legalPersonEmail |
| 通讯地址邮编 | 🆕 legalPersonMailZipCode |
| 紧急联系人 | ✅ emergencyContactName + emergencyContactPhone(从独立卡片迁移,两个输入框:姓名/电话) |
| 个人基本户开户 | 🆕 legalPersonBasicAccountOpened(Y/N) |
| 开户行别 | 🆕 legalPersonBankType |
| 个人基本户户名 | 🆕 legalPersonBasicAccountName |
| 个人基本户账号 | 🆕 legalPersonBasicAccountNo(不复用 accountNo,该字段随"贷款钱包账号"整体移除,语义也不同) |
| 股票代码 | 🆕 legalPersonStockCode |
| 备注 | 🆕 legalPersonRemark(a-textarea) |
2.3 企业信息
| 截图字段 | 处理 |
|---|---|
| 营业执照编号 | 🆕 businessLicenseNo |
| 经济类型 | ⚠️ enterpriseOrgType |
| 隶属经济产权 | 🆕 enterpriseEconomicOwnership |
| 经营场所 | ⚠️ businessScope(沿用现状"经营范围"字段,必填) |
| 证件登记经营地址 | 🆕 businessLicenseRegisteredAddress |
| 证件失效日期 + 长期 | ✅ businessLicenseExpiry,新增 🆕 businessLicenseExpiryLongTerm(同上长期哨兵处理) |
| 企业经济区域 | 🆕 enterpriseEconomicZone |
| 通讯地址 | 🆕 enterpriseMailAddress |
| 上年末从业人数 | ✅ annualEmployeeCount |
| 上年营业收入 | ✅ annualRevenue |
| 上年末资产总额 | ✅ annualTotalAssets |
| 企业类型 | ✅ enterpriseType |
| 企业代码 | 🆕 enterpriseCode |
| 提款种类标识 | 🆕 withdrawalTypeFlag |
| 是否本地股票参与经营 | 🆕 isLocalStockParticipated(Y/N) |
| 注册资本 | ✅ registeredCapital + registeredCapitalCurrency |
| 实收资本 | 🆕 paidInCapital |
| 企业所在地地址 | 🆕 enterpriseLocationAddress |
| 企业所在地邮编 | 🆕 enterpriseLocationZipCode |
更多信息(链接 + v-if,本地 ref enterpriseMoreVisible):
| 截图字段 | 处理 |
|---|---|
| 企业基本户是否本行开立 | 🆕 enterpriseBasicAccountLocalBank(Y/N) |
| 企业基本户开户行 | 🆕 enterpriseBasicAccountBank |
| 企业基本户账号 | 🆕 enterpriseBasicAccountNo |
| 首要股东(占公司比例) | 🆕 enterprisePrimaryShareholder |
| 企业办公地址 | 🆕 enterpriseOfficeAddress |
| 办公地址邮编 | 🆕 enterpriseOfficeZipCode |
| 是否有商铺 | 🆕 hasStorefront(Y/N) |
| 业绩 | 🆕 enterprisePerformance |
| 是否上市公司 | ✅ isListedCompany |
| 是否私人控股 | ✅ isPrivateControlled |
| 上市代码 | 🆕 listedStockCode |
| 企业法定代表电话 / 企业法定代表人号码 | 不重复渲染:与"法定代表人信息"卡片的手机号码(legalPersonMobile)/身份证号码(legalPersonCertId) 语义重复,截图这两行按重复字段处理,不新建控件 |
| 企业银行汇账户名 | 🆕 enterpriseRemitAccountName |
| 企业银行汇账账号 | 🆕 enterpriseRemitAccountNo |
| 企业银行汇账开户行网点 | 🆕 enterpriseRemitBankBranch |
| 企业货款账户名称 | 🆕 enterpriseLoanPaymentAccountName |
| 企业与他行建立信贷关系情况 | 🆕 enterpriseOtherBankCreditRelation |
| 财务报表编号 | 🆕 financialStatementNo |
| 企业营销所在区域 | 🆕 enterpriseMarketingRegion |
| 有无对外担保情况 | 🆕 hasExternalGuarantee(Y/N) |
| 是否属于中小企业 | 🆕 isSmeEnterprise(Y/N) |
| 是否属地生态化 | 🆕 isLocalEcological(Y/N) |
| 是否属于股权制 | 🆕 isEquitySystem(Y/N) |
| 高新技术产业标识 | 🆕 highTechIndustryFlag,枚举 OBTAINED(已获取)/APPLYING(正申请) |
| 公司代号及关系企业 | 🆕 companyCodeAndAffiliates |
| 公司e-Mail | 🆕 enterpriseEmail |
| 公司网址 | 🆕 enterpriseWebsite |
| 企业经营网址 | 🆕 enterpriseBusinessWebsite |
| 企业开户方式及运营开户 | 🆕 enterpriseAccountOpeningMethod |
| 企业主要产品或服务 | 🆕 enterpriseMainProductsServices(a-textarea) |
| 企业经营地址范围 | 🆕 enterpriseBusinessAddressScope(a-textarea;截图旁边有"+"按钮暗示多值,本次简化为单个多行文本框,不做数组结构,登记简化说明) |
| 企业股权其他情况 | 🆕 enterpriseEquityOtherType,枚举 OWNED(自有)/LEASED(租用)/OTHER(其他) |
| 企业上级公司名称 | 🆕 parentCompanyName |
| 企业上级公司所在地址 | 🆕 parentCompanyAddress |
| 企业上级公司持股比例 | 🆕 parentCompanyShareRatio |
| 备注 | 🆕 enterpriseRemark(a-textarea) |
2.4 影像信息
| 截图字段 | 处理 |
|---|---|
| 营业主照 | ✅ 沿用 LicenseUpload(businessLicenseFileNo) |
| 法人代表身份证(人像面/国徽面) | ✅ 沿用 IdCardUpload(legalPersonIdFrontFileNo/legalPersonIdBackFileNo) |
| 他行 - 个人征信报告 | 🆕 复用 LicenseUpload 新实例(upload-text="上传个人征信报告"),本地 otherBankPersonalCreditReportFileNo,fileType 占位值 'OTHER_BANK_PERSONAL_CREDIT_REPORT' |
| 他行 - 企业征信报告 | 🆕 复用 LicenseUpload 新实例,本地 otherBankEnterpriseCreditReportFileNo,fileType 占位值 'OTHER_BANK_ENTERPRISE_CREDIT_REPORT' |
| 企业营业执照 - 下载模板 | 禁用占位按钮(disabled title="模板文件待业务方提供",同 PersonalLoanForm.vue 现状写法) |
| 法定代表人 - 下载模板 | 同上,禁用占位按钮 |
四个上传项统一走 buildImageList() 拼进 loanApplicationImageBtoList;两个新增的"他行"上传项因为没有真实 fileType 枚举,fileType 用上面列出的占位字符串,登记缺口。
三、长期哨兵日期处理
复用 src/constants/customerEnums.js 的 CERTIFICATE_LONG_TERM_DATE('9999-12-31 00:00:00'),日期部分 .slice(0, 10) = '9999-12-31'。参照 EnterpriseForm.vue 的 handleLongTermChange 写法:
function handleLegalPersonCertExpiryLongTermChange(e) {
if (e.target.checked) {
legalPersonCertExpiryModel.value = undefined // 日期选择器禁用并清空展示
form.legalPersonCertExpiry = CERTIFICATE_LONG_TERM_DATE_ONLY
} else {
form.legalPersonCertExpiry = ''
}
}
businessLicenseExpiry 同理新增一份。a-date-picker :disabled="form.xxxLongTerm" + a-checkbox v-model:checked="form.xxxLongTerm" @change="handleXxxLongTermChange"。
四、《缺失的后端接口.md》新增登记(Part 25)
新增一节"Part 25:授信管理 —— 企业贷款申请表单按最新原型截图改造 —— 2026-08-10 补充",编号从 146 开始,内容涵盖:
- 本次移除的"融资条件/特殊融资用途标识/法人配偶信息"三张卡片 + "是否市场经营者/是否政府融资平台/贷款钱包账号"字段:现状 Bto 已支持但页面不再提供录入入口,历史数据不受影响。
- 完整列出上方 2.2/2.3 节全部 🆕 字段(约 60+ 项)及其推测提交字段名,说明
CreateEnterpriseLoanDraftBto/UpdateEnterpriseLoanApplicationBto均无对应属性,前端仍随表单一起提交,若后端未做未知属性容错可能导致整单提交失败,需要后端评估。 - "授信种类"(
creditCategory)完整枚举选项待业务确认,当前只有截图可见的"其他综合额度"一项。 - "证件到期日长期"哨兵日期方案(沿用已有
CERTIFICATE_LONG_TERM_DATE惯例,非新缺口,仅说明本次两个新增位置的沿用情况)。 - 影像信息"他行个人/企业征信报告"两个新上传项的
fileType占位值待后端确认;"下载模板"按钮维持禁用占位现状。 - "申请金额"单位展示由"(元)"改为"(万元)",字段本身无单位约束,是否需要前端做换算或后端补充单位字段,待确认。
- "企业经营地址范围"截图暗示可"+"多值录入,本次简化为单个多行文本框,非数组结构。
五、组件变更清单
| 文件 | 变更类型 |
|---|---|
src/views/credit/loan-application/EnterpriseLoanForm.vue |
重写 |
src/constants/creditEnums.js |
修改(新增 CREDIT_CATEGORY_OPTIONS 等本次新枚举常量) |
缺失的后端接口.md |
修改(新增 Part 25) |
复用不改动:ChannelSelect.vue、OrgTreeSelect.vue、WalletCustomerPicker.vue、IdCardUpload.vue、LicenseUpload.vue。
范围边界
- 不改动
LoanApplicationList.vue、路由映射、菜单层级。 - 不改动
PersonalLoanForm.vue(今日已完成的独立改造,风格与本次不同,互不影响)。 - 不实现底部短信验证码发送/校验交互(无接口支撑)。
- 不引入"二次确认弹窗+二维码"提交流程(截图无此交互,维持企业贷款申请现状"提交后直接返回列表")。
- 不做"企业经营地址范围"多值数组结构、不新建"授信品种/产品"选择弹窗(沿用文本输入)。
待 review 重点确认项(已在正文标注 ⚠️,此处汇总)
- 是否同意移除"是否市场经营者/是否政府融资平台/贷款钱包账号"三个截图未出现的现有字段(本文档新增判断,非用户此前明确确认项)。
- "住处邮编"(
legalPersonResidenceZipCode)对应截图原文是否读取准确。 - "授信种类"完整枚举选项、"申请金额"单位换算规则,均需业务后续补充,当前先用最小可用值占位。