228 lines
17 KiB
Markdown
228 lines
17 KiB
Markdown
# 企业贷款申请表单按原型截图改造 设计文档
|
||
|
||
## 背景
|
||
|
||
产品提供了"授信管理 > 企业贷款申请"页面的新原型截图（页面标题"提款申请 > 授信申请单"，来自旧版"电商服务工具平台"，用户已确认这是本次要对齐的目标设计），与当前 `src/views/credit/loan-application/EnterpriseLoanForm.vue`（阶段设计，参照《缺失的后端接口.md》1.12节 `credit-apply/enterprise-loan-application` 契约实现）相比，卡片分组、字段数量与顺序均大幅不同：
|
||
|
||
- 截图结构：授信基础信息 → 法定代表人信息（含"展开 更多信息"）→ 企业信息（含"展开 更多信息"）→ 影像信息（含"他行"征信报告、下载模板项）。
|
||
- 现状结构：基础信息 → 融资条件 → 企业信息 → 特殊融资用途标识 → 法定代表人信息 → 法人配偶信息 → 紧急联系人信息 → 影像资料。
|
||
|
||
对照后端契约 `CreateEnterpriseLoanDraftBto`/`UpdateEnterpriseLoanApplicationBto`（64字段，均无 `required` 约束）核对，截图新增的"更多信息"区域约 60+ 个字段后端完全没有承接位置。经与产品确认，本次采用以下原则（与今日同批完成的 `PersonalLoanForm.vue` 改造采用的"无字段仅本地展示不提交"策略不同，此处产品明确要求严格对齐截图）：
|
||
|
||
1. **完全按截图结构重写**，现状"融资条件""特殊融资用途标识""法人配偶信息"三张卡片，以及"是否市场经营者""是否政府融资平台""贷款钱包账号"三个字段，截图均未出现，随本次改造**一并移除**（不在 UI 呈现，也不再提交，历史数据不受影响，仅本页面不可编辑）。
|
||
2. **截图有但后端无对应字段**的约 60+ 项，前端仍新建 `form.xxx` 本地字段正常渲染输入控件，**随表单一起提交**（对象里直接带上，用推测的驼峰字段名），后端如做了未知属性容错则忽略，如严格校验则可能报错——此风险已与产品确认接受，逐项登记进《缺失的后端接口.md》Part 25，待后端评估是否正式建字段。
|
||
3. 底部"手机号+获取验证码"验证交互：项目内没有任何"贷款申请场景发码"接口（唯一的 `send-sms-code` 是登录场景专用），本次**不实现**验证码发送/校验交互；"手机号"字段保留，挪到"授信基础信息"卡片内作为普通输入框，绑定已有的 `phoneNo` 字段（无验证逻辑）。
|
||
4. "展开 更多信息"交互复用项目现状模式：一个"展开/收起"链接 + `v-if` 控制字段区域显隐（`PersonalLoanForm.vue`"经营实体信息"区已有同类"链接/开关 + v-if"先例，本次两处更多信息区各自维护一个 `ref<boolean>`）。
|
||
|
||
## 一、整体卡片结构
|
||
|
||
`EnterpriseLoanForm.vue` 重写为以下卡片顺序：
|
||
|
||
1. **授信基础信息**
|
||
2. **法定代表人信息**（含"展开 更多信息"次级区域）
|
||
3. **企业信息**（含"展开 更多信息"次级区域）
|
||
4. **影像信息**
|
||
5. 提交 / 取消按钮（沿用现状右上角 `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` 写法：
|
||
|
||
```js
|
||
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 开始，内容涵盖：
|
||
|
||
1. 本次移除的"融资条件/特殊融资用途标识/法人配偶信息"三张卡片 + "是否市场经营者/是否政府融资平台/贷款钱包账号"字段：现状 Bto 已支持但页面不再提供录入入口，历史数据不受影响。
|
||
2. 完整列出上方 2.2/2.3 节全部 🆕 字段（约 60+ 项）及其推测提交字段名，说明 `CreateEnterpriseLoanDraftBto`/`UpdateEnterpriseLoanApplicationBto` 均无对应属性，前端仍随表单一起提交，若后端未做未知属性容错可能导致整单提交失败，需要后端评估。
|
||
3. "授信种类"（`creditCategory`）完整枚举选项待业务确认，当前只有截图可见的"其他综合额度"一项。
|
||
4. "证件到期日长期"哨兵日期方案（沿用已有 `CERTIFICATE_LONG_TERM_DATE` 惯例，非新缺口，仅说明本次两个新增位置的沿用情况）。
|
||
5. 影像信息"他行个人/企业征信报告"两个新上传项的 `fileType` 占位值待后端确认；"下载模板"按钮维持禁用占位现状。
|
||
6. "申请金额"单位展示由"(元)"改为"(万元)"，字段本身无单位约束，是否需要前端做换算或后端补充单位字段，待确认。
|
||
7. "企业经营地址范围"截图暗示可"+"多值录入，本次简化为单个多行文本框，非数组结构。
|
||
|
||
## 五、组件变更清单
|
||
|
||
| 文件 | 变更类型 |
|
||
|---|---|
|
||
| `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 重点确认项（已在正文标注 ⚠️，此处汇总）
|
||
|
||
1. 是否同意移除"是否市场经营者/是否政府融资平台/贷款钱包账号"三个截图未出现的现有字段（本文档新增判断，非用户此前明确确认项）。
|
||
2. "住处邮编"（`legalPersonResidenceZipCode`）对应截图原文是否读取准确。
|
||
3. "授信种类"完整枚举选项、"申请金额"单位换算规则，均需业务后续补充，当前先用最小可用值占位。
|