f
This commit is contained in:
291
src/composables/useInquireForm.js
Normal file
291
src/composables/useInquireForm.js
Normal file
@@ -0,0 +1,291 @@
|
||||
import { reactive, computed } from "vue";
|
||||
|
||||
/**
|
||||
* 通用查询表单字段与规则（可按 feature 扩展）
|
||||
*
|
||||
* 目标：
|
||||
* - 统一管理「这个产品需要哪些输入控件」
|
||||
* - 暴露统一的 formData / 校验规则 / 字段可见性 / 组装请求体
|
||||
*
|
||||
* 使用方式（示例，见 InquireForm.vue）：
|
||||
* const { formData, isPhoneNumberValid, isIdCardValid, isHasInput, buildRequestPayload } =
|
||||
* useInquireForm(feature);
|
||||
*/
|
||||
export function useInquireForm(featureRef) {
|
||||
// 1. 表单字段全集（后续有新字段，只在这里统一扩展）
|
||||
const formData = reactive({
|
||||
name: "",
|
||||
idCard: "",
|
||||
mobile: "",
|
||||
verificationCode: "",
|
||||
// 预留扩展字段位（婚姻、车辆、企业等）
|
||||
nameMan: "",
|
||||
idCardMan: "",
|
||||
nameWoman: "",
|
||||
idCardWoman: "",
|
||||
entName: "",
|
||||
entCode: "",
|
||||
carLicense: "",
|
||||
carType: "",
|
||||
vinCode: "",
|
||||
certificateNumber: "",
|
||||
// 车辆类扩展（仅必填项）
|
||||
userType: "1",
|
||||
returnUrl: "",
|
||||
imageUrl: "",
|
||||
vehicleLocation: "",
|
||||
firstRegistrationDate: "",
|
||||
vlphotoData: "",
|
||||
authorized: "1",
|
||||
// 核验工具
|
||||
bankCard: "",
|
||||
photoData: "",
|
||||
// 协议
|
||||
agreeToTerms: false,
|
||||
});
|
||||
|
||||
// 2. 默认输入字段（大部分个人产品共用）
|
||||
const defaultInput = ["name", "idCard", "mobile", "verificationCode"];
|
||||
|
||||
/**
|
||||
* 3. 不同产品的专用字段配置
|
||||
* key 为 feature（route 参数 / 产品英文编码）
|
||||
* value 为该产品需要的字段数组
|
||||
*
|
||||
* 先以你当前主要产品为例填入，后续有新产品直接在这里扩展即可。
|
||||
*/
|
||||
const productFieldConfig = {
|
||||
// 婚恋风险（当前与默认字段一致，单独配置方便以后扩展）
|
||||
marriage: ["name", "idCard", "mobile", "verificationCode"],
|
||||
|
||||
// 司法涉诉
|
||||
toc_PersonalLawsuit: ["name", "idCard", "mobile", "verificationCode"],
|
||||
// 人企关系加强版：仅身份证号
|
||||
toc_PersonEnterprisePro: ["idCard"],
|
||||
// 新企业司法涉诉（QYGL66SL）：仅企业名称，其他字段后端自动补齐
|
||||
toc_EnterpriseLawsuitQYGL66SL: ["entName"],
|
||||
|
||||
// 被执行人 / 限高
|
||||
// 限高被执行人 FLXG3A9B：姓名 + 身份证 + 手机号（授权由后端默认传 1，前端不展示）
|
||||
toc_LimitHighExecuted: ["name", "idCard", "mobile"],
|
||||
// 失信被执行人 QYGL2S0W：姓名 + 身份证；type 后端默认 per
|
||||
toc_DishonestExecutedPerson: ["name", "idCard"],
|
||||
|
||||
// 婚姻状况系列（占位，后续可根据实际字段调整）
|
||||
toc_PersonalMarriageStatus: [
|
||||
"name",
|
||||
"idCard",
|
||||
"mobile",
|
||||
"verificationCode",
|
||||
],
|
||||
toc_MarriageStatusRegisterTime: [
|
||||
"name",
|
||||
"idCard",
|
||||
"mobile",
|
||||
"verificationCode",
|
||||
],
|
||||
toc_MarriageStatusSupplement: [
|
||||
"name",
|
||||
"idCard",
|
||||
"mobile",
|
||||
"verificationCode",
|
||||
],
|
||||
toc_MarriageStatusVerify: [
|
||||
"name",
|
||||
"idCard",
|
||||
"mobile",
|
||||
"verificationCode",
|
||||
],
|
||||
toc_DualMarriageStatusRegisterTime: [
|
||||
"nameMan",
|
||||
"idCardMan",
|
||||
"nameWoman",
|
||||
"idCardWoman",
|
||||
"mobile",
|
||||
"verificationCode",
|
||||
],
|
||||
|
||||
// 车辆相关（占位，后续可细化）
|
||||
toc_VehiclesUnderName: ["name", "idCard", "mobile", "verificationCode"],
|
||||
// 名下车辆(车牌)：姓名 + 身份证 + 手机 + 验证码
|
||||
toc_VehiclesUnderNamePlate: [
|
||||
"name",
|
||||
"idCard",
|
||||
"mobile",
|
||||
"verificationCode",
|
||||
],
|
||||
// 人车核验简版：姓名 + 号牌类型 + 车牌号
|
||||
toc_PersonVehicleVerification: ["name", "carType", "carLicense"],
|
||||
// 人车核验详版：姓名 + 号牌类型 + 车牌号（同简版）
|
||||
toc_PersonVehicleVerificationDetail: ["name", "carType", "carLicense"],
|
||||
// 名下车辆(数量) QCXG4D2E：仅 user_type + id_card
|
||||
toc_VehiclesUnderNameCount: ["userType", "idCard"],
|
||||
// 车辆静态信息 QCXG5U0Z：仅 vin_code（车辆类不要求手机号与验证码）
|
||||
toc_VehicleStaticInfo: ["vinCode"],
|
||||
// 车辆里程混合 QCXG1U4U（仅必填：vin_code, image_url；回调地址由后端自动生成）
|
||||
toc_VehicleMileageMixed: ["vinCode", "imageUrl"],
|
||||
// 二手车VIN估值 QCXGY7F2（仅必填：vin_code, vehicle_location, first_registrationdate）
|
||||
toc_VehicleVinValuation: [
|
||||
"vinCode",
|
||||
"vehicleLocation",
|
||||
"firstRegistrationDate",
|
||||
],
|
||||
// 车辆过户简版 QCXG1H7Y（必填：vin_code + 车牌号）
|
||||
toc_VehicleTransferSimple: ["vinCode", "carLicense"],
|
||||
// 车辆过户详版 QCXG4I1Z
|
||||
toc_VehicleTransferDetail: ["vinCode"],
|
||||
// 车辆维保简版 QCXG3Y6B（仅必填：vin_code；回调地址由后端自动生成）
|
||||
toc_VehicleMaintenanceSimple: ["vinCode"],
|
||||
// 车辆维保详细版 QCXG3Z3L（仅必填：vin_code；回调地址由后端自动生成）
|
||||
toc_VehicleMaintenanceDetail: ["vinCode"],
|
||||
// 车辆出险详版 QCXGP00W（仅必填：vin_code, vlphoto_data；回调地址由后端自动生成）
|
||||
toc_VehicleClaimDetail: ["vinCode", "vlphotoData"],
|
||||
// 车辆出险记录核验 QCXG6B4E（授权由后端默认传 1，前端不展示）
|
||||
toc_VehicleClaimVerify: ["vinCode"],
|
||||
|
||||
// 核验工具（verify feature.md）
|
||||
toc_PoliceTwoFactors: ["mobile", "idCard", "name"],
|
||||
toc_PoliceThreeFactors: ["photoData", "idCard", "name"],
|
||||
toc_ProfessionalCertificate: ["idCard", "name"],
|
||||
toc_PersonalConsumptionCapacityLevel: ["mobile", "idCard", "name"], // 个人消费能力（沿用现有 product_en）
|
||||
toc_OperatorTwoFactors: ["mobile", "name"],
|
||||
toc_MobileThreeFactors: ["mobile", "idCard", "name"],
|
||||
toc_NumberRecycle: ["mobile"],
|
||||
toc_MobileEmptyCheck: ["mobile"],
|
||||
toc_MobilePortability: ["mobile"],
|
||||
toc_MobileOnlineStatus: ["mobile"],
|
||||
toc_MobileOnlineDuration: ["mobile"],
|
||||
toc_MobileAttribution: ["mobile"],
|
||||
toc_MobileConsumptionRange: ["mobile", "authorized"],
|
||||
toc_EnterpriseRelation: ["idCard"],
|
||||
toc_BankcardFourFactors: ["mobile", "idCard", "bankCard", "name"],
|
||||
toc_BankcardBlacklist: ["mobile", "idCard", "name", "bankCard"],
|
||||
};
|
||||
|
||||
// 当前 feature 名称
|
||||
const currentFeature = computed(() => featureRef?.value || featureRef);
|
||||
|
||||
/**
|
||||
* 4. 判断某个字段在当前产品下是否需要显示 / 校验 / 组包
|
||||
*/
|
||||
const isHasInput = (field) => {
|
||||
const key = currentFeature.value;
|
||||
if (key && productFieldConfig[key]) {
|
||||
return productFieldConfig[key].includes(field);
|
||||
}
|
||||
return defaultInput.includes(field);
|
||||
};
|
||||
|
||||
// 5. 通用校验规则（不直接弹 Toast，只返回布尔值，UI 再决定提示）
|
||||
const isPhoneNumberValid = computed(() => {
|
||||
if (!formData.mobile) return false;
|
||||
return /^1[3-9]\d{9}$/.test(formData.mobile);
|
||||
});
|
||||
|
||||
const isIdCardValid = computed(() => {
|
||||
if (!formData.idCard) return false;
|
||||
return /^\d{17}[\dX]$/i.test(formData.idCard);
|
||||
});
|
||||
|
||||
// 预留：其他字段校验（如车牌、车架号等）后续可加在这里
|
||||
|
||||
/**
|
||||
* 6. 根据当前产品配置组装请求体
|
||||
* 仅包含当前产品需要的字段；字段名与后端约定对齐。
|
||||
*/
|
||||
const buildRequestPayload = () => {
|
||||
const req = {};
|
||||
|
||||
if (isHasInput("name") && formData.name) {
|
||||
req.name = formData.name;
|
||||
}
|
||||
if (isHasInput("idCard") && formData.idCard) {
|
||||
req.id_card = formData.idCard;
|
||||
}
|
||||
if (isHasInput("mobile") && formData.mobile) {
|
||||
req.mobile = formData.mobile;
|
||||
}
|
||||
if (isHasInput("verificationCode") && formData.verificationCode) {
|
||||
req.code = formData.verificationCode;
|
||||
}
|
||||
|
||||
// 预留字段映射（以后启用时直接在这里补充）
|
||||
if (isHasInput("nameMan") && formData.nameMan) {
|
||||
req.name_man = formData.nameMan;
|
||||
}
|
||||
if (isHasInput("idCardMan") && formData.idCardMan) {
|
||||
req.id_card_man = formData.idCardMan;
|
||||
}
|
||||
if (isHasInput("nameWoman") && formData.nameWoman) {
|
||||
req.name_woman = formData.nameWoman;
|
||||
}
|
||||
if (isHasInput("idCardWoman") && formData.idCardWoman) {
|
||||
req.id_card_woman = formData.idCardWoman;
|
||||
}
|
||||
if (isHasInput("entName") && formData.entName) {
|
||||
req.ent_name = formData.entName;
|
||||
}
|
||||
if (isHasInput("entCode") && formData.entCode) {
|
||||
req.ent_code = formData.entCode;
|
||||
}
|
||||
if (isHasInput("carLicense") && formData.carLicense) {
|
||||
req.car_license = formData.carLicense.trim();
|
||||
}
|
||||
if (isHasInput("carType") && formData.carType) {
|
||||
req.car_type = formData.carType;
|
||||
}
|
||||
if (isHasInput("vinCode") && formData.vinCode) {
|
||||
req.vin_code = formData.vinCode.trim();
|
||||
}
|
||||
if (isHasInput("certificateNumber") && formData.certificateNumber) {
|
||||
req.certificate_number = formData.certificateNumber;
|
||||
}
|
||||
// 车辆类扩展字段（与后端 types/query.go 对齐）
|
||||
if (isHasInput("userType") && formData.userType) {
|
||||
req.user_type = formData.userType;
|
||||
}
|
||||
if (isHasInput("returnUrl") && formData.returnUrl) {
|
||||
req.return_url = formData.returnUrl.trim();
|
||||
}
|
||||
if (isHasInput("imageUrl") && formData.imageUrl) {
|
||||
req.image_url = formData.imageUrl.trim();
|
||||
}
|
||||
if (isHasInput("vehicleLocation") && formData.vehicleLocation) {
|
||||
req.vehicle_location = formData.vehicleLocation.trim();
|
||||
}
|
||||
if (
|
||||
isHasInput("firstRegistrationDate") &&
|
||||
formData.firstRegistrationDate
|
||||
) {
|
||||
req.first_registrationdate = formData.firstRegistrationDate.trim();
|
||||
}
|
||||
if (isHasInput("vlphotoData") && formData.vlphotoData) {
|
||||
req.vlphoto_data = formData.vlphotoData;
|
||||
}
|
||||
if (
|
||||
isHasInput("authorized") &&
|
||||
formData.authorized !== undefined &&
|
||||
formData.authorized !== ""
|
||||
) {
|
||||
req.authorized = String(formData.authorized);
|
||||
}
|
||||
if (isHasInput("bankCard") && formData.bankCard) {
|
||||
req.bank_card = formData.bankCard.trim();
|
||||
}
|
||||
if (isHasInput("photoData") && formData.photoData) {
|
||||
req.photo_data = formData.photoData;
|
||||
}
|
||||
|
||||
return req;
|
||||
};
|
||||
|
||||
return {
|
||||
formData,
|
||||
isPhoneNumberValid,
|
||||
isIdCardValid,
|
||||
isHasInput,
|
||||
buildRequestPayload,
|
||||
defaultInput,
|
||||
productFieldConfig,
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user