292 lines
11 KiB
JavaScript
292 lines
11 KiB
JavaScript
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,
|
||
};
|
||
}
|