361 lines
14 KiB
JavaScript
361 lines
14 KiB
JavaScript
|
// src/composables/useMenuItems.js
|
|||
|
import { ref, computed, watch } from "vue";
|
|||
|
import yhkhmdIcon from "@/assets/images/yhkhmd_icon.svg";
|
|||
|
import sjsysIcon from "@/assets/images/sjsys_icon.svg"; // 手机三要素
|
|||
|
import sfzeysIcon from "@/assets/images/sfzeys_icon.svg"; // 身份证二要素
|
|||
|
import sjeysIcon from "@/assets/images/sjeys_icon.svg"; // 手机二要素
|
|||
|
import sjzwscIcon from "@/assets/images/sjzwsc_icon.svg"; // 在网时长
|
|||
|
import sjeckIcon from "@/assets/images/sjeck_icon.svg"; // 手机二次卡
|
|||
|
import sjhmfxIcon from "@/assets/images/sjhmfx_icon.svg"; // 手机号码风险
|
|||
|
import yhk4ysIcon from "@/assets/images/yhk4ys_icon.svg"; // 银行卡四要素
|
|||
|
import yhksysIcon from "@/assets/images/yhksys_icon.svg"; // 银行卡三要素
|
|||
|
import zrrscztIcon from "@/assets/images/zrrsczt_icon.svg"; // 自然人生存状态
|
|||
|
import xlhyIcon from "@/assets/images/xlhy_icon.svg"; // 学历核验
|
|||
|
import rchyIcon from "@/assets/images/rchy_icon.svg"; // 人车核验
|
|||
|
import mxclIcon from "@/assets/images/mxcl_icon.svg"; // 名下车辆
|
|||
|
import srhyIcon from "@/assets/images/srhy_icon.svg"; // 双人婚姻
|
|||
|
import grblIcon from "@/assets/images/grbl_icon.svg";
|
|||
|
import gdrqgxIcon from "@/assets/images/gdrqgx_icon.svg";
|
|||
|
|
|||
|
import sxIcon from "@/assets/images/sx_icon.svg";
|
|||
|
import xgIcon from "@/assets/images/xg_icon.svg";
|
|||
|
|
|||
|
import carClgzIcon from "@/assets/images/car_cheliangguzhi.png";
|
|||
|
import carClghIcon from "@/assets/images/car_cheliangguohu.png";
|
|||
|
import carCxxxIcon from "@/assets/images/car_chexian.png";
|
|||
|
import carCxsxIcon from "@/assets/images/car_cheliangshangxian.png";
|
|||
|
import carCjhccIcon from "@/assets/images/car_vinchache.png";
|
|||
|
import carWbxxIcon from "@/assets/images/car_weibao.png";
|
|||
|
|
|||
|
// 定义所有菜单项
|
|||
|
const allMenuItems = [
|
|||
|
{
|
|||
|
title: "个人不良",
|
|||
|
icon: grblIcon,
|
|||
|
product: "toc_PersonalBadRecord",
|
|||
|
category: "个人风险查询",
|
|||
|
description:
|
|||
|
"通过查询个人的不良记录,评估其风险等级(低、中、高风险)。帮助您识别潜在的信用和法律风险,确保合作方的合法合规。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "人企关系",
|
|||
|
icon: gdrqgxIcon,
|
|||
|
product: "toc_ShareholderBusinessRelation",
|
|||
|
category: "个人风险查询",
|
|||
|
description:
|
|||
|
"通过个人关联的企业,了解其可能涉及的风险,帮助您判断该个人的风险水平,特别是与高风险企业有联系的个人。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "限制出境查询",
|
|||
|
icon: xgIcon,
|
|||
|
product: "toc_ExitRestriction",
|
|||
|
category: "个人风险查询",
|
|||
|
description:
|
|||
|
"查询个人是否存在限制出境记录,帮助评估其信用风险和法律状态,为您提供更全面的风险评估依据。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机月消费档次",
|
|||
|
icon: sjhmfxIcon,
|
|||
|
product: "toc_MonthlyMobileConsumptionLevel",
|
|||
|
category: "手机风险查询",
|
|||
|
description:
|
|||
|
"查询手机号的月消费水平档次,分析用户消费能力和行为特征,帮助您更准确地评估客户的消费潜力和风险。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "反诈反赌风险核验",
|
|||
|
icon: sxIcon,
|
|||
|
product: "toc_FraudGamblingCheck",
|
|||
|
category: "手机风险查询",
|
|||
|
description:
|
|||
|
"对目标手机号进行反诈骗、反赌博风险评估,识别高风险号码,避免潜在的诈骗和违法风险。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机号空号检测",
|
|||
|
icon: sjeckIcon,
|
|||
|
product: "toc_MobileNumberValidation",
|
|||
|
category: "手机风险查询",
|
|||
|
description:
|
|||
|
"检测手机号码是否为空号,确认号码的真实性和有效性,提高通讯和营销效率,减少无效联系。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "银行卡归属地查询",
|
|||
|
icon: yhk4ysIcon,
|
|||
|
product: "toc_BankCardLocation",
|
|||
|
category: "银行卡查询",
|
|||
|
description:
|
|||
|
"查询银行卡的发卡行所在地区和支行信息,帮助确认银行卡的真实性和归属信息。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "银行卡姓名二要素验证",
|
|||
|
icon: yhksysIcon,
|
|||
|
product: "toc_BankCardNameElementVerification",
|
|||
|
category: "银行卡查询",
|
|||
|
description:
|
|||
|
"验证银行卡号与持卡人姓名是否匹配,为支付和金融交易提供基础的安全验证。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "银行卡身份证号二要素验证",
|
|||
|
icon: yhksysIcon,
|
|||
|
product: "toc_BankCardIDElementVerification",
|
|||
|
category: "银行卡查询",
|
|||
|
description:
|
|||
|
"验证银行卡号与持卡人身份证号是否匹配,提供更严格的身份验证,增强交易安全性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "银行卡三要素综合验证",
|
|||
|
icon: yhksysIcon,
|
|||
|
product: "toc_BankCardThreeElementsVerification",
|
|||
|
category: "银行卡查询",
|
|||
|
description:
|
|||
|
"同时验证银行卡号、姓名和身份证号三项要素的匹配情况,提供全面的银行卡身份验证服务。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "高风险特殊手机号核验",
|
|||
|
icon: sjhmfxIcon,
|
|||
|
product: "toc_MobileRiskAssessment",
|
|||
|
category: "手机风险查询",
|
|||
|
description:
|
|||
|
"识别和核验高风险特殊手机号,包括诈骗号码、虚拟号码等,降低通讯和交易风险。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机归属地查询",
|
|||
|
icon: sjsysIcon,
|
|||
|
product: "toc_MobileLocation",
|
|||
|
category: "手机风险查询",
|
|||
|
description:
|
|||
|
"查询手机号码的归属地信息,包括运营商、省份和城市,帮助了解联系人的地理位置。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "身份证归属地查询",
|
|||
|
icon: sfzeysIcon,
|
|||
|
product: "toc_IDCardLocation",
|
|||
|
category: "个人风险查询",
|
|||
|
description:
|
|||
|
"查询身份证号码的归属地信息,包括发证地区和行政区划,验证身份信息的准确性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "学历认证",
|
|||
|
icon: xlhyIcon,
|
|||
|
product: "toc_EducationVerification",
|
|||
|
category: "个人风险查询",
|
|||
|
description:
|
|||
|
"验证个人学历信息的真实性,提供教育背景核实服务,帮助您确认所提供学历证明的准确性和可靠性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机三要素",
|
|||
|
icon: sjsysIcon,
|
|||
|
product: "toc_PhoneThreeElements",
|
|||
|
category: "手机风险查询",
|
|||
|
description: "查询个人与手机号码是否匹配,确保手机号码的真实性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "银行卡黑名单",
|
|||
|
icon: yhkhmdIcon,
|
|||
|
product: "toc_BankCardBlacklist",
|
|||
|
category: "银行卡查询",
|
|||
|
description: "查询银行卡是否被列入黑名单,帮助您识别潜在的金融风险。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "身份证二要素",
|
|||
|
icon: sfzeysIcon,
|
|||
|
product: "toc_IDCardTwoElements",
|
|||
|
category: "个人风险查询",
|
|||
|
description: "验证姓名与身份证号码的匹配情况,确保身份真实性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机二要素",
|
|||
|
icon: sjeysIcon,
|
|||
|
product: "toc_PhoneTwoElements",
|
|||
|
category: "手机风险查询",
|
|||
|
description: "查询手机号码和身份证的匹配情况,用于验证身份的真实性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机在网时长",
|
|||
|
icon: sjzwscIcon,
|
|||
|
product: "toc_NetworkDuration",
|
|||
|
category: "手机风险查询",
|
|||
|
description: "查询手机号码的在网时长,帮助评估号码的稳定性与历史。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机二次卡",
|
|||
|
icon: sjeckIcon,
|
|||
|
product: "toc_PhoneSecondaryCard",
|
|||
|
category: "手机风险查询",
|
|||
|
description: "检查手机是否有二次卡,防止诈骗等风险。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "手机号码风险",
|
|||
|
icon: sjhmfxIcon,
|
|||
|
product: "toc_PhoneNumberRisk",
|
|||
|
category: "手机风险查询",
|
|||
|
description: "评估手机号码的潜在风险,包括是否与违法行为关联。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "银行卡四要素",
|
|||
|
icon: yhk4ysIcon,
|
|||
|
product: "toc_BankCardFourElements",
|
|||
|
category: "银行卡查询",
|
|||
|
description:
|
|||
|
"通过四要素核验银行卡与个人是否匹配,进一步验证银行账户的真实性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "自然人生存状态",
|
|||
|
icon: zrrscztIcon,
|
|||
|
product: "toc_NaturalLifeStatus",
|
|||
|
category: "个人风险查询",
|
|||
|
description: "查询个人的生存状态,帮助验证其是否真实存在。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "银行卡三要素",
|
|||
|
icon: yhksysIcon,
|
|||
|
product: "toc_BankCardThreeElements",
|
|||
|
category: "银行卡查询",
|
|||
|
description: "查询银行卡的三要素,验证账户信息的安全性。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "人车核验",
|
|||
|
icon: rchyIcon,
|
|||
|
product: "toc_PersonVehicleVerification",
|
|||
|
category: "车辆信息查询",
|
|||
|
description: "查询个人与车辆的关联情况,帮助识别车辆的所有权和风险。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "名下车辆",
|
|||
|
icon: mxclIcon,
|
|||
|
product: "toc_VehiclesUnderName",
|
|||
|
category: "车辆信息查询",
|
|||
|
description: "查询个人名下拥有车辆的数量,了解其车辆资产。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "车辆出险信息",
|
|||
|
icon: carCxxxIcon,
|
|||
|
product: "toc_vehicleInsuranceSummary",
|
|||
|
category: "车辆信息查询",
|
|||
|
description:
|
|||
|
"车辆出险综合信息查询功能可以帮助用户全面了解车辆的出险记录和历史,提供详尽的事故和保险信息,帮助用户做出更明智的决策。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "车辆维保记录",
|
|||
|
icon: carWbxxIcon,
|
|||
|
product: "toc_vehicleMaintenanceRecord",
|
|||
|
category: "车辆信息查询",
|
|||
|
description:
|
|||
|
"车辆维修保养记录查询功能可以帮助用户查看车辆的所有维修和保养历史,确保车辆的状态和性能得到全面了解。",
|
|||
|
},
|
|||
|
// {
|
|||
|
// title: "车辆上险信息",
|
|||
|
// icon: "sxInfoIcon",
|
|||
|
// product: "toc_vehicleInsuranceInfo",
|
|||
|
// category: "车辆信息查询",
|
|||
|
// description:
|
|||
|
// "车辆上险信息查询功能可以帮助用户了解车辆的保险情况,包括是否已投保、保险公司及保单详情,确保车辆的风险得到保障。",
|
|||
|
// },
|
|||
|
{
|
|||
|
title: "车架号查车",
|
|||
|
icon: carCjhccIcon,
|
|||
|
product: "toc_chassisNumberCheck",
|
|||
|
category: "车辆信息查询",
|
|||
|
description:
|
|||
|
"车架号查车功能帮助用户通过车辆的车架号查询车辆的详细信息,包括品牌、型号、生产年份等,有助于验证车辆的真实情况。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "车辆过户次数",
|
|||
|
icon: carClghIcon,
|
|||
|
product: "toc_vehicleTransferCount",
|
|||
|
category: "车辆信息查询",
|
|||
|
description:
|
|||
|
"车辆过户次数查询功能可以帮助用户了解车辆的过户历史,提供车辆的转手记录和所有权变更情况,帮助用户判断车辆的历史背景。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "车辆估值",
|
|||
|
icon: carClgzIcon,
|
|||
|
product: "toc_vehicleValuation",
|
|||
|
category: "车辆信息查询",
|
|||
|
description:
|
|||
|
"车辆估值功能帮助用户评估车辆的市场价值,提供基于车型、年限、车况等因素的估值报告,帮助用户做出购买或出售决策。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "双人婚姻",
|
|||
|
icon: srhyIcon,
|
|||
|
product: "toc_DualMarriage",
|
|||
|
category: "个人风险查询",
|
|||
|
description: "查询双人婚姻状况,帮助评估婚姻的法律状态和风险。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "个人失信",
|
|||
|
icon: sxIcon,
|
|||
|
product: "toc_PersonalDiscredit",
|
|||
|
category: "个人风险查询",
|
|||
|
description: "查询个人失信记录,帮助评估个人信用状况。",
|
|||
|
},
|
|||
|
{
|
|||
|
title: "个人限高",
|
|||
|
icon: xgIcon,
|
|||
|
product: "toc_PersonalConsumptionRestriction",
|
|||
|
category: "个人风险查询",
|
|||
|
description: "查询个人限高记录,帮助评估个人信用状况。",
|
|||
|
},
|
|||
|
];
|
|||
|
|
|||
|
// 定义 Composable,返回过滤后的菜单项
|
|||
|
export function useMenuItems() {
|
|||
|
const availableProducts = ref([]);
|
|||
|
const requestUrl = ref(`/product/render_list/`);
|
|||
|
const { data, error, execute, isFetching, onFetchResponse } = useApiFetch(
|
|||
|
requestUrl,
|
|||
|
{ immediate: false, refetch: true }
|
|||
|
)
|
|||
|
.get()
|
|||
|
.json();
|
|||
|
|
|||
|
onFetchResponse((response) => {
|
|||
|
if (data.value && !error.value) {
|
|||
|
if (data.value.code === 200) {
|
|||
|
availableProducts.value = data.value.data.Product.map(
|
|||
|
(product) => product.product_en
|
|||
|
);
|
|||
|
console.log("allMenuItems");
|
|||
|
}
|
|||
|
}
|
|||
|
});
|
|||
|
|
|||
|
// fetchRenderData 支持外部传入 verify 参数
|
|||
|
const fetchRenderData = async (verifyParam) => {
|
|||
|
requestUrl.value = `/product/render_list/${verifyParam}`;
|
|||
|
// execute()
|
|||
|
};
|
|||
|
|
|||
|
// 返回过滤后的菜单项
|
|||
|
const availableMenuItems = computed(() => {
|
|||
|
return allMenuItems.filter((item) =>
|
|||
|
availableProducts.value.includes(item.product)
|
|||
|
);
|
|||
|
});
|
|||
|
|
|||
|
// 返回按分类分组的菜单项
|
|||
|
const categorizedMenuItems = computed(() => {
|
|||
|
const filtered = allMenuItems.filter((item) =>
|
|||
|
availableProducts.value.includes(item.product)
|
|||
|
);
|
|||
|
|
|||
|
// 根据分类进行分组
|
|||
|
const grouped = {};
|
|||
|
filtered.forEach(item => {
|
|||
|
const category = item.category || '其他';
|
|||
|
if (!grouped[category]) {
|
|||
|
grouped[category] = [];
|
|||
|
}
|
|||
|
grouped[category].push(item);
|
|||
|
});
|
|||
|
|
|||
|
return grouped;
|
|||
|
});
|
|||
|
|
|||
|
return {
|
|||
|
fetchRenderData,
|
|||
|
availableMenuItems,
|
|||
|
categorizedMenuItems,
|
|||
|
isFetching,
|
|||
|
};
|
|||
|
}
|